/* ═══════════════════════════════════════════════════════════
   CRIMSON TECH — page components (loaded after style.css)
   Home sections · product sections · FAQ · two-pillar ·
   nav mega/mobile · MPA view transitions · reduced motion
═══════════════════════════════════════════════════════════ */

/* ── NAV MEGA + MOBILE ──────────────────────────────────────── */
.nav-dropdown-mega { min-width: 600px; }
#mobileNav .m-sec { padding-bottom:16px; border-bottom:1px solid var(--border); margin-bottom:24px; }
#mobileNav .m-title { font-family:var(--font-h); font-weight:700; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--text-faint); margin-bottom:12px; }
#mobileNav .m-link { display:block; font-size:15px; color:var(--text-muted); padding:9px 0; border-bottom:1px solid var(--border); }
#mobileNav .m-sec .m-link:last-child { border-bottom:none; }
#mobileNav .m-top { font-family:var(--font-h); font-weight:600; font-size:16px; }

/* ── HERO (two-pillar) ──────────────────────────────────────── */
.hero { min-height:100vh; background:var(--ink); display:flex; align-items:center; position:relative; overflow:hidden; padding-top:var(--nav-h); }
.hero-orb { position:absolute; border-radius:50%; pointer-events:none; }
.hero-orb-1 { width:600px; height:600px; background:radial-gradient(circle, rgba(190,30,69,.15) 0%, transparent 70%); top:-100px; right:-100px; }
.hero-orb-2 { width:500px; height:500px; background:radial-gradient(circle, rgba(38,59,144,.18) 0%, transparent 70%); bottom:-80px; left:-80px; }
.hero-dots { position:absolute; inset:0; background-image:radial-gradient(rgba(38,59,144,.05) 1px, transparent 1px); background-size:32px 32px; pointer-events:none; }
.hero-inner { position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; padding:80px 0 100px; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:10px; background:rgba(190,30,69,.12); border:1px solid rgba(190,30,69,.25); border-radius:var(--r-full); padding:6px 16px; margin-bottom:28px; }
.hero-eyebrow-dot { width:7px; height:7px; background:var(--crimson); border-radius:50%; animation:liveP 1.8s ease-in-out infinite; }
.hero-eyebrow-text { font-family:var(--font-h); font-weight:600; font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--navy); }
.hero-h1 { margin-bottom:20px; }
.hero-h1 em { font-style:normal; color:var(--crimson); }
.hero-body { font-size:17px; color:var(--text-muted); line-height:1.8; max-width:480px; margin-bottom:32px; }
.hero-ctas { display:flex; gap:16px; flex-wrap:wrap; margin-bottom:40px; }
.hero-proof { display:flex; align-items:center; gap:12px; font-size:13px; color:var(--text-faint); border-top:1px solid var(--border); padding-top:24px; flex-wrap:wrap; }
.hero-proof-badges { display:flex; gap:8px; flex-wrap:wrap; }
.hero-proof-badge { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-full); padding:4px 12px; font-size:11px; color:var(--text-muted); white-space:nowrap; }

/* Two-pillar cards inside hero visual */
.hero-pillars { display:flex; flex-direction:column; gap:16px; }
.pillar-card { background:var(--surface-2); border:1px solid var(--border-bright); border-radius:var(--r-lg); padding:24px; position:relative; overflow:hidden; box-shadow:var(--glow-card); transition:border-color .25s, transform .25s; }
.pillar-card:hover { border-color:var(--crimson); transform:translateY(-3px); }
.pillar-card::before { content:''; position:absolute; top:0; left:0; bottom:0; width:4px; background:var(--grad-primary); }
.pillar-eyebrow { font-family:var(--font-h); font-weight:700; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--crimson); margin-bottom:8px; }
.pillar-title { font-family:var(--font-h); font-weight:800; font-size:20px; color:var(--text-primary); margin-bottom:8px; }
.pillar-body { font-size:13px; color:var(--text-muted); line-height:1.7; margin-bottom:14px; }
.pillar-tags { display:flex; flex-wrap:wrap; gap:6px; }
.pillar-tag { font-family:var(--font-mono); font-size:11px; color:var(--text-faint); background:var(--surface-3); border:1px solid var(--border); border-radius:var(--r-full); padding:3px 10px; }

/* ── PAIN BAR ───────────────────────────────────────────────── */
.pain-bar { background:var(--surface-1); border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:28px 0; }
.pain-bar-inner { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.pain-item { padding:0 32px; border-right:1px solid var(--border); display:flex; align-items:flex-start; gap:12px; }
.pain-item:last-child { border-right:none; }
.pain-icon { font-size:20px; flex-shrink:0; margin-top:2px; }
.pain-text { font-size:14px; color:var(--text-muted); line-height:1.6; }
.pain-text strong { color:var(--crimson); font-weight:700; }

/* ── STATS ──────────────────────────────────────────────────── */
.stats-section { padding:80px 0; background:var(--ink); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }

/* ── HOW IT WORKS ───────────────────────────────────────────── */
.hiw-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.hiw-step { padding:40px 36px; border-right:1px solid var(--border); position:relative; }
.hiw-step:last-child { border-right:none; }
.hiw-num { font-family:var(--font-mono); font-weight:700; font-size:48px; color:rgba(190,30,69,.12); line-height:1; margin-bottom:-12px; }
.hiw-icon-wrap { width:52px; height:52px; border-radius:14px; background:var(--surface-3); border:1px solid var(--border-bright); display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--crimson); }
.hiw-title { font-family:var(--font-h); font-weight:700; font-size:18px; color:var(--text-primary); margin-bottom:10px; }
.hiw-body { font-size:14px; color:var(--text-muted); line-height:1.7; }
.hiw-connector { position:absolute; right:-1px; top:50%; width:24px; height:24px; border-radius:50%; background:var(--crimson); transform:translate(50%,-50%); display:flex; align-items:center; justify-content:center; font-size:11px; color:#fff; z-index:2; }
.hiw-step:last-child .hiw-connector { display:none; }
.hiw-img { width:100%; height:150px; object-fit:cover; border-radius:var(--r-md); margin-top:20px; opacity:0.85; }

/* ── SOLUTIONS / PRODUCT CARDS ──────────────────────────────── */
.solution-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.sol-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:28px 28px 24px; position:relative; overflow:hidden; transition:border-color .25s, transform .25s, box-shadow .25s; text-decoration:none; display:block; }
.sol-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad-primary); transform:scaleX(0); transform-origin:left; transition:transform .3s ease; }
.sol-card:hover { border-color:var(--crimson); transform:translateY(-5px); box-shadow:var(--glow-card); }
.sol-card:hover::before { transform:scaleX(1); }
.sol-card-badge { margin-bottom:16px; }
.sol-card-icon { margin-bottom:18px; }
.sol-card-icon img { height:44px; width:44px; object-fit:contain; border-radius:10px; }
.sol-card-title { font-family:var(--font-h); font-weight:700; font-size:17px; color:var(--text-primary); margin-bottom:10px; }
.sol-card-body { font-size:13px; color:var(--text-muted); line-height:1.7; margin-bottom:20px; }
.sol-card-link { font-family:var(--font-h); font-weight:700; font-size:12px; letter-spacing:1px; color:var(--crimson); text-transform:uppercase; }
.sol-card-num { position:absolute; bottom:16px; right:20px; font-family:var(--font-mono); font-size:52px; color:rgba(38,59,144,.05); line-height:1; }

