/* ════════════════════════════════════════════
   XYLEM WORLD TRADE SOLUTIONS
   Shared Stylesheet — All Pages
   D-Tech Enterprises © 2026
════════════════════════════════════════════ */

/* ── TOKENS ── */
:root {
  --navy:       #3FA9F5;  /* Soft Slate & Sage: Primary dark, muted slate */
  --navy-mid:   #1B74C4;  /* Soft Slate & Sage: Mid-tone slate for depth */
  --ocean:      #3FA9F5;  /* Soft Slate & Sage: Teal-Blue, calm maritime */
  --ocean-light:#F5F8FC;  /* Soft Slate & Sage: Light teal tint */
  --orange:     #3FA9F5;  /* Soft Slate & Sage: Warm Taupe accent (replaces orange) */
  --orange-dark:#1B74C4;  /* Soft Slate & Sage: Dark Taupe for hover states */
  --steel:      #F5F8FC;  /* Soft Slate & Sage: Cream background */
  --white:      #FFFFFF;
  --text-dark:  #1B2A41;
  --text-mid:   #4A5568;
  --text-light: #718096;
  --border:     #E2ECF7;  /* Updated: works with cream background */
  --whatsapp:   #0066CC;
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --shadow-sm:  0 1px 3px rgba(0,0,0,.08);
  --shadow-md:  0 4px 16px rgba(0,0,0,.10);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.14);
  --transition: all .25s cubic-bezier(.4,0,.2,1);
}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ── Scroll offset for sticky nav ── */
/* Prevents sticky navbar from covering anchor sections */
#quote, #estimator, #faq, #services, #about, #why, #industries,
[id] { scroll-margin-top: 80px; }

html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Plus Jakarta Sans',sans-serif;color:var(--text-dark);background:var(--white);overflow-x:hidden;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
input,textarea,select,button{font-family:inherit}
button{cursor:pointer}

/* ── TYPOGRAPHY ── */
.eyebrow{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--primary);margin-bottom:10px;display:block}
.h1{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:clamp(34px,5vw,52px);line-height:1.0}
.h2{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:clamp(26px,3.5vw,36px);line-height:1.1}
.h3{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:16px}
.body-lg{font-size:15px;line-height:1.75;color:var(--text-mid)}
.body-sm{font-size:13px;line-height:1.65;color:var(--text-mid)}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border-radius:var(--radius-sm);font-size:14px;font-weight:700;border:none;transition:var(--transition);white-space:nowrap;cursor:pointer}
.btn-primary{background:var(--orange);color:var(--white)}
.btn-primary:hover{background:var(--orange-dark);transform:translateY(-1px);box-shadow:0 4px 14px rgba(63,169,245,.35)}
.btn-ghost{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.35)}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.6)}
.btn-outline{background:transparent;color:var(--ocean);border:1.5px solid var(--ocean)}
.btn-outline:hover{background:var(--ocean);color:var(--white)}
.btn-sm{padding:9px 18px;font-size:13px}
.btn-lg{padding:16px 32px;font-size:15px}
.btn-block{width:100%;justify-content:center}
.btn-whatsapp{background:var(--whatsapp);color:var(--white);width:100%;justify-content:center;padding:11px;border-radius:var(--radius-sm);font-size:13px;font-weight:700;border:none;display:flex;align-items:center;gap:8px;transition:var(--transition);text-decoration:none}
.btn-whatsapp:hover{background:#0052A3}

/* ── LAYOUT ── */
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.container-sm{max-width:960px;margin:0 auto;padding:0 24px}
.section{padding:80px 0}
.section-sm{padding:56px 0}
.section-hdr{margin-bottom:48px}
.section-hdr.center{text-align:center}
.section-hdr p{margin-top:12px;max-width:580px}
.section-hdr.center p{margin:12px auto 0}

/* ── INFO BAR ── */
.info-bar{background:var(--navy);padding:9px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.info-bar .container{display:flex;align-items:center;justify-content:space-between;gap:12px}
.info-bar-left{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.info-bar-item{display:flex;align-items:center;gap:6px;font-size:12px;color:rgba(255,255,255,.65)}
.info-bar-social{display:flex;gap:8px}
.info-bar-social a{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:13px;color:rgba(255,255,255,.6);transition:var(--transition)}
.info-bar-social a:hover{background:var(--orange);color:var(--white)}

/* ── PROMO BAR ── */
.promo-bar{background:var(--orange);padding:10px 0}
.promo-bar .container{display:flex;align-items:center;justify-content:space-between;gap:12px}
.promo-bar p{font-size:13px;color:var(--white);font-weight:500}
.promo-bar p strong{font-weight:700}
.promo-cta{background:var(--white);color:var(--primary);font-weight:700;font-size:12px;padding:6px 16px;border-radius:var(--radius-sm);border:none;flex-shrink:0;text-decoration:none;display:inline-block;transition:var(--transition)}
.promo-cta:hover{background:var(--navy);color:var(--white)}

/* ── NAVBAR ── */
.navbar{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1000;box-shadow:0 1px 8px rgba(0,0,0,.06)}
.navbar .container{display:flex;align-items:center;justify-content:space-between;height:68px;gap:24px}
.nav-logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-logo-mark{height:40px;width:auto;display:block}
.nav-logo-img{height:40px;width:auto;display:block}
.nav-logo-name{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:18px;color:var(--navy);letter-spacing:.5px}
.nav-logo-sub{font-size:10px;color:var(--text-light);font-weight:500;letter-spacing:.3px}
.nav-links{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.nav-link{position:relative;padding:8px 14px;font-size:14px;font-weight:500;color:var(--text-mid);border-radius:var(--radius-sm);transition:var(--transition);display:flex;align-items:center;gap:4px}
.nav-link:hover,.nav-link.active{color:var(--navy);background:var(--steel)}
.nav-link.active{font-weight:600}
.nav-mega{position:relative}
.mega-menu{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:20px;width:680px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;opacity:0;visibility:hidden;transition:var(--transition);z-index:999}
.nav-mega:hover .mega-menu{opacity:1;visibility:visible;top:calc(100% + 4px)}
.mega-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);transition:var(--transition);font-size:13px;color:var(--text-dark);font-weight:500}
.mega-item:hover{background:var(--steel);color:var(--ocean)}
.mega-icon{width:30px;height:30px;background:var(--ocean-light);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.nav-cta{flex-shrink:0}
.nav-toggle{display:none;flex-direction:column;gap:5px;padding:8px;background:none;border:none}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--navy);border-radius:2px;transition:var(--transition)}

/* ── MOBILE NAV ── */
.mobile-nav{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:var(--navy);z-index:9999;padding:24px;flex-direction:column;overflow-y:auto}
.mobile-nav.open{display:flex}
.mobile-nav-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}
.mobile-nav-close{background:none;border:none;color:var(--white);font-size:28px;line-height:1}
.mobile-nav-link{display:block;padding:14px 0;font-size:20px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;color:var(--white);border-bottom:1px solid rgba(255,255,255,.1)}
.mobile-nav-cta{margin-top:32px}

