/* ================================================================
   AQUATEX — shared stylesheet
   ================================================================ */
:root{
  --bg:#04121a; --bg2:#071c28; --soil:#2b1d13; --ink:#dceaf0; --mut:#7295a4;
  --cyan:#00a6e6; --cyan2:#5eeaff; --cyan-dim:#0a5f83; --line:rgba(0,166,230,.14);
  --navy:#24406e; --navy-lt:#4a72ab;
  --f:'Montserrat',system-ui,sans-serif; --m:'IBM Plex Mono',monospace;
}
[data-theme="light"]{
  --bg:#f4f9fb;--bg2:#ffffff;--soil:#e9ddd4;--ink:#092330;--mut:#52717e;
  --cyan:#007eae;--cyan2:#00a6e6;--cyan-dim:#7fc7df;--line:rgba(9,63,86,.16);
  --navy:#24406e;--navy-lt:#4a72ab;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--f);line-height:1.55;overflow-x:hidden}
.wrap{max-width:1200px;margin:0 auto;padding:0 26px}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--cyan2);outline-offset:4px
}
.skip-link{position:fixed;left:18px;top:10px;z-index:300;transform:translateY(-160%);background:var(--cyan);color:#04121a;
  padding:10px 16px;border-radius:6px;font-family:var(--m);font-size:12px;font-weight:600;transition:transform .18s}
.skip-link:focus{transform:translateY(0)}
.ey{font-family:var(--m);font-size:11.5px;letter-spacing:.3em;color:var(--cyan);text-transform:uppercase;display:block}
h2.big{font-size:clamp(32px,5.4vw,58px);font-weight:800;letter-spacing:-.025em;line-height:1.02;margin-top:14px}
.lede{color:var(--mut);margin-top:16px;max-width:62ch;font-size:17px}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:80;backdrop-filter:blur(10px);background:rgba(4,18,26,.7);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:66px}
.nav__logo{height:30px;display:block}
.nav nav{display:flex;gap:26px;align-items:center;font-size:14px;margin-left:auto;order:2}
.nav__actions{display:flex;align-items:center;gap:8px;margin-left:14px;order:3}
.icon-toggle,.lang__button{height:38px;border:1px solid var(--line);border-radius:7px;background:var(--bg2);color:var(--ink);
  cursor:pointer;font-family:var(--m);display:grid;place-items:center;transition:.18s}
.icon-toggle{width:38px;font-size:17px;line-height:1}
.icon-toggle:hover,.lang__button:hover,.lang.open .lang__button{border-color:var(--cyan);color:var(--cyan)}
.lang{position:relative}
.lang__button{min-width:48px;padding:0 9px;font-size:11px;letter-spacing:.08em}
.lang__menu{position:absolute;right:0;top:calc(100% + 9px);z-index:95;min-width:176px;padding:7px;background:rgba(5,20,29,.98);
  border:1px solid var(--line);border-radius:10px;box-shadow:0 22px 60px rgba(0,0,0,.45);display:none}
.lang.open .lang__menu{display:block}
.lang__menu a{display:flex;justify-content:space-between;gap:18px;padding:9px 10px;border-radius:6px;font-size:13px}
.lang__menu a:hover,.lang__menu a[aria-current="true"]{background:rgba(0,166,230,.1);color:var(--cyan)}
.lang__menu small{font-family:var(--m);color:var(--mut)}
.nav nav>a:not(.cta):hover,.navitem>a:hover{color:var(--cyan)}
.nav nav a.on,.navitem.on>a{color:var(--cyan)}
.nav .cta{border:1px solid var(--cyan);color:var(--cyan);padding:9px 16px;font-family:var(--m);font-size:12px;letter-spacing:.08em;transition:.2s}
.nav .cta:hover{background:var(--cyan);color:#04121a}

/* dropdowns */
.navitem{position:relative;display:flex;align-items:center;height:66px}
.navitem>a{display:inline-flex;align-items:center;gap:6px}
.navitem>a::after{content:"";width:5px;height:5px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;
  transform:rotate(45deg) translateY(-1px);opacity:.6;transition:.2s}
.navitem:hover>a::after{opacity:1;transform:rotate(225deg) translateY(-2px)}
.navtoggle{display:none}
.drop{position:absolute;top:100%;left:-16px;min-width:262px;padding:8px;z-index:90;
  background:rgba(5,20,29,.97);border:1px solid var(--line);border-radius:12px;backdrop-filter:blur(14px);
  box-shadow:0 26px 70px rgba(0,0,0,.65);opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s ease}
.navitem:hover .drop,.navitem:focus-within .drop{opacity:1;visibility:visible;transform:translateY(0)}
.drop a{display:block;padding:10px 13px;border-radius:7px;font-size:14px;transition:.15s}
.drop a:hover{background:rgba(0,166,230,.1);color:var(--cyan)}
.drop a small{display:block;font-family:var(--m);font-size:10.5px;letter-spacing:.05em;color:var(--mut);margin-top:3px;text-transform:uppercase}
.drop a:hover small{color:var(--cyan-dim)}
.drop hr{border:0;border-top:1px solid var(--line);margin:6px 9px}
.drop .all{font-family:var(--m);font-size:11px;letter-spacing:.14em;color:var(--cyan);text-transform:uppercase}

/* burger + mobile drawer */
.burger{display:none;width:40px;height:40px;border:1px solid var(--line);border-radius:7px;background:transparent;cursor:pointer;order:4;
  padding:0;align-items:center;justify-content:center;gap:4px;flex-direction:column;flex:0 0 40px}
.burger span{display:block;width:17px;height:1.6px;background:var(--ink);transition:.22s}
.burger.on span:nth-child(1){transform:translateY(5.6px) rotate(45deg)}
.burger.on span:nth-child(2){opacity:0}
.burger.on span:nth-child(3){transform:translateY(-5.6px) rotate(-45deg)}
@media(max-width:1120px){
  header{background:#04121a;backdrop-filter:none;-webkit-backdrop-filter:none}
  .burger{display:flex}
  .nav__actions{margin-left:auto;margin-right:8px}
  .nav nav{position:fixed;z-index:79;top:66px;left:0;right:0;width:100%;height:calc(100vh - 66px);height:calc(100dvh - 66px);
    flex-direction:column;align-items:stretch;gap:0;background:#04121a;
    padding:18px max(26px,env(safe-area-inset-right)) max(40px,env(safe-area-inset-bottom)) max(26px,env(safe-area-inset-left));
    overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    transform:translate3d(100%,0,0);visibility:hidden;transition:transform .28s ease,visibility 0s linear .28s;font-size:16px}
  .nav nav.open{transform:translate3d(0,0,0);visibility:visible;transition-delay:0s}
  .navitem{display:block;height:auto}
  .navitem>a{padding:15px 52px 15px 0;border-bottom:1px solid var(--line);width:100%}
  .navitem>a::after{display:none}
  .navtoggle{display:grid;place-items:center;position:absolute;right:0;top:7px;width:40px;height:40px;border:0;
    border-radius:7px;background:transparent;color:var(--ink);cursor:pointer}
  .navtoggle::after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
    transform:rotate(45deg) translate(-1px,-1px);transition:transform .2s}
  .navitem.open .navtoggle::after{transform:rotate(225deg) translate(-1px,-1px)}
  .drop{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;background:transparent;border:0;
    border-bottom:1px solid var(--line);border-radius:0;padding:4px 0 10px 14px;min-width:0;display:none}
  .navitem.open .drop{display:block;animation:menuDrop .18s ease-out}
  .navitem.open>a::after{transform:rotate(225deg) translateY(-2px)}
  .nav nav>a:not(.cta){padding:15px 0;border-bottom:1px solid var(--line)}
  .nav .cta{margin-top:24px;text-align:center;font-size:13px;padding:14px 16px}
}
@media(max-width:370px){
  .nav__logo{height:24px;max-width:142px}
  .nav__actions{gap:5px;margin-right:5px}
  .icon-toggle{width:34px;height:36px}.lang__button{height:36px;min-width:42px;padding:0 6px}
}
@keyframes menuDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}

