/* =====================================================================
   TALYNEX MODERN DESIGN LAYER  (loads last – sitewide)
   Light + dark mode driven by html[data-theme]; falls back to light.
   Section rhythm: white  →  soft grey  →  deep-blue band  (never all blue)
   ===================================================================== */

:root{
  --tx-navy:#041735; --tx-navy-2:#0a2a63; --tx-blue:#0b57d0; --tx-blue-2:#3b82f6;
  --tx-gold:#f7b718; --tx-orange:#f97316;
  --tx-bg:#ffffff; --tx-soft:#f2f6fc; --tx-card:#ffffff;
  --tx-ink:#0b1b3a; --tx-ink-2:#3b4b68; --tx-line:#e1e8f4;
  --tx-accent-text:#0b57d0; --tx-eyebrow:#b86e00;
  --tx-shadow:0 1px 2px rgba(4,23,53,.04),0 14px 34px rgba(4,23,53,.08);
  --tx-shadow-lg:0 2px 4px rgba(4,23,53,.05),0 28px 60px rgba(4,23,53,.16);
  --tx-r:22px;
}
html[data-theme="dark"]{
  --tx-bg:#061126; --tx-soft:#0a1a36; --tx-card:#0e2347;
  --tx-ink:#f1f6ff; --tx-ink-2:#bccbe2; --tx-line:#23406f;
  --tx-accent-text:#8db7ff; --tx-eyebrow:#ffc94d;
  --tx-shadow:0 1px 2px rgba(0,0,0,.3),0 14px 34px rgba(0,0,0,.35);
  --tx-shadow-lg:0 2px 4px rgba(0,0,0,.4),0 28px 60px rgba(0,0,0,.5);
}