/* ── PAGE HERO (inner pages) ── */
.page-hero{background:var(--navy);padding:56px 0;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 20% 80%,rgba(27,108,168,.12) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(63,169,245,.06) 0%,transparent 50%)}
.page-hero::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px}
.page-hero .container{position:relative;z-index:2}
.page-hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--secondary);margin-bottom:16px}
.page-hero-eyebrow::before{content:'';display:block;width:24px;height:2px;background:var(--orange)}
.page-hero h1{color:var(--white);margin-bottom:16px}
.page-hero p{font-size:15px;color:rgba(255,255,255,.6);max-width:560px;line-height:1.7;margin-bottom:24px}
.page-hero-ctas{display:flex;gap:12px;flex-wrap:wrap}

/* ── BREADCRUMB ── */
.breadcrumb{background:var(--steel);padding:12px 0;border-bottom:1px solid var(--border)}
.breadcrumb-inner{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-light)}
.breadcrumb-inner a{color:var(--ocean);transition:var(--transition)}
.breadcrumb-inner a:hover{color:var(--primary)}
.breadcrumb-sep{color:var(--border)}

/* ── TWO-COL SERVICE LAYOUT ── */
.service-layout{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:start}
.service-main{}
.service-sidebar{position:sticky;top:88px}

/* ── SIDEBAR QUOTE CARD ── */
.sidebar-card{background:var(--navy);border-radius:var(--radius-lg);padding:24px;margin-bottom:16px}
.sidebar-card h3{font-size:16px;font-weight:700;color:var(--white);margin-bottom:4px}
.sidebar-card p{font-size:12px;color:rgba(255,255,255,.45);margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.1)}
.form-field{width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-sm);padding:11px 14px;font-size:13px;color:var(--white);margin-bottom:10px;transition:var(--transition);outline:none}
.form-field::placeholder{color:rgba(255,255,255,.35)}
.form-field:focus{border-color:var(--ocean);background:rgba(255,255,255,.1)}
.form-field option{background:var(--navy);color:var(--white)}
.form-textarea{height:80px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form-divider{text-align:center;font-size:11px;color:rgba(255,255,255,.3);margin:10px 0;position:relative}
.form-divider::before,.form-divider::after{content:'';position:absolute;top:50%;width:42%;height:1px;background:rgba(255,255,255,.1)}
.form-divider::before{left:0}
.form-divider::after{right:0}
.form-note{text-align:center;font-size:11px;color:rgba(255,255,255,.3);margin-top:8px}

/* ── SIDEBAR INFO BOX ── */
.sidebar-info{background:var(--ocean-light);border:1px solid #BEE3F8;border-radius:var(--radius-md);padding:18px;margin-bottom:16px}
.sidebar-info h4{font-size:13px;font-weight:700;color:var(--navy);margin-bottom:10px}
.sidebar-info-item{display:flex;gap:8px;font-size:12px;color:var(--text-mid);margin-bottom:6px;align-items:flex-start;line-height:1.4}

/* ── CONTENT BLOCKS ── */
.content-block{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);padding:28px;margin-bottom:20px}
.content-block h2{font-family:'Plus Jakarta Sans',sans-serif;font-size:24px;font-weight:700;color:var(--navy);margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid var(--steel)}
.content-block h3{font-size:16px;font-weight:700;color:var(--navy);margin-bottom:10px;margin-top:20px}
.content-block p{font-size:14px;color:var(--text-mid);line-height:1.75;margin-bottom:12px}
.content-block p:last-child{margin-bottom:0}

/* Feature list */
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.feature-item{display:flex;align-items:flex-start;gap:10px;background:var(--steel);border-radius:var(--radius-sm);padding:12px 14px;font-size:13px;color:var(--text-dark)}
.feature-item::before{content:'✓';color:var(--ocean);font-weight:700;flex-shrink:0;margin-top:1px}

/* Process steps */
.process-steps{display:flex;flex-direction:column;gap:0}
.process-step{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--steel);align-items:flex-start}
.process-step:last-child{border-bottom:none}
.step-num{width:32px;height:32px;background:var(--orange);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--white);font-size:12px;font-weight:700;flex-shrink:0;margin-top:2px}
.step-content h4{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:4px}
.step-content p{font-size:13px;color:var(--text-mid);line-height:1.6}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:0}
.faq-item{border-bottom:1px solid var(--border);padding:16px 0}
.faq-item:last-child{border-bottom:none}
.faq-q{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:8px;display:flex;align-items:flex-start;gap:8px}
.faq-q::before{content:'Q.';color:var(--primary);font-weight:800;flex-shrink:0}
.faq-a{font-size:13px;color:var(--text-mid);line-height:1.7;padding-left:24px}

/* Stats strip */
.stats-strip{background:var(--navy);padding:32px 0}
.stats-strip-inner{display:flex;justify-content:space-around;flex-wrap:wrap;gap:24px}
.strip-stat{text-align:center}
.strip-num{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:38px;color:var(--white);line-height:1}
.strip-num .acc{color:var(--secondary)}
.strip-label{font-size:11px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.5px;margin-top:4px}

/* ── NHAVA BLOCK ── */
.nhava-block{background:var(--ocean-light);border-top:4px solid var(--ocean);padding:28px 0}
.nhava-inner{display:flex;align-items:center;gap:24px}
.nhava-icon-wrap{width:56px;height:56px;background:var(--navy);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}
.nhava-content{flex:1}
.nhava-content h3{font-size:16px;font-weight:700;color:var(--navy);margin-bottom:5px}
.nhava-content p{font-size:13px;color:var(--text-mid);line-height:1.55}
.nhava-badge{background:var(--orange);color:var(--white);font-size:12px;font-weight:700;padding:10px 18px;border-radius:var(--radius-sm);white-space:nowrap;flex-shrink:0}