/* ── INDUSTRIES ─────────────────────────────────────────────── */
.ind-grid-8 { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.card-ind-bg img { width:100%; height:100%; object-fit:cover; opacity:0.75; transition:transform .4s; }
.card-ind:hover .card-ind-bg img { transform:scale(1.06); }

/* ── COMPARISON ─────────────────────────────────────────────── */
.cmp-section { background:var(--surface-1); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }

/* ── TESTIMONIALS ───────────────────────────────────────────── */
.testi-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }

/* ── MARQUEE / TRUSTED ──────────────────────────────────────── */
.marquee-wrap, .trusted-wrap { overflow:hidden; position:relative; }
.marquee-wrap::before, .marquee-wrap::after, .trusted-wrap::before, .trusted-wrap::after { content:''; position:absolute; top:0; bottom:0; z-index:2; width:120px; pointer-events:none; }
.marquee-wrap::before { left:0; background:linear-gradient(90deg,var(--surface-1),transparent); }
.marquee-wrap::after { right:0; background:linear-gradient(-90deg,var(--surface-1),transparent); }
.trusted-wrap::before { left:0; width:160px; background:linear-gradient(to right,#14193a,transparent); }
.trusted-wrap::after { right:0; width:160px; background:linear-gradient(to left,#14193a,transparent); }
.marquee-track { display:flex; gap:32px; align-items:center; animation:marquee 22s linear infinite; width:max-content; }
.trusted-track { display:flex; gap:60px; align-items:center; animation:marquee 30s linear infinite; width:max-content; padding:16px 0; }
.trusted-track:hover { animation-play-state:paused; }
/* left → right scroll direction */
.trusted-ltr { animation-direction:reverse; }
/* two scrolling rows — parallax: different speeds + opposite directions */
.trusted-rows { display:flex; flex-direction:column; gap:6px; }
.trusted-rows .trusted-track { padding:8px 0; }
.trusted-rows .trusted-track:nth-child(1) { animation-duration:48s; animation-direction:reverse; }  /* slow · left → right */
.trusted-rows .trusted-track:nth-child(2) { animation-duration:30s; animation-direction:normal; }   /* faster · right → left */
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.marquee-partner { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-md); padding:12px 20px; display:flex; align-items:center; gap:10px; white-space:nowrap; transition:border-color .2s; flex-shrink:0; }
.marquee-partner:hover { border-color:var(--border-bright); }
.marquee-partner img { height:28px; width:auto; object-fit:contain; filter:grayscale(1) brightness(0.7); transition:filter .2s; }
.marquee-partner:hover img { filter:grayscale(0) brightness(1); }
.marquee-partner span { font-family:var(--font-h); font-weight:600; font-size:12px; color:var(--text-faint); }
.trusted-logo { flex-shrink:0; display:flex; align-items:center; justify-content:center; min-width:120px; height:70px; }
.trusted-logo img { max-width:120px; max-height:56px; width:auto; height:auto; object-fit:contain; opacity:0.8; transition:opacity .3s ease, transform .3s ease; }
.trusted-logo:hover img { opacity:1; transform:scale(1.08); }

/* ── FLOW VIDEO ─────────────────────────────────────────────── */
.flow-section { background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:80px 0; }
.flow-inner { display:grid; grid-template-columns:1fr 1.4fr; gap:64px; align-items:center; }
.flow-video-wrap { border-radius:var(--r-xl); overflow:hidden; border:1px solid var(--border-bright); box-shadow:var(--glow-card); position:relative; }
.flow-video { width:100%; height:auto; aspect-ratio:16/9; display:block; border-radius:var(--r-xl); background:var(--surface-3); object-fit:cover; }
.flow-features { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:28px; }
.flow-feat { background:var(--surface-3); border:1px solid var(--border); border-radius:var(--r-md); padding:12px 16px; display:flex; align-items:center; gap:10px; font-size:13px; color:var(--text-muted); }
.flow-feat-dot { width:6px; height:6px; border-radius:50%; background:var(--crimson); flex-shrink:0; }

/* ── GLOBAL PRESENCE ────────────────────────────────────────── */
.global-inner { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.global-flag-row { display:flex; align-items:center; gap:16px; padding:16px 20px; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-md); margin-bottom:12px; transition:border-color .2s; }
.global-flag-row:hover { border-color:var(--border-bright); }
.global-flag-row img { height:22px; border-radius:3px; }
.global-flag-name { font-family:var(--font-h); font-weight:600; font-size:15px; color:var(--text-primary); }
.global-flag-detail { font-size:13px; color:var(--text-faint); margin-left:auto; }
.global-img-wrap { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:32px; display:flex; align-items:center; justify-content:center; }
.global-img-wrap img { max-width:100%; opacity:0.75; }

/* ── CTA BAND ───────────────────────────────────────────────── */
.cta-band { background:var(--grad-primary); padding:96px 0; text-align:center; position:relative; overflow:hidden; }
.cta-band::before { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E"); pointer-events:none; }
/* subtle depth glow over the CTA gradient */
.cta-band .cta-glow { position:absolute; inset:0; pointer-events:none; z-index:0;
  background:radial-gradient(55% 75% at 12% 15%, rgba(255,255,255,.16), transparent 60%),
             radial-gradient(65% 90% at 88% 92%, rgba(0,0,0,.18), transparent 60%); }
.cta-band .particles { z-index:0; color:#fff; }

/* ═══ FLOATING PARTICLES (hero + CTA) ══════════════════════ */
.particles { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.particles span { position:absolute; border-radius:50%; background:currentColor; opacity:var(--o,.1);
  animation-name:floatP; animation-timing-function:ease-in-out; animation-iteration-count:infinite; will-change:transform,opacity; }
@keyframes floatP { 0%,100%{ transform:translate3d(0,0,0) scale(1); } 50%{ transform:translate3d(0,-26px,0) scale(1.3); opacity:calc(var(--o,.1) * 1.7); } }
/* hero: navy particles + diagonal gradient wash */
.hero .hero-grad { position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(125deg, rgba(190,30,69,.06) 0%, transparent 38%, transparent 62%, rgba(38,59,144,.07) 100%); }
.hero .particles { z-index:1; color:var(--navy); }
@media (prefers-reduced-motion:reduce){ .particles span{ animation:none; } }

/* ── PRODUCT / SOLUTION DETAIL (vision + iot pillar pages) ──── */
.prod-overview-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:64px; }
.prod-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:28px; position:relative; overflow:hidden; transition:border-color .25s, transform .25s, box-shadow .25s; text-decoration:none; display:block; }
.prod-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad-primary); transform:scaleX(0); transform-origin:left; transition:transform .3s ease; }
.prod-card:hover { border-color:var(--crimson); transform:translateY(-5px); box-shadow:0 16px 40px rgba(190,30,69,.18); }
.prod-card:hover::before { transform:scaleX(1); }
.prod-card-tag { font-family:var(--font-h); font-weight:600; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--text-faint); margin-bottom:16px; display:block; }
.prod-card-icon { width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; overflow:hidden; background:var(--grad-primary); }
.prod-card-icon img { width:100%; height:100%; object-fit:contain; }
.prod-card-name { font-family:var(--font-h); font-weight:800; font-size:17px; color:var(--text-primary); margin-bottom:8px; }
.prod-card-pitch { font-size:13px; color:var(--text-muted); line-height:1.7; margin-bottom:18px; }
.prod-card-link { font-family:var(--font-h); font-weight:700; font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--crimson); }
.prod-card-num { position:absolute; bottom:16px; right:20px; font-family:var(--font-mono); font-size:52px; color:rgba(38,59,144,.05); line-height:1; }

