/* =========================================================
   Interglobe Business Concern — v3
   One continuous canvas: the page colour flows between
   dark and light themes as you scroll (see main.js).
   ========================================================= */
@property --bg{syntax:'<color>';inherits:true;initial-value:#0B1A2E}
@property --fg{syntax:'<color>';inherits:true;initial-value:#FFFFFF}
@property --fg2{syntax:'<color>';inherits:true;initial-value:#C3D0E2}
@property --line{syntax:'<color>';inherits:true;initial-value:#26405F}
@property --surface{syntax:'<color>';inherits:true;initial-value:#12253F}
@property --surface2{syntax:'<color>';inherits:true;initial-value:#183156}
@property --kicker{syntax:'<color>';inherits:true;initial-value:#F2A900}
@property --accent2{syntax:'<color>';inherits:true;initial-value:#6E9BE0}

:root{
  /* theme (animated) — starts dark */
  --bg:#0B1A2E; --fg:#FFFFFF; --fg2:#C3D0E2; --line:#26405F; --surface:#12253F; --surface2:#183156; --kicker:#F2A900; --accent2:#6E9BE0;
  /* fixed brand */
  --blue:#1D4B95; --blue-lt:#6E9BE0; --navy:#0B1A2E; --navy-2:#12253F; --line-dk:#26405F;
  --steel:#E8ECF1; --white:#FFFFFF; --ink:#10213A; --ink-2:#3B4C63; --line-lt:#C8D1DC;
  --amber:#F2A900; --amber-dk:#B97F00;
  --ease:cubic-bezier(.7,0,.2,1); --ease-out:cubic-bezier(.2,.7,.2,1);
  --wrap:1280px;
  --font:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  --font-cond:'Archivo','Arial Narrow','Roboto Condensed','Helvetica Neue',sans-serif;
}
html.no-gsap{transition:--bg .7s,--fg .7s,--fg2 .7s,--line .7s,--surface .7s,--surface2 .7s,--kicker .7s,--accent2 .7s}
*{box-sizing:border-box}
html{scroll-padding-top:84px}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
body{margin:0;font-family:var(--font);font-size:17px;line-height:1.6;color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button{font-family:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--amber);color:var(--ink);padding:10px 16px;z-index:300}
.skip:focus{left:8px}
main{position:relative}

/* ---------- Type ---------- */
h1,.h2,.hero-title,.stat-n,.marquee-track span,.pp-signs,.id-name,.ap-n,.cat-title,.big,.industries li span,.clients li,.tl-y,.cat-i,.questions li span,.pcard h3,.hub-card h3,.hs-code,.rel-card span{font-family:var(--font-cond)}
.h2{font-stretch:72%;font-weight:800;font-size:clamp(38px,5.2vw,68px);line-height:.98;letter-spacing:-.012em;margin:0}
.h2.xl{font-size:clamp(46px,6.6vw,92px);line-height:.95}
.lead{color:var(--fg2);max-width:34em;margin:18px 0 0;font-size:18px}
.kicker{margin:0 0 16px;font-size:15px;font-weight:600;color:var(--kicker)}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split .w > span{display:inline-block;will-change:transform}
p{color:inherit}

/* ---------- Flow thread (continuous line through the page) ---------- */
.thread{position:absolute;left:0;top:0;width:100%;pointer-events:none;z-index:0;overflow:visible}
.thread .route{fill:none;stroke:var(--line);stroke-width:1.5;stroke-dasharray:4 8}
.thread .drawn{fill:none;stroke:var(--accent2);stroke-width:2}
.thread .head{fill:var(--amber)}
.thread .head-glow{fill:var(--amber);opacity:.25}
@media (max-width:1180px){.thread{display:none}}
main > section, main > div{position:relative;z-index:1}

/* ---------- Custom cursor ---------- */
.cursor{display:none}
@media (hover:hover) and (pointer:fine){
  .has-cursor, .has-cursor a, .has-cursor button, .has-cursor summary{cursor:none}
  .has-cursor input, .has-cursor textarea, .has-cursor select{cursor:text}
  .has-cursor .cursor{display:block;position:fixed;inset:0;pointer-events:none;z-index:400}
  .cursor-dot,.cursor-ring{position:fixed;left:0;top:0;border-radius:50%;pointer-events:none}
  .cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--amber)}
  .cursor-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid var(--accent2);transition:width .25s var(--ease),height .25s var(--ease),margin .25s var(--ease),border-color .25s,background .25s}
  .cursor-ring::before,.cursor-ring::after{content:"";position:absolute;background:var(--accent2)}
  .cursor-ring::before{left:50%;top:-6px;width:1.5px;height:6px;margin-left:-.75px;box-shadow:0 44px 0 var(--accent2)}
  .cursor-ring::after{top:50%;left:-6px;height:1.5px;width:6px;margin-top:-.75px;box-shadow:44px 0 0 var(--accent2)}
  .cursor.hover .cursor-ring{width:62px;height:62px;margin:-31px 0 0 -31px;border-color:var(--amber);background:rgba(242,169,0,.08)}
  .cursor.hover .cursor-ring::before,.cursor.hover .cursor-ring::after{opacity:0}
  .cursor.down .cursor-ring{width:26px;height:26px;margin:-13px 0 0 -13px}
}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;font-weight:700;font-size:15px;text-decoration:none;border:2px solid transparent;cursor:pointer;overflow:hidden;isolation:isolate;transition:color .3s var(--ease),border-color .3s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateX(-101%);transition:transform .38s var(--ease)}
.btn:hover::before{transform:none}
.btn-lg{min-height:56px;padding:0 30px;font-size:16px}
.btn-amber{background:var(--amber);color:var(--ink)}
.btn-amber::before{background:var(--ink)}
.btn-amber:hover{color:var(--amber)}
.btn-ghost{border-color:var(--line);color:var(--fg);background:transparent}
.btn-ghost::before{background:var(--fg)}
.btn-ghost:hover{color:var(--bg);border-color:var(--fg)}
.magnetic{will-change:transform}

/* ---------- Boot ---------- */
.boot{position:fixed;inset:0;z-index:500;background:var(--navy);display:flex;align-items:center;justify-content:center;transition:clip-path .8s var(--ease);clip-path:inset(0 0 0 0)}
.boot.done{clip-path:inset(0 0 100% 0);pointer-events:none}
.boot-inner{width:min(420px,84vw);display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.boot-k{margin:0;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--amber)}
.boot-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-family:var(--font-cond);font-stretch:72%;font-weight:700;font-size:clamp(24px,6.4vw,32px);line-height:1.1;color:#fff}
.boot-steps li{display:flex;align-items:center;gap:14px;opacity:0;transform:translateY(8px);animation:bootIn .35s var(--ease-out) forwards}
.boot-steps li::before{content:"";flex-shrink:0;width:10px;height:10px;border:2px solid #5E7597;animation:bootTick .2s var(--ease) forwards}
.boot-steps li:nth-child(1){animation-delay:.1s}.boot-steps li:nth-child(1)::before{animation-delay:.5s}
.boot-steps li:nth-child(2){animation-delay:.5s}.boot-steps li:nth-child(2)::before{animation-delay:.9s}
.boot-steps li:nth-child(3){animation-delay:.9s}.boot-steps li:nth-child(3)::before{animation-delay:1.3s}
.boot-bar{width:100%;height:2px;background:var(--line-dk);overflow:hidden;margin-top:6px}
.boot-bar span{display:block;height:100%;width:100%;background:var(--amber);transform:translateX(-100%);animation:boot 1.6s var(--ease) forwards}
.boot-final{margin:0;font-size:15px;color:#BFD3F2;opacity:0;animation:bootIn .4s var(--ease-out) 1.4s forwards}
@keyframes boot{to{transform:none}}
@keyframes bootIn{to{opacity:1;transform:none}}
@keyframes bootTick{to{background:var(--amber);border-color:var(--amber)}}

/* ---------- Nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(232,236,241,.9);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line-lt);transition:transform .45s var(--ease);color:var(--ink)}
.nav.hide{transform:translateY(-100%)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:74px}
.nav-logo img{width:260px;height:auto;max-width:56vw}
.nav-links{display:flex;gap:26px;font-size:15px;font-weight:600;align-items:center}
.nav-links a:not(.btn){position:relative;text-decoration:none;padding:6px 0}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--blue);transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.nav-links a:not(.btn):hover::after,.nav-links a.active::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav-cta-mobile{display:none}
.nav-toggle{display:none;width:44px;height:44px;border:0;background:var(--ink);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--white);transition:transform .3s var(--ease)}
.nav-toggle[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.nav-progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--amber);transform:scaleX(0);transform-origin:left}
@media (max-width:1080px){
  .nav-cta{display:none}
  .nav-toggle{display:flex}
  .nav-links{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--steel);border-bottom:1px solid var(--line-lt);padding:8px 28px 24px;clip-path:inset(0 0 100% 0);transition:clip-path .45s var(--ease);visibility:hidden}
  .nav-links.open{clip-path:inset(0 0 0 0);visibility:visible}
  .nav-links a:not(.btn){padding:14px 0;border-bottom:1px solid var(--line-lt);font-size:19px}
  .nav-cta-mobile{display:inline-flex;margin-top:18px}
}

/* ---------- Shared bits ---------- */
.section{position:relative;padding:120px 0}
.split-head{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:end}
.split-head .lead{margin:0}
.tech-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(color-mix(in srgb,var(--accent2) 10%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent2) 10%,transparent) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 75%)}
.corner{position:absolute;width:22px;height:22px;border:3px solid var(--amber);z-index:3;pointer-events:none}
.corner.tl{top:-10px;left:-10px;border-right:0;border-bottom:0}
.corner.tr{top:-10px;right:-10px;border-left:0;border-bottom:0}
.corner.bl{bottom:-10px;left:-10px;border-right:0;border-top:0}
.corner.br{bottom:-10px;right:-10px;border-left:0;border-top:0}
@keyframes led{50%{opacity:.2}}
@keyframes ppIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- Hero (home) ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-start;padding-top:74px}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 72% 45%,rgba(29,75,149,.45) 0%,transparent 60%);pointer-events:none}
.hero-stage{position:absolute;inset:0}
#robot3d{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(110,155,224,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(110,155,224,.07) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(90deg,#000 0%,transparent 60%);-webkit-mask-image:linear-gradient(90deg,#000 0%,transparent 60%)}
.hero-inner{position:relative;z-index:2;width:100%;pointer-events:none;flex:1;display:flex;align-items:center;padding-top:48px;padding-bottom:24px}
.hero-copy{max-width:700px;pointer-events:auto}
.hero-title{margin:0;font-stretch:68%;font-weight:800;font-size:clamp(46px,6vw,88px);line-height:.92;letter-spacing:-.018em}
.hero-title .scramble{display:block;min-height:.95em}
.hero-title .alt{color:#BFD3F2}
.scramble .g{color:var(--amber)}
.hero-sub{margin:28px 0 0;max-width:32em;font-size:19px;color:var(--fg2)}
.hero-ctas{margin-top:38px;display:flex;flex-wrap:wrap;gap:14px}
.hero-hint{margin:28px 0 0;display:flex;align-items:center;gap:10px;font-size:14px;color:#8EA3C2}
.hint-dot{width:8px;height:8px;border-radius:50%;background:var(--amber);animation:hint 1.8s infinite}
@keyframes hint{0%{box-shadow:0 0 0 0 rgba(242,169,0,.6)}70%{box-shadow:0 0 0 10px rgba(242,169,0,0)}100%{box-shadow:0 0 0 0 rgba(242,169,0,0)}}
.no-webgl .hero-hint{display:none}
.hero-stats{position:relative;z-index:2;margin-top:32px;width:100%;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);pointer-events:none;padding-bottom:28px}
.stat{padding:22px 24px 0 0;display:flex;flex-direction:column;gap:4px}
.stat + .stat{padding-left:24px;border-left:1px solid var(--line)}
.stat-n{font-stretch:70%;font-weight:800;font-size:clamp(34px,3.6vw,52px);line-height:1}
.stat-l{font-size:14px;color:#8EA3C2}

/* ---------- Marquee ---------- */
.marquee-band{padding:56px 0 72px;overflow:hidden}
.marquee-title{margin:0 auto 32px;max-width:var(--wrap);padding:0 28px;font-size:15px;font-weight:600;color:var(--fg2)}
.marquee{display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee + .marquee{margin-top:14px}
.marquee-track{display:flex;flex-shrink:0;gap:14px;padding-right:14px;animation:marq 48s linear infinite}
.marquee.reverse .marquee-track{animation-direction:reverse;animation-duration:56s}
.gs .marquee-track{animation:none}
.marquee-track span{flex-shrink:0;display:inline-flex;align-items:center;min-height:72px;padding:0 34px;border:1px solid var(--line);font-stretch:72%;font-weight:800;font-size:28px;white-space:nowrap;transition:border-color .3s,color .3s,background .3s}
.marquee-track span:hover{border-color:var(--amber);color:var(--amber);background:rgba(242,169,0,.06)}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- Plant explorer ---------- */
.plant{margin-top:60px;display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:stretch}
.plant-map{position:relative;background:var(--surface2);padding:40px 32px;display:flex;flex-direction:column;justify-content:center;gap:56px;overflow:hidden}
.plant-map::before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:14px 14px;opacity:.8}
.plant-row{position:relative;display:grid;gap:16px}
.plant-row.main{grid-template-columns:repeat(4,1fr)}
.plant-row.support{grid-template-columns:repeat(3,1fr);width:80%;margin:0 auto}
.flow-line{position:absolute;left:-12px;right:-12px;top:50%;margin-top:-2px;height:4px;z-index:0;background:var(--line);overflow:hidden}
.flow-line span{position:absolute;inset:0;background:repeating-linear-gradient(90deg,var(--blue) 0 18px,transparent 18px 34px);animation:flow 1.2s linear infinite}
@keyframes flow{to{transform:translateX(34px)}}
.plant-row.support .station::before{content:"";position:absolute;left:50%;bottom:100%;width:2px;height:56px;background:repeating-linear-gradient(180deg,var(--fg2) 0 6px,transparent 6px 12px);opacity:.6}
.station{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 10px 14px;background:var(--surface);border:2px solid var(--line);cursor:pointer;color:var(--fg);transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease),background .3s}
.station svg{width:46px;height:46px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s}
.station .st-name{font-size:14px;font-weight:700;text-align:center;line-height:1.2}
.station .st-led{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--line)}
.station:hover{transform:translateY(-4px);border-color:var(--blue)}
.station[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:var(--white);box-shadow:0 0 0 6px rgba(29,75,149,.18),0 18px 40px -18px rgba(11,26,46,.6)}
.station[aria-selected="true"] svg{stroke:var(--amber)}
.station[aria-selected="true"] .st-led{background:var(--amber);animation:led 1s steps(2) infinite}
.station[aria-selected="true"]::after{content:"";position:absolute;inset:-10px;border:1px solid var(--blue-lt);animation:ping 1.6s var(--ease-out) infinite;pointer-events:none}
@keyframes ping{0%{opacity:1;transform:scale(.96)}100%{opacity:0;transform:scale(1.08)}}
.plant-panels{position:relative;background:var(--navy);color:var(--white);padding:44px;min-height:440px;overflow:hidden}
.plant-panels::before{content:"";position:absolute;top:0;left:0;height:3px;width:100%;background:var(--amber);transform:scaleX(0);transform-origin:left}
.plant-panels.swap::before{animation:bar .7s var(--ease) forwards}
@keyframes bar{0%{transform:scaleX(0);transform-origin:left}50%{transform:scaleX(1);transform-origin:left}50.1%{transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
.pp{display:flex;flex-direction:column;gap:14px;height:100%}
.pp[hidden]{display:none}
.pp-label{margin:0;font-size:14px;font-weight:600;color:var(--amber)}
.pp-signs{margin:0;font-stretch:75%;font-size:clamp(26px,2.6vw,36px);font-weight:700;line-height:1.15}
.pp-start{margin:0;font-size:18px;color:#C3D0E2}
.pp-rule{height:1px;background:var(--line-dk);margin:10px 0}
.pp-routes{list-style:none;margin:auto 0 0;padding:16px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.pp-routes li{padding:6px 12px;border:1px solid var(--amber);color:var(--amber);font-size:14px;font-weight:600}

/* ---------- Inspect ---------- */
.inspect-grid{position:relative;display:grid;grid-template-columns:1fr 1.15fr;gap:72px;align-items:center}
.inspect-copy p{max-width:30em;margin:24px 0 0;color:var(--fg2)}
.inspect-detail{margin-top:36px;border-left:3px solid var(--amber);padding:6px 0 6px 22px;min-height:170px}
.id-name{margin:0 !important;font-stretch:72%;font-size:32px;font-weight:800;color:var(--fg) !important}
.id-fail{margin:10px 0 0 !important}
.id-supply{margin:12px 0 0 !important;color:var(--amber) !important;font-weight:600}
.inspect-detail.swap > *{animation:ppIn .45s var(--ease-out) both}
.inspect-detail.swap > *:nth-child(2){animation-delay:.06s}
.inspect-detail.swap > *:nth-child(3){animation-delay:.12s}
.inspect-figure{position:relative;margin:0}
.inspect-img{position:relative;background:var(--white);overflow:hidden}
.inspect-img img{width:100%;height:auto}
.scanline{position:absolute;top:0;bottom:0;width:30%;left:-30%;background:linear-gradient(90deg,transparent,rgba(242,169,0,.18),rgba(242,169,0,.55) 98%,transparent);animation:sweep 4.5s var(--ease) infinite;pointer-events:none}
@keyframes sweep{0%{left:-30%}60%,100%{left:100%}}
.hotspot{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border:0;background:transparent;cursor:pointer;padding:0}
.hotspot span{position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:var(--amber);border:2px solid var(--ink);transition:transform .3s var(--ease)}
.hotspot::before,.hotspot::after{content:"";position:absolute;inset:8px;border-radius:50%;border:2px solid var(--blue);animation:hot 2.2s var(--ease-out) infinite}
.hotspot::after{animation-delay:1.1s}
@keyframes hot{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.9);opacity:0}}
.hotspot:hover span{transform:scale(1.3)}
.hotspot.active span{background:var(--blue);border-color:var(--white);transform:scale(1.35)}

/* ---------- Approach (pinned horizontal) ---------- */
.approach{overflow:hidden}
.approach-pin{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:110px 0 80px}
.approach-progress{margin-top:36px;height:2px;background:var(--line);max-width:420px}
.approach-progress span{display:block;height:100%;background:var(--accent2);transform:scaleX(0);transform-origin:left}
.approach-track{list-style:none;margin:56px 0 0;padding:0 28px 0 max(28px,calc((100vw - var(--wrap))/2 + 28px));display:flex;gap:28px;will-change:transform}
.ap-card{position:relative;flex:0 0 min(420px,78vw);min-height:380px;background:var(--surface);border:1px solid var(--line);padding:36px;display:flex;flex-direction:column;overflow:hidden;transition:border-color .3s var(--ease)}
.ap-card:hover{border-color:var(--accent2)}
.ap-n{font-stretch:68%;font-weight:800;font-size:96px;line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--accent2)}
.ap-card h3{margin:22px 0 10px;font-size:28px}
.ap-card p{margin:0;color:var(--fg2);max-width:24em}
.ap-ico{position:absolute;right:24px;bottom:24px;width:110px;height:110px;fill:none;stroke:var(--amber);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.ap-ico *{stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.2s var(--ease)}
.ap-card.on .ap-ico *{stroke-dashoffset:0}

/* ---------- Category explorer (home) ---------- */
.cat-explorer{margin-top:60px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.cat-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.cat-btn{position:relative;width:100%;display:flex;align-items:center;gap:18px;min-height:56px;padding:0 8px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;font-size:18px;font-weight:600;color:var(--fg);cursor:pointer;overflow:hidden;isolation:isolate;transition:color .3s var(--ease),padding .35s var(--ease);text-decoration:none}
.cat-btn::before{content:"";position:absolute;inset:0;background:var(--navy);transform:scaleY(0);transform-origin:bottom;transition:transform .35s var(--ease);z-index:-1}
.cat-i{font-stretch:72%;font-size:15px;font-weight:700;color:var(--fg2);transition:color .3s}
.cat-btn:hover{padding-left:18px}
.cat-btn.active{color:var(--white);padding-left:18px}
.cat-btn.active::before{transform:scaleY(1)}
.cat-btn.active .cat-i{color:var(--amber)}
.cat-btn .go{margin-left:auto;opacity:0;transform:translateX(-8px);transition:opacity .3s,transform .3s var(--ease);font-size:14px;font-weight:700;color:var(--amber)}
.cat-btn.active .go{opacity:1;transform:none}
.cat-view{position:sticky;top:110px;background:var(--surface)}
.cat-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#F3F5F8;display:flex;align-items:center;justify-content:center}
.cat-img img{width:100%;height:100%;object-fit:cover;transition:opacity .35s var(--ease),transform .9s var(--ease-out)}
.cat-img img.contain{object-fit:contain;padding:18px}
.cat-img img.out{opacity:0;transform:scale(1.06)}
.cat-info{padding:26px 28px 30px}
.cat-title{margin:0;font-stretch:72%;font-size:32px;font-weight:800;line-height:1.05}
.cat-hs{margin:8px 0 0;font-size:14px;font-weight:600;color:var(--accent2)}
.cat-desc{margin:10px 0 18px;color:var(--fg2)}
.cat-link{font-weight:700;color:var(--fg);text-decoration:none;border-bottom:2px solid var(--amber);padding-bottom:2px}

/* ---------- Automation ---------- */
.auto-grid{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:60px 64px;align-items:start}
.auto-copy p{max-width:32em;margin:22px 0 0;color:var(--fg2)}
.chips{list-style:none;margin:34px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips li{padding:8px 14px;border:1px solid var(--line);font-size:15px;transition:border-color .25s,color .25s,transform .25s var(--ease)}
.chips li:hover{border-color:var(--amber);color:var(--amber);transform:translateY(-2px)}
.robot-wrap{position:relative;border:1px solid var(--line-dk);background:var(--navy-2);color:#C3D0E2}
.robot-head{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line-dk);font-size:13px;color:#8EA3C2}
.rh-dot{width:8px;height:8px;border-radius:50%;background:#7CFFB2;animation:led 1.2s steps(2) infinite}
.rh-btn{margin-left:auto;min-height:32px;padding:0 12px;border:1px solid var(--line-dk);background:transparent;color:#C3D0E2;font-size:13px;font-weight:600;cursor:pointer}
.rh-btn:hover{border-color:var(--amber);color:var(--amber)}
.robot{width:100%;height:auto;display:block;padding:12px}
.questions{grid-column:1 / -1;border:1px solid var(--line);padding:36px;display:grid;grid-template-columns:1fr 2fr;gap:32px;background:color-mix(in srgb,var(--surface) 60%,transparent)}
.questions h3{margin:0;font-size:22px}
.questions ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.questions li{display:flex;gap:16px;padding:16px 0;border-top:1px solid var(--line);color:var(--fg2)}
.questions li span{font-stretch:72%;font-size:26px;font-weight:300;color:var(--amber);line-height:1}
.floor{stroke:var(--line-dk);stroke-width:2}
.belt{fill:#22395C}
.belt-move{stroke:var(--blue-lt);stroke-width:2;stroke-dasharray:10 8;animation:belt 1s linear infinite}
@keyframes belt{to{stroke-dashoffset:-18}}
.roller{fill:var(--blue-lt)}.leg{fill:#22395C}.pallet{fill:#8A6A2E}
.box{fill:var(--amber);stroke:var(--amber-dk);stroke-width:2}
.base{fill:#22395C}.base-top{fill:#2C4A78}
.link{fill:#D9E2EE}.link2{fill:#C7D3E4}
.joint{fill:var(--blue);stroke:var(--navy);stroke-width:2}
.joint-core{fill:var(--amber)}
.tool{fill:#5E7597}.finger{fill:#9FB2CC}
.led{fill:#7CFFB2;animation:led 1.2s steps(2) infinite}
.laser{stroke:#FF5A4E;stroke-width:1.5;stroke-dasharray:4 4;opacity:0;animation:laser 7s linear infinite}
@keyframes laser{0%,6%{opacity:0}8%,20%{opacity:.9}22%,100%{opacity:0}}
.j-shoulder,.j-elbow,.j-wrist,.finger,.box-pick,.box-place,.box-carry{transform-box:view-box}
.j-shoulder{transform-origin:300px 330px;animation:shoulder 7s var(--ease) infinite}
.j-elbow{transform-origin:300px 180px;animation:elbow 7s var(--ease) infinite}
.j-wrist{transform-origin:300px 40px;animation:wrist 7s var(--ease) infinite}
.finger-l{animation:fl 7s var(--ease) infinite}
.finger-r{animation:fr 7s var(--ease) infinite}
.box-carry{animation:carry 7s linear infinite}
.box-pick{animation:pick 7s linear infinite}
.box-place{animation:place 7s linear infinite}
.paused .j-shoulder,.paused .j-elbow,.paused .j-wrist,.paused .finger,.paused .box,.paused .belt-move,.paused .laser,.paused .led{animation-play-state:paused}
@keyframes shoulder{0%{transform:rotate(0)}14%{transform:rotate(-8.1deg)}24%,32%{transform:rotate(-16.4deg)}42%{transform:rotate(-8.1deg)}52%{transform:rotate(0)}62%{transform:rotate(8.1deg)}72%,80%{transform:rotate(14.4deg)}90%{transform:rotate(8.1deg)}100%{transform:rotate(0)}}
@keyframes elbow{0%{transform:rotate(0)}14%{transform:rotate(-89.5deg)}24%,32%{transform:rotate(-106.4deg)}42%{transform:rotate(-89.5deg)}52%{transform:rotate(0)}62%{transform:rotate(89.5deg)}72%,80%{transform:rotate(104.4deg)}90%{transform:rotate(89.5deg)}100%{transform:rotate(0)}}
@keyframes wrist{0%{transform:rotate(0)}14%{transform:rotate(97.6deg)}24%,32%{transform:rotate(122.8deg)}42%{transform:rotate(97.6deg)}52%{transform:rotate(0)}62%{transform:rotate(-97.6deg)}72%,80%{transform:rotate(-118.8deg)}90%{transform:rotate(-97.6deg)}100%{transform:rotate(0)}}
@keyframes fl{0%,26%{transform:translateX(0)}29%,74%{transform:translateX(5px)}77%,100%{transform:translateX(0)}}
@keyframes fr{0%,26%{transform:translateX(0)}29%,74%{transform:translateX(-5px)}77%,100%{transform:translateX(0)}}
@keyframes carry{0%,28.9%{opacity:0}29%,75.9%{opacity:1}76%,100%{opacity:0}}
@keyframes pick{0%,28.9%{opacity:1;transform:none}29%,88%{opacity:0;transform:translateX(-60px)}100%{opacity:1;transform:none}}
@keyframes place{0%,75.9%{opacity:0}76%,92%{opacity:1}100%{opacity:0}}

/* ---------- Statement ---------- */
.statement{padding:170px 0}
.amber-rule{display:block;width:72px;height:4px;background:var(--amber)}
.big{margin:32px 0 0;font-stretch:68%;font-weight:800;font-size:clamp(46px,7.4vw,112px);line-height:.98;letter-spacing:-.018em;max-width:13em}
.lit .lw{color:var(--line);transition:color .2s}
.lit .lw.on{color:var(--fg)}
.lit .lw.on.b{color:var(--accent2)}
.two-col{margin-top:52px;display:grid;grid-template-columns:1fr 1fr;gap:32px}
.two-col p{margin:0;color:var(--fg2);max-width:30em}

/* ---------- Industries ---------- */
.industries{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.industries li{position:relative;background:var(--surface);min-height:150px;padding:24px;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.industries li::before{content:"";position:absolute;inset:0;background:var(--navy);transform:translateY(101%);transition:transform .45s var(--ease);z-index:-1}
.industries li::after{content:"";position:absolute;top:22px;left:24px;width:22px;height:3px;background:var(--amber);transition:width .45s var(--ease)}
.industries li span{font-stretch:74%;font-size:26px;font-weight:800;line-height:1.05;transition:color .35s}
.industries li:hover::before{transform:none}
.industries li:hover::after{width:calc(100% - 48px)}
.industries li:hover span{color:var(--white)}

/* ---------- Clients ---------- */
.clients{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.clients li{position:relative;background:var(--surface);min-height:120px;display:flex;align-items:center;justify-content:center;padding:18px;text-align:center;font-stretch:72%;font-size:21px;font-weight:800;line-height:1.1;transition:color .3s var(--ease)}
.clients li::after{content:"";position:absolute;inset:0;border:2px solid var(--amber);opacity:0;transform:scale(.94);transition:opacity .3s,transform .3s var(--ease)}
.clients li:hover{color:var(--accent2)}
.clients li:hover::after{opacity:1;transform:none}


/* ---------- About ---------- */
.about-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:64px}
.about-copy p{margin:0 0 18px;color:var(--fg2)}
.timeline{margin-top:30px;border-left:2px solid var(--line);padding-left:24px;display:flex;flex-direction:column;gap:22px}
.tl-item{position:relative;display:flex;flex-direction:column}
.tl-item::before{content:"";position:absolute;left:-32px;top:6px;width:14px;height:14px;background:var(--bg);border:3px solid var(--accent2)}
.tl-y{font-stretch:72%;font-weight:800;font-size:24px;color:var(--accent2)}
.tl-t{color:var(--fg2)}

/* ---------- FAQ ---------- */
.faq-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:64px;align-items:start}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;font-size:19px;font-weight:700;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex-shrink:0;width:14px;height:14px;border-right:2.5px solid var(--accent2);border-bottom:2.5px solid var(--accent2);transform:rotate(45deg) translate(-3px,-3px);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq details p{margin:0 0 22px;color:var(--fg2);max-width:40em}

/* ---------- Contact ---------- */
.contact-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:64px}
.contact-grid > div > p{margin:28px 0 0;max-width:30em;color:var(--fg2)}
.contact-lines{margin-top:36px;display:flex;flex-direction:column;gap:10px}
.contact-lines a{font-weight:700;font-size:20px;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:10px;transition:color .25s}
.contact-lines a:hover{color:var(--amber)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-content:start}
.form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600}
.form .full{grid-column:1 / -1}
.form input,.form select,.form textarea{font:inherit;font-size:16px;min-height:52px;padding:0 14px;border:1px solid var(--line);background:var(--surface);color:var(--fg);transition:border-color .25s,box-shadow .25s}
.form textarea{padding:12px 14px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(242,169,0,.25)}
.form .invalid{border-color:#FF8A7A}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.form-status{margin:0;font-size:15px;color:var(--amber)}

/* ---------- Footer ---------- */
.footer{position:relative;z-index:1;padding:0 0 40px;color:var(--fg2)}
.footer .wrap{border-top:1px solid var(--line);padding-top:40px}
.footer-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.footer-logo{display:inline-block;padding:4px 0}
.footer-logo img{width:300px;max-width:68vw;height:auto}
.footer-top p{margin:0;font-size:14px}
.footer-cats{margin:36px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:8px 24px;font-size:15px}
.footer-cats a{text-decoration:none;color:var(--fg2)}
.footer-cats a:hover{color:var(--amber)}
.footer-h{margin:36px 0 0;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--fg)}
.footer-grid{margin-top:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;font-size:15px}
.footer address{font-style:normal}
.footer address strong{display:block;margin-bottom:6px;color:var(--fg)}
.copy{margin:36px 0 0;font-size:13px}

/* =========================================================
   Product pages
   ========================================================= */
.crumbs{margin:0 0 22px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--fg2)}
.crumbs li + li::before{content:"/";margin-right:8px;opacity:.6}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--amber)}
.phero{position:relative;padding:170px 0 100px;overflow:hidden}
.phero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 80% 30%,rgba(29,75,149,.4) 0%,transparent 55%);pointer-events:none}
.phero-grid{position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:64px;align-items:center}
.phero h1{margin:0;font-stretch:68%;font-weight:800;font-size:clamp(46px,6.2vw,92px);line-height:.94;letter-spacing:-.015em}
.phero .lead{font-size:19px}
.hs-row{margin:28px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.hs-row li{display:flex;align-items:baseline;gap:8px;padding:8px 14px;border:1px solid var(--line);font-size:14px;color:var(--fg2)}
.hs-code{font-stretch:72%;font-size:20px;font-weight:800;color:var(--amber)}
.phero-ctas{margin-top:34px;display:flex;flex-wrap:wrap;gap:14px}
.phero-visual{position:relative;aspect-ratio:1/1;max-width:520px;width:100%;justify-self:end}
.phero-visual .pv-img{position:absolute;inset:0;background:var(--white);overflow:hidden}
.phero-visual .pv-img img{width:100%;height:100%;object-fit:cover}
.phero-visual .pv-img img.contain{object-fit:contain;padding:28px}
.phero-visual .pv-icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent)}
.phero-visual .pv-icon svg{width:46%;height:46%;fill:none;stroke:var(--amber);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.phero-visual .pv-icon svg *{stroke-dasharray:300;stroke-dashoffset:300;animation:drawIco 2.2s var(--ease) .6s forwards}
@keyframes drawIco{to{stroke-dashoffset:0}}
.pv-orbit{position:absolute;inset:-18px;border:1px dashed var(--line);border-radius:50%;animation:spin 40s linear infinite;pointer-events:none}
.pv-orbit::after{content:"";position:absolute;top:50%;left:-6px;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:var(--amber);box-shadow:0 0 16px var(--amber)}
@keyframes spin{to{transform:rotate(360deg)}}

.pgrid{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.pcard{position:relative;background:var(--surface);padding:30px 28px 32px;min-height:220px;overflow:hidden;isolation:isolate;transition:color .35s}
.pcard::before{content:"";position:absolute;inset:0;background:var(--navy);transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease);z-index:-1}
.pcard .pc-n{font-size:13px;font-weight:700;color:var(--amber)}
.pcard h3{margin:14px 0 10px;font-stretch:74%;font-size:28px;font-weight:800;line-height:1.05}
.pcard p{margin:0;color:var(--fg2);transition:color .35s}
.pcard:hover{color:var(--white)}
.pcard:hover p{color:#C3D0E2}
.pcard:hover::before{transform:scaleY(1)}

.enquiry{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:start}
.checklist{list-style:none;margin:0;padding:0;counter-reset:c}
.checklist li{counter-increment:c;display:flex;gap:18px;padding:18px 0;border-top:1px solid var(--line);color:var(--fg2)}
.checklist li:last-child{border-bottom:1px solid var(--line)}
.checklist li::before{content:counter(c,decimal-leading-zero);font-family:var(--font-cond);font-stretch:72%;font-weight:800;font-size:22px;color:var(--amber);line-height:1.2;min-width:2ch}
.checklist strong{color:var(--fg)}

.apps{list-style:none;margin:40px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.apps li{padding:10px 16px;border:1px solid var(--line);font-weight:600;transition:border-color .25s,color .25s}
.apps li:hover{border-color:var(--amber);color:var(--amber)}

.related{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rel-card{display:flex;align-items:center;gap:18px;padding:22px;border:1px solid var(--line);text-decoration:none;background:var(--surface);transition:border-color .3s var(--ease),transform .3s var(--ease)}
.rel-card svg{flex-shrink:0;width:44px;height:44px;fill:none;stroke:var(--accent2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rel-card span{font-stretch:74%;font-size:22px;font-weight:800;line-height:1.1}
.rel-card:hover{border-color:var(--amber);transform:translateY(-4px)}

/* hub */
.hub{list-style:none;margin:60px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hub-card{position:relative;display:flex;flex-direction:column;gap:12px;min-height:260px;padding:30px;border:1px solid var(--line);background:var(--surface);text-decoration:none;overflow:hidden;isolation:isolate;transition:border-color .3s var(--ease),color .35s}
.hub-card::before{content:"";position:absolute;inset:0;background:var(--navy);transform:translateY(101%);transition:transform .5s var(--ease);z-index:-1}
.hub-card svg{width:52px;height:52px;fill:none;stroke:var(--accent2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s}
.hub-card h3{margin:auto 0 0;font-stretch:72%;font-size:30px;font-weight:800;line-height:1.02}
.hub-card .hc-hs{font-size:13px;font-weight:700;color:var(--amber)}
.hub-card p{margin:0;color:var(--fg2);font-size:15px;transition:color .35s}
.hub-card:hover{color:var(--white);border-color:var(--navy)}
.hub-card:hover::before{transform:none}
.hub-card:hover svg{stroke:var(--amber)}
.hub-card:hover p{color:#C3D0E2}

/* ---------- Reveal ---------- */
.js [data-anim="fade"]{opacity:0;transform:translateY(26px)}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .split-head,.plant,.inspect-grid,.cat-explorer,.auto-grid,.about-grid,.contact-grid,.questions,.faq-grid,.phero-grid,.enquiry{grid-template-columns:1fr}
  .split-head{gap:20px}
  .cat-view{position:relative;top:0;order:-1}
  .clients{grid-template-columns:repeat(3,1fr)}
  .industries,.pgrid,.hub,.related{grid-template-columns:repeat(2,1fr)}
  .questions ol{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-cats{grid-template-columns:repeat(2,1fr)}
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(3){padding-left:0;border-left:0}
  .hero-grid{mask-image:none;-webkit-mask-image:none}
  .phero-visual{justify-self:start;max-width:380px}
}
@media (max-width:760px){
  .hero{padding-top:110px}
  .hero-stage{opacity:.32}
  .section{padding:84px 0}
  .phero{padding:130px 0 70px}
  .plant-row.main{grid-template-columns:repeat(2,1fr)}
  .plant-row.support{grid-template-columns:repeat(3,1fr);width:100%}
  .flow-line,.plant-row.support .station::before{display:none}
  .plant-map{padding:24px 18px;gap:16px}
  .plant-panels{padding:28px;min-height:0}
  .approach-track{flex-direction:column;padding:0 28px}
  .ap-card{flex:auto;min-height:0}
  .ap-card .ap-ico *{stroke-dashoffset:0}
  .two-col,.form,.pgrid,.hub,.related,.industries{grid-template-columns:1fr}
  .clients{grid-template-columns:repeat(2,1fr)}
  .marquee-track span{font-size:22px;min-height:60px;padding:0 24px}
  .station .st-name{font-size:13px}
  .footer-cats{grid-template-columns:1fr}
}
@media (hover:none){.hero-hint{display:none}}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .boot{display:none}
  .js [data-anim="fade"]{opacity:1;transform:none}
  .marquee-track{animation:none !important}
  .marquee{overflow-x:auto}
  .lit .lw{color:var(--fg)}
  .j-shoulder,.j-elbow,.j-wrist,.finger,.box-carry,.box-pick,.box-place,.laser{animation:none !important}
  .box-carry,.box-place{opacity:0}
}

/* category explorer icon fallback + automation hero */
.cat-img .cat-ico{width:42%;height:42%;fill:none;stroke:var(--blue);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:opacity .2s}
.cat-img .cat-ico *{stroke-dasharray:300;stroke-dashoffset:300;animation:drawIco 1.4s var(--ease) forwards}
.phero-robot{width:100%;max-width:600px;justify-self:end}
@media (max-width:1080px){.phero-robot{justify-self:start}}

/* ---------- Client logos ---------- */
.clients{grid-template-columns:repeat(4,1fr)}
.clients li{background:#FFFFFF;min-height:150px;padding:24px}
.clients li img{max-width:100%;height:auto;object-fit:contain;transition:transform .4s var(--ease)}
.clients li:hover img{transform:scale(1.06)}
.marquee-track .chip{background:#FFFFFF;border-color:transparent;min-height:84px;padding:0 30px}
.marquee-track .chip img{display:block;object-fit:contain}
.marquee-track .chip:hover{background:#FFFFFF;border-color:var(--amber)}
@media (max-width:1080px){.clients{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.clients{grid-template-columns:repeat(2,1fr)}.clients li{min-height:120px}.marquee-track .chip{min-height:68px;padding:0 20px}}

/* =========================================================
   Mobile refinements
   ========================================================= */
html,body{overflow-x:clip}
.split-head > *,.plant > *,.inspect-grid > *,.cat-explorer > *,.auto-grid > *,.about-grid > *,.contact-grid > *,.faq-grid > *,.phero-grid > *,.enquiry > *,.form > *{min-width:0}
.form input,.form select,.form textarea{width:100%;min-width:0}
.contact-lines a{overflow-wrap:anywhere}

@media (max-width:760px){
  body{font-size:16px}
  .wrap{padding:0 20px}
  .section{padding:72px 0}
  .h2{font-size:clamp(32px,9vw,44px)}
  .h2.xl{font-size:clamp(36px,10.5vw,52px)}
  .lead{font-size:16px}
  .hero-title{font-size:clamp(42px,12vw,60px)}
  .hero-sub{font-size:16.5px}
  .hero-ctas .btn{flex:1 1 100%}
  .stat-n{font-size:34px}
  .contact-lines a{font-size:17px}

  /* plant explorer: swipeable strip of stations */
  .plant{margin-top:36px;gap:14px}
  .plant-map{display:flex;flex-direction:row;gap:10px;padding:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .plant-map::-webkit-scrollbar{display:none}
  .plant-map::before{display:none}
  .plant-row,.plant-row.main,.plant-row.support{display:contents}
  .station{flex:0 0 116px;scroll-snap-align:start;padding:14px 8px 12px}
  .station svg{width:36px;height:36px}
  .station:hover{transform:none}
  .station[aria-selected="true"]::after{display:none}
  .plant-panels{padding:24px}
  .pp-signs{font-size:24px}

  /* approach: pinned, cards slide sideways as you scroll */
  .approach-pin{min-height:100vh;min-height:100svh;padding:84px 0 32px}
  .approach-track{flex-direction:row;gap:14px;margin-top:28px;padding:0 20px}
  .ap-card{flex:0 0 78vw;min-height:300px;padding:26px 22px 110px}
  .ap-n{font-size:68px}
  .ap-card h3{font-size:24px}
  .ap-ico{width:76px;height:76px;right:18px;bottom:18px}
  .approach-progress{margin-top:20px}
  /* products: list only, every row is a link */
  .cat-explorer{margin-top:32px}
  .cat-view{display:none}
  .cat-btn{min-height:54px;font-size:16px;padding:0 4px}
  .cat-btn .go{opacity:1;transform:none;color:var(--fg2)}
  .cat-btn.active .go{color:var(--amber)}
  .cat-btn:hover{padding-left:4px}

  /* compact grids */
  .industries{grid-template-columns:repeat(2,1fr);margin-top:32px}
  .industries li{min-height:96px;padding:18px 16px}
  .industries li::after{left:16px;top:16px}
  .industries li span{font-size:19px}
  .clients{grid-template-columns:repeat(4,1fr);margin-top:32px}
  .clients li{min-height:76px;padding:8px}
  .clients li img{max-width:92%;max-height:38px;width:auto;height:auto}
  .pgrid{margin-top:32px}
  .pcard{min-height:0;padding:22px 20px}
  .pcard h3{font-size:24px}
  .hub{margin-top:32px}
  .hub-card{min-height:0;padding:22px}
  .questions{padding:22px}
  .robot-wrap{margin:0 -4px}

  /* footer */
  .footer-cats{grid-template-columns:repeat(2,1fr);gap:8px 16px;font-size:13.5px}
  .footer-logo img{width:240px}
  .footer-grid{gap:20px}

  /* contact */
  .contact-grid{gap:36px}
  .form{gap:14px}
}
@media (max-width:380px){
  .clients{grid-template-columns:repeat(2,1fr)}
  .footer-cats{grid-template-columns:1fr}
}

/* scroll rail (phones and tablets) */
.rail{position:fixed;right:6px;top:96px;bottom:24px;width:2px;background:color-mix(in srgb,var(--fg2) 25%,transparent);z-index:90;pointer-events:none}
.rail-fill{position:absolute;inset:0;background:var(--accent2);transform:scaleY(0);transform-origin:top}
.rail-head{position:absolute;left:-3px;top:0;width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px var(--amber)}
@media (min-width:1181px){.rail{display:none}}
@media (hover:none){.hero-hint{display:flex}}

/* map buttons */
.map-btn{display:inline-flex;align-items:center;gap:8px;margin-top:10px;min-height:40px;padding:0 14px;border:1px solid var(--line);color:var(--fg);font-size:13px;font-weight:700;text-decoration:none;transition:border-color .25s,color .25s}
.map-btn::before{content:"";width:9px;height:9px;border-radius:50% 50% 50% 0;background:var(--amber);transform:rotate(-45deg)}
.map-btn:hover{border-color:var(--amber);color:var(--amber)}
.footer address{display:flex;flex-direction:column;align-items:flex-start}