/* ── CTA STRIP ── */
.cta-strip{background:linear-gradient(135deg,var(--ocean) 0%,#1B74C4 100%);padding:72px 0;text-align:center;position:relative;overflow:hidden}
.cta-strip::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px}
.cta-strip .container{position:relative;z-index:2}
.cta-strip h2{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(26px,4vw,40px);font-weight:800;color:var(--white);margin-bottom:12px}
.cta-strip p{font-size:15px;color:rgba(255,255,255,.7);max-width:520px;margin:0 auto 32px;line-height:1.6}
.cta-strip-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ── FOOTER ── */
.footer{background:#1B74C4;padding:64px 0 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.08)}
.footer-logo{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.footer-logo-mark{background:#fff;border-radius:var(--radius-sm);padding:7px 10px;display:inline-flex;align-items:center}
.footer-logo-img{height:36px;width:auto;max-width:160px;object-fit:contain;height:44px;width:auto;max-width:180px;object-fit:contain;display:block}
.footer-logo-mark{background:#fff;border-radius:var(--radius-sm);padding:8px 12px;display:inline-flex;align-items:center;justify-content:center;line-height:0}
.footer-logo a{display:inline-flex}
.dtech-credit{color:rgba(255,255,255,.55);transition:color .2s}
.dtech-credit:hover{color:var(--secondary)}
.footer-logo-name{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:17px;color:var(--white)}
.footer-desc{font-size:13px;color:rgba(255,255,255,.45);line-height:1.7;margin-bottom:20px}
.footer-contact-item{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:rgba(255,255,255,.45);margin-bottom:8px;line-height:1.5}
.footer-contact-item a{color:var(--secondary);transition:var(--transition)}
.footer-contact-item a:hover{color:var(--white)}
.footer-col-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--white);margin-bottom:16px}
.footer-links{display:flex;flex-direction:column;gap:8px}
.footer-link{font-size:13px;color:rgba(255,255,255,.45);transition:var(--transition);display:flex;align-items:center;gap:6px}
.footer-link:hover{color:var(--secondary);padding-left:4px}
.footer-socials{display:flex;gap:8px;margin-top:16px}
.footer-social{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:14px;color:rgba(255,255,255,.45);transition:var(--transition)}
.footer-social:hover{background:var(--orange);border-color:var(--orange);color:var(--white)}
.footer-bottom{padding:20px 0;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.footer-bottom p{font-size:12px;color:rgba(255,255,255,.3)}
.footer-bottom-links{display:flex;gap:20px}
.footer-bottom-link{font-size:12px;color:rgba(255,255,255,.3);transition:var(--transition)}
.footer-bottom-link:hover{color:rgba(255,255,255,.6)}

/* ── FLOAT WHATSAPP ── */
.float-whatsapp{position:fixed;bottom:28px;right:28px;width:54px;height:54px;background:var(--whatsapp);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;box-shadow:0 4px 20px rgba(37,211,102,.45);z-index:900;transition:var(--transition);text-decoration:none}
.float-whatsapp:hover{transform:scale(1.1)}
.float-whatsapp-tooltip{position:absolute;right:64px;background:var(--navy);color:var(--white);font-size:12px;font-weight:600;padding:6px 12px;border-radius:var(--radius-sm);white-space:nowrap;opacity:0;pointer-events:none;transition:var(--transition)}
.float-whatsapp:hover .float-whatsapp-tooltip{opacity:1}

/* ── REVEAL ANIMATIONS ── */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal-delay-4{transition-delay:.4s}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .service-layout{grid-template-columns:1fr}
  .service-sidebar{position:static}
}
@media(max-width:768px){
  .info-bar{display:none}
  .navbar .container{height:60px}
  .nav-links,.nav-cta{display:none}
  .nav-toggle{display:flex}
  .nhava-badge{display:none}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom{flex-direction:column;text-align:center}
  .cta-strip-buttons{flex-direction:column;align-items:center}
  .section{padding:56px 0}
  .section-hdr{margin-bottom:32px}
  .feature-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .float-whatsapp{bottom:20px;right:20px;width:48px;height:48px}
}
/* ════════════════════════════════════════════
   COMPREHENSIVE MOBILE RESPONSIVE FIX
   Overrides all inline grid styles
   D-Tech Enterprises © 2026
════════════════════════════════════════════ */

/* Tablet — 1024px and below */
@media(max-width:1024px){
  /* Grids */
  [style*="grid-template-columns:1fr 1fr"],[style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:2fr 1fr"],[style*="grid-template-columns: 2fr 1fr"],
  [style*="grid-template-columns:1.1fr 1fr"],[style*="grid-template-columns: 1.1fr 1fr"],
  [style*="grid-template-columns:1fr 360px"],[style*="grid-template-columns: 1fr 360px"],
  [style*="grid-template-columns:1fr 400px"],[style*="grid-template-columns: 1fr 400px"],
  [style*="grid-template-columns:1.2fr 1fr"],[style*="grid-template-columns: 1.2fr 1fr"]{
    grid-template-columns:1fr !important;
  }
  [style*="grid-template-columns:repeat(4"],[style*="grid-template-columns: repeat(4"]{
    grid-template-columns:repeat(2,1fr) !important;
  }
  [style*="grid-template-columns:2fr 1fr 1fr 1fr"],[style*="grid-template-columns: 2fr 1fr 1fr 1fr"]{
    grid-template-columns:1fr 1fr !important;
  }
}

/* Mobile — 768px and below */
@media(max-width:768px){
  /* Override ALL multi-column inline grids to single column */
  [style*="grid-template-columns"]{
    grid-template-columns:1fr !important;
  }
  /* Re-allow 2-col where it still works on mobile */
  [style*="grid-template-columns:repeat(2"],[style*="grid-template-columns: repeat(2"]{
    grid-template-columns:1fr 1fr !important;
  }

  /* Typography */
  [style*="font-size:clamp"]{font-size:clamp(28px,8vw,40px) !important}
  [style*="font-size:38px"],[style*="font-size: 38px"]{font-size:26px !important}
  [style*="font-size:42px"],[style*="font-size: 42px"]{font-size:28px !important}
  [style*="font-size:52px"],[style*="font-size: 52px"]{font-size:30px !important}
  [style*="font-size:56px"],[style*="font-size: 56px"]{font-size:32px !important}
  [style*="font-size:100px"],[style*="font-size: 100px"]{font-size:60px !important}

  /* Gaps */
  [style*="gap:60px"],[style*="gap: 60px"]{gap:24px !important}
  [style*="gap:56px"],[style*="gap: 56px"]{gap:20px !important}
  [style*="gap:40px"],[style*="gap: 40px"]{gap:20px !important}

  /* Padding */
  [style*="padding:80px 0"],[style*="padding: 80px 0"]{padding:48px 0 !important}
  [style*="padding:72px 0"],[style*="padding: 72px 0"]{padding:48px 0 !important}
  [style*="padding:64px 0"],[style*="padding: 64px 0"]{padding:40px 0 !important}

  /* Hero sections */
  .hero,[style*="min-height:88vh"],[style*="min-height: 88vh"]{
    min-height:auto !important;
    padding:48px 0 !important;
  }

  /* Map panels - hide on mobile hero */
  .hero-map-panel{display:none !important}

  /* Nav */
  .nav-links,.nav-cta,.nav-ctas{display:none !important}
  .nav-toggle{display:flex !important}
  .navbar .container{height:60px !important}

  /* Stats */
  .stats-inner{flex-wrap:wrap !important}
  .stat-item{min-width:50% !important;border-bottom:1px solid var(--border)}

  /* Services grids */
  .services-grid{grid-template-columns:1fr 1fr !important}

  /* Industry grids */
  .industries-grid{grid-template-columns:1fr 1fr !important}

  /* Testimonials */
  .testimonials-grid{grid-template-columns:1fr !important}

  /* Steps track */
  .steps-track{flex-direction:column !important;gap:16px !important}
  .steps-track::before{display:none !important}
  .step-item::after{display:none !important}

  /* Footer */
  .footer-grid{grid-template-columns:1fr !important;gap:24px !important}
  .footer-bottom{flex-direction:column !important;text-align:center !important}
  .footer-bottom-links{justify-content:center !important}

  /* CTA strips */
  .cta-strip-buttons{flex-direction:column !important;align-items:center !important}
  .page-hero-ctas{flex-direction:column !important;align-items:flex-start}

  /* Forms */
  .form-row{grid-template-columns:1fr !important}

  /* Buttons */
  .btn-lg{padding:13px 20px !important;font-size:14px !important}

  /* Why grid (xylem) */
  .why-grid{grid-template-columns:1fr !important;gap:32px !important}

  /* Offices grid */
  .offices-grid{grid-template-columns:1fr !important}

  /* Hero grid */
  .hero-grid{grid-template-columns:1fr !important;gap:32px !important}

  /* Dual band */
  .dual-band{grid-template-columns:1fr !important}

  /* nhava badge */
  .nhava-badge{display:none !important}

  /* Container padding */
  .container{padding:0 16px !important}

  /* Section padding */
  .section{padding:48px 0 !important}
  .section-sm{padding:36px 0 !important}

  /* WhatsApp float */
  .float-whatsapp{bottom:16px !important;right:16px !important;width:46px !important;height:46px !important}

  /* Info bar */
  .info-bar{display:none !important}

  /* Promo bar */
  .promo-bar p{font-size:11px !important}
  .promo-bar .container{flex-wrap:wrap !important;gap:8px !important}

  /* Band sections */
  .band-hire,.band-work{padding:24px 20px !important}

  /* Service layout sidebar */
  .service-layout{grid-template-columns:1fr !important}
  .service-sidebar{position:static !important}

  /* Content block feature grid */
  .feature-grid{grid-template-columns:1fr !important}
  .feature-item-hire,.feature-item-work{font-size:12px !important}
}

/* Small mobile — 480px and below */
@media(max-width:480px){
  .services-grid{grid-template-columns:1fr !important}
  .industries-grid{grid-template-columns:1fr 1fr !important}
  .stat-item{min-width:100% !important}
  .wf-nav-btns,.nav-ctas{display:none !important}

  [style*="grid-template-columns:repeat(2"],[style*="grid-template-columns: repeat(2"]{
    grid-template-columns:1fr !important;
  }

  /* Typography scale down further */
  .h1,.hero-title,[style*="font-size:clamp"]{font-size:28px !important;line-height:1.1 !important}
  .h2{font-size:22px !important}

  /* Job cards */
  .job-meta{flex-direction:column !important;gap:4px !important}
}

/* ===== Inline SVG icon sizing (converted from emoji) ===== */
.mega-icon svg{width:17px;height:17px;color:var(--ocean)}
.service-icon svg{width:26px;height:26px;color:var(--ocean)}
.service-card:hover .service-icon svg{color:#fff}
.industry-icon-wrap svg{width:24px;height:24px;color:var(--ocean)}
.industry-card:hover .industry-icon-wrap svg{color:#fff}
.hero-trust-icon svg{width:20px;height:20px;color:var(--orange)}
.nhava-icon-wrap svg{width:28px;height:28px;color:#fff}
.value-icon svg,.step-icon svg,.feat-icon svg,.svc-icon svg,.process-icon svg{width:24px;height:24px;color:var(--ocean)}
.contact-icon svg,.office-badge svg{width:20px;height:20px;color:var(--ocean)}
/* inline text icons in links (phone/mail/pin/chat) */
.ic{display:inline-flex;width:1em;height:1em;vertical-align:-0.125em}
.ic svg{width:100%;height:100%}

.ic-lead{width:1.05em;height:1.05em;vertical-align:-0.15em;margin-right:.15em;color:var(--orange)}
.ic-lead svg{width:100%;height:100%}
.office-badge svg{width:22px;height:22px;color:var(--ocean)}


/* ════════════════════════════════════════════
   UPGRADE LAYER — D-Tech Enterprises · July 2026
   New features: ticker, client logos, stats photo,
   why-light, testimonials real format, services hero,
   FAQ, cost estimator
════════════════════════════════════════════ */

/* ── TICKER BAR ── */
.ticker-bar {
  background: var(--navy);
  border-bottom: 1px solid rgba(255,255,255,.07);
  padding: 9px 0;
  overflow: hidden;
  white-space: nowrap;
}
.ticker-inner {
  display: inline-flex;
  gap: 0;
  animation: ticker-scroll 28s linear infinite;
}
.ticker-bar:hover .ticker-inner { animation-play-state: paused }
@keyframes ticker-scroll {
  0%   { transform: translateX(0) }
  100% { transform: translateX(-50%) }
}
.ticker-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: rgba(255,255,255,.62);
  padding: 0 28px;
  font-weight: 500;
}
.ticker-item::after {
  content: '·';
  color: var(--secondary);
  font-size: 18px;
  line-height: 1;
  padding-left: 28px;
}
.ticker-item:last-child::after { display: none }
.ticker-item strong { color: rgba(255,255,255,.88); font-weight: 600 }

/* ── CLIENT LOGO STRIP (real company logos) ── */
.client-strip {
  background: var(--white);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 28px 0;
}
.client-strip-label {
  text-align: center;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--text-light);
  margin-bottom: 20px;
}
.client-logos-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
.client-logo-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: var(--steel);
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-mid);
  transition: var(--transition);
}
.client-logo-chip:hover {
  border-color: var(--ocean);
  color: var(--ocean);
  background: var(--ocean-light);
}
.client-logo-chip .chip-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--orange);
  flex-shrink: 0;
}
.client-logo-chip img {
  height: 22px;
  width: auto;
  object-fit: contain;
  filter: grayscale(1) opacity(.6);
  transition: var(--transition);
}
.client-logo-chip:hover img { filter: grayscale(0) opacity(1) }

/* ── STATS BAR — Port photo background ── */
.stats-bar-photo {
  position: relative;
  background: var(--navy);
  overflow: hidden;
}
.stats-bar-photo::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../assets/hero-port.jpg') center/cover no-repeat;
  opacity: .18;
}
.stats-bar-photo .container { position: relative; z-index: 2 }
.stats-bar-photo .stat-num { color: var(--white) }
.stats-bar-photo .stat-num .plus { color: var(--secondary) }
.stats-bar-photo .stat-label { color: rgba(255,255,255,.55) }
.stats-bar-photo .stat-item { border-right-color: rgba(255,255,255,.1) }
.stats-bar-photo .stat-item:hover { background: rgba(255,255,255,.06) }

