.elementor-1459 .elementor-element.elementor-element-68378a23{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0vw;--margin-bottom:3vw;--margin-left:0vw;--margin-right:0vw;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:1;}.elementor-1459 .elementor-element.elementor-element-68378a23.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1459 .elementor-element.elementor-element-327dc1ce{--display:flex;}.elementor-1459 .elementor-element.elementor-element-327dc1ce.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-1459 .elementor-element.elementor-element-5d133f3c{width:var( --container-widget-width, 107.312% );max-width:107.312%;--container-widget-width:107.312%;--container-widget-flex-grow:0;text-align:center;}.elementor-1459 .elementor-element.elementor-element-5d133f3c > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1459 .elementor-element.elementor-element-5d133f3c.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-1459 .elementor-element.elementor-element-5d133f3c img{width:70%;max-width:100%;}.elementor-1459 .elementor-element.elementor-element-9fcb8f0{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-1459 .elementor-element.elementor-element-bbb0b96{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1459 .elementor-element.elementor-element-1f4ae250{margin-top:0px;margin-bottom:0px;}.elementor-1459 .elementor-element.elementor-element-13f411f7{width:var( --container-widget-width, 100.031% );max-width:100.031%;--container-widget-width:100.031%;--container-widget-flex-grow:0;text-align:center;}.elementor-1459 .elementor-element.elementor-element-13f411f7 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1459 .elementor-element.elementor-element-13f411f7.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:0;}.elementor-1459 .elementor-element.elementor-element-13f411f7 img{width:70%;max-width:100%;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-1459 .elementor-element.elementor-element-353d50d5{text-align:center;color:var( --e-global-color-906cd49 );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1459 .elementor-element.elementor-element-4cd94df8{text-align:center;}.elementor-1459 .elementor-element.elementor-element-4cd94df8 .elementor-heading-title{font-family:"Nunito", Sans-serif;font-size:16px;font-weight:400;line-height:20px;color:rgba(255, 255, 255, 0.7607843137254902);}.elementor-1459 .elementor-element.elementor-element-0041761{--display:flex;}@media(max-width:1024px){.elementor-1459 .elementor-element.elementor-element-5d133f3c{width:var( --container-widget-width, 199px );max-width:199px;--container-widget-width:199px;--container-widget-flex-grow:0;}.elementor-1459 .elementor-element.elementor-element-5d133f3c > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1459 .elementor-element.elementor-element-5d133f3c.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-1459 .elementor-element.elementor-element-5d133f3c img{width:70%;max-width:100%;}.elementor-1459 .elementor-element.elementor-element-13f411f7{width:var( --container-widget-width, 199px );max-width:199px;--container-widget-width:199px;--container-widget-flex-grow:0;}.elementor-1459 .elementor-element.elementor-element-13f411f7 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1459 .elementor-element.elementor-element-13f411f7.elementor-element{--flex-grow:1;--flex-shrink:0;}.elementor-1459 .elementor-element.elementor-element-13f411f7 img{width:70%;max-width:100%;}}@media(max-width:767px){.elementor-1459 .elementor-element.elementor-element-68378a23{--width:350.667px;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0vw;--margin-bottom:3vw;--margin-left:0vw;--margin-right:0vw;}.elementor-1459 .elementor-element.elementor-element-68378a23.e-con{--align-self:center;--flex-grow:1;--flex-shrink:0;}.elementor-1459 .elementor-element.elementor-element-5d133f3c > .elementor-widget-container{margin:-29px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1459 .elementor-element.elementor-element-5d133f3c{--container-widget-width:150%;--container-widget-flex-grow:0;width:var( --container-widget-width, 150% );max-width:150%;}.elementor-1459 .elementor-element.elementor-element-5d133f3c img{width:60%;}.elementor-1459 .elementor-element.elementor-element-9fcb8f0{--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-1459 .elementor-element.elementor-element-13f411f7 > .elementor-widget-container{margin:-29px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1459 .elementor-element.elementor-element-13f411f7{--container-widget-width:150%;--container-widget-flex-grow:0;width:var( --container-widget-width, 150% );max-width:150%;}.elementor-1459 .elementor-element.elementor-element-13f411f7 img{width:60%;}.elementor-1459 .elementor-element.elementor-element-4cd94df8{text-align:left;}}@media(min-width:768px){.elementor-1459 .elementor-element.elementor-element-68378a23{--width:74.232%;}.elementor-1459 .elementor-element.elementor-element-327dc1ce{--width:24.703%;}.elementor-1459 .elementor-element.elementor-element-9fcb8f0{--width:74.059%;}}@media(max-width:1024px) and (min-width:768px){.elementor-1459 .elementor-element.elementor-element-327dc1ce{--width:208.917px;}.elementor-1459 .elementor-element.elementor-element-62d8dd8b{width:50%;}.elementor-1459 .elementor-element.elementor-element-3984287d{width:50%;}.elementor-1459 .elementor-element.elementor-element-726dacd8{width:50%;}}/* Start custom CSS for html, class: .elementor-element-2fb3695a *//* Animate custom angle property */
@property --angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

/* Base button style with persistent glow */
.neon-menu a {
  position: relative;
  display: inline-block;
  padding: 0.5rem 1.25rem;
  color: #FFFFFF;
  background: #0F0F1A;
  border: 1px solid transparent;
  border-radius: 0.375rem;
  border-image: conic-gradient(from var(--angle), transparent, #00FFDD) 1;
  animation: spinBorder 3s linear infinite;
  
  /* 1px subtle glow at rest */
  box-shadow:
    0 0 4px #00FFDD,    /* inner soft glow */
    0 0 8px #00FFDD;    /* outer gentle glow */
  transition: box-shadow 0.3s ease;
  z-index: 0;
}

/* Spin keyframes */
@keyframes spinBorder {
  to { --angle: 360deg; }
}

/* Hover state: intensified glow */
.neon-menu a:hover {
  box-shadow:
    0 0 8px #00FFDD,    /* inner medium glow */
    0 0 16px #00FFDD,   /* outer strong glow */
    0 0 24px #00FFDD;   /* extra outer glow */
}

/* Layout and responsiveness */
.neon-menu {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  list-style: none;
}
@media (max-width: 768px) {
  .neon-menu { gap: 0.5rem; }
  .neon-menu a { padding: 0.5rem 1rem; font-size: 0.9rem; }
}
@media (max-width: 480px) {
  .neon-menu { flex-direction: column; align-items: stretch; }
  .neon-menu a { text-align: center; width: 100%; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c8e6a1d */<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>About TechPara</title>
  <style>
    /* Container setup */
    .about-techpara {
      position: relative;
      padding: 2rem;
      background: rgba(0, 0, 0, 0.7);
      overflow: hidden;
      color: #ffffff;
      border-radius: 10px;
    }

    /* Background video as faded watermark, scaled down, cropped 10% from bottom */
    .about-techpara video.background-video {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 60%;          /* reduced size */
      height: auto;        /* maintain aspect ratio */
      transform: translate(-50%, -50%);
      object-fit: contain;  /* no cropping beyond clip-path */
      clip-path: inset(0 0 10% 0); /* crop 10% off the bottom */
      opacity: 0.8;
      pointer-events: none;
      z-index: 0;
    }

    /* Content positioning above video */
    .about-techpara > * {
      position: relative;
      z-index: 1;
    }

    /* Headings */
    .about-techpara h2,
    .about-techpara h3 {
      color: #00ffdd;
      font-weight: 700;
      text-shadow: 0 0 8px #00ffdd88;
      transition: text-shadow 0.3s ease, transform 0.3s ease;
      margin-top: 2rem;
    }

    /* Glow effect on hover */
    .about-techpara h2:hover,
    .about-techpara h3:hover {
      text-shadow:
        0 0 12px #00ffdd,
        0 0 20px #00ffdd;
      transform: translateY(-2px);
    }

    /* Paragraph text */
    .about-techpara p,
    .about-techpara li {
      color: #ffffff;
      font-size: 1rem;
      line-height: 1.7;
      margin-bottom: 1rem;
    }

    /* Lists */
    .about-techpara ul {
      padding-left: 1.5rem;
    }

    .about-techpara li strong {
      color: #00ffdd;
    }
  </style>
</head>
<body>
  <section class="about-techpara">
    <!-- Background video watermark -->
    <video class="background-video" autoplay muted loop>
      <source src="background.mp4" type="video/mp4">
      <!-- Fallback image if video unsupported -->
      Your browser does not support the video tag.
    </video>

    <!-- Actual content -->
    <h2>About TechPara</h2>
    <p>TechPara is a full-service digital agency based in India, dedicated to empowering businesses with cutting-edge e-commerce and web solutions.</p>

    <h2>Our Mission</h2>
    <p>To partner with businesses in their digital journey by crafting intuitive, scalable, high-performance web solutions.</p>

    <h2>Our Vision</h2>
    <p>To become the world’s most trusted e-commerce and web development partner.</p>

    <h2>What We Do</h2>
    <ul>
      <li><strong>E-Commerce Development:</strong> Turnkey Shopify and custom WooCommerce/Magento stores.</li>
      <li><strong>Web Design & Development:</strong> Responsive, SEO-friendly sites on modern frameworks.</li>
      <li><strong>Digital Marketing & SEO:</strong> Data-driven content, social, and PPC campaigns.</li>
      <li><strong>Maintenance & Support:</strong> 24/7 performance optimization and security monitoring.</li>
    </ul>

    <h2>Our Values</h2>
    <ul>
      <li><strong>Client-First Mindset:</strong> Tailored solutions from deep listening.</li>
      <li><strong>Transparency & Integrity:</strong> Clear communication and honest reporting.</li>
      <li><strong>Innovation & Quality:</strong> Cutting-edge tech and best practices.</li>
      <li><strong>Collaboration & Trust:</strong> Long-term partnerships for mutual success.</li>
    </ul>

    <h2>Our Process</h2>
    <ol>
      <li><strong>Discovery & Strategy:</strong> In-depth research to align goals.</li>
      <li><strong>Design & Prototype:</strong> Wireframes and mockups for impactful UX.</li>
      <li><strong>Development & Testing:</strong> Agile sprints with rigorous QA.</li>
      <li><strong>Launch & Optimization:</strong> Seamless deployment and continuous iteration.</li>
    </ol>

    <h2>Meet the Team</h2>
    <p>A diverse group of developers, designers, marketers, and strategists—all passionate about digital innovation.</p>

    <h2>Why Choose TechPara?</h2>
    <ul>
      <li><strong>Proven Track Record:</strong> Satisfied clients across multiple industries.</li>
      <li><strong>End-to-End Expertise:</strong> From landing pages to full digital overhauls.</li>
      <li><strong>Scalable Solutions:</strong> Architectures that grow with your business.</li>
      <li><strong>Dedicated Support:</strong> Fast, responsive SLAs to keep you running.</li>
    </ul>
  </section>
</body>
</html>/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-1f4ae250 *//* ——————————————————————————————— */
/* 1. Video Icon (unchanged) */
.site-footer .video-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.site-footer .video-icon img:hover {
  transform: scale(1.05);
  box-shadow:
    0 0 10px rgba(0,255,221,0.6),
    0 0 20px rgba(0,255,221,0.4);
}

/* ——————————————————————————————— */
/* 2. Glass‑Crystal Footer (unchanged) */
.site-footer {
  background: rgba(15,15,26,0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid rgba(255,255,255,0.15);
  padding: 2rem 1rem;
  position: relative;
  z-index: 10;
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 12px 12px 0 0;
  box-shadow:
    inset 0 0 30px rgba(0,255,221,0.2),
    inset 0 0 60px rgba(0,255,221,0.1);
}

/* ——————————————————————————————— */
/* 3. Footer Headings */
.site-footer h4,
.site-footer .footer-widget-title {
  color: #00FFDD;
  text-shadow: 0 0 4px rgba(0,255,221,0.7);
  margin-bottom: 1rem;
}

/* ——————————————————————————————— */
/* 4. Link Reset & Neon Underline */
.site-footer a {
  color: #FFFFFF;                  /* keep links white by default */
  text-decoration: none;           /* remove default underline */
  position: relative;              /* for pseudo-element */
  transition: color 0.3s ease;
}
.site-footer a:hover {
  color: #00FFDD;                  /* neon-cyan on hover */
}

/* Underline pseudo-element */
.site-footer a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 0;
  height: 2px;
  background: #00FFDD;
  transition: width 0.3s ease;
}
.site-footer a:hover::after {
  width: 100%;
}

/* ——————————————————————————————— */
/* 5. Responsive Tweak */
@media (max-width: 768px) {
  .site-footer {
    padding: 2rem 1rem;
  }
}/* End custom CSS */