.prod-section { padding:88px 0; border-top:1px solid var(--border); scroll-margin-top:calc(var(--nav-h) + 24px); }
.prod-section:nth-child(odd) { background:var(--surface-1); }
.prod-section:nth-child(even) { background:var(--ink); }
.prod-header { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; margin-bottom:56px; }
.prod-name-tag { display:inline-flex; align-items:center; gap:10px; margin-bottom:20px; }
.prod-h2 { font-family:var(--font-h); font-weight:800; font-size:clamp(28px,3.5vw,42px); line-height:1.1; letter-spacing:-.5px; color:var(--text-primary); margin-bottom:16px; }
.prod-desc { font-size:16px; color:var(--text-muted); line-height:1.8; margin-bottom:28px; }
.prod-specs-mini { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:28px; }
.prod-spec-tag { background:var(--surface-3); border:1px solid var(--border); border-radius:var(--r-full); padding:5px 14px; font-family:var(--font-mono); font-size:12px; color:var(--text-muted); }
.prod-visual { background:var(--surface-2); border:1px solid var(--border-bright); border-radius:var(--r-xl); padding:24px; box-shadow:0 0 60px rgba(190,30,69,.1); }
.prod-visual-img { width:100%; aspect-ratio:16/10; border-radius:var(--r-lg); object-fit:cover; background:var(--surface-3); }
.prod-feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.prod-feat { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-md); padding:16px 18px; display:flex; gap:14px; align-items:flex-start; transition:border-color .2s; }
.prod-feat:hover { border-color:rgba(190,30,69,.3); }
.prod-feat-dot { width:8px; height:8px; border-radius:50%; background:var(--crimson); flex-shrink:0; margin-top:6px; }
.prod-feat-title { font-family:var(--font-h); font-weight:700; font-size:13px; color:var(--text-primary); margin-bottom:4px; }
.prod-feat-body { font-size:12px; color:var(--text-faint); line-height:1.6; }
.prod-use-cases { list-style:none; display:flex; flex-direction:column; gap:10px; }
.prod-use-cases li { display:flex; align-items:flex-start; gap:12px; font-size:14px; color:var(--text-muted); line-height:1.6; }
.prod-use-cases li::before { content:'→'; color:var(--crimson); font-weight:700; flex-shrink:0; margin-top:1px; }

/* ── FAQ ────────────────────────────────────────────────────── */
.faq-list { display:flex; flex-direction:column; gap:0; border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-item:last-child { border-bottom:none; }
.faq-q { width:100%; background:none; border:none; text-align:left; padding:18px 24px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px; font-family:var(--font-h); font-weight:600; font-size:14px; color:var(--text-primary); transition:background .2s; }
.faq-q:hover { background:var(--surface-3); }
.faq-q-icon { flex-shrink:0; width:24px; height:24px; border-radius:50%; border:1px solid var(--border-bright); display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--crimson); transition:transform .25s; }
.faq-item.open .faq-q-icon { transform:rotate(45deg); }
.faq-a { display:none; padding:0 24px 18px; font-size:14px; color:var(--text-muted); line-height:1.75; }
.faq-item.open .faq-a { display:block; }

/* ── SERVICES GRID ──────────────────────────────────────────── */
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.svc-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:32px 28px; transition:border-color .25s, transform .25s; }
.svc-card:hover { border-color:var(--crimson); transform:translateY(-4px); }
.svc-icon { font-size:32px; margin-bottom:18px; }
.svc-title { font-family:var(--font-h); font-weight:700; font-size:18px; color:var(--text-primary); margin-bottom:10px; }
.svc-body { font-size:14px; color:var(--text-muted); line-height:1.7; }

/* ── CASE STUDY CARDS ───────────────────────────────────────── */
.cs-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.cs-card { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; transition:border-color .25s, transform .25s; text-decoration:none; }
.cs-card:hover { border-color:var(--crimson); transform:translateY(-4px); }
.cs-img { height:180px; background:var(--grad-primary); position:relative; overflow:hidden; }
.cs-img img { width:100%; height:100%; object-fit:cover; opacity:.8; }
.cs-pillar { position:absolute; top:14px; left:14px; }
.cs-body { padding:24px; flex:1; display:flex; flex-direction:column; }
.cs-industry { font-family:var(--font-h); font-weight:600; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-faint); margin-bottom:8px; }
.cs-title { font-family:var(--font-h); font-weight:700; font-size:18px; color:var(--text-primary); margin-bottom:10px; line-height:1.3; }
.cs-summary { font-size:13px; color:var(--text-muted); line-height:1.7; margin-bottom:18px; flex:1; }
.cs-metric { display:flex; align-items:baseline; gap:8px; border-top:1px solid var(--border); padding-top:14px; }
.cs-metric-val { font-family:var(--font-mono); font-weight:700; font-size:22px; color:var(--crimson); }
.cs-metric-label { font-size:12px; color:var(--text-faint); }

/* ── MPA PAGE TRANSITIONS ───────────────────────────────────── */
@view-transition { navigation: auto; }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width:900px) {
  .hero-inner { grid-template-columns:1fr; gap:48px; }
  .pain-bar-inner { grid-template-columns:1fr; }
  .pain-item { border-right:none; border-bottom:1px solid var(--border); padding:20px 0; }
  .pain-item:last-child { border-bottom:none; }
  .stats-grid { grid-template-columns:1fr 1fr; gap:16px; }
  .hiw-steps { grid-template-columns:1fr; }
  .hiw-step { border-right:none; border-bottom:1px solid var(--border); }
  .hiw-step:last-child { border-bottom:none; }
  .hiw-connector { display:none !important; }
  .solution-cards { grid-template-columns:1fr 1fr; }
  .ind-grid-8 { grid-template-columns:1fr 1fr; }
  .testi-grid { grid-template-columns:1fr; }
  .global-inner { grid-template-columns:1fr; gap:40px; }
  .global-img-wrap { display:none; }
  .flow-inner { grid-template-columns:1fr; text-align: center;}
  .prod-overview-grid { grid-template-columns:1fr 1fr; }
  .prod-header { grid-template-columns:1fr; gap:40px; }
  .prod-feature-grid { grid-template-columns:1fr; }
  .svc-grid { grid-template-columns:1fr 1fr; }
  .nav-dropdown-mega { min-width:auto; }
}
@media (max-width:600px) {
  .solution-cards { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:1fr 1fr; }
  .prod-overview-grid { grid-template-columns:1fr; }
  .svc-grid { grid-template-columns:1fr; }
  .cs-grid { grid-template-columns:1fr; }
}