/* ── SERVICES FEATURED HERO CARD ── */
.service-hero-card {
  background: var(--navy);
  border-radius: var(--radius-md);
  padding: 32px 28px;
  position: relative;
  overflow: hidden;
  border-bottom: 3px solid var(--orange);
  margin-bottom: 20px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
}
.service-hero-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../assets/services/vessel-chartering.webp') center/cover no-repeat;
  opacity: .1;
}
.service-hero-card > * { position: relative; z-index: 2 }
.service-hero-eyebrow {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--secondary);
  margin-bottom: 8px;
}
.service-hero-card h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 28px;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 10px;
}
.service-hero-card p {
  font-size: 13.5px;
  color: rgba(255,255,255,.62);
  line-height: 1.65;
  max-width: 520px;
}
.service-hero-badge {
  background: var(--orange);
  color: var(--white);
  font-size: 12px;
  font-weight: 700;
  padding: 10px 20px;
  border-radius: var(--radius-sm);
  white-space: nowrap;
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: center;
}
.service-hero-badge:hover { background: var(--orange-dark); transform: translateY(-1px) }

/* ── WHY SECTION — Light background ── */
.why-section-light {
  background: var(--steel);
  padding: 80px 0;
  border-top: 1px solid var(--border);
}
.why-icon-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 32px;
}
.why-icon-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 22px 20px;
  border-left: 4px solid var(--orange);
  transition: var(--transition);
}
.why-icon-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px) }
.why-icon-wrap {
  width: 44px; height: 44px;
  background: rgba(63,169,245,.1);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 12px;
}
.why-icon-card h4 {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 7px;
}
.why-icon-card p {
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.65;
}
.why-light-title { color: var(--navy) }
.why-light-eyebrow { color: var(--primary) }

