/*
Theme Name: Kejriwal Castings
Theme URI: https://kejriwalcastings.com
Author: Samudra Munian
Author URI: https://kejriwalcastings.com
Description: A fully dynamic custom WordPress theme for Kejriwal Castings Limited, converted from the original static site design. Homepage hero slider, stats, solution cards, and all key contact/office details are editable from the WordPress admin.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kejriwal-castings
*/

    :root{
      --primary:#05ACEA;
      --primary-dark:#EB1A25;
      --teal:#13ada4;
      --teal-dark:#0e8b84;
      --secondary:#111827;
      --text:#1f2937;
      --muted:#6b7280;
      --light:#f8fafc;
      --white:#ffffff;
      --border:#e5e7eb;
      --shadow:0 10px 30px rgba(2, 12, 27, 0.08);
      --shadow-hover:0 16px 40px rgba(2, 12, 27, 0.14);
      --radius:18px;
      --radius-sm:12px;
      --container:1280px;
      --transition:all 0.35s ease;
    }

    *{
      margin:0;
      padding:0;
      box-sizing:border-box;
    }

    html{
      scroll-behavior:smooth;
    }

    body{
      font-family:Arial, Helvetica, sans-serif;
      color:var(--text);
      background:#f4f7fb;
      line-height:1.5;
      overflow-x:hidden;
    }

    img{
      max-width:100%;
      display:block;
    }

    a{
      text-decoration:none;
      color:inherit;
    }

    ul{
      list-style:none;
    }

    .container{
      width:min(90% - 32px, var(--container));
      margin:0 auto;
    }

    .section{
      padding:34px 0;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      padding:14px 22px;
      border-radius:10px;
      font-size:14px;
      font-weight:700;
      transition:var(--transition);
      cursor:pointer;
      border:1px solid transparent;
    }

    .btn-primary{
      background:var(--primary);
      color:#fff;
      box-shadow:0 8px 22px rgba(13,110,253,.25);
    }

    .btn-primary:hover{
      background:var(--primary-dark);
      transform:translateY(-2px);
    }

    .btn-outline{
      background:rgba(255,255,255,.08);
      color:#fff;
      border-color:rgba(255,255,255,.35);
      backdrop-filter:blur(6px);
    }

    .btn-outline:hover{
      background:#fff;
      color:var(--secondary);
      transform:translateY(-2px);
    }