/* ── REDUCED MOTION ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal { opacity:1 !important; transform:none !important; }
  .marquee-track, .trusted-track { animation:none !important; }
}

/* ─── WORK GALLERY FILTERS ───────────────────────────────── */
.work-filters { display:flex; align-items:flex-start; gap:16px; flex-wrap:wrap; }
.work-filter-group-label {
  font-family:var(--font-mono); font-size:11px; text-transform:uppercase;
  letter-spacing:2px; color:var(--text-faint); padding-top:9px; min-width:86px;
}
.work-chipset { display:flex; gap:8px; flex-wrap:wrap; }
.work-chip {
  background:transparent; border:1px solid var(--border-bright);
  color:var(--text-muted); font-size:13px; font-weight:600;
  padding:7px 16px; border-radius:var(--r-full);
  transition:all .2s ease;
}
.work-chip:hover { border-color:var(--crimson); color:var(--text-primary); }
.work-chip.active {
  background:var(--crimson); border-color:transparent; color:#fff;
}
.app-card { display:flex; flex-direction:column; }
@media (max-width:1023px){ #work-grid{ grid-template-columns:repeat(2,1fr) !important; } }
@media (max-width:767px){ #work-grid{ grid-template-columns:1fr !important; } }

/* ─── FEATURE GRID (engineering / generic pillars) ────────── */
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.feature-box {
  display:flex; gap:16px; align-items:flex-start;
  background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--r-lg); padding:26px;
  transition:border-color .25s ease, transform .25s ease;
}
.feature-box:hover { border-color:var(--crimson); transform:translateY(-4px); }
.feature-icon { font-size:28px; line-height:1; flex-shrink:0; }
.feature-title { font-weight:700; font-size:16px; margin-bottom:8px; }
.feature-body { font-size:13.5px; color:var(--text-muted); line-height:1.6; }
@media (max-width:1023px){ .feature-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:767px){ .feature-grid{ grid-template-columns:1fr;} }

/* ─── STEPS GRID (how we work) ────────────────────────────── */
.steps-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.step-card {
  background:var(--surface-2); border:1px solid var(--border);
  border-radius:var(--r-lg); padding:28px 24px;
  transition:border-color .25s ease, transform .25s ease;
}
.step-card:hover { border-color:var(--crimson); transform:translateY(-4px); }
.step-num {
  font-family:var(--font-mono); font-size:30px; font-weight:700;
  color:var(--crimson); margin-bottom:14px;
}
.step-title { font-weight:700; font-size:17px; margin-bottom:10px; }
.step-body { font-size:13.5px; color:var(--text-muted); line-height:1.6; }
@media (max-width:1023px){ .steps-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:767px){ .steps-grid{ grid-template-columns:1fr;} }

/* ─── SAFETY AI PILLAR ────────────────────────────────────── */
.badge-safety { background:rgba(56,189,248,.12); color:var(--info); border:1px solid rgba(56,189,248,.25); }
@media (min-width:1024px){
  .hero-pillars.hero-pillars-4 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .hero-pillars-4 .pillar-card { padding:20px; }
}

/* ─── CARD THUMB + APP HERO VISUAL ────────────────────────── */
.card-thumb {
  width:100%; aspect-ratio:16/9; overflow:hidden;
  border-radius:var(--r-md); border:1px solid var(--border);
  margin-bottom:16px; background:var(--surface-3);
}
.card-thumb img { width:100%; height:100%; object-fit:contain; transition:transform .35s ease; }
.sol-card:hover .card-thumb img { transform:scale(1.05); }
.app-hero-grid { display:grid; grid-template-columns:1.4fr 1fr; gap:40px; align-items:center; }
.app-hero-visual { max-height:280px; overflow:hidden; }
.app-hero-visual img { max-height:280px; width:100%; object-fit:cover; }
@media (max-width:1023px){
  .app-hero-grid { grid-template-columns:1fr; }
  .app-hero-visual { display:none; }
}

/* ─── LIGHT THEME ADJUSTMENTS ─────────────────────────────── */
.nav-logo-img { height:38px; width:auto; }
/* pillar/sol left-accent bar: subtle on light, only crimson pillar keeps pop */
.pillar-card::before { width:3px; background:var(--crimson); }

/* CTA band sits on dark gradient — force light controls */
.cta-band .btn-ghost { color:#fff; border-color:rgba(255,255,255,.4); }
.cta-band .btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,.1); }