/* ── TESTIMONIALS — Real client quote format ── */
.testi-card-real {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 28px 24px;
  transition: var(--transition);
  position: relative;
  display: flex;
  flex-direction: column;
}
.testi-card-real:hover { box-shadow: var(--shadow-md); transform: translateY(-2px) }
.testi-stars-row { display: flex; gap: 3px; margin-bottom: 14px }
.testi-stars-row span { color: var(--orange); font-size: 15px }
.testi-quote-text {
  font-size: 14px;
  line-height: 1.75;
  color: var(--text-mid);
  font-style: italic;
  margin-bottom: 20px;
  flex: 1;
  position: relative;
  padding-left: 18px;
}
.testi-quote-text::before {
  content: 'C';
  position: absolute;
  left: 0;
  top: -4px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 48px;
  font-weight: 800;
  color: var(--primary);
  line-height: 1;
  opacity: .35;
}
.testi-real-author {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.testi-real-avatar {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--ocean-light);
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 18px;
  color: var(--ocean);
  flex-shrink: 0;
}
.testi-real-name { font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 2px }
.testi-real-role { font-size: 12px; color: var(--text-light) }
.testi-real-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  background: var(--ocean-light);
  color: var(--ocean);
  padding: 2px 8px;
  border-radius: 10px;
  margin-top: 4px;
}

/* ── FAQ SECTION ── */
.faq-section {
  background: var(--white);
  padding: 80px 0;
  border-top: 1px solid var(--border);
}
.faq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 48px;
}
.faq-item-card {
  background: var(--steel);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: var(--transition);
}
.faq-item-card:hover { border-color: var(--ocean) }
.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 18px 20px;
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  line-height: 1.4;
}
.faq-question:hover { color: var(--ocean) }
.faq-chevron {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--white);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: var(--transition);
  font-size: 13px;
  color: var(--text-light);
}
.faq-item-card.open .faq-chevron {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--white);
  transform: rotate(180deg);
}
.faq-answer {
  display: none;
  padding: 0 20px 18px;
  font-size: 13.5px;
  color: var(--text-mid);
  line-height: 1.72;
  border-top: 1px solid var(--border);
  padding-top: 14px;
}
.faq-item-card.open .faq-answer { display: block }
.faq-cta-row { text-align: center; margin-top: 40px }

/* ── FREIGHT COST ESTIMATOR ── */
.estimator-section {
  background: var(--navy);
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}
.estimator-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 56px 56px;
}
.estimator-section .container { position: relative; z-index: 2 }
.estimator-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}
.estimator-copy { }
.estimator-eyebrow { color: var(--secondary); margin-bottom: 12px }
.estimator-title { color: var(--white); margin-bottom: 16px }
.estimator-desc { font-size: 14.5px; color: rgba(255,255,255,.62); line-height: 1.72; margin-bottom: 28px }
.estimator-trust { display: flex; flex-direction: column; gap: 10px }
.est-trust-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: rgba(255,255,255,.62);
}
.est-trust-icon {
  width: 28px; height: 28px;
  background: rgba(255,255,255,.08);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}
.est-trust-item strong { color: rgba(255,255,255,.9) }
/* Estimator form card */
.estimator-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-lg);
  padding: 28px;
}
.estimator-card h3 {
  font-size: 18px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 4px;
}
.estimator-card .sub {
  font-size: 12px;
  color: rgba(255,255,255,.42);
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.est-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px }
.est-field {
  width: 100%;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: var(--radius-sm);
  padding: 11px 14px;
  font-size: 13px;
  color: var(--white);
  margin-bottom: 10px;
  outline: none;
  transition: var(--transition);
}
.est-field::placeholder { color: rgba(255,255,255,.32) }
.est-field:focus { border-color: var(--orange); background: rgba(255,255,255,.1) }
.est-field option { background: var(--navy); color: var(--white) }
.est-result {
  background: rgba(63,169,245,.15);
  border: 1px solid rgba(239,68,68,.3);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  margin: 12px 0;
  display: none;
}
.est-result.show { display: block }
.est-result-label { font-size: 11px; font-weight: 700; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px }
.est-result-value { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 32px; color: var(--primary); line-height: 1 }
.est-result-note { font-size: 11px; color: rgba(255,255,255,.42); margin-top: 5px }
.est-disclaimer { font-size: 11px; color: rgba(255,255,255,.3); margin-top: 10px; line-height: 1.5; text-align: center }

/* ── RESPONSIVE: new sections ── */
@media(max-width:1024px){
  .estimator-grid { grid-template-columns: 1fr; gap: 36px }
  .service-hero-card { grid-template-columns: 1fr }
  .service-hero-badge { align-self: flex-start }
  .faq-grid { grid-template-columns: 1fr }
  .why-icon-grid { grid-template-columns: 1fr }
}
@media(max-width:768px){
  .ticker-bar { display: none }
  .client-logos-row { gap: 8px }
  .client-logo-chip { font-size: 12px; padding: 8px 12px }
  .service-hero-card { padding: 22px 18px }
  .service-hero-card h3 { font-size: 22px }
  .est-row { grid-template-columns: 1fr }
  .estimator-card { padding: 20px }
  .why-section-light { padding: 48px 0 }
  .faq-section { padding: 48px 0 }
  .estimator-section { padding: 48px 0 }
}

/* ════════════════════════════════════════════
   TRANSMAX-QUALITY VISUAL LAYER
   Real images everywhere, split layouts,
   photo overlays, geometric accents
   D-Tech Enterprises · July 2026
════════════════════════════════════════════ */

