/* Layout: white corporate page; photo-led sections alternate image/text, grey bands for figures, one pinned 3D photo gallery. Single brand theme (white / grey / orange). */
:root{
  color-scheme:light;
  --bg:#FFFFFF; --grey:#F4F5F6; --grey-2:#E9EBED; --ink:#2C3034; --muted:#6B7176; --line:#E3E5E8;
  --accent:#F28220; --accent-dk:#D96E12; --accent-ink:#FFFFFF; --tint:#FFF1E7;
  --deep:#2A2E32; --deep-ink:#FFFFFF; --deep-muted:#B4B9BE; --deep-line:#41464B;
  --f-display:"DM Sans","Segoe UI",system-ui,sans-serif;
  --f-body:"DM Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-mono:"Red Hat Mono",ui-monospace,Menlo,monospace;
  --s-1:.8125rem; --s0:1rem; --s1:1.125rem; --s2:1.35rem; --s3:clamp(1.45rem,2.3vw,1.9rem);
  --s4:clamp(1.9rem,3.8vw,3.2rem); --s5:clamp(2.2rem,5vw,4.6rem);
  --r:16px; --ease:cubic-bezier(.2,.7,.1,1);
  --shadow:0 18px 50px -20px rgba(44,48,52,.28);
}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
*,*::before,*::after{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:var(--s0);line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:800;margin:0;line-height:1.08;letter-spacing:-.015em;text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;z-index:100}
.skip:focus{left:16px}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px)}
.tnum{font-variant-numeric:tabular-nums}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--f-display);font-weight:700;font-size:var(--s-1);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.eyebrow::before{content:"";width:26px;height:2px;background:currentColor}
.hl{color:var(--accent)}