/* ---------- base ---------- */
html body{background:var(--tx-bg);color:var(--tx-ink-2);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html body h1,html body h2,html body h3{letter-spacing:-.02em}
html body .section h2,html body .section-head h2{font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.12}
html body .eyebrow{color:var(--tx-eyebrow);letter-spacing:.14em}
html body .eyebrow:before{background:linear-gradient(90deg,var(--tx-gold),var(--tx-orange));height:3px;border-radius:3px}
html body :focus-visible{outline:3px solid var(--tx-gold);outline-offset:3px;border-radius:8px}

/* ---------- sections: light / soft / blue rhythm ---------- */
html body .section{padding:clamp(60px,8vw,96px) 0}
html body .section.soft,html body .soft{background:var(--tx-soft)}
html body .section h2,html body .section h3{color:var(--tx-ink)}
html body .section p{color:var(--tx-ink-2)}
html body .section-head p,html body .muted{color:var(--tx-ink-2)}

/* blue band helper – text always light inside */
html body .tx-band,html body .section.tx-band{
  position:relative;overflow:hidden;color:#d8e4f8;
  background:radial-gradient(900px 420px at 90% -10%,rgba(247,183,24,.16),transparent 60%),
             radial-gradient(700px 420px at -5% 110%,rgba(59,130,246,.28),transparent 60%),
             linear-gradient(135deg,#041735,#0a2a63 70%,#0b3a86);
}
html body .tx-band h1,html body .tx-band h2,html body .tx-band h3{color:#fff}
html body .tx-band p,html body .tx-band li{color:#d0def4}
html body .tx-band .eyebrow{color:#ffd467}

/* ---------- header ---------- */
html body .site-header{background:rgba(255,255,255,.88);backdrop-filter:saturate(1.6) blur(18px);-webkit-backdrop-filter:saturate(1.6) blur(18px);border-bottom:1px solid rgba(4,23,53,.07);box-shadow:0 6px 24px rgba(4,23,53,.05)}
html[data-theme="dark"] body .site-header,html[data-theme="dark"] .site-header{background:rgba(6,17,38,.86);border-bottom-color:rgba(255,255,255,.08)}
html body .nav-links a{color:var(--tx-ink);font-weight:700}
html body .nav-links a:hover,html body .nav-links a.active{color:var(--tx-accent-text)}
html body .btn-primary,html body .nav-quote{background:linear-gradient(135deg,#0b57d0,#2f7bff);box-shadow:0 10px 26px rgba(11,87,208,.32);border-radius:14px}
html body .btn{border-radius:14px}
html body .btn-primary:hover{box-shadow:0 16px 34px rgba(11,87,208,.4)}
html body .btn-accent{background:linear-gradient(135deg,#ffc83a,#f7a600);color:#041735;box-shadow:0 10px 26px rgba(247,166,0,.32)}
html body .btn-outline{border:1.5px solid var(--tx-blue);color:var(--tx-accent-text);background:transparent}
html body .btn-outline:hover{background:var(--tx-blue);color:#fff}
html body .topbar{background:linear-gradient(90deg,#041735,#0a2a63)}

/* ---------- page hero (inner pages) ---------- */
html body .page-hero{position:relative;overflow:hidden;padding:clamp(70px,9vw,118px) 0 clamp(56px,7vw,88px);
  background:linear-gradient(100deg,rgba(4,23,53,.95) 0%,rgba(8,38,92,.82) 55%,rgba(11,87,208,.55) 100%),url('../img/hero2.webp') center/cover}
html body .page-hero:after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(247,183,24,.28),transparent 65%);pointer-events:none}
html body .page-hero h1{font-size:clamp(2.2rem,5vw,3.8rem);color:#fff;margin-bottom:14px}
html body .page-hero .lead,html body .page-hero p{color:#d6e3f8}
html body .page-hero .eyebrow{color:#ffd467}
html body .crumb,html body .crumb a{color:#cfdcf1}
html body .crumb a{color:#ffd467;font-weight:600}

/* ---------- generic cards ---------- */
html body .card,html body .product-card,html body .insight-card,html body .team-card{
  background:var(--tx-card);border:1px solid var(--tx-line);border-radius:var(--tx-r);box-shadow:var(--tx-shadow);color:var(--tx-ink-2)}
html body .card:hover,html body .product-card:hover,html body .insight-card:hover,html body .team-card:hover{transform:translateY(-6px);box-shadow:var(--tx-shadow-lg)}
html body .card h3,html body .product-card h3,html body .insight-card h3,html body .team-card h3,html body .team-card h4{color:var(--tx-ink)}
html body .icon{background:linear-gradient(135deg,#f7b718,#f97316);color:#041735;border-radius:18px;box-shadow:0 10px 22px rgba(249,115,22,.28)}
html body .stat{background:var(--tx-card);border:1px solid var(--tx-line);box-shadow:var(--tx-shadow)}
html body .stat strong{color:var(--tx-accent-text)}
html body .price{color:var(--tx-accent-text)}
html body .badge{background:rgba(247,183,24,.18);color:#8a5200}
html[data-theme="dark"] .badge{color:#ffd467}

/* ---------- forms ---------- */
html body .contact-form{background:var(--tx-card);border:1px solid var(--tx-line);box-shadow:var(--tx-shadow-lg);border-radius:28px}
html body .contact-panel{background:radial-gradient(500px 300px at 100% 0,rgba(247,183,24,.18),transparent 60%),linear-gradient(160deg,#041735,#0a2a63);border-radius:28px;box-shadow:var(--tx-shadow-lg)}
html body .contact-panel h2,html body .contact-panel h3{color:#fff}
html body .contact-panel,html body .contact-panel p,html body .contact-panel li,html body .contact-panel a,html body .contact-panel span{color:#d6e3f8}
html body .contact-panel .eyebrow{color:#ffd467}
html body .contact-panel i{color:#ffc83a}
html body .field label,html body .contact-form label{color:var(--tx-ink);font-weight:700}
html body .field input,html body .field select,html body .field textarea{background:var(--tx-bg);color:var(--tx-ink);border:1.5px solid var(--tx-line);border-radius:14px;transition:border-color .2s,box-shadow .2s}
html body .field input:focus,html body .field select:focus,html body .field textarea:focus{border-color:var(--tx-blue-2);box-shadow:0 0 0 4px rgba(59,130,246,.2);outline:none}
html body .field input::placeholder,html body .field textarea::placeholder{color:var(--tx-ink-2);opacity:.65}

/* ---------- footer ---------- */
html body .footer{background:radial-gradient(700px 300px at 85% 0,rgba(247,183,24,.1),transparent 60%),linear-gradient(180deg,#041735,#030f26);border-top:4px solid var(--tx-gold)}
html body .footer h3,html body .footer h4{color:#fff}
html body .footer a:hover{color:var(--tx-gold)}

/* ---------- floating buttons ---------- */
html body .whatsapp{box-shadow:0 14px 30px rgba(37,211,102,.4)}

/* =====================================================================
   HOMEPAGE
   ===================================================================== */

/* ratings strip – floats over the hero edge */
html body .rk{background:var(--tx-bg);padding:0 0 8px}
html body .rk .rk-card{background:var(--tx-card);border:1px solid var(--tx-line);box-shadow:var(--tx-shadow);color:var(--tx-ink)}
html body .rk .rk-card *{color:inherit}
html body .rk .rk-card b,html body .rk .rk-card strong{color:var(--tx-ink)}

/* TRACK RECORD → white section with elevated stat cards */
html body .impact-section{background:var(--tx-bg);color:var(--tx-ink-2);position:relative}
html body .impact-section:before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 100% 0,rgba(11,87,208,.07),transparent 70%),radial-gradient(500px 260px at 0 100%,rgba(247,183,24,.09),transparent 70%);pointer-events:none}
html body .impact-section .container{position:relative}
html body .impact-section h2{color:var(--tx-ink)}
html body .impact-section .muted,html body .impact-section p{color:var(--tx-ink-2)}
html body .impact-section .eyebrow{color:var(--tx-eyebrow)}
html body .experience-unified-panel{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
html body .experience-panel-intro{display:none}
html body .experience-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;border:0!important}
html body .experience-metric{position:relative;overflow:hidden;text-align:left;padding:26px 24px;border-radius:24px!important;background:var(--tx-card)!important;border:1px solid var(--tx-line)!important;box-shadow:var(--tx-shadow);transition:transform .25s,box-shadow .25s}
html body .experience-metric:hover{transform:translateY(-6px);box-shadow:var(--tx-shadow-lg)}
html body .experience-metric:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--tx-gold),var(--tx-orange))}
html body .experience-metric:nth-child(2):before{background:linear-gradient(90deg,#0b57d0,#3b82f6)}
html body .experience-metric:nth-child(3):before{background:linear-gradient(90deg,#0d9488,#10b981)}
html body .experience-metric:nth-child(4):before{background:linear-gradient(90deg,#7c3aed,#a78bfa)}
html body .experience-metric-icon{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;font-size:1.6rem;margin-bottom:16px;background:linear-gradient(135deg,#f7b718,#f97316)!important;color:#fff!important;box-shadow:0 12px 24px rgba(249,115,22,.3)}
html body .experience-metric:nth-child(2) .experience-metric-icon{background:linear-gradient(135deg,#0b57d0,#3b82f6)!important;box-shadow:0 12px 24px rgba(11,87,208,.3)}
html body .experience-metric:nth-child(3) .experience-metric-icon{background:linear-gradient(135deg,#0d9488,#10b981)!important;box-shadow:0 12px 24px rgba(13,148,136,.3)}
html body .experience-metric:nth-child(4) .experience-metric-icon{background:linear-gradient(135deg,#7c3aed,#a78bfa)!important;box-shadow:0 12px 24px rgba(124,58,237,.3)}
html body .experience-metric strong{display:block;font-family:Manrope,Inter,sans-serif;font-size:clamp(2.2rem,4vw,3rem);line-height:1;color:var(--tx-ink)!important}
html body .experience-metric h3{margin:8px 0 0;font-size:1rem;font-weight:600;color:var(--tx-ink-2)!important}

/* WHY TALYNEX → keeps a deep-blue band, but cleaner cards */
html body .delivery-section{background:radial-gradient(800px 380px at 100% 0,rgba(247,183,24,.14),transparent 60%),linear-gradient(135deg,#041735,#0a2a63 70%,#0b3a86)}
html body .delivery-intro h2{color:#fff}
html body .delivery-intro p{color:#d0def4}
html body .delivery-card{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.16)!important;backdrop-filter:blur(8px);border-radius:24px!important}
html body .delivery-card h3{color:#fff!important}
html body .delivery-card p{color:#cfdcf2!important}
html body .delivery-icon{background:linear-gradient(135deg,#ffc83a,#f7a600)!important;color:#041735!important;border-radius:20px!important;width:64px;height:64px;display:grid;place-items:center;font-size:1.5rem;box-shadow:0 12px 26px rgba(247,166,0,.35)}

/* HOW IT WORKS (home) → matches the Services page look */
html body .pw{background:var(--tx-bg);padding:clamp(60px,8vw,96px) 0}
html body .pw-head{text-align:center;max-width:680px;margin:0 auto 38px}
html body .pw-tag{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:99px;background:rgba(11,87,208,.1);color:var(--tx-accent-text);font-weight:800;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
html body .pw-head h2{margin:14px 0 8px;color:var(--tx-ink);font-size:clamp(1.8rem,3.6vw,2.7rem)}
html body .pw-head p{color:var(--tx-ink-2);margin:0}
html body .pw-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:pw}
html body .pw-steps li{position:relative;overflow:hidden;display:block!important;padding:28px 24px 24px!important;border-radius:24px!important;background:var(--tx-card)!important;border:1px solid var(--tx-line)!important;box-shadow:var(--tx-shadow);transition:transform .25s,box-shadow .25s;counter-increment:pw}
html body .pw-steps li:hover{transform:translateY(-6px);box-shadow:var(--tx-shadow-lg)}
html body .pw-steps li:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--tx-gold),var(--tx-orange))}
html body .pw-steps li:after{content:"0" counter(pw);position:absolute;right:18px;top:14px;font:900 3.2rem/1 Manrope,Inter,sans-serif;color:var(--tx-blue);opacity:.1}
html body .pw-steps .pw-ic{position:relative;display:grid!important;place-items:center;width:62px!important;height:62px!important;margin:0 0 16px!important;border-radius:50%!important;background:linear-gradient(135deg,#f7b718,#f97316)!important;color:#041735!important;font-size:1.4rem!important;animation:tx-ring 3.2s infinite}
html body .pw-steps li:nth-child(2) .pw-ic,html body .pw-steps li:nth-child(5) .pw-ic{animation-delay:.8s}
html body .pw-steps li:nth-child(3) .pw-ic,html body .pw-steps li:nth-child(6) .pw-ic{animation-delay:1.6s}
html body .pw-steps .pw-step{display:block;margin:0 0 4px;color:var(--tx-eyebrow);font-weight:800;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase}
html body .pw-steps h3{margin:0 0 6px;font-size:1.18rem;color:var(--tx-ink)}
html body .pw-steps p{margin:0;color:var(--tx-ink-2);font-size:.96rem}
@keyframes tx-ring{0%{box-shadow:0 0 0 0 rgba(247,183,24,.55)}45%,100%{box-shadow:0 0 0 16px rgba(247,183,24,0)}}

/* warranty → navy glass strip with gold icons (like the Services "why" tiles) */
html body .pw-warranty{margin-top:30px;padding:30px;border-radius:26px;background:radial-gradient(500px 260px at 100% 0,rgba(247,183,24,.16),transparent 60%),linear-gradient(135deg,#041735,#0a2a63);border:0!important;box-shadow:var(--tx-shadow-lg)}
html body .pw-warranty h3{color:#fff!important;margin-bottom:18px}
html body .pw-warranty ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
html body .pw-warranty li{display:flex!important;flex-direction:column;gap:2px;padding:18px;border-radius:18px;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)}
html body .pw-warranty .pw-ic{display:grid!important;place-items:center;width:48px!important;height:48px!important;margin-bottom:10px!important;border-radius:14px!important;background:#f7b718!important;color:#041735!important;font-size:1.15rem!important;animation:none!important}
html body .pw-warranty strong{color:#fff!important;font-size:1.2rem}
html body .pw-warranty li span:not(.pw-ic){color:#c7d6ef!important}
html body .pw-warranty .pw-extend{display:flex;gap:12px;align-items:center;margin:18px 0 8px;padding:14px 18px;border-radius:16px;background:rgba(247,183,24,.16)!important;color:#ffe29a!important}
html body .pw-warranty .pw-extend *{color:#ffe9b3!important}
html body .pw-warranty .pw-extend i{color:#ffc83a!important}
html body .pw-warranty small{color:#aebfdc!important}

/* service cards in carousel: same icon treatment as the services page */
html body .services-grouped .service-card,html body .service-slide{border-radius:24px}

/* products / insights / brands sections */
html body .featured-products-section{background:var(--tx-bg)}
html body .trusted-brands-section{background:var(--tx-soft)}
html body .insights-preview{background:var(--tx-bg)}
html body .testimonials-section{background:var(--tx-soft)}
html body .loc-section{background:var(--tx-bg)}
html body .case-study-section{background:var(--tx-soft)}
html body .homepage-readable,html body .homepage-readable.soft{background:var(--tx-soft)}

/* final CTA */
html body .final-cta{background:var(--tx-bg)}

/* =====================================================================
   SERVICES (.sv) – theme-aware (fixes OS-only dark switch)
   ===================================================================== */
html body .sv{--t1:var(--tx-ink);--t2:var(--tx-ink-2);--card:var(--tx-card);--line:var(--tx-line);--bg0:var(--tx-bg);--bg1:var(--tx-soft)}
@media(prefers-color-scheme:dark){html body .sv{--t1:var(--tx-ink);--t2:var(--tx-ink-2);--card:var(--tx-card);--line:var(--tx-line);--bg0:var(--tx-bg);--bg1:var(--tx-soft)}}
html body .sv .sv-eye{color:var(--tx-accent-text)!important}
html body .sv .sv-go{color:var(--ink)!important}
html[data-theme="dark"] body .sv .sv-go{color:var(--inkd)!important}

/* BLUE band variant for sv sections */
html body .sv-sec.navy{background:radial-gradient(800px 380px at 100% 0,rgba(247,183,24,.14),transparent 60%),radial-gradient(700px 380px at 0 110%,rgba(59,130,246,.25),transparent 60%),linear-gradient(135deg,#041735,#0a2a63 70%,#0b3a86)}
html body .sv .sv-sec.navy .sv-head h2,html body .sv-sec.navy .sv-head h2{color:#fff!important}
html body .sv-sec.navy .sv-head p{color:#cfdcf2!important}
html body .sv-sec.navy .sv-eye{color:#ffd467!important}
html body .sv-sec.navy .sv-steps li{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);box-shadow:none;backdrop-filter:blur(8px)}
html body .sv-sec.navy .sv-steps h3{color:#fff!important}
html body .sv-sec.navy .sv-steps p{color:#cfdcf2!important}
html body .sv-sec.navy .sv-sn{color:#fff!important;opacity:.14!important}
html body .sv-sec.navy .sv-why li{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}

/* industries tiles (white section on Services) */
.sv-ind{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sv-ind a{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;padding:24px 22px;border-radius:22px;background:var(--tx-card);border:1px solid var(--tx-line);box-shadow:var(--tx-shadow);transition:transform .25s,box-shadow .25s,border-color .25s}
.sv-ind a:hover{transform:translateY(-6px);box-shadow:var(--tx-shadow-lg);border-color:var(--tx-blue-2)}
.sv-ind .ind-ico{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:1.35rem;color:#fff;margin-bottom:8px;background:linear-gradient(135deg,var(--a,#0b57d0),var(--b,#3b82f6));box-shadow:0 10px 22px rgba(4,23,53,.18)}
.sv-ind b{font-size:1.05rem;color:var(--tx-ink)}
.sv-ind span.ind-t{font-size:.9rem;color:var(--tx-ink-2);line-height:1.45}
.sv-ind .ind-go{margin-top:auto;padding-top:8px;font-weight:700;font-size:.88rem;color:var(--tx-accent-text)}

/* "why talynex" split block on services */
.sv-why2{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center}
.sv-why2 .sv-pic2{position:relative;border-radius:28px;overflow:hidden;box-shadow:var(--tx-shadow-lg)}
.sv-why2 .sv-pic2 img{display:block;width:100%;height:440px;object-fit:cover;object-position:center 15%}
.sv-why2 .sv-pic2 .float{position:absolute;left:18px;bottom:18px;display:flex;gap:12px;align-items:center;padding:14px 18px;border-radius:18px;background:rgba(4,23,53,.88);backdrop-filter:blur(10px);color:#fff}
.sv-why2 .float i{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#f7b718;color:#041735;font-size:1.1rem}
.sv-why2 .float b{display:block;font-size:1.3rem;color:#fff}
.sv-why2 .float small{color:#c7d6ef}
.sv-why2 h2{color:var(--tx-ink);font-size:clamp(1.7rem,3.2vw,2.4rem);margin:8px 0 12px}
.sv-why2 p{color:var(--tx-ink-2)}
.sv-why2 ul{list-style:none;margin:18px 0 24px;padding:0;display:grid;gap:12px}
.sv-why2 li{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:var(--tx-card);border:1px solid var(--tx-line)}
.sv-why2 li i{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(11,87,208,.12);color:var(--tx-accent-text)}
.sv-why2 li b{display:block;color:var(--tx-ink)}
.sv-why2 li span{font-size:.92rem;color:var(--tx-ink-2)}

/* =====================================================================
   OTHER PAGES – polish
   ===================================================================== */
/* about */
html body .principle,html body .about-principle,html body .mvv-card,html body .values-card{background:var(--tx-card);border:1px solid var(--tx-line);box-shadow:var(--tx-shadow);color:var(--tx-ink-2)}
html body .team-card{overflow:hidden}
html body .team-card p{color:var(--tx-ink-2)}

/* project / product / insight filters & chips */
html body .filter-btn,html body .project-filter button,html body .category-tab{border-radius:99px}

/* local seo pages */
html body .local-page .section h2{color:var(--tx-ink)}

/* tables */
html body table{border-collapse:separate;border-spacing:0;border-radius:16px;overflow:hidden}
html body table th{background:var(--tx-navy);color:#fff}
html body table td{color:var(--tx-ink-2);border-color:var(--tx-line)}

/* images */
html body main img{image-rendering:auto}

/* ---------- reveal on scroll (graceful when JS is slow) ---------- */
@media(prefers-reduced-motion:no-preference){
  .tx-rise{animation:tx-rise .7s both ease-out}
  @keyframes tx-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
}

/* ---------- responsive ---------- */
@media(max-width:980px){
  html body .experience-metrics{grid-template-columns:repeat(2,1fr)}
  html body .pw-steps{grid-template-columns:repeat(2,1fr)}
  html body .pw-warranty ul{grid-template-columns:repeat(2,1fr)}
  .sv-ind{grid-template-columns:repeat(2,1fr)}
  .sv-why2{grid-template-columns:1fr;gap:28px}
}
@media(max-width:620px){
  html body .experience-metrics{grid-template-columns:1fr 1fr;gap:12px}
  html body .experience-metric{padding:20px 16px}
  html body .pw-steps{grid-template-columns:1fr}
  html body .pw-warranty ul{grid-template-columns:1fr 1fr}
  .sv-ind{grid-template-columns:1fr}
  .sv-why2 .sv-pic2 img{height:300px}
}

/* ---------- dark containers inside light sections: keep text light ---------- */
html body .automation-shell,html body .automation-shell .automation-copy{color:#d0def4}
html body .automation-shell h2,html body .automation-shell h3,html body .automation-shell strong{color:#fff}
html body .automation-shell h2 span{color:#ffc83a}
html body .automation-shell p,html body .automation-shell li,html body .automation-shell small{color:#cfdcf2}
html body .automation-shell .eyebrow{color:#ffd467}
html body .automation-points>*{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16)}
html body .automation-points b,html body .automation-points strong{color:#fff}
html body .automation-points span,html body .automation-points small{color:#c7d6ef}

/* hero headline: a touch wider so it reads in 2–3 lines */
html body .hero-copy h1,html body .hero-copy .hero-title{max-width:19ch!important}
html body .pw-head{max-width:760px}
html body .pw-head h2{text-wrap:balance}
html body .sv-head h2,html body .section-head h2{text-wrap:balance}

/* carousel cards: equal heights */
html body .horizontal-carousel-track{align-items:stretch}

/* final CTA + footer legibility */
html body .final-cta .cta,html body .cta{background:radial-gradient(600px 300px at 100% 0,rgba(247,183,24,.2),transparent 60%),linear-gradient(120deg,#0b57d0,#06265e);color:#e3ecfb}
html body .cta h2,html body .cta h3{color:#fff}
html body .cta p,html body .cta li,html body .cta span:not(.btn){color:#dbe7fb}
html body .cta .eyebrow{color:#ffd467}
html body .footer,html body .footer p,html body .footer li,html body .footer span,html body .footer small{color:#bccbe3}
html body .footer a{color:#cfdcf2}
html body .footer h3,html body .footer h4,html body .footer strong{color:#fff}
html body .footer .footer-social-wrap>span{color:#ffc83a}

/* ---------- DARK MODE: service cards, carousel controls ---------- */
html[data-theme="dark"] body #services-carousel-track .service .icon,
html[data-theme="dark"] body .svc-card .icon{background:linear-gradient(135deg,var(--c1,#f7b718),var(--c2,#f97316))!important;color:#fff!important;border:0!important;box-shadow:0 12px 26px rgba(0,0,0,.4)}
html[data-theme="dark"] body #services-carousel-track .service .icon i,
html[data-theme="dark"] body .svc-card .icon i{color:#fff!important}
html[data-theme="dark"] body #services-carousel-track .service .link,
html[data-theme="dark"] body #services-carousel-track .service a.link{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18);color:var(--inkd,#ffd467)!important}
html[data-theme="dark"] body #services-carousel-track .service .link *{color:inherit!important}
html[data-theme="dark"] body .carousel-control{background:var(--tx-card)!important;color:#fff!important;border:1px solid var(--tx-line)!important}
html[data-theme="dark"] body .carousel-control i{color:#fff!important}
html body .carousel-control{box-shadow:var(--tx-shadow)}

@media(max-width:760px){.tx-band .container{grid-template-columns:1fr!important}}
html body .btn-light{background:#fff;color:#041735}
/* mission/values cards on About */
html body .section.soft .card{border-radius:24px}