/* ── HERO with full-bleed port background ── */
.hero-v2 {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--navy);
}
.hero-v2-bg {
  position: absolute;
  inset: 0;
  background: url('../assets/hero-port.jpg') center/cover no-repeat;
  opacity: .22;
  transform: scale(1.04);
  transition: transform 8s ease;
}
.hero-v2:hover .hero-v2-bg { transform: scale(1.0) }
.hero-v2-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, rgba(30,58,95,.97) 0%, rgba(30,58,95,.88) 45%, rgba(30,58,95,.4) 100%);
}
.hero-v2 .container { position: relative; z-index: 3 }
.hero-v2-inner {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 56px;
  align-items: center;
  padding: 80px 0;
}
/* Hero image panel — like Transmax airplane */
.hero-v2-img-panel {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-v2-img-main {
  width: 100%;
  max-width: 460px;
  height: 340px;
  object-fit: cover;
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(0,0,0,.4);
  position: relative;
  z-index: 2;
}
.hero-v2-img-badge {
  position: absolute;
  bottom: -20px;
  left: -20px;
  background: var(--orange);
  color: var(--white);
  padding: 16px 20px;
  border-radius: var(--radius-md);
  text-align: center;
  z-index: 3;
  box-shadow: 0 8px 24px rgba(63,169,245,.4);
}
.hero-v2-img-badge .num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 36px;
  font-weight: 800;
  line-height: 1;
  display: block;
}
.hero-v2-img-badge .lbl {
  font-size: 11px;
  font-weight: 600;
  opacity: .85;
  display: block;
  margin-top: 2px;
}
/* Orange geometric accent — Transmax style */
.hero-v2-accent {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 80px;
  height: 80px;
  background: var(--orange);
  opacity: .2;
  border-radius: 6px;
  transform: rotate(12deg);
  z-index: 1;
}
.hero-v2-accent-2 {
  position: absolute;
  bottom: 40px;
  right: -28px;
  width: 48px;
  height: 48px;
  background: var(--ocean);
  opacity: .3;
  border-radius: 4px;
  transform: rotate(8deg);
  z-index: 1;
}

/* ── ABOUT / INTRO SPLIT — Transmax style ── */
.about-split {
  padding: 96px 0;
  background: var(--white);
}
.about-split-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: center;
}
.about-split-img {
  position: relative;
}
.about-split-img-main {
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}
.about-split-img-secondary {
  position: absolute;
  bottom: -28px;
  right: -28px;
  width: 48%;
  height: 200px;
  object-fit: cover;
  border-radius: 10px;
  border: 4px solid var(--white);
  box-shadow: 0 12px 40px rgba(0,0,0,.18);
}
.about-exp-badge {
  position: absolute;
  top: 24px;
  left: -20px;
  background: var(--orange);
  color: var(--white);
  padding: 18px 20px;
  border-radius: var(--radius-md);
  text-align: center;
  box-shadow: 0 8px 28px rgba(63,169,245,.4);
  z-index: 2;
}
.about-exp-badge .num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 42px;
  font-weight: 800;
  line-height: 1;
  display: block;
}
.about-exp-badge .lbl {
  font-size: 11px;
  font-weight: 600;
  opacity: .88;
  display: block;
  margin-top: 3px;
}
.about-content {}
.about-title { color: var(--navy); margin-bottom: 16px }
.about-lead { font-size: 15px; color: var(--text-mid); line-height: 1.75; margin-bottom: 20px }
.about-body { font-size: 13.5px; color: var(--text-light); line-height: 1.75; margin-bottom: 28px }
.about-checks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 32px;
}
.about-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--navy);
}
.about-check::before {
  content: '';
  width: 18px;
  height: 18px;
  background: var(--orange);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");
  background-size: 11px;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}
/* Client count badge inline */
.about-client-badge {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: var(--steel);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 18px;
  margin-bottom: 28px;
}
.about-client-badge .num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 32px;
  font-weight: 800;
  color: var(--primary);
  line-height: 1;
}
.about-client-badge .txt { font-size: 12px; color: var(--text-mid); line-height: 1.4 }
.about-client-badge .txt strong { display: block; font-size: 13px; color: var(--navy) }

/* ── SERVICE CARDS WITH IMAGE OVERLAY ── */
.service-card-v2 {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  height: 220px;
  cursor: pointer;
  border: none;
}
.service-card-v2-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform .5s ease;
}
.service-card-v2:hover .service-card-v2-bg { transform: scale(1.07) }
.service-card-v2-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(30,58,95,.3) 0%, rgba(30,58,95,.88) 100%);
  transition: var(--transition);
}
.service-card-v2:hover .service-card-v2-overlay {
  background: linear-gradient(180deg, rgba(30,58,95,.5) 0%, rgba(30,58,95,.95) 100%);
}
.service-card-v2-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px;
  z-index: 2;
}
.service-card-v2-num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--secondary);
  margin-bottom: 4px;
}
.service-card-v2-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 6px;
  line-height: 1.3;
}
.service-card-v2-desc {
  font-size: 12px;
  color: rgba(255,255,255,.68);
  line-height: 1.5;
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease, opacity .35s ease;
  opacity: 0;
}
.service-card-v2:hover .service-card-v2-desc {
  max-height: 60px;
  opacity: 1;
}
.service-card-v2-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: var(--secondary);
  margin-top: 8px;
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease, opacity .35s ease;
  opacity: 0;
}
.service-card-v2:hover .service-card-v2-link { max-height: 30px; opacity: 1 }
/* Featured vessel chartering card */
.service-card-v2.featured {
  height: 100%;
  min-height: 460px;
  grid-row: span 2;
}
.service-card-v2.featured .service-card-v2-content { padding: 28px }
.service-card-v2.featured .service-card-v2-title { font-size: 22px }
.service-card-v2.featured .service-card-v2-desc { max-height: 100px; opacity: 1; font-size: 13px }
.service-card-v2.featured .service-card-v2-link { max-height: 40px; opacity: 1 }
/* Services grid */
.services-v2-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 14px;
}

/* ── CAPABILITIES STRIP — Photo BG like Transmax trucks row ── */
.capabilities-strip {
  position: relative;
  padding: 72px 0;
  overflow: hidden;
}
.capabilities-strip-bg {
  position: absolute;
  inset: 0;
  background: url('../assets/nhava-terminal.jpg') center/cover no-repeat;
}
.capabilities-strip-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(30,58,95,.96) 0%, rgba(30,58,95,.85) 60%, rgba(30,58,95,.7) 100%);
}
.capabilities-strip .container { position: relative; z-index: 2 }
.capabilities-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.capability-item {
  padding: 28px 24px;
  border-right: 1px solid rgba(255,255,255,.1);
  position: relative;
  transition: var(--transition);
}
.capability-item:last-child { border-right: none }
.capability-item:hover { background: rgba(255,255,255,.05) }
.capability-num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--secondary);
  margin-bottom: 10px;
}
.capability-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 10px;
  line-height: 1.25;
}
.capability-desc {
  font-size: 12.5px;
  color: rgba(255,255,255,.55);
  line-height: 1.6;
}