/* ---------- hero carousel ---------- */
.hero{position:relative;height:94vh;min-height:560px;overflow:hidden;background:#030e15}
.slides{position:absolute;inset:0;z-index:1}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;background-size:cover;background-position:center;
  transform:scale(1.12);animation:kb 9s ease-out forwards paused;will-change:transform}
.slide.on{opacity:1;animation-play-state:running}
.slide:nth-child(2){transform-origin:62% 48%}.slide:nth-child(3){transform-origin:38% 52%}
.hero.motion-paused .slide.on{animation-play-state:paused}
.hero.motion-paused .rain i{animation-play-state:paused}
@keyframes kb{from{transform:scale(1.12)}to{transform:scale(1.02)}}
.slides::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,18,26,.62) 0%,rgba(4,18,26,.20) 34%,rgba(4,18,26,.55) 72%,rgba(4,18,26,.95) 100%)}
.rain{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.rain i{position:absolute;top:-25%;width:1.4px;background:linear-gradient(transparent,rgba(120,220,255,.85));animation:fall linear infinite}
@keyframes fall{0%{transform:translateY(-25vh)}100%{transform:translateY(125vh)}}
.dots{position:absolute;z-index:12;bottom:64px;left:0;right:0;display:flex;gap:10px;justify-content:center}
.dots button{width:34px;height:3px;border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.28);transition:.25s}
.dots button.on{background:var(--cyan);box-shadow:0 0 12px rgba(0,166,230,.9)}
.motion-toggle{position:absolute;z-index:12;right:26px;bottom:54px;border:1px solid rgba(255,255,255,.24);border-radius:999px;
  background:rgba(4,18,26,.72);color:var(--ink);padding:7px 11px;font-family:var(--m);font-size:10px;letter-spacing:.1em;cursor:pointer}