/* ═══ HERO LIVE INSPECTION DASHBOARD ═══════════════════════ */
.pillar-row { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:1023px){ .pillar-row{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .pillar-row{ grid-template-columns:1fr;} }

.inspect-scene {
  background:#fff; border:1px solid var(--border); border-radius:var(--r-lg);
  box-shadow:var(--glow-card); overflow:hidden; width:100%; max-width:520px; margin-left:auto;
}
.is-topbar {
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 16px; background:var(--surface-2); border-bottom:1px solid var(--border);
  font-family:var(--font-mono); font-size:11px; color:var(--text-muted); letter-spacing:.5px;
}
.is-cam { display:flex; align-items:center; gap:7px; font-weight:700; color:var(--navy); }
.is-rec { width:8px; height:8px; border-radius:50%; background:var(--crimson); animation:isRec 1.4s ease-in-out infinite; }
@keyframes isRec { 0%,100%{opacity:1} 50%{opacity:.25} }

.is-view { position:relative; aspect-ratio:16/9; overflow:hidden; background:#eef1f7; }
.is-grid {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(38,59,144,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(38,59,144,.05) 1px,transparent 1px);
  background-size:26px 26px;
}
.is-panel { position:absolute; inset:8% 6%; z-index:2; }
.is-panel svg { width:100%; height:100%; display:block; border-radius:10px; }

/* defect markers — hidden by default, shown when NG */
.is-defect { position:absolute; opacity:0; transition:opacity .25s; z-index:4; }
.is-defect.show { opacity:1; }
.is-defect .is-tag {
  position:absolute; top:-16px; left:0; background:var(--crimson); color:#fff;
  font-family:var(--font-mono); font-size:9px; padding:1px 5px; border-radius:3px; white-space:nowrap;
}
.is-scratch { left:30%; top:34%; width:26%; height:5px; }
.is-scratch::before {
  content:''; position:absolute; inset:0; border:1.5px solid var(--crimson); border-radius:3px;
  height:26px; top:-10px;
}
.is-scratch::after {
  content:''; position:absolute; left:3px; right:3px; top:2px; height:2px;
  background:var(--crimson); transform:rotate(-8deg); border-radius:2px;
}
.is-pinhole { left:58%; top:56%; width:20px; height:20px; }
.is-pinhole::before { content:''; position:absolute; inset:0; border:1.5px solid var(--crimson); border-radius:4px; }
.is-pinhole::after { content:''; position:absolute; left:50%; top:50%; width:5px; height:5px; background:var(--crimson); border-radius:50%; transform:translate(-50%,-50%); }
.is-pinhole .is-tag { left:auto; right:0; }

/* scan line */
.is-scan {
  position:absolute; left:6%; right:6%; height:2px; top:12%;
  background:linear-gradient(90deg,transparent,var(--navy),transparent);
  box-shadow:0 0 10px rgba(38,59,144,.5); z-index:5; animation:isScan 2.4s ease-in-out infinite;
}
@keyframes isScan { 0%{top:12%;opacity:0} 12%{opacity:1} 50%{top:84%;opacity:1} 88%{opacity:1} 100%{top:12%;opacity:0} }

/* verdict badge */
.is-verdict { position:absolute; top:12px; right:12px; z-index:6; font-family:var(--font-h); font-weight:800; font-size:15px; height:30px; }
.is-verdict span { position:absolute; top:0; right:0; padding:5px 12px; border-radius:var(--r-full); white-space:nowrap; transition:opacity .2s; }
.is-ok { background:rgba(21,128,61,.12); color:var(--success); border:1px solid rgba(21,128,61,.35); }
.is-ng { background:rgba(190,30,69,.12); color:var(--crimson); border:1px solid rgba(190,30,69,.35); opacity:0; }
.inspect-scene.ng .is-ok { opacity:0; }
.inspect-scene.ng .is-ng { opacity:1; }

/* dashboard */
.is-dash { padding:14px 16px; background:var(--surface-2); border-top:1px solid var(--border); }
.is-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:12px; }
.is-metric { display:flex; flex-direction:column; }
.is-m-val { font-family:var(--font-mono); font-size:17px; font-weight:700; color:var(--navy); line-height:1.1; }
.is-m-val.is-pass { color:var(--success); }
.is-m-val.is-fail { color:var(--crimson); }
.is-m-lab { font-size:9px; text-transform:uppercase; letter-spacing:1px; color:var(--text-faint); margin-top:3px; }
.is-spark { display:flex; align-items:flex-end; gap:3px; height:26px; margin-bottom:10px; }
.is-spark span { flex:1; background:var(--success); border-radius:1px; min-height:3px; transition:height .3s; }
.is-spark span.bad { background:var(--crimson); }
.is-log {
  font-family:var(--font-mono); font-size:10px; color:var(--text-muted);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.is-log-time { color:var(--navy); font-weight:700; }
@media (prefers-reduced-motion:reduce){ .is-rec,.is-scan{ animation:none; } }

/* ═══ WEBGL WIREFRAME FACTORY (hero backdrop) ═══════════════ */
.hero { position:relative; }
.factory-bg {
  position:absolute; inset:0; width:100%; height:100%;
  z-index:0; pointer-events:none; opacity:0;
  transition:opacity 1.2s ease;
}
.factory-bg.ready { opacity:.5; }
/* video-ready hero background (hidden until a real clip decodes) */
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:0; opacity:0; transition:opacity .9s ease; pointer-events:none; }
.hero-video.ready { opacity:1; }
/* when a real clip is live, retire the 3D factory to save the paint */
.hero.hero-has-video .factory-bg { opacity:0 !important; }
/* keep left text crisp: fade factory toward the text side */
.hero-mask {
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, var(--ink) 0%, var(--ink) 20%, rgba(255,255,255,.30) 48%, transparent 74%);
}
/* faint navy pool so the white 3D scene reads against the page */
.hero { background:radial-gradient(130% 95% at 80% 42%, rgba(38,59,144,.07) 0%, rgba(38,59,144,.03) 38%, transparent 66%); }
.hero .container { position:relative; z-index:2; }

/* ═══ HOLOGRAM GLASS TREATMENT (inspect-scene) ═════════════ */
.inspect-scene {
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:blur(16px) saturate(1.35);
  backdrop-filter:blur(16px) saturate(1.35);
  border:1px solid rgba(38,59,144,.22);
  box-shadow:0 16px 48px rgba(38,59,144,.18),
             inset 0 0 0 1px rgba(255,255,255,.55),
             0 0 34px rgba(90,150,255,.12);
  position:relative;
}
/* holographic sheen sweep */
.inspect-scene::after {
  content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; z-index:8;
  background:linear-gradient(120deg,transparent 34%,rgba(120,170,255,.14) 48%,rgba(190,30,69,.05) 54%,transparent 64%);
  background-size:260% 260%; animation:holoSheen 7s ease-in-out infinite;
}
@keyframes holoSheen { 0%{background-position:0% 0%} 100%{background-position:130% 130%} }
/* translucent sub-panels so the factory shows through */
.inspect-scene .is-topbar { background:rgba(242,243,248,.4); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-bottom-color:rgba(38,59,144,.14); }
.inspect-scene .is-view   { background:rgba(233,238,247,.30); }
.inspect-scene .is-grid   { opacity:.6; }
.inspect-scene .is-dash   { background:rgba(242,243,248,.42); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-top-color:rgba(38,59,144,.14); }
/* panel surface slightly translucent for holo depth */
.inspect-scene .is-panel svg rect[fill^="url"] { opacity:.9; }
@media (prefers-reduced-motion:reduce){ .inspect-scene::after{ animation:none; } }