/* ── WHY XYLEM — Image left, content right (Transmax style) ── */
.why-split {
  padding: 96px 0;
  background: var(--steel);
}
.why-split-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: center;
}
.why-split-img {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  height: 500px;
}
.why-split-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.why-split-img-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(0deg, rgba(30,58,95,.9) 0%, transparent 60%);
  padding: 24px;
}
.why-split-img-stat {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 42px;
  color: var(--white);
  line-height: 1;
}
.why-split-img-stat span { color: var(--secondary) }
.why-split-img-stat-label {
  font-size: 12px;
  color: rgba(255,255,255,.65);
  margin-top: 3px;
}
/* Orange bar accent line — Transmax signature */
.orange-bar {
  width: 52px;
  height: 4px;
  background: var(--orange);
  margin-bottom: 20px;
  border-radius: 2px;
}
.why-points { display: flex; flex-direction: column; gap: 0 }
.why-point {
  display: flex;
  gap: 18px;
  padding: 20px 0;
  border-bottom: 1px solid var(--border);
  align-items: flex-start;
  transition: var(--transition);
}
.why-point:last-child { border-bottom: none }
.why-point:hover .why-point-icon { background: var(--orange); color: var(--white) }
.why-point-icon {
  width: 48px;
  height: 48px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  transition: var(--transition);
}
.why-point-body h4 {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 5px;
}
.why-point-body p {
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── STATS SECTION — Full-bleed photo ── */
.stats-v2 {
  position: relative;
  padding: 72px 0;
  overflow: hidden;
}
.stats-v2-bg {
  position: absolute;
  inset: 0;
  background: url('../assets/hero-port.jpg') center/cover no-repeat;
}
.stats-v2-overlay {
  position: absolute;
  inset: 0;
  background: rgba(30,58,95,.88);
}
.stats-v2 .container { position: relative; z-index: 2 }
.stats-v2-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 0;
}
.stats-v2-item {
  text-align: center;
  padding: 24px 16px;
  border-right: 1px solid rgba(255,255,255,.12);
  position: relative;
}
.stats-v2-item:last-child { border-right: none }
.stats-v2-icon {
  font-size: 32px;
  margin-bottom: 12px;
  display: block;
}
.stats-v2-num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 44px;
  color: var(--white);
  line-height: 1;
  margin-bottom: 6px;
}
.stats-v2-num .plus { color: var(--secondary) }
.stats-v2-label {
  font-size: 11px;
  color: rgba(255,255,255,.55);
  text-transform: uppercase;
  letter-spacing: .8px;
  font-weight: 600;
}

/* ── TESTIMONIALS — Photo background like Transmax ── */
.testi-v2 {
  position: relative;
  padding: 96px 0;
  overflow: hidden;
}
.testi-v2-bg {
  position: absolute;
  inset: 0;
  background: url('../assets/nhava-terminal.jpg') center 60%/cover no-repeat;
}
.testi-v2-overlay {
  position: absolute;
  inset: 0;
  background: rgba(30,58,95,.94);
}
.testi-v2 .container { position: relative; z-index: 2 }
.testi-v2-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  margin-top: 48px;
}
.testi-v2-card {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-md);
  padding: 28px 24px;
  transition: var(--transition);
  position: relative;
}
.testi-v2-card:hover {
  background: rgba(255,255,255,.12);
  border-color: var(--orange);
  transform: translateY(-3px);
}
.testi-v2-stars { display: flex; gap: 3px; margin-bottom: 14px }
.testi-v2-stars span { color: var(--orange); font-size: 15px }
.testi-v2-quote {
  font-size: 13.5px;
  color: rgba(255,255,255,.75);
  line-height: 1.75;
  font-style: italic;
  margin-bottom: 22px;
  position: relative;
  padding-left: 18px;
}
.testi-v2-quote::before {
  content: 'C';
  position: absolute;
  left: 0;
  top: -6px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 52px;
  font-weight: 800;
  color: var(--secondary);
  line-height: 1;
  opacity: .5;
}
.testi-v2-author {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.testi-v2-avatar {
  width: 46px; height: 46px;
  border-radius: 50%;
  background: var(--orange);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 18px;
  color: var(--white);
  flex-shrink: 0;
}
.testi-v2-name { font-size: 14px; font-weight: 700; color: var(--white); margin-bottom: 2px }
.testi-v2-role { font-size: 11.5px; color: rgba(255,255,255,.5) }
.testi-v2-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  background: rgba(63,169,245,.25);
  color: var(--orange);
  padding: 2px 8px;
  border-radius: 10px;
  margin-top: 3px;
}

/* ── PROCESS SECTION — On dark photo background ── */
.process-v2 {
  position: relative;
  padding: 96px 0;
  overflow: hidden;
  background: var(--navy);
}
.process-v2-bg {
  position: absolute;
  inset: 0;
  background: url('../assets/proof/gateway-coverage.webp') center/cover no-repeat;
  opacity: .15;
}
.process-v2 .container { position: relative; z-index: 2 }
.process-v2-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  margin-top: 52px;
}
.process-v2-step {
  text-align: center;
  position: relative;
}
/* Connector line */
.process-v2-step:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 28px;
  left: calc(50% + 28px);
  width: calc(100% - 56px);
  height: 2px;
  background: linear-gradient(90deg, var(--orange), rgba(63,169,245,.2));
}
.process-v2-num {
  width: 56px;
  height: 56px;
  background: var(--orange);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 20px;
  color: var(--white);
  margin: 0 auto 18px;
  position: relative;
  z-index: 2;
  box-shadow: 0 4px 16px rgba(63,169,245,.4);
  transition: var(--transition);
}
.process-v2-step:hover .process-v2-num {
  background: var(--white);
  color: var(--orange);
  transform: scale(1.1);
}
.process-v2-icon { font-size: 20px; margin-bottom: 4px; display: block }
.process-v2-title {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 8px;
  line-height: 1.3;
}
.process-v2-desc {
  font-size: 11.5px;
  color: rgba(255,255,255,.5);
  line-height: 1.6;
}

/* ── INSIGHTS / BLOG — Real photo cards ── */
.insights-v2 {
  padding: 96px 0;
  background: var(--white);
  border-top: 1px solid var(--border);
}
.insights-v2-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.insight-v2-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: var(--transition);
}
.insight-v2-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px) }
.insight-v2-thumb {
  position: relative;
  height: 200px;
  overflow: hidden;
}
.insight-v2-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
  display: block;
}
.insight-v2-card:hover .insight-v2-thumb img { transform: scale(1.06) }
.insight-v2-tag {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--orange);
  color: var(--white);
  font-size: 10px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.insight-v2-body { padding: 20px }
.insight-v2-meta {
  display: flex;
  gap: 14px;
  font-size: 11.5px;
  color: var(--text-light);
  margin-bottom: 10px;
}
.insight-v2-meta span { display: flex; align-items: center; gap: 4px }
.insight-v2-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.4;
  margin-bottom: 10px;
}
.insight-v2-title a { color: inherit; transition: var(--transition) }
.insight-v2-title a:hover { color: var(--primary) }
.insight-v2-excerpt {
  font-size: 12.5px;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 16px;
}
.insight-v2-link {
  font-size: 12px;
  font-weight: 700;
  color: var(--ocean);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: var(--transition);
}
.insight-v2-link:hover { color: var(--primary); gap: 8px }