.motion-toggle:hover{border-color:var(--cyan);color:var(--cyan)}
.slide__cap{position:absolute;z-index:12;left:26px;bottom:64px;font-family:var(--m);font-size:11px;letter-spacing:.16em;color:#9fc4d4}
.hero__copy{position:absolute;z-index:10;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;padding:0 26px}
.hero__copy .kick{font-family:var(--m);color:var(--cyan);letter-spacing:.42em;font-size:12px;margin-bottom:18px}
.hero h1{font-size:clamp(46px,9.5vw,116px);font-weight:900;line-height:.92;letter-spacing:-.035em;text-shadow:0 6px 40px rgba(0,0,0,.65)}
.hero h1 b{background:linear-gradient(180deg,var(--cyan2),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .sub{max-width:60ch;margin:22px auto 0;color:#a9c6d2;font-size:17px}
.scrollhint{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:11;font-family:var(--m);font-size:10px;
  letter-spacing:.3em;color:var(--mut);animation:bob 2.2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}

/* ---------- cycle + plastic pipework ---------- */
.cycle{position:relative;padding:110px 0 90px;
  background:radial-gradient(80% 40% at 50% 0%,rgba(0,166,230,.08),transparent 70%),linear-gradient(180deg,#04121a,#061a25 40%,#04121a)}
.cycle__head{text-align:center;max-width:62ch;margin:0 auto 10px;padding:0 26px}
.pipeline{position:relative;max-width:1200px;margin:0 auto;padding:0 26px}

/* ---------- clickable stages ---------- */
.stage{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center;padding:70px 0;
  border-radius:16px;transition:background .25s,transform .25s;cursor:pointer}
a.stage:hover{background:rgba(0,166,230,.06);transform:translateY(-4px)}
a.stage:hover .stage__art,a.stage:hover .pair figure{border-color:var(--cyan);box-shadow:0 30px 80px rgba(0,0,0,.7),0 0 0 1px var(--cyan)}
a.stage:hover .stage__more{color:var(--cyan2);gap:14px}
.stage__art{position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(0,166,230,.25);
  box-shadow:0 24px 70px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.03) inset;background:var(--bg2);transition:.25s}
.stage__art img{height:280px;object-fit:cover;width:100%;display:block}
.stage--r .stage__art{order:2}
.stage__no{font-family:var(--m);font-size:12px;letter-spacing:.24em;color:var(--cyan)}
.stage h3{font-size:clamp(34px,5vw,62px);font-weight:900;line-height:1;margin:12px 0 12px;letter-spacing:-.03em}
.stage p{color:var(--mut);font-size:16.5px;max-width:44ch}
.stage .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.stage .tags span{font-family:var(--m);font-size:11px;color:var(--cyan);border:1px solid var(--cyan-dim);padding:5px 10px;border-radius:2px}
.stage__more{display:inline-flex;align-items:center;gap:9px;margin-top:22px;font-family:var(--m);font-size:13px;
  color:var(--cyan);letter-spacing:.06em;transition:.25s}
.who{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
.who b{font-family:var(--m);font-size:11px;font-weight:600;color:#04121a;background:var(--cyan);padding:6px 11px;border-radius:2px}
.who i{font-family:var(--m);font-size:11px;font-style:normal;color:var(--cyan);border:1px solid var(--cyan-dim);padding:6px 11px;border-radius:2px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pair figure{margin:0;position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(0,166,230,.25);
  box-shadow:0 24px 60px rgba(0,0,0,.6);transition:.25s}
.pair img{width:100%;height:280px;object-fit:cover;display:block}
.pair figcaption{position:absolute;left:0;right:0;bottom:0;padding:9px 10px;font-family:var(--m);font-size:10px;
  letter-spacing:.05em;color:#e6f6fa;background:linear-gradient(transparent,rgba(3,14,21,.94))}
.cycle__close{position:relative;z-index:3;text-align:center;margin-top:40px;font-family:var(--m);font-size:12px;color:var(--cyan);letter-spacing:.24em}
@media(max-width:900px){
  .stage{grid-template-columns:1fr;gap:24px;padding:44px 0}
  .stage--r .stage__art{order:0}
  .stage__art img,.pair img{height:200px}
    }

/* ---------- generic sections ---------- */
.sec{position:relative;z-index:2;padding:100px 0}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
.role{border:1px solid var(--line);border-radius:10px;padding:22px;background:var(--bg2)}
.role h4{font-family:var(--m);color:var(--cyan);font-size:12px;letter-spacing:.14em;margin-bottom:8px}
.role ul{list-style:none}
.role li{padding:7px 0 7px 20px;position:relative;color:var(--mut);font-size:14.5px;border-bottom:1px solid rgba(255,255,255,.05)}
.role li::before{content:"→";position:absolute;left:0;color:var(--cyan)}
.strip4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:30px}
.strip4 figure{margin:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--bg2)}
.strip4 img{height:160px;object-fit:cover;width:100%;display:block}
.strip4 figcaption{font-family:var(--m);font-size:11px;color:var(--mut);padding:10px 12px;letter-spacing:.06em}
@media(max-width:900px){.strip4{grid-template-columns:1fr 1fr}}
.cmp{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:28px}
.cmp th,.cmp td{padding:13px 14px;text-align:left;border-bottom:1px solid var(--line)}
.cmp thead th{font-family:var(--m);font-size:12px;letter-spacing:.08em;color:var(--cyan)}
.cmp td:first-child{font-weight:600}
.logi{display:flex;flex-wrap:wrap;gap:38px;margin-top:30px;font-family:var(--m)}
.logi b{display:block;color:var(--cyan);font-size:32px;line-height:1.1}
.logi small{color:var(--mut);font-size:12px}
.gal{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:32px}
.gal figure{margin:0;position:relative;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:var(--bg2)}
.gal img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9)}
.gal .g-wide{grid-column:span 4;height:300px}
.gal .g-tall{grid-column:span 2;height:300px}
.gal .g-third{grid-column:span 2;height:220px}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;font-family:var(--m);font-size:10.5px;
  letter-spacing:.08em;color:#cfe6ef;background:linear-gradient(transparent,rgba(3,14,21,.92))}
@media(max-width:900px){.gal{grid-template-columns:repeat(2,1fr)}.gal .g-wide,.gal .g-tall,.gal .g-third{grid-column:span 2;height:220px}}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:38px}
.door{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg2);transition:.25s;display:block}
.door:hover{border-color:var(--cyan);transform:translateY(-5px);box-shadow:0 26px 60px rgba(0,0,0,.5)}
.door img{height:230px;object-fit:cover;width:100%;display:block}
.door__b{padding:26px}
.door__kick{font-family:var(--m);font-size:12px;letter-spacing:.14em;color:var(--cyan)}
.door h3{font-size:30px;font-weight:800;margin:8px 0 4px;letter-spacing:-.02em}
.door .role2{font-weight:600;margin-bottom:8px}
.door p{color:var(--mut);font-size:15px}
.door .specs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 18px}
.door .specs span{font-family:var(--m);font-size:11px;color:var(--mut);border:1px solid var(--line);padding:5px 9px}
.door .go{font-family:var(--m);font-size:13px;color:var(--cyan)}
@media(max-width:900px){.doors,.roles,.pair{grid-template-columns:1fr}}
.cta-final{text-align:center;max-width:780px;margin:0 auto}
.btn{display:inline-block;background:var(--cyan);color:#04121a;font-family:var(--m);font-size:13px;letter-spacing:.1em;
  padding:15px 30px;font-weight:600;transition:.2s}
.btn:hover{background:var(--cyan2)}
.btn--ghost{background:transparent;border:1px solid var(--cyan);color:var(--cyan)}
.btn--ghost:hover{background:var(--cyan);color:#04121a}
footer{border-top:1px solid var(--line);position:relative;z-index:2;padding:44px 0}
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;font-family:var(--m);font-size:12px;color:var(--mut)}

/* ================= STAGE DETAIL PAGES ================= */
.phero{position:relative;height:58vh;min-height:400px;overflow:hidden;background:#030e15}
.phero__img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.62}
.phero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(4,18,26,.65),rgba(4,18,26,.35) 45%,rgba(4,18,26,.97))}
.phero__in{position:absolute;z-index:4;left:0;right:0;bottom:44px;padding:0 26px;max-width:1200px;margin:0 auto}
.crumb{font-family:var(--m);font-size:11px;letter-spacing:.2em;color:var(--mut);margin-bottom:14px}
.crumb a:hover{color:var(--cyan)}
.phero h1{font-size:clamp(40px,7vw,86px);font-weight:900;letter-spacing:-.035em;line-height:.95}
.phero h1 b{background:linear-gradient(180deg,var(--cyan2),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.phero .sub{color:#a9c6d2;font-size:17px;max-width:60ch;margin-top:16px}
.split{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:30px}}
.prose p{color:var(--mut);font-size:17px;margin-bottom:16px}
.prose h3{font-size:26px;font-weight:800;margin:30px 0 12px;letter-spacing:-.01em}
.spec{border:1px solid var(--line);border-radius:12px;background:var(--bg2);padding:24px}
.spec h4{font-family:var(--m);font-size:12px;letter-spacing:.14em;color:var(--cyan);margin-bottom:12px}
.spec dl{display:grid;grid-template-columns:1fr auto;gap:0}
.spec dt{padding:10px 0;color:var(--mut);font-size:14px;border-bottom:1px solid rgba(255,255,255,.06)}
.spec dd{padding:10px 0;text-align:right;font-family:var(--m);font-size:14px;color:var(--ink);border-bottom:1px solid rgba(255,255,255,.06)}
.steps-num{list-style:none;counter-reset:s;margin-top:10px}
.steps-num li{counter-increment:s;position:relative;padding:14px 0 14px 52px;border-bottom:1px solid rgba(255,255,255,.07);color:var(--mut);font-size:15.5px}
.steps-num li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:14px;font-family:var(--m);
  font-size:12px;color:var(--cyan);border:1px solid var(--cyan-dim);width:34px;height:26px;display:grid;place-items:center}
.steps-num li b{color:var(--ink)}
.pagenav{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}
.pagenav a{border:1px solid var(--line);border-radius:10px;padding:20px;background:var(--bg2);transition:.2s}
.pagenav a:hover{border-color:var(--cyan);transform:translateY(-3px)}
.pagenav span{font-family:var(--m);font-size:11px;letter-spacing:.16em;color:var(--cyan);display:block;margin-bottom:6px}
.pagenav b{font-size:20px;font-weight:800}
.pagenav .nxt{text-align:right}
@media(max-width:700px){.pagenav{grid-template-columns:1fr}.pagenav .nxt{text-align:left}}

/* ================================================================
   PRODUCT + COMPANY PAGES
   ================================================================ */

/* ---------- figure with corner tags (also used on index) ---------- */
.section-fig{position:relative;margin:0;border-radius:12px;overflow:hidden;border:1px solid var(--line);
  background:var(--bg2);box-shadow:0 26px 70px rgba(0,0,0,.55)}
.section-fig img{display:block;width:100%;height:auto}
.section-fig__tag{position:absolute;left:0;font-family:var(--m);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:#e6f6fa;background:rgba(4,18,26,.82);backdrop-filter:blur(6px);padding:8px 13px}
.section-fig__tag--top{top:0;border-bottom-right-radius:8px}
.section-fig__tag--bot{bottom:0;border-top-right-radius:8px}

/* ---------- product hero (split, not background image) ---------- */
.phero--split{height:auto;min-height:0;padding:86px 0 76px;
  background:radial-gradient(90% 60% at 70% 0%,rgba(0,166,230,.12),transparent 70%),linear-gradient(180deg,#04121a,#061a25)}
.phero--split::after{display:none}
.phero__grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.phero--split h1{font-size:clamp(38px,6vw,74px);font-weight:900;letter-spacing:-.035em;line-height:.96;margin-top:14px}
.phero--split h1 b{background:linear-gradient(180deg,var(--cyan2),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.phero__cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
@media(max-width:900px){.phero--split{padding:54px 0 48px}.phero__grid{grid-template-columns:1fr;gap:32px}}

/* ---------- sticky sub-nav ---------- */
.subnav{position:sticky;top:66px;z-index:60;background:rgba(4,18,26,.9);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.subnav__row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;height:50px;align-items:center}
.subnav__row::-webkit-scrollbar{display:none}
.subnav a{font-family:var(--m);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);
  padding:8px 13px;border-radius:4px;white-space:nowrap;transition:.18s}
.subnav a:hover{color:var(--cyan);background:rgba(0,166,230,.08)}

/* ---------- section variants ---------- */
.sec--alt{background:linear-gradient(180deg,#04121a,#071c28 50%,#04121a)}
.sec--deep{background:radial-gradient(70% 50% at 50% 0%,rgba(0,166,230,.09),transparent 70%),#030e15}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.two-col--top{align-items:start}
@media(max-width:900px){.two-col{grid-template-columns:1fr;gap:30px}}

/* ---------- big-number band ---------- */
.figures{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:52px}
.figure{border-left:1px solid var(--line);padding:4px 18px}
.figure__val{font-family:var(--m);font-size:clamp(26px,3vw,38px);font-weight:600;color:var(--cyan);line-height:1.1;letter-spacing:-.02em}
.figure__lbl{color:var(--mut);font-size:13px;margin-top:8px;max-width:22ch}
@media(max-width:900px){.figures{grid-template-columns:1fr 1fr;gap:22px 0}}

/* ---------- part list ---------- */
.partlist{list-style:none;column-count:2;column-gap:26px;margin-top:20px}
.partlist li{padding:8px 0 8px 20px;position:relative;color:var(--mut);font-size:14.5px;
  border-bottom:1px solid rgba(255,255,255,.05);break-inside:avoid}
.partlist li::before{content:"·";position:absolute;left:4px;color:var(--cyan);font-weight:700}
@media(max-width:700px){.partlist{column-count:1}}

/* ---------- variant cards ---------- */
.variants{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}
.variants--2{grid-template-columns:1fr 1fr}
.variant{border:1px solid var(--line);border-radius:12px;background:var(--bg2);overflow:hidden;transition:.25s;display:flex;flex-direction:column}
.variant:hover{border-color:var(--cyan);transform:translateY(-4px);box-shadow:0 26px 60px rgba(0,0,0,.5)}
.variant__fig{border-bottom:1px solid var(--line);background:#030e15}
.variant__fig img{display:block;width:100%;height:210px;object-fit:cover}
.variant__top{padding:16px 20px 0}
.variant__code{font-family:var(--m);font-size:11px;letter-spacing:.16em;color:var(--cyan);text-transform:uppercase}
.variant__name{font-size:21px;font-weight:800;letter-spacing:-.015em;margin-top:6px}
.variant__body{padding:12px 20px 22px;color:var(--mut);font-size:14.5px}
.variant__lead{color:var(--ink);font-size:15.5px;margin-bottom:10px}
.variant__use{list-style:none;margin-top:14px}
.variant__use li{padding:7px 0 7px 19px;position:relative;border-top:1px solid rgba(255,255,255,.05);font-size:14px}
.variant__use li::before{content:"→";position:absolute;left:0;color:var(--cyan)}
@media(max-width:900px){.variants,.variants--2{grid-template-columns:1fr}}

/* ---------- numbered step grid ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;counter-reset:st}
.steps--1{grid-template-columns:1fr;gap:0}
.step{counter-increment:st;position:relative;border:1px solid var(--line);border-radius:10px;background:var(--bg2);padding:22px 22px 22px 22px}
.step::before{content:counter(st,decimal-leading-zero);font-family:var(--m);font-size:11px;color:var(--cyan);
  letter-spacing:.16em;display:block;margin-bottom:10px}
.step b{display:block;font-size:16.5px;font-weight:700;letter-spacing:-.01em;margin-bottom:7px}
.step p{color:var(--mut);font-size:14.5px}
.steps--1 .step{border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:16px 0 16px 52px}
.steps--1 .step::before{position:absolute;left:0;top:18px;margin:0;border:1px solid var(--cyan-dim);
  width:34px;height:26px;display:grid;place-items:center}
@media(max-width:900px){.steps{grid-template-columns:1fr}}

/* ---------- accordion spec tables ---------- */
.acc{border:1px solid var(--line);border-radius:12px;background:var(--bg2);margin-top:22px;overflow:hidden}
.acc__head{display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;padding:20px 24px;cursor:pointer;
  transition:.18s;border:0;background:transparent;color:inherit;text-align:left;font-family:inherit}
.acc__head:hover{background:rgba(0,166,230,.05)}
.acc__title{font-size:19px;font-weight:700;letter-spacing:-.01em}
.acc__tog{font-family:var(--m);font-size:11px;letter-spacing:.14em;color:var(--cyan);white-space:nowrap;text-transform:uppercase}
.acc__body{display:none;padding:0 24px 24px}
.acc.open .acc__body{display:block}
.acc table{width:100%;border-collapse:collapse;font-size:14.5px}
.acc th,.acc td{padding:11px 12px;text-align:left;border-bottom:1px solid var(--line)}
.acc thead th{font-family:var(--m);font-size:11.5px;letter-spacing:.1em;color:var(--cyan);text-transform:uppercase}
.acc td:first-child{font-weight:600;color:var(--ink)}
.acc tbody td{color:var(--mut)}
.acc__note{color:var(--mut);font-size:13px;margin-top:14px;font-family:var(--m);line-height:1.7}
@media(max-width:700px){.acc__body{overflow-x:auto}.acc table{min-width:480px}}

/* ---------- application cards ---------- */
.apps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.app{border:1px solid var(--line);border-radius:10px;background:var(--bg2);padding:24px;transition:.25s;display:block}
.app:hover{border-color:var(--cyan);transform:translateY(-4px);box-shadow:0 24px 56px rgba(0,0,0,.5)}
.app__code{font-family:var(--m);font-size:11px;letter-spacing:.16em;color:var(--cyan);text-transform:uppercase}
.app h3{font-size:20px;font-weight:800;letter-spacing:-.015em;margin:10px 0 8px}
.app p{color:var(--mut);font-size:14.5px}
@media(max-width:900px){.apps{grid-template-columns:1fr}}

/* ---------- downloads ---------- */
.downloads{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.dl{border:1px solid var(--line);border-radius:10px;background:var(--bg2);padding:20px 24px;transition:.25s;
  display:flex;justify-content:space-between;align-items:center;gap:18px}
.dl:hover{border-color:var(--cyan);transform:translateY(-3px)}
.dl__name{font-weight:600;font-size:15.5px}
.dl__meta{font-family:var(--m);font-size:11px;letter-spacing:.14em;color:var(--cyan);border:1px solid var(--cyan-dim);padding:5px 10px;border-radius:2px}
@media(max-width:700px){.downloads{grid-template-columns:1fr}}

/* ---------- final CTA panel ---------- */
.ctabox{border:1px solid var(--line);border-radius:14px;padding:52px 40px;text-align:center;
  background:radial-gradient(80% 100% at 50% 0%,rgba(0,166,230,.1),transparent 70%),var(--bg2)}
.ctabox h2{font-size:clamp(26px,4vw,42px);font-weight:800;letter-spacing:-.025em;margin-top:14px}
.ctabox p{color:var(--mut);max-width:56ch;margin:14px auto 28px;font-size:16.5px}

/* ---------- forms (contact) ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:block}
.field--full{grid-column:1/-1}
.field label{display:block;font-family:var(--m);font-size:11px;letter-spacing:.14em;color:var(--cyan);
  text-transform:uppercase;margin-bottom:8px}
.field input,.field select,.field textarea{width:100%;background:var(--bg2);border:1px solid var(--line);border-radius:8px;
  color:var(--ink);font-family:var(--f);font-size:15px;padding:13px 15px;transition:.18s}
.field textarea{min-height:132px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(0,166,230,.12)}
.field input::placeholder,.field textarea::placeholder{color:#4c6d7c}
@media(max-width:700px){.form{grid-template-columns:1fr}}

/* ---------- contact detail rows ---------- */
.contacts{display:grid;gap:0;margin-top:22px}
.contacts div{display:flex;justify-content:space-between;gap:18px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.contacts dt,.contacts b{font-family:var(--m);font-size:11.5px;letter-spacing:.14em;color:var(--mut);text-transform:uppercase;font-weight:400}
.contacts a:hover{color:var(--cyan)}

/* ---------- footer (full) ---------- */
.foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;padding-bottom:36px;border-bottom:1px solid var(--line)}
.foot__grid img{height:28px;display:block;margin-bottom:14px}
.foot__grid p{color:var(--mut);font-size:14px;max-width:34ch}
.foot__col h4{font-family:var(--m);font-size:11px;letter-spacing:.16em;color:var(--cyan);text-transform:uppercase;margin-bottom:14px}
.foot__col a{display:block;color:var(--mut);font-size:14.5px;padding:5px 0;transition:.15s}
.foot__col a:hover{color:var(--cyan)}
.foot{padding-top:24px}
@media(max-width:900px){.foot__grid{grid-template-columns:1fr 1fr;gap:28px}}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ---------- pillars / markets / standards ---------- */
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px}
.pillar{border:1px solid var(--line);border-radius:10px;background:var(--bg2);padding:24px;transition:.25s}
.pillar:hover{border-color:var(--cyan);transform:translateY(-4px)}
.pillar .num{font-family:var(--m);font-size:11px;letter-spacing:.18em;color:var(--cyan)}
.pillar h3{font-size:18px;font-weight:800;letter-spacing:-.015em;margin:10px 0 8px}
.pillar p{color:var(--mut);font-size:14.5px}
@media(max-width:1000px){.pillars{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.pillars{grid-template-columns:1fr}}

.markets{display:grid;gap:0}
.market{display:flex;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);font-size:17px;font-weight:600}
.market b{font-family:var(--m);font-size:11px;font-weight:500;letter-spacing:.18em;color:var(--cyan);min-width:26px}

.standards{margin-top:8px}
.standard{display:block;border:1px solid var(--line);border-radius:10px;background:var(--bg2);padding:20px 24px;
  font-family:var(--m);font-size:13.5px;color:var(--mut);letter-spacing:.03em;line-height:1.8}

/* ---------- quote layout ---------- */
.quote{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start;margin-top:40px}
@media(max-width:900px){.quote{grid-template-columns:1fr;gap:40px}}
.h3{font-size:21px;font-weight:800;letter-spacing:-.015em}
.honey{position:absolute;left:-9999px;opacity:0;height:0;width:0}

/* ================================================================
   CAROUSEL — "from the field"
   ================================================================ */
.car{position:relative;margin-top:34px}
.car__win{overflow:hidden;border-radius:12px;border:1px solid var(--line);background:var(--bg2)}
.car__track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1);will-change:transform}
.car__slide{flex:0 0 100%;position:relative}
.car__slide img{display:block;width:100%;height:clamp(300px,52vw,600px);object-fit:cover}
.car__cap{position:absolute;left:0;right:0;bottom:0;padding:44px 22px 18px;
  background:linear-gradient(transparent,rgba(3,14,21,.94));display:flex;justify-content:space-between;
  align-items:flex-end;gap:20px;flex-wrap:wrap}
.car__cap b{font-family:var(--m);font-size:11.5px;font-weight:500;letter-spacing:.16em;color:var(--cyan);text-transform:uppercase}
.car__cap span{font-size:15px;color:#cfe6ef;max-width:60ch}

.car__btn{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:52px;height:52px;
  display:grid;place-items:center;cursor:pointer;border:1px solid var(--line);border-radius:50%;
  background:rgba(4,18,26,.72);backdrop-filter:blur(8px);color:var(--ink);transition:.2s;padding:0}
.car__btn:hover{background:var(--cyan);border-color:var(--cyan);color:#04121a}
.car__btn:disabled{opacity:.28;cursor:default}
.car__btn:disabled:hover{background:rgba(4,18,26,.72);border-color:var(--line);color:var(--ink)}
.car__btn--prev{left:16px}
.car__btn--next{right:16px}
.car__btn i{display:block;width:10px;height:10px;border-top:1.8px solid currentColor;border-right:1.8px solid currentColor}
.car__btn--next i{transform:rotate(45deg) translate(-2px,2px)}
.car__btn--prev i{transform:rotate(-135deg) translate(-2px,2px)}

.car__dots{display:flex;gap:9px;justify-content:center;margin-top:20px;flex-wrap:wrap}
.car__dots button{width:34px;height:3px;border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.22);transition:.25s}
.car__dots button:hover{background:rgba(255,255,255,.45)}
.car__dots button.on{background:var(--cyan);box-shadow:0 0 12px rgba(0,166,230,.9)}
.car__count{position:absolute;top:16px;right:16px;z-index:6;font-family:var(--m);font-size:11px;letter-spacing:.14em;
  color:#cfe6ef;background:rgba(4,18,26,.72);backdrop-filter:blur(8px);padding:7px 12px;border-radius:4px;border:1px solid var(--line)}
.car__pause{display:block;margin:12px auto 0;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--mut);
  padding:7px 12px;font-family:var(--m);font-size:10px;letter-spacing:.1em;cursor:pointer}
.car__pause:hover{border-color:var(--cyan);color:var(--cyan)}
@media(max-width:700px){
  .car__btn{width:42px;height:42px}
  .car__btn--prev{left:8px}.car__btn--next{right:8px}
  .car__cap{padding:38px 16px 14px}
  .car__cap span{font-size:13.5px}
}

/* ---------- stage 01 stacked pair ---------- */
.stage--big{padding:88px 0}
.pair--v{display:grid;grid-template-columns:1fr;gap:16px}
.pair--v figure{margin:0;position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(0,166,230,.25);
  box-shadow:0 24px 60px rgba(0,0,0,.6);transition:.25s}
.pair--v img{width:100%;height:240px;object-fit:cover;display:block}
.pair--v figcaption{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;font-family:var(--m);font-size:10.5px;
  letter-spacing:.06em;color:#e6f6fa;background:linear-gradient(transparent,rgba(3,14,21,.94))}
@media(max-width:900px){.pair--v img{height:190px}.stage--big{padding:48px 0}}

/* ================================================================
   ADVANTAGES — bento grid
   ================================================================ */
.adv{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:36px}
.adv__card{border:1px solid var(--line);border-radius:12px;background:var(--bg2);padding:24px;
  transition:.25s;display:flex;flex-direction:column}
.adv__card:hover{border-color:var(--cyan);transform:translateY(-4px);box-shadow:0 24px 56px rgba(0,0,0,.5)}
.adv__no{font-family:var(--m);font-size:11px;letter-spacing:.18em;color:var(--cyan);margin-bottom:14px}
.adv__card h3{font-size:17.5px;font-weight:800;letter-spacing:-.015em;line-height:1.25;margin-bottom:9px}
.adv__card p{color:var(--mut);font-size:14px;line-height:1.6}
.adv__metric{font-family:var(--m);font-size:12px;color:var(--cyan2);margin-top:auto;padding-top:14px;letter-spacing:.04em}

.adv__fig{grid-column:span 2;grid-row:span 2;position:relative;border-radius:12px;overflow:hidden;
  border:1px solid var(--line);background:#030e15;min-height:340px}
.adv__fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85}
.adv__fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:60px 24px 22px;
  background:linear-gradient(transparent,rgba(3,14,21,.95))}
.adv__fig b{display:block;font-size:23px;font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-bottom:8px}
.adv__fig span{color:var(--mut);font-size:14.5px}

@media(max-width:1000px){
  .adv{grid-template-columns:1fr 1fr}
  .adv__fig{grid-column:span 2;grid-row:auto;min-height:260px}
}
@media(max-width:620px){
  .adv{grid-template-columns:1fr}
  .adv__fig{grid-column:span 1}
}

/* ================================================================
   PART DETAIL CARDS — transparent-background renders
   ================================================================ */
.parts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.part{border:1px solid var(--line);border-radius:12px;background:var(--bg2);overflow:hidden;
  transition:.25s;display:flex;flex-direction:column}
.part:hover{border-color:var(--cyan);transform:translateY(-5px);box-shadow:0 26px 60px rgba(0,0,0,.55)}
.part__fig{position:relative;height:190px;display:flex;align-items:center;justify-content:center;
  padding:18px;overflow:hidden;
  background:radial-gradient(60% 70% at 50% 45%,rgba(0,166,230,.13),transparent 72%),#030e15;
  border-bottom:1px solid var(--line)}
.part__fig img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.55));transition:transform .3s}
.part:hover .part__fig img{transform:scale(1.06)}
.part__no{position:absolute;top:12px;left:14px;font-family:var(--m);font-size:11px;letter-spacing:.18em;color:var(--cyan)}
.part__b{padding:20px;display:flex;flex-direction:column;flex:1}
.part__b h3{font-size:17px;font-weight:800;letter-spacing:-.015em;margin-bottom:8px}
.part__b p{color:var(--mut);font-size:14px;line-height:1.6}
.part__spec{font-family:var(--m);font-size:11.5px;color:var(--cyan2);letter-spacing:.04em;margin-top:auto;padding-top:14px}
@media(max-width:1000px){.parts{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.parts{grid-template-columns:1fr}.part__fig{height:220px}}

/* ================================================================
   LIGHT THEME
   ================================================================ */
[data-theme="light"] body{background:var(--bg);color:var(--ink)}
[data-theme="light"] img[src$="aquatex-logo-dark.svg"]{content:url("logo/aquatex-logo-light.svg")}
[data-theme="light"] header{background:rgba(244,249,251,.9)}
[data-theme="light"] .drop,[data-theme="light"] .lang__menu{background:rgba(255,255,255,.98);box-shadow:0 22px 60px rgba(21,55,69,.18)}
[data-theme="light"] .cycle{background:radial-gradient(80% 40% at 50% 0%,rgba(0,126,174,.1),transparent 70%),linear-gradient(180deg,#f4f9fb,#eaf4f8 40%,#f4f9fb)}
[data-theme="light"] .phero--split{background:radial-gradient(90% 60% at 70% 0%,rgba(0,126,174,.12),transparent 70%),linear-gradient(180deg,#f4f9fb,#eaf4f8)}
[data-theme="light"] .sec--alt{background:linear-gradient(180deg,#f4f9fb,#eaf4f8 50%,#f4f9fb)}
[data-theme="light"] .sec--deep{background:radial-gradient(70% 50% at 50% 0%,rgba(0,126,174,.1),transparent 70%),#edf6f9}
[data-theme="light"] .subnav{background:rgba(244,249,251,.92)}
[data-theme="light"] .role li,[data-theme="light"] .spec dt,[data-theme="light"] .spec dd,
[data-theme="light"] .steps-num li,[data-theme="light"] .partlist li,[data-theme="light"] .variant__use li{border-color:var(--line)}
[data-theme="light"] .field input::placeholder,[data-theme="light"] .field textarea::placeholder{color:#78929d}
[data-theme="light"] .section-fig,[data-theme="light"] .door:hover,[data-theme="light"] .variant:hover,
[data-theme="light"] .app:hover,[data-theme="light"] .adv__card:hover,[data-theme="light"] .part:hover{box-shadow:0 24px 60px rgba(18,62,79,.16)}
[data-theme="light"] .hero,[data-theme="light"] .phero:not(.phero--split){color:#dceaf0}
[data-theme="light"] .hero .sub,[data-theme="light"] .phero:not(.phero--split) .sub{color:#b7d0da}
[data-theme="light"] .hero .motion-toggle,[data-theme="light"] .car__btn,[data-theme="light"] .car__count{color:#dceaf0}
[data-theme="light"] .variant__fig,[data-theme="light"] .adv__fig,[data-theme="light"] .part__fig{background-color:#eaf4f8}
[data-theme="light"] .section-fig__tag,[data-theme="light"] .car__cap,[data-theme="light"] .pair figcaption,
[data-theme="light"] .pair--v figcaption,[data-theme="light"] .gal figcaption,[data-theme="light"] .adv__fig figcaption{color:#e6f6fa}
[data-theme="light"] .btn,[data-theme="light"] .who b{color:#ffffff}
[data-theme="light"] .btn--ghost{color:var(--cyan)}
[data-theme="light"] .btn--ghost:hover{color:#ffffff}

@media(max-width:1120px){
  [data-theme="light"] header,[data-theme="light"] .nav nav{background:#f4f9fb}
}

/* ---------- right-to-left locale ---------- */
[dir="rtl"] body{font-family:'Noto Sans Arabic',var(--f)}
[dir="rtl"] .nav nav,[dir="rtl"] .hero__copy,[dir="rtl"] .phero__in,[dir="rtl"] .prose,[dir="rtl"] .cta-final{text-align:right}
[dir="rtl"] .drop{left:auto;right:-16px}
[dir="rtl"] .lang__menu{right:auto;left:0}
[dir="rtl"] .role li,[dir="rtl"] .partlist li,[dir="rtl"] .variant__use li{padding-left:0;padding-right:20px}
[dir="rtl"] .role li::before,[dir="rtl"] .partlist li::before,[dir="rtl"] .variant__use li::before{left:auto;right:0}
[dir="rtl"] .steps-num li{padding-left:0;padding-right:52px}
[dir="rtl"] .steps-num li::before{left:auto;right:0}
[dir="rtl"] .cmp th,[dir="rtl"] .cmp td,[dir="rtl"] .acc th,[dir="rtl"] .acc td,[dir="rtl"] .acc__head{text-align:right}
[dir="rtl"] .spec dd{text-align:left}
[dir="rtl"] .pagenav .nxt{text-align:left}
[dir="rtl"] .section-fig__tag{left:auto;right:0}
[dir="rtl"] .section-fig__tag--top{border-radius:0 0 0 8px}
[dir="rtl"] .section-fig__tag--bot{border-radius:8px 0 0 0}
[dir="rtl"] .car__btn--prev{left:auto;right:16px}[dir="rtl"] .car__btn--next{right:auto;left:16px}
[dir="rtl"] .car__count{right:auto;left:16px}
[dir="rtl"] .part__no{left:auto;right:14px}
@media(max-width:700px){[dir="rtl"] .pagenav .nxt{text-align:right}}

/* render on transparent bg, shown large */
.render{position:relative;border-radius:12px;border:1px solid var(--line);overflow:hidden;
  background:radial-gradient(70% 80% at 50% 40%,rgba(0,166,230,.12),transparent 72%),#030e15;
  padding:28px;display:flex;align-items:center;justify-content:center}
.render img{max-width:100%;height:auto;display:block;filter:drop-shadow(0 22px 44px rgba(0,0,0,.6))}
.render__tag{position:absolute;left:0;top:0;font-family:var(--m);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:#e6f6fa;background:rgba(4,18,26,.82);padding:8px 13px;border-bottom-right-radius:8px}

/* variant figure on transparent renders */
.variant__fig--render{background:radial-gradient(60% 70% at 50% 45%,rgba(0,166,230,.12),transparent 72%),#030e15;
  display:flex;align-items:center;justify-content:center;padding:20px;height:230px;overflow:hidden}
.variant__fig--render img{width:auto;max-width:100%;max-height:100%;height:auto;object-fit:contain;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.55))}

/* ================================================================
   RENDER ROW + LIGHTBOX
   ================================================================ */
.renders{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.renders .render,[data-zoom]{cursor:zoom-in}
.renders .render{padding:18px}
.renders .render img{max-height:210px;width:auto;transition:transform .3s}
.renders .render:hover{border-color:var(--cyan)}
.renders .render:hover img{transform:scale(1.05)}
.render__zoom{position:absolute;right:12px;bottom:12px;width:26px;height:26px;border-radius:50%;
  border:1px solid var(--line);background:rgba(4,18,26,.75);display:grid;place-items:center;
  font-family:var(--m);font-size:13px;color:var(--cyan);opacity:0;transition:.2s}
.renders .render:hover .render__zoom{opacity:1}
@media(max-width:900px){.renders{grid-template-columns:1fr}.renders .render img{max-height:230px}}

.lb{position:fixed;inset:0;z-index:200;background:rgba(3,12,18,.94);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;padding:48px 26px;cursor:zoom-out}
.lb.on{display:flex}
.lb img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
  filter:drop-shadow(0 30px 70px rgba(0,0,0,.7))}
.lb__cap{position:absolute;left:0;right:0;bottom:22px;text-align:center;font-family:var(--m);
  font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#9fc4d4}
.lb__x{position:absolute;top:18px;right:22px;width:42px;height:42px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line);background:rgba(4,18,26,.7);color:var(--ink);font-size:20px;line-height:1;
  display:grid;place-items:center;transition:.2s;padding:0}
.lb__x:hover{background:var(--cyan);border-color:var(--cyan);color:#04121a}

/* download rows with a size hint + quiet secondary link */
.dl__meta{white-space:nowrap}
.dl__sub{display:block;font-size:13px;color:var(--mut);margin-top:4px;font-family:var(--f);letter-spacing:0}
.dl-note{margin-top:20px;font-size:14.5px;color:var(--mut)}
.dl-note a{color:var(--cyan);border-bottom:1px solid var(--cyan-dim);padding-bottom:1px}
.dl-note a:hover{color:var(--cyan2);border-color:var(--cyan2)}

/* ================================================================
   MOBILE REFINEMENTS
   ================================================================ */

/* safety net: nothing may exceed its container */
img,svg,video,iframe{max-width:100%}

/* index comparison table — 3 dense columns, needs room on a phone */
.cmp-wrap{width:100%}
@media(max-width:760px){
  .cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .cmp{min-width:560px;font-size:13px}
  .cmp th,.cmp td{padding:10px 10px}
}

@media(max-width:620px){
  /* claw back horizontal space */
  .wrap{padding:0 18px}
  .slide__cap{left:18px}

  /* hero: 94vh + 560px min is too tall on a small handset */
  .hero{height:86vh;min-height:440px}
  .hero .sub{font-size:15.5px}
  .scrollhint{font-size:9px;letter-spacing:.24em}
  .dots{bottom:52px}
  .slide__cap{bottom:52px;font-size:10px}
  .motion-toggle{right:18px;bottom:14px}

  /* logistics figures */
  .logi{gap:22px 26px}
  .logi b{font-size:26px}

  /* contact rows stack instead of squeezing */
  .contacts div{flex-direction:column;align-items:flex-start;gap:4px}

  /* footer */
  .foot{flex-direction:column;gap:10px;font-size:11.5px}
  .foot__grid{grid-template-columns:1fr;gap:24px}

  /* type scale */
  .lede{font-size:15.5px}
  .sec{padding:64px 0}
  .ctabox{padding:36px 22px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .scrollhint{animation:none}
}

/* very small handsets */
@media(max-width:380px){
  .wrap{padding:0 14px}
  .hero h1{letter-spacing:-.03em}
  .subnav a{font-size:10.5px;padding:8px 10px}
}

/* landscape phones: don't let the hero eat the screen */
@media(max-height:520px) and (orientation:landscape){
  .hero{height:auto;min-height:0;padding:90px 0 70px}
  .hero__copy{position:static;transform:none;padding:0 26px}
  .slides,.rain{position:absolute}
  .dots,.slide__cap,.scrollhint{display:none}
}