/* ─── OCR + BARCODE READERS (inspect-scene) ───────────────── */
.is-read {
  position:absolute; z-index:6; display:flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.82); border:1px solid rgba(38,59,144,.2);
  border-radius:6px; padding:3px 8px; font-family:var(--font-mono); font-size:9px;
  color:var(--navy); box-shadow:0 2px 8px rgba(38,59,144,.12); overflow:hidden;
}
.is-ocr     { top:10px; left:10px; }
.is-barcode { bottom:10px; left:10px; }
.is-read-lab { font-weight:700; color:var(--crimson); letter-spacing:1px; }
.is-read-val { color:var(--text-primary); }
.is-read-ok  { color:var(--success); font-weight:700; }
.is-bars {
  display:inline-block; width:36px; height:14px;
  background:repeating-linear-gradient(90deg,#1c1c1c 0 1px,transparent 1px 2px,#1c1c1c 2px 4px,transparent 4px 5px,#1c1c1c 5px 6px,transparent 6px 8px,#1c1c1c 8px 9px,transparent 9px 11px);
}
.is-bc-scan {
  position:absolute; top:0; bottom:0; width:16px;
  background:linear-gradient(90deg,transparent,rgba(190,30,69,.5),transparent);
  animation:bcScan 2.2s linear infinite;
}
@keyframes bcScan { 0%{left:-16px} 100%{left:100%} }
@media (prefers-reduced-motion:reduce){ .is-bc-scan{ animation:none; } }

/* ═══ INSPECTION PANEL — 3 stations stacked in one device frame ═══ */
.stations {
  display:flex; flex-direction:column; gap:10px; width:100%; max-width:370px; margin-left:auto;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid var(--border); border-radius:18px;
  box-shadow:0 26px 64px rgba(38,59,144,.16), inset 0 0 0 1px rgba(255,255,255,.6);
  padding:14px;
}
.stn-panel-head { display:flex; align-items:center; gap:9px; padding:2px 3px 11px; border-bottom:1px solid var(--border); }
.stn-panel-dots { display:flex; gap:5px; }
.stn-panel-dots i { width:8px; height:8px; border-radius:50%; background:var(--border); }
.stn-panel-title { font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:1px; color:var(--navy); }
.stn-panel-live { margin-left:auto; display:inline-flex; align-items:center; gap:5px; font-family:var(--font-mono); font-size:9px; font-weight:700; letter-spacing:1px; color:var(--crimson); }
.stn-card {
  position:relative; width:100%; max-width:100%;
  background:var(--surface-1,#f5f7fb);
  border:1px solid var(--border); border-radius:12px;
  box-shadow:none; padding:11px 13px;
}
.stn-dot { display:none; }

.stn-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.stn-chip { display:flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:9.5px; font-weight:700; letter-spacing:.5px; color:var(--navy); }
.stn-rec { width:6px; height:6px; border-radius:50%; background:var(--crimson); animation:isRec 1.4s ease-in-out infinite; }
.stn-verdict { position:relative; font-family:var(--font-h); font-weight:800; font-size:12px; }
.stn-verdict .v-ok { color:var(--success); }
.stn-verdict .v-ng { color:var(--crimson); display:none; }
.stn-card.ng .v-ok { display:none; }
.stn-card.ng .v-ng { display:inline; }

.stn-view { position:relative; height:52px; border-radius:8px; overflow:hidden; background:rgba(233,238,247,.5); margin-bottom:8px; }
.stn-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(38,59,144,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(38,59,144,.06) 1px,transparent 1px); background-size:16px 16px; }
.stn-scan { position:absolute; left:6%; right:6%; height:2px; top:20%; background:linear-gradient(90deg,transparent,var(--navy),transparent); box-shadow:0 0 8px rgba(38,59,144,.5); animation:isScan 2.2s ease-in-out infinite; }
.stn-box { position:absolute; left:24%; top:28%; width:34%; height:44%; border:1.5px solid var(--crimson); border-radius:3px; opacity:0; transition:opacity .2s; }
.stn-card.ng .stn-box { opacity:1; }
.stn-tag { position:absolute; top:-15px; left:0; background:var(--crimson); color:#fff; font-family:var(--font-mono); font-size:8px; padding:1px 5px; border-radius:3px; white-space:nowrap; }
/* assembly part dots */
.stn-parts { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:12px; z-index:2; }
.stn-parts i { width:12px; height:12px; border-radius:3px; background:rgba(38,59,144,.25); border:1.5px solid var(--navy); transition:all .3s; }
.stn-parts i.ok { background:var(--success); border-color:var(--success); }
.stn-parts i.bad { background:var(--crimson); border-color:var(--crimson); }
/* packaging count dots */
.stn-count { position:absolute; inset:8px 10px; display:grid; grid-template-columns:repeat(6,1fr); gap:4px; z-index:2; }
.stn-count i { border-radius:2px; background:rgba(38,59,144,.15); transition:background .15s; }
.stn-count i.on { background:var(--success); }

.stn-metric { font-family:var(--font-mono); font-size:10px; color:var(--text-muted); }
.stn-metric b { color:var(--navy); }
.stn-card.ng .stn-metric b { color:var(--crimson); }
@media (prefers-reduced-motion:reduce){ .stn-rec,.stn-scan{ animation:none; } }
@media (max-width:1023px){ .stations{ max-width:340px; } .stn-card[data-stn]{ margin-right:0; } }

@media (min-width:1024px){ .hero .stations { max-width:380px; } }

/* leader lines retired — panel is self-contained now */
.stn-lines { display:none !important; }

/* subject images in station mini-views (replaces abstract green boxes) */
.stn-img { position:absolute; inset:0; width:100%; height:100%; z-index:2; }

/* ─── IoT LIVE TILE (smart-factory pillar in the hero) ────── */
.iot-tile {
  width:100%; max-width:100%; margin:0;
  background:var(--surface-1,#f5f7fb);
  border:1px solid var(--border); border-radius:12px;
  box-shadow:none; padding:11px 13px;
}
.iot-head { display:flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:9.5px; font-weight:700; letter-spacing:.5px; color:var(--navy); margin-bottom:10px; }
.iot-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:10px; }
.iot-metrics b { display:block; font-family:var(--font-mono); font-size:16px; font-weight:700; color:var(--navy); line-height:1.1; }
.iot-metrics span { font-size:8px; text-transform:uppercase; letter-spacing:.5px; color:var(--text-faint); }
.iot-spark { display:flex; align-items:flex-end; gap:2px; height:20px; }
.iot-spark i { flex:1; background:var(--navy); opacity:.7; border-radius:1px; min-height:2px; transition:height .3s; }
@media (min-width:1024px){
  .hero { min-height:100vh; overflow:hidden; }
}

/* ═══ OUR TECHNOLOGY GRID ══════════════════════════════════ */
.tech-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.tech-card { background:var(--surface,#fff); border:1px solid var(--border); border-radius:16px; padding:26px; transition:border-color .18s, box-shadow .18s, transform .18s; }
.tech-card:hover { border-color:var(--crimson); box-shadow:0 12px 30px rgba(190,30,69,.08); transform:translateY(-3px); }
.tech-ico { width:46px; height:46px; border-radius:12px; display:grid; place-items:center; background:rgba(190,30,69,.09); font-size:23px; margin-bottom:16px; }
.tech-title { font-family:var(--font-h); font-weight:700; font-size:16px; color:var(--text-primary); margin-bottom:8px; line-height:1.3; }
.tech-body { font-family:var(--font-b); font-size:13.5px; color:var(--text-muted); line-height:1.6; }
@media (max-width:860px){ .tech-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .tech-grid{ grid-template-columns:1fr; } }

/* ═══ PARTNER CARD GRID (simple) ═══════════════════════════ */
.partner-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; max-width:1080px; margin:0 auto; }
.partner-card { display:flex; align-items:center; gap:12px; min-width:0; min-height:68px; background:var(--surface,#fff); border:1px solid var(--border); border-radius:12px; padding:14px 16px; transition:border-color .18s, box-shadow .18s, transform .18s; }
.partner-card:hover { border-color:var(--crimson); box-shadow:0 8px 22px rgba(190,30,69,.09); transform:translateY(-2px); }
.partner-mark { flex:0 0 auto; width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:rgba(190,30,69,.08); color:var(--crimson); font-family:var(--font-h); font-weight:800; font-size:17px; }
.partner-logo { flex:0 0 auto; width:44px; height:38px; object-fit:contain; object-position:left center; filter:grayscale(1); opacity:.78; transition:filter .2s, opacity .2s; }
.partner-card:hover .partner-logo { filter:grayscale(0); opacity:1; }
.partner-meta { display:flex; flex-direction:column; min-width:0; }
.partner-name { font-family:var(--font-h); font-weight:700; font-size:14px; color:var(--text-primary); line-height:1.25; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow: hidden;}
.partner-sub { font-family:var(--font-b); font-size:11px; color:var(--text-muted); }
@media (max-width:900px){ .partner-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:560px){ .partner-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .partner-card{ padding:12px; gap:10px; } .partner-logo{ width:36px; height:32px; } .partner-mark{ width:32px; height:32px; font-size:15px; } .partner-name{ font-size:13px; } }
@media (max-width:400px){ .partner-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .partner-card{ padding:14px 16px; }}

/* ═══ PARTNER NETWORK GRAPH (legacy, unused) ═══════════════ */
.pnet { position:relative; max-width:1000px; margin:0 auto; }
.pnet-svg { width:100%; height:auto; display:block; overflow:visible; }
/* energy-flow links: dashes travel hub → partner (powering) */
.pnet-link {
  stroke:var(--crimson); stroke-width:1.6; opacity:.45;
  stroke-dasharray:5 9; stroke-linecap:round;
  animation:pnetFlow 1.1s linear infinite;
}
@keyframes pnetFlow { to { stroke-dashoffset:-14; } }
/* partner nodes */
.pnet-dot { fill:#fff; stroke:var(--navy); stroke-width:2.5; transition:all .2s; }
.pnet-ring { fill:none; stroke:var(--navy); stroke-width:1.5; opacity:.4; transform-box:fill-box; transform-origin:center;
  animation:pnetPing 2.6s ease-out infinite; }
@keyframes pnetPing { 0%{ transform:scale(1); opacity:.5; } 70%,100%{ transform:scale(2.6); opacity:0; } }
.pnet-label { font-family:var(--font-h); font-weight:600; font-size:15px; fill:var(--text-muted); }
.pnet-node:hover .pnet-dot { fill:var(--crimson); stroke:var(--crimson); r:9; }
.pnet-node:hover .pnet-label { fill:var(--navy); }
/* orbit guide rings */
.pnet-orbit { fill:none; stroke:var(--navy); opacity:.12; stroke-dasharray:2 7; }
/* broadcast waves radiating from the core */
.pnet-wave { fill:none; stroke:var(--crimson); stroke-width:2; opacity:0; transform-box:fill-box; transform-origin:center; animation:pnetWave 4.2s ease-out infinite; }
@keyframes pnetWave { 0%{ transform:scale(.12); opacity:.5; } 80%,100%{ transform:scale(1); opacity:0; } }
/* Crimson hub */
.pnet-hub-glow { fill:var(--crimson); opacity:.14; animation:pnetGlow 2.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes pnetGlow { 0%,100%{ transform:scale(1); opacity:.14; } 50%{ transform:scale(1.25); opacity:.06; } }
.pnet-hub { fill:var(--crimson); filter:drop-shadow(0 6px 16px rgba(190,30,69,.35)); }
.pnet-hub-t1 { font-family:var(--font-h); font-weight:800; font-size:15px; fill:#fff; letter-spacing:1px; }
.pnet-hub-t2 { font-family:var(--font-h); font-weight:600; font-size:11px; fill:rgba(255,255,255,.85); letter-spacing:3px; }
.pnet-stat { text-align:center; margin-top:8px; font-family:var(--font-mono); font-size:13px; color:var(--text-muted); }
.pnet-stat b { color:var(--navy); }
@media (max-width:640px){ .pnet-label{ font-size:19px; } }
@media (prefers-reduced-motion:reduce){ .pnet-link,.pnet-ring,.pnet-hub-glow,.pnet-wave{ animation:none; } }


/* hero sub-headline + proof line (hero copy optimization) */
.hero-sub { font-family:var(--font-h); font-weight:700; font-size:clamp(17px,1.6vw,21px); color:var(--navy); margin:-6px 0 16px; letter-spacing:.2px; }
.hero-proofline { font-size:13px; color:var(--text-muted); margin:20px 0 10px; }
.hero-proofline strong { color:var(--crimson); font-weight:700; }

/* ═══ WORLD MAP — global presence · command-center layout ═══ */
.wmap-cmd { display:grid; grid-template-columns:0.9fr 1.6fr; gap:48px; align-items:center; }
/* LEFT column */
.wmap-side { max-width:400px; }
.wmap-h { font-family:var(--font-h); font-weight:800; font-size:clamp(26px,3vw,38px); line-height:1.12; letter-spacing:-.01em;
  color:var(--text-primary); margin:12px 0 0; }
.wmap-h span { color:var(--crimson); }
.wmap-lede { font-family:var(--font-b); color:var(--text-muted); font-size:15px; line-height:1.6; margin:14px 0 26px; }
.wmap-stats { display:flex; flex-direction:column; gap:12px; }
.wmap-stat { display:flex; align-items:baseline; gap:14px; text-align:left; width:100%; cursor:pointer;
  background:var(--surface,#fff); border:1px solid var(--border); border-radius:12px; padding:16px 18px;
  transition:border-color .18s, box-shadow .18s, transform .18s; }
.wmap-stat:hover, .wmap-stat:focus-visible { border-color:var(--crimson); box-shadow:0 6px 20px rgba(190,30,69,.1); transform:translateY(-2px); outline:none; }
.wmap-num { font-family:var(--font-mono); font-weight:700; font-size:30px; line-height:1; color:var(--crimson); min-width:78px; }
.wmap-lab { font-family:var(--font-b); font-weight:600; font-size:14px; color:var(--text-primary); }
/* RIGHT canvas */
.wmap-canvas { position:relative; }
.wmap-svg { width:100%; height:auto; display:block; overflow:visible; }
/* landmasses */
.sa-land { fill:#e9ecf3; stroke:#d3d8e6; stroke-width:1.2; stroke-linejoin:round; }
.sa-land.on { fill:rgba(190,30,69,.09); stroke:rgba(190,30,69,.4); }
.sa-country { font-family:var(--font-h); font-weight:800; font-size:30px; letter-spacing:8px; fill:var(--navy); opacity:.10; }
/* nodes */
.wmap-hit { fill:transparent; cursor:pointer; }
.wmap-core { fill:var(--crimson); }
.wmap-mark { fill:#fff; stroke:var(--crimson); stroke-width:2; }
.wmap-ping { fill:none; stroke:var(--crimson); stroke-width:1.5; opacity:.5; transform-box:fill-box; transform-origin:center; animation:wmapPing 2.4s ease-out infinite; }
@keyframes wmapPing { 0%{ transform:scale(1); opacity:.55; } 70%,100%{ transform:scale(3); opacity:0; } }
/* node types: HQ solid, active hollow, expansion gray dashed */
.wmap-node.is-hq .wmap-mark { fill:var(--crimson); stroke-width:2.5; filter:drop-shadow(0 0 7px rgba(190,30,69,.55)); }
.wmap-node.is-hq .wmap-core { fill:#fff; }
.wmap-node.is-active .wmap-core { fill:var(--crimson); }
.wmap-node:hover .wmap-mark, .wmap-node:focus-visible .wmap-mark { transform:scale(1.15); transform-box:fill-box; transform-origin:center; }
.wmap-node:focus-visible { outline:none; }
/* stat-hover highlight states */
.wmap-node.dim { opacity:.28; transition:opacity .2s; }
.wmap-node.hot .wmap-ping { animation-duration:1.2s; stroke-width:2.4; }
/* tooltip */
.wmap-tip { position:absolute; transform:translate(-50%,-100%); pointer-events:none; z-index:5;
  background:var(--text-primary,#12151c); color:#fff; border-radius:10px; padding:8px 12px; min-width:120px;
  box-shadow:0 10px 30px rgba(0,0,0,.22); font-family:var(--font-b); white-space:nowrap; }
.wmap-tip::after { content:''; position:absolute; left:50%; bottom:-5px; width:10px; height:10px; background:inherit; transform:translateX(-50%) rotate(45deg); }
.wmap-tip b { display:block; font-family:var(--font-h); font-weight:700; font-size:14px; }
.wmap-tip span { display:block; font-size:12px; opacity:.75; margin-top:2px; }
/* legend */
.wmap-legend { display:flex; justify-content:flex-end; gap:22px; margin-top:14px; font-family:var(--font-mono); font-size:12px; color:var(--text-muted); flex-wrap:wrap; }
.wmap-legend span { display:inline-flex; align-items:center; gap:7px; }
.wmap-key { width:11px; height:11px; border-radius:50%; display:inline-block; }
.wmap-key.k-hq { background:var(--crimson); box-shadow:0 0 0 2px rgba(190,30,69,.25); }
.wmap-key.k-active { background:#fff; border:2px solid var(--crimson); width:9px; height:9px; }
/* USA global-presence chip */
.wmap-usa { position:absolute; top:14px; left:14px; display:flex; align-items:center; gap:11px;
  background:var(--surface,#fff); border:1px solid var(--border); border-radius:12px; padding:9px 14px;
  box-shadow:0 6px 20px rgba(0,0,0,.07); transition:border-color .2s, opacity .2s; }
.wmap-usa b { display:block; font-family:var(--font-h); font-weight:700; font-size:13px; color:var(--text-primary); line-height:1.2; }
.wmap-usa small { font-family:var(--font-b); font-size:11px; color:var(--text-muted); }
.wmap-usa-dot { width:12px; height:12px; border-radius:50%; background:var(--crimson); flex:0 0 auto; position:relative; box-shadow:0 0 0 4px rgba(190,30,69,.16); }
.wmap-usa-dot::after { content:''; position:absolute; inset:0; border-radius:50%; border:1.5px solid var(--crimson); animation:usaPing 2.4s ease-out infinite; }
@keyframes usaPing { 0%{ transform:scale(1); opacity:.6; } 70%,100%{ transform:scale(2.4); opacity:0; } }
.wmap-usa.hot { border-color:var(--crimson); box-shadow:0 8px 24px rgba(190,30,69,.16); }
.wmap-usa.dim { opacity:.4; }
@media (max-width:860px){ .wmap-cmd{ grid-template-columns:1fr; gap:28px; } .wmap-side{ max-width:none; text-align: center;} .wmap-legend{ justify-content:center; } }
@media (max-width:520px){ .wmap-usa small{ display:none; }}
@media (prefers-reduced-motion:reduce){ .wmap-ping,.wmap-usa-dot::after{ animation:none; } }

/* ═══════════════════════════════════════════════════════════════
   MICRO-INTERACTIONS — hover / press / focus polish (site-wide)
═══════════════════════════════════════════════════════════════ */
/* unified smooth transitions incl. shadow on all interactive cards */
.pillar-card, .sol-card, .tech-card, .partner-card, .prod-card, .svc-card,
.cs-card, .feature-box, .step-card, .work-chip, .global-flag-row {
  transition: border-color .22s ease,
              transform .22s cubic-bezier(.22,.61,.36,1),
              box-shadow .28s ease,
              background .2s ease, color .2s ease;
  will-change: transform;
}
/* add real shadow lift where hover only moved the card */
.pillar-card:hover, .tech-card:hover, .svc-card:hover, .cs-card:hover,
.feature-box:hover, .step-card:hover { box-shadow: var(--shadow-lift); }

/* TACTILE PRESS — click feedback */
.btn:active { transform: translateY(0) scale(.97); box-shadow: 0 2px 8px rgba(190,30,69,.20); }
.pillar-card:active, .sol-card:active, .tech-card:active, .partner-card:active,
.prod-card:active, .svc-card:active, .cs-card:active, .feature-box:active,
.step-card:active, .wmap-stat:active { transform: translateY(-1px) scale(.994); }
.trusted-logo:active img, .nav-cta:active, .work-chip:active { transform: scale(.96); }

/* ARROW / LINK nudge on card hover */
.sol-card-link { display:inline-block; transition: transform .2s ease, color .2s ease; }
.sol-card:hover .sol-card-link { transform: translateX(4px); color: var(--crimson-h); }

/* playful ICON pop on hover */
.partner-mark, .tech-ico, .sol-card-icon img { transition: transform .3s cubic-bezier(.34,1.56,.64,1); }
.partner-card:hover .partner-mark { transform: scale(1.08) rotate(-3deg); }
.tech-card:hover .tech-ico { transform: translateY(-2px) scale(1.07); }
.sol-card:hover .sol-card-icon img { transform: scale(1.08) rotate(2deg); }

/* TAG pills warm on hover */
.pillar-tag { transition: border-color .2s, color .2s, background .2s; }
.pillar-card:hover .pillar-tag { border-color: var(--border-bright); color: var(--text-muted); }

/* NAV link underline grows from centre on hover (+ stays for active) */
.nav-link::after {
  content:''; position:absolute; left:14px; right:14px; bottom:-2px; height:2px;
  background: var(--navy); border-radius:2px;
  transform: scaleX(0); transform-origin: center; transition: transform .22s ease;
}
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); }
.nav-cta { transition: background .2s ease, transform .18s ease, box-shadow .2s ease; }
.nav-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(190,30,69,.26); }

/* form controls: lift + hover border */
.form-input, .form-select, .form-textarea { transition: border-color .2s, box-shadow .2s, transform .15s ease; }
.form-input:hover, .form-select:hover, .form-textarea:hover { border-color: var(--border-bright); }
.form-input:focus, .form-select:focus, .form-textarea:focus { transform: translateY(-1px); }

@media (prefers-reduced-motion:reduce){
  .pillar-card, .sol-card, .tech-card, .partner-card, .prod-card, .svc-card,
  .cs-card, .feature-box, .step-card, .btn, .nav-cta, .form-input, .form-select, .form-textarea { transition:none; }
}

/* ═══ LEGAL DOCUMENTS (privacy, terms) ═════════════════════ */
.legal-doc { max-width:760px; }
.legal-doc .t-h2 { font-size:clamp(19px,2.2vw,25px); margin:38px 0 12px; color:var(--text-primary); }
.legal-doc .t-body { margin-bottom:14px; }
.legal-doc a { color:var(--crimson); text-decoration:underline; text-underline-offset:2px; }
.legal-list { margin:0 0 16px 20px; padding:0; }
.legal-list li { font-family:var(--font-b); font-size:15px; line-height:1.75; color:var(--text-muted); margin-bottom:8px; }
.legal-note { margin-top:40px; padding:18px 22px; background:var(--surface-2); border:1px solid var(--border);
  border-left:3px solid var(--crimson); border-radius:var(--r-md); font-size:15px; color:var(--text-muted); }
.footer-legal-link { margin-left:14px; color:var(--text-faint); font-size:13px; transition:color .18s; }
.footer-legal-link:hover { color:var(--crimson); }

/* ═══ INTEGRATIONS (engineering page) ══════════════════════ */
.integ-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px 32px; }
.integ-label { font-family:var(--font-h); font-weight:700; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--text-faint); margin-bottom:12px; }
.integ-chips { display:flex; flex-wrap:wrap; gap:8px; }
.integ-chip { font-family:var(--font-mono); font-size:12.5px; color:var(--text-primary); background:var(--surface,#fff); border:1px solid var(--border-bright); border-radius:var(--r-sm); padding:7px 13px; transition:border-color .18s, color .18s; }
.integ-chip:hover { border-color:var(--crimson); color:var(--crimson); }
@media (max-width:700px){ .integ-grid{ grid-template-columns:1fr; } }