/* ── CTA STRIP — Transmax style orange band ── */
.cta-v2 {
  position: relative;
  padding: 80px 0;
  background: var(--orange);
  overflow: hidden;
}
.cta-v2::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 40px 40px;
}
.cta-v2-inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: center;
}
.cta-v2-text h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(28px, 3.5vw, 42px);
  font-weight: 800;
  color: var(--white);
  margin-bottom: 10px;
  line-height: 1.05;
}
.cta-v2-text p {
  font-size: 15px;
  color: rgba(255,255,255,.8);
  line-height: 1.6;
  max-width: 520px;
}
.cta-v2-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
}
.btn-white {
  background: var(--white);
  color: var(--orange);
  font-size: 14px;
  font-weight: 700;
  padding: 14px 28px;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: var(--transition);
  white-space: nowrap;
  text-decoration: none;
  border: 2px solid var(--white);
}
.btn-white:hover { background: var(--navy); color: var(--white); border-color: var(--navy) }
.btn-outline-white {
  background: transparent;
  color: var(--white);
  font-size: 14px;
  font-weight: 700;
  padding: 13px 28px;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: var(--transition);
  white-space: nowrap;
  text-decoration: none;
  border: 2px solid rgba(255,255,255,.5);
}
.btn-outline-white:hover { background: rgba(255,255,255,.12); border-color: var(--white) }

/* ── SECTION LABEL STYLE (Transmax "Our Services in orange") ── */
.section-lead-orange {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 3.5vw, 38px);
  color: var(--navy);
  line-height: 1.05;
  margin-bottom: 0;
}
.section-lead-orange .highlight { color: var(--primary) }
.section-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 8px;
  display: block;
}

/* ── NHAVA BLOCK V2 ── */
.nhava-v2 {
  background: var(--navy);
  padding: 32px 0;
  position: relative;
  overflow: hidden;
}
.nhava-v2::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../assets/proof/jnpt-office.jpg') center/cover no-repeat;
  opacity: .1;
}
.nhava-v2 .container {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 28px;
}
.nhava-v2-icon {
  width: 60px;
  height: 60px;
  background: var(--orange);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  flex-shrink: 0;
}
.nhava-v2-text { flex: 1 }
.nhava-v2-text h3 {
  font-size: 17px;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 5px;
  line-height: 1.3;
}
.nhava-v2-text p {
  font-size: 13px;
  color: rgba(255,255,255,.6);
  line-height: 1.6;
}
.nhava-v2-badge {
  background: var(--orange);
  color: var(--white);
  font-size: 12px;
  font-weight: 700;
  padding: 12px 22px;
  border-radius: var(--radius-sm);
  white-space: nowrap;
  transition: var(--transition);
  text-decoration: none;
  flex-shrink: 0;
}
.nhava-v2-badge:hover { background: var(--orange-dark) }

/* ── OFFICES SECTION ── */
.offices-v2 { padding: 96px 0; background: var(--steel); border-top: 1px solid var(--border) }
.offices-v2-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; margin-top: 48px }
.office-v2-card {
  background: var(--white);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.office-v2-img {
  height: 180px;
  background: url('../assets/proof/jnpt-office.jpg') center/cover no-repeat;
  position: relative;
}
.office-v2-badge-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(0deg, rgba(30,58,95,.9), transparent);
  padding: 16px;
}
.office-v2-badge-text {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--secondary);
}
.office-v2-body { padding: 20px }
.office-v2-title { font-size: 16px; font-weight: 700; color: var(--navy); margin-bottom: 12px }
.office-v2-detail {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: var(--text-mid);
  margin-bottom: 7px;
  line-height: 1.5;
}
.office-v2-detail .icon { font-size: 14px; flex-shrink: 0; margin-top: 1px }
.office-v2-map {
  height: 300px;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}
#offices-map { height: 100% }

/* ── FAQ V2 — Cleaner ── */
.faq-v2 { padding: 96px 0; background: var(--white); border-top: 1px solid var(--border) }
.faq-v2-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 48px }
.faq-v2-item {
  background: var(--steel);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: var(--transition);
}
.faq-v2-item:hover { border-color: var(--orange) }
.faq-v2-item.open { border-color: var(--orange) }
.faq-v2-q {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 18px 20px;
  font-size: 14px;
  font-weight: 700;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  line-height: 1.4;
}
.faq-v2-q:hover { color: var(--primary) }
.faq-v2-chevron {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--white);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 12px;
  color: var(--text-light);
  transition: var(--transition);
}
.faq-v2-item.open .faq-v2-chevron {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--white);
  transform: rotate(180deg);
}
.faq-v2-a {
  display: none;
  padding: 0 20px 18px;
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.72;
  border-top: 1px solid var(--border);
  padding-top: 14px;
}
.faq-v2-item.open .faq-v2-a { display: block }

/* ── ESTIMATOR V2 ── */
.estimator-v2 {
  position: relative;
  padding: 96px 0;
  overflow: hidden;
  background: var(--navy);
}
.estimator-v2-bg {
  position: absolute;
  inset: 0;
  background: url('../assets/proof/gateway-coverage.webp') center/cover no-repeat;
  opacity: .1;
}
.estimator-v2 .container { position: relative; z-index: 2 }
.estimator-v2-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .hero-v2-inner,.about-split-grid,.why-split-grid,.estimator-v2-grid,.cta-v2-inner{
    grid-template-columns:1fr;gap:32px;
  }
  .services-v2-grid{grid-template-columns:1fr 1fr}
  .service-card-v2.featured{min-height:280px;grid-row:auto}
  .capabilities-grid{grid-template-columns:1fr 1fr}
  .stats-v2-grid{grid-template-columns:repeat(3,1fr)}
  .process-v2-grid{grid-template-columns:1fr 1fr 1fr}
  .testi-v2-grid{grid-template-columns:1fr}
  .faq-v2-grid{grid-template-columns:1fr}
  .offices-v2-grid{grid-template-columns:1fr}
  .insights-v2-grid{grid-template-columns:1fr 1fr}
  .about-split-img-secondary{display:none}
  .hero-v2-img-panel{display:none}
}
@media(max-width:768px){
  .hero-v2-inner{padding:48px 0}
  .about-split,.why-split,.process-v2,.insights-v2,
  .testi-v2,.offices-v2,.faq-v2,.estimator-v2{padding:56px 0}
  .services-v2-grid{grid-template-columns:1fr}
  .capabilities-grid,.stats-v2-grid{grid-template-columns:1fr 1fr}
  .process-v2-grid{grid-template-columns:1fr 1fr}
  .process-v2-step::after{display:none}
  .cta-v2-inner{grid-template-columns:1fr}
  .insights-v2-grid{grid-template-columns:1fr}
  .about-exp-badge{display:none}
  .cta-v2-actions{flex-direction:row;flex-wrap:wrap}
}
@media(max-width:480px){
  .capabilities-grid,.stats-v2-grid,.process-v2-grid{grid-template-columns:1fr}
  .capability-item{border-right:none;border-bottom:1px solid rgba(255,255,255,.1)}
  .stats-v2-item{border-right:none;border-bottom:1px solid rgba(255,255,255,.12)}
}