.section-tag{
      color:var(--primary);
      font-size:11px;
      font-weight:800;
      letter-spacing:1.2px;
      text-transform:uppercase;
      margin-bottom:8px;
    }

    .section-title{
      font-size:28px;
      line-height:1.1;
      font-weight:800;
      color:#0f172a;
      margin-bottom:10px;
    }

    .section-subtitle{
      color:var(--muted);
      font-size:15px;
      max-width:720px;
    }
    .heading-row{
      display:flex;
      align-items:end;
      justify-content:space-between;
      gap:18px;
      margin-bottom:22px;
    }

    .nav{
      position:sticky;
      top:0;
      z-index:1000;
      background:rgba(255,255,255,.95);
      backdrop-filter:blur(10px);
      border-bottom:1px solid rgba(0,0,0,.05);
    }

    .nav-inner{
      min-height:78px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:22px;
    }

    .logo{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:800;
      color:#ef4444;
      white-space:nowrap;
    }

    .logo-img{
      height:62px;
      width:auto;
      display:block;
      transition:transform .45s ease;
    }

    .logo:hover .logo-img{
      transform:rotate(-4deg) scale(1.06);
    }

    .footer-logo{
      padding:10px 18px;
      border-radius:12px;
      display:inline-flex;
      align-items:center;
    }

    .nav-menu{
      display:flex;
      align-items:center;
      gap:15px;
      color:#334155;
      font-size:14px;
      font-weight:600;
      margin-left:auto;
    }

    .nav-menu a{
      position:relative;
      padding:5px 0;
    }

    .nav-menu a::after{
      content:"";
      position:absolute;
      left:0;
      bottom:0;
      width:0;
      height:2px;
      background:var(--primary);
      transition:var(--transition);
    }

    .nav-menu a:hover::after{
      width:100%;
    }

    /* Dropdown menu */
    .nav-item{
      position:relative;
    }

    .dropdown-toggle{
      display:inline-flex;
      align-items:rir;
      gap:6px;
    }

    .chevron{
      font-size:8px;
      display:inline-block;
      transition:transform .3s ease;
    }

    .nav-item:hover .chevron,
    .nav-item.open .chevron{
      transform:rotate(180deg);
    }

    .dropdown-menu{
      position:absolute;
      top:calc(100% + 14px);
      left:50%;
      min-width:230px;
      background:#fff;
      border-radius:14px;
      box-shadow:var(--shadow-hover);
      padding:8px;
      opacity:0;
      visibility:hidden;
      transform:translate(-50%, 8px);
      transition:opacity .3s ease, transform .3s ease, visibility .3s ease;
      z-index:1100;
    }

    .dropdown-menu::before{
      content:"";
      position:absolute;
      top:-6px;
      left:50%;
      transform:translateX(-50%) rotate(45deg);
      width:12px;
      height:12px;
      background:#fff;
      border-radius:2px;
    }

    .nav-item:hover .dropdown-menu,
    .nav-item:focus-within .dropdown-menu,
    .nav-item.open .dropdown-menu{
      opacity:1;
      visibility:visible;
      transform:translate(-50%, 0);
    }

    .dropdown-menu a{
      display:block;
      padding:10px 14px;
      border-radius:10px;
      color:#334155;
      font-size:13.5px;
      font-weight:600;
      white-space:nowrap;
      transition:var(--transition);
    }

    .dropdown-menu a::after{
      display:none;
    }

    .dropdown-menu a:hover{
      background:#eff6ff;
      color:var(--primary);
      padding-left:20px;
    }

    .nav-actions{
      display:flex;
      align-items:center;
      gap:12px;
    }

    .contact-btn{
      padding:12px 18px;
      font-size:14px;
    }

    .menu-toggle{
      display:none;
      width:46px;
      height:46px;
      border:none;
      border-radius:10px;
      background:#eff6ff;
      color:#0f172a;
      font-size:22px;
      cursor:pointer;
    }

    .hero{
      padding:0;
    }

    .hero-slider{
      position:relative;
      width:100%;
      overflow:hidden;
    }

    .hero-track{
      display:flex;
      width:700%;
      transition:transform .8s cubic-bezier(.65,0,.35,1);
    }

    .hero-slide{
      position:relative;
      width:14.2857%;
      flex-shrink:0;
      min-height:540px;
      display:flex;
      align-items:center;
      background-size:cover;
      background-position:center;
      background-repeat:no-repeat;
    }

    .hero-slide::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(90deg, rgba(3,7,18,.82) 0%, rgba(3,7,18,.50) 40%, rgba(3,7,18,.20) 100%);
      z-index:1;
    }

    .hero-slide-inner{
      position:relative;
      z-index:2;
      width:100%;
    }

    .hero-content{
      position:relative;
      z-index:2;
      max-width:560px;
      padding:36px 46px 52px;
      color:#fff;
    }

    .hero-title{
      font-size:32px;
      line-height:1.05;
      font-weight:900;
      margin-bottom:12px;
      letter-spacing:-.8px;
    }

    .hero-title .highlight{
      color:#EB1A25;
    }

    .hero-text{
      color:rgba(255,255,255,.86);
      max-width:440px;
      font-size:14.5px;
      margin-bottom:18px;
    }

    .hero-actions{
      display:flex;
      gap:14px;
      flex-wrap:wrap;
    }

    .video-chip{
      position:absolute;
      right:40px;
      top:360px;
      display:flex;
      align-items:center;
      gap:10px;
      color:#fff;
      z-index:6;
      font-weight:700;
    }

    .slider-dots{
      position:absolute;
      bottom:26px;
      left:50%;
      transform:translateX(-50%);
      display:flex;
      align-items:center;
      gap:10px;
      z-index:6;
    }

    .dot{
      width:10px;
      height:10px;
      padding:0;
      border:none;
      border-radius:50%;
      background:rgba(255,255,255,.45);
      cursor:pointer;
      transition:var(--transition);
    }

    .dot:hover{
      background:rgba(255,255,255,.75);
    }

    .dot.active{
      width:30px;
      border-radius:6px;
      background:#fff;
    }

    .hero-arrow{
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      z-index:6;
      width:52px;
      height:52px;
      border-radius:50%;
      border:1px solid rgba(255,255,255,.35);
      background:rgba(17,24,39,.35);
      backdrop-filter:blur(6px);
      color:#fff;
      font-size:18px;
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      transition:var(--transition);
    }

    .hero-arrow:hover{
      background:var(--primary);
      border-color:var(--primary);
      transform:translateY(-50%) scale(1.08);
    }

    .hero-arrow-prev{
      left:24px;
    }

    .hero-arrow-next{
      right:24px;
    }

    @media (max-width: 640px){
      .hero-arrow{
        width:40px;
        height:40px;
        font-size:15px;
      }

      .hero-arrow-prev{
        left:12px;
      }

      .hero-arrow-next{
        right:12px;
      }
    }

    .play-btn{
      width:52px;
      height:52px;
      border-radius:50%;
      border:none;
      background:#fff;
      color:#111827;
      cursor:pointer;
      box-shadow:0 10px 25px rgba(0,0,0,.18);
      transition:var(--transition);
      position:relative;
    }

    .play-btn::before{
      content:"";
      position:absolute;
      inset:-8px;
      border-radius:50%;
      border:1px solid rgba(255,255,255,.45);
      animation:pulse 2s infinite;
    }

    .play-btn:hover{
      transform:scale(1.08);
    }

    @keyframes pulse{
      0%{transform:scale(.95); opacity:.9;}
      70%{transform:scale(1.2); opacity:0;}
      100%{transform:scale(1.2); opacity:0;}
    }

    .stats-wrap{
      position:relative;
      margin-top:-34px;
      z-index:4;
    }

    .stats-bar{
      background:#fff;
      border-radius:20px;
      box-shadow:var(--shadow);
      display:grid;
      grid-template-columns:repeat(5,1fr);
      overflow:hidden;
    }

    .stat{
      display:flex;
      align-items:center;
      gap:14px;
      padding:24px 20px;
      text-align:left;
      border-right:1px solid var(--border);
      transition:var(--transition);
    }

    .stat:last-child{
      border-right:none;
    }

    .stat:hover{
      background:#f8fbff;
    }

    .stat-icon{
      flex:0 0 auto;
      color:var(--primary);
      font-size:30px;
      line-height:1;
      display:flex;
      align-items:center;
      justify-content:center;
      transition:var(--transition);
    }

    .stat:hover .stat-icon{
      color:var(--primary-dark);
      transform:scale(1.12);
    }

    .stat-info{
      min-width:0;
    }

    .stat h3{
      font-size:20px;
      line-height:1.15;
      color:#0f172a;
      font-weight:800;
      margin-bottom:2px;
      white-space:nowrap;
    }

    .stat p{
      color:var(--muted);
      font-size:12.5px;
      font-weight:600;
      white-space:nowrap;
    }

    .cards-grid{
      display:grid;
      grid-template-columns:repeat(6, 1fr);
      gap:18px;
      margin-top:20px;
    }

    .mini-card{
      position:relative;
      min-height:180px;
      border-radius:16px;
      overflow:hidden;
      box-shadow:var(--shadow);
      transition:var(--transition);
      display:flex;
      align-items:flex-end;
    }

    .mini-card-bg{
      position:absolute;
      inset:0;
      z-index:0;
      background:#ddd center/cover no-repeat;
      transition:transform .6s ease;
    }

    .mini-card:hover .mini-card-bg{
      transform:scale(1.15);
    }

    .mini-card::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:1;
      background:linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.72));
      transition:var(--transition);
    }

    .mini-card:hover{
      transform:translateY(-8px);
      box-shadow:var(--shadow-hover);
    }

    .mini-card:hover::before{
      background:linear-gradient(180deg, rgba(13,110,253,.08), rgba(0,0,0,.82));
    }

    .mini-card-content{
      position:relative;
      z-index:2;
      width:100%;
      padding:18px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      color:#fff;
      gap:10px;
    }

    .mini-card h4{
      font-size:16px;
      line-height:1.2;
    }

    .mini-arrow{
      width:34px;
      height:34px;
      border-radius:50%;
      background:#fff;
      color:#111827;
      display:flex;
      align-items:center;
      justify-content:center;
      flex:0 0 auto;
      font-weight:800;
      transition:var(--transition);
    }

    .mini-card:hover .mini-arrow{
      background:var(--primary-dark);
      color:#fff;
      transform:translateX(4px);
    }

    .split-grid{
      display:grid;
      grid-template-columns:1.1fr 1.2fr;
      gap:24px;
      margin-top:26px;
    }

    .feature-card{
      background:#fff;
      border-radius:22px;
      overflow:hidden;
      box-shadow:var(--shadow);
      min-height:200px;
      position:relative;
      display:grid;
      grid-template-columns:1fr 1fr;
      transition:var(--transition);
    }

    .feature-card:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-hover);
    }

    .feature-text{
      padding:20px 20px;
      display:flex;
      flex-direction:column;
      justify-content:center;
    }

    .feature-title{
      font-size:14px;
      line-height:1;
      font-weight:800;
      color:#0f172a;
      margin-bottom:14px;
    }

    .feature-text p{
      color:var(--muted);
      margin-bottom:18px;
      font-size:15px;
    }

    .tick-list{
      display:grid;
      gap:10px;
      margin-bottom:20px;
    }

    .tick-list li{
      display:flex;
      align-items:center;
      gap:10px;
      color:#334155;
      font-weight:600;
      font-size:14px;
    }

    .tick{
      width:22px;
      height:22px;
      border-radius:50%;
      background:#eaf2ff;
      color:var(--primary);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:12px;
      font-weight:900;
    }

    .feature-media{
      min-height:200px;
      position:relative;
      overflow:hidden;
    }

    .feature-media-img{
      position:absolute;
      inset:0;
      background:center/cover no-repeat;
      transition:transform .7s ease;
    }

    .feature-card:hover .feature-media-img{
      transform:scale(1.1);
    }

    .feature-media::after{
      content:"";
      position:absolute;
      inset:0;
      z-index:1;
      background:linear-gradient(270deg, rgba(255,255,255,.00), rgba(255,255,255,.12));
      transition:background .5s ease;
    }

    .feature-card:hover .feature-media::after{
      background:linear-gradient(270deg, rgba(13,110,253,.05), rgba(0,0,0,.22));
    }

    .feature-media::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:2;
      background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.55) 50%, transparent 65%);
      transform:translateX(-130%);
      transition:transform 1s ease;
      pointer-events:none;
    }

    .feature-card:hover .feature-media::before{
      transform:translateX(130%);
    }

    /* Product systems panel — image slider cycling through 5 products,
       each slide showing the product photo with its name overlaid. */
    .products-panel{
      position:relative;
      border-radius:22px;
      overflow:hidden;
      box-shadow:var(--shadow);
      max-height:250px;
      min-height:250px;
      transition:var(--transition);
    }

    .products-panel:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-hover);
    }

    .products-track{
      display:flex;
      height:100%;
      width:700%;
      transition:transform .8s cubic-bezier(.65,0,.35,1);
    }

    .product-slide{
      position:relative;
      width:14.2857%;
      flex-shrink:0;
      height:250px;
      background-size:cover;
      background-position:center;
      background-repeat:no-repeat;
    }

    .product-slide-overlay{
      position:absolute;
      inset:0;
      z-index:1;
      background:linear-gradient(180deg, rgba(3,7,18,.05) 30%, rgba(3,7,18,.8) 100%);
    }

    .product-slide-text{
      position:absolute;
      left:22px;
      right:22px;
      bottom:18px;
      z-index:2;
      color:#fff;
    }

    .product-slide-text .section-tag{
      color:#7dd3fc;
      margin-bottom:4px;
    }

    .product-slide-text h4{
      font-size:19px;
      font-weight:800;
      letter-spacing:-.3px;
    }

    .products-arrow{
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      z-index:6;
      width:36px;
      height:36px;
      border-radius:50%;
      border:1px solid rgba(255,255,255,.35);
      background:rgba(17,24,39,.35);
      backdrop-filter:blur(6px);
      color:#fff;
      font-size:13px;
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      transition:var(--transition);
    }

    .products-arrow:hover{
      background:var(--primary);
      border-color:var(--primary);
      transform:translateY(-50%) scale(1.08);
    }

    .products-arrow-prev{ left:14px; }
    .products-arrow-next{ right:14px; }

    .products-dots{
      position:absolute;
      bottom:16px;
      left:50%;
      transform:translateX(-50%);
      display:flex;
      align-items:center;
      gap:8px;
      z-index:6;
    }

    /* Product applications panel — image now fills the whole card as a
       background, with the text overlaid on top. */
    .feature-card.feature-card-bg{
      display:block;
      position:relative;
      max-height:250px;
      min-height:250px;
      overflow:hidden;
    }

    .feature-card-bg-img{
      position:absolute;
      inset:0;
      z-index:0;
      background-size:cover;
      background-position:center;
      background-repeat:no-repeat;
      transition:transform .7s ease;
    }

    .feature-card.feature-card-bg:hover .feature-card-bg-img{
      transform:scale(1.12);
    }

    .feature-overlay{
      position:absolute;
      inset:0;
      z-index:1;
      background:linear-gradient(90deg, rgba(3,7,18,.86) 0%, rgba(3,7,18,.55) 45%, rgba(3,7,18,.15) 100%);
      transition:background .5s ease;
    }

    .feature-card.feature-card-bg:hover .feature-overlay{
      background:linear-gradient(90deg, rgba(3,7,18,.9) 0%, rgba(3,7,18,.62) 45%, rgba(3,7,18,.22) 100%);
    }

    .feature-text.feature-text-light{
      position:relative;
      z-index:2;
      height:100%;
      max-width:480px;
      color:#fff;
      padding:20px 26px;
    }

    .feature-text-light .feature-title{
      color:#fff;
      font-size:15px;
      margin-bottom:8px;
    }

    .feature-text-light p{
      color:rgba(255,255,255,.85);
      font-size:13px;
      margin-bottom:10px;
    }

    .feature-text-light .tick-list{
      gap:5px;
      margin-bottom:12px;
    }

    .feature-text-light .tick-list li{
      color:#fff;
      font-size:12.5px;
    }

    .feature-text-light .tick{
      background:rgba(255,255,255,.18);
      color:#fff;
      width:18px;
      height:18px;
      font-size:10px;
    }

    .feature-text-light .btn{
      padding:9px 16px;
      font-size:12.5px;
    }

    .projects-presence{
      display:grid;
      grid-template-columns:1.2fr .8fr;
      gap:24px;
      align-items:stretch;
    }

    .projects-box,
    .presence-box,
    .panel,
    .cert-box,
    .news-box{
      background:#fff;
      border-radius:22px;
      box-shadow:var(--shadow);
      overflow:hidden;
    }

    .presence-box{
      overflow:visible;
    }

    .panel-pad{
      padding:30px;
    }

    .project-cards{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:18px;
      margin-top:18px;
    }

    .project-card{
      border:1px solid var(--border);
      border-radius:16px;
      overflow:hidden;
      background:#fff;
      transition:var(--transition);
    }

    .project-card:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-hover);
    }

    .project-card .thumb{
      height:160px;
      position:relative;
      overflow:hidden;
      display:flex;
      align-items:flex-end;
    }

    .thumb-img{
      position:absolute;
      inset:0;
      background:center/cover no-repeat;
      transition:transform .7s ease;
    }

    .project-card:hover .thumb-img{
      transform:scale(1.12);
    }

    .project-card .thumb::after{
      content:"";
      position:absolute;
      inset:0;
      z-index:1;
      background:linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.55) 100%);
      transition:background .4s ease;
    }

    .project-card:hover .thumb::after{
      background:linear-gradient(180deg, rgba(13,110,253,.08) 35%, rgba(0,0,0,.7) 100%);
    }

    .project-card .thumb::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:1;
      background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.45) 50%, transparent 65%);
      transform:translateX(-130%);
      transition:transform 1s ease;
      pointer-events:none;
    }

    .project-card:hover .thumb::before{
      transform:translateX(130%);
    }

    .project-body{
      padding:16px;
    }

    .project-badge{
      position:relative;
      z-index:2;
      display:inline-block;
      font-size:11px;
      font-weight:800;
      color:#fff;
      background:var(--primary);
      padding:6px 10px;
      border-radius:999px;
      margin:12px;
      transition:var(--transition);
    }

    .project-card:hover .project-badge{
      transform:translateY(-2px);
      box-shadow:0 8px 16px rgba(13,110,253,.35);
    }

    .project-body h4{
      font-size:14px;
      line-height:1.1;
      margin-bottom:10px;
      color:#0f172a;
    }

    .project-body p{
      color:var(--muted);
      font-size:14px;
      margin-bottom:12px;
    }

    .link{
      display:inline-flex;
      align-items:center;
      gap:6px;
      color:var(--primary);
      font-size:14px;
      font-weight:800;
      border-bottom:1px solid transparent;
      transition:var(--transition);
    }

    .link .arrow{
      transition:transform .3s ease;
    }

    .link:hover{
      color:var(--primary-dark);
      border-bottom-color:var(--primary-dark);
    }

    .link:hover .arrow{
      transform:translateX(4px);
    }

    .presence-map{
      height:250px;
      position:relative;
      border-radius:14px;
      overflow:hidden;
      background-color:#fbfcfe;
      background-image:url('assets/images/Capture.PNG');
      background-repeat:no-repeat;
      background-position:center;
      background-size:cover;
    }

    .presence-map-wrap{
      position:relative;
      border-radius:14px;
      overflow:visible;
      background:#fbfcfe;
      border:1px solid #eef1f6;
      padding:6px;
    }

    .map-dot{
      position:absolute;
      width:15px;
      height:15px;
      border-radius:50%;
      background:#3b82f6;
      box-shadow:0 0 0 0 rgba(59,130,246,.5);
      animation:ping 2.4s infinite;
      cursor:pointer;
      z-index:2;
      transform:translate(-50%,-50%);
    }

    .map-dot::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:50%;
      background:#fff;
      transform:scale(.35);
    }

    .map-dot::after{
      content:attr(data-label);
      position:absolute;
      top:-16px;
      left:-25px;
      transform:translateX(-50%);
      background:var(--secondary);
      color:#fff;
      font-size:10px;
      font-weight:700;
      padding:3px 8px;
      border-radius:6px;
      white-space:nowrap;
      opacity:10%;
      pointer-events:none;
      transition:opacity .2s ease, transform .2s ease;
      z-index:4;
    }

    .map-dot:hover::after{
      opacity:1;
      transform:translateX(-50%) translateY(-4px);
    }

    .map-dot:hover{
      background:var(--primary-dark);
    }

    @keyframes ping{
      0%{box-shadow:0 0 0 0 rgba(59,130,246,.5);}
      70%{box-shadow:0 0 0 12px rgba(59,130,246,0);}
      100%{box-shadow:0 0 0 0 rgba(59,130,246,0);}
    }

    .map-dot.india-dot{
      width:15px;
      height:15px;
      background:#ffaa00;
      box-shadow:0 0 0 0 rgba(245,158,11,.5);
      animation:ping-india 2.1s infinite;
      z-index:3;
      transform:translate(-50%,-50%);
    }

    .map-dot.india-dot:hover{
      background:#00ff04;
    }

    @keyframes ping-india{
      0%{box-shadow:0 0 0 0 rgba(245,158,11,.5);}
      70%{box-shadow:0 0 0 12px rgba(245,158,11,0);}
      100%{box-shadow:0 0 0 0 rgba(245,158,11,0);}
    }

    .map-region-glow{
      position:absolute;
      left:72.76%;
      top:37.11%;
      width:90px;
      height:90px;
      transform:translate(-50%,-50%);
      background:radial-gradient(circle, rgba(251,191,114,.35) 0%, rgba(251,191,114,0) 70%);
      pointer-events:none;
      z-index:1;
    }

    
    /* Countdown section */
    .countdown-section{
      background:linear-gradient(135deg,var(--secondary) 0%,#1e3a8a 100%);
      border-radius:var(--radius);
      padding:42px 30px;
      text-align:center;
      color:#fff;
      position:relative;
      overflow:hidden;
    }

    .countdown-section::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(circle at 15% 20%, rgba(255,255,255,.08) 0 2px, transparent 3px),
        radial-gradient(circle at 80% 30%, rgba(255,255,255,.08) 0 2px, transparent 3px),
        radial-gradient(circle at 60% 80%, rgba(255,255,255,.08) 0 2px, transparent 3px),
        radial-gradient(circle at 30% 70%, rgba(255,255,255,.08) 0 2px, transparent 3px);
      pointer-events:none;
    }

    .countdown-tag{
      display:inline-block;
      background:rgba(255,255,255,.1);
      border:1px solid rgba(255,255,255,.25);
      color:#bfdbfe;
      font-size:12px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      padding:6px 14px;
      border-radius:999px;
      margin-bottom:14px;
    }

    .countdown-section h2{
      font-size:30px;
      margin-bottom:10px;
      position:relative;
    }

    .countdown-section p{
      color:#cbd5e1;
      margin-bottom:28px;
      position:relative;
    }

    .countdown-timer{
      display:flex;
      justify-content:center;
      flex-wrap:wrap;
      gap:16px;
      position:relative;
    }

    .countdown-timer .time-box{
      background:rgba(255,255,255,.08);
      border:1px solid rgba(255,255,255,.18);
      backdrop-filter:blur(6px);
      border-radius:14px;
      min-width:88px;
      padding:16px 10px;
    }

    .countdown-timer .time-box span{
      display:block;
      font-size:34px;
      font-weight:800;
      line-height:1;
      color:#fff;
      margin-bottom:6px;
    }

    .countdown-timer .time-box small{
      font-size:11px;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#93c5fd;
      font-weight:700;
    }

    .presence-stats{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:14px;
      margin-top:24px;
      text-align:center;
    }

    .presence-stats h3{
      color:var(--primary);
      font-size:40px;
      line-height:1;
      margin-bottom:8px;
    }

    .presence-stats p{
      color:var(--muted);
      font-weight:700;
      font-size:13px;
    }

    .logo-strip{
      background:#fff;
      border-radius:22px;
      box-shadow:var(--shadow);
      overflow:hidden;
      padding:30px 0;
    }

    .logos-head{
      text-align:center;
      font-size:12px;
      font-weight:800;
      color:var(--primary);
      letter-spacing:1px;
      text-transform:uppercase;
      margin-bottom:26px;
      padding:0 24px;
    }

    .logo-track-wrap{
      position:relative;
      overflow:hidden;
      -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 64px, #000 calc(100% - 64px), transparent 100%);
      mask-image:linear-gradient(90deg, transparent 0, #000 64px, #000 calc(100% - 64px), transparent 100%);
    }

    .logo-track{
      display:flex;
      align-items:center;
      gap:0;
      width:max-content;
      animation:logoScroll 26s linear infinite;
    }

    .logo-track-wrap:hover .logo-track{
      animation-play-state:paused;
    }

    @keyframes logoScroll{
      from{ transform:translateX(0); }
      to{ transform:translateX(-50%); }
    }

    .client-logo{
      flex:0 0 auto;
      display:flex;
      align-items:center;
      justify-content:center;
      height:110px;
      width:220px;
      padding:0 30px;
      border-right:1px solid var(--border);
      color:#475569;
      transition:var(--transition);
    }

    .client-logo:hover{
      transform:translateY(-4px) scale(1.04);
    }

    .client-logo img{
      max-height:76px;
      max-width:100%;
      width:auto;
      height:auto;
      object-fit:contain;
      display:block;
    }

    .client-logo .logo-mark{
      flex:0 0 auto;
      width:30px;
      height:30px;
      border-radius:8px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:13px;
      font-weight:900;
      color:#fff;
      letter-spacing:-.5px;
    }

    .client-logo .logo-word{
      display:flex;
      flex-direction:column;
      line-height:1.05;
      white-space:nowrap;
    }

    .client-logo .logo-word b{
      font-size:19px;
      font-weight:900;
      letter-spacing:-.3px;
    }

    .client-logo .logo-word small{
      font-size:9px;
      font-weight:700;
      letter-spacing:.4px;
      color:#94a3b8;
      text-transform:uppercase;
      margin-top:1px;
    }

    .triple-grid{
      display:grid;
      grid-template-columns:repeat(3, 1fr);
      gap:24px;
      align-items:start;
    }

    .info-card{
      background:#e0e3f4;
      border-radius:22px;
      box-shadow:var(--shadow);
      overflow:hidden;
      position:relative;
      transition:var(--transition);
    }

    .info-card:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-hover);
    }

    .info-content{
      padding:30px;
    }

    .meter-row{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:14px;
      margin-top:28px;
    }

    .meter{
      text-align:center;
    }

    .meter-ring{
      --val:0;
      width:92px;
      height:92px;
      border-radius:50%;
      margin:0 auto 10px;
      background:
        conic-gradient(#05ACEA calc(var(--val) * 1%), #dff3f0 0);
      position:relative;
      transition:transform .4s ease, background .1s linear;
    }

    .meter:hover .meter-ring{
      transform:scale(1.1);
    }

    .meter-ring::after{
      content:"";
      position:absolute;
      inset:9px;
      border-radius:50%;
      background:#fff;
    }

    .meter-ring span{
      position:absolute;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      z-index:2;
      font-weight:900;
      font-size:16px;
      color:#0f172a;
    }

    .meter p{
      font-size:13px;
      font-weight:700;
      color:#64748b;
      margin-top:2px;
    }

    .text-link{
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:var(--primary);
      font-weight:800;
      font-size:14.5px;
      transition:var(--transition);
    }

    .text-link i{
      font-size:12px;
      transition:transform .3s ease;
    }

    .text-link:hover{
      color:var(--primary-dark);
      gap:12px;
    }

    .text-link:hover i{
      transform:translateX(4px);
    }

    /* ---- Innovation & R&D full-image card ---- */
    .info-card.dark-card{
      display:flex;
    }

    .info-card.dark-card .info-media{
      position:absolute;
      inset:0;
      background:center/cover no-repeat;
      transition:transform .8s ease;
      z-index:0;
    }

    .info-card.dark-card:hover .info-media{
      transform:scale(1.08);
    }

    .info-card.dark-card .info-overlay{
      position:absolute;
      inset:0;
      background:linear-gradient(180deg, rgba(4,9,20,.88) 0%, rgba(6,13,30,.6) 38%, rgba(8,16,34,.28) 70%, rgba(8,16,34,.4) 100%);
      z-index:1;
    }

    .dark-card .info-content{
      position:relative;
      z-index:2;
      width:100%;
      display:flex;
      flex-direction:column;
      justify-content:flex-start;
      padding:30px;
    }

    .dark-card .section-tag{
      color:#7dd3fc;
    }

    .dark-card .feature-title{
      color:#fff;
    }

    .dark-card .info-content > p{
      color:#cbd5e1;
    }

    .dark-card .tick-list li{
      color:#e6edf7;
    }

    .dark-card .tick{
      background:rgba(255,255,255,.14);
      color:#7dd3fc;
      transition:var(--transition);
    }

    .dark-card .tick-list li:hover .tick{
      background:#7dd3fc;
      color:#04101f;
      transform:scale(1.12);
    }

    /* ---- Our Journey card ---- */
    .journey-card{
      display:flex;
      flex-direction:column;
    }

    .journey-card .info-content{
      padding-bottom:0;
    }

    .journey-line{
      position:relative;
      margin-top:16px;
    }

    .journey-item{
      display:grid;
      grid-template-columns:16px 1fr;
      gap:10px;
      position:relative;
      padding-bottom:10px;
    }

    .journey-item:last-child{
      padding-bottom:0;
    }

    .journey-item:not(:last-child)::before{
      content:"";
      position:absolute;
      left:7px;
      top:16px;
      bottom:-2px;
      width:2px;
      background:#dbe7fb;
    }

    .journey-marker{
      width:16px;
      height:16px;
      border-radius:50%;
      background:#a8acb0;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#fff;
      font-size:8px;
      margin-top:2px;
      cursor:pointer;
      transition:var(--transition);
      position:relative;
    }

    .journey-item.current .journey-marker{
      width:18px;
      height:18px;
      background:var(--primary);
      box-shadow:0 0 0 4px rgba(23,94,212,.16);
    }

    @keyframes markerPulse{
      0%{ box-shadow:0 0 0 0 rgba(23,94,212,.55); }
      70%{ box-shadow:0 0 0 12px rgba(23,94,212,0); }
      100%{ box-shadow:0 0 0 0 rgba(23,94,212,0); }
    }

    .journey-marker.pulsing{
      animation:markerPulse .7s ease-out;
    }

    .journey-marker:active{
      transform:scale(.85);
    }

    .journey-year{
      font-weight:900;
      color:var(--primary);
      font-size:11.5px;
      display:block;
      transition:var(--transition);
    }

    .journey-text{
      color:#475569;
      font-weight:600;
      font-size:10.5px;
      transition:var(--transition);
    }

    .journey-item:hover .journey-marker{
      transform:scale(1.2);
    }

    .journey-item:hover .journey-year{
      color:var(--primary-dark);
      transform:translateX(3px);
    }

    .journey-item:hover .journey-text{
      color:#1f2937;
      transform:translateX(3px);
    }

    .cert-row{
      display:grid;
      grid-template-columns:repeat(6,1fr);
      gap:16px;
      margin-top:18px;
    }

    .cert-item{
      border:1px solid var(--border);
      border-radius:18px;
      padding:20px 14px;
      text-align:center;
      transition:var(--transition);
      background:#fff;
    }

    .cert-item:hover{
      transform:translateY(-4px);
      box-shadow:var(--shadow);
    }

    .cert-badge{
      width:72px;
      height:72px;
      border-radius:50%;
      margin:0 auto 12px;
      border:3px solid #dbeafe;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:24px;
      font-weight:900;
      color:var(--primary);
      background:#f8fbff;
      transition:var(--transition);
    }

    .cert-item:hover .cert-badge{
      background:var(--primary);
      color:#fff;
      border-color:var(--primary);
      transform:rotate(-8deg) scale(1.06);
    }

    .cert-item h4{
      font-size:14px;
      color:#0f172a;
      margin-bottom:6px;
    }

    .cert-item p{
      color:var(--muted);
      font-size:12px;
      font-weight:600;
    }

    .news-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:28px;
      margin-top:18px;
    }

    .news-card{
      display:flex;
      align-items:flex-start;
      gap:14px;
      border:none;
      border-radius:0;
      overflow:visible;
      transition:var(--transition);
      background:transparent;
    }

    .news-card:hover{
      transform:translateY(-3px);
      box-shadow:none;
    }

    .news-thumb{
      flex:0 0 108px;
      width:108px;
      height:88px;
      border-radius:14px;
      overflow:hidden;
      background:center/cover no-repeat;
      transition:transform .6s ease;
    }

    .news-card:hover .news-thumb{
      transform:scale(1.06);
    }

    /* ---------- Our Locations ---------- */
    .locations-section{
      background:var(--light);
    }

    .locations-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:18px;
      margin-top:22px;
    }

    .location-card{
      position:relative;
      background:var(--white);
      border:1px solid var(--border);
      border-radius:var(--radius-sm);
      padding:18px 18px 16px;
      box-shadow:var(--shadow);
      transition:var(--transition);
      overflow:hidden;
    }

    .location-card::before{
      content:"";
      position:absolute;
      top:0; left:0; right:0;
      height:3px;
      background:linear-gradient(90deg, var(--primary-dark), var(--primary));
    }

    .location-card:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-hover);
    }

    .location-icon{
      width:38px;
      height:38px;
      border-radius:50%;
      background:rgba(235,26,37,.1);
      color:var(--primary-dark);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:15px;
      margin-bottom:10px;
      transition:var(--transition);
    }

    .location-card:hover .location-icon{
      background:var(--primary-dark);
      color:#fff;
      transform:scale(1.08) rotate(-6deg);
    }

    .location-card h4{
      font-size:16px;
      font-weight:800;
      color:#0f172a;
      margin-bottom:6px;
    }

    .location-card .location-company{
      font-size:12px;
      font-weight:700;
      color:var(--primary-dark);
      margin-bottom:4px;
    }

    .location-card address{
      font-style:normal;
      font-size:12px;
      line-height:1.5;
      color:var(--muted);
    }

    .location-card.location-cta{
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:flex-start;
      background:var(--secondary);
      border-color:var(--secondary);
    }

    .location-card.location-cta h4{
      color:#fff;
    }

    .location-card.location-cta p{
      font-size:12px;
      color:rgba(255,255,255,.7);
      margin-bottom:14px;
      line-height:1.5;
    }

    .location-card.location-cta .btn{
      padding:9px 16px;
      font-size:12.5px;
    }

    @media (max-width:1100px){
      .locations-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    @media (max-width:600px){
      .locations-grid{
        grid-template-columns:1fr;
      }
    }

    .news-body{
      padding:0;
      flex:1;
      min-width:0;
    }

    .news-date{
      font-size:11.5px;
      color:#64748b;
      font-weight:700;
      margin-bottom:6px;
    }

    .news-body h4{
      color:#0f172a;
      font-size:15px;
      line-height:1.3;
      font-weight:800;
      margin-bottom:8px;
    }

    .cta-section{
      padding:34px 0 0;
    }

    .cta{
      position:relative;
      overflow:hidden;
      width:100%;
      background:
        linear-gradient(90deg, rgba(4,16,46,.92) 0%, rgba(5,30,76,.72) 45%, rgba(5,30,76,.32) 100%),
        url('https://images.unsplash.com/photo-1473448912268-2022ce9509d8?auto=format&fit=crop&w=2000&q=80') center/cover no-repeat;
      color:#fff;
    }

    .cta-inner{
      padding:56px 24px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      flex-wrap:wrap;
    }

    .cta h3{
      font-size:38px;
      line-height:1.1;
      margin-bottom:8px;
    }

    .cta p{
      color:rgba(255,255,255,.86);
    }

    footer{
      background:#071a3d;
      color:#dbe7ff;
      padding:34px 0 20px;
    }

    .footer-grid{
      display:grid;
      grid-template-columns:0.9fr 1.5fr 1.5fr 1fr;
      gap:20px;
      padding-bottom:12px;
      border-bottom:1px solid rgba(255,255,255,.12);
    }

    .footer-col.has-divider{
      padding-left:25px;
      border-left:1px solid rgba(255,255,255,.14);
    }

    .footer-col.list-grid{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      column-gap:5px;
      row-gap:2px;
    }

    .footer-col.list-grid .footer-title{
      grid-column:1 / -1;
    }

    .footer-col.list-grid a{
      flex-direction:row;
      align-items:baseline;
      gap:6px;
      margin-bottom:0;
      white-space:nowrap;
      font-size:13px;
    }

    .footer-title{
      color:#fff;
      font-size:15px;
      font-weight:800;
      margin-bottom:14px;
    }

    .footer-col a,
    .footer-col p,
    .footer-brand p{
      display:flex;
      align-items:baseline;
      gap:10px;
      color:#bfd0f6;
      font-size:14px;
      margin-bottom:10px;
      transition:var(--transition);
    }

    .footer-brand p{
      display:block;
    }

    .footer-col a .num{
      font-size:12px;
      font-weight:700;
      color:#5f86c9;
      flex-shrink:0;
    }

    .footer-col a:hover{
      color:var(--primary-dark);
      transform:translateX(5px);
    }

    .socials{
      display:flex;
      justify-content:flex-end;
      gap:10px;
      margin-top:18px;
    }

    .social{
      width:38px;
      height:38px;
      border-radius:50%;
      background:rgba(255,255,255,.08);
      display:flex;
      align-items:center;
      justify-content:center;
      line-height:1;
      flex-shrink:0;
      font-size:14px;
      font-weight:700;
      transition:var(--transition);
    }

    .social i{
      display:block;
      width:1em;
      text-align:center;
    }

    .social:hover{
      background:var(--primary);
      transform:translateY(-3px);
    }

    .footer-bottom{
      display:flex;
      justify-content:space-between;
      gap:18px;
      flex-wrap:wrap;
      padding-top:18px;
      font-size:13px;
      color:#9fb5e5;
    }

    .footer-bottom-links{
      display:flex;
      gap:18px;
      flex-wrap:wrap;
    }

    .reveal{
      opacity:0;
      transform:translateY(30px);
      transition:opacity .8s ease, transform .8s ease;
    }

    .reveal.active{
      opacity:1;
      transform:translateY(0);
    }

    /* Staggered cascade for grid/repeated items sharing a parent */
    .reveal:nth-child(1){ transition-delay:0s; }
    .reveal:nth-child(2){ transition-delay:.08s; }
    .reveal:nth-child(3){ transition-delay:.16s; }
    .reveal:nth-child(4){ transition-delay:.24s; }
    .reveal:nth-child(5){ transition-delay:.32s; }
    .reveal:nth-child(6){ transition-delay:.4s; }

    .float{
      animation:float 5s ease-in-out infinite;
    }

    @keyframes float{
      0%,100%{transform:translateY(0);}
      50%{transform:translateY(-10px);}
    }

    /* Hero load-in sequence */
    .hero-title,
    .hero-text,
    .hero-actions{
      opacity:0;
    }

    .video-chip{
      opacity:0;
      animation:heroFadeUp .9s ease forwards;
      animation-delay:.75s;
    }

    .hero-slide.active .hero-title,
    .hero-slide.active .hero-text,
    .hero-slide.active .hero-actions{
      animation:heroFadeUp .9s ease forwards;
    }

    .hero-slide.active .hero-title{ animation-delay:.15s; }
    .hero-slide.active .hero-text{ animation-delay:.35s; }
    .hero-slide.active .hero-actions{ animation-delay:.55s; }

    @keyframes heroFadeUp{
      from{ opacity:0; transform:translateY(24px); }
      to{ opacity:1; transform:translateY(0); }
    }

    /* Keyboard accessibility */
    a:focus-visible,
    button:focus-visible{
      outline:2px solid var(--primary);
      outline-offset:3px;
      border-radius:6px;
    }

    /* Respect reduced-motion preference */
    @media (prefers-reduced-motion: reduce){
      *,
      *::before,
      *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
        scroll-behavior:auto !important;
      }
    }

    @media (max-width: 1200px){
      .hero-title{font-size:30px;}
      .cards-grid{grid-template-columns:repeat(3,1fr);}
      .split-grid,
      .projects-presence,
      .triple-grid{
        grid-template-columns:1fr;
      }
      .info-card{
        min-height:auto;
      }
      .feature-card{
        grid-template-columns:1fr;
      }
      .feature-media{
        min-height:280px;
      }
      .project-cards{
        grid-template-columns:1fr;
      }
      .cert-row{
        grid-template-columns:repeat(3,1fr);
      }
      .footer-grid{
        grid-template-columns:1fr 1fr;
      }
      .footer-col.list-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    @media (max-width: 992px){
      .nav-menu,
      .nav-actions .contact-btn{
        display:none;
      }

      .menu-toggle{
        display:block;
      }

      .nav-menu.mobile-open{
        position:absolute;
        top:78px;
        left:16px;
        right:16px;
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:8px;
        background:#fff;
        padding:16px;
        border-radius:16px;
        box-shadow:var(--shadow);
      }

      .nav-menu.mobile-open .nav-item{
        width:100%;
      }

      .nav-menu.mobile-open .dropdown-toggle{
        width:100%;
        justify-content:space-between;
      }

      .nav-menu.mobile-open .dropdown-menu{
        position:static;
        opacity:1;
        visibility:visible;
        transform:none;
        box-shadow:none;
        background:#f8fafc;
        max-height:0;
        overflow:hidden;
        padding:0 6px;
        margin-top:0;
        transition:max-height .4s ease, padding .4s ease;
      }

      .nav-menu.mobile-open .dropdown-menu::before{
        display:none;
      }

      .nav-menu.mobile-open .nav-item.open .dropdown-menu{
        max-height:320px;
        padding:8px 6px;
        margin-top:4px;
      }

      .hero-slide{
        min-height:300px;
      }

      .hero-content{
        padding:30px 28px 46px;
      }

      .hero-title{
        font-size:28px;
      }

      .stats-bar{
        grid-template-columns:repeat(2,1fr);
      }

      .cards-grid{
        grid-template-columns:repeat(2,1fr);
      }

      .news-grid{
        grid-template-columns:1fr;
      }

      .cert-row{
        grid-template-columns:repeat(2,1fr);
      }

      .presence-stats{
        grid-template-columns:1fr;
      }
    }

    @media (max-width: 640px){
      .container{
        width:min(100% - 20px, var(--container));
      }

      .logo-img{
        height:34px;
      }

      .footer-logo{
        padding:8px 14px;
      }

      .section{
        padding:24px 0;
      }

      .hero-slide{
        min-height:300px;
      }

      .hero-title{
        font-size:24px;
      }

      .hero-text{
        font-size:13.5px;
      }

      .video-chip{
        right:20px;
        top:18px;
        font-size:13px;
      }

      .stats-wrap{
        margin-top:-24px;
      }

      .stats-bar{
        grid-template-columns:1fr;
      }

      .cards-grid{
        grid-template-columns:1fr;
      }

      .heading-row{
        flex-direction:column;
        align-items:flex-start;
      }

      .section-title{
        font-size:30px;
      }

      .feature-card{
        min-height:auto;
      }

      .triple-grid{
        grid-template-columns:1fr;
      }

      .cert-row{
        grid-template-columns:1fr;
      }

      .footer-grid{
        grid-template-columns:1fr;
      }

      .footer-col.has-divider{
        padding-left:0;
        padding-top:18px;
        border-left:none;
        border-top:1px solid rgba(255,255,255,.14);
      }

      .socials{
        justify-content:flex-start;
      }

      .cta h3{
        font-size:28px;
      }

      .client-logo{
        width:150px;
        height:84px;
        padding:0 18px;
      }

      .client-logo img{
        max-height:52px;
      }
    }
  </style>
  <style>
    /* ============ Contact Page Specific Styles ============ */

    .page-banner{
      position:relative;
      overflow:hidden;
      min-height:280px;
      display:flex;
      align-items:center;
      background:
        linear-gradient(90deg, rgba(4,16,46,.90) 0%, rgba(5,30,76,.72) 55%, rgba(5,30,76,.35) 100%),
        url('assets/images/Underground/under g.png') center/cover no-repeat;
      color:#fff;
    }

    .page-banner::after{
      content:"";
      position:absolute;
      inset:0;
      background:radial-gradient(circle at 85% 20%, rgba(5,172,234,.35), transparent 55%);
      pointer-events:none;
    }

    .page-banner-inner{
      position:relative;
      z-index:2;
      padding:70px 0 56px;
    }

    .breadcrumb{
      display:flex;
      align-items:center;
      gap:8px;
      font-size:13px;
      font-weight:600;
      color:rgba(255,255,255,.75);
      margin-bottom:16px;
      letter-spacing:.2px;
    }

    .breadcrumb a{
      color:rgba(255,255,255,.75);
      transition:var(--transition);
    }

    .breadcrumb a:hover{
      color:var(--primary);
    }

    .breadcrumb i{
      font-size:9px;
      opacity:.7;
    }

    .breadcrumb .current{
      color:#fff;
      font-weight:700;
    }

    .page-banner h1{
      font-size:42px;
      font-weight:800;
      line-height:1.1;
      margin-bottom:10px;
      animation:fadeUp .8s ease both;
    }

    .page-banner p{
      color:rgba(255,255,255,.85);
      font-size:15px;
      max-width:560px;
      animation:fadeUp .8s ease .12s both;
    }

    @keyframes fadeUp{
      from{ opacity:0; transform:translateY(18px); }
      to{ opacity:1; transform:translateY(0); }
    }

    /* Quick contact strip */
    .quick-contact-wrap{
      margin-top:-46px;
      position:relative;
      z-index:5;
    }

    .quick-contact-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:16px;
    }

    .quick-card{
      background:var(--white);
      border-radius:var(--radius-sm);
      padding:20px 18px;
      box-shadow:var(--shadow);
      display:flex;
      align-items:center;
      gap:14px;
      transition:var(--transition);
      border:1px solid var(--border);
    }

    .quick-card:hover{
      transform:translateY(-6px);
      box-shadow:var(--shadow-hover);
      border-color:var(--primary);
    }

    .quick-icon{
      flex-shrink:0;
      width:46px;
      height:46px;
      border-radius:12px;
      background:rgba(5,172,234,.1);
      color:var(--primary);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:18px;
      transition:var(--transition);
    }

    .quick-card:hover .quick-icon{
      background:var(--primary);
      color:#fff;
      transform:scale(1.08) rotate(-6deg);
    }

    .quick-card-body h4{
      font-size:13px;
      font-weight:800;
      color:#0f172a;
      text-transform:uppercase;
      letter-spacing:.4px;
      margin-bottom:4px;
    }

    .quick-card-body a,
    .quick-card-body span{
      display:block;
      font-size:13.5px;
      color:var(--muted);
      font-weight:600;
      transition:var(--transition);
      line-height:1.4;
    }

    .quick-card-body a:hover{
      color:var(--primary-dark);
    }

    /* Contact form + info split */
    .contact-split{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:28px;
      align-items:stretch;
      margin-top:22px;
    }

    .contact-form-card{
      background:var(--white);
      border:1px solid var(--border);
      border-radius:var(--radius);
      padding:34px;
      box-shadow:var(--shadow);
      position:relative;
      overflow:hidden;
    }

    .contact-form-card::before{
      content:"";
      position:absolute;
      top:0; left:0; right:0;
      height:4px;
      background:linear-gradient(90deg, var(--primary-dark), var(--primary));
    }

    .form-row{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:16px;
      margin-bottom:16px;
    }

    .form-group{
      display:flex;
      flex-direction:column;
      gap:6px;
    }

    .form-group.full{
      grid-column:1 / -1;
    }

    .form-group label{
      font-size:12.5px;
      font-weight:700;
      color:#334155;
      letter-spacing:.2px;
    }

    .form-group input,
    .form-group select,
    .form-group textarea{
      width:100%;
      padding:13px 14px;
      border-radius:10px;
      border:1.5px solid var(--border);
      font-family:inherit;
      font-size:14px;
      color:var(--text);
      background:var(--light);
      transition:var(--transition);
      outline:none;
    }

    .form-group textarea{
      resize:vertical;
      min-height:110px;
    }

    .form-group input:focus,
    .form-group select:focus,
    .form-group textarea:focus{
      border-color:var(--primary);
      background:#fff;
      box-shadow:0 0 0 4px rgba(5,172,234,.12);
      transform:translateY(-1px);
    }

    .contact-form-card .btn-primary{
      width:100%;
      padding:15px 22px;
      font-size:15px;
      margin-top:4px;
    }

    .form-note{
      display:flex;
      align-items:center;
      gap:8px;
      font-size:12.5px;
      color:var(--muted);
      margin-top:14px;
    }

    .form-note i{
      color:var(--teal);
    }

    .form-success{
      display:none;
      align-items:center;
      gap:10px;
      background:rgba(19,173,164,.1);
      color:var(--teal-dark);
      border:1px solid rgba(19,173,164,.3);
      padding:12px 16px;
      border-radius:10px;
      font-size:13.5px;
      font-weight:700;
      margin-bottom:16px;
    }

    .form-success.show{
      display:flex;
      animation:fadeUp .5s ease both;
    }

    .form-error{
      display:none;
      align-items:center;
      gap:10px;
      background:rgba(235,26,37,.08);
      color:var(--primary-dark);
      border:1px solid rgba(235,26,37,.3);
      padding:14px 18px;
      border-radius:var(--radius-sm);
      font-size:14px;
      font-weight:600;
      margin-bottom:18px;
    }

    .form-error.show{
      display:flex;
      animation:fadeUp .5s ease both;
    }

    /* Right side: sales panel */
    .contact-side{
      display:flex;
      flex-direction:column;
      gap:16px;
    }

    .sales-card{
      background:var(--secondary);
      border-radius:var(--radius);
      padding:26px 26px;
      color:#fff;
      position:relative;
      overflow:hidden;
      flex:1;
      transition:var(--transition);
    }

    .sales-card::after{
      content:"";
      position:absolute;
      width:180px;
      height:180px;
      border-radius:50%;
      background:rgba(5,172,234,.16);
      top:-70px;
      right:-70px;
      transition:transform .6s ease;
    }

    .sales-card:hover::after{
      transform:scale(1.3);
    }

    .sales-card h4{
      font-size:12px;
      font-weight:800;
      text-transform:uppercase;
      letter-spacing:.6px;
      color:var(--primary);
      margin-bottom:10px;
    }

    .sales-card .sales-title{
      font-size:19px;
      font-weight:800;
      margin-bottom:14px;
      position:relative;
      z-index:2;
    }

    .sales-row{
      display:flex;
      align-items:center;
      gap:12px;
      padding:10px 0;
      border-top:1px solid rgba(255,255,255,.12);
      position:relative;
      z-index:2;
    }

    .sales-row:first-of-type{
      border-top:none;
    }

    .sales-row i{
      width:34px;
      height:34px;
      border-radius:9px;
      background:rgba(255,255,255,.08);
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--primary);
      flex-shrink:0;
      transition:var(--transition);
    }

    .sales-row:hover i{
      background:var(--primary);
      color:#fff;
      transform:scale(1.08);
    }

    .sales-row a{
      font-size:13.5px;
      font-weight:600;
      color:rgba(255,255,255,.88);
      transition:var(--transition);
      word-break:break-word;
    }

    .sales-row a:hover{
      color:var(--primary);
      padding-left:4px;
    }

    /* Offices section */
    .offices-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:20px;
      margin-top:22px;
    }

    .office-card{
      position:relative;
      background:var(--white);
      border:1px solid var(--border);
      border-radius:var(--radius);
      overflow:hidden;
      box-shadow:var(--shadow);
      transition:var(--transition);
    }

    .office-card:hover{
      transform:translateY(-8px);
      box-shadow:var(--shadow-hover);
    }

    .office-card-top{
      padding:24px 24px 18px;
      position:relative;
    }

    .office-card-top::before{
      content:"";
      position:absolute;
      top:0; left:0; right:0;
      height:4px;
      background:linear-gradient(90deg, var(--primary-dark), var(--primary));
    }

    .office-icon{
      width:50px;
      height:50px;
      border-radius:50%;
      background:rgba(235,26,37,.1);
      color:var(--primary-dark);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:19px;
      margin-bottom:14px;
      transition:var(--transition);
    }

    .office-card:hover .office-icon{
      background:var(--primary-dark);
      color:#fff;
      transform:scale(1.1) rotate(-8deg);
    }

    .office-card h4{
      font-size:19px;
      font-weight:800;
      color:#0f172a;
      margin-bottom:6px;
    }

    .office-company{
      font-size:12.5px;
      font-weight:700;
      color:var(--primary-dark);
      margin-bottom:10px;
      text-transform:uppercase;
      letter-spacing:.3px;
    }

    .office-card address{
      font-style:normal;
      font-size:13.5px;
      line-height:1.6;
      color:var(--muted);
    }

    .office-card-bottom{
      padding:16px 24px 22px;
      border-top:1px solid var(--border);
    }

    .office-map-link{
      display:inline-flex;
      align-items:center;
      gap:8px;
      font-size:13px;
      font-weight:700;
      color:var(--primary);
      transition:var(--transition);
    }

    .office-map-link i{
      transition:transform .3s ease;
    }

    .office-map-link:hover{
      color:var(--primary-dark);
    }

    .office-map-link:hover i{
      transform:translateX(4px);
    }

    /* Map embed */
    .map-embed-wrap{
      margin-top:26px;
      border-radius:var(--radius);
      overflow:hidden;
      box-shadow:var(--shadow);
      border:1px solid var(--border);
      position:relative;
    }

    .map-embed-wrap iframe{
      width:100%;
      height:380px;
      border:0;
      display:block;
      filter:grayscale(.15) contrast(1.02);
      transition:filter .5s ease;
    }

    .map-embed-wrap:hover iframe{
      filter:grayscale(0);
    }

    @media (max-width:1200px){
      .quick-contact-grid{
        grid-template-columns:repeat(2,1fr);
      }
      .contact-split{
        grid-template-columns:1fr;
      }
      .offices-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    @media (max-width:640px){
      .page-banner h1{
        font-size:28px;
      }
      .quick-contact-grid{
        grid-template-columns:1fr;
      }
      .quick-contact-wrap{
        margin-top:-30px;
      }
      .form-row{
        grid-template-columns:1fr;
      }
      .contact-form-card{
        padding:22px;
      }
      .offices-grid{
        grid-template-columns:1fr;
      }
    }