.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--f-display);font-weight:700;font-size:.95rem;text-decoration:none;padding:.9rem 1.5rem;border-radius:999px;border:1.5px solid var(--ink);color:var(--ink);background:transparent;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.btn:hover{background:var(--ink);color:#fff}
.btn--o{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn--o:hover{background:var(--accent-dk);border-color:var(--accent-dk);color:#fff}
.btn--w{border-color:#fff;color:#fff}
.btn--w:hover{background:#fff;color:var(--accent)}
.btn svg{width:15px;height:15px;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.link{display:inline-flex;gap:.45rem;align-items:center;font-family:var(--f-display);font-weight:700;text-decoration:none;color:var(--accent)}
.link:hover{text-decoration:underline;text-underline-offset:4px}

/* photo frames with designed fallback */
.ph{position:relative;overflow:hidden;border-radius:var(--r);background:linear-gradient(135deg,var(--grey-2),var(--grey));isolation:isolate}
.ph::before{content:"";position:absolute;inset:0;background-image:radial-gradient(color-mix(in srgb,var(--muted) 30%,transparent) 1.2px,transparent 1.3px);background-size:16px 16px;opacity:.5;z-index:-1}
.ph::after{content:attr(data-label);position:absolute;left:14px;bottom:12px;font-family:var(--f-mono);font-size:.72rem;color:var(--muted);z-index:-1;letter-spacing:.04em}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.ph.failed img{visibility:hidden}

/* top bar + header */
.topbar{background:var(--deep);color:var(--deep-muted);font-size:.82rem}
.topbar .wrap{display:flex;justify-content:space-between;gap:1rem;padding-block:.55rem;flex-wrap:wrap}
.topbar a{text-decoration:none;color:var(--deep-ink)}
.topbar .addr{display:inline-flex;gap:.4rem;align-items:center}
.topbar .sep{display:inline-flex;gap:1.4rem;flex-wrap:wrap}
.head{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:box-shadow .3s}
.head.scrolled{box-shadow:0 8px 30px -18px rgba(0,0,0,.35)}
.head .wrap{height:78px;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0;color:#5A5F64}
.logo-img{height:44px;width:auto;display:block}
@media (max-width:600px){.logo-img{height:36px}}
.word{display:flex;align-items:center;gap:1px;position:relative;padding-bottom:12px}
.word b{font-family:var(--f-display);font-weight:500;font-size:1.65rem;letter-spacing:.02em;line-height:1}
.word .flask{width:24px;height:28px;margin-inline:1px 2px}
.word small{position:absolute;left:0;right:0;bottom:-2px;font-family:var(--f-display);font-weight:700;font-size:.62rem;letter-spacing:.62em;color:var(--accent);text-align:center}
footer .logo{color:#fff}
.nav{display:flex;gap:1.7rem}
.nav a{font-family:var(--f-display);font-weight:700;font-size:.95rem;text-decoration:none;padding-block:.4rem;position:relative}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav a:hover,.nav a[aria-current]{color:var(--accent)}
.nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
.menu-btn{display:none;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--ink);background:#fff;cursor:pointer;align-items:center;justify-content:center}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:18px;height:2px;background:var(--ink);position:relative;transition:transform .3s,background .3s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
.menu-btn span::before{top:-6px}.menu-btn span::after{top:6px}
.menu-btn[aria-expanded="true"] span{background:transparent}
.menu-btn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:40;background:#fff;padding:calc(130px + env(safe-area-inset-top,0px)) clamp(16px,6vw,40px) 2rem;transform:translateX(100%);transition:transform .6s var(--ease);visibility:hidden;display:flex;flex-direction:column;gap:2rem;overflow:auto}
.drawer.open{transform:none;visibility:visible}
.drawer nav{display:grid}
.drawer nav a{font-family:var(--f-display);font-weight:800;font-size:1.7rem;text-decoration:none;padding-block:.55rem;border-bottom:1px solid var(--line)}
.drawer nav a:hover{color:var(--accent)}
.drawer p{color:var(--muted);font-size:.92rem}

/* hero */
.hero{padding-top:clamp(2.5rem,6vw,4.5rem)}
.hero-top{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:end}
.crumbs{display:flex;gap:.6rem;font-family:var(--f-display);font-weight:700;font-size:.9rem;color:var(--muted)}
.crumbs a{text-decoration:none;color:var(--accent)}
.hero h1{font-size:var(--s5);font-weight:900;line-height:1.02;margin-top:1rem}
.hero-side{display:grid;gap:1.4rem;padding-bottom:.4rem}
.hero-side p{color:var(--muted);font-size:var(--s1)}
.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem}
.hero-media{margin-top:clamp(2rem,4vw,3rem);position:relative;height:clamp(340px,62vh,640px)}
.hero-clip{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 16px round 24px)}
.slides{position:absolute;inset:0}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease}
.slide.on{opacity:1}
.slide.ph{border-radius:0}
.slide img{transform:scale(1.12);transition:transform 7s linear}
.slide.on img{transform:scale(1.02)}
.shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(20,22,24,.6),transparent 50%)}
.hero-cap{position:absolute;left:0;right:0;bottom:clamp(16px,3vw,28px);z-index:2;display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;color:#fff}
.hero-cap .chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{background:rgba(255,255,255,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:.4rem .9rem;font-family:var(--f-display);font-weight:700;font-size:.85rem}
.dots{display:flex;gap:.45rem}
.dots button{width:34px;height:4px;border:0;border-radius:4px;background:rgba(255,255,255,.45);cursor:pointer;padding:0}
.dots button[aria-current="true"]{background:var(--accent)}
.badge{position:absolute;z-index:3;top:-40px;right:calc(max(16px,(100% - 1240px)/2 + 40px) + 24px);width:128px;height:128px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;text-align:center;box-shadow:var(--shadow)}
.badge b{display:block;font-family:var(--f-display);font-weight:900;font-size:1.45rem;line-height:1}
.badge span{font-size:.6rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.badge svg{position:absolute;inset:0;animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* trust */
.trust{padding-block:clamp(3rem,6vw,4.5rem) 0}
.trust-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.trust-item{display:flex;gap:1rem;align-items:center;padding:1.2rem 1.3rem;border:1px solid var(--line);border-radius:14px;transition:border-color .3s,box-shadow .4s}
.trust-item:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.ico{width:50px;height:50px;border-radius:12px;background:var(--tint);color:var(--accent);display:grid;place-items:center;flex-shrink:0}
.ico svg{width:26px;height:26px}
.trust-item b{display:block;font-family:var(--f-display);font-size:1.02rem}
.trust-item span{font-size:.88rem;color:var(--muted)}

/* sections */
.sec{padding-block:clamp(4.5rem,9vw,7.5rem)}
.sec--grey{background:var(--grey)}
.sec-head{display:grid;gap:1rem;max-width:720px}
.sec-head h2{font-size:var(--s4)}
.sec-head p{color:var(--muted);font-size:var(--s1)}
html.js .reveal{opacity:.2;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
html.js .reveal.in{opacity:1;transform:none}

/* about */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2.5rem,6vw,5rem);align-items:center}
.collage{position:relative;padding:0 14% 16% 0}
.collage .big{aspect-ratio:4/5;max-width:100%}
.collage .small{position:absolute;right:0;bottom:0;width:52%;aspect-ratio:4/3;border:8px solid #fff;box-shadow:var(--shadow)}
.since{position:absolute;left:-14px;top:12%;background:#fff;border-radius:14px;padding:1rem 1.2rem;box-shadow:var(--shadow);display:grid;gap:.1rem}
.since b{font-family:var(--f-display);font-weight:900;font-size:2rem;color:var(--accent);line-height:1}
.since span{font-size:.82rem;color:var(--muted)}
.about-body{display:grid;gap:1.4rem;min-width:0}
.about-body > p{color:var(--muted);font-size:var(--s1)}
.about-body strong{color:var(--ink)}
.checks{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.checks li{display:flex;gap:.75rem;align-items:flex-start;font-weight:500}
.checks li::before{content:"";width:22px;height:22px;flex-shrink:0;border-radius:50%;margin-top:2px;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6.5 11.5l3 3 6-6.5' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}

/* numbers band */
.band{background:var(--deep);color:var(--deep-ink);padding-block:clamp(3rem,6vw,4.5rem);position:relative;overflow:hidden}
.band > .ph{position:absolute;inset:0;border-radius:0;background:var(--deep)}
.band > .ph img{opacity:.16}
.band > .ph::before,.band > .ph::after{display:none}
.band-grid{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1.5rem}
.num{display:grid;gap:.3rem;padding-left:1.1rem;border-left:2px solid var(--accent);align-content:start}
.num b{font-family:var(--f-display);font-weight:900;font-size:clamp(2rem,3.6vw,3rem);line-height:1;font-variant-numeric:tabular-nums}
.num b small{font-size:.5em;font-weight:700;margin-left:.15em}
.num > span{color:var(--deep-muted);font-size:.9rem;line-height:1.4}

/* products */
.row-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap}
.prod-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem;margin-top:3rem;perspective:1200px}
.prod{background:#fff;border-radius:var(--r);border:1px solid var(--line);overflow:hidden;display:grid;grid-template-rows:auto 1fr;text-decoration:none;transform-style:preserve-3d;transition:transform .5s var(--ease),box-shadow .5s,border-color .3s}
.prod:hover{box-shadow:var(--shadow);border-color:transparent}
.prod .ph{aspect-ratio:16/10;border-radius:0;max-width:100%}
.prod:hover .ph img{transform:scale(1.07)}
.tag{position:absolute;top:14px;left:14px;background:#fff;color:var(--ink);font-family:var(--f-display);font-weight:800;font-size:.95rem;border-radius:10px;padding:.35rem .7rem;z-index:2}
.prod-body{padding:1.4rem;display:grid;gap:.8rem;align-content:start}
.prod-body h3{font-size:1.3rem}
.prod-body p{color:var(--muted);font-size:.94rem}
.cas{display:flex;flex-wrap:wrap;gap:.35rem .9rem;font-family:var(--f-mono);font-size:.8rem;background:var(--tint);border-radius:10px;padding:.6rem .8rem}
.cas b{font-family:var(--f-body);font-weight:600}
.more{font-family:var(--f-display);font-weight:700;color:var(--accent);font-size:.92rem}

/* infrastructure */
.units{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem;margin-top:3rem}
.unit{background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);display:grid;align-content:start}
.unit .ph{aspect-ratio:16/9;border-radius:0;max-width:100%}
.unit-body{padding:1.6rem;display:grid;gap:1.1rem}
.unit-body h3{font-size:1.45rem}
.loc{font-size:.88rem;color:var(--muted);margin-top:.25rem}
.specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.spec{background:var(--grey);border-radius:12px;padding:.8rem .9rem}
.spec b{display:block;font-family:var(--f-display);font-weight:900;font-size:1.4rem;line-height:1.1;font-variant-numeric:tabular-nums}
.spec span{font-size:.78rem;color:var(--muted)}
.bars{display:grid;gap:.5rem}
.bar-row{display:grid;grid-template-columns:2.8rem minmax(0,1fr) 1.6rem;gap:.7rem;align-items:center;font-size:.82rem}
.bar-row > span{font-family:var(--f-mono);color:var(--muted)}
.bar{height:10px;border-radius:6px;background:var(--grey);overflow:hidden}
.bar i{display:block;height:100%;border-radius:6px;background:var(--accent);transform-origin:left;transition:transform 1.2s var(--ease)}
.bar i.glr{background:var(--ink)}
html.js .bars:not(.in) .bar i{transform:scaleX(.08)}
.bar-row b{font-variant-numeric:tabular-nums;text-align:right}
.note{font-size:.8rem;color:var(--muted);margin-top:1rem}

/* why */
.why-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2.5rem,6vw,5rem);align-items:center}
.why-photo{position:relative}
.why-photo .ph{aspect-ratio:5/6;max-width:100%}
.why-card{position:absolute;right:-18px;bottom:28px;background:var(--accent);color:#fff;border-radius:14px;padding:1.1rem 1.3rem;box-shadow:var(--shadow);max-width:230px}
.why-card b{display:block;font-family:var(--f-display);font-weight:900;font-size:2.2rem;line-height:1}
.why-card span{font-size:.86rem}
.why-list{display:grid;gap:.9rem;margin-top:2rem}
.why-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;padding:1.1rem 1.2rem;border-radius:14px;background:#fff;border:1px solid var(--line);transition:border-color .3s,transform .4s var(--ease)}
.why-item:hover{border-color:var(--accent);transform:translateX(6px)}
.why-item h3{font-size:1.08rem;margin-bottom:.2rem}
.why-item p{color:var(--muted);font-size:.93rem}

/* r&d */
.rnd-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2.5rem,6vw,5rem);align-items:center}
.rnd-photos{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:1rem;align-items:end}
.rnd-photos .ph{aspect-ratio:3/4;max-width:100%}
.rnd-photos .ph:last-child{margin-bottom:3rem}
.instr{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:0}
.instr li{list-style:none;border:1.5px solid var(--line);border-radius:999px;padding:.4rem .9rem;font-family:var(--f-display);font-weight:700;font-size:.9rem;background:#fff}
.instr li small{font-family:var(--f-body);font-weight:400;color:var(--muted);margin-left:.35rem}
.centres{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.centre{border-radius:14px;background:#fff;padding:1rem 1.1rem}
.centre small{font-family:var(--f-mono);font-size:.72rem;color:var(--accent);letter-spacing:.06em;text-transform:uppercase}
.centre b{display:block;font-family:var(--f-display);font-size:1.02rem;margin-top:.2rem;line-height:1.3}
.centre span{font-size:.86rem;color:var(--muted)}

/* journey */
.journey{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:3.5rem;position:relative}
.journey::before{content:"";position:absolute;left:0;right:0;top:11px;height:2px;background:var(--grey-2)}
.journey .prog{position:absolute;left:0;top:11px;height:2px;width:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--p,1))}
.jstep{position:relative;padding-right:1.2rem;display:grid;gap:.5rem;align-content:start}
.jstep::before{content:"";width:24px;height:24px;border-radius:50%;background:#fff;border:6px solid var(--accent);position:relative;z-index:1}
.jstep.goal::before{border-color:var(--ink)}
.jstep b{font-family:var(--f-display);font-weight:900;font-size:1.8rem;line-height:1;margin-top:.6rem}
.jstep span{color:var(--muted);font-size:.93rem}

/* 3D gallery */
.gallery{background:var(--deep);color:var(--deep-ink);position:relative}
.g-sticky{padding-block:clamp(4rem,8vw,6rem)}
.g-head{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;flex-wrap:wrap}
.g-head p{color:var(--deep-muted);max-width:44ch}
.g-track-wrap{margin-top:2.6rem;overflow-x:auto;scrollbar-width:thin}
.g-track{display:flex;gap:1.6rem;padding-inline:clamp(16px,4vw,40px);width:max-content;will-change:transform}
.g-card{width:clamp(250px,32vw,440px);flex-shrink:0;margin:0;will-change:transform}
.g-card .ph{aspect-ratio:3/2;max-width:100%;border-radius:18px;background:linear-gradient(135deg,#3a3f44,#2f3337)}
.g-card .ph::after{color:var(--deep-muted)}
.g-card figcaption{font-family:var(--f-mono);font-size:.75rem;color:var(--deep-muted);margin-top:.7rem}
.gallery.pinned .g-sticky{position:sticky;top:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.gallery.pinned .g-track-wrap{overflow:visible}
.g-progress{height:3px;background:var(--deep-line);border-radius:3px;margin-top:2rem;overflow:hidden}
.g-progress i{display:block;height:100%;width:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--gp,0))}

/* hse */
.hse{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:24px;overflow:hidden;background:var(--grey)}
.hse .ph{border-radius:0;min-height:340px;max-width:100%}
.hse-body{padding:clamp(1.8rem,4vw,3.4rem);display:grid;gap:1.1rem;align-content:center}
.hse-body h2{font-size:var(--s3)}
.hse-body p{color:var(--muted)}

/* updates */
.up-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2rem;margin-top:3rem}
.up{text-decoration:none;border-radius:var(--r);border:1px solid var(--line);background:#fff;padding:1.4rem;display:grid;gap:1rem;align-content:space-between;min-height:250px;position:relative;overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s,border-color .3s}
.up::before{content:"";position:absolute;right:-40px;top:-40px;width:130px;height:130px;border-radius:50%;background:var(--tint);transition:transform .6s var(--ease)}
.up:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.up:hover::before{transform:scale(1.6)}
.up > *{position:relative}
.up-meta{font-family:var(--f-mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}
.up h3{font-size:1.15rem;line-height:1.3}
.up .big{font-family:var(--f-display);font-weight:900;font-size:2.4rem;line-height:1;color:var(--grey-2);transition:color .3s}
.up:hover .big{color:var(--accent)}

/* faq */
.faq-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,4rem)}
.faq-list{display:grid;gap:.8rem;align-content:start}
details{border:1px solid var(--line);border-radius:14px;background:#fff;transition:border-color .3s}
details[open]{border-color:var(--accent)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.1rem 1.3rem;font-family:var(--f-display);font-weight:700;font-size:1.05rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";width:30px;height:30px;flex-shrink:0;border-radius:50%;background:var(--tint);color:var(--accent);display:grid;place-items:center;font-size:1.2rem;transition:transform .3s,background .3s,color .3s}
details[open] summary::after{transform:rotate(45deg);background:var(--accent);color:#fff}
details p{color:var(--muted);padding:0 1.3rem 1.2rem}

/* cta */
.cta{position:relative;overflow:hidden;color:#fff;background:var(--accent)}
.cta > .ph{position:absolute;inset:0;border-radius:0;background:var(--accent)}
.cta > .ph::before,.cta > .ph::after{display:none}
.cta > .ph img{opacity:.2;mix-blend-mode:luminosity}
.cta-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:3rem;align-items:center}
.cta .eyebrow{color:#fff}
.cta h2{font-size:var(--s4);font-weight:900;margin-top:1rem}
.cta p{margin-top:1rem;font-size:var(--s1);opacity:.92;max-width:48ch}
.contact-card{background:#fff;color:var(--ink);border-radius:20px;padding:1.4rem;display:grid;box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}
.c-row{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.85rem .2rem;border-bottom:1px solid var(--line)}
.c-row:last-child{border-bottom:0}
.c-row small{display:block;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.c-row a,.c-row .v{font-family:var(--f-display);font-weight:700;font-size:1.05rem;text-decoration:none;word-break:break-word}
.copy{flex-shrink:0;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:.35rem .75rem;font-family:var(--f-display);font-weight:700;font-size:.78rem;cursor:pointer;color:var(--ink);text-decoration:none}
.copy:hover{border-color:var(--accent);color:var(--accent)}

/* footer */
footer{background:var(--deep);color:var(--deep-ink);padding-block:clamp(3.5rem,7vw,5rem) 1.6rem}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:2.5rem}
footer p{color:var(--deep-muted);font-size:.93rem;margin-top:1.2rem;max-width:42ch}
footer h4{font-size:1rem;margin-bottom:1rem;color:#fff}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;color:var(--deep-muted);font-size:.93rem}
footer ul a{text-decoration:none}
footer ul a:hover{color:var(--accent)}
.unit-tag{display:inline-block;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:.35rem}
.unit .checks{gap:.5rem}
.hjourney{position:relative;background:var(--grey)}
.hj-sticky{padding-block:clamp(4rem,8vw,6rem);overflow:hidden}
.hj-head{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;flex-wrap:wrap}
.hj-head > p{color:var(--muted);font-family:var(--f-mono);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
.hj-wrap{position:relative;margin-top:3rem;overflow-x:auto}
.hj-line{position:absolute;left:0;right:0;top:34px;height:3px;background:var(--grey-2)}
.hj-line i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--hp,1))}
.hj-track{display:flex;gap:1.4rem;padding-inline:clamp(16px,4vw,40px);width:max-content;position:relative;will-change:transform}
.mile{width:clamp(240px,26vw,330px);flex-shrink:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;display:grid;gap:.6rem;align-content:start;position:relative;margin-top:60px;transition:transform .5s var(--ease),border-color .3s,box-shadow .4s}
.mile::before{content:"";position:absolute;top:-34px;left:1.4rem;width:18px;height:18px;border-radius:50%;background:#fff;border:5px solid var(--accent)}
.mile.goal::before{border-color:var(--ink)}
.mile b{font-family:var(--f-display);font-weight:900;font-size:2.6rem;line-height:1;color:var(--accent);letter-spacing:-.02em}
.mile.goal{background:var(--deep);color:#fff;border-color:var(--deep)}
.mile.goal b{color:#fff}.mile.goal p{color:var(--deep-muted)}
.mile h3{font-size:1.1rem}
.mile p{color:var(--muted);font-size:.93rem}
.mile.lit{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-6px)}
.hjourney.pinned .hj-sticky{position:sticky;top:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.hjourney.pinned .hj-wrap{overflow:visible}
/* touch-friendly targets */
@media (pointer:coarse),(max-width:900px){
  .copy{min-height:40px;min-width:56px;padding:.5rem .9rem}
  .c-row a,.c-row .v{display:inline-block;padding-block:.35rem}
  .crumbs a{display:inline-block;padding-block:.5rem}
  .dots button{height:24px;width:40px;background:linear-gradient(rgba(255,255,255,.45),rgba(255,255,255,.45)) center/100% 4px no-repeat;border-radius:0}
  .dots button[aria-current="true"]{background:linear-gradient(var(--accent),var(--accent)) center/100% 4px no-repeat}
  footer ul a{display:inline-block;padding-block:.3rem}
}
.foot-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;border-top:1px solid var(--deep-line);margin-top:3rem;padding-top:1.4rem;font-size:.84rem;color:var(--deep-muted)}

@media (max-width:1100px){
  .nav,.head .btn{display:none}
  .menu-btn{display:inline-flex}
  .band-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .up-grid,.foot-grid,.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .hero-top,.about-grid,.why-grid,.rnd-grid,.faq-grid,.cta-grid,.hse{grid-template-columns:minmax(0,1fr)}
  .prod-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .units{grid-template-columns:minmax(0,1fr)}
  .journey{grid-template-columns:minmax(0,1fr);gap:1.6rem;padding-left:2.4rem}
  .journey::before{left:11px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .journey .prog{left:11px;top:0;width:2px;height:100%;transform:scaleY(var(--p,1));transform-origin:top}
  .jstep{padding-right:0}
  .jstep::before{position:absolute;left:-2.4rem;top:0}
  .jstep b{margin-top:0}
  .why-card{right:12px}
  .since{left:12px}
  .badge{width:100px;height:100px;top:-30px}
  .badge b{font-size:1.15rem}
}
@media (max-width:600px){
  .topbar .addr{display:none}
  .prod-grid,.trust-grid,.up-grid,.foot-grid,.centres{grid-template-columns:minmax(0,1fr)}
  .band-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .collage{padding:0 8% 18% 0}
  .rnd-photos .ph:last-child{margin-bottom:1.5rem}
  .hero-media{height:clamp(300px,52vh,460px)}
  .hero-cap .chips .chip:nth-child(n+3){display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  html.js .reveal{opacity:1;transform:none}
  html.js .bars:not(.in) .bar i{transform:none}
}
/* phones: swipe gallery, vertical milestones */
.g-swipe{display:none}
@media (max-width:700px){
  .g-track{padding-inline:9vw;gap:1rem}
  .g-card{width:82vw;scroll-snap-align:center}
  .g-track-wrap{margin-top:1.8rem;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:.4rem}
  .g-track-wrap::-webkit-scrollbar{display:none}
  .g-swipe{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--deep-muted)}
  .g-swipe::after{content:"→";color:var(--accent);font-size:1rem;animation:swipeX 1.6s ease-in-out infinite}
  .hj-head > p{display:none}
  .hj-wrap{overflow:visible;margin-top:2rem}
  .hj-track{flex-direction:column;width:auto;gap:1rem;padding-left:calc(clamp(16px,4vw,40px) + 34px);padding-right:clamp(16px,4vw,40px);transform:none!important}
  .hj-line{left:calc(clamp(16px,4vw,40px) + 8px);right:auto;top:0;bottom:0;width:3px;height:auto}
  .hj-line i{transform:scaleY(var(--hp,0));transform-origin:top}
  .mile{width:auto;margin-top:0;padding:1.1rem 1.2rem}
  .mile::before{top:1.45rem;left:-34px}
  .mile b{font-size:2.1rem}
  .mile.lit{transform:none}
}
@keyframes swipeX{50%{transform:translateX(5px)}}
@media (max-width:420px){.c-row a,.c-row .v{font-size:.95rem;word-break:normal;overflow-wrap:anywhere}.c-row{gap:.6rem}}
@media (prefers-reduced-motion:reduce){.g-swipe::after{animation:none}}

/* ---------- home page ---------- */
sub{font-size:.7em;line-height:0}
/* preloader */
.preloader{position:fixed;inset:0;z-index:90;background:var(--deep);color:#fff;display:grid;place-items:center;transition:transform 1s var(--ease);animation:pl-out .8s var(--ease) 4s forwards}
.preloader.done{transform:translateY(-100%)}
@keyframes pl-out{to{transform:translateY(-100%)}}
.pl-inner{display:grid;justify-items:center;gap:1.2rem}
.pl-word{display:flex;align-items:center;gap:2px;font-family:var(--f-display);font-weight:500;font-size:2rem;letter-spacing:.03em}
.pl-word svg{width:30px;height:34px;color:#fff}
.pl-count{font-family:var(--f-display);font-weight:900;font-size:clamp(4rem,14vw,9rem);line-height:1;font-variant-numeric:tabular-nums}
.pl-count small{font-size:.35em;color:var(--accent);margin-left:.1em}
.pl-bar{width:min(320px,70vw);height:3px;background:var(--deep-line);border-radius:3px;overflow:hidden}
.pl-bar i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(0)}

/* pinned truck scene */
.scene{position:relative;height:1300vh;background:linear-gradient(180deg,#FFFFFF 0%,#FBF7F4 55%,#F4F5F6 100%)}
.scene-stage{position:sticky;top:0;height:100svh;overflow:hidden}
@media (max-width:760px){.scene{height:1000vh}}
.scene svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.panels{position:absolute;z-index:2;left:0;right:0;top:calc(78px + clamp(1.5rem,5vh,3.5rem));pointer-events:none}
.panel{position:absolute;left:0;right:0;opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease),transform .7s var(--ease);visibility:hidden}
.panel.on{opacity:1;transform:none;visibility:visible;pointer-events:auto}
.panel-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3rem);align-items:end}
.panel-hero h1{font-size:clamp(2.2rem,4.8vw,4.6rem);font-weight:900;line-height:.98;letter-spacing:-.03em}
.ln{display:block;overflow:hidden;padding-bottom:.08em}
.ln > span{display:block;transition:transform 1.1s var(--ease)}
html.js .ln > span{transform:translateY(110%)}
body.ready .ln > span{transform:none}
body.ready .ln:nth-child(2) > span{transition-delay:.08s}
body.ready .ln:nth-child(3) > span{transition-delay:.16s}
.panel-hero .side{display:grid;gap:1.2rem;padding-bottom:.6rem}
.panel-hero .side p{color:var(--muted);font-size:var(--s1);max-width:40ch}
.scroll-hint{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.scroll-hint i{width:22px;height:34px;border:1.5px solid var(--muted);border-radius:12px;position:relative}
.scroll-hint i::after{content:"";position:absolute;left:50%;top:6px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--accent);animation:wheel 1.6s ease-in-out infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:1}100%{transform:translateY(12px);opacity:0}}
.panel-step{display:grid;gap:.8rem;max-width:560px}
.panel-step .num{font-family:var(--f-mono);font-size:.8rem;letter-spacing:.14em;color:var(--accent);text-transform:uppercase}
.panel-step h2{font-size:clamp(2rem,4.6vw,4.2rem);font-weight:900;line-height:1;letter-spacing:-.025em}
.panel-step p{color:var(--muted);font-size:var(--s1);max-width:46ch}
.facts{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.3rem}
.facts span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.35rem .85rem;font-family:var(--f-display);font-weight:700;font-size:.88rem}
.facts span b{color:var(--accent)}
.rail{position:absolute;z-index:2;right:clamp(16px,3vw,40px);top:50%;transform:translateY(-50%);display:grid;gap:1.1rem;font-family:var(--f-display);font-weight:700;font-size:.85rem}
.rail span{display:flex;align-items:center;gap:.7rem;color:var(--muted);transition:color .4s}
.rail span::before{content:"";width:10px;height:10px;border-radius:50%;border:2px solid currentColor;transition:background .4s,transform .4s}
.rail span.on{color:var(--ink)}
.rail span.on::before{background:var(--accent);border-color:var(--accent);transform:scale(1.3)}
.scene-bar{position:absolute;z-index:2;left:0;right:0;bottom:0;height:4px;background:var(--grey-2)}
.scene-bar i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--sp,0))}
/* scene: day to night, drums, tracker */
.scene .panel-step h2,.scene .panel-step p,.scene .facts span{transition:color .6s,background-color .6s,border-color .6s}
.scene.dusk .panel-step h2{color:#fff}
.scene.dusk .panel-step p{color:rgba(255,255,255,.8)}
.scene.dusk .facts span{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);color:#fff}
.scene.dusk .facts span b{color:#FDBF94}
.scene.dusk .scene-bar{background:rgba(255,255,255,.15)}
.tap-hint{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-mono);font-size:.78rem;letter-spacing:.04em;color:var(--muted)}
.tap-hint::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(242,130,32,.5);animation:tapPulse 1.8s infinite}
@keyframes tapPulse{70%{box-shadow:0 0 0 9px rgba(242,130,32,0)}100%{box-shadow:0 0 0 0 rgba(242,130,32,0)}}
#drums .drum{cursor:pointer}
#drums .drum:hover > *:first-child,#drums .drum.hot > *:first-child{filter:brightness(1.25)}
#drums .drum.hot .drum-ring{opacity:1}
.drum-ring{opacity:0;transition:opacity .2s}
.drum-tip{position:absolute;z-index:4;left:0;top:0;pointer-events:none;display:grid;gap:.1rem;background:var(--deep);color:#fff;border-radius:12px;padding:.6rem .8rem .65rem;min-width:180px;max-width:260px;box-shadow:0 16px 40px -18px rgba(0,0,0,.6);transform:translate(-50%,calc(-100% - 14px))}
.drum-tip::after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;background:var(--deep);transform:translateX(-50%) rotate(45deg)}
.drum-tip[hidden]{display:none}
.drum-tip b{font-family:var(--f-display);font-weight:800;font-size:.98rem;line-height:1.25}
.drum-tip span{font-family:var(--f-mono);font-size:.76rem;color:var(--deep-muted)}
.drum-tip em{font-style:normal;font-family:var(--f-display);font-weight:700;font-size:.8rem;color:#FDBF94;margin-top:.2rem}
.track{position:absolute;z-index:3;right:clamp(16px,3vw,40px);top:calc(78px + clamp(1.5rem,5vh,3.5rem));width:262px;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:16px;padding:1rem 1.1rem 1.05rem;box-shadow:0 18px 50px -30px rgba(0,0,0,.45);opacity:0;transform:translateY(-10px);visibility:hidden;transition:opacity .5s var(--ease),transform .5s var(--ease),visibility .5s,background-color .6s,border-color .6s,color .6s}
.track.on{opacity:1;transform:none;visibility:visible}
.track-hd{display:flex;justify-content:space-between;align-items:center;gap:.6rem;font-family:var(--f-display);font-weight:700;font-size:.84rem}
.track-hd b{font-weight:800}
.track-clock{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--f-mono);font-weight:500;font-size:.8rem;font-variant-numeric:tabular-nums;color:var(--muted)}
.track-clock i{width:12px;height:12px;border-radius:50%;background:#F5A623;box-shadow:0 0 0 3px rgba(245,166,35,.2);transition:background .6s,box-shadow .6s}
.scene.dusk .track-clock i{background:#DCE6FF;box-shadow:0 0 0 3px rgba(220,230,255,.18)}
.track-sub{font-family:var(--f-mono);font-size:.72rem;color:var(--muted);margin-top:.15rem}
.track-now{font-family:var(--f-display);font-weight:900;font-size:1.15rem;line-height:1.2;margin:.55rem 0 .7rem;color:var(--accent)}
.track-bar{display:none}
.track-steps{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;position:relative}
.track-steps::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--grey-2)}
.track-steps::after{content:"";position:absolute;left:5px;top:6px;width:2px;height:calc((100% - 12px) * var(--tp,0));background:var(--accent);transition:height .5s var(--ease)}
.track-steps li{position:relative;display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;padding-left:1.4rem;font-size:.84rem;color:var(--muted);transition:color .4s}
.track-steps li::before{content:"";position:absolute;left:0;top:.32em;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--grey-2);box-sizing:border-box;z-index:1;transition:background .4s,border-color .4s,transform .4s}
.track-steps li b{font-family:var(--f-display);font-weight:700}
.track-steps time{font-family:var(--f-mono);font-size:.74rem;font-variant-numeric:tabular-nums;opacity:0;transition:opacity .4s}
.track-steps li.done{color:var(--ink)}
.track-steps li.done::before{background:var(--accent);border-color:var(--accent)}
.track-steps li.done time{opacity:1}
.track-steps li.cur::before{transform:scale(1.25);box-shadow:0 0 0 4px rgba(242,130,32,.18)}
.scene.dusk .track{background:rgba(14,22,46,.72);border-color:rgba(255,255,255,.14);color:#fff}
.scene.dusk .track-clock,.scene.dusk .track-sub,.scene.dusk .track-steps li{color:rgba(255,255,255,.62)}
.scene.dusk .track-steps li.done{color:#fff}
.scene.dusk .track-steps::before{background:rgba(255,255,255,.18)}
.scene.dusk .track-steps li::before{background:#1B2547;border-color:rgba(255,255,255,.3)}
.scene.dusk .track-steps li.done::before{background:var(--accent);border-color:var(--accent)}
.scene.dusk .tap-hint{color:rgba(255,255,255,.7)}
#scStars .tw{animation:twinkle 3.2s ease-in-out infinite}
@keyframes twinkle{50%{opacity:.25}}
@media (max-width:1000px){
  .track{top:auto;bottom:16px;left:16px;right:16px;width:auto;padding:.7rem .9rem .8rem;border-radius:14px}
  .track-sub{display:none}
  .track-now{font-size:1rem;margin:.25rem 0 .5rem}
  .track-steps{display:none}
  .track-bar{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
  .track-bar i{height:5px;border-radius:3px;background:var(--grey-2);transition:background .4s}
  .track-bar i.done{background:var(--accent)}
  .scene.dusk .track-bar i{background:rgba(255,255,255,.18)}
  .scene.dusk .track-bar i.done{background:var(--accent)}
}
@media (prefers-reduced-motion:reduce){.tap-hint::before,#scStars .tw{animation:none}}

/* statement */
.statement{padding-block:clamp(5rem,12vw,9rem)}
.statement p{font-family:var(--f-display);font-weight:800;font-size:clamp(1.8rem,4.4vw,3.9rem);line-height:1.12;letter-spacing:-.02em;max-width:22ch}
.statement .w{color:var(--grey-2);transition:color .35s}
.statement .w.on{color:var(--ink)}
.statement .w.hl.on{color:var(--accent)}

/* product rows */
.prow-list{margin-top:3rem;border-top:1.5px solid var(--ink)}
.prow{position:relative;display:grid;grid-template-columns:5rem minmax(0,1.4fr) minmax(0,1fr) 3.2rem;gap:1.5rem;align-items:center;padding:1.6rem .4rem;border-bottom:1px solid var(--line);text-decoration:none;overflow:hidden;isolation:isolate}
.prow::before{content:"";position:absolute;inset:0;background:var(--accent);transform:scaleY(0);transform-origin:bottom;transition:transform .55s var(--ease);z-index:-1}
.prow:hover::before,.prow:focus-visible::before{transform:scaleY(1)}
.prow .code{font-family:var(--f-display);font-weight:900;font-size:1.5rem;width:4.2rem;height:4.2rem;border-radius:14px;border:1.5px solid var(--line);display:grid;place-items:center;transition:background .4s,color .4s,border-color .4s}
.prow h3{font-size:clamp(1.6rem,3.6vw,3.1rem);font-weight:900;letter-spacing:-.02em;transition:color .4s,transform .55s var(--ease)}
.prow .feat{display:grid;gap:.15rem;transition:color .4s}
.prow .feat b{font-weight:600}
.prow .feat span{font-family:var(--f-mono);font-size:.82rem;color:var(--muted);transition:color .4s}
.prow .arr{width:3rem;height:3rem;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center;transition:transform .5s var(--ease),background .4s,border-color .4s}
.prow .arr svg{width:16px;height:16px}
.prow:hover,.prow:focus-visible{color:#fff}
.prow:hover h3{transform:translateX(10px)}
.prow:hover .code{background:#fff;color:var(--accent);border-color:#fff}
.prow:hover .feat span{color:rgba(255,255,255,.85)}
.prow:hover .arr{background:#fff;color:var(--accent);border-color:#fff;transform:rotate(-45deg)}

/* scroll-linked ticker */
.ticker{overflow:hidden;padding-block:clamp(2rem,5vw,3.5rem);display:grid;gap:.4rem;border-block:1px solid var(--line)}
.tk-row{display:flex;gap:3rem;white-space:nowrap;will-change:transform;font-family:var(--f-display);font-weight:900;font-size:clamp(2.6rem,7vw,6.5rem);line-height:1;letter-spacing:-.03em}
.tk-row span{display:flex;align-items:center;gap:3rem}
.tk-row span::after{content:"";width:.32em;height:.36em;background:var(--accent);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.tk-out{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
/* staggered reveals */
.wgrid .reveal:nth-child(2),.sb-grid .reveal:nth-child(2),.up-grid .reveal:nth-child(2),.points .reveal:nth-child(2){transition-delay:.08s}
.wgrid .reveal:nth-child(3),.sb-grid .reveal:nth-child(3),.up-grid .reveal:nth-child(3){transition-delay:.16s}
.wgrid .reveal:nth-child(4),.sb-grid .reveal:nth-child(4),.up-grid .reveal:nth-child(4){transition-delay:.24s}
.wgrid .reveal:nth-child(5){transition-delay:.32s}
/* product tabs */
.ptabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2.6rem;padding:.5rem;background:#fff;border:1px solid var(--line);border-radius:16px}
.ptabs button{flex:1 1 auto;border:1.5px solid transparent;background:transparent;border-radius:11px;padding:.8rem 1rem;font-family:var(--f-display);font-weight:700;font-size:.95rem;color:var(--ink);cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.ptabs button:hover{border-color:var(--accent);color:var(--accent)}
.ptabs button[aria-selected="true"]{background:var(--accent);color:#fff;border-color:var(--accent)}
.ptab-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:center;margin-top:2.4rem}
.ptab-text{display:grid;gap:1.1rem;min-width:0;transition:opacity .35s,transform .45s var(--ease)}
.ptab-text.swap{opacity:0;transform:translateY(16px)}
.ptab-text h3{font-size:var(--s4);font-weight:900;letter-spacing:-.02em}
.ptab-text p{color:var(--muted)}
.cas{display:flex;flex-wrap:wrap;gap:.35rem .9rem;font-family:var(--f-mono);font-size:.82rem;background:var(--tint);border-radius:10px;padding:.65rem .85rem;width:fit-content;max-width:100%}
.cas b{font-family:var(--f-body);font-weight:600}
.ptab-stage{position:relative;aspect-ratio:5/4;max-width:100%;border-radius:24px;background:radial-gradient(circle at 50% 45%,#FFFFFF 0%,var(--tint) 60%,#FBE3D3 100%);overflow:hidden}
.ptab-stage::after{content:"";position:absolute;inset:10%;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--accent) 35%,transparent);animation:spin 60s linear infinite}
.ptab-stage canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;cursor:grab;touch-action:pan-y}
.ptab-chip{position:absolute;z-index:2;left:16px;bottom:16px;background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:.7rem .9rem;display:grid;gap:.15rem;max-width:calc(100% - 32px)}
.ptab-chip small{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.ptab-chip b{font-family:var(--f-display);font-size:.95rem}
.legend{display:flex;flex-wrap:wrap;gap:.2rem .7rem;font-family:var(--f-mono);font-size:.7rem;color:var(--muted)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:.3rem;vertical-align:-1px}
.drag-hint{position:absolute;z-index:2;right:16px;top:14px;font-family:var(--f-mono);font-size:.7rem;color:var(--muted)}
/* know more */
.knowmore{background:var(--accent);color:#fff;padding-block:clamp(3.5rem,8vw,6rem);position:relative;overflow:hidden}
.knowmore::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.22) 1.5px,transparent 1.6px);background-size:18px 18px;mask-image:linear-gradient(90deg,transparent 35%,#000)}
.km-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:2rem;align-items:end}
.knowmore h2{font-size:var(--s4);font-weight:900;margin-top:1rem}
.km-side{display:grid;gap:1.4rem;justify-items:start}
.km-side p{font-size:var(--s1);opacity:.92}
@media (max-width:900px){.ptab-body,.km-grid{grid-template-columns:minmax(0,1fr)}.ptab-stage{order:-1}}
@media (max-width:600px){.ptabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.ptabs button{flex:0 0 auto;white-space:nowrap}.ptab-stage{aspect-ratio:1/1}.ptab-chip .legend{display:none}.ptab-chip{left:12px;bottom:12px;padding:.55rem .75rem}}

/* dark stats */
.stats-band{background:var(--deep);color:#fff;padding-block:clamp(4rem,9vw,7rem)}
.sb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem;margin-top:3rem}
.sb{display:grid;gap:.5rem;border-top:2px solid var(--accent);padding-top:1.2rem}
.sb b{font-family:var(--f-display);font-weight:900;font-size:clamp(3rem,7vw,6rem);line-height:.9;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.sb b small{font-size:.38em;color:var(--accent);margin-left:.1em}
.sb span{color:var(--deep-muted)}
.stats-band .sec-head h2{color:#fff}
.stats-band .sec-head p{color:var(--deep-muted)}

/* why */
.wgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:3rem}
.witem{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;display:grid;gap:.7rem;align-content:start;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.witem:hover{border-color:var(--accent);transform:translateY(-5px);box-shadow:var(--shadow)}
.witem.big{grid-row:span 2;background:var(--accent);color:#fff;border-color:var(--accent);align-content:space-between}
.witem.big p{color:rgba(255,255,255,.9)}
.witem .n{font-family:var(--f-display);font-weight:900;font-size:clamp(2.2rem,4vw,3rem);line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.witem.big .n{font-size:clamp(4rem,8vw,7rem);color:#fff}
.witem h3{font-size:1.15rem}
.witem p{color:var(--muted);font-size:.94rem}

/* EDC spotlight */
.spot{background:var(--deep);color:#fff;border-radius:28px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center}
.stage{position:relative;aspect-ratio:1/1;max-width:100%;margin:clamp(1rem,3vw,2rem)}
.stage::before{content:"";position:absolute;inset:9%;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(242,130,32,.3),transparent 68%)}
.stage::after{content:"";position:absolute;inset:4%;border-radius:50%;border:1.5px dashed rgba(255,255,255,.18);animation:spin 60s linear infinite}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;cursor:grab;touch-action:pan-y}
.spot-body{padding:clamp(1.8rem,4vw,3.4rem);display:grid;gap:1.2rem}
.spot-body h2{font-size:var(--s4)}
.spot-body > p{color:var(--deep-muted)}
.spec-table{display:grid;border-top:1px solid var(--deep-line);margin:0}
.spec-table div{display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--deep-line);font-size:.94rem}
.spec-table span:first-child{color:#fff;font-weight:600}
.spec-table span:last-child{color:var(--deep-muted);font-family:var(--f-mono);font-size:.8rem}
.p-actions{display:flex;gap:.6rem;flex-wrap:wrap}

/* r&d */
.rnd2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.chrom{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.1rem .7rem;min-width:0}
.chrom-head{display:flex;justify-content:space-between;gap:1rem;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.4rem;flex-wrap:wrap}
.chrom svg{width:100%;height:auto;display:block}
.chrom .ax{stroke:var(--line);stroke-width:1}
.chrom .tick{fill:var(--muted);font-family:var(--f-mono);font-size:10px}
.chrom .trace{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linejoin:round}
.chrom .area{fill:var(--tint)}
.chrom .ann{fill:var(--ink);font-family:var(--f-mono);font-size:11px;transition:opacity .5s}
.chrom .ann-line{stroke:var(--ink);stroke-width:1;stroke-dasharray:3 3;transition:opacity .5s}
.points{display:grid;gap:1rem}
.point{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:start}
.point h3{font-size:1.05rem;margin-bottom:.15rem}
.point p{color:var(--muted);font-size:.94rem}

/* updates */
.up-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2rem;margin-top:3rem}
.up{text-decoration:none;border-radius:var(--r);border:1px solid var(--line);background:#fff;padding:1.4rem;display:grid;gap:1rem;align-content:space-between;min-height:250px;position:relative;overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s,border-color .3s}
.up::before{content:"";position:absolute;right:-40px;top:-40px;width:130px;height:130px;border-radius:50%;background:var(--tint);transition:transform .6s var(--ease)}
.up:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.up:hover::before{transform:scale(1.6)}
.up > *{position:relative}
.up-meta{font-family:var(--f-mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}
.up h3{font-size:1.15rem;line-height:1.3}
.up .big{font-family:var(--f-display);font-weight:900;font-size:2.4rem;line-height:1;color:var(--grey-2);transition:color .3s}
.up:hover .big{color:var(--accent)}

@media (max-width:1100px){.up-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rail{display:none}}
@media (max-width:900px){
  .panel-hero{grid-template-columns:minmax(0,1fr);gap:1rem}
  .panel-hero .side p{font-size:1rem}
  .spot,.rnd2{grid-template-columns:minmax(0,1fr)}
  .sb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .witem.big{grid-row:auto;grid-column:span 2}
  .prow{grid-template-columns:3.6rem minmax(0,1fr) 2.6rem;gap:1rem}
  .prow .feat{grid-column:2;grid-row:2}
  .prow .code{width:3.4rem;height:3.4rem;font-size:1.15rem}
  .prow .arr{width:2.5rem;height:2.5rem}
}
@media (max-width:600px){
  .panel-hero h1{font-size:2.15rem}
  .panel-hero .side p{display:none}
  .panel-step h2{font-size:2rem}
  .panel-step p{font-size:.98rem}
  .wgrid,.up-grid{grid-template-columns:minmax(0,1fr)}
  .witem.big{grid-column:auto}
  .spec-table div{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){html.js .ln > span{transform:none}.preloader{display:none}}

/* ---------- products page ---------- */
sub{font-size:.7em;line-height:0}
.p-hero{padding-block:clamp(2.5rem,6vw,4.5rem) clamp(2rem,4vw,3rem);position:relative;overflow:hidden}
.p-hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3rem);align-items:center}
.p-hero h1{font-size:var(--s5);font-weight:900;line-height:1;margin-top:1rem;letter-spacing:-.03em}
.p-hero .lede{color:var(--muted);font-size:var(--s1);max-width:52ch;margin-top:1.2rem}
.p-stats{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.p-stats span{border:1px solid var(--line);border-radius:999px;padding:.45rem .95rem;font-family:var(--f-display);font-weight:700;font-size:.9rem;background:#fff}
.p-stats b{color:var(--accent)}
.hero-mol{position:relative;aspect-ratio:1/1;max-width:440px;width:100%;justify-self:center;border-radius:50%;background:radial-gradient(circle at 50% 45%,#fff 0%,var(--tint) 58%,transparent 72%)}
.hero-mol::after{content:"";position:absolute;inset:3%;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--accent) 35%,transparent);animation:spin 60s linear infinite}
.hero-mol canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;cursor:grab;touch-action:pan-y}
.hero-mol .cap{position:absolute;z-index:2;left:50%;bottom:2%;transform:translateX(-50%);background:#fff;border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;font-family:var(--f-mono);font-size:.75rem;white-space:nowrap;box-shadow:var(--shadow);transition:opacity .4s}
.search{position:relative;margin-top:2rem;max-width:560px}
.search input{width:100%;font:inherit;font-size:1.05rem;padding:1.05rem 1.2rem 1.05rem 3.2rem;border:1.5px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);transition:border-color .3s,box-shadow .3s}
.search input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--tint)}
.search svg{position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--muted)}
.search kbd{position:absolute;right:1.1rem;top:50%;transform:translateY(-50%);font-family:var(--f-mono);font-size:.72rem;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:.15rem .45rem}

.filters{position:sticky;top:calc(78px + env(safe-area-inset-top,0px));z-index:20;background:rgba(244,245,246,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-block:1px solid var(--line)}
.filters .wrap{display:grid;gap:.7rem;padding-block:.75rem}
.f-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.f-search{margin-top:0!important;flex:0 1 460px;max-width:460px}
.f-search input{padding:.7rem 1rem .7rem 2.8rem!important;font-size:.95rem!important}
.f-search svg{left:1rem!important;width:18px!important;height:18px!important}
.f-top .count{margin-left:auto}
.f-inq{padding:.68rem 1.2rem;white-space:nowrap;flex:0 0 auto}
@media (max-width:600px){.f-inq{padding:.68rem .9rem;font-size:.85rem}}
.chipbar{display:flex;gap:.45rem;overflow-x:auto;scrollbar-width:none;min-width:0}
.chipbar::-webkit-scrollbar{display:none}
.f-sug{display:flex;align-items:center;gap:.8rem;margin-top:.6rem;min-width:0}
.f-sug[hidden]{display:none}
.f-sug>span{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);flex:0 0 auto}
.f-sug>div{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;min-width:0}
.f-sug>div::-webkit-scrollbar{display:none}
.f-sug button{flex:0 0 auto;font:inherit;font-size:.82rem;border:1px solid var(--line);background:transparent;border-radius:2px;padding:.28rem .65rem;cursor:pointer;color:var(--ink);transition:border-color .25s,color .25s}
.f-sug button:hover,.f-sug button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent-dk,#D96E12)}
@media (max-width:600px){.f-inq{padding-inline:.9rem!important;font-size:.85rem!important}.f-search input{font-size:.9rem!important;padding-left:2.4rem!important}.f-search svg{left:.8rem!important}}
.filters .wrap{gap:.45rem!important;padding-block:.5rem!important}
.f-search input{padding:.48rem .9rem .48rem 2.5rem!important;font-size:.9rem!important}
.f-search svg{left:.85rem!important;width:16px!important;height:16px!important}
.f-search kbd{display:none}
.f-inq{padding:.48rem 1rem!important;font-size:.88rem!important}
.f-top .count{font-size:.78rem}
#chips{flex-wrap:nowrap!important;overflow-x:auto!important}
#chips button{min-height:0!important;padding:.3rem .7rem!important;font-size:.8rem!important;font-weight:500!important;border-width:1px!important;gap:.35rem!important}
#chips button i{display:none}
.f-note{grid-column:1/-1;font-size:.9rem;color:var(--muted);margin:0 0 .4rem}
@media (max-width:600px){.f-sug{gap:.5rem;margin-top:.45rem}.f-sug>span{font-size:.62rem;letter-spacing:.08em}}
@media (min-width:901px){.chipbar{flex-wrap:wrap;overflow:visible}}
.chipbar button{flex:0 0 auto;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:.5rem .95rem;font-family:var(--f-display);font-weight:700;font-size:.88rem;color:var(--ink);cursor:pointer;display:flex;gap:.45rem;align-items:center;transition:background .3s,color .3s,border-color .3s}
.chipbar button i{font-style:normal;font-family:var(--f-mono);font-weight:500;font-size:.72rem;color:var(--muted);transition:color .3s}
.chipbar button:hover{border-color:var(--accent)}
.chipbar button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.chipbar button[aria-pressed="true"] i{color:rgba(255,255,255,.85)}
.count{font-family:var(--f-mono);font-size:.8rem;color:var(--muted);white-space:nowrap}

.catalog{padding-block:2.4rem clamp(4rem,8vw,6rem);background:var(--grey)}
.cat-intro{display:none;margin-bottom:1.8rem;gap:.4rem;max-width:760px}
.cat-intro.on{display:grid}
.cat-intro h2{font-size:var(--s3)}
.cat-intro p{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.3rem;display:grid;gap:.85rem;align-content:start;position:relative;transition:border-color .3s,box-shadow .4s,transform .4s var(--ease)}
.card:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-4px)}
.card.pop{animation:pop .55s var(--ease) both}
@keyframes pop{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:.6rem}
.ptag{font-family:var(--f-display);font-weight:800;font-size:.75rem;background:var(--tint);color:var(--accent-dk);border-radius:8px;padding:.25rem .55rem;letter-spacing:.02em}
.cas-btn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:.25rem .55rem;font-family:var(--f-mono);font-size:.78rem;color:var(--ink);cursor:pointer;display:flex;gap:.35rem;align-items:center}
.cas-btn:hover{border-color:var(--accent);color:var(--accent)}
.cas-btn small{color:var(--muted);font-size:.72rem}
.card h3{font-size:1.08rem;line-height:1.3;overflow-wrap:anywhere}
.card dl{margin:0;display:grid;gap:.35rem}
.card dl div{display:grid;grid-template-columns:5.6rem minmax(0,1fr);gap:.6rem;font-size:.86rem}
.card dt{color:var(--muted)}
.card dd{margin:0;overflow-wrap:anywhere}
.card dd.mono{font-family:var(--f-mono)}
.api{display:flex;flex-wrap:wrap;gap:.35rem}
.api span{font-size:.75rem;font-weight:600;border-radius:999px;padding:.2rem .6rem;background:var(--deep);color:#fff}
.card .inq{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--f-display);font-weight:700;font-size:.9rem;color:var(--accent);text-decoration:none;margin-top:.2rem;width:fit-content}
.card .inq:hover{text-decoration:underline;text-underline-offset:4px}
mark{background:#FFE1CC;color:var(--ink);border-radius:3px;padding:0 .1em}
.empty{display:none;background:#fff;border:1.5px dashed var(--line);border-radius:var(--r);padding:2.4rem;text-align:center;gap:.8rem;justify-items:center}
.empty.on{display:grid}
.empty h3{font-size:1.4rem}
.empty p{color:var(--muted);max-width:46ch}

.custom{background:var(--deep);color:#fff;padding-block:clamp(4rem,8vw,6rem);position:relative;overflow:hidden}
.custom::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.08) 1.5px,transparent 1.6px);background-size:18px 18px}
.custom-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:2.5rem;align-items:center}
.custom h2{font-size:var(--s4);font-weight:900}
.custom p{color:var(--deep-muted);font-size:var(--s1);margin-top:1rem;max-width:50ch}
.steps3{display:grid;gap:0;border-top:1px solid var(--deep-line)}
.steps3 > div{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:1.1rem;align-items:start;padding:1.15rem 0;border-bottom:1px solid var(--deep-line)}
.steps3 > div > div{display:block}
.steps3 b{width:2.1rem;height:2.1rem;border:1px solid var(--accent);border-radius:2px;color:var(--accent);display:grid;place-items:center;font-family:var(--f-mono);font-weight:400;font-size:.85rem}
.steps3 h3{font-size:1.05rem;font-weight:500!important;color:#fff;margin:0}
.steps3 p{margin-top:.25rem!important;font-size:.92rem!important;max-width:none!important}
@media (max-width:1100px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.p-hero-grid,.custom-grid{grid-template-columns:minmax(0,1fr)}.hero-mol{max-width:300px}.count{display:none}.f-search{flex:1 1 auto;max-width:none}}
@media (max-width:600px){.grid{grid-template-columns:minmax(0,1fr)}.search kbd{display:none}.hero-mol{max-width:240px}}
@media (prefers-reduced-motion:reduce){.card.pop{animation:none}}
@media (pointer:coarse),(max-width:900px){.cas-btn{min-height:36px;padding:.35rem .7rem}.card .inq{padding-block:.55rem}.chipbar button{min-height:40px}}

/* clickable cards */
.card{cursor:pointer;display:flex;flex-direction:column}
.card-foot{margin-top:auto!important}
.card .open{all:unset;cursor:pointer;display:block}
.card .open::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:0}
.card:has(.open:focus-visible){outline:3px solid var(--accent);outline-offset:3px}
.card-top .cas-btn,.card-foot .inq{position:relative;z-index:1}
.card-foot{display:flex;justify-content:space-between;align-items:center;gap:.8rem;margin-top:.2rem;padding-top:.85rem;border-top:1px solid var(--line)}
.card .more{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--f-display);font-weight:700;font-size:.9rem;color:var(--ink);transition:color .3s,gap .3s}
.card:hover .more{color:var(--accent);gap:.65rem}
.card-foot .inq{margin-top:0;font-size:.85rem;color:var(--muted)}
.card-foot .inq:hover{color:var(--accent)}

/* product detail dialog */
html.pd-lock{overflow:hidden}
.pd{border:0;padding:0;margin:auto;width:min(980px,calc(100vw - 2rem));max-width:none;max-height:calc(100dvh - 2rem);border-radius:22px;background:#fff;color:var(--ink);box-shadow:0 40px 120px -30px rgba(20,22,25,.55);overflow:hidden}
.pd::backdrop{background:rgba(32,35,38,.55);backdrop-filter:blur(4px)}
.pd[open]{animation:pdIn .45s var(--ease) both}
.pd[open]::backdrop{animation:pdFade .35s ease both}
@keyframes pdIn{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@keyframes pdFade{from{opacity:0}to{opacity:1}}
.pd-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);max-height:calc(100dvh - 2rem)}
.pd-vis{position:relative;background:var(--deep);color:#fff;padding:1.4rem;display:grid;grid-template-rows:auto 1fr auto;gap:1rem;min-height:420px;overflow:hidden}
.pd-vis::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.08) 1.5px,transparent 1.6px);background-size:18px 18px}
.pd-vis::after{content:"";position:absolute;width:70%;aspect-ratio:1;left:15%;top:22%;border-radius:50%;background:radial-gradient(closest-side,rgba(242,130,32,.28),transparent);pointer-events:none}
.pd-vis>*{position:relative;z-index:1}
.pd-code{font-family:var(--f-display);font-weight:900;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--deep-muted)}
.pd-code b{color:var(--accent);font-family:var(--f-mono);letter-spacing:.02em;text-transform:none}.pd-code sub{font-size:.75em}
.pd [hidden]{display:none!important}
.pd-stage{position:relative;display:grid;place-items:center;min-height:300px;align-self:stretch}
.pd-stage>*{grid-area:1/1}
#pdDonut{width:min(100%,260px);height:auto;overflow:visible}
#pdDonut .seg{fill:none;stroke-width:26;transition:stroke-dasharray 1s var(--ease),stroke-dashoffset 1s var(--ease)}
#pdDonut text{fill:#fff;text-anchor:middle;font-family:var(--f-mono)}
#pdDonut .t1{font-size:17px;font-weight:600}
#pdDonut .t2{font-size:10.5px;fill:var(--deep-muted);font-family:var(--f-body);letter-spacing:.08em}
.pd-els b{font-weight:600;color:var(--deep-muted)}
.pd-vis canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.pd-vis canvas:active{cursor:grabbing}
.pd-molcap{font-size:.78rem;color:var(--deep-muted);text-align:center}
.pd-big{font-family:var(--f-display);font-weight:900;font-size:2.6rem;color:#fff;width:180px;aspect-ratio:1;border-radius:50%;border:2px dashed rgba(255,255,255,.2);display:grid;place-items:center;box-shadow:inset 0 0 0 14px rgba(242,130,32,.12)}
.pd-els{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.pd-els span{font-family:var(--f-mono);font-size:.78rem;border:1px solid var(--deep-line);border-radius:8px;padding:.2rem .5rem;display:inline-flex;gap:.35rem;align-items:center}
.pd-els i{width:.65rem;height:.65rem;border-radius:50%;display:inline-block}
.pd-body{padding:1.5rem 1.6rem 1.6rem;overflow-y:auto;overscroll-behavior:contain;display:grid;gap:1.1rem;align-content:start}
.pd-top{display:flex;align-items:center;gap:.8rem;min-height:2.5rem;padding-right:8.6rem}
.pd-ctrl{display:flex;gap:.4rem;position:absolute;top:1.2rem;right:1.3rem;z-index:5}
.pd-ctrl button{width:2.5rem;height:2.5rem;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:border-color .25s,color .25s,background .25s}
.pd-ctrl button:hover{border-color:var(--accent);color:var(--accent)}
.pd-ctrl button[data-act="close"]{background:var(--ink);border-color:var(--ink);color:#fff}
.pd-ctrl button[data-act="close"]:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.pd-ctrl button:disabled{opacity:.35;pointer-events:none}
.pd-ctrl svg{width:1rem;height:1rem}
.pd h2{font-size:clamp(1.35rem,2.4vw,1.85rem);line-height:1.2;font-weight:900;overflow-wrap:anywhere}
.pd-alt{color:var(--muted);font-size:.95rem;margin-top:-.6rem}
.pd-spec{margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.pd-spec div{display:grid;grid-template-columns:9.5rem minmax(0,1fr);gap:.8rem;padding:.7rem 1rem;font-size:.92rem;align-items:center}
.pd-spec div+div{border-top:1px solid var(--line)}
.pd-spec div:nth-child(odd){background:var(--grey)}
.pd-spec dt{color:var(--muted)}
.pd-spec dd{margin:0;overflow-wrap:anywhere;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.pd-spec dd.mono{font-family:var(--f-mono)}
.pd-spec .soft{color:var(--muted);font-style:italic}
.pd-spec .cas-btn{font-size:.82rem}
.pd h3{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:800;margin-bottom:.55rem}
.pd-cta{display:flex;flex-wrap:wrap;gap:.6rem}
.pd-cta .btn{padding:.8rem 1.25rem;font-size:.9rem}
.pd-rel-list{display:flex;flex-wrap:wrap;gap:.45rem}
.pd-rel-list button{font:inherit;font-size:.84rem;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:.4rem .8rem;cursor:pointer;text-align:left;transition:border-color .25s,color .25s}
.pd-rel-list button:hover{border-color:var(--accent);color:var(--accent)}
.pd-note{font-size:.8rem;color:var(--muted)}
.pd-body>*{animation:pdUp .5s var(--ease) both}
.pd-body>*:nth-child(2){animation-delay:.04s}.pd-body>*:nth-child(3){animation-delay:.08s}.pd-body>*:nth-child(4){animation-delay:.12s}.pd-body>*:nth-child(5){animation-delay:.16s}.pd-body>*:nth-child(n+6){animation-delay:.2s}
@keyframes pdUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:820px){
  .pd{width:100vw;max-height:92dvh;margin:auto 0 0;border-radius:22px 22px 0 0}
  .pd[open]{animation-name:pdSheet}
  @keyframes pdSheet{from{transform:translateY(100%)}to{transform:none}}
  .pd-in{grid-template-columns:minmax(0,1fr);max-height:92dvh;overflow-y:auto;overscroll-behavior:contain}
  .pd-body{overflow:visible;padding:1.2rem 1.1rem 1.6rem}
  .pd-vis{min-height:0;grid-template-rows:auto 220px auto;padding:1rem 1.1rem}
  .pd-stage{min-height:0;height:250px}
  .pd-big{width:150px;font-size:2.1rem}
  #pdDonut{width:200px}
  .pd-top{padding-right:0;min-height:0}
  .pd-ctrl{top:.8rem;right:.8rem}
  .pd-ctrl button{box-shadow:0 6px 18px -6px rgba(0,0,0,.35)}
  .pd-code{padding-right:8.4rem;min-height:2.5rem;display:flex;align-items:center}
  .pd-spec div{grid-template-columns:7rem minmax(0,1fr);padding:.65rem .8rem;font-size:.88rem}
  .pd-cta .btn{flex:1 1 auto;justify-content:center}
}

/* structure thumbnails + detail additions */
.thumb{height:118px;background:var(--grey);border-radius:12px;display:grid;place-items:center;padding:.55rem;overflow:hidden;transition:background .3s}
.card:hover .thumb{background:#FFF6F0}
.thumb svg{max-width:100%;max-height:100%;width:auto;height:auto;font-family:var(--f-body);display:block}
.pd-2d{position:absolute;inset:.1rem;background:#fff;border-radius:18px;display:grid;place-items:center;padding:1.1rem;box-shadow:0 24px 60px -30px rgba(0,0,0,.7);overflow:hidden}
.pd-2d svg{max-width:100%;max-height:100%;width:auto;height:auto;font-family:var(--f-body);display:block}
.pd-2d[hidden]{display:none}
.pd-foot{display:grid;gap:.75rem;justify-items:center}
.pd-vt{display:inline-flex;background:rgba(255,255,255,.08);border:1px solid var(--deep-line);border-radius:999px;padding:3px}
.pd-vt button{font:inherit;font-family:var(--f-display);font-weight:700;font-size:.82rem;border:0;background:transparent;color:var(--deep-muted);padding:.45rem 1rem;border-radius:999px;cursor:pointer;transition:background .25s,color .25s}
.pd-vt button[aria-pressed="true"]{background:#fff;color:var(--ink)}
.pd-vt button:not([aria-pressed="true"]):hover{color:#fff}
.pd-well{font-family:var(--f-display);font-weight:800;font-size:.72rem;letter-spacing:.04em;color:#fff;background:var(--deep);border-radius:8px;padding:.25rem .55rem}
.pd-desc p{color:var(--ink);font-size:.95rem;line-height:1.6}
.pd-desc p+p{margin-top:.6rem}
.pd-more{all:unset;cursor:pointer;margin-top:.5rem;font-family:var(--f-display);font-weight:700;font-size:.85rem;color:var(--accent)}
.pd-more:hover{text-decoration:underline;text-underline-offset:3px}
.pd-list{margin:0;padding:0;list-style:none;display:grid;gap:.45rem}
.pd-list li{position:relative;padding-left:1.1rem;font-size:.92rem;line-height:1.5}
.pd-list li::before{content:"";position:absolute;left:0;top:.6em;width:.42rem;height:.42rem;border-radius:2px;background:var(--accent);transform:rotate(45deg)}
.pd-tech div:nth-child(odd){background:#fff}
.pd-tech div:nth-child(even){background:var(--grey)}
.pd-ps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.7rem}
.pd-ps[hidden]{display:none}
.pd-box{border:1px solid var(--line);border-radius:14px;padding:.85rem 1rem;background:#FFF9F5}
.pd-box b{font-family:var(--f-display);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-dk)}
.pd-box p{margin-top:.35rem;font-size:.9rem;line-height:1.5}
.pd-det{border:1px solid var(--line);border-radius:14px;padding:.2rem 1rem}
.pd-det summary{cursor:pointer;font-family:var(--f-display);font-weight:800;font-size:.92rem;padding:.7rem 0;list-style:none;display:flex;justify-content:space-between;align-items:center}
.pd-det summary::-webkit-details-marker{display:none}
.pd-det summary::after{content:"+";font-size:1.2rem;color:var(--accent);transition:transform .3s}
.pd-det[open] summary::after{transform:rotate(45deg)}
.pd-det[open]{padding-bottom:.9rem}
.pd-det .pd-note{margin-top:.6rem}
.pd-syn{display:flex;flex-wrap:wrap;gap:.4rem}
.pd-syn span{font-size:.82rem;background:var(--grey);border-radius:8px;padding:.3rem .6rem}
.pd-ext{font-family:var(--f-display);font-weight:700;font-size:.88rem;color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:4px;width:fit-content}
.pd-ext:hover{color:var(--accent)}
@media (max-width:820px){.thumb{height:104px}.pd-2d{inset:0}}

.pd-in{height:min(860px,calc(100dvh - 2rem));grid-template-rows:minmax(0,1fr)}
.pd-vis{min-height:0;grid-template-rows:auto minmax(0,1fr) auto}
.pd-stage{min-height:0}
.pd-body{min-height:0;grid-auto-rows:max-content}
@media (max-width:820px){.pd-in{height:auto;grid-template-rows:none}.pd-vis{grid-template-rows:auto 250px auto}.pd-stage{height:auto}}
@media (prefers-reduced-motion:reduce){.pd[open],.pd[open]::backdrop,.pd-body>*{animation:none}}
.thumb .st-img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.pd-2d .st-img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.st-none{font-family:var(--f-mono);font-size:.78rem;color:var(--muted)}
.pd-vt[hidden]{display:none}
/* phones: compact list cards (structure left, name right) */
@media (max-width:600px){
  .grid{gap:.75rem}
  .card{display:grid;grid-template-columns:92px minmax(0,1fr);grid-template-areas:"thumb top" "thumb title" "dl dl" "api api" "foot foot";column-gap:.9rem;row-gap:.45rem;padding:.9rem;align-items:start}
  .card:hover{transform:none}
  .card-top{grid-area:top;flex-wrap:wrap;justify-content:flex-start;gap:.35rem}
  .card .ptag{font-size:.68rem;padding:.2rem .45rem}
  .cas-btn{white-space:nowrap;min-height:30px;padding:.2rem .5rem;font-size:.74rem}
  .thumb{grid-area:thumb;width:92px;height:92px;padding:.3rem;border-radius:10px}
  .card h3{grid-area:title;font-size:.98rem;line-height:1.28}
  .card dl{grid-area:dl}
  .card dl div{grid-template-columns:5rem minmax(0,1fr);font-size:.82rem}
  .card dl div:nth-child(n+2){display:none}
  .card .api{grid-area:api}
  .card-foot{grid-area:foot;padding-top:.6rem;margin-top:0!important}
  .card .inq{padding-block:.35rem}
  .pd-code{font-size:.7rem;letter-spacing:.08em}
}

.page[hidden]{display:none!important}


/* ---------- blog page ---------- */
.b-hero .p-hero-grid{align-items:stretch}
.b-hero h1 .hl{white-space:nowrap}
.b-feature{display:grid;grid-template-rows:auto 1fr;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .45s var(--ease),border-color .3s}
.b-feature:hover{transform:translateY(-4px);border-color:var(--accent)}
.b-feature .b-cover{height:220px;border-radius:0}
.b-feature .b-body{padding:1.3rem 1.4rem 1.5rem}
.b-feature h2{font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.25;font-weight:900;margin-top:.5rem}
.b-flag{position:absolute;left:1rem;top:1rem;z-index:2;font-family:var(--f-display);font-weight:800;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;background:var(--accent);color:#fff;border-radius:999px;padding:.35rem .75rem}
.b-list{padding-block:clamp(2rem,4vw,3rem) clamp(3.5rem,7vw,5rem);background:var(--grey)}
.b-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.b-card{display:grid;grid-template-rows:auto 1fr;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .4s var(--ease),box-shadow .4s,border-color .3s}
.b-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--accent)}
.b-card.pop{animation:pop .55s var(--ease) both}
.b-cover{position:relative;height:170px;display:grid;place-items:center;overflow:hidden;background:#FFF4EC}
.b-cover::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(242,130,32,.18) 1.4px,transparent 1.5px);background-size:16px 16px;opacity:.7}
.b-cover svg{position:relative;max-width:82%;max-height:78%;width:auto;height:auto;font-family:var(--f-body);transition:transform .6s var(--ease)}
.b-card:hover .b-cover svg,.b-feature:hover .b-cover svg{transform:scale(1.06) rotate(-2deg)}
.b-cover.dark{background:var(--deep)}
.b-cover.dark::before{background-image:radial-gradient(rgba(255,255,255,.1) 1.4px,transparent 1.5px)}
.b-cover .mono{position:relative;font-family:var(--f-display);font-weight:900;font-size:clamp(2rem,4vw,2.8rem);letter-spacing:-.02em;color:#fff;text-transform:uppercase;line-height:1;text-align:center;padding:0 1rem}
.b-cover .mono small{display:block;font-size:.78rem;letter-spacing:.18em;color:var(--accent);margin-top:.6rem;font-weight:800}
.b-cover.multi{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;padding:.8rem}
.b-cover.multi svg{max-width:100%;max-height:72%}
.b-body{padding:1.1rem 1.2rem 1.3rem;display:grid;gap:.55rem;align-content:start}
.b-meta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;font-size:.8rem;color:var(--muted)}
.b-topic{font-family:var(--f-display);font-weight:800;font-size:.72rem;background:var(--tint);color:var(--accent-dk);border-radius:8px;padding:.22rem .5rem}
.b-card h3{font-size:1.06rem;line-height:1.32}
.b-card p,.b-feature p{font-size:.9rem;color:var(--muted);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.b-tags{display:flex;flex-wrap:wrap;gap:.3rem}
.b-tags span{font-size:.72rem;border:1px solid var(--line);border-radius:999px;padding:.15rem .5rem;color:var(--ink)}
.b-read{font-family:var(--f-display);font-weight:700;font-size:.88rem;display:inline-flex;gap:.4rem;align-items:center;margin-top:.2rem;transition:gap .3s,color .3s}
.b-card:hover .b-read,.b-feature:hover .b-read{gap:.7rem;color:var(--accent)}
.b-moreb{display:flex;justify-content:center;margin-top:2rem}
.b-art{padding-block:clamp(2rem,4vw,3rem) clamp(3.5rem,7vw,5rem)}
.b-art-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(1.5rem,4vw,3rem);align-items:start;margin-top:1.4rem}
.b-art h1{font-size:clamp(1.8rem,3.6vw,2.9rem);line-height:1.12;font-weight:900;margin-top:.8rem;overflow-wrap:anywhere}
.b-art .b-meta{margin-top:1rem;font-size:.88rem}
.b-art .b-cover{height:clamp(220px,32vw,340px);border-radius:22px;margin-top:1.6rem}
.b-art .b-cover svg{max-height:70%}
.b-lead{font-size:clamp(1.08rem,1.6vw,1.25rem);line-height:1.6;margin-top:1.6rem;padding-left:1.1rem;border-left:4px solid var(--accent)}
.b-sum{margin-top:1.2rem;background:#fff;border:1px solid var(--line);border-radius:16px;padding:1rem 1.2rem}
.b-sum b{font-family:var(--f-display);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-dk)}
.b-sum p{margin-top:.35rem;line-height:1.6}
.b-art h2.b-h{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:800;margin-top:2.2rem}
.b-toc{margin:.8rem 0 0;padding:0;list-style:none;counter-reset:t;display:grid;gap:.15rem}
.b-toc li{counter-increment:t;display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:.4rem;align-items:baseline;padding:.65rem .2rem;border-bottom:1px solid var(--line);font-size:1rem;line-height:1.4}
.b-toc li::before{content:counter(t,decimal-leading-zero);font-family:var(--f-mono);font-size:.8rem;color:var(--accent)}
.b-faq{margin-top:.8rem;display:grid;gap:.5rem}
.b-faq div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem;font-weight:600;font-size:.95rem;display:flex;gap:.7rem}
.b-faq div::before{content:"Q";font-family:var(--f-display);font-weight:900;color:var(--accent)}
.b-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem;align-items:center}
.b-note{font-size:.85rem;color:var(--muted);margin-top:.9rem}
.b-side{position:sticky;top:100px;display:grid;gap:1rem}
.b-box{background:#fff;border:1px solid var(--line);border-radius:18px;padding:1.1rem}
.b-box h3{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:800;margin-bottom:.8rem}
.b-prod{display:grid;grid-template-columns:72px minmax(0,1fr);gap:.8rem;align-items:center;text-decoration:none;color:var(--ink);padding:.5rem;border-radius:12px;transition:background .25s}
.b-prod:hover{background:var(--tint)}
.b-prod .t{height:60px;background:var(--grey);border-radius:10px;display:grid;place-items:center;padding:.3rem;overflow:hidden}
.b-prod .t svg{max-width:100%;max-height:100%;width:auto;height:auto;font-family:var(--f-body)}
.b-prod b{font-size:.9rem;line-height:1.3;display:block}
.b-prod small{font-family:var(--f-mono);font-size:.74rem;color:var(--muted)}
.b-box.dark{background:var(--deep);color:#fff;border-color:var(--deep)}
.b-box.dark h3{color:var(--deep-muted)}
.b-box.dark p{color:var(--deep-muted);font-size:.92rem;line-height:1.55}
.b-box.dark .btn{margin-top:1rem}
.b-pn{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:3rem}
.b-pn a{display:grid;gap:.3rem;text-decoration:none;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:16px;padding:1rem 1.2rem;transition:border-color .3s}
.b-pn a:hover{border-color:var(--accent)}
.b-pn small{font-family:var(--f-display);font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.b-pn a.nx{text-align:right}
.b-pn b{font-size:.98rem;line-height:1.35}
.b-rel{margin-top:3rem}
.b-rel>h2{font-size:var(--s3);font-weight:900;margin-bottom:1.2rem}
@media (max-width:1100px){.b-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.b-art-grid{grid-template-columns:minmax(0,1fr)}.b-side{position:static}}
@media (max-width:640px){.b-grid{grid-template-columns:minmax(0,1fr)}.b-pn{grid-template-columns:minmax(0,1fr)}.b-pn a.nx{text-align:left}.b-feature .b-cover{height:180px}.b-hero h1 .hl{white-space:normal}}
@media (prefers-reduced-motion:reduce){.b-card.pop{animation:none}}
/* full article text from WordPress */
.b-content{margin-top:1.6rem;font-size:1.06rem;line-height:1.75;color:var(--ink);overflow-wrap:anywhere}
.b-content > * + *{margin-top:1.05em}
.b-content h2{font-size:clamp(1.4rem,2.4vw,1.85rem);margin-top:2em}
.b-content h3{font-size:1.25rem;margin-top:1.6em}
.b-content p,.b-content li{color:#45494E}
.b-content ul,.b-content ol{padding-left:1.3em}
.b-content li + li{margin-top:.4em}
.b-content a{color:var(--accent-dk);text-underline-offset:3px}
.b-content img,.b-content video,.b-content iframe{max-width:100%;height:auto;border-radius:12px}
.b-content figure{margin:1.6em 0}.b-content figcaption{font-size:.85rem;color:var(--muted);margin-top:.4em}
.b-content blockquote{margin:1.4em 0;padding:.8em 1.2em;border-left:3px solid var(--accent);background:var(--grey);border-radius:0 12px 12px 0}
.b-content table{width:100%;border-collapse:collapse;font-size:.94rem;display:block;overflow-x:auto}
.b-content th,.b-content td{border:1px solid var(--line);padding:.55em .75em;text-align:left;vertical-align:top}
.b-content th{background:var(--grey)}


/* ---------- Contact: two calm slides (contacts + locations, then the inquiry form) ---------- */
.ctx{min-height:calc(100vh - 78px);min-height:calc(100svh - 78px);display:grid;align-items:center;padding-block:clamp(1.4rem,4vh,2.8rem)}
.ctx--grey{background:var(--grey)}
.ctx-top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:end}
.ctx-top .crumbs{margin-bottom:1.2rem}
.ctx h1,.ctx h2{margin:.8rem 0 0}
.ctx .lead{margin-top:.9rem;color:var(--muted);max-width:40ch;line-height:1.6}
.ctx-keys{margin:0;display:grid;border-top:1px solid var(--line)}
.ctx-keys div{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.ctx-keys dt,.ctx-loc .k{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ctx-keys dd{margin:0;display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;align-items:baseline;color:var(--ink)}
.ctx a.u{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--accent);transition:color .2s}
.ctx a.u:hover{color:var(--accent)}
.ctx-keys .big{font-weight:500;font-size:clamp(1.02rem,1.3vw,1.15rem)}
.ctx-keys button{font:inherit;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);background:#fff;border-radius:2px;padding:.2rem .5rem;cursor:pointer;color:var(--muted)}
.ctx-keys button:hover{border-color:var(--accent);color:var(--accent)}
.ctx-keys small{color:var(--muted);font-size:.82rem}
.ctx-locs{margin-top:clamp(2.2rem,6vh,3.6rem)}
.ctx-locs>h2{font-family:var(--f-mono);font-weight:400!important;font-size:.74rem!important;letter-spacing:.16em!important;text-transform:uppercase;color:var(--muted);margin:0}
.ctx-loc-grid{list-style:none;margin:1rem 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(1rem,2.4vw,2.4rem);border-top:1px solid var(--ink)}
.ctx-loc{display:grid;align-content:start;gap:.45rem;padding:1.2rem 0 0}
.ctx-loc .k{color:var(--accent)}
.ctx-loc h3{font-size:1.08rem;font-weight:600;margin:0}
.ctx-loc address{font-style:normal;color:var(--muted);font-size:.92rem;line-height:1.55}
.ctx-loc .u{font-size:.86rem;justify-self:start}
.ctx-form{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:start}
.ctx-form > div > p{color:var(--muted);margin-top:.8rem;font-size:.95rem;max-width:40ch}
.ctx-quote{margin-top:1.8rem}
.ctx-quote h3{font-family:var(--f-mono);font-weight:400!important;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ctx-quote ol{margin:.7rem 0 0;padding:0;list-style:none;counter-reset:q;display:grid;gap:.4rem;font-size:.95rem}
.ctx-quote li{counter-increment:q;display:flex;gap:.8rem;align-items:baseline}
.ctx-quote li::before{content:counter(q,decimal-leading-zero);font-family:var(--f-mono);font-size:.72rem;color:var(--accent)}
form.ct-form{margin-top:0;background:#fff;border:1px solid var(--line);border-radius:6px;padding:clamp(1.2rem,3vw,2rem);display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.ct-f{display:grid;gap:.4rem}
.ct-f.full{grid-column:1/-1}
.ct-f label{font-weight:600;font-size:.85rem}
.ct-f label i{color:var(--accent);font-style:normal}
.ct-f input,.ct-f textarea{font:inherit;font-size:.98rem;padding:.75rem .9rem;border:1px solid var(--line);border-radius:2px;background:var(--grey);color:var(--ink);width:100%;transition:border-color .25s,background .25s,box-shadow .25s}
.ct-f input:focus,.ct-f textarea:focus{outline:none;border-color:var(--accent);background:#fff;box-shadow:0 0 0 3px var(--tint)}
.ct-f textarea{min-height:96px;resize:vertical}
.ct-f [aria-invalid="true"]{border-color:#C0392B;background:#FFF5F4}
.ct-f small{color:var(--muted);font-size:.78rem}
.ct-sub{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}
.ct-sub small{color:var(--muted);font-size:.82rem;max-width:38ch}
.ct-msg{grid-column:1/-1;border-radius:4px;padding:.8rem 1rem;font-size:.9rem;display:none}
.ct-msg.ok{display:block;background:#EEF8F0;border:1px solid #BFE3C6;color:#1E6B35}
.ct-msg.err{display:block;background:#FFF5F4;border:1px solid #F3C4BE;color:#9B2C20}
@media (max-width:1000px){.ctx-loc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.6rem}.ctx-loc{padding-bottom:1.2rem}}
@media (max-width:900px){.ctx{min-height:0;padding-block:2rem 2.6rem}.ctx-top,.ctx-form{grid-template-columns:minmax(0,1fr);gap:1.6rem}}
@media (max-width:600px){form.ct-form{grid-template-columns:minmax(0,1fr)}.ctx-keys div{grid-template-columns:minmax(0,1fr);gap:.25rem}.ctx-loc-grid{grid-template-columns:minmax(0,1fr)}.ctx-loc{border-bottom:1px solid var(--line);padding-block:1rem}}

/* inquiry form in rows */
.ctx-isplit{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.ctx-ihead{display:block}
.ctx-ihead p{color:var(--muted);margin-top:.8rem;font-size:.95rem;max-width:44ch}
.ctx-ihead .ctx-quote{margin-top:1.6rem}

form.ct-rows{margin-top:0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:1rem 1rem!important;align-items:end}
.ct-rows .w2{grid-column:span 2}
.ct-rows .w3{grid-column:span 3}
.ct-rows .ct-f small{display:none}
.ct-rows textarea{min-height:48px!important;height:48px;resize:vertical}
.ct-rows .ct-go{align-self:end;gap:.45rem}
.ct-rows .ct-go .btn{width:100%;justify-content:center;padding-block:.82rem}
.ct-rows .ct-go small{display:block!important;font-size:.72rem;color:var(--muted);line-height:1.35}
@media (max-width:1000px){.ctx-isplit{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.ctx-ihead{grid-template-columns:minmax(0,1fr);gap:1.2rem}form.ct-rows{grid-template-columns:repeat(2,minmax(0,1fr))!important}.ct-rows .w2,.ct-rows .w3{grid-column:1/-1}.ct-rows .ct-go{grid-column:1/-1}}
@media (max-width:600px){form.ct-rows{grid-template-columns:minmax(0,1fr)!important}.ctx-quote ol{grid-template-columns:minmax(0,1fr)}}


/* ---------- shared pinned-page layout (HSE, R&D) ---------- */
.pg-hero{position:relative}
.pg-stage{position:sticky;top:calc(78px + env(safe-area-inset-top,0px));height:calc(100vh - 78px);height:calc(100dvh - 78px);overflow:hidden}
.pg-copy{position:absolute;inset:0;pointer-events:none;z-index:2}
.pg-copy .wrap{height:100%;display:grid;grid-template-rows:auto 1fr auto;padding-block:clamp(1.1rem,3vh,2rem)}
.pg-copy a,.pg-copy button{pointer-events:auto}
.pg-panels{position:relative;align-self:center;max-width:min(500px,44%);min-height:300px}
.pg-panel{position:absolute;left:0;right:0;top:50%;transform:translateY(calc(-50% + 26px));opacity:0;visibility:hidden;transition:opacity .6s var(--ease),transform .7s var(--ease),visibility 0s .7s}
.pg-panel.on{opacity:1;visibility:visible;transform:translateY(-50%);transition:opacity .6s var(--ease),transform .7s var(--ease),visibility 0s}
.pg-panel h1,.pg-panel h2{font-size:clamp(2.1rem,4.4vw,3.9rem);line-height:1.02;font-weight:900;letter-spacing:-.02em;margin-top:.9rem}
.pg-panel h2{font-size:clamp(1.8rem,3.4vw,3rem)}
.pg-panel p{color:var(--muted);font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.6;margin-top:1rem;max-width:44ch}
.pg-panel .num{font-family:var(--f-mono);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.pg-acts{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem}
.pg-steps{display:flex;gap:.4rem;flex-wrap:wrap;font-family:var(--f-display);font-weight:700;font-size:.8rem}
.pg-steps span{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .8rem;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--muted);transition:background .4s,color .4s,border-color .4s}
.pg-steps span i{width:7px;height:7px;border-radius:50%;background:var(--grey-2);transition:background .4s}
.pg-steps span.on{color:var(--ink);border-color:var(--accent)}
.pg-steps span.on i,.pg-steps span.done i{background:var(--accent)}
.pg-steps span.done{color:var(--ink)}
.pg-bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--grey-2);z-index:3}
.pg-bar i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--pp,0))}
.pg-svg{position:absolute;display:block}
@media (max-width:860px){
  .pg-panels{max-width:none;align-self:start;min-height:0;margin-top:.8rem}
  .pg-panel{top:0;transform:translateY(20px)}
  .pg-panel.on{transform:none}
  .pg-panel h1{font-size:2.05rem}.pg-panel h2{font-size:1.75rem;margin-top:.6rem}
  .pg-panel p{font-size:.96rem;margin-top:.6rem}
  .pg-acts{margin-top:1rem}
  .pg-steps{font-size:.7rem;gap:.3rem}.pg-steps span{padding:.3rem .55rem}
  .pg-steps span:not(.on) b{display:none}
}

/* ---------- HSE page ---------- */
.hs-hero{height:440vh;background:var(--grey)}
.hs-hero .pg-stage{background:radial-gradient(circle at 72% 50%,#fff 0,var(--grey) 62%)}
.hs-hero .pg-svg{right:max(16px,calc((100% - 1240px)/2 + 20px));top:50%;width:min(50vw,620px,calc(100% - 7rem));height:min(50vw,620px,calc(100% - 7rem));transform:translateY(-50%)}
#hsSvg .hz-box{fill:none;stroke:#8C939A;stroke-width:2;stroke-dasharray:6 5}
#hsSvg text{font-family:var(--f-display)}
@media (max-width:860px){
  .hs-hero{height:380vh}
  .hs-hero .pg-svg{left:50%;right:auto;top:auto;bottom:3.4rem;transform:translateX(-50%);width:min(94vw,calc(100vh - 78px - 21.5rem));height:min(94vw,calc(100vh - 78px - 21.5rem));width:min(94vw,calc(100dvh - 78px - 21.5rem));height:min(94vw,calc(100dvh - 78px - 21.5rem))}
}
.hs-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hs-intro .ph{aspect-ratio:4/3;max-width:100%}
.hs-quote{font-family:var(--f-display);font-weight:800;font-size:clamp(1.5rem,2.6vw,2.2rem);line-height:1.2;letter-spacing:-.015em}
.hs-quote .hl{color:var(--accent)}
.hs-policy{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:3rem;counter-reset:pol}
.hs-pol{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem 1.4rem 1.4rem;display:grid;gap:.8rem;align-content:start;overflow:hidden;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.hs-pol:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:var(--shadow)}
.hs-pol::before{counter-increment:pol;content:"0" counter(pol);position:absolute;right:1.1rem;top:.9rem;font-family:var(--f-display);font-weight:900;font-size:2.6rem;line-height:1;color:var(--grey-2)}
.hs-pol h3{font-size:1.12rem;padding-right:3rem}
.hs-pol p{color:var(--muted);font-size:.94rem}
.hs-pol .ico{width:46px;height:46px}
.hs-duty{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4.5rem);margin-top:3rem}
.hs-fig{position:sticky;top:110px;align-self:start;background:#fff;border:1px solid var(--line);border-radius:24px;padding:1.4rem;display:grid;gap:1rem;justify-items:center}
.hs-fig svg{width:100%;max-width:320px;height:auto;display:block}
.hs-fig .ppe{opacity:0;transform:translateY(-14px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.hs-fig .ppe.on{opacity:1;transform:none}
.hs-kit{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem}
.hs-kit span{font-family:var(--f-display);font-weight:700;font-size:.8rem;padding:.3rem .7rem;border-radius:999px;background:var(--grey);color:var(--muted);transition:background .4s,color .4s}
.hs-kit span.on{background:var(--tint);color:var(--accent-dk)}
.hs-duties{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.hs-duties li{min-height:min(46vh,380px);display:grid;align-content:center;gap:.6rem;padding:1.6rem 1.6rem 1.6rem 4.6rem;border-radius:var(--r);border:1px solid var(--line);background:#fff;position:relative;transition:border-color .4s,box-shadow .4s,opacity .4s;opacity:.55}
.hs-duties li.on{opacity:1;border-color:var(--accent);box-shadow:var(--shadow)}
.hs-duties li b{position:absolute;left:1.4rem;top:1.6rem;width:2.3rem;height:2.3rem;border-radius:50%;display:grid;place-items:center;background:var(--grey);font-family:var(--f-display);font-weight:900;transition:background .4s,color .4s}
.hs-duties li.on b{background:var(--accent);color:#fff}
.hs-duties h3{font-size:clamp(1.3rem,2.2vw,1.7rem)}
.hs-duties p{color:var(--muted)}
.hs-cert{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);gap:1rem;margin-top:3rem}
.hs-card{border-radius:var(--r);padding:1.6rem;display:grid;gap:.8rem;align-content:start;background:#fff;border:1px solid var(--line);text-decoration:none;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
a.hs-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:var(--shadow)}
.hs-card h3{font-size:1.2rem}
.hs-card p{color:var(--muted);font-size:.94rem}
.hs-card .link{margin-top:.2rem}
.hs-card.iso{background:var(--deep);color:#fff;border-color:var(--deep);grid-template-columns:auto minmax(0,1fr);align-items:center;gap:1.3rem}
.hs-card.iso p{color:var(--deep-muted)}
.hs-seal{width:118px;height:118px;flex-shrink:0}
.hs-reads{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:2.4rem}
.hs-read{display:grid;gap:.6rem;align-content:start;padding:1.3rem;border-radius:var(--r);background:#fff;border:1px solid var(--line);text-decoration:none;transition:border-color .3s,transform .4s var(--ease)}
.hs-read:hover{border-color:var(--accent);transform:translateY(-4px)}
.hs-read small{font-family:var(--f-mono);font-size:.72rem;color:var(--accent);letter-spacing:.06em;text-transform:uppercase}
.hs-read h3{font-size:1.02rem;line-height:1.35}
.hs-read span{font-family:var(--f-display);font-weight:700;font-size:.88rem;color:var(--accent)}
@media (max-width:1100px){.hs-policy{grid-template-columns:repeat(2,minmax(0,1fr))}.hs-reads{grid-template-columns:repeat(2,minmax(0,1fr))}.hs-cert{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.hs-card.iso{grid-column:1/-1}}
@media (max-width:860px){
  .hs-intro{grid-template-columns:minmax(0,1fr)}
  .hs-duty{grid-template-columns:minmax(0,1fr);gap:1rem}
  .hs-fig{top:86px;z-index:2;grid-template-columns:120px minmax(0,1fr);justify-items:start;align-items:center;padding:.8rem 1rem;border-radius:18px;box-shadow:0 14px 30px -24px rgba(0,0,0,.5)}
  .hs-fig svg{max-width:120px}
  .hs-kit{justify-content:flex-start}
  .hs-duties li{min-height:44vh;padding:1.3rem 1.2rem 1.3rem 4rem}
  .hs-duties li b{left:1rem;top:1.3rem}
}
@media (max-width:600px){.hs-policy,.hs-reads,.hs-cert{grid-template-columns:minmax(0,1fr)}.hs-card.iso{grid-template-columns:minmax(0,1fr)}.hs-seal{width:96px;height:96px}}


/* ---------- Sustainability page ---------- */
.su-hero{height:520vh;background:var(--grey)}
.su-hero .pg-stage{background:radial-gradient(circle at 72% 55%,#fff 0,#F6F8F5 34%,var(--grey) 70%)}
.su-hero .pg-svg{right:max(16px,calc((100% - 1240px)/2 - 10px));top:50%;width:min(46vw,650px,calc((100vh - 78px - 5rem) * 1.25));width:min(46vw,650px,calc((100dvh - 78px - 5rem) * 1.25));height:auto;aspect-ratio:800/640;transform:translateY(-50%);filter:drop-shadow(0 30px 50px rgba(30,60,40,.16))}
#suSvg text{font-family:var(--f-display)}
.su-hero .pg-panel .num{color:#2F9E6A}
.su-hero .pg-steps span.on{border-color:#2F9E6A}
.su-hero .pg-steps span.on i,.su-hero .pg-steps span.done i{background:#2F9E6A}
@media (max-width:860px){
  .su-hero{height:440vh}
  .su-hero .pg-steps{display:none}
  .su-hero .pg-svg{left:50%;right:auto;top:auto;bottom:3.2rem;transform:translateX(-50%);width:min(94vw,calc((100vh - 78px - 20rem) * 1.25));width:min(94vw,calc((100dvh - 78px - 20rem) * 1.25))}
}
.su-pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:3rem}
.su-pil{border-radius:var(--r);padding:1.5rem;background:#fff;border:1px solid var(--line);display:grid;gap:.75rem;align-content:start;position:relative;overflow:hidden;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.su-pil:hover{border-color:#2F9E6A;transform:translateY(-4px);box-shadow:var(--shadow)}
.su-pil .ico{background:#E8F5EE;color:#2F9E6A}
.su-pil h3{font-size:1.15rem}
.su-pil p{color:var(--muted);font-size:.94rem}
.su-pil q{quotes:none;font-family:var(--f-display);font-weight:800;color:var(--ink);font-size:.98rem}
@media (max-width:1100px){.su-pillars{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.su-pillars{grid-template-columns:minmax(0,1fr)}}
.hs-hero.in-page{height:400vh}
@media (max-width:860px){.hs-hero.in-page{height:360vh}}


/* ---------- HSE: two calm slides, no animation ---------- */
.hs2{min-height:calc(100vh - 78px);min-height:calc(100svh - 78px);display:grid;align-items:center;padding-block:clamp(1.6rem,4vh,3rem)}
.hs2--grey{background:var(--grey)}
.hs2-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.hs2-grid--b{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.hs2-intro{display:grid;gap:1rem;align-content:center}
.hs2-intro .crumbs{margin-bottom:.4rem}
.hs2 h1,.hs2 h2{margin:0}
.hs2 .lead{color:var(--muted);max-width:44ch;line-height:1.6}
.hs2 .hero-actions{margin-top:.6rem}
.hs2-list,.hs2-duties{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(1.5rem,3vw,3rem);border-top:1px solid var(--line)}
.hs2-list li,.hs2-duties li{display:grid;grid-template-columns:2.2rem minmax(0,1fr);gap:.25rem .5rem;padding:1.15rem 0;border-bottom:1px solid var(--line);align-content:start}
.hs2-list b,.hs2-duties b{font-family:var(--f-mono);font-weight:400;font-size:.78rem;color:var(--accent);padding-top:.2rem;grid-row:span 2}
.hs2-list h3,.hs2-duties h3{font-size:1rem;font-weight:600;line-height:1.35}
.hs2-list p,.hs2-duties p{grid-column:2;color:var(--muted);font-size:.9rem;line-height:1.5;margin:0}
.hs2-head{display:grid;gap:.8rem}
.hs2-duties{margin-top:1.8rem}
.hs2-side{display:grid;gap:1rem;align-content:center}
.hs2-ph{margin:0}
.hs2-ph .ph{aspect-ratio:16/10;border-radius:4px}
.hs2-ph figcaption{font-family:var(--f-mono);font-size:.72rem;color:var(--muted);margin-top:.5rem}
.hs2-iso{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.hs2-iso a{display:grid;gap:.2rem;border:1px solid var(--line);background:#fff;border-radius:4px;padding:.85rem 1rem;text-decoration:none;color:var(--ink);transition:border-color .25s}
.hs2-iso a:hover{border-color:var(--accent)}
.hs2-iso b{font-weight:600;font-size:.98rem}
.hs2-iso span{font-size:.82rem;color:var(--muted)}
.hs2-note{font-size:.88rem;color:var(--muted);line-height:1.55;margin:0}
@media (max-width:900px){.hs2{min-height:0;padding-block:2.2rem 2.8rem}.hs2-grid,.hs2-grid--b{grid-template-columns:minmax(0,1fr);gap:1.8rem}}
@media (max-width:600px){.hs2-list,.hs2-duties{grid-template-columns:minmax(0,1fr)}.hs2-list li,.hs2-duties li{padding:.85rem 0}.hs2-iso{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}


/* ---------- R&D: two centres, two heads ---------- */
.rdc-hero{padding-block:clamp(1.6rem,4vw,2.6rem) clamp(3.5rem,8vw,6rem)}
.rdc-hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:center;margin-top:clamp(2rem,6vh,4rem)}
.rdc-hero h1{font-size:clamp(2.4rem,4.8vw,4.4rem);line-height:1.05;margin-top:1rem}
.rdc-hero p{margin-top:1.2rem;max-width:40ch;font-size:clamp(1rem,1.3vw,1.15rem);color:var(--muted)}
.rdc-hero .ph{aspect-ratio:3/2;border-radius:4px}
.rdc-hero figcaption{font-family:var(--f-mono);font-size:.78rem;color:var(--muted);margin-top:.8rem}
@media (max-width:900px){.rdc-hero-grid{grid-template-columns:minmax(0,1fr)}}
.rdc-centre{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.rdc-centre + .rdc-centre{margin-top:clamp(4rem,9vw,7rem)}
.rdc-centre.flip{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.rdc-centre.flip .rdc-photo{order:2}
.rdc-photo{position:relative}
.rdc-photo .ph{aspect-ratio:4/5;border-radius:4px;background:#ECEEF1}
.rdc-photo .ph img{object-position:50% 20%}
.rdc-photo figcaption{margin-top:.9rem;display:grid;gap:.1rem}
.rdc-photo figcaption b{font-family:var(--f-display);font-weight:600;font-size:1.1rem}
.rdc-photo figcaption span{color:var(--muted);font-size:.92rem}
.rdc-text{display:grid;gap:1.4rem;align-content:center}
.rdc-no{font-family:var(--f-mono);font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.rdc-text h2{font-size:clamp(1.9rem,3.6vw,3.2rem);line-height:1.08}
.rdc-facts{display:grid;border-top:1px solid var(--line)}
.rdc-facts div{display:grid;grid-template-columns:9rem minmax(0,1fr);gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.rdc-facts dt{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding-top:.2rem}
.rdc-facts dd{margin:0;color:var(--ink)}
.rdc-lab{position:relative}
.rdc-lab .ph{aspect-ratio:21/9;border-radius:4px}
.rdc-lab figcaption{font-family:var(--f-mono);font-size:.78rem;color:var(--muted);margin-top:.8rem}
@media (max-width:900px){.rdc-centre,.rdc-centre.flip{grid-template-columns:minmax(0,1fr)}.rdc-centre.flip .rdc-photo{order:0}.rdc-photo .ph{aspect-ratio:4/4.4;max-width:460px}.rdc-lab .ph{aspect-ratio:4/3}.rdc-facts div{grid-template-columns:7rem minmax(0,1fr)}}
.rdc-pair{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;align-items:end}
.rdc-pair figure{margin:0}
.rdc-pair .ph{aspect-ratio:4/3;border-radius:4px}
.rdc-pair figure:last-child .ph{aspect-ratio:4/3}
.rdc-pair figcaption{font-family:var(--f-mono);font-size:.74rem;color:var(--muted);margin-top:.6rem}
/* reaction honeycomb */
.hexes{--w:clamp(92px,10.4vw,150px);--g:6px;margin-top:2.8rem;display:grid;justify-content:center}
.hx-row{display:flex;justify-content:center;gap:var(--g)}
.hx-row + .hx-row{margin-top:calc(var(--w) * -0.2887 + var(--g) * .866)}
.hx{width:var(--w);aspect-ratio:1/1.1547;position:relative;display:grid;place-items:center;text-align:center;flex:0 0 auto;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:#D3D8DE;transition:transform .5s var(--ease),background .3s;opacity:0;transform:scale(.8)}
.hx::before{content:"";position:absolute;inset:1.5px;clip-path:inherit;background:#fff;transition:background .3s}
.hx span{position:relative;padding:0 .7rem;font-weight:600;font-size:clamp(.72rem,.95vw,.95rem);line-height:1.2;color:var(--ink);hyphens:manual;transition:color .3s}
.hexes.in .hx{opacity:1;transform:none;transition:opacity .5s var(--ease) calc(var(--i) * 30ms),transform .6s var(--ease) calc(var(--i) * 30ms),background .3s}
.hx:hover{background:var(--accent)}.hx:hover::before{background:var(--accent)}.hx:hover span{color:#fff}
@media (prefers-reduced-motion:reduce){.hx{opacity:1;transform:none}}


/* ---------- home intro: four statements ---------- */
.in-hero{position:relative;height:100vh;height:100dvh;background:var(--bg)}
.in-stage{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;background:radial-gradient(circle at 70% 48%,#fff 0,#fff 30%,var(--grey) 75%)}
.in-stage::before{content:"";position:absolute;inset:0;background-image:radial-gradient(color-mix(in srgb,var(--muted) 22%,transparent) 1px,transparent 1.2px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 70%);-webkit-mask-image:linear-gradient(90deg,#000,transparent 70%);opacity:.6}
.in-canvas{position:absolute;right:0;top:0;width:58%;height:100%;display:block;touch-action:pan-y}
.in-copy{position:absolute;inset:0;pointer-events:none}
.in-copy .wrap{height:100%;display:grid;grid-template-rows:1fr auto;padding-top:calc(78px + env(safe-area-inset-top,0px));padding-bottom:clamp(1.2rem,3vh,2.2rem)}
.in-copy button,.in-copy a{pointer-events:auto}
.in-foot{display:none!important}
.in-copy .wrap{max-width:none;padding-inline:max(clamp(20px,4vw,72px), calc((100vw - 1240px)/2 - 120px))}
.in-list{position:relative;align-self:center;max-width:min(640px,50%);min-height:clamp(260px,40vh,380px)}
.in-st{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);visibility:hidden}
.in-st.on{visibility:visible}
.in-num{display:flex;align-items:center;gap:.8rem;font-family:var(--f-mono);font-size:.82rem;letter-spacing:.14em;color:var(--muted)}
.in-num b{color:var(--accent);font-weight:500}
.in-num i{width:40px;height:1.5px;background:var(--line)}
.in-st h2{margin-top:1rem;font-weight:900;letter-spacing:-.035em;line-height:.92}
.in-st h2 .a{display:block;font-size:clamp(1.6rem,3.2vw,2.9rem);font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-bottom:.15em}
.in-st h2 .b{display:block;font-size:clamp(3.2rem,6.6vw,6.8rem);color:var(--accent)}
.in-st p{margin-top:1.2rem;font-size:clamp(1.05rem,1.5vw,1.3rem);color:var(--muted);max-width:30ch;line-height:1.5}
.in-ln{display:block;overflow:hidden;padding-bottom:.06em}
.in-ln > span{display:block;transform:translateY(105%);transition:transform .9s var(--ease)}
.in-st p.in-ln > span{transition-delay:.12s}
.in-st h2 .b.in-ln > span{transition-delay:.06s}
.in-st.on .in-ln > span{transform:none}
.in-st.out .in-ln > span{transform:translateY(-105%);transition-duration:.6s;transition-delay:0s}
.in-foot{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap}
.in-keys{display:flex;gap:.4rem;flex-wrap:wrap}
.in-keys button{font:inherit;font-family:var(--f-display);font-weight:700;font-size:.86rem;border:1px solid var(--line);background:rgba(255,255,255,.8);color:var(--muted);border-radius:999px;padding:.5rem 1rem;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;transition:color .3s,border-color .3s,background .3s}
.in-keys button i{width:7px;height:7px;border-radius:50%;background:var(--grey-2);transition:background .3s,transform .3s}
.in-keys button:hover{color:var(--ink);border-color:var(--ink)}
.in-keys button.on{color:var(--ink);border-color:var(--accent);background:#fff}
.in-keys button.on i{background:var(--accent);transform:scale(1.3)}
.in-cue{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);transition:opacity .4s}
.in-cue i{width:22px;height:34px;border:1.5px solid var(--muted);border-radius:12px;position:relative}
.in-cue i::after{content:"";position:absolute;left:50%;top:6px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--accent);animation:wheel 1.6s ease-in-out infinite}
.in-cue.off{opacity:0}
.in-right{display:flex;align-items:center;gap:1.4rem}
.in-skip{font-family:var(--f-display);font-weight:700;font-size:.9rem;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem 0;border-bottom:1.5px solid transparent;transition:border-color .3s,color .3s}
.in-skip:hover{color:var(--accent);border-color:var(--accent)}
.in-pause{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.85);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:border-color .3s}
.in-pause:hover{border-color:var(--ink)}
.in-pause svg{width:14px;height:14px}
.in-pause .pl{display:none}.in-pause[aria-pressed="true"] .pl{display:block}.in-pause[aria-pressed="true"] .pa{display:none}
.in-keys button{position:relative;overflow:hidden}
.in-keys button.on::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:calc(var(--kp,0) * 100%);background:var(--accent)}
.in-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--grey-2)}
.in-bar i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(var(--ip,0))}
@media (max-width:860px){
  .in-canvas{left:0;right:0;width:100%;top:0;height:100%}
  .in-stage::before{mask-image:linear-gradient(180deg,transparent 40%,#000);-webkit-mask-image:linear-gradient(180deg,transparent 40%,#000)}
  .in-stage{background:radial-gradient(circle at 50% 26%,#fff 0,#fff 26%,var(--grey) 70%)}
  .in-list{max-width:none;align-self:end;min-height:min(36vh,290px);margin-bottom:.8rem}
  .in-st{top:auto;bottom:0;transform:none}
  .in-st h2 .b{font-size:clamp(3rem,15vw,4.6rem)}
  .in-st h2 .a{font-size:clamp(1.4rem,6.4vw,2rem)}
  .in-st p{margin-top:.8rem;font-size:1rem}
  .in-cue{display:none}
  .in-foot{flex-direction:column;align-items:stretch;gap:.8rem}.in-right{justify-content:space-between;gap:.8rem}.in-right .btn{flex:1;justify-content:center}
  .in-keys{gap:.3rem;flex-wrap:nowrap}.in-keys button{font-size:.72rem;padding:.38rem .58rem;gap:.35rem}.in-keys button i{width:6px;height:6px}
}
@media (min-width:861px){.in-canvas{left:0;right:0;width:100%}.in-copy .wrap{padding-bottom:0}.in-stage{background:radial-gradient(circle at 74% 54%,#fff 0,#fff 30%,var(--grey) 78%)}}
@media (prefers-reduced-motion:reduce){.in-ln > span{transition:none}.in-cue i::after{animation:none}}


/* ---------- Recruitment page ---------- */
.rc-hero{position:relative;overflow:hidden;background:var(--grey);min-height:calc(100vh - 78px);min-height:calc(100dvh - 78px);display:grid;align-items:center;padding-block:clamp(2rem,5vh,3.5rem)}
.rc-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(color-mix(in srgb,var(--muted) 22%,transparent) 1px,transparent 1.2px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 65%);-webkit-mask-image:linear-gradient(90deg,#000,transparent 65%);opacity:.6}
.rc-hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);align-items:center;width:100%}
.rc-hero h1{font-size:clamp(2.4rem,5vw,4.6rem);font-weight:900;line-height:1;letter-spacing:-.03em;margin-top:1rem}
.rc-hero .lead{color:var(--muted);font-size:var(--s1);margin-top:1.2rem;max-width:44ch}
.rc-hero .hero-actions{margin-top:1.8rem}
.rc-hero .crumbs{margin-bottom:1.6rem}
.rc-orbit{position:relative;aspect-ratio:1/1;width:min(100%,520px);justify-self:center}
.rc-ring{position:absolute;inset:0;border-radius:50%;border:1.5px dashed #C9CED3;animation:rcSpin 60s linear infinite}
.rc-ring.r2{inset:19%;border-style:solid;border-color:var(--line);animation-duration:44s;animation-direction:reverse}
.rc-core{position:absolute;inset:33%;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;text-align:center;box-shadow:0 30px 60px -30px rgba(242,130,32,.8)}
.rc-core b{display:block;font-family:var(--f-display);font-weight:900;font-size:clamp(1.3rem,2.4vw,2rem);line-height:1}
.rc-core span{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;opacity:.9}
.rc-core::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px solid var(--accent);opacity:.3;animation:rcPulse 2.6s ease-out infinite}
.rc-chip{position:absolute;left:50%;top:50%;width:0;height:0;animation:rcSpin 60s linear infinite}
.rc-chip > span{position:absolute;transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(var(--rad) * -1)) rotate(calc(var(--a) * -1));white-space:nowrap}
.rc-chip > span > span{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-display);font-weight:700;font-size:.88rem;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.5rem .95rem;box-shadow:0 12px 30px -20px rgba(0,0,0,.45);animation:rcSpin 60s linear infinite reverse}
.rc-chip > span > span i{width:8px;height:8px;border-radius:50%;background:var(--accent)}
@keyframes rcSpin{to{transform:rotate(360deg)}}
@keyframes rcPulse{from{transform:scale(.9);opacity:.5}to{transform:scale(1.25);opacity:0}}
.rc-why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:3rem}
.rc-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;display:grid;gap:.75rem;align-content:start;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.rc-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:var(--shadow)}
.rc-card b.big{font-family:var(--f-display);font-weight:900;font-size:2.2rem;line-height:1;color:var(--accent)}
.rc-card h3{font-size:1.15rem}
.rc-card p{color:var(--muted);font-size:.94rem}
.rc-teams{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:3rem}
.rc-team{position:relative;border-radius:var(--r);padding:1.4rem;background:#fff;border:1px solid var(--line);display:grid;gap:.6rem;align-content:start;overflow:hidden;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:border-color .3s,box-shadow .4s,transform .4s var(--ease)}
.rc-team::after{content:"Apply →";position:absolute;right:1.1rem;bottom:1rem;font-family:var(--f-display);font-weight:700;font-size:.82rem;color:var(--accent);opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .3s}
.rc-team:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-4px)}
.rc-team:hover::after,.rc-team:focus-visible::after{opacity:1;transform:none}
.rc-team h3{font-size:1.08rem}
.rc-team p{color:var(--muted);font-size:.9rem;padding-bottom:1.2rem}
.rc-team .ico{width:46px;height:46px}
.rc-team.wide{grid-column:span 1;background:var(--deep);color:#fff;border-color:var(--deep)}
.rc-team.wide p{color:var(--deep-muted)}
.rc-open{margin-top:2.4rem;display:grid;gap:.8rem}
.rc-job{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr)) auto;gap:1rem;align-items:center;padding:1.2rem 1.4rem;border-radius:var(--r);background:#fff;border:1px solid var(--line)}
.rc-job h3{font-size:1.1rem}
.rc-job span{color:var(--muted);font-size:.9rem}
.rc-none{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1.2rem;align-items:center;padding:1.5rem;border-radius:var(--r);background:#fff;border:1.5px dashed #C9CED3}
.rc-none .ico{width:52px;height:52px}
.rc-none h3{font-size:1.15rem}
.rc-none p{color:var(--muted);font-size:.94rem;margin-top:.25rem}
.rc-path{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem;margin-top:3.4rem}
.rc-path::before,.rc-path::after{content:"";position:absolute;left:28px;right:28px;top:27px;height:3px;background:var(--grey-2);border-radius:3px}
.rc-path::after{background:var(--accent);transform-origin:left;transform:scaleX(var(--rp,0));transition:transform .2s linear}
.rc-step{position:relative;z-index:1;display:grid;gap:.6rem;align-content:start}
.rc-step .dot{width:56px;height:56px;border-radius:50%;background:#fff;border:2px solid var(--grey-2);display:grid;place-items:center;color:var(--muted);transition:background .4s,border-color .4s,color .4s,transform .4s var(--ease)}
.rc-step .dot svg{width:26px;height:26px}
.rc-step.on .dot{background:var(--accent);border-color:var(--accent);color:#fff;transform:scale(1.08)}
.rc-step small{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.1em;color:var(--accent)}
.rc-step h3{font-size:1.1rem}
.rc-step p{color:var(--muted);font-size:.92rem}
.rc-step{opacity:.5;transition:opacity .4s}
.rc-step.on{opacity:1}
.rc-site{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin-top:2.4rem}
.rc-site figure{margin:0}
.rc-site .ph{aspect-ratio:4/5;max-width:100%}
.rc-site figcaption{font-family:var(--f-mono);font-size:.74rem;color:var(--muted);margin-top:.5rem}
.rc-form-wrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.rc-form{background:#fff;border:1px solid var(--line);border-radius:22px;padding:clamp(1.3rem,3vw,2rem);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 1rem;box-shadow:var(--shadow)}
.rc-form .full{grid-column:1/-1}
.rc-form label{display:grid;gap:.4rem;font-family:var(--f-display);font-weight:700;font-size:.9rem}
.rc-form label em{font-style:normal;color:var(--accent)}
.rc-form input,.rc-form select,.rc-form textarea{font:inherit;font-size:1rem;font-weight:400;font-family:var(--f-body);padding:.8rem .9rem;border:1.5px solid var(--line);border-radius:12px;background:var(--grey);color:var(--ink);width:100%;min-width:0;transition:border-color .2s,background .2s}
.rc-form textarea{min-height:110px;resize:vertical}
.rc-form input:focus,.rc-form select:focus,.rc-form textarea:focus{outline:none;border-color:var(--accent);background:#fff}
.rc-form [aria-invalid="true"]{border-color:#E5484D;background:#FFF5F5}
.rc-form .note{font-size:.84rem;color:var(--muted)}
.rc-msg{font-size:.9rem;border-radius:10px;padding:.7rem .9rem;display:none}
.rc-msg.err{display:block;background:#FFF0F0;color:#B42318}
.rc-msg.ok{display:block;background:#ECF8F1;color:#1E7A4D}
.rc-aside{display:grid;gap:1.2rem}
.rc-aside ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.rc-aside li{display:flex;gap:.7rem;align-items:flex-start}
.rc-aside li::before{content:"";width:22px;height:22px;flex-shrink:0;border-radius:50%;margin-top:2px;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6.5 11.5l3 3 6-6.5' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
@media (max-width:1100px){.rc-why,.rc-teams{grid-template-columns:repeat(2,minmax(0,1fr))}.rc-job{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}.rc-job .btn{justify-self:start}}
@media (max-width:860px){
  .rc-hero .wrap,.rc-form-wrap{grid-template-columns:minmax(0,1fr)}
  .rc-orbit{width:min(72vw,300px);order:-1;margin-block:1rem .6rem}
  .rc-chip > span > span{font-size:.76rem;padding:.38rem .7rem}
  .rc-path{grid-template-columns:minmax(0,1fr);gap:1.6rem;padding-left:0}
  .rc-path::before,.rc-path::after{left:27px;right:auto;top:28px;bottom:28px;width:3px;height:auto}
  .rc-path::after{transform:scaleY(var(--rp,0));transform-origin:top}
  .rc-step{grid-template-columns:56px minmax(0,1fr);column-gap:1rem;row-gap:.2rem}
  .rc-step .dot{grid-row:span 3}
  .rc-site{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rc-none{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:600px){.rc-why,.rc-teams,.rc-form{grid-template-columns:minmax(0,1fr)}.rc-job{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.rc-ring,.rc-chip,.rc-chip > span > span,.rc-core::after{animation:none}}


/* ---------- About: vision / mission / values panels ---------- */
.vm{position:relative}
.vm-panel{position:sticky;top:calc(78px + env(safe-area-inset-top,0px));height:calc(100vh - 78px);height:calc(100dvh - 78px);overflow:hidden;color:#fff;display:grid;align-items:end}
.vm-panel .vm-bg{position:absolute;inset:0;transform-origin:50% 30%;will-change:transform}
.vm-panel .vm-bg img{width:100%;height:100%;object-fit:cover;display:block}
.vm-panel .vm-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,24,.25) 0%,rgba(20,22,24,.55) 45%,rgba(20,22,24,.88) 100%)}
.vm-panel .vm-blur img{filter:blur(6px);transform:scale(1.06)}
.vm-panel .vm-dim{position:absolute;inset:0;background:#141618;opacity:0;pointer-events:none}
.vm-in{position:relative;padding-block:clamp(2rem,7vh,5rem);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(1.5rem,5vw,5rem);align-items:end}
.vm-lab{display:grid;gap:.6rem}
.vm-lab small{font-family:var(--f-mono);font-size:.8rem;letter-spacing:.14em;color:#FDBF94}
.vm-lab b{font-family:var(--f-display);font-weight:900;font-size:clamp(3.2rem,9vw,8.4rem);line-height:.86;letter-spacing:-.04em;text-transform:uppercase}
.vm-lab b span{color:var(--accent)}
.vm-txt{display:grid;gap:1rem;max-width:56ch}
.vm-txt p{font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.55;color:rgba(255,255,255,.9)}
.vm-txt p.lead{font-family:var(--f-display);font-weight:800;font-size:clamp(1.35rem,2.3vw,2rem);line-height:1.25;color:#fff}
.vm-vals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.vm-vals div{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.07);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:14px;padding:1rem 1.1rem;display:grid;gap:.25rem}
.vm-vals b{font-family:var(--f-display);font-size:1.05rem}
.vm-vals span{font-size:.88rem;color:rgba(255,255,255,.75)}
.vm-vals i{font-style:normal;font-family:var(--f-mono);font-size:.72rem;color:#FDBF94}
@media (max-width:860px){.vm-in{grid-template-columns:minmax(0,1fr);gap:1.2rem}.vm-vals{grid-template-columns:minmax(0,1fr)}.vm-vals div{padding:.75rem .9rem}.vm-txt p{font-size:1rem}}
@media (max-width:860px) and (max-height:760px){.vm-vals span{display:none}}

/* ---------- About: the people behind Lifechem ---------- */
.pp{padding-block:clamp(4.5rem,9vw,7.5rem);overflow:hidden}
.pp-grid{display:grid;grid-template-columns:minmax(0,.36fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem)}
.pp-left{display:grid;grid-template-rows:auto auto 1fr auto;gap:1.6rem;padding-top:.4rem;min-width:0}
.pp-count{font-family:var(--f-mono);font-size:.9rem;letter-spacing:.08em;color:var(--muted)}
.pp-count b{color:var(--ink);font-weight:500}
.pp-ring{width:68px;height:68px;justify-self:end;cursor:pointer;border:0;background:none;padding:0}
.pp-ring svg{width:100%;height:100%;display:block;transform:rotate(-90deg)}
.pp-ring .tr{fill:none;stroke:var(--line);stroke-width:2}
.pp-ring .pr{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round}
.pp-ring .dt{fill:var(--accent)}
.pp-bio{align-self:end;display:grid;gap:.9rem;transition:opacity .35s,transform .45s var(--ease)}
.pp-bio.swap{opacity:0;transform:translateY(12px)}
.pp-bio p{color:var(--muted);font-size:1.02rem;line-height:1.65}
.pp-more{font-family:var(--f-mono);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;justify-self:start;border-bottom:1.5px solid var(--ink);padding-bottom:.2rem;transition:color .3s,border-color .3s}
.pp-more:hover{color:var(--accent);border-color:var(--accent)}
.pp-right{min-width:0}
.pp-head{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;flex-wrap:wrap}
.pp-head h2{font-size:clamp(2.4rem,5.6vw,5rem);font-weight:900;line-height:.92;letter-spacing:-.035em;text-transform:uppercase}
.pp-head p{color:var(--muted);max-width:52ch;margin-top:1rem}
.pp-nav{display:flex;align-items:center;gap:1rem;font-family:var(--f-mono);font-size:.84rem;letter-spacing:.08em;text-transform:uppercase}
.pp-nav button{font:inherit;background:none;border:0;padding:.4rem 0;cursor:pointer;color:var(--ink);transition:color .3s}
.pp-nav button:hover{color:var(--accent)}
.pp-nav i{width:1px;height:14px;background:var(--line)}
.pp-line{position:relative;height:1.5px;background:var(--line);margin-top:1.6rem}
.pp-line i{position:absolute;left:0;top:-.5px;height:2.5px;background:var(--ink);transition:transform .7s var(--ease),width .4s}
.pp-track-wrap{margin-top:2.6rem;overflow:visible;clip-path:inset(-20px -100vw -20px 0)}
.pp-track{display:flex;gap:clamp(.9rem,2vw,1.6rem);transition:transform .9s var(--ease);will-change:transform}
.pp-card{flex:0 0 clamp(220px,24vw,320px);aspect-ratio:4/5;position:relative;border-radius:4px;overflow:hidden;background:#fff;cursor:pointer;border:0;padding:0}
.pp-card canvas,.pp-card img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}
.pp-card img{opacity:0;transition:opacity .6s}
.pp-card.on img{opacity:1}
.pp-card .ini{position:absolute;left:12px;bottom:12px;font-family:var(--f-display);font-weight:900;font-size:.85rem;color:#fff;background:var(--ink);border-radius:999px;padding:.3rem .65rem;opacity:0;transition:opacity .4s}
.pp-card.on .ini{opacity:1}
.pp-card.has-photo .ini{display:none}
.pp-card img{background:#ECEEF1}
.pp-card.join .ini{background:var(--accent)}
.pp-foot{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-top:1.6rem;flex-wrap:wrap}
.pp-name{transition:opacity .35s,transform .45s var(--ease)}
.pp-name.swap{opacity:0;transform:translateY(10px)}
.pp-name h3{font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:900;letter-spacing:-.01em;text-transform:uppercase}
.pp-name span{display:block;margin-top:.35rem;color:var(--ink)}
.pp-join{font-family:var(--f-mono);font-size:.84rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--ink);border:1.5px solid var(--ink);border-radius:999px;padding:.85rem 1.4rem;transition:background .3s,color .3s}
.pp-join:hover{background:var(--ink);color:#fff}
@media (max-width:900px){
  .pp-grid{grid-template-columns:minmax(0,1fr)}
  .pp-left{order:2;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:1rem 1.2rem}
  .pp-count{align-self:center}.pp-ring{width:52px;height:52px;justify-self:end}
  .pp-bio{grid-column:1/-1}.pp-more{grid-column:1/-1}
  .pp-card{flex-basis:68vw}
}

/* Our journey on the brand-orange photo band */
.hjourney{background:var(--accent);color:#fff}
.hj-sticky{position:relative;isolation:isolate}
.hjourney .hj-bg{position:absolute;inset:0;border-radius:0;background:var(--accent);z-index:-1}
.hjourney .hj-bg::before,.hjourney .hj-bg::after{display:none}
.hjourney .hj-bg img{opacity:.2;mix-blend-mode:luminosity}
.hjourney .eyebrow{color:#fff}
.hjourney .sec-head h2{color:#fff}
.hjourney .sec-head h2 .hl{color:#FFE2C7}
.hjourney .hj-head > p{color:rgba(255,255,255,.85)}
.hjourney .hj-line{background:rgba(255,255,255,.3)}
.hjourney .hj-line i{background:#fff}
.hjourney .mile{color:var(--ink)}
.hjourney .mile.goal{color:#fff}
.hjourney .mile{border-color:transparent;box-shadow:0 20px 40px -26px rgba(0,0,0,.45)}
.hjourney .mile::before{border-color:#fff;background:var(--accent)}
.hjourney .mile.goal::before{border-color:var(--ink);background:#fff}
.hjourney .mile.lit{border-color:#fff;box-shadow:0 26px 50px -24px rgba(0,0,0,.55)}


/* ---------- About: full-bleed hero + our story ---------- */
.ab-hero{padding-top:0}
.ab-hero .ab-media{margin-top:0;height:calc(100vh - 78px - 36px);height:calc(100dvh - 78px - 36px);min-height:520px;max-height:920px}
.ab-hero .hero-clip{clip-path:none!important}
.ab-hero .slide img{transform:scale(1.08)}
.ab-hero .slide.on img{transform:scale(1)}
.ab-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(18,20,22,.78) 0%,rgba(18,20,22,.45) 48%,rgba(18,20,22,.1) 100%),linear-gradient(0deg,rgba(18,20,22,.7) 0%,transparent 45%)}
.ab-hero .ab-copy{max-width:none;padding-inline:clamp(20px,4vw,72px)}
.ab-copy{position:absolute;inset:0;z-index:2;display:grid;grid-template-rows:auto 1fr auto;padding-block:clamp(1.2rem,3vh,2rem) clamp(1.4rem,4vh,2.6rem);color:#fff;left:0;right:0}
.ab-copy .crumbs{color:rgba(255,255,255,.7)}.ab-copy .crumbs a{color:#fff;opacity:.9}.ab-copy .crumbs span{color:rgba(255,255,255,.85)}
.ab-main{align-self:end;max-width:600px;padding-bottom:clamp(3rem,13vh,9rem)}
.ab-kick{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--f-mono);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;opacity:.85}
.ab-kick::before{content:"";width:34px;height:2px;background:var(--accent)}
.ab-main h1{font-size:clamp(2rem,3.6vw,3.3rem);line-height:1.08;letter-spacing:-.03em;margin-top:1.1rem;color:#fff}
.ab-main h1 .hl{color:var(--accent)}
.ab-main p{margin-top:1rem;font-size:clamp(.95rem,1.1vw,1.05rem);color:rgba(255,255,255,.85);max-width:52ch}
.ab-main .hero-actions{margin-top:1.4rem}
.ab-main .btn:not(.btn--o){border-color:#fff;color:#fff}.ab-main .btn:not(.btn--o):hover{background:#fff;color:var(--ink)}
.ab-foot{display:flex;justify-content:flex-end;align-items:end}
.ab-places{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;font-family:var(--f-mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.ab-places span{display:inline-flex;align-items:center;gap:.55rem}
.ab-places span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.ab-story{padding-block:clamp(4.5rem,9vw,7.5rem)}
.ab-story-grid{display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,1fr);gap:clamp(1.5rem,5vw,5rem)}
.ab-story-lead{font-family:var(--f-display);font-size:clamp(1.6rem,3.2vw,2.8rem);line-height:1.18;letter-spacing:-.02em;color:var(--ink)}
.ab-story-lead .hl{color:var(--accent)}
.ab-story-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 2.4rem;margin-top:2rem}
.ab-story-body p{color:var(--muted);font-size:1.02rem}
.ab-photos{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.25fr;gap:.8rem;margin-top:clamp(2.5rem,5vw,4rem);align-items:end}
.ab-photos figure{margin:0}
.ab-photos .ph{max-width:100%;border-radius:14px}
.ab-photos figure:nth-child(1) .ph,.ab-photos figure:nth-child(4) .ph{aspect-ratio:4/5}
.ab-photos figure:nth-child(2) .ph,.ab-photos figure:nth-child(3) .ph{aspect-ratio:3/4}
.ab-photos figcaption{font-family:var(--f-mono);font-size:.74rem;color:var(--muted);margin-top:.55rem}
@media (max-width:900px){.ab-story-grid{grid-template-columns:minmax(0,1fr)}.ab-story-body{grid-template-columns:minmax(0,1fr)}.ab-photos{grid-template-columns:repeat(2,minmax(0,1fr))}.ab-photos .ph{aspect-ratio:4/5!important}}
@media (max-width:600px){.ab-hero .ab-media{height:calc(100svh - 78px);min-height:560px}.ab-shade{background:linear-gradient(0deg,rgba(18,20,22,.88) 0%,rgba(18,20,22,.55) 55%,rgba(18,20,22,.25) 100%)}.ab-main{align-self:end;padding-bottom:clamp(2rem,8vh,4rem)}.ab-places{font-size:.68rem;gap:.35rem 1rem}.ab-places span:nth-child(3){display:none}.ab-main h1{font-size:clamp(2.1rem,9vw,2.6rem)}.ab-main p{margin-top:1rem}.ab-main .hero-actions{margin-top:1.2rem}.ab-foot .dots{display:none}}

#page-story .crumbs{white-space:nowrap;flex-wrap:nowrap}
#page-story .ab-story{padding-top:clamp(2.5rem,6vw,4.5rem)}


/* ---------- CDMO page ---------- */
.cd-hero{height:820vh;background:var(--grey)}
.cd-hero .pg-stage{background:radial-gradient(circle at 72% 55%,#fff 0,#FBF6F1 34%,var(--grey) 70%)}
.cd-hero .pg-svg{right:max(16px,calc((100% - 1240px)/2 - 10px));top:50%;width:min(46vw,650px,calc((100vh - 78px - 5rem) * 1.25));width:min(46vw,650px,calc((100dvh - 78px - 5rem) * 1.25));height:auto;aspect-ratio:800/640;transform:translateY(-50%);filter:drop-shadow(0 30px 50px rgba(60,40,20,.14))}
#cdSvg text{font-family:var(--f-display)}
@media (max-width:860px){
  .cd-hero{height:700vh}
  .cd-hero .pg-steps{display:none}
  .cd-hero .pg-svg{left:50%;right:auto;top:auto;bottom:3.2rem;transform:translateX(-50%);width:min(94vw,calc((100vh - 78px - 20rem) * 1.25));width:min(94vw,calc((100dvh - 78px - 20rem) * 1.25))}
}
.cd-offer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:3rem}
.cd-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;display:grid;gap:.75rem;align-content:start;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.cd-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:var(--shadow)}
.cd-card b.n{font-family:var(--f-mono);font-weight:400;font-size:.78rem;letter-spacing:.1em;color:var(--accent)}
.cd-card h3{font-size:1.2rem}
.cd-card p{color:var(--muted);font-size:.95rem}
.cd-card.dark{background:var(--deep);color:#fff;border-color:var(--deep)}
.cd-card.dark p{color:var(--deep-muted)}
.cd-chem{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:2rem}
.cd-chem a{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;font-family:var(--f-display);font-weight:700;font-size:.95rem;padding:.7rem 1.1rem;border-radius:999px;background:#fff;border:1.5px solid var(--line);transition:border-color .3s,color .3s}
.cd-chem a:hover{border-color:var(--accent);color:var(--accent)}
.cd-chem a i{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.cd-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;margin-top:3rem}
.cd-num{border-top:2px solid var(--accent);padding-top:1.1rem;display:grid;gap:.4rem}
.cd-num b{font-family:var(--f-display);font-weight:500;font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1;color:var(--ink)}
.cd-num span{color:var(--muted)}
.cd-cta{background:var(--deep);color:#fff;border-radius:28px;padding:clamp(1.8rem,5vw,3.6rem);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2rem;align-items:center}
.cd-cta h2{font-size:var(--s4)}
.cd-cta p{color:var(--deep-muted);margin-top:1rem;max-width:48ch}
.cd-cta .hero-actions{justify-content:flex-end}
@media (max-width:1000px){.cd-offer{grid-template-columns:repeat(2,minmax(0,1fr))}.cd-nums{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.cd-offer,.cd-cta{grid-template-columns:minmax(0,1fr)}.cd-cta .hero-actions{justify-content:flex-start}}

.cd-count{display:flex;align-items:center;gap:.8rem;font-family:var(--f-mono);font-size:.85rem;letter-spacing:.12em;color:var(--muted)}
.cd-count b{color:var(--accent);font-weight:500;font-size:1.05rem}
.cd-count i{width:48px;height:1px;background:var(--line)}


/* ---------- Infrastructure ---------- */
.inf-table-wrap{margin-top:2.6rem;overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:4px}
.inf-table{width:100%;border-collapse:collapse;min-width:560px}
.inf-table th,.inf-table td{text-align:left;padding:1rem 1.2rem;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.inf-table thead th{font-family:var(--f-mono);font-weight:400;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.inf-table tbody th{font-weight:500;color:var(--ink)}
.inf-table td{color:var(--ink)}
.inf-table td b{font-weight:600;color:var(--accent)}
.inf-table tr:last-child th,.inf-table tr:last-child td{border-bottom:0}
.inf-more{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;margin-top:2.4rem}
.inf-more div{border-top:2px solid var(--accent);padding-top:1rem;display:grid;gap:.35rem}
.inf-more b{font-family:var(--f-display);font-weight:500;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1}
.inf-more span{color:var(--muted);font-size:.92rem}
.inf-hint{font-family:var(--f-mono);font-size:.8rem;color:var(--muted)}
.inf-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense;gap:.9rem;margin-top:2.6rem}
.inf-g{margin:0;min-width:0}
.inf-g.wide{grid-column:span 2}
.inf-g .ph{display:block;width:100%;aspect-ratio:4/3;border-radius:4px;border:0;padding:0;cursor:zoom-in}
.inf-g.wide .ph{aspect-ratio:8/3}
.inf-g .ph img{transition:transform .8s var(--ease)}
.inf-g .ph:hover img{transform:scale(1.04)}
.inf-g figcaption{font-family:var(--f-mono);font-size:.74rem;color:var(--muted);margin-top:.55rem}
.inf-lb{position:fixed;inset:0;z-index:80;background:rgba(14,16,18,.94);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;padding:clamp(16px,4vw,48px)}
.inf-lb[hidden]{display:none}
.inf-lb figure{margin:0;display:grid;gap:.8rem;justify-items:center;min-width:0}
.inf-lb img{max-width:100%;max-height:80vh;border-radius:4px;object-fit:contain}
.inf-lb figcaption{font-family:var(--f-mono);font-size:.82rem;color:rgba(255,255,255,.75)}
.inf-lb button{background:none;border:1px solid rgba(255,255,255,.3);color:#fff;width:48px;height:48px;border-radius:50%;font-size:1.2rem;cursor:pointer}
.inf-lb button:hover{border-color:#fff}
.inf-lb-x{position:absolute;top:clamp(12px,3vw,28px);right:clamp(12px,3vw,28px)}
@media (max-width:900px){.inf-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.inf-g.wide .ph{aspect-ratio:16/7}.inf-more{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.inf-lb{grid-template-columns:minmax(0,1fr)}.inf-lb-nav{display:none}}

.inf-head{padding-block:clamp(1.6rem,4vw,2.6rem) clamp(1.5rem,3vw,2.5rem)}
.inf-head h1{font-size:clamp(2.4rem,4.8vw,4.2rem);line-height:1.05;margin-top:1rem;max-width:18ch}
.inf-head p{margin-top:1.1rem;max-width:56ch;color:var(--muted);font-size:clamp(1rem,1.3vw,1.12rem)}
.inf-head .inf-pills{margin-top:1.6rem}
.inf-pills{display:flex;flex-wrap:wrap;gap:.6rem}
.inf-pills span{border:1px solid var(--accent);background:var(--tint);color:var(--accent-dk);border-radius:2px;padding:.55rem 1rem;font-weight:600;font-size:.92rem}
#inf-photos{padding-top:clamp(1rem,2vw,1.6rem)}
#inf-photos .inf-gallery{margin-top:0}
.inf-2col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;margin-top:2.4rem;align-items:start}
.inf-2col h3{font-family:var(--f-mono);font-weight:400!important;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.8rem}
.inf-spec{min-width:0!important}
.inf-spec tbody th{color:var(--accent-dk)!important;font-weight:500}
.inf-spec thead th{background:var(--deep);color:#fff!important}
@media (max-width:900px){.inf-2col{grid-template-columns:minmax(0,1fr)}}


/* ---------- QC page ---------- */
.qc-hero{height:540vh;background:var(--grey)}
.qc-hero .pg-stage{background:radial-gradient(circle at 72% 55%,#fff 0,#F3F7F5 34%,var(--grey) 70%)}
.qc-inst{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem;margin-top:3rem}
.qc-inst .cd-card h3{font-size:1.15rem}
.qc-table td:last-child{font-family:var(--f-mono);font-size:.82rem;color:var(--muted);white-space:nowrap}
.qc-table td{color:var(--muted)}
.qc-how{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,5vw,4rem);align-items:center}
.qc-how .ph{border-radius:var(--r);aspect-ratio:4/3}
.qc-pts{display:grid;gap:1.2rem;margin-top:2rem}
.qc-pts div{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:start}
.qc-pts b.n{font-family:var(--f-mono);font-weight:400;font-size:.8rem;color:var(--accent);padding-top:.3rem}
.qc-pts h3{font-size:1.15rem}.qc-pts p{color:var(--muted);margin-top:.3rem}
@media (max-width:1000px){.qc-inst{grid-template-columns:repeat(2,minmax(0,1fr))}.qc-how{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.qc-inst{grid-template-columns:minmax(0,1fr)}}

.qc-hero .pg-svg{right:max(16px,calc((100% - 1240px)/2 - 10px));top:50%;width:min(46vw,650px,calc((100vh - 78px - 5rem) * 1.25));width:min(46vw,650px,calc((100dvh - 78px - 5rem) * 1.25));height:auto;aspect-ratio:800/640;transform:translateY(-50%);filter:drop-shadow(0 30px 50px rgba(40,50,70,.14))}
#qcSvg text{font-family:var(--f-display)}
@media (max-width:860px){.qc-hero{height:480vh}.qc-hero .pg-steps{display:none}.qc-hero .pg-svg{left:50%;right:auto;top:auto;bottom:3.2rem;transform:translateX(-50%);width:min(94vw,calc((100vh - 78px - 20rem) * 1.25));width:min(94vw,calc((100dvh - 78px - 20rem) * 1.25))}}
/* certifications (shared) */
.certs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:2.6rem}
.cert{background:#fff;border:1px solid var(--line);border-radius:6px;padding:clamp(1.6rem,3vw,2.4rem) 1.4rem;display:grid;justify-items:center;text-align:center;gap:.7rem;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.cert:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:var(--shadow)}
.cert svg{width:88px;height:88px}
.cert h3{font-size:clamp(1.4rem,2.2vw,1.9rem);font-weight:500!important;letter-spacing:-.01em;margin-top:.4rem}
.cert b{color:var(--accent-dk);font-weight:600;font-size:.95rem}
.cert p{color:var(--muted);font-size:.88rem;max-width:30ch}
@media (max-width:860px){.certs{grid-template-columns:minmax(0,1fr)}}

/* ---------- QC v4: one-screen overview, photos, tests and instruments ---------- */
.qc2{min-height:calc(100vh - 78px);min-height:calc(100svh - 78px);display:grid;align-items:center;padding-block:clamp(1.4rem,3.5vh,2.6rem)}
.qc2-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,5vw,5rem);align-items:end}
.qc2-top .crumbs{margin-bottom:1rem}
.qc2 h1,.qc3 h2{margin:.7rem 0 0}
.qc2 .lead,.qc3 .lead{color:var(--muted);line-height:1.6;max-width:52ch;margin:0}
.qc2-facts{display:flex;flex-wrap:wrap;gap:.5rem 2rem;margin-top:1.1rem}
.qc2-facts div{display:grid}
.qc2-facts b{font-weight:500;font-size:clamp(1.3rem,1.9vw,1.7rem);color:var(--ink);line-height:1.1}
.qc2-facts span{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.qc2-photos{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:.7rem;margin-top:clamp(1.4rem,4vh,2.4rem)}
.qc2-photos figure{margin:0;position:relative}
.qc2-photos .ph{height:clamp(220px,42vh,420px);border-radius:4px}
.qc2-photos .ph img{width:100%;height:100%;object-fit:cover}
.qc2-photos figcaption{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.06em;color:var(--muted);margin-top:.5rem}
.qc3{padding-block:clamp(2.6rem,6vh,4rem)}
.qc3-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);margin-top:1.6rem;align-items:start}
.qc3 h3{font-family:var(--f-mono);font-weight:400!important;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 .6rem}
.qc-tests{width:100%;border-collapse:collapse;font-size:.9rem}
.qc-tests th,.qc-tests td{text-align:left;padding:.42rem 0;border-bottom:1px solid var(--line);vertical-align:baseline}
.qc-tests th{font-weight:500;color:var(--ink);padding-right:1rem}
.qc-tests td{color:var(--muted)}
.qc-tests tr:first-child th,.qc-tests tr:first-child td{border-top:1px solid var(--ink)}
.qc-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem 2.4rem;border-top:1px solid var(--ink);padding-top:1rem}
.qc-group h4{font-size:.95rem;font-weight:600;margin:0 0 .45rem;display:flex;justify-content:space-between;gap:1rem}
.qc-group h4 i{font-style:normal;font-family:var(--f-mono);font-size:.72rem;color:var(--accent);font-weight:400}
.qc-group ul{list-style:none;margin:0;padding:0;display:grid;gap:.18rem}
.qc-group li{font-size:.9rem;color:var(--muted);padding-left:1rem;position:relative}
.qc-group li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:1px;background:var(--accent)}
@media (max-width:900px){.qc2{min-height:0;padding-block:1.6rem 2.4rem}.qc2-top,.qc3-grid{grid-template-columns:minmax(0,1fr);gap:1.2rem}
  .qc2-photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.qc2-photos .wide{grid-column:1/-1}.qc2-photos .ph{height:auto;aspect-ratio:4/5}.qc2-photos .wide .ph{aspect-ratio:16/9}}
@media (max-width:600px){.qc2-photos{grid-template-columns:repeat(3,minmax(0,1fr))}.qc2-photos .ph{aspect-ratio:3/4}.qc2-photos figcaption{font-size:.6rem;letter-spacing:0}.qc-groups{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem 1.2rem}.qc-group li{font-size:.82rem}.qc-tests{font-size:.84rem}}

.qc3-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,5vw,5rem);align-items:end}
.qc-tiles{list-style:none;margin:clamp(1.4rem,3vh,2rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}
@media (min-width:1101px){.qc-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}.qc-tiles li.qc-cta{grid-column:span 5!important}}
.qc-tiles li{background:#fff;border:1px solid var(--line);border-radius:4px;padding:.85rem .95rem .95rem;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto 1fr;gap:.15rem .6rem;align-content:start;transition:border-color .25s,transform .35s var(--ease)}
.qc-tiles li:hover{border-color:var(--accent);transform:translateY(-2px)}
.qc-tiles .n{font-family:var(--f-mono);font-size:.68rem;color:var(--accent)}
.qc-tiles .g{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);justify-self:end;align-self:center}
.qc-tiles h3{grid-column:1/-1;font-family:var(--f-display)!important;font-size:1rem!important;font-weight:600!important;letter-spacing:-.005em!important;text-transform:none!important;color:var(--ink)!important;line-height:1.3;margin:.55rem 0 .15rem;overflow-wrap:anywhere}
.qc-tiles p{grid-column:1/-1;font-size:.82rem;color:var(--muted);line-height:1.45;margin:0}
.qc-tiles li.qc-cta{grid-column:span 1;padding:0;background:var(--deep);border-color:var(--deep)}
.qc-cta a{display:grid;align-content:space-between;gap:.6rem;height:100%;padding:.95rem 1.1rem;color:#fff;text-decoration:none}
.qc-cta .g{justify-self:start!important;color:#FDBF94!important}
.qc-cta b{font-family:var(--f-display);font-weight:500;font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.3}
.qc-cta .go{font-size:.86rem;color:var(--accent)}
.qc-tiles li.qc-cta:hover{border-color:var(--accent)}
@media (max-width:900px){.qc3-head{grid-template-columns:minmax(0,1fr);gap:.8rem}}
@media (max-width:600px){.qc-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.qc-tiles li{padding:.7rem .75rem}.qc-tiles h3{font-size:.88rem!important}.qc-tiles p{font-size:.76rem}.qc-tiles .g{display:none}}

/* QC hero v5: room list + large photo viewer */
.qc2-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.qc2-text .crumbs{margin-bottom:1rem}
.qc2-text .lead{margin-top:.9rem!important;max-width:42ch}
.qc-rooms{list-style:none;margin:1.6rem 0 0;padding:0;border-top:1px solid var(--line)}
.qc-rooms li{border-bottom:1px solid var(--line)}
.qc-rooms button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:2.2rem minmax(0,1fr);gap:.6rem;padding:.75rem 0;position:relative}
.qc-rooms button::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--accent);transition:width .45s var(--ease)}
.qc-rooms button[aria-selected="true"]::after{width:100%}
.qc-rooms .n{font-family:var(--f-mono);font-size:.72rem;color:var(--muted);padding-top:.2rem}
.qc-rooms b{display:block;font-weight:500;font-size:1rem;color:var(--muted);transition:color .25s}
.qc-rooms small{display:block;font-size:.84rem;color:var(--muted);line-height:1.45;max-height:0;overflow:hidden;opacity:0;transition:max-height .45s var(--ease),opacity .35s,margin .35s}
.qc-rooms button[aria-selected="true"] .n{color:var(--accent)}
.qc-rooms button[aria-selected="true"] b,.qc-rooms button:hover b{color:var(--ink)}
.qc-rooms button[aria-selected="true"] small{max-height:3em;opacity:1;margin-top:.2rem}
.qc-rooms button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.qc2-facts{display:flex;flex-wrap:wrap;gap:.5rem 2.2rem;margin-top:1.4rem}
.qc-view{position:relative;height:min(72vh,640px);border-radius:4px;overflow:hidden;background:#E9EBED}
.qc-view figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .8s var(--ease)}
.qc-view figure.on{opacity:1}
.qc-view .ph{position:absolute;inset:0;border-radius:0}
.qc-view .ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 6s linear}
.qc-view figure.on .ph img{transform:scale(1)}
.qc-view figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.4rem 1.2rem 1rem;background:linear-gradient(180deg,rgba(20,22,24,0),rgba(20,22,24,.62));color:#fff;font-weight:500;font-size:1rem;display:flex;gap:.9rem;align-items:baseline}
.qc-view figcaption span{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;color:#FDBF94}
.qc-view-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.25)}
.qc-view-bar i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(0)}
@media (max-width:900px){.qc2-grid{grid-template-columns:minmax(0,1fr);gap:1.4rem}.qc-view{order:-1;height:auto;aspect-ratio:4/3.4}.qc2-text .crumbs{margin-bottom:.6rem}}
@media (prefers-reduced-motion:reduce){.qc-view .ph img{transition:none;transform:none}}


/* ---------- Events ---------- */
.ev-head{padding-block:clamp(1.6rem,4vw,2.6rem) clamp(1.5rem,3vw,2.4rem)}
.ev-head h1{font-size:clamp(2.4rem,4.8vw,4.2rem);line-height:1.05;margin-top:1rem}
.ev-head p{margin-top:1.1rem;max-width:56ch;color:var(--muted);font-size:clamp(1rem,1.3vw,1.12rem)}
.ev-stats{display:flex;flex-wrap:wrap;gap:2.4rem;margin-top:1.8rem}
.ev-stats div{display:grid;gap:.2rem}
.ev-stats b{font-family:var(--f-display);font-weight:500;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1}
.ev-stats span{font-size:.88rem;color:var(--muted)}
.ev-next{background:var(--deep);color:#fff;border-radius:6px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);position:relative;isolation:isolate}
.ev-next::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 85% 20%,rgba(242,130,32,.35),transparent 45%),radial-gradient(circle at 10% 110%,rgba(242,130,32,.18),transparent 40%)}
.ev-next-body{padding:clamp(1.8rem,4vw,3.2rem);display:grid;gap:1.2rem;align-content:start}
.ev-pill{display:inline-flex;align-items:center;gap:.55rem;justify-self:start;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;border:1px solid rgba(255,255,255,.25);border-radius:2px;padding:.4rem .7rem}
.ev-pill i{width:8px;height:8px;border-radius:50%;background:#3DDC84;box-shadow:0 0 0 0 rgba(61,220,132,.6);animation:evPulse 1.8s infinite}
.ev-pill.past i{background:var(--deep-muted);animation:none}
@keyframes evPulse{70%{box-shadow:0 0 0 9px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
.ev-next h2{font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.08;color:#fff}
.ev-meta{display:grid;border-top:1px solid var(--deep-line)}
.ev-meta div{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--deep-line)}
.ev-meta dt{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--deep-muted);padding-top:.2rem}
.ev-meta dd{margin:0}
.ev-meta .stand{color:#FFB877;font-weight:600}
.ev-acts{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.4rem}
.ev-acts .btn:not(.btn--o){border-color:rgba(255,255,255,.5);color:#fff}.ev-acts .btn:not(.btn--o):hover{background:#fff;color:var(--ink)}
.ev-side{padding:clamp(1.8rem,4vw,3.2rem);border-left:1px solid var(--deep-line);display:grid;align-content:center;gap:1.6rem}
.ev-cd-lab{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--deep-muted)}
.ev-cd{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}
.ev-cd div{background:rgba(255,255,255,.06);border:1px solid var(--deep-line);border-radius:4px;padding:1rem .4rem;text-align:center;display:grid;gap:.3rem}
.ev-cd b{font-family:var(--f-display);font-weight:500;font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1;font-variant-numeric:tabular-nums}
.ev-cd span{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--deep-muted)}
.ev-badge{display:flex;align-items:center;gap:1rem}
.ev-badge b{font-family:var(--f-mono);font-weight:500;font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:.06em;color:var(--accent);border:1px solid var(--accent);border-radius:2px;padding:.3rem .8rem}
.ev-badge span{color:var(--deep-muted);font-size:.9rem;line-height:1.45}
.ev-list{list-style:none;margin:2.6rem 0 0;padding:0;position:relative;display:grid;gap:1rem}
.ev-list::before{content:"";position:absolute;left:5.5rem;top:.6rem;bottom:.6rem;width:1px;background:var(--line)}
.ev-item{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:2rem;align-items:start;position:relative}
.ev-item::before{content:"";position:absolute;left:calc(5.5rem - 5px);top:1.6rem;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid var(--accent)}
.ev-yr{font-family:var(--f-display);font-weight:500;font-size:1.6rem;line-height:1;padding-top:1.2rem;color:var(--ink)}
.ev-card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:1.4rem 1.5rem;margin-left:1.5rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.4rem 1.5rem;transition:border-color .3s,box-shadow .4s}
.ev-card:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.ev-card h3{font-size:1.15rem}
.ev-card .when{font-family:var(--f-mono);font-size:.8rem;color:var(--accent-dk);white-space:nowrap}
.ev-card p{grid-column:1/-1;color:var(--muted);font-size:.93rem}
.ev-card .where{grid-column:1/-1;font-size:.9rem;color:var(--ink)}
.ev-photos{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;margin-top:.6rem}
.ev-photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
@media (max-width:900px){.ev-next{grid-template-columns:minmax(0,1fr)}.ev-side{border-left:0;border-top:1px solid var(--deep-line)}.ev-list::before{left:.3rem}.ev-item{grid-template-columns:minmax(0,1fr);gap:.4rem;padding-left:1.4rem}.ev-item::before{left:-.05rem;top:.45rem}.ev-yr{padding-top:0;font-size:1.3rem}.ev-card{margin-left:0;grid-template-columns:minmax(0,1fr)}.ev-meta div{grid-template-columns:6rem minmax(0,1fr)}}
@media (max-width:420px){.ev-cd b{font-size:1.6rem}.ev-cd span{font-size:.6rem}}


/* ---------- minimal header: logo + 3-dot menu ---------- */
.head .nav,.head > .wrap > .btn{display:none!important}
body[data-page="welcome"] .topbar,body[data-page="home"] .topbar{display:none}
body[data-page="welcome"] .head{position:fixed;left:0;right:0;top:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
body[data-page="welcome"] .head .hc-link{display:none}
body[data-page="welcome"] .menu-btn{background:rgba(255,255,255,.85)}
body[data-page="welcome"] .menu-btn[aria-expanded="true"]{background:var(--accent);border-color:var(--accent)}
body[data-page="welcome"] #contact,body[data-page="welcome"] footer{display:none}
body[data-page="about"] #contact{display:none}
html:has(body[data-page="welcome"]),body[data-page="welcome"]{overflow:hidden;height:100%}
body[data-page="welcome"]:has(.drawer.open) .logo-img{filter:brightness(0) invert(1);transition:filter .4s}
.menu-btn{display:inline-flex!important;width:52px;height:52px;border:1.5px solid var(--line);gap:5px;transition:border-color .3s,background .3s,transform .3s var(--ease)}
.menu-btn:hover{border-color:var(--ink)}
.menu-btn i{width:6px;height:6px;border-radius:50%;background:var(--ink);transition:transform .45s var(--ease),background .3s,opacity .3s}
.menu-btn i:nth-child(2){background:var(--accent)}
.menu-btn[aria-expanded="true"]{background:var(--ink);border-color:var(--ink)}
.menu-btn[aria-expanded="true"] i{background:#fff}
.menu-btn{position:relative}
.menu-btn::before,.menu-btn::after{content:"";position:absolute;left:50%;top:50%;width:20px;height:2.4px;margin:-1.2px 0 0 -10px;border-radius:2px;background:#fff;transform:rotate(0) scaleX(0);transition:transform .45s var(--ease) .1s}
.menu-btn[aria-expanded="true"]::before{transform:rotate(45deg) scaleX(1)}
.menu-btn[aria-expanded="true"]::after{transform:rotate(-45deg) scaleX(1)}
.menu-btn[aria-expanded="true"] i{opacity:0;transform:scale(.3)}
.head-cta{display:inline-flex;align-items:center;gap:.8rem}
.head-cta .hc-link{font-family:var(--f-display);font-weight:700;font-size:.92rem;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}
.head-cta .hc-link::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)}
@media (max-width:600px){.head-cta .hc-link{display:none}}
.drawer{background:var(--deep);color:#fff;padding:calc(78px + env(safe-area-inset-top,0px) + clamp(1.5rem,5vh,3rem)) 0 2rem;transform:none;clip-path:circle(0 at calc(100% - 52px) 39px);transition:clip-path .8s var(--ease),visibility 0s .8s;display:block}
.drawer.open{clip-path:circle(150vmax at calc(100% - 52px) 39px);transition:clip-path .8s var(--ease),visibility 0s}
.drawer{--accent:#F28220;--accent-dk:#D96E12}
.drawer .btn--o{background:#F28220;border-color:#F28220}
.drawer .btn--o:hover{background:#D96E12;border-color:#D96E12}
body:has(.drawer.open) .menu-btn[aria-expanded="true"]{background:#F28220!important;border-color:#F28220!important}
.drawer .dr-in{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:start;min-height:100%}
.drawer nav{display:grid;counter-reset:dr}
.drawer nav a{counter-increment:dr;display:flex;align-items:baseline;gap:1.2rem;font-family:var(--f-display);font-weight:800;font-size:clamp(1.25rem,2.5vw,2rem);line-height:1.15;letter-spacing:-.02em;text-decoration:none;color:#fff;padding-block:.5rem;border-bottom:1px solid var(--deep-line);opacity:0;transform:translateY(24px);transition:opacity .5s var(--ease),transform .6s var(--ease),color .25s}
.drawer nav a::before{content:"0" counter(dr);font-family:var(--f-mono);font-weight:400;font-size:.8rem;letter-spacing:.1em;color:var(--deep-muted);min-width:2.2rem}
.drawer nav a::after{content:"→";margin-left:auto;font-size:.6em;color:var(--accent);opacity:0;transform:translateX(-10px);transition:opacity .25s,transform .25s}
.drawer nav a:hover,.drawer nav a[aria-current]{color:var(--accent)}
.drawer nav a:hover::after{opacity:1;transform:none}
.drawer.open nav a{opacity:1;transform:none}
.drawer.open nav a:nth-child(1){transition-delay:.18s}.drawer.open nav a:nth-child(2){transition-delay:.22s}.drawer.open nav a:nth-child(3){transition-delay:.26s}.drawer.open nav a:nth-child(4){transition-delay:.3s}
.drawer.open nav a:nth-child(5){transition-delay:.34s}.drawer.open nav a:nth-child(6){transition-delay:.38s}.drawer.open nav a:nth-child(7){transition-delay:.42s}.drawer.open nav a:nth-child(8){transition-delay:.46s}.drawer.open nav a:nth-child(9){transition-delay:.5s}
.drawer .dr-in{grid-template-columns:minmax(0,1fr)!important;justify-items:center;align-content:center;min-height:100%}
.drawer nav{width:min(620px,100%)}
.drawer nav a{justify-content:center;position:relative;text-align:center}
.drawer nav a::before{display:none}
.drawer nav a::after{position:absolute;right:0;top:50%;margin:0;translate:0 -50%}
.drawer nav a.dr-cap::after{font-size:1.1em}
.drawer nav .dr-sub a{padding:.45rem 0;gap:.6rem}
.drawer nav .dr-sub a::before{display:block;margin-right:.55rem!important}
.drawer nav .dr-sub a::after{display:none}.drawer.open nav a:nth-child(10){transition-delay:.54s}
.drawer nav a.dr-cap::after{content:"+";opacity:1;transform:none;font-size:.75em;transition:transform .35s var(--ease)}
.drawer nav a.dr-cap[aria-expanded="true"]::after{transform:rotate(45deg)}
.drawer nav:has(.dr-sub a[aria-current]) a.dr-cap{color:var(--accent)}
.drawer nav .dr-sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.drawer nav .dr-sub.open{grid-template-rows:1fr}
.drawer nav .dr-sub a{transition:opacity .5s var(--ease),transform .6s var(--ease),color .25s,visibility 0s}
.drawer nav .dr-sub:not(.open) a{visibility:hidden;transition:visibility 0s .45s}
.drawer nav .dr-sub>div{overflow:hidden;display:grid}
.drawer nav .dr-sub a{counter-increment:none;font-size:clamp(1rem,1.5vw,1.2rem);padding:.45rem 0 .45rem 3.4rem;color:rgba(255,255,255,.78);border-bottom:1px dashed var(--deep-line)}
.drawer nav .dr-sub a::before{content:"";min-width:0;width:6px;height:6px;border-radius:50%;background:var(--accent);align-self:center;margin-right:-.4rem}
.drawer nav .dr-sub a:hover,.drawer nav .dr-sub a[aria-current]{color:var(--accent)}
.dr-side{display:grid;gap:1.6rem;opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease) .1s,transform .7s var(--ease) .1s}
.drawer.open .dr-side{opacity:1;transform:none;transition-delay:.4s}
.dr-side h4{font-family:var(--f-mono);font-weight:400;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.6rem}
.dr-side p,.dr-side a{color:var(--deep-muted);font-size:.9rem;text-decoration:none;line-height:1.6}
.dr-side a:hover{color:#fff}
.dr-side .dr-big{font-family:var(--f-display);font-weight:800;font-size:clamp(1.05rem,1.5vw,1.3rem);color:#fff;line-height:1.2}
.dr-side .dr-big .hl{color:var(--accent)}
.dr-links{display:grid;gap:.2rem}
@media (max-width:860px){.drawer .dr-in{grid-template-columns:minmax(0,1fr);gap:2rem}.drawer nav a{font-size:1.3rem;padding-block:.55rem}.dr-side .dr-big{display:none}}
@media (prefers-reduced-motion:reduce){.drawer,.drawer.open{transition:none}}

/* ---------- medium-weight headings ---------- */
h1,h2,h1 *,h2 *,.vm-lab b,.vm-lab b *,.pp-name h3,.statement p,.statement p *,.tk-row,.drawer nav a{font-weight:500!important}
h1,h2{letter-spacing:-.02em}

html,body{margin:0}
/* ===================== v2 · European style ===================== */
:root{--edge:max(clamp(16px,4vw,40px),calc((100vw - 1240px) / 2 + 40px));--r:6px;--shadow:0 16px 40px -24px rgba(44,48,52,.28)}
/* header: logo left, only the 3-dot menu in the right corner */
.topbar{display:none!important}
.head{background:rgba(255,255,255,.94)}
.head .wrap{max-width:none;padding-inline:var(--edge)}
.head .logo-img{height:40px}
.hc-link{display:none!important}
.menu-btn{width:48px;height:48px;border-width:1px}
@media (max-width:600px){.head .logo-img{height:34px}.menu-btn{width:44px;height:44px}}
/* welcome: copy shares the logo's left edge; type like the reference */
.in-copy .wrap{padding-inline:var(--edge)!important}
.in-st h2 .a,.in-st h2 .b{font-size:clamp(2.6rem,5.2vw,4.8rem);font-weight:400!important;letter-spacing:-.015em;line-height:1.06;margin:0}
.in-st h2 .a{color:var(--ink)}
.in-st p{font-size:clamp(1.05rem,1.55vw,1.4rem);letter-spacing:.06em;color:#3A3F45;max-width:30ch;margin-top:1.4rem;line-height:1.5}
.in-num{font-size:.78rem}
@media (max-width:860px){.in-st h2 .a,.in-st h2 .b{font-size:clamp(2.3rem,10.5vw,3.2rem)}.in-st p{font-size:1rem;letter-spacing:.04em}}
/* menu: smaller, quieter type */
.drawer .dr-in{max-width:none;padding-inline:var(--edge)}
.drawer nav{width:min(520px,100%)}
.drawer nav a{font-size:clamp(1rem,1.35vw,1.22rem)!important;padding-block:.6rem!important;letter-spacing:.01em}
.drawer nav .dr-sub a{font-size:clamp(.86rem,1vw,.95rem)!important;padding-block:.42rem!important}
@media (max-width:860px){.drawer nav a{font-size:1.02rem!important;padding-block:.55rem!important}}
.drawer.open nav a:nth-child(10){transition-delay:.54s}.drawer.open nav a:nth-child(11){transition-delay:.58s}.drawer.open nav a:nth-child(12){transition-delay:.62s}
/* typography: lighter weights, quieter labels */
h3,h4{font-weight:600!important;letter-spacing:-.005em}
.prow h3,.ptab-text h3,.pp-head h2{font-weight:500!important}
.eyebrow{font-family:var(--f-mono);font-weight:400;font-size:.74rem;letter-spacing:.18em}
.eyebrow::before{width:22px;height:1px}
.sb b,.num b,.mile b,.cd-num b,.inf-stats b,.spec b,.since b,.why-card b,.up .big,.pl-count,.badge b,.pp-name h3{font-weight:500!important}
.crumbs{font-weight:500;font-size:.85rem}
/* buttons and pills: square, thin, calm */
.btn{border-radius:2px;border-width:1px;font-weight:500;letter-spacing:.02em}
.chipbar button,.ptabs button,.pg-steps span,.cd-chem a,.facts span,.in-keys button,.chip{border-radius:2px!important;border-width:1px}
.ptabs{border-radius:4px}
.search input{border-radius:2px!important;border-width:1px!important}
/* cards: small radius, hairline borders, softer shadow */
.cd-card,.witem,.why-item,.up,.prod,.card,.mile,.unit,.in-unit,.inf-unit,.hs-card,.contact-card,details,.trust-item,.centre,.cd-cta{border-radius:var(--r)!important}
.ph{border-radius:4px}
.cd-cta{border-radius:4px!important}
/* ===================== v3 · live touches ===================== */
.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#2FBF71;box-shadow:0 0 0 0 rgba(47,191,113,.55);animation:livePulse 1.8s infinite;margin-right:.5rem;vertical-align:1px}
@keyframes livePulse{70%{box-shadow:0 0 0 8px rgba(47,191,113,0)}100%{box-shadow:0 0 0 0 rgba(47,191,113,0)}}
.up .up-when{font-family:var(--f-mono);font-size:.76rem;color:var(--muted)}
.up-live{border-color:var(--accent)!important}
.up-live .big{color:var(--accent)!important}
.wel-live{position:absolute;left:var(--edge);bottom:clamp(1.2rem,4vh,2.4rem);pointer-events:auto;display:inline-flex;align-items:center;gap:.2rem;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:2px;padding:.65rem 1rem;text-decoration:none;color:var(--ink);font-size:.88rem;transition:border-color .3s}
.wel-live:hover{border-color:var(--accent)}
.wel-live b{font-weight:600}
.wel-live em{font-style:normal;color:var(--accent-dk);font-weight:600}
@media (max-width:860px){.wel-live{left:var(--edge);right:var(--edge);bottom:auto;top:calc(78px + 8px);font-size:.74rem;padding:.45rem .7rem;max-width:none}.wel-live b{font-weight:600}}
@media (prefers-reduced-motion:reduce){.live-dot{animation:none}}
.ct-card a.v{font-size:clamp(.92rem,1.1vw,1.02rem);overflow-wrap:anywhere}
/* ===================== v4 · smaller headlines, one screen per section ===================== */
:root{--s3:clamp(1.12rem,1.45vw,1.35rem);--s4:clamp(1.45rem,2.1vw,2rem);--s5:clamp(1.75rem,2.7vw,2.55rem)}
/* page titles */
.panel-hero h1,.pg-panel h1,.rc-hero h1,.rdc-hero h1,.inf-head h1,.ev-head h1,.ctx h1,.p-hero h1,.hero h1,.ab-main h1,.b-art h1,.hs2 h1,.qc2 h1{font-size:var(--s5)!important;line-height:1.12!important;letter-spacing:-.015em!important}
/* section titles */
.panel-step h2,.pg-panel h2,.rdc-text h2,.ev-next h2,.pp-head h2,.sec-head h2,.knowmore h2,.spot-body h2,.cd-cta h2,.custom h2,.cta h2,.b-rel>h2,.hs2 h2,.ctx-form h2,.ctx-ihead h2{font-size:var(--s4)!important;line-height:1.16!important;letter-spacing:-.01em!important}
.pp-head h2{text-transform:none!important}
.statement p{font-size:clamp(1.3rem,2.2vw,2rem)!important;line-height:1.3!important}
.vm-txt p.lead{font-size:clamp(1.1rem,1.6vw,1.45rem)!important;font-weight:500!important}
.vm-txt p{font-size:clamp(.95rem,1.15vw,1.08rem)!important}
.in-st h2 .a,.in-st h2 .b{font-size:clamp(1.9rem,3.1vw,2.9rem)!important}
@media (max-width:860px){.in-st h2 .a,.in-st h2 .b{font-size:clamp(1.7rem,7.6vw,2.2rem)!important}}
.sec-head p,.lead{font-size:clamp(.98rem,1.15vw,1.08rem)}
/* tighter vertical rhythm so a section fits one window */
.sec{padding-block:clamp(2.8rem,5.5vw,4.6rem)!important}
.sec-head{gap:.7rem!important}
/* infrastructure: whole gallery in one window, captions over the photos */
@media (min-width:1101px){.inf-gallery{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:.7rem!important}}
@media (min-width:601px) and (max-width:1100px){.inf-gallery{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:.6rem!important}}
@media (max-width:600px){.inf-gallery{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.4rem!important}.inf-g.wide{grid-column:span 3}.inf-g.wide .ph{aspect-ratio:3/1.15!important}.inf-g figcaption{display:none}}
.inf-g{position:relative}
.inf-g figcaption{position:absolute;left:0;right:0;bottom:0;margin:0!important;padding:1.4rem .6rem .45rem;background:linear-gradient(180deg,rgba(20,22,24,0),rgba(20,22,24,.7));color:#fff!important;font-size:.66rem!important;border-radius:0 0 4px 4px;pointer-events:none;opacity:0;transition:opacity .3s}
.inf-g:hover figcaption,.inf-g:focus-within figcaption{opacity:1}
@media (hover:none){.inf-g figcaption{opacity:1}}
.inf-g.wide .ph{aspect-ratio:8/3}
.inf-spec th,.inf-spec td{padding:.58rem 1rem!important}
.inf-2col{margin-top:1.6rem!important}
.inf-head{padding-bottom:clamp(1rem,2vw,1.6rem)!important}
/* R&D: both centres side by side in one window */
@media (min-width:901px){
  #rd-centres .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,4vw,4.5rem);align-items:start}
  #rd-centres .rdc-centre,#rd-centres .rdc-centre.flip{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(1.2rem,2vw,2rem);align-items:start}
  #rd-centres .rdc-centre + .rdc-centre{margin-top:0}
  #rd-centres .rdc-centre.flip .rdc-photo{order:0}
  #rd-centres .rdc-photo .ph{aspect-ratio:4/5;max-height:52vh}
}
#rd-centres .rdc-photo{margin:0}
#rd-centres .rdc-text{gap:1rem}
#rd-centres .rdc-text h2{font-size:var(--s3)!important;line-height:1.25!important}
#rd-centres .rdc-facts div{grid-template-columns:6rem minmax(0,1fr);padding:.7rem 0;font-size:.94rem}
@media (max-width:900px){#rd-centres .rdc-centre{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)!important;gap:1rem;align-items:start}#rd-centres .rdc-centre.flip .rdc-photo{order:0}#rd-centres .rdc-photo .ph{aspect-ratio:4/5!important;max-width:none}#rd-centres .rdc-centre + .rdc-centre{margin-top:2.2rem}#rd-centres .rdc-facts div{grid-template-columns:minmax(0,1fr);gap:.1rem;padding:.5rem 0;font-size:.86rem}#rd-centres .rdc-photo figcaption{display:none}}
/* events: the timeline fits one window */
.ev-list{margin-top:1.6rem!important;gap:.6rem!important}
.ev-card{padding:.95rem 1.3rem!important;gap:.25rem 1.5rem!important}
.ev-card h3{font-size:1.05rem!important}
.ev-yr{font-size:1.3rem!important;padding-top:.95rem!important}
.ev-item::before{top:1.25rem!important}
/* recruitment: compact team cards and form */
.rc-teams{margin-top:1.8rem!important;gap:.8rem!important}
.rc-team{padding:1.1rem 1.2rem!important;gap:.45rem!important}
.rc-team .ico{width:38px!important;height:38px!important}
.rc-team p{padding-bottom:.8rem!important;font-size:.88rem!important}
.rc-open{margin-top:1.6rem!important}
.rc-form{border-radius:6px!important;gap:.8rem 1rem!important;box-shadow:none!important}
.rc-form input,.rc-form select,.rc-form textarea{padding:.65rem .85rem!important;border-radius:2px!important;border-width:1px!important}
.rc-form textarea{min-height:84px!important}
.rc-form label{font-weight:600!important;font-size:.86rem!important}
#rc-teams{padding-block:clamp(2.4rem,4.4vw,3.4rem)!important}
.rc-team p{padding-bottom:.5rem!important}
/* shorter laptop screens: tighter rhythm so each section still fits */
@media (min-width:901px) and (max-height:820px){
  .sec{padding-block:clamp(2rem,4vw,3rem)!important}
  #rc-teams{padding-block:2rem!important}
  .rc-team p{font-size:.84rem!important}
  .rc-form textarea{min-height:64px!important}
  .rc-form{gap:.6rem 1rem!important}
  .ev-card{padding:.75rem 1.2rem!important}
  .ev-card p{font-size:.86rem!important}
}
/* about: team carousel fits one window */
.pp{padding-block:clamp(2.8rem,5.5vw,4.6rem)!important}
.pp-track-wrap{margin-top:1.8rem!important}
.pp-line{margin-top:1.2rem!important}
@media (min-width:901px){.pp-card{flex-basis:clamp(200px,min(24vw,42vh),320px)!important}}
@media (min-width:901px) and (max-height:820px){.pp{padding-block:2.2rem!important}#rc-teams .sec-head p{display:none}}
@media (min-width:901px) and (max-height:820px){.rc-open{margin-top:1rem!important}}
@media (max-width:860px){.panels>.panel{padding-inline:16px}}
/* phones: card groups become a swipe row, so each section stays about one screen tall */
@media (max-width:700px){
  .wgrid,#liveUp,.certs,.cd-offer,.su-pillars,.rc-why{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;gap:.75rem!important;margin-inline:-16px!important;padding:0 16px 6px!important;scroll-padding-inline:16px;scrollbar-width:none;grid-template-columns:none!important}
  .wgrid::-webkit-scrollbar,#liveUp::-webkit-scrollbar,.certs::-webkit-scrollbar,.cd-offer::-webkit-scrollbar,.su-pillars::-webkit-scrollbar,.rc-why::-webkit-scrollbar{display:none}
  .wgrid>*,#liveUp>*,.certs>*,.cd-offer>*,.su-pillars>*,.rc-why>*{flex:0 0 82%!important;max-width:82%;scroll-snap-align:start;grid-column:auto!important;grid-row:auto!important}
  .rc-teams{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.5rem!important}
  .rc-team{padding:.85rem!important}.rc-team h3{font-size:.95rem!important}.rc-team p{font-size:.8rem!important;padding-bottom:.2rem!important}.rc-team::after{display:none}
}
.pp-name h3{font-size:clamp(1.25rem,1.9vw,1.7rem)!important;letter-spacing:0!important}
/* compact footer */
footer{padding-block:clamp(2.2rem,4vw,3rem) 1.1rem!important}
.foot-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.3fr)!important;gap:2rem!important}
footer h4{margin-bottom:.6rem!important;font-size:.92rem!important}
footer p{font-size:.86rem!important;margin-top:.8rem!important;line-height:1.55}
footer ul{gap:.1rem!important;font-size:.86rem!important}
footer ul a{padding-block:.14rem!important}
footer ul li b{color:#fff;font-weight:500;margin-right:.35rem}
.foot-grid > div:nth-child(2) ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.2rem}
.foot-bottom{margin-top:1.6rem!important;padding-top:.9rem!important;font-size:.78rem!important}
@media (max-width:900px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:600px){.foot-grid{grid-template-columns:minmax(0,1fr)!important;gap:1.4rem!important}}