/* Layout: sticky utility+nav header, full-bleed navy bands alternating with light steel sections; inner pages = blueprint banner + 2-col body with sticky sidebar */
:root{
  --bg:#f4f8fc; --surface:#ffffff; --ink:#0d1e33; --muted:#526a85; --line:#d5e2ef;
  --navy:#0b2647; --navy-2:#12345e; --on-navy:#eaf2fb; --on-navy-muted:#a9c0da;
  --accent:#0a6fd6; --accent-ink:#ffffff; --accent-soft:#e2effc; --accent-2:#38b6ff;
  --sky1:#8cc8f5; --sky2:#e9f5ff; --orb:#fff4c9; --orb-glow:rgba(255,244,200,.35); --star-op:0;
  --far:#bcd6ee; --st:#4a6d93; --st2:#36597f; --band:#e2edf8; --win:#d7e6f5; --win-glow:none; --line-c:#2c4b70;
  --steam:#ffffff; --steam-op:.75; --ground:#5d82a9; --sea:#6fb0e6; --wave:#d6ecfd; --flame:#ffb21e; --flame2:#fff1a8; --avi-op:.25;
  --hero-ink:#0b2647; --hero-muted:#33557c;
  --blueprint:#0f3864; --bp-line:rgba(170,205,245,.22); --bp-ink:#cfe2f8;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --body:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1200px; --r:4px;
  --shadow:0 1px 2px rgba(12,36,64,.06),0 8px 24px rgba(12,36,64,.08);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#07111e; --surface:#0e1b2c; --ink:#e6eef8; --muted:#93a8c2; --line:#1d3049;
  --navy:#081a30; --navy-2:#0f2643; --on-navy:#e6eef8; --on-navy-muted:#93a8c2;
  --accent:#3da5ff; --accent-ink:#031120; --accent-soft:#0d2a48; --accent-2:#7fd0ff;
  --sky1:#020814; --sky2:#0d2647; --orb:#e8eef8; --orb-glow:rgba(190,215,255,.16); --star-op:.9;
  --far:#0b1c32; --st:#0b192c; --st2:#0e2038; --band:#1b3556; --win:#ffcf6b; --win-glow:drop-shadow(0 0 3px rgba(255,190,90,.9)); --line-c:#1e3a5f;
  --steam:#9fb8d6; --steam-op:.22; --ground:#050e1b; --sea:#08203d; --wave:#2a4f7c; --flame:#ff9a1a; --flame2:#ffe27a; --avi-op:1;
  --hero-ink:#eaf2fb; --hero-muted:#a3bbd6;
  --blueprint:#0c2848; --bp-line:rgba(150,190,240,.18); --bp-ink:#bcd6f4;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#07111e; --surface:#0e1b2c; --ink:#e6eef8; --muted:#93a8c2; --line:#1d3049;
  --navy:#081a30; --navy-2:#0f2643; --on-navy:#e6eef8; --on-navy-muted:#93a8c2;
  --accent:#3da5ff; --accent-ink:#031120; --accent-soft:#0d2a48; --accent-2:#7fd0ff;
  --sky1:#020814; --sky2:#0d2647; --orb:#e8eef8; --orb-glow:rgba(190,215,255,.16); --star-op:.9;
  --far:#0b1c32; --st:#0b192c; --st2:#0e2038; --band:#1b3556; --win:#ffcf6b; --win-glow:drop-shadow(0 0 3px rgba(255,190,90,.9)); --line-c:#1e3a5f;
  --steam:#9fb8d6; --steam-op:.22; --ground:#050e1b; --sea:#08203d; --wave:#2a4f7c; --flame:#ff9a1a; --flame2:#ffe27a; --avi-op:1;
  --hero-ink:#eaf2fb; --hero-muted:#a3bbd6;
  --blueprint:#0c2848; --bp-line:rgba(150,190,240,.18); --bp-ink:#bcd6f4;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35); color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--navy)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.08;margin:0;text-wrap:balance;letter-spacing:.005em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.svg-i{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.kicker{font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:.6em;font-weight:500}
.kicker::before{content:"";width:22px;height:2px;background:currentColor}
.h-xl{font-size:clamp(2.4rem,5.4vw,4.4rem);text-transform:uppercase}
.h-lg{font-size:clamp(2rem,3.8vw,3.1rem)}
.h-md{font-size:clamp(1.4rem,2.2vw,1.75rem)}
.lede{font-size:1.08rem;color:var(--muted);max-width:62ch}
.sec{padding-block:clamp(56px,8vw,104px)}
.sec-head{display:grid;gap:14px;margin-bottom:clamp(28px,4vw,48px);max-width:760px}
.sec-head.center{margin-inline:auto;text-align:center;justify-items:center}
.btn{white-space:nowrap;display:inline-flex;align-items:center;gap:.6em;font-family:var(--display);font-weight:600;font-size:1.02rem;letter-spacing:.06em;text-transform:uppercase;padding:.85em 1.5em;border-radius:var(--r);background:var(--accent);color:var(--accent-ink);border:2px solid var(--accent);cursor:pointer;transition:transform .2s,background .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.ghost:hover{background:var(--hero-ink);color:var(--sky2);border-color:var(--hero-ink)}
.btn .plus{transition:transform .3s}
.btn:hover .plus{transform:rotate(90deg)}

/* ---------- Header ---------- */
.topbar{background:var(--navy);color:var(--on-navy-muted);font-size:.84rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:40px;flex-wrap:wrap}
.topbar .tb-l,.topbar .tb-r{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.topbar a:hover{color:var(--on-navy)}
.topbar .svg-i{color:var(--accent);margin-right:6px;vertical-align:-2px}
.social{display:flex;gap:8px}
.social a{width:28px;height:28px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);border-radius:50%;font-family:var(--mono);font-size:.68rem;color:var(--on-navy-muted)}
.social a:hover{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:78px}
.logo{display:flex;align-items:center;gap:12px}
.logo-mark{width:46px;height:46px;position:relative;flex:none}
.logo-txt b{display:block;font-family:var(--display);font-size:1.55rem;letter-spacing:.14em;line-height:1;color:var(--ink)}
.logo-txt small{white-space:nowrap;display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;color:var(--muted);margin-top:4px;text-transform:uppercase}
nav.main>ul{display:flex;gap:4px;align-items:center}
nav.main>ul>li{position:relative}
nav.main>ul>li>a{display:flex;align-items:center;gap:6px;padding:28px 12px;font-family:var(--display);font-weight:600;font-size:1.06rem;letter-spacing:.06em;text-transform:uppercase;position:relative}
nav.main>ul>li>a::after{content:"";position:absolute;left:12px;right:12px;bottom:20px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s}
nav.main>ul>li:hover>a::after,nav.main>ul>li>a.on::after{transform:scaleX(1)}
nav.main>ul>li>a.on{color:var(--accent)}
.caret{width:.7em;height:.7em;transition:transform .25s}
li:hover>a>.caret{transform:rotate(180deg)}
.drop{position:absolute;top:100%;left:0;background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);box-shadow:var(--shadow);min-width:250px;padding:10px 0;opacity:0;visibility:hidden;transform:translateY(10px);transition:.25s}
li:hover>.drop,li:focus-within>.drop{opacity:1;visibility:visible;transform:none}
.drop.mega{display:grid;grid-template-columns:repeat(2,minmax(230px,1fr));gap:0 8px;padding:16px 10px;left:-140px}
.drop .grp{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:8px 16px 4px}
.drop a{display:block;padding:7px 16px;font-size:.93rem;transition:padding .2s,color .2s}
.drop a:hover{color:var(--accent);padding-left:22px}
.hdr-cta{display:flex;align-items:center;gap:14px}
.hdr-call{display:flex;align-items:center;gap:10px;font-size:.8rem;color:var(--muted);line-height:1.25}
.hdr-call b{display:block;font-family:var(--display);font-size:1.15rem;color:var(--ink);letter-spacing:.03em}
.hdr-call .ring{width:42px;height:42px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-size:1.2rem}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:var(--r);width:44px;height:44px;color:var(--ink);font-size:1.4rem;place-items:center;cursor:pointer}
@media (max-width:1320px){.hdr-call{display:none}}
.hdr-call b{white-space:nowrap}
@media (max-width:980px){
  header.site{backdrop-filter:none;background:var(--surface)}
  nav.main{position:fixed;inset:0;top:0;background:var(--surface);z-index:70;visibility:hidden;padding:76px max(20px,env(safe-area-inset-right,0px)) 40px max(20px,env(safe-area-inset-left,0px));overflow:auto;transform:translateX(100%);transition:transform .35s}
  nav.main.open{transform:none;visibility:visible}
  nav.main>ul{flex-direction:column;align-items:stretch;gap:0}
  nav.main>ul>li>a{padding:14px 4px;border-bottom:1px solid var(--line)}
  nav.main>ul>li>a::after{display:none}
  .drop,.drop.mega{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;display:none;grid-template-columns:1fr;padding:6px 0 10px 10px;min-width:0}
  li.x>.drop{display:block}
  li.x>.drop.mega{display:grid}
  .burger{display:grid}
  .nav-close{display:grid!important;position:absolute;top:16px;right:max(16px,env(safe-area-inset-right,0px))}
  .topbar .tb-l a:nth-child(n+2){display:none}
}
.nav-close{display:none}

/* ---------- Blueprint art ---------- */
.plate{position:relative;overflow:hidden;background:var(--blueprint);color:var(--bp-ink);border-radius:var(--r);isolation:isolate}
.plate svg.bp{position:absolute;inset:0;width:100%;height:100%}
.plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}
.plate .tag{position:absolute;left:12px;bottom:10px;z-index:3;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bp-ink);opacity:.85}
.plate:has(img) .tag{display:none}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(180deg,var(--sky1),var(--sky2) 78%);color:var(--hero-ink);position:relative;overflow:hidden;transition:background .6s}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.55}
.hero > .wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,640px);padding-block:clamp(48px,7vw,88px) 150px;min-height:600px;align-content:start}
.slides{position:relative;display:grid}
.slide{grid-area:1/1;display:grid;gap:22px;align-content:center;opacity:0;visibility:hidden;transition:opacity .7s,visibility .7s}
.slide.on{opacity:1;visibility:visible}
.slide .kicker{color:var(--accent)}
.slide h1 span{display:block;overflow:hidden}
.slide h1 span i{display:block;font-style:normal;transform:translateY(105%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.slide.on h1 span i{transform:none}
.slide.on h1 span:nth-child(2) i{transition-delay:.12s}
.slide p{color:var(--hero-muted);max-width:56ch;font-size:1.08rem}
.slide .acts{display:flex;gap:14px;flex-wrap:wrap}
.hero-side{position:relative;aspect-ratio:4/4.2;max-width:100%}
.hero-side .plate{position:absolute;inset:0;opacity:0;transform:scale(1.04);transition:opacity .8s,transform 6s linear;border:1px solid rgba(255,255,255,.12)}
.hero-side .plate.on{opacity:1;transform:scale(1)}
.badge-yrs{position:absolute;left:-28px;bottom:36px;z-index:5;background:var(--accent);color:var(--accent-ink);padding:18px 22px;border-radius:var(--r);box-shadow:0 18px 40px rgba(0,0,0,.35);font-family:var(--display);line-height:1}
.badge-yrs b{font-size:3rem;display:block}
.badge-yrs span{font-size:.92rem;letter-spacing:.12em;text-transform:uppercase}
.hero-ctrl{position:absolute;left:0;right:0;bottom:22px;z-index:3}
.hero-ctrl .wrap{display:flex;align-items:center;gap:18px;min-height:0;padding-block:0;grid-template-columns:none}
.dots{display:flex;gap:10px}
.dots button{width:38px;height:4px;border:0;background:color-mix(in srgb,var(--hero-ink) 22%,transparent);cursor:pointer;padding:0;position:relative;overflow:hidden}
.dots button.on::after{content:"";position:absolute;inset:0;background:var(--accent);transform-origin:left;animation:fill 6.5s linear forwards}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.slide-no,.scene-cap{font-family:var(--mono);font-size:.8rem;color:var(--hero-ink);letter-spacing:.12em}
.scene-cap{margin-left:auto;text-transform:uppercase;font-size:.7rem;background:color-mix(in srgb,var(--sky2) 70%,transparent);padding:5px 10px;border-radius:40px;backdrop-filter:blur(4px)}
@media (max-width:900px){.hero > .wrap{grid-template-columns:1fr;min-height:0;padding-bottom:300px}.scene-layer{aspect-ratio:auto;height:330px}.hero::after{background:linear-gradient(180deg,transparent 40%,transparent)}.scene-cap{display:none}}

/* ---------- Capabilities ---------- */
.caps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.cap{background:var(--surface);padding:30px 26px 28px;display:grid;gap:14px;align-content:start;position:relative;overflow:hidden;transition:background .3s,color .3s}
.cap .ic{width:56px;height:56px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-size:1.6rem;transition:.3s}
.cap h3{font-size:1.4rem}
.cap p{color:var(--muted);font-size:.95rem}
.cap .more{font-family:var(--display);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.9rem;color:var(--accent);display:inline-flex;gap:6px;align-items:center;margin-top:auto}
.cap .no{position:absolute;right:18px;top:16px;font-family:var(--mono);font-size:.7rem;color:var(--muted);letter-spacing:.1em}
.cap:hover{background:var(--navy);color:var(--on-navy)}
.cap:hover p{color:var(--on-navy-muted)}
.cap:hover .ic{background:var(--accent);color:var(--accent-ink);transform:rotate(-8deg)}
.cap.cta{background:var(--accent);color:var(--accent-ink)}
.cap.cta p{color:inherit;opacity:.9}
.cap.cta .ic{background:rgba(255,255,255,.2);color:inherit}
.cap.cta .more{color:inherit}
@media (max-width:1000px){.caps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.caps{grid-template-columns:1fr}}

/* ---------- About ---------- */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.about-media{position:relative;padding:0 0 40px 40px}
.about-media .plate{aspect-ratio:5/5.4}
.about-media .frame{position:absolute;left:0;bottom:0;width:62%;height:62%;border:2px solid var(--accent);border-radius:var(--r);z-index:-1}
.about-media .since{position:absolute;right:-12px;top:28px;background:var(--surface);box-shadow:var(--shadow);padding:16px 20px;border-radius:var(--r);border-left:4px solid var(--accent);z-index:4}
.since b{font-family:var(--display);font-size:2.2rem;line-height:1;display:block}
.since span{font-size:.82rem;color:var(--muted)}
.about-copy{display:grid;gap:20px}
.about-copy p{color:var(--muted)}
.checks{display:grid;gap:12px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-weight:500}
.checks .svg-i{color:var(--accent);font-size:1.25rem;margin-top:3px}
.callout{border-left:3px solid var(--accent);padding:6px 0 6px 18px;font-family:var(--display);font-size:1.3rem;line-height:1.3;color:var(--ink)}
@media (max-width:900px){.about-grid{grid-template-columns:1fr}.about-media{max-width:520px}}

/* ---------- Products ---------- */
.band-navy{background:var(--navy);color:var(--on-navy)}
.band-navy .lede,.band-navy p{color:var(--on-navy-muted)}
.prods{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.prod{display:grid;gap:0;background:var(--navy-2);border:1px solid rgba(255,255,255,.08);border-radius:var(--r);overflow:hidden;transition:transform .35s,border-color .35s}
.prod .plate{aspect-ratio:1/1;border-radius:0}
.prod .plate svg.bp{transition:transform .6s}
.prod:hover{transform:translateY(-6px);border-color:var(--accent)}
.prod:hover .plate svg.bp{transform:scale(1.08)}
.prod .body{padding:18px 18px 20px;display:grid;gap:8px}
.prod h3{font-size:1.35rem;color:var(--on-navy)}
.prod p{font-size:.9rem}
.prod .go{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
@media (max-width:1100px){.prods{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.prods{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:440px){.prods{grid-template-columns:1fr}}

/* ---------- Features ---------- */
.feat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.feat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:grid;grid-template-rows:auto 1fr}
.feat .plate{aspect-ratio:16/10;border-radius:0}
.feat .body{padding:24px;display:grid;gap:10px;align-content:start;position:relative}
.feat .ic{position:absolute;right:20px;top:-28px;width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-size:1.5rem;z-index:4;box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 35%,transparent)}
.feat .lbl{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.feat h3{font-size:1.45rem}
.feat p{color:var(--muted);font-size:.95rem}
@media (max-width:900px){.feat-grid{grid-template-columns:1fr}}

/* ---------- Stats strip ---------- */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.12)}
.stat{padding:30px 22px;border-right:1px solid rgba(255,255,255,.12);display:grid;gap:6px}
.stat:last-child{border-right:0}
.stat b{font-family:var(--display);font-size:clamp(2.4rem,4vw,3.4rem);line-height:1;color:var(--on-navy);font-variant-numeric:tabular-nums}
.stat b em{font-style:normal;color:var(--accent)}
.stat span{font-size:.9rem;color:var(--on-navy-muted)}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}}

/* ---------- FAQ + performance ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:start}
@media (max-width:900px){.two{grid-template-columns:1fr}}
.faq{display:grid;gap:12px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);transition:border-color .25s}
.faq details[open]{border-color:var(--accent)}
.faq summary{cursor:pointer;list-style:none;padding:18px 20px;display:flex;justify-content:space-between;gap:16px;font-family:var(--display);font-weight:600;font-size:1.18rem;line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;transition:transform .3s}
.faq details[open] summary .pm{transform:rotate(45deg);background:var(--accent);color:var(--accent-ink)}
.faq .ans{padding:0 20px 20px;color:var(--muted)}
.perf{display:grid;gap:22px}
.perf .plate{aspect-ratio:16/9}
.bar{display:grid;gap:8px}
.bar .row{display:flex;justify-content:space-between;font-family:var(--display);font-weight:600;font-size:1.1rem}
.bar .row b{color:var(--accent);font-variant-numeric:tabular-nums}
.bar .track{height:8px;background:var(--line);border-radius:8px;overflow:hidden}
.bar .fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:8px;width:var(--w);transition:width 1.6s cubic-bezier(.2,.8,.2,1)}
.bar.pre .fill{width:0}

/* ---------- CTA band ---------- */
.cta-band{background:var(--accent);color:var(--accent-ink)}
.cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding-block:40px}
.cta-band h2{font-size:clamp(1.6rem,3vw,2.3rem)}
.cta-band .btn{background:var(--navy);border-color:var(--navy);color:var(--on-navy)}

/* ---------- Footer ---------- */
footer.site{background:var(--navy);color:var(--on-navy-muted);font-size:.93rem}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr 1.2fr;gap:36px;padding-block:68px 48px}
footer h4{font-size:1.2rem;letter-spacing:.08em;text-transform:uppercase;color:var(--on-navy);margin-bottom:18px;position:relative;padding-bottom:10px}
footer h4::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2px;background:var(--accent)}
footer ul{display:grid;gap:9px}
footer ul a:hover{color:var(--accent)}
footer .about-f{display:grid;gap:18px;align-content:start}
footer .logo-txt b{color:var(--on-navy)}
footer .ci{display:flex;gap:10px;align-items:flex-start}
footer .ci .svg-i{color:var(--accent);margin-top:4px}
footer .bottom{border-top:1px solid rgba(255,255,255,.1)}
footer .bottom .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:20px;font-size:.85rem}
footer .bottom a{color:var(--on-navy)}
footer .bottom a:hover{color:var(--accent)}
@media (max-width:1000px){footer .cols{grid-template-columns:1fr 1fr}footer .about-f{grid-column:1/-1}}
@media (max-width:520px){footer .cols{grid-template-columns:1fr}}
.totop{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));width:46px;height:46px;border-radius:50%;background:var(--accent);color:var(--accent-ink);border:0;display:grid;place-items:center;font-size:1.2rem;cursor:pointer;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.3s;z-index:40}
.totop.show{opacity:1;pointer-events:auto}

/* ---------- Inner page banner ---------- */
.banner{background:var(--blueprint);color:var(--on-navy);position:relative;overflow:hidden}
.banner svg.bp{position:absolute;inset:0;width:100%;height:100%;color:var(--bp-ink)}
.banner .wrap{position:relative;padding-block:clamp(56px,8vw,96px);display:grid;gap:14px}
.banner h1{font-size:clamp(2.2rem,5vw,3.8rem);text-transform:uppercase}
.banner .lede{color:var(--on-navy-muted)}
.crumbs{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-navy-muted)}
.crumbs a:hover{color:var(--accent)}
.crumbs span{color:var(--accent)}
.banner .big-ic{position:absolute;right:max(16px,6vw);top:50%;transform:translateY(-50%);font-size:clamp(120px,18vw,240px);color:var(--bp-ink);opacity:.16}
.banner .big-ic .svg-i{stroke-width:.8}

/* ---------- Inner page body ---------- */
.page{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(28px,4vw,56px);align-items:start}
.page.full{grid-template-columns:minmax(0,1fr)}
.content{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;min-width:0}
.content > .plate{aspect-ratio:16/7}
.block{display:grid;gap:14px}
.block h2{font-size:clamp(1.6rem,2.8vw,2.2rem)}
.block h3{font-size:1.35rem}
.block p{color:var(--muted)}
.block p strong{color:var(--ink)}
.ticks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px}
.ticks.one{grid-template-columns:1fr}
.ticks li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);font-size:.95rem}
.ticks li .svg-i{color:var(--accent);margin-top:4px}
@media (max-width:640px){.ticks{grid-template-columns:1fr}}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:grid;gap:10px;align-content:start;transition:border-color .25s,transform .25s}
.card:hover{border-color:var(--accent);transform:translateY(-3px)}
.card .ic{font-size:1.5rem;color:var(--accent)}
.card h3{font-size:1.25rem}
.card p{font-size:.92rem;color:var(--muted)}
.card ul{display:grid;gap:4px;font-size:.9rem;color:var(--muted)}
.card ul li::before{content:"— ";color:var(--accent)}
aside.side{display:grid;gap:22px;position:sticky;top:110px}
.side-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.side-box h4{font-size:1.2rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px}
.side-nav{display:grid;gap:4px}
.side-nav a{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;background:var(--bg);border-radius:var(--r);font-weight:500;font-size:.94rem;transition:.2s}
.side-nav a:hover,.side-nav a.on{background:var(--accent);color:var(--accent-ink)}
.side-help{background:var(--navy);color:var(--on-navy);border-radius:var(--r);padding:26px;display:grid;gap:12px;position:relative;overflow:hidden}
.side-help p{color:var(--on-navy-muted);font-size:.92rem}
.side-help .tel{font-family:var(--display);font-size:1.5rem;color:var(--on-navy)}
@media (max-width:980px){.page{grid-template-columns:minmax(0,1fr)}aside.side{position:static}}

/* Brands */
.brand-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.brand-filter button{font:inherit;font-size:.86rem;padding:8px 14px;border-radius:40px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.brand-filter button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.brandc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);min-height:110px;display:grid;place-items:center;text-align:center;padding:16px;position:relative;transition:.25s}
.brandc:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.brandc img{max-height:56px;width:auto;object-fit:contain}
.brandc .nm{font-family:var(--display);font-weight:700;font-size:1.25rem;letter-spacing:.04em;line-height:1.1}
.brandc .cat{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.brandc:has(img) .nm{display:none}

/* Forms */
.form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form .full{grid-column:1/-1}
.form label{display:grid;gap:6px;font-size:.84rem;font-weight:500}
.form input,.form textarea,.form select{font:inherit;font-size:.95rem;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink);width:100%}
.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--accent)}
.form textarea{min-height:130px;resize:vertical}
.form .note{grid-column:1/-1;font-size:.88rem;padding:12px 14px;border-radius:var(--r);background:var(--accent-soft);color:var(--ink)}
@media (max-width:600px){.form{grid-template-columns:1fr}}
.contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:800px){.contact-cards{grid-template-columns:1fr}}
.contact-cards .card b{font-family:var(--display);font-size:1.2rem;word-break:break-word}
.copy{font:inherit;font-size:.74rem;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);background:none;color:var(--muted);padding:5px 10px;border-radius:var(--r);cursor:pointer;justify-self:start}
.copy:hover{border-color:var(--accent);color:var(--accent)}
.map{aspect-ratio:16/7;border-radius:var(--r)}
.jobs{display:grid;gap:12px}
.job{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.job h3{font-size:1.25rem}
.job .meta{font-size:.84rem;color:var(--muted)}
.pill{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:40px;background:var(--accent-soft);color:var(--accent);white-space:nowrap}

/* reveal: visible at rest; small lift once observed */
.rv{transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .8s}
.rv.pre{transform:translateY(26px)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.rv.pre{transform:none;opacity:1}.slide h1 span i{transform:none}}
#app{min-height:60vh}

/* ---------- additions ---------- */
.band-navy .caps{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.1)}
.band-navy .cap{background:var(--navy-2);color:var(--on-navy)}
.band-navy .cap:hover{background:var(--navy)}
.caps.dark4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.caps.dark4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.caps.dark4{grid-template-columns:1fr}}
.mini{display:grid;gap:6px;font-size:.92rem;color:var(--on-navy-muted)}
.mini li{padding-left:16px;position:relative}
.mini li::before{content:"";position:absolute;left:0;top:.7em;width:7px;height:2px;background:var(--accent)}
.band-steel{background:color-mix(in srgb,var(--navy) 6%,var(--bg))}
.tl{list-style:none;margin:0;padding:0;display:grid;gap:0;border-left:2px solid var(--line);margin-left:8px}
.tl-i{display:grid;gap:4px;padding:0 0 26px 26px;position:relative}
.tl-i::before{content:"";position:absolute;left:-8px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--surface);border:3px solid var(--accent)}
.tl-y{font-family:var(--mono);font-size:.78rem;letter-spacing:.12em;color:var(--accent);font-weight:500}
.tl-i h3{font-size:1.3rem}
.tl-i p{color:var(--muted);font-size:.94rem}
.certs{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.cert-plate{aspect-ratio:3/4}
.cert-plate img{object-fit:contain;background:#fff}
.plist{display:grid;gap:18px}
.prow{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;transition:border-color .25s}
.prow:hover{border-color:var(--accent)}
.prow .plate{aspect-ratio:4/3}
.prow > div:last-child{display:grid;gap:10px;padding-right:10px;min-width:0}
.prow p{color:var(--muted);font-size:.95rem}
@media (max-width:640px){.prow{grid-template-columns:1fr}}
.txtlink{font-family:var(--display);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);display:inline-flex;gap:6px;align-items:center;font-size:.95rem}
.brandc{grid-template-rows:1fr auto}
.brandc > span:nth-of-type(1){display:grid;place-items:center}
.brandc .view{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);display:inline-flex;gap:4px;align-items:center;opacity:0;transform:translateY(4px);transition:.25s;margin-top:8px}
.brandc:hover .view,.brandc:focus-visible .view{opacity:1;transform:none}
@media (hover:none){.brandc .view{opacity:1;transform:none}}
.brand-hero{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.brandc.big{width:220px;min-height:140px}
.brandc.big img{max-height:90px}
.tiles{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.card.tile{padding:12px 12px 18px}
.card.tile .plate{aspect-ratio:4/3;margin-bottom:6px}
.card.tile h3{padding:0 6px}
.card .more{font-family:var(--display);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.88rem;color:var(--accent);display:inline-flex;gap:6px;align-items:center;padding:0 6px}
.card .pill{justify-self:start;margin-left:6px}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.steps li{display:grid;grid-template-columns:auto 1fr;gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.steps .sn{font-family:var(--display);font-size:2.4rem;font-weight:700;line-height:1;color:var(--accent)}
.steps p{margin-top:6px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.grp-block{padding-top:28px;border-top:1px solid var(--line);scroll-margin-top:110px}
.mp-sec{scroll-margin-top:110px;padding-top:28px;border-top:1px solid var(--line)}
.ind-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1000px){.ind-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.ind-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.ind-grid{grid-template-columns:1fr}}
.ind{position:relative;border-radius:var(--r);overflow:hidden;display:block}
.ind .plate{aspect-ratio:4/5;border-radius:0}
.ind .plate svg.bp,.ind .plate img{transition:transform .7s}
.ind:hover .plate svg.bp,.ind:hover .plate img{transform:scale(1.07)}
.ind-cap{position:absolute;inset:auto 0 0;z-index:4;padding:48px 18px 18px;background:linear-gradient(transparent,rgba(6,16,30,.92));color:#fff;display:grid;gap:4px}
.ind-cap .ic{font-size:1.4rem;color:var(--accent)}
.ind-cap h3{font-size:1.5rem;text-transform:uppercase;letter-spacing:.04em}
.ind-cap .more{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#9fd4ff;display:inline-flex;gap:6px;align-items:center}
.mp-head{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:center}
.mp-head .plate{aspect-ratio:4/3}
.mp-head > div{display:grid;gap:10px;min-width:0}
@media (max-width:640px){.mp-head{grid-template-columns:1fr}}
.roles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.roles span{display:flex;gap:10px;align-items:center;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);font-size:.93rem}
.roles .svg-i{color:var(--accent)}
.empty{display:flex;gap:18px;align-items:flex-start;padding:24px;border:1px dashed var(--line);border-radius:var(--r);background:var(--surface)}
.empty > .svg-i{font-size:2rem;color:var(--accent)}
.empty p{color:var(--muted);margin-top:6px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:56px 0 22px;border-bottom:1px solid var(--line)}
.tabs button{font:inherit;font-family:var(--display);font-weight:600;font-size:1.1rem;letter-spacing:.06em;text-transform:uppercase;background:none;border:0;border-bottom:3px solid transparent;padding:12px 16px;color:var(--muted);cursor:pointer;margin-bottom:-1px}
.tabs button.on{color:var(--ink);border-color:var(--accent)}
.offices{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px}
@media (max-width:400px){.offices{grid-template-columns:1fr}}
.office{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:grid;grid-template-rows:auto 1fr}
.office .map{position:relative;aspect-ratio:2/1;background:var(--blueprint);color:var(--bp-ink);border-radius:0}
.office .map svg.bp{position:absolute;inset:0;width:100%;height:100%}
.map-lbl{position:absolute;left:14px;bottom:12px;background:var(--accent);color:var(--accent-ink);font-family:var(--display);font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:6px 12px;border-radius:var(--r);display:flex;gap:6px;align-items:center}
.o-body{padding:20px;display:grid;gap:10px;align-content:start}
.o-body h3{font-size:1.3rem}
.o-row{display:flex;gap:10px;align-items:flex-start;font-size:.92rem;color:var(--muted);flex-wrap:wrap}
.o-row .svg-i{color:var(--accent);margin-top:4px}
.o-row .sel{color:var(--ink);word-break:break-word}
.sel{user-select:all}
.approval{justify-items:center;text-align:center}
.approval .brandc{width:100%}
@media (max-width:540px){.hdr-cta .btn{display:none}header.site .wrap{min-height:66px}}

@media (max-width:600px){.topbar{display:none}}
@media (max-width:500px){.brands{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== v2: scenes, theme, shop, careers, security ===== */
.scene{width:100%;height:100%;display:block}
.scene .stars{fill:#fff;opacity:var(--star-op);transition:opacity .6s}
.scene .orb{fill:var(--orb)} .scene .orb-glow{fill:var(--orb-glow)}
.scene .far{fill:var(--far)}
.scene .st{fill:var(--st)} .scene .st2{fill:var(--st2)} .scene .band{fill:var(--band);opacity:.8}
.scene .win{fill:var(--win);filter:var(--win-glow)}
.scene .win.flick{animation:flick 5s steps(1) infinite}
.scene .line{fill:none;stroke:var(--line-c);stroke-width:3}
.scene .line.thick{stroke-width:4}
.scene .wire{fill:none;stroke:var(--line-c);stroke-width:1.4;opacity:.8}
.scene .pipe{fill:none;stroke:var(--st2);stroke-width:7}
.scene .ground{fill:var(--ground)} .scene .sea{fill:var(--sea)} .scene .wave{fill:none;stroke:var(--wave);stroke-width:2}
.scene .steam{fill:var(--steam);opacity:0;transform-box:fill-box;transform-origin:center;animation:rise 8s linear infinite}
.scene .avi{fill:#ff3b3b;opacity:var(--avi-op);animation:blink 1.6s steps(1) infinite}
.scene .flame{fill:var(--flame);transform-box:fill-box;transform-origin:50% 100%;animation:burn .22s ease-in-out infinite alternate;filter:drop-shadow(0 0 10px var(--flame))}
.scene .flame2{fill:var(--flame2);transform-box:fill-box;transform-origin:50% 100%;animation:burn .16s ease-in-out infinite alternate-reverse}
.scene *{transition:fill .6s}
@keyframes rise{0%{transform:translate(0,0) scale(.5);opacity:0}12%{opacity:var(--steam-op)}100%{transform:translate(60px,-170px) scale(2.4);opacity:0}}
@keyframes blink{0%{opacity:var(--avi-op)}50%{opacity:0}}
@keyframes burn{to{transform:scale(.88,1.14) skewX(-4deg)}}
@keyframes flick{0%,70%{opacity:1}72%{opacity:.25}90%{opacity:1}}
.scene-layer{position:absolute;left:0;right:0;bottom:0;aspect-ratio:1600/600;opacity:0;transition:opacity 1.1s}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--sky2) 72%,transparent) 0,color-mix(in srgb,var(--sky2) 45%,transparent) 38%,transparent 58%)}
.scene-layer.on{opacity:1}
.scene-box{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--sky1),var(--sky2) 80%);border-radius:var(--r);aspect-ratio:16/10;max-width:100%}
.scene-box.wide{aspect-ratio:16/7}
.scene-box .scene{position:absolute;inset:0}
.scene-box img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}
.scene-box .tag{position:absolute;left:12px;top:10px;z-index:3;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hero-ink);background:color-mix(in srgb,var(--sky2) 75%,transparent);padding:4px 8px;border-radius:30px}
.ind .scene-box{aspect-ratio:4/5;border-radius:0}
.strengths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.strength{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:grid;grid-template-rows:auto 1fr;transition:transform .3s,border-color .3s,box-shadow .3s}
.strength:hover{transform:translateY(-5px);border-color:var(--accent);box-shadow:var(--shadow)}
.strength .scene-box{border-radius:0}
.strength .body{padding:22px;display:grid;gap:14px;align-content:start}
.strength h3{font-size:1.6rem;text-transform:uppercase;letter-spacing:.03em}
.strength-more{margin-top:28px;display:flex;justify-content:center}
.btn.ghost-dark{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost-dark:hover{border-color:var(--accent);color:var(--accent)}
@media (max-width:980px){.strengths{grid-template-columns:1fr}.strength{grid-template-columns:minmax(0,1fr)}}
.icon-btn{position:relative;height:44px;min-width:44px;padding:0 10px;border-radius:40px;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:.78rem;font-family:var(--mono);letter-spacing:.06em;cursor:pointer;transition:.2s}
.icon-btn .svg-i{font-size:1.15rem}
.icon-btn:hover{border-color:var(--accent);color:var(--accent)}
.badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:20px;background:var(--accent);color:var(--accent-ink);font:600 .7rem/20px var(--body);text-align:center;padding:0 5px}
.btn .badge{position:static;margin-left:4px;background:var(--accent-ink);color:var(--accent)}
.btn .badge:empty{display:none}
nav.main>ul>li>a{padding:28px 10px;font-size:1.02rem}
.drop:not(.mega){min-width:220px}
@media (max-width:1440px){.hdr-quote{display:none}}
@media (max-width:480px){.theme-tg span{display:none}}
/* shop */
.shop{display:grid;grid-template-columns:270px minmax(0,1fr);gap:28px;align-items:start}
.shop-side{display:grid;gap:16px;position:sticky;top:100px}
.shop-side .side-nav{max-height:52vh;overflow:auto}
.shop-side .side-nav a{font-size:.88rem;padding:9px 12px}
.shop-side .side-nav small{font-family:var(--mono);font-size:.62rem;opacity:.7;margin-left:auto;padding-left:8px}
.chip{font:inherit;font-size:.85rem;padding:7px 14px;border-radius:40px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.chip.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.shop-main{display:grid;gap:18px;min-width:0}
.shop-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.search{flex:1 1 280px;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:0 12px}
.search .svg-i{color:var(--muted)}
.search input{flex:1;border:0;background:none;color:var(--ink);font:inherit;padding:12px 0;min-width:0}
.search input:focus{outline:none}
.search:focus-within{border-color:var(--accent)}
.muted{color:var(--muted);font-size:.88rem}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.pcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:grid;grid-template-rows:auto 1fr;transition:border-color .2s,box-shadow .2s}
.pcard:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.pc-media{position:relative}
.pc-media .plate{aspect-ratio:400/260;border-radius:0}
.pc-media .plate img{object-fit:contain;background:#fff;padding:10px}
.pc-brand{position:absolute;right:10px;top:10px;z-index:4;font-family:var(--display);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;background:var(--surface);color:var(--ink);padding:3px 10px;border-radius:30px}
.pc-body{padding:14px;display:grid;gap:6px;align-content:start}
.pc-cat{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.pc-body h3{font-family:var(--body);font-weight:600;font-size:.95rem;line-height:1.35}
.pc-code{font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.pc-act{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.qty button{width:30px;height:34px;border:0;background:var(--bg);color:var(--ink);cursor:pointer;font-size:1rem}
.qty input,.qty span{width:44px;text-align:center;border:0;background:var(--surface);color:var(--ink);font:inherit;font-size:.9rem;height:34px;line-height:34px;-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button{display:none}
.btn.sm{padding:.55em 1em;font-size:.88rem}
.btn.added{background:var(--navy-2);border-color:var(--navy-2);color:var(--on-navy)}
@media (max-width:900px){.shop{grid-template-columns:1fr}.shop-side{position:static}.shop-side .side-nav{max-height:220px}}
.drawer{position:fixed;inset:0;z-index:90}
.drawer-bg{position:absolute;inset:0;background:rgba(3,10,20,.5);opacity:0;transition:opacity .3s}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(480px,100%);background:var(--bg);box-shadow:-10px 0 40px rgba(0,0,0,.25);transform:translateX(100%);transition:transform .3s;display:grid;grid-template-rows:auto 1fr;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-right:env(safe-area-inset-right,0px)}
.drawer.open .drawer-bg{opacity:1}
.drawer.open .drawer-panel{transform:none}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.drawer-head h3{font-size:1.5rem;text-transform:uppercase}
.drawer-body{overflow:auto;padding:16px 20px 30px;display:grid;gap:20px;align-content:start}
.cart-list{display:grid;gap:8px}
.cart-list li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.cart-list b{display:block;font-size:.9rem;font-weight:600;line-height:1.3}
.rm{border:0;background:none;color:var(--muted);cursor:pointer;font-size:1rem;padding:6px}
.rm:hover{color:#d33}
.drawer .form{grid-template-columns:1fr 1fr}
.drawer .form h3{font-size:1.3rem}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--navy);color:var(--on-navy);padding:12px 18px;border-radius:var(--r);box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.3s;z-index:95;font-size:.9rem;max-width:calc(100% - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0)}
/* security */
.captcha{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;border:1px dashed var(--line);border-radius:var(--r);background:var(--surface);position:relative}
.captcha label{display:block;font-size:.9rem}
.captcha .cap-ic{color:var(--accent);font-size:1.3rem}
.captcha input{width:90px;font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg);color:var(--ink)}
.captcha .cap-q{font-family:var(--mono);color:var(--accent)}
.captcha .cap-new{margin-left:auto}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.consent{display:flex!important;gap:10px;align-items:flex-start;font-weight:400!important;color:var(--muted)}
.consent input{width:auto!important;margin-top:4px}
.form .note.ok{background:color-mix(in srgb,#1aa36b 14%,var(--surface));border-left:3px solid #1aa36b}
.form .file input{padding:10px;background:var(--bg)}
/* careers */
.hire{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;counter-reset:h}
.hire li{display:grid;gap:10px;align-content:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;position:relative}
.hire .hn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-size:1.3rem}
.hire b{font-family:var(--display);font-size:1.1rem;letter-spacing:.02em}
.hire p{font-size:.86rem;color:var(--muted);margin-top:4px}
@media (max-width:900px){.hire{grid-template-columns:1fr 1fr}}
@media (max-width:500px){.hire{grid-template-columns:1fr}}
.example-note{display:flex;gap:8px;align-items:center;font-size:.86rem;color:var(--muted);background:var(--accent-soft);padding:8px 12px;border-radius:var(--r)}
.job2{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.job2[open]{border-color:var(--accent)}
.job2 summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:16px 18px}
.job2 summary::-webkit-details-marker{display:none}
.job2 h3{font-size:1.25rem}
.job2 .meta{font-size:.84rem;color:var(--muted);display:inline-flex;gap:4px;align-items:center}
.job2 .pm{width:28px;height:28px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;transition:transform .3s}
.job2[open] .pm{transform:rotate(45deg)}
.job-body{padding:0 18px 18px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.job-body h4{font-size:1rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.job-body .btn{grid-column:1/-1;justify-self:start}
@media (max-width:640px){.job-body{grid-template-columns:1fr}}
/* gallery */
.gtabs{margin-top:0}
.gtabs a{font-family:var(--display);font-weight:600;font-size:1.1rem;letter-spacing:.06em;text-transform:uppercase;padding:12px 16px;border-bottom:3px solid transparent;color:var(--muted);margin-bottom:-1px}
.gtabs a.on{color:var(--ink);border-color:var(--accent)}
.gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.gal-i{margin:0;position:relative;border-radius:var(--r);overflow:hidden}
.gal-i.wide{grid-column:span 2;grid-row:span 2}
.gal-i .plate{aspect-ratio:4/3;height:100%;border-radius:0}
.gal-i figcaption{position:absolute;inset:auto 0 0;padding:30px 14px 12px;background:linear-gradient(transparent,rgba(4,14,28,.85));color:#fff;display:grid;gap:6px;justify-items:start;z-index:4}
.gal-i figcaption b{font-family:var(--display);font-size:1.2rem;letter-spacing:.02em}
.gal-note{margin-top:22px}
@media (max-width:900px){.gal{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.gal{grid-template-columns:1fr}.gal-i.wide{grid-column:auto;grid-row:auto}}
/* maps */
.office .map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2}
.map-geo{position:absolute;right:12px;top:10px;z-index:3;font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--bp-ink);background:rgba(4,20,40,.55);padding:3px 8px;border-radius:30px}
.office .map .map-lbl{z-index:3}
@media (max-width:900px){.scene-layer{aspect-ratio:auto;height:330px;left:0;right:0;width:auto}.hero::after{display:none}}
@media (max-width:480px){.logo-txt small{display:none}.logo-txt b{font-size:1.3rem}.hdr-cta{gap:8px}.icon-btn{min-width:40px;height:40px;padding:0 8px}.burger{width:40px;height:40px}header.site .wrap{gap:10px}}

/* ===== Events ===== */
.ev-strip{background:linear-gradient(90deg,var(--navy),var(--accent));color:#fff;font-size:.86rem}
.ev-strip .wrap{display:flex;align-items:center;gap:12px;min-height:40px;padding-block:6px}
.ev-strip b{font-family:var(--cond,inherit);letter-spacing:.04em}
.ev-dot{flex:none;width:9px;height:9px;border-radius:50%;background:#5dff9d;box-shadow:0 0 0 0 rgba(93,255,157,.7);animation:evpulse 2s infinite}
@keyframes evpulse{70%{box-shadow:0 0 0 8px rgba(93,255,157,0)}100%{box-shadow:0 0 0 0 rgba(93,255,157,0)}}
.ev-go{margin-left:auto;color:#fff;font-weight:600;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.ev-go .svg-i{width:14px;height:14px}
.ev-x{background:none;border:0;color:#fff;opacity:.75;cursor:pointer;padding:4px;display:grid}
.ev-x .svg-i{width:16px;height:16px}
.ev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:24px}
.ev-list{display:grid;gap:24px}
.ev-card{background:var(--surface);border:1px solid var(--line);display:grid;grid-template-columns:1fr;overflow:hidden}
.ev-list .ev-card{grid-template-columns:1fr auto}
.ev-list .ev-img{grid-column:1/-1}
.ev-img{background:#0b1730}
.ev-img img{display:block;width:100%;height:auto}
.ev-body{padding:20px 22px 22px;display:grid;gap:10px;align-content:start}
.ev-body h3{margin:0;font-size:1.5rem}
.ev-full{margin:-4px 0 0;color:var(--muted);font-size:.92rem}
.ev-top{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ev-pill{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:99px;background:var(--accent-soft);color:var(--accent)}
.ev-pill.live{background:#1fa463;color:#fff}
.ev-pill.past{background:var(--line);color:var(--muted)}
.ev-focus{font-size:.82rem;color:var(--muted)}
.ev-facts{list-style:none;margin:4px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.ev-facts li{display:flex;gap:10px;align-items:flex-start}
.ev-facts .svg-i{flex:none;width:20px;height:20px;color:var(--accent);margin-top:2px}
.ev-facts b{display:block}
.ev-facts span{font-size:.88rem;color:var(--muted)}
.ev-facts b{color:var(--ink);font-size:.98rem}
.ev-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.ev-acts .btn.ghost{color:var(--ink);border-color:var(--line)}
.ev-acts .btn.ghost:hover{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.ev-acts .svg-i{width:15px;height:15px}
.ev-qr{padding:20px 22px;display:grid;justify-items:center;align-content:center;gap:8px;border-left:1px dashed var(--line);font-size:.8rem;color:var(--muted)}
.ev-qr span{display:inline-flex;gap:6px;align-items:center}
.ev-qr .svg-i{width:14px;height:14px}
.qr{width:148px;padding:8px;background:#fff;border:1px solid var(--line)}
.qr svg{display:block;width:100%;height:auto}
.ev-card.is-past{opacity:.7}
.ev-side img{display:block;width:100%;height:auto;margin-bottom:12px}
.ev-side .qr{margin:12px auto 4px}
.qr-cap{text-align:center;font-size:.8rem;color:var(--muted)}
.interests{border:1px solid var(--line);padding:14px 16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 16px;margin:0}
.interests legend{padding:0 6px;font-weight:600}
.chk{display:flex;gap:8px;align-items:center;font-size:.92rem;cursor:pointer}
.chk input{width:18px;height:18px;accent-color:var(--accent);flex:none}
.booth-key{display:grid;gap:6px;margin-bottom:16px;font-size:.9rem}
@media (max-width:700px){
  .ev-strip .wrap{gap:8px;font-size:.78rem}
  .ev-more{display:none}
  .ev-go{font-size:.78rem}
  .ev-list .ev-card{grid-template-columns:1fr}
  .ev-qr{border-left:0;border-top:1px dashed var(--line)}
}
.form .chk{display:flex;flex-direction:row;gap:8px;align-items:center;font-weight:400}
.form .chk input{width:18px;height:18px;min-height:0;padding:0;flex:none}

/* ===== Official logo + brand mark graphics ===== */
.logo-img{display:block;height:56px;width:auto}
.logo .dk{display:none}
:root[data-theme="dark"] .logo .lt{display:none}
:root[data-theme="dark"] .logo .dk{display:block}
footer.site .logo .lt{display:none}
footer.site .logo .dk{display:block;height:58px}
footer.site{position:relative;overflow:hidden}
footer.site::before{content:"";position:absolute;right:-90px;bottom:-110px;width:420px;aspect-ratio:1.03;background:var(--mark-dk) center/contain no-repeat;opacity:.05;pointer-events:none}
.banner::after{content:"";position:absolute;left:-140px;bottom:-190px;width:560px;aspect-ratio:1.03;background:var(--mark-dk) center/contain no-repeat;opacity:.06;pointer-events:none}
.core-strength,.ev-band{position:relative}
.ev-band::before{content:"";position:absolute;right:4%;top:40px;width:220px;aspect-ratio:1.03;background:var(--mark-lt) center/contain no-repeat;opacity:.07;pointer-events:none}
:root[data-theme="dark"] .ev-band::before{background-image:var(--mark-dk)}
@media (max-width:480px){.logo-img{height:40px}}
/* Visiting card capture on the lead form */
.card-scan{border:1px dashed var(--accent);padding:14px 16px;margin:0;display:grid;gap:10px;min-width:0}
.card-scan legend{padding:0 6px;font-weight:600}
.cs-help{margin:0;color:var(--muted);font-size:.9rem}
.cs-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form .cs-slot{display:block;cursor:pointer;margin:0}
.cs-slot input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.cs-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:120px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--accent-soft);color:var(--ink);text-align:center}
.cs-ph svg{width:28px;height:28px;stroke:var(--accent);fill:none;stroke-width:1.6}
.cs-ph b{font-weight:600}
.cs-ph small{color:var(--muted);font-weight:400}
.cs-ph img{max-height:140px;width:auto;max-width:100%;border-radius:2px;object-fit:contain}
.cs-slot:focus-within .cs-ph{outline:2px solid var(--accent);outline-offset:2px}
.cs-slot.has .cs-ph{background:var(--surface)}
.cs-status{margin:0;font-size:.9rem;color:var(--muted)}
.cs-status.ok{color:var(--ink)}
.form input.from-card{background:var(--accent-soft)}
@media (max-width:480px){.cs-row{grid-template-columns:1fr}}
/* brand pages: product photos from the principals, logos on a white chip so dark artwork stays readable at night */
.brandc img{background:#fff;padding:6px 10px;border-radius:6px;box-sizing:content-box}
.brandc.big:has(img) > .nm{display:none}
.btn-row{display:flex;gap:12px;flex-wrap:wrap}
.pimg{background:#fff;border:1px solid var(--line);border-radius:var(--r);display:grid;place-items:center;padding:12px;aspect-ratio:4/3;overflow:hidden}
.pimg img{width:100%;height:100%;min-width:0;object-fit:contain}
.bsec > *,.pcards > *{min-width:0}
.bsec{display:grid;grid-template-columns:minmax(0,300px) 1fr;gap:24px;align-items:start}
.bsec h3{margin-top:0}
.pcards{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.pcards .card h3{font-size:1.05rem;margin:10px 0 4px}
.pcards .card p{font-size:.92rem}
@media (max-width:720px){.bsec{grid-template-columns:minmax(0,1fr)}.bsec .pimg{width:100%;max-width:420px;box-sizing:border-box}}
.btn-row .btn{white-space:normal;max-width:100%;text-align:left}
.note .btn,.btn-row .btn{white-space:normal;max-width:100%}
/* ---------- 3D: tilt cards, equipment viewer, online brochure ---------- */
.tilt{--rx:0deg;--ry:0deg;--gx:50%;--gy:50%;perspective:900px}
.tilt .tl-in,.tilt.pimg{transform:rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.tilt.on .tl-in,.tilt.pimg.on{transition:transform .08s linear,box-shadow .3s;box-shadow:0 22px 48px rgba(8,26,48,.28)}
.site-ph{margin:0}
.site-ph .tl-in{position:relative;border-radius:var(--r);overflow:hidden;background:var(--blueprint);aspect-ratio:4/3;height:100%}
.site-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.site-ph .sheen{position:absolute;inset:0;background:radial-gradient(circle at var(--gx) var(--gy),rgba(255,255,255,.28),transparent 45%);opacity:0;transition:opacity .3s;pointer-events:none}
.tilt.on .sheen{opacity:1}
.site-ph figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;background:linear-gradient(transparent,rgba(6,20,38,.88));color:#fff;transform:translateZ(40px);display:grid;gap:4px}
.site-ph figcaption .kicker{color:#9fd6ff}
.site-ph figcaption b{font-family:var(--display);font-size:1.35rem;letter-spacing:.02em;line-height:1.1}
.site-ph .dwg{position:absolute;top:12px;right:12px;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;color:#fff;background:rgba(6,20,38,.55);border:1px solid rgba(255,255,255,.35);padding:4px 8px;border-radius:3px;transform:translateZ(30px)}
.ph-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ph-grid .site-ph.big{grid-column:span 2;grid-row:span 2}
.ph-grid .site-ph.big .tl-in{aspect-ratio:auto;min-height:100%}
.ph-grid.awards{grid-template-columns:repeat(4,minmax(0,1fr))}
.ph-grid.awards .tl-in{background:#fff}
.ph-grid.awards img{object-fit:contain;padding:10px 10px 64px}
@media (max-width:900px){.ph-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ph-grid .site-ph.big{grid-row:auto}.ph-grid.awards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ph-grid{grid-template-columns:minmax(0,1fr)}.ph-grid .site-ph.big{grid-column:auto}.ph-grid .site-ph.big .tl-in{aspect-ratio:4/3}}
.m3d{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;align-items:stretch}
.m3d-stage{position:relative;min-height:420px;border:1px solid var(--line);border-radius:var(--r);background:radial-gradient(ellipse at 50% 40%,rgba(56,182,255,.16),transparent 65%),var(--blueprint);overflow:hidden}
.band-navy .m3d-stage{border-color:rgba(170,205,245,.25)}
.m3d-stage canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:pan-y}
.m3d-stage canvas:active{cursor:grabbing}
.m3d-hint,.m3d-load{position:absolute;left:14px;bottom:12px;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--bp-ink);display:flex;gap:6px;align-items:center;pointer-events:none;transition:opacity .4s}
.m3d-load{left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%)}
.m3d-stage.ready .m3d-load{opacity:0}
.m3d-stage:not(.ready) .m3d-hint,.m3d-stage.used .m3d-hint{opacity:0}
.m3d-stage.fail .m3d-load{opacity:1}
.m3d-side{display:grid;gap:18px;align-content:start}
.m3d-tabs{display:grid;gap:8px}
.m3d-tabs button{font:inherit;text-align:left;padding:12px 16px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;font-weight:600}
.band-navy .m3d-tabs button{background:rgba(255,255,255,.04);border-color:rgba(170,205,245,.25);color:var(--on-navy)}
.m3d-tabs button.on{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.m3d-info{display:grid;gap:10px;justify-items:start}
.m3d-info h3{font-family:var(--display);font-size:1.6rem;line-height:1.1}
.band-navy .m3d-info p{color:var(--on-navy-muted)}
.band-navy .m3d-info .btn.ghost-dark{color:var(--on-navy);border-color:rgba(170,205,245,.4)}
@media (max-width:900px){.m3d{grid-template-columns:minmax(0,1fr)}.m3d-stage{min-height:340px}}
.m3d-info[hidden]{display:none}
.m3d-side,.m3d-info{min-width:0}.m3d-info .btn{white-space:normal;max-width:100%}@media (max-width:560px){.btn{white-space:normal;max-width:100%}}

/* gallery: real photos with tilt, filter chips, photo viewer */
.gal-f{margin:0 0 22px}
.gal-f small{opacity:.7;margin-left:2px}
.gal-ph[hidden]{display:none}
.gal-ph .tl-in{display:block;width:100%;padding:0;border:0;font:inherit;text-align:left;cursor:zoom-in}
.gal-ph.doc .tl-in{background:#fff}
.gal-ph.doc img{object-fit:contain;padding:10px 10px 88px}
.gal-soon{margin-top:18px}
.lbx{position:fixed;inset:0;z-index:200;background:rgba(4,12,24,.92);display:grid;grid-template-columns:56px minmax(0,1fr) 56px;align-items:center;padding:24px 12px}
.lbx[hidden]{display:none}
.lbx figure{margin:0;display:grid;gap:12px;justify-items:center}
.lbx img{max-width:100%;max-height:78vh;object-fit:contain;border-radius:4px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lbx.doc img{background:#fff;padding:8px}
.lbx figcaption{color:#dbe9f7;font-size:.95rem;text-align:center}
.lbx button{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:50%;width:44px;height:44px;font-size:1.6rem;line-height:1;cursor:pointer}
.lbx .lbx-x{position:absolute;top:16px;right:16px}
@media (max-width:560px){.lbx{grid-template-columns:40px minmax(0,1fr) 40px;padding:12px 4px}.lbx button{width:36px;height:36px}}

/* ---------- Art direction pass: fewer labels, larger type, real footage, surfaces by tone ---------- */
:root{--mono:var(--body)}
body{font-size:17px;line-height:1.6}
p{max-width:68ch}
::selection{background:var(--accent);color:var(--accent-ink)}
html{scrollbar-color:var(--muted) var(--bg);caret-color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* headings carry the section: no eyebrow labels above them */
/* small labels: sentence case at a readable size */
.pill,.plate .tag,.scene-box .tag,.drop .grp,.logo-txt small,.scene-cap,.tg{letter-spacing:0;text-transform:none;font-size:.8125rem}
.pill{font-weight:600}
.logo-txt small{font-size:.8125rem}
.drop .grp{font-weight:600}
.slide-no,.cap .no,.dwg{display:none}
.lede{font-size:1.18rem;color:var(--ink);opacity:.82}
.h-xl{font-size:clamp(2.6rem,6.4vw,5.6rem);line-height:.95;letter-spacing:-.01em}
.h-lg{font-size:clamp(2.1rem,4.2vw,3.6rem);line-height:1}
.hero > .wrap{grid-template-columns:minmax(0,760px)}
.sec{padding-block:clamp(56px,7vw,108px)}
/* surfaces separated by tone, not by lines, glass or shadows */
.scene-cap{backdrop-filter:none}
.ev-strip{background:var(--navy)}
.about-media .since span{color:inherit;opacity:.85}
.stats{border-top:0;gap:2px}
.stat{border-right:0;background:color-mix(in srgb,var(--on-navy) 5%,transparent)}
footer .bottom{border-top:0;background:color-mix(in srgb,#000 22%,var(--navy))}
.social a{border:0;background:color-mix(in srgb,var(--on-navy) 9%,transparent);font-size:.8125rem;width:32px;height:32px}
/* tilt photo captions */
.site-ph figcaption .tg{color:#cfe6ff;font-weight:600}
/* project film: full-bleed site footage */
.film{position:relative;min-height:min(86vh,760px);display:grid;align-items:end;overflow:hidden;background:#0b1a2c;color:#fff}
.film-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,12,24,0) 35%,rgba(4,12,24,.82) 100%);pointer-events:none}
.film .wrap{position:relative;z-index:2;width:100%;padding-block:0 clamp(40px,6vw,80px)}
.film-txt{max-width:720px;display:grid;gap:18px}
.film-txt h2{color:#fff}
.film-txt p{font-size:1.18rem;color:#e3eefa}
.film .btn.ghost{color:#fff;border-color:rgba(255,255,255,.7)}
/* footer close: the name at full width */
.foot-name{overflow:hidden;line-height:.8}
.foot-name .wrap{font-family:var(--display);font-weight:700;font-size:clamp(4rem,17.5vw,15.5rem);letter-spacing:-.01em;color:color-mix(in srgb,var(--on-navy) 12%,transparent);white-space:nowrap;padding-block:0 6px;user-select:none}
.crumbs,.brandc .cat,.copy,.brandc .view,.ind-cap .more,.pc-cat,.ev-pill,.m3d-hint,.m3d-load,.prod .go,.feat .lbl,.badge-yrs span,.since span{letter-spacing:0;text-transform:none;font-size:.875rem;font-weight:600}
.feat p,.prod p{color:var(--ink);opacity:.78}
.ev-pill{background:var(--accent);color:var(--accent-ink)}
.stat > span{display:block}
.stat b{white-space:nowrap}
.logo-txt small{font-size:.72rem}
nav.main>ul>li>a{padding-inline:9px}.hdr-cta{gap:10px}header .logo{flex-shrink:0}
@media (min-width:981px) and (max-width:1180px){nav.main>ul>li>a{padding-inline:6px;font-size:.95rem;letter-spacing:.03em}.theme-tg span{display:none}.logo-txt small{display:none}}
/* footer logo: the 3D signage logo on a light plate (black and blue need a light ground on the navy footer) */
.logo3d{display:block;background:#fff;border-radius:6px;padding:10px 14px;max-width:340px}
.logo3d img{display:block;width:100%;height:auto}
.logo3d:hover{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- v2 hero: full-width site photos with a blue overlay ---------- */
.hero.hero-photo{background:#0b2647;color:#fff;--hero-ink:#fff}
.hero.hero-photo canvas{display:none}
.hero-ph{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;overflow:hidden}
.hero-ph.on{opacity:1}
.hero-ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 7s linear}
.hero-ph.on img{transform:scale(1)}
.hero.hero-photo::after{background:linear-gradient(90deg,rgba(9,32,72,.86) 0%,rgba(9,32,72,.62) 48%,rgba(9,32,72,.34) 100%)}
.hero.hero-photo > .wrap{min-height:clamp(560px,calc(100svh - 150px),880px);align-content:center;padding-block:96px 120px;grid-template-columns:minmax(0,900px)}
.hero.hero-photo .h-xl{font-size:clamp(2.8rem,7.4vw,6.6rem);color:#fff}
.hero.hero-photo .slide p{color:#e4eefa;font-size:clamp(1.05rem,1.4vw,1.3rem);max-width:60ch}
.hero.hero-photo .btn.ghost{color:#fff;border-color:rgba(255,255,255,.8)}
.hero.hero-photo .btn.ghost:hover{background:#fff;color:#0b2647}
.hero.hero-photo .scene-cap{background:rgba(9,32,72,.6);color:#fff}
.h-arr{position:absolute;top:50%;z-index:4;width:60px;height:60px;margin-top:-30px;border-radius:50%;border:1.5px solid rgba(255,255,255,.75);background:rgba(9,32,72,.25);color:#fff;display:grid;place-items:center;font-size:1.4rem;cursor:pointer;transition:background .2s,transform .2s}
.h-arr:hover{background:var(--accent);border-color:var(--accent)}
.h-prev{left:clamp(12px,2.5vw,40px)}.h-prev .svg-i{transform:rotate(180deg)}
.h-next{right:clamp(12px,2.5vw,40px)}
@media (max-width:700px){.h-arr{top:auto;bottom:18px;margin:0;width:44px;height:44px}.h-prev{left:auto;right:72px}.h-next{right:16px}.hero.hero-photo > .wrap{min-height:clamp(520px,82svh,720px);padding-block:64px 96px}}
.scene-layer.hero-ph{inset:0;aspect-ratio:auto;height:auto}
@media (max-width:900px){.scene-layer.hero-ph{height:auto}.hero.hero-photo::after{display:block;background:linear-gradient(180deg,rgba(9,32,72,.55) 0%,rgba(9,32,72,.8) 100%)}.hero.hero-photo > .wrap{padding-bottom:110px}}

/* ===== v3: 3D banner (hex lens, angled shard, perspective floor) ===== */
.hero.hero-3d{--mx:0;--my:0;isolation:isolate}
.hero.hero-3d .scene-layer.hero-ph{inset:-3%;transform:translate3d(calc(var(--mx)*-14px),calc(var(--my)*-10px),0)}
.hero.hero-3d.hero-photo::after{background:linear-gradient(90deg,rgba(9,32,72,.5) 0%,rgba(9,32,72,.32) 55%,rgba(9,32,72,.18) 100%)}
.hero.hero-3d.hero-photo::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,rgba(7,26,60,.94) 0%,rgba(9,36,82,.86) 40%,rgba(9,36,82,.55) 100%);clip-path:polygon(0 0,66% 0,50% 100%,0 100%)}
.hero.hero-3d .h3-floor{position:absolute;left:-20%;right:-20%;bottom:0;height:46%;z-index:1;pointer-events:none;transform-origin:50% 100%;transform:perspective(520px) rotateX(64deg);background:repeating-linear-gradient(90deg,rgba(120,180,255,.3) 0 1px,transparent 1px 64px),repeating-linear-gradient(0deg,rgba(120,180,255,.3) 0 1px,transparent 1px 64px);-webkit-mask-image:linear-gradient(0deg,#000 0%,transparent 85%);mask-image:linear-gradient(0deg,#000 0%,transparent 85%);animation:h3floor 5s linear infinite;opacity:.55}
@keyframes h3floor{to{background-position:0 0,0 64px}}
.hero.hero-3d::before,.hero.hero-3d .h3-floor{will-change:auto}
.h3-stage{position:absolute;z-index:2;right:max(8vw,calc((100vw - 1320px)/2 + 10px));top:50%;width:clamp(320px,31vw,540px);aspect-ratio:100/87;margin-top:calc(clamp(320px,31vw,540px)*-.435 - 20px);perspective:1100px;pointer-events:none;animation:h3float 9s ease-in-out infinite}
@keyframes h3float{50%{translate:0 -14px}}
.h3-hex{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(calc(-16deg + var(--mx)*14deg)) rotateX(calc(7deg - var(--my)*10deg))}
.h3-hex > *{position:absolute;inset:0}
.h3-face,.h3-e{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.h3-e{background:linear-gradient(135deg,#5c7aa6,#1b3460 55%,#0a1a36)}
.h3-e:nth-child(1){transform:translateZ(-30px)}.h3-e:nth-child(2){transform:translateZ(-20px)}.h3-e:nth-child(3){transform:translateZ(-10px);background:linear-gradient(135deg,#8fb0dc,#2a4a80 55%,#0d2246)}
.h3-face{background:#0b2647;overflow:hidden}
.h3-face img{position:absolute;inset:-8%;width:116%;height:116%;object-fit:cover;opacity:0;transform:scale(1.15) translate3d(calc(var(--mx)*12px),calc(var(--my)*9px),0);transition:opacity .9s,transform 1.2s cubic-bezier(.2,.8,.2,1);filter:saturate(1.15) contrast(1.05)}
.h3-face img.on{opacity:1;transform:scale(1) translate3d(calc(var(--mx)*12px),calc(var(--my)*9px),0)}
.h3-face::after{content:"";position:absolute;inset:0;background:linear-gradient(calc(110deg + var(--mx)*25deg),rgba(255,255,255,.28) 0%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 62%,rgba(232,98,26,.22) 100%);mix-blend-mode:screen}
.h3-ring{overflow:visible;transform:translateZ(46px) scale(1.1);fill:none;stroke:rgba(255,255,255,.75);stroke-width:.5;stroke-dasharray:18 6;animation:h3dash 14s linear infinite;filter:drop-shadow(0 0 6px rgba(120,180,255,.6))}
@keyframes h3dash{to{stroke-dashoffset:-240}}
.h3-chip{position:absolute;display:grid;gap:2px;padding:12px 18px;border-radius:14px;background:rgba(11,38,71,.55);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;box-shadow:0 18px 40px rgba(0,0,0,.35);transform:translate3d(calc(var(--mx)*-22px),calc(var(--my)*-16px),0);white-space:nowrap}
.h3-chip b{font-size:1.15rem;line-height:1.1}
.h3-chip span{font-size:.85rem;color:#cfe0f5}
.h3-chip.c1{left:-12%;bottom:6%}
.h3-chip.c2{right:-6%;top:-4%}
.h3-chip.c1::before,.h3-chip.c2::before{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--accent);top:-4px;left:18px;box-shadow:0 0 0 4px rgba(232,98,26,.25)}
.hero.hero-3d .slide h1 span{perspective:700px}
.hero.hero-3d .slide h1 span i{transform:translateY(100%) rotateX(-75deg);transform-origin:50% 100%;opacity:0;transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity .6s}
.hero.hero-3d .slide.on h1 span i{transform:none;opacity:1}
.hero.hero-3d .h-arr{border:0;border-radius:0;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);width:64px;height:56px;margin-top:-28px;background:rgba(255,255,255,.16)}
.hero.hero-3d .h-arr:hover{background:var(--accent)}
@media (min-width:1101px){.hero.hero-3d > .wrap{grid-template-columns:minmax(0,min(800px,52vw))}.hero.hero-3d .h-xl{font-size:clamp(2.8rem,5.4vw,6rem)}}
@media (max-width:1100px){.h3-stage{display:none}.hero.hero-3d::before{clip-path:polygon(0 0,100% 0,78% 100%,0 100%)}}
@media (max-width:900px){.hero.hero-3d::before{display:none}.hero.hero-3d .h-arr{margin:0;width:50px;height:44px}}
@media (prefers-reduced-motion:reduce){.hero.hero-3d .h3-floor,.h3-stage,.h3-ring{animation:none}.hero.hero-3d .slide h1 span i{opacity:1}}

/* ===== v2.2: page banners with photo, angled panel, grid floor and hexagon lens ===== */
.banner.banner-3d{--mx:0;--my:0;background:#0b2647;color:#fff;isolation:isolate}
.banner.banner-3d::after{display:none}
.banner-3d .bn-bg{position:absolute;inset:-4%;z-index:0;transform:translate3d(calc(var(--mx)*-12px),calc(var(--my)*-8px),0)}
.banner-3d .bn-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(1.1);animation:bnzoom 18s ease-out both}
@keyframes bnzoom{from{transform:scale(1.12)}to{transform:scale(1)}}
.banner-3d::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(7,26,60,.9) 0%,rgba(9,36,82,.72) 42%,rgba(9,36,82,.25) 100%)}
.banner-3d .bn-bg::after{content:"";position:absolute;inset:0;background:rgba(9,32,72,.42)}
.banner-3d .h3-floor{position:absolute;left:-20%;right:-20%;bottom:0;height:55%;z-index:1;pointer-events:none;transform-origin:50% 100%;transform:perspective(420px) rotateX(64deg);background:repeating-linear-gradient(90deg,rgba(120,180,255,.3) 0 1px,transparent 1px 56px),repeating-linear-gradient(0deg,rgba(120,180,255,.3) 0 1px,transparent 1px 56px);-webkit-mask-image:linear-gradient(0deg,#000,transparent 85%);mask-image:linear-gradient(0deg,#000,transparent 85%);animation:h3floor 5s linear infinite;opacity:.5}
.banner-3d > .wrap{position:relative;z-index:2;min-height:clamp(340px,40vw,470px);align-content:center;padding-block:clamp(64px,8vw,104px)}
.banner-3d h1{font-size:clamp(2.4rem,5.4vw,4.6rem);color:#fff;max-width:min(760px,56vw)}
.banner-3d .lede{color:#dbe7f6;font-size:clamp(1.02rem,1.3vw,1.2rem);max-width:min(620px,52vw)}
.banner-3d .crumbs,.banner-3d .crumbs a{color:#cfe0f5}
.banner-3d .crumbs span{color:#fff}
.h3-stage.bn-lens{width:clamp(240px,24vw,380px);margin-top:calc(clamp(240px,24vw,380px)*-.435);right:max(7vw,calc((100vw - 1320px)/2 + 20px))}
@media (max-width:900px){.h3-stage.bn-lens{display:none}.banner-3d::before{clip-path:none;background:linear-gradient(90deg,rgba(7,26,60,.92),rgba(9,36,82,.6))}.banner-3d h1,.banner-3d .lede{max-width:none}.banner-3d > .wrap{min-height:300px}}
@media (prefers-reduced-motion:reduce){.banner-3d .h3-floor,.banner-3d .bn-bg img{animation:none}}

/* v2.2: cards keep their rounded corners, icons and lift on hover */
.cap .ic,.feat .ic{display:grid}
.cap{border-radius:14px}
.feat,.prod,.card,.ev-card,.mp-sec,.strength{border-radius:14px}
.cap:hover,.feat:hover,.prod:hover,.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(9,32,72,.16)}
.cap,.feat,.prod,.card{transition:transform .25s ease,box-shadow .25s ease,background .25s}
.caps{gap:18px;background:none;border:0}.cap{border:1px solid var(--line)}

/* v2.2 home banner: the v1 drawn power / oil & gas / desalination scenes, full width and taller, with the photo hexagon in 3D */
.hero.hero-drawn > .wrap{min-height:clamp(560px,calc(100svh - 150px),860px);align-content:center;padding-block:80px 150px}
.hero.hero-drawn .scene-layer{transform:translate3d(calc(var(--mx)*-18px),calc(var(--my)*-6px),0) scale(1.03);transform-origin:50% 100%}
.hero.hero-drawn .h-xl{font-size:clamp(2.8rem,5.6vw,6rem)}
.hero.hero-drawn .h-arr{color:var(--hero-ink);background:color-mix(in srgb,var(--hero-ink) 14%,transparent)}
.hero.hero-drawn .h-arr:hover{background:var(--accent);color:#fff}
.hero.hero-drawn .h3-floor{display:none}
.hero.hero-drawn .h3-stage{top:44%}
.hero.hero-drawn .h3-chip{background:color-mix(in srgb,var(--navy) 72%,transparent)}
@media (max-width:1100px){.hero.hero-drawn > .wrap{padding-bottom:42vw}}
@media (max-width:700px){.hero.hero-drawn > .wrap{min-height:0;padding-block:48px 62vw}}
header.site .wrap{max-width:1360px}@media (max-width:1440px){.hdr-call > span{display:none}}

/* ===== v2.2 site-wide depth: tilting tiles, curved bands, 3D reveals ===== */
.tilt.tilt-self{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s;position:relative}
.tilt.tilt-self.on{transition:transform .08s linear,box-shadow .3s;box-shadow:0 24px 50px rgba(8,26,48,.22)}
.tilt.tilt-self::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(circle at var(--gx) var(--gy),rgba(255,255,255,.35),transparent 55%);mix-blend-mode:soft-light;z-index:3}
.tilt.tilt-self.on::after{opacity:1}
.cap:hover,.feat:hover,.prod:hover,.card:hover{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-4px)}
.rv.pre{transform:perspective(1000px) translateY(46px) rotateX(12deg);opacity:0;transform-origin:50% 100%}
/* curved, inset colour bands instead of edge-to-edge rectangles */
.band-navy,.band-steel{border-radius:clamp(26px,4vw,56px);margin-inline:clamp(0px,1.2vw,18px);position:relative;overflow:hidden}
.band-navy::before{content:"";position:absolute;width:min(60vw,720px);aspect-ratio:1;right:-18%;top:-30%;border-radius:50%;background:radial-gradient(circle,rgba(47,140,255,.28),transparent 65%);pointer-events:none}
.band-navy > .wrap{position:relative}
/* call-to-action: a rounded glowing panel with hexagon rings */
.cta-band{background:none;padding-block:clamp(28px,4vw,56px)}
.cta-band .wrap{position:relative;overflow:hidden;border-radius:clamp(22px,3vw,40px);background:linear-gradient(120deg,#0a5bd6 0%,#1f7cf0 55%,#0b2f6b 100%);color:#fff;padding:clamp(32px,4vw,56px) clamp(24px,4vw,64px);box-shadow:0 30px 70px rgba(10,60,150,.3)}
.cta-band .wrap::before,.cta-band .wrap::after{content:"";position:absolute;aspect-ratio:100/87;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);pointer-events:none}
.cta-band .wrap::before{width:260px;right:6%;top:-90px;background:rgba(255,255,255,.12);animation:ctaspin 18s linear infinite}
.cta-band .wrap::after{width:150px;right:24%;bottom:-70px;background:rgba(255,255,255,.08);animation:ctaspin 24s linear infinite reverse}
@keyframes ctaspin{to{rotate:360deg}}
.cta-band h2,.cta-band .kicker{color:#fff;position:relative;z-index:1}
.cta-band .btn{position:relative;z-index:1;border-radius:999px;background:#fff;color:#0b2f6b;border-color:#fff}
.cta-band .btn:hover{background:#0b2647;color:#fff;border-color:#0b2647}
/* FAQ: soft rounded questions with an accent edge when open */
.faq details{border-radius:18px;transition:border-color .25s,box-shadow .25s,transform .25s}
.faq details[open]{box-shadow:0 16px 36px rgba(9,32,72,.12);background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 8%,var(--surface)),var(--surface) 40%)}
.faq details:hover{transform:translateX(4px)}
/* buttons get rounded ends */
.btn{border-radius:999px}
/* "since 1997" badge becomes a floating 3D card */
.about-media .since{background:linear-gradient(135deg,#0a5bd6,#0b2647);color:#fff;border:0;border-radius:20px;padding:20px 26px;box-shadow:0 26px 60px rgba(9,32,72,.35),inset 0 1px 0 rgba(255,255,255,.25);animation:sincefloat 6s ease-in-out infinite}
.about-media .since b{font-size:3rem;background:linear-gradient(180deg,#fff,#9cc8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.about-media .since span{color:#d6e6fb}
@keyframes sincefloat{50%{translate:0 -10px}}
.about-media .frame{border-radius:28px;border-width:3px}
.about-media .plate{border-radius:24px;overflow:hidden}
/* product tiles drift gently and lift on hover */
.prod{border-radius:22px}
.prods .prod{animation:drift 7s ease-in-out infinite}
.prods .prod:nth-child(2n){animation-delay:-2.3s}.prods .prod:nth-child(3n){animation-delay:-4.1s}
@keyframes drift{50%{translate:0 -8px}}
.prod .plate img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.prod:hover .plate img{transform:scale(1.08)}
.stat{border-radius:18px}
@media (prefers-reduced-motion:reduce){.prods .prod,.about-media .since,.cta-band .wrap::before,.cta-band .wrap::after{animation:none}}
/* stats: big counters */
.stats .stat{padding:26px 24px;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12)}
.stats .stat b{display:flex;align-items:flex-start;gap:2px;font-family:var(--display);font-size:clamp(2.6rem,4.2vw,3.6rem);line-height:1;color:#fff}
.stats .stat b span{display:inline;font:inherit;color:inherit}
.stats .stat b em{font-style:normal;color:var(--accent);font-size:.6em;line-height:1}
.stats .stat > span{color:var(--on-navy-muted);font-size:.95rem}
.prod p{color:var(--on-navy-muted);opacity:1}
/* 3D equipment: model cards with a progress line, the model flies in on each change */
.m3d-tabs{gap:12px}
.m3d-tabs button{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s,background .25s}
.m3d-tabs button:hover{transform:translateX(6px)}
.m3d-tabs .mt-ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;background:var(--accent-soft);color:var(--accent);transition:.25s}
.m3d-tabs .mt-tx{display:grid;gap:2px}.m3d-tabs .mt-tx b{font-size:1.02rem}.m3d-tabs .mt-tx small{font-weight:500;opacity:.7;font-size:.82rem}
.m3d-tabs button.on{background:linear-gradient(120deg,#0a5bd6,#1f7cf0);color:#fff;box-shadow:0 16px 36px rgba(10,91,214,.32);border-color:transparent}
.m3d-tabs button.on .mt-ic{background:rgba(255,255,255,.18);color:#fff;transform:rotate(-8deg) scale(1.06)}
.m3d-tabs .mt-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:#fff;transform:scaleX(0);transform-origin:left}
.m3d-tabs button.on .mt-bar{animation:mtbar 7s linear forwards}
.m3d.picked .mt-bar{display:none}
@keyframes mtbar{to{transform:scaleX(1)}}
.m3d-stage{border-radius:28px;box-shadow:0 30px 70px rgba(9,32,72,.25)}
.m3d-info{animation:infoin .6s cubic-bezier(.2,.8,.2,1)}
@keyframes infoin{from{opacity:0;transform:translateY(14px)}}

/* About: time travel through three decades */
.tt{position:relative;background:radial-gradient(ellipse at 20% 0%,#123d7a,#071a38 70%);color:#fff;border-radius:clamp(26px,4vw,56px);margin:0 clamp(0px,1.2vw,18px)}
.tt-pin{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;align-content:center;gap:clamp(20px,4vh,44px)}
.tt-head h2{color:#fff}
.tt-track{display:flex;gap:clamp(20px,3vw,40px);padding-inline:max(24px,calc((100vw - 1200px)/2));will-change:transform;position:relative;align-items:flex-start}
.tt-line{position:absolute;left:0;right:0;top:calc(clamp(150px,22vh,230px) + 22px);height:2px;background:rgba(255,255,255,.15)}
.tt-line i{position:absolute;inset:0;background:linear-gradient(90deg,#1f7cf0,#7fd0ff);transform:scaleX(0);transform-origin:left;box-shadow:0 0 14px #2f8cff}
.tt-card{flex:none;width:clamp(260px,26vw,360px);display:grid;gap:10px;opacity:.35;transform:perspective(900px) rotateY(-14deg) scale(.92);transition:opacity .6s,transform .8s cubic-bezier(.2,.8,.2,1)}
.tt-card.on{opacity:1;transform:none}
.tt-ph{height:clamp(150px,22vh,230px);border-radius:20px;overflow:hidden;box-shadow:0 24px 50px rgba(0,0,0,.4)}
.tt-ph img{width:100%;height:100%;object-fit:cover}
.tt-y{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,4.4vw,4rem);line-height:1;margin-top:14px;background:linear-gradient(180deg,#fff,#7fb8ff);-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;padding-top:18px}
.tt-y::before{content:"";position:absolute;left:0;top:-4px;width:14px;height:14px;border-radius:50%;background:#2f8cff;box-shadow:0 0 0 6px rgba(47,140,255,.25)}
.tt-card h3{font-size:1.35rem;color:#fff}
.tt-card p{color:#c9dbf2;font-size:.98rem}
@media (max-width:900px),(prefers-reduced-motion:reduce){.tt-pin{position:static;height:auto;padding-block:56px}.tt-track{flex-direction:column;padding-inline:16px}.tt-card{width:auto;opacity:1;transform:none}.tt-line{display:none}}
/* About: certificates fan out, awards as real photos */
.certs .cert{border-radius:20px}
.aw-h{margin:48px 0 18px;text-align:center}
.aw-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;perspective:1200px}
.aw{margin:0;border-radius:18px;overflow:hidden;background:var(--surface);box-shadow:0 14px 34px rgba(9,32,72,.14);transform:rotateY(calc((var(--n,0)) * 1deg));transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.aw:nth-child(1){transform:rotateY(18deg)}.aw:nth-child(2){transform:rotateY(9deg)}.aw:nth-child(4){transform:rotateY(-9deg)}.aw:nth-child(5){transform:rotateY(-18deg)}
.aw:hover{transform:translateY(-10px) scale(1.04);box-shadow:0 28px 60px rgba(9,32,72,.28);z-index:2}
.aw img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.aw figcaption{padding:12px 14px;font-weight:600;font-size:.92rem}
@media (max-width:900px){.aw-row{grid-template-columns:repeat(2,minmax(0,1fr))}.aw{transform:none!important}}
.tt-pin{grid-template-columns:100%}.tt-track{width:max-content}
.tt-head{width:100%;box-sizing:border-box}

/* header: event ticket stands apart from the contact row, larger logo, softer edges */
.ev-strip{background:linear-gradient(180deg,#06152e,var(--navy));padding:8px 0 6px}
.ev-strip .wrap{min-height:0;padding-block:0}
.ev-strip .wrap{position:relative}
.ev-strip .wrap::before{content:"";position:absolute;inset:0 max(8px,calc(env(safe-area-inset-right,0px) + 8px)) 0 max(8px,calc(env(safe-area-inset-left,0px) + 8px));border-radius:999px;background:linear-gradient(100deg,#0a5bd6,#1f7cf0 45%,#12a4c9);box-shadow:0 8px 24px rgba(10,91,214,.35),inset 0 1px 0 rgba(255,255,255,.25);z-index:0;overflow:hidden}
.ev-strip .wrap::after{content:"";position:absolute;top:0;bottom:0;left:max(8px,env(safe-area-inset-left,0px));width:30%;border-radius:999px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);animation:evshine 4.5s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes evshine{0%{transform:translateX(-40%);opacity:0}30%{opacity:1}70%{opacity:1}100%{transform:translateX(280%);opacity:0}}
.ev-strip .wrap > *{position:relative;z-index:1}
.ev-strip .wrap{padding:9px 22px}
.ev-strip .ev-dot{margin-left:8px}
.ev-cd{background:#fff!important;color:#0a3f99!important;font-weight:700;letter-spacing:0;text-transform:none;font-size:.78rem;white-space:nowrap}
.ev-go{background:rgba(255,255,255,.18);padding:5px 14px;border-radius:999px;transition:background .2s}
.ev-go:hover{background:#fff;color:#0a3f99}
.topbar{background:var(--navy)}
.topbar .wrap{min-height:34px}
header.site{border-radius:0 0 22px 22px;box-shadow:0 10px 30px rgba(9,32,72,.10);border-bottom:0}
header.site .wrap{min-height:84px}
header .logo-img{height:68px}
@media (max-width:1180px){header .logo-img{height:60px}}
@media (max-width:480px){header .logo-img{height:46px}.ev-strip .wrap{padding:8px 14px}.ev-cd{display:none}}
@media (prefers-reduced-motion:reduce){.ev-strip .wrap::after{animation:none;display:none}}

/* colour options */
.swatches{display:flex;gap:6px;align-items:center;margin-right:10px}
.swatches button{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.55);background:var(--sw);cursor:pointer;padding:0;transition:transform .2s}
.swatches button:hover{transform:scale(1.2)}
.swatches button[aria-pressed="true"]{border-color:#fff;box-shadow:0 0 0 2px var(--sw)}
:root[data-accent="navy"]{--accent:#1a3f8f;--accent-soft:#e1e8f6;--accent-2:#4f7fe0}
:root[data-accent="sky"]{--accent:#0891d1;--accent-soft:#dff2fb;--accent-2:#5cc8f5}
:root[data-accent="teal"]{--accent:#0e8fa0;--accent-soft:#dcf1f4;--accent-2:#3fc6d6}
:root[data-theme="dark"][data-accent="navy"]{--accent:#6f9bff;--accent-soft:#132449}
:root[data-theme="dark"][data-accent="sky"]{--accent:#45c3f5;--accent-soft:#082d40}
:root[data-theme="dark"][data-accent="teal"]{--accent:#35c9d9;--accent-soft:#0a3238}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"])[data-accent="navy"]{--accent:#6f9bff;--accent-soft:#132449}:root:not([data-theme="light"])[data-accent="sky"]{--accent:#45c3f5;--accent-soft:#082d40}:root:not([data-theme="light"])[data-accent="teal"]{--accent:#35c9d9;--accent-soft:#0a3238}}
.side-box{border-radius:22px}
.side-nav a{border-radius:12px}
.need-help,.side-help,.side-box.dark{border-radius:22px}
html,body{overflow-x:clip}

/* ===== online brochure v2.3: all blue, popped-out 3D cards ===== */
.bro-cover,.bro-body,.bro-qhse{--accent:#0a6fd6;--accent-2:#38b6ff;--accent-soft:#e2effc}
.bro-cover{--mx:0;--my:0;position:relative;overflow:hidden;color:#eaf2fb;padding:clamp(48px,6vw,84px) 0 clamp(70px,8vw,120px);
  background:radial-gradient(120% 90% at 85% 10%,#1d64c4 0,transparent 55%),radial-gradient(90% 80% at 0% 100%,#0a3a7a 0,transparent 60%),linear-gradient(160deg,#061a36,#0b2c5c 55%,#0d3d7c);border-radius:0 0 48px 48px}
.bro-grid{position:absolute;inset:-20% -10% 0;background-image:linear-gradient(rgba(120,180,255,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(120,180,255,.13) 1px,transparent 1px);background-size:46px 46px;transform:perspective(700px) rotateX(58deg) translateY(calc(30% + var(--my)*14px)) translateX(calc(var(--mx)*-18px));transform-origin:50% 100%;mask-image:linear-gradient(transparent,#000 40%,#000 80%,transparent);animation:broGrid 18s linear infinite}
@keyframes broGrid{to{background-position:0 460px}}
.bro-cover .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:center}
.bro-cover .crumbs,.bro-cover .crumbs a{color:#a9c6ea}.bro-cover .crumbs span{color:#fff}
.bro-cover .kicker{color:#7fd0ff;margin-top:18px}
.bro-cover .lede{color:#c6daf2;max-width:520px}
.bro-cover .btn.ghost{color:#fff}.bro-cover .btn.ghost:hover{background:#fff;color:#0b2c5c;border-color:#fff}
.bro-title{font-family:var(--display);text-transform:uppercase;font-size:clamp(2.6rem,6.2vw,5.2rem);line-height:.95;margin:16px 0 18px;perspective:900px}
.bro-title span{display:block;transform-origin:0 50%;transform:rotateY(calc(-14deg + var(--mx)*8deg)) rotateX(calc(var(--my)*-6deg)) translateZ(0);
  color:#fff;text-shadow:1px 1px 0 #9cc9ff,2px 2px 0 #6aa7f0,3px 3px 0 #3f86de,4px 4px 0 #2a6cc4,5px 5px 0 #1d58a8,6px 6px 0 #164a91,10px 14px 24px rgba(0,10,30,.55);animation:broIn 1s cubic-bezier(.2,.8,.2,1) both}
.bro-title span:nth-child(2){animation-delay:.12s;color:#cfe6ff}.bro-title span:nth-child(3){animation-delay:.24s;background:linear-gradient(90deg,#7fd0ff,#ffffff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(4px 5px 0 #1d58a8) drop-shadow(8px 12px 14px rgba(0,10,30,.5))}
@keyframes broIn{from{opacity:0;transform:rotateY(-60deg) translateX(-40px)}}
.bro-book{position:relative;height:clamp(320px,34vw,440px);perspective:1200px;transform-style:preserve-3d}
.bro-pg{position:absolute;top:6%;left:18%;width:62%;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:#0b2c5c;border:1px solid rgba(160,205,255,.35);
  transform:rotateY(calc(-26deg + var(--mx)*10deg)) rotateX(calc(8deg + var(--my)*-6deg)) translateZ(var(--z)) translateX(var(--x));box-shadow:0 30px 60px rgba(0,8,24,.55);transition:transform .25s}
.bro-pg img{width:100%;height:100%;object-fit:cover;filter:saturate(.55) brightness(1.1)}
.bro-pg i{position:absolute;inset:0;background:linear-gradient(160deg,rgba(29,100,196,.25),rgba(6,26,54,.45));mix-blend-mode:multiply}
.bro-pg.p0{--z:-150px;--x:-46%}.bro-pg.p1{--z:-80px;--x:-22%}.bro-pg.p2{--z:-10px;--x:2%}
.bro-pg.p3{--z:70px;--x:30%;width:54%;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;gap:4px;background:linear-gradient(165deg,rgba(14,70,150,.92),rgba(5,22,48,.96));backdrop-filter:blur(4px);animation:broFloat 6s ease-in-out infinite}
.bro-pg.p3 b{font-family:var(--display);font-size:2rem;letter-spacing:.06em;color:#fff}.bro-pg.p3 span{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:#7fd0ff}.bro-pg.p3 em{font-style:normal;color:#c6daf2;font-size:.85rem}
.bro-pg.p3::before{content:"";position:absolute;top:22px;left:22px;width:46px;height:40px;background:#38b6ff;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);opacity:.9}
@keyframes broFloat{50%{translate:0 -12px}}
.bro-body{margin-top:-64px;position:relative;z-index:2;padding-top:0}
.bro-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.bro-stat{background:linear-gradient(160deg,#ffffff,#eaf3fd);border-radius:20px;padding:22px 22px 20px;border:1px solid #cfe1f5;box-shadow:0 2px 0 #b9d3f0,0 6px 0 #9fc2ea,0 22px 40px rgba(10,60,130,.18)}
.bro-stat b{display:block;font-family:var(--display);font-size:clamp(2.2rem,3.6vw,3rem);line-height:1;color:#0a6fd6;text-shadow:2px 2px 0 #cfe6ff,4px 4px 0 #a9cdf5}
.bro-stat span{display:block;margin-top:6px;color:#3b5a7d;font-size:.9rem}
.bro-intro{max-width:820px;margin:44px 0 10px}
.bro-list{display:grid;gap:clamp(48px,6vw,80px);margin-top:44px}
.bro-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;perspective:1400px}
.bro-card.flip .bro-ph{order:2}
.bro-ph{position:relative;margin:0;border-radius:24px;overflow:hidden;aspect-ratio:4/3;z-index:2;box-shadow:0 30px 60px rgba(8,40,90,.32),0 0 0 6px #fff,0 0 0 7px #cfe1f5}
.bro-ph img{width:100%;height:100%;object-fit:cover;filter:saturate(.6) contrast(1.06) brightness(1.04)}
.bro-ph::before{content:"";position:absolute;inset:0;background:linear-gradient(170deg,rgba(20,90,190,.28),rgba(4,24,56,.55));mix-blend-mode:color;opacity:.72;z-index:1}
.bro-ph figcaption{position:absolute;left:0;bottom:0;right:0;padding:40px 18px 16px;background:linear-gradient(transparent,rgba(4,22,52,.82));z-index:2;color:#fff;font-weight:600;display:flex;flex-direction:column;gap:4px;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.bro-ph figcaption span{align-self:flex-start;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;background:#0a6fd6;padding:4px 10px;border-radius:999px;text-shadow:none}
.bro-tx{position:relative;background:linear-gradient(165deg,#ffffff,#f0f6fe);border:1px solid #d3e3f5;border-radius:24px;padding:clamp(26px,3vw,40px);margin-left:-40px;padding-left:calc(clamp(26px,3vw,40px) + 40px);
  box-shadow:0 3px 0 #c4daf2,0 8px 0 #a6c6ea,0 28px 50px rgba(10,60,130,.16)}
.bro-card.flip .bro-tx{margin-left:0;margin-right:-40px;padding-left:clamp(26px,3vw,40px);padding-right:calc(clamp(26px,3vw,40px) + 40px)}
.bro-no{position:absolute;top:-56px;right:22px;font-family:var(--display);font-size:4.8rem;line-height:1;color:#fff;-webkit-text-stroke:2px #0a6fd6;text-shadow:3px 3px 0 #cfe6ff,6px 6px 0 #9fc8f2;transform:translateZ(40px)}
.bro-card.flip .bro-no{right:auto;left:22px}
.bro-tx h2{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.6rem,2.4vw,2.1rem);margin:8px 0 10px;color:#0b2647}
.bro-tx p{color:#3b5a7d}
.bro-tags{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.bro-tags li{display:inline-flex;align-items:center;gap:6px;background:#e2effc;color:#0a4f9c;border-radius:999px;padding:6px 12px 6px 8px;font-size:.82rem;font-weight:600;box-shadow:0 2px 0 #bcd6f2}
.bro-tags .svg-i{width:16px;height:16px}
.bro-qhse{background:linear-gradient(180deg,transparent,#e2edf8);border-radius:48px 48px 0 0}
.bro-awards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.bro-aw{margin:0;background:#fff;border-radius:20px;padding:12px 12px 0;border:1px solid #d3e3f5;box-shadow:0 3px 0 #c4daf2,0 8px 0 #a6c6ea,0 24px 44px rgba(10,60,130,.18)}
.bro-aw img{width:100%;aspect-ratio:4/3;object-fit:contain;border-radius:12px;background:#f4f8fc}
.bro-aw figcaption{padding:12px 4px 14px;font-weight:600;font-size:.88rem;color:#0b2647}
:root[data-theme="dark"] .bro-stat,:root[data-theme="dark"] .bro-tx,:root[data-theme="dark"] .bro-aw{background:linear-gradient(165deg,#10243f,#0b1a2e);border-color:#1d3a5f;box-shadow:0 3px 0 #163a66,0 8px 0 #0f2b4f,0 26px 46px rgba(0,0,0,.45)}
:root[data-theme="dark"] .bro-tx h2,:root[data-theme="dark"] .bro-aw figcaption{color:#e6eef8}:root[data-theme="dark"] .bro-tx p,:root[data-theme="dark"] .bro-stat span{color:#a9c0da}
:root[data-theme="dark"] .bro-stat b{color:#5fb6ff;text-shadow:2px 2px 0 #12345e,4px 4px 0 #0b2647}
:root[data-theme="dark"] .bro-no{color:#0e1b2c;-webkit-text-stroke-color:#3da5ff;text-shadow:3px 3px 0 #12345e,6px 6px 0 #0b2647}
:root[data-theme="dark"] .bro-tags li{background:#0d2a48;color:#9fd2ff;box-shadow:0 2px 0 #12345e}
:root[data-theme="dark"] .bro-qhse{background:linear-gradient(180deg,transparent,#0b1a2e)}
@media (max-width:900px){.bro-cover .wrap{grid-template-columns:minmax(0,1fr)}.bro-book{height:300px;max-width:420px}.bro-stats,.bro-awards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bro-card,.bro-card.flip{grid-template-columns:minmax(0,1fr)}.bro-card.flip .bro-ph{order:0}
  .bro-tx,.bro-card.flip .bro-tx{margin:-36px 12px 0;padding:44px 22px 24px}.bro-no{font-size:3.6rem;top:-44px}}
@media (prefers-reduced-motion:reduce){.bro-title span,.bro-pg.p3,.bro-grid{animation:none}}

/* brands: running logo trail (two rows, opposite directions) + category groups */
.trail{position:relative;display:grid;gap:14px;padding:22px 0;margin-bottom:28px;border-radius:24px;background:linear-gradient(160deg,#eaf3fd,#dbe9f8);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.trail-row{overflow:hidden}
.trail-in{display:flex;gap:14px;width:max-content;animation:trail 70s linear infinite}
.trail-row.rev .trail-in{animation-direction:reverse;margin-left:-90px}
.trail:hover .trail-in{animation-play-state:paused}
@keyframes trail{to{transform:translateX(-50%)}}
.trail-chip{flex:none;width:168px;height:84px;display:grid;place-items:center;padding:12px 16px;background:#fff;border-radius:16px;border:1px solid #d3e3f5;box-shadow:0 3px 0 #c4daf2,0 10px 20px rgba(10,60,130,.10);transition:transform .3s,box-shadow .3s;text-decoration:none}
.trail-row:not(.rev) .trail-chip:nth-child(even),.trail-row.rev .trail-chip:nth-child(odd){transform:translateY(6px)}
.trail-chip:hover{transform:translateY(-4px) scale(1.04);box-shadow:0 6px 0 #a6c6ea,0 16px 28px rgba(10,60,130,.18)}
.trail-chip img{max-width:100%;max-height:52px;object-fit:contain}
.trail-chip b{font-family:var(--display);font-size:1.05rem;letter-spacing:.04em;color:#0b2647;text-align:center;line-height:1.05;text-transform:uppercase}
.trail-chip img + b,.btile .bt-logo img + b{display:none}
.brand-filter button small{opacity:.6;font-size:.75em;margin-left:2px}
#bgrid{display:grid;gap:34px}
.bcat header{display:flex;align-items:center;gap:12px;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid var(--accent-soft)}
.bcat-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(150deg,#1f78e0,#0b2c5c);color:#fff;box-shadow:2px 2px 0 #9fc8f2,4px 4px 0 #cfe6ff}
.bcat-ic .svg-i{width:22px;height:22px}
.bcat h2{font-family:var(--display);text-transform:uppercase;font-size:1.5rem;margin:0}
.bcat header small{margin-left:auto;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.btiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.btile{display:grid;grid-template-rows:84px auto;gap:8px;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:18px;text-decoration:none;color:var(--ink);box-shadow:0 3px 0 #d3e3f5,0 10px 22px rgba(10,60,130,.08)}
.btile:hover{border-color:var(--accent)}
.bt-logo{display:grid;place-items:center;background:#fff;border-radius:12px;padding:8px}
.bt-logo img{max-width:100%;max-height:60px;object-fit:contain}
.bt-logo b{font-family:var(--display);font-size:1.15rem;letter-spacing:.04em;text-transform:uppercase;color:#0b2647;text-align:center;line-height:1.05}
.bt-nm{font-size:.8rem;font-weight:600;text-align:center;color:var(--muted);line-height:1.25}
:root[data-theme="dark"] .trail{background:linear-gradient(160deg,#0e2240,#0b1a2e)}
:root[data-theme="dark"] .btile{box-shadow:0 3px 0 #163a66,0 10px 22px rgba(0,0,0,.3)}
@media (max-width:560px){.trail-chip{width:132px;height:68px}.btiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.trail-in{animation:none}}
.trail-band{padding:clamp(28px,4vw,48px) 0 0}
.trail-band .trail{margin-bottom:0}
.btile:not(:has(img)) .bt-nm{display:none}.btile:not(:has(img)){grid-template-rows:84px}

/* banners: full width, taller (user 2026-10-19) */
body{margin:0}
.banner-3d > .wrap{min-height:clamp(420px,46vw,600px);padding-block:clamp(72px,9vw,120px) clamp(96px,11vw,160px)}
@media (max-width:900px){.banner-3d > .wrap{min-height:360px}}
.hero.hero-3d.hero-drawn > .wrap{min-height:clamp(600px,52vw,740px)}
/* night mode: keep the original black-and-blue logo on a white plate (user 2026-10-19) */
:root[data-theme="dark"] header.site .logo .lt{display:block}
:root[data-theme="dark"] header.site .logo .dk{display:none}
:root[data-theme="dark"] header.site .logo{background:#fff;border-radius:14px;padding:3px 12px;box-shadow:0 0 0 1px rgba(160,200,255,.35),0 6px 18px rgba(0,0,0,.35)}
/* manpower intro: text + people collage */
.mp-intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,3vw,40px);align-items:center}
.mp-ticks{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:10px}
.mp-ticks li{display:flex;gap:10px;align-items:flex-start;font-weight:500}
.mp-ticks .svg-i{width:20px;height:20px;color:var(--accent);flex:none;margin-top:2px}
.mp-collage{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:150px;gap:12px}
.mpc{margin:0;position:relative;border-radius:18px;overflow:hidden;box-shadow:0 3px 0 #c4daf2,0 14px 28px rgba(10,60,130,.18)}
.mpc0{grid-row:span 2}.mpc3{grid-column:span 1}
.mpc img{width:100%;height:100%;object-fit:cover}
.mpc figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;color:#fff;font-size:.8rem;font-weight:600;background:linear-gradient(transparent,rgba(4,22,52,.85))}
@media (max-width:900px){.mp-intro{grid-template-columns:minmax(0,1fr)}.mp-collage{grid-auto-rows:120px}}
.mp-collage{align-self:stretch}
.mpc img{position:absolute;inset:0}
.mp-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:8px 0 28px}
.mp-strip > div{background:linear-gradient(160deg,#0f3d7a,#0b2647);color:#fff;border-radius:18px;padding:18px 18px 16px;box-shadow:0 3px 0 #1d58a8,0 14px 26px rgba(10,40,90,.22)}
.mp-strip b{display:block;font-family:var(--display);font-size:clamp(1.9rem,3vw,2.5rem);line-height:1;color:#7fd0ff}
.mp-strip span{display:block;margin-top:6px;font-size:.85rem;color:#cfe0f5}
.mp-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:34px}
.mp-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:300px;border-radius:20px;overflow:hidden;color:#fff;text-decoration:none;padding:18px;box-shadow:0 3px 0 #c4daf2,0 16px 30px rgba(10,60,130,.2)}
.mp-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.mp-card:hover img{transform:scale(1.06)}
.mp-card::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(4,22,52,.05) 25%,rgba(4,22,52,.88))}
.mp-card > :not(img){position:relative;z-index:2}
.mp-card .ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--accent);margin-bottom:auto}
.mp-card .ic .svg-i{width:22px;height:22px}
.mp-card h3{font-family:var(--display);text-transform:uppercase;font-size:1.4rem;margin:0 0 4px}
.mp-card p{font-size:.85rem;color:#dbe7f6;margin:0 0 8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mp-card .more{display:inline-flex;gap:6px;align-items:center;font-weight:600;font-size:.85rem;color:#7fd0ff}
.mp-card .more .svg-i{width:16px;height:16px}
@media (max-width:900px){.mp-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.mp-cards{grid-template-columns:minmax(0,1fr)}}
.mpc3{grid-column:span 2}
/* night mode: raised 3D logo badge, gently floating and tilting */
:root[data-theme="dark"] header.site .logo{position:relative;transform-style:preserve-3d;transform:perspective(700px) rotateX(8deg) rotateY(-10deg);border:1px solid #dbe7f7;box-shadow:1px 1px 0 #c7d6ea,2px 2px 0 #b3c6e0,3px 3px 0 #9fb6d6,4px 4px 0 #2f6fd6,5px 5px 0 #1f5bc0,6px 7px 0 #164aa3,0 18px 30px -6px rgba(0,0,0,.6),0 0 22px rgba(80,150,255,.35);animation:logo3d 6s ease-in-out infinite;transition:transform .4s}
:root[data-theme="dark"] header.site .logo::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.75) 46%,transparent 60%);background-size:250% 100%;background-position:150% 0;animation:logoshine 6s ease-in-out infinite}
:root[data-theme="dark"] header.site .logo:hover{animation-play-state:paused;transform:perspective(700px) rotateX(0) rotateY(0) translateY(-3px)}
@keyframes logo3d{0%,100%{transform:perspective(700px) rotateX(8deg) rotateY(-10deg) translateY(0)}50%{transform:perspective(700px) rotateX(4deg) rotateY(8deg) translateY(-4px)}}
@keyframes logoshine{0%,55%{background-position:150% 0}85%,100%{background-position:-60% 0}}
@media (prefers-reduced-motion:reduce){:root[data-theme="dark"] header.site .logo,:root[data-theme="dark"] header.site .logo::after{animation:none}}
/* ===== Contact page v2.3: 3D office map, help desks, office cards ===== */
.cmap-hero{position:relative;height:clamp(600px,76vh,780px);overflow:hidden;background:#a9d4f5;isolation:isolate}
:root[data-theme="dark"] .cmap-hero{background:#0b1a2e}
.cmap{position:absolute!important;inset:0;z-index:0}
.cmap-flat{position:absolute;inset:0;width:100%;height:100%}
.cmap.ready .cmap-flat{display:none}
.om-sea{fill:#a9d4f5}.om-land{fill:#ebe6db;stroke:#c9bfae;stroke-width:.25}.om-home{fill:#fbfaf6;stroke:#c9bfae;stroke-width:.25}
.om-dot{fill:var(--accent);stroke:#fff;stroke-width:.6}.om-oth{fill:var(--accent);opacity:.45}
.om-pulse{fill:var(--accent);opacity:.25;transform-box:fill-box;transform-origin:center;animation:ompulse 2.4s ease-out infinite}
@keyframes ompulse{0%{transform:scale(.4);opacity:.45}100%{transform:scale(1.6);opacity:0}}
:root[data-theme="dark"] .om-sea{fill:#0b1a2e}:root[data-theme="dark"] .om-land{fill:#17263b;stroke:#2c4566}:root[data-theme="dark"] .om-home{fill:#1d3150;stroke:#2c4566}
.cmap-veil{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(244,248,252,.55) 0,rgba(244,248,252,.15) 38%,transparent 55%),linear-gradient(0deg,rgba(11,38,71,.28),transparent 26%)}
:root[data-theme="dark"] .cmap-veil{background:linear-gradient(90deg,rgba(7,17,30,.6) 0,rgba(7,17,30,.2) 38%,transparent 55%),linear-gradient(0deg,rgba(2,8,20,.5),transparent 26%)}
.cmap-ui{position:relative;z-index:3;height:100%;display:flex;align-items:center;pointer-events:none;padding-bottom:70px}
.cmap-card{pointer-events:auto;max-width:500px;padding:30px 34px 32px;border-radius:28px;background:rgba(255,255,255,.84);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border:1px solid rgba(255,255,255,.9);box-shadow:0 2px 0 rgba(255,255,255,.8) inset,0 30px 60px -24px rgba(8,40,90,.55),0 10px 20px -10px rgba(8,40,90,.3);transform:perspective(1200px) rotateY(5deg) rotateX(2deg);transform-origin:left center;color:var(--ink)}
.cmap-card .crumbs{color:var(--muted)}
.cmap-card h1{margin:.25em 0 .2em;color:var(--navy);line-height:.95}
.cmap-card .lede{color:var(--muted);margin:0 0 16px}
:root[data-theme="dark"] .cmap-card{background:rgba(10,24,44,.82);border-color:rgba(120,170,230,.22);box-shadow:0 30px 60px -24px rgba(0,0,0,.8),0 0 0 1px rgba(80,150,255,.12)}
:root[data-theme="dark"] .cmap-card h1{color:#eaf2fb}
.cmap-open{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;padding:8px 14px;border-radius:40px;background:var(--accent-soft);font-size:.9rem;color:var(--ink)}
.cmap-open i{width:10px;height:10px;border-radius:50%;background:#9aa9ba;flex:none}
.cmap-open.open i{background:#1fbf6b;box-shadow:0 0 0 0 rgba(31,191,107,.6);animation:openping 2s infinite}
@keyframes openping{70%{box-shadow:0 0 0 9px rgba(31,191,107,0)}100%{box-shadow:0 0 0 0 rgba(31,191,107,0)}}
.cmap-acts{display:flex;gap:10px;flex-wrap:wrap}.cmap-acts .btn{border-radius:40px}.cmap-acts .btn .svg-i{width:18px;height:18px}
.cmap-tools{position:absolute;z-index:4;top:18px;right:18px;display:flex;gap:8px;align-items:center}
.cmap-modes{display:flex;padding:4px;border-radius:40px;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 20px -8px rgba(8,40,90,.45)}
.cmap-modes button,.cmap-tb{font:inherit;font-size:.86rem;font-weight:600;border:0;background:none;color:var(--navy);padding:8px 14px;border-radius:40px;cursor:pointer}
.cmap-modes button.on{background:var(--accent);color:#fff}
.cmap-modes:not(.live) button[data-m="streets"],.cmap-modes:not(.live) button[data-m="satellite"]{display:none}
.cmap-modes:not(.live){display:none}
.cmap-tb{background:rgba(255,255,255,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 20px -8px rgba(8,40,90,.45);min-width:42px;height:42px;display:grid;place-items:center;padding:0 12px}
.cmap-tb .svg-i{width:18px;height:18px}
:root[data-theme="dark"] .cmap-modes,:root[data-theme="dark"] .cmap-tb{background:rgba(10,24,44,.86);color:#dbe8f7}
:root[data-theme="dark"] .cmap-modes button{color:#dbe8f7}
.cmap-hero .maplibregl-ctrl-top-right{top:64px}
.cmap-hero .maplibregl-ctrl-group{border-radius:14px;overflow:hidden;box-shadow:0 8px 20px -8px rgba(8,40,90,.45)}
.cmap-chips{position:absolute;z-index:4;left:50%;bottom:20px;transform:translateX(-50%);display:flex;gap:8px;max-width:calc(100% - 32px);overflow-x:auto;padding:6px;border-radius:24px;background:rgba(255,255,255,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 14px 30px -14px rgba(8,40,90,.55);scrollbar-width:none}
.cmap-chips::-webkit-scrollbar{display:none}
.cmap-chips button{font:inherit;display:flex;align-items:center;gap:8px;white-space:nowrap;border:0;background:none;padding:8px 14px 8px 12px;border-radius:18px;cursor:pointer;color:var(--ink);line-height:1.15;text-align:left}
.cmap-chips button i{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);flex:none}
.cmap-chips button b{font-size:.86rem;display:block}
.cmap-chips button span{font-size:.74rem;color:var(--muted);display:block}
.cmap-chips button:hover{background:var(--accent-soft)}
.cmap-chips button.on{background:var(--accent);color:#fff}.cmap-chips button.on span{color:rgba(255,255,255,.8)}.cmap-chips button.on i{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
:root[data-theme="dark"] .cmap-chips{background:rgba(10,24,44,.84)}
.cmap-dot{position:relative;width:16px;height:16px;padding:0;border:0;background:none;cursor:pointer}
.cmap-dot i{position:absolute;inset:2px;border-radius:50%;background:var(--accent);border:2.5px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.cmap-dot::before{content:"";position:absolute;inset:-6px;border-radius:50%;background:var(--accent);opacity:.3;animation:dotping 2.4s ease-out infinite}
@keyframes dotping{0%{transform:scale(.4);opacity:.5}100%{transform:scale(1.8);opacity:0}}
.cmap-dot span{position:absolute;left:50%;bottom:22px;transform:translateX(-50%) translateY(4px);white-space:nowrap;background:#fff;color:#0d1e33;padding:6px 11px;border-radius:12px;font-size:.74rem;line-height:1.2;box-shadow:0 8px 18px -6px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:.2s;text-align:center}
.cmap-dot span b{display:block;font-size:.8rem;color:var(--accent)}
.cmap-dot span::after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:#fff;transform:translateX(-50%) rotate(45deg)}
.cmap-dot:hover span,.cmap-dot.on span,.cmap.near .cmap-dot span{opacity:1;transform:translateX(-50%)}
.cmap-dot.on i{background:#ff7a1a}.cmap-dot.on::before{background:#ff7a1a}
.cmap-lbl{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(95,82,60,.55);font-weight:600;pointer-events:none;white-space:nowrap}
.cmap-lbl.sea{color:rgba(30,90,150,.55);font-style:italic;letter-spacing:.12em;text-transform:none;font-size:12px}
:root[data-theme="dark"] .cmap-lbl{color:rgba(170,195,225,.45)}:root[data-theme="dark"] .cmap-lbl.sea{color:rgba(110,170,240,.5)}
.cmap.near .cmap-lbl{opacity:0}
.cmap-hero[data-mode="satellite"] .cmap-lbl{color:rgba(255,255,255,.75)}
@media (max-width:760px){.cmap-hero{height:auto;min-height:0;display:flex;flex-direction:column}.cmap{position:relative!important;height:360px;order:2}.cmap-veil{display:none}
 .cmap-ui{order:1;height:auto;padding:24px 16px 18px}.cmap-card{transform:none;max-width:none;padding:22px}
 .cmap-tools{top:auto;bottom:86px}.cmap-chips{bottom:14px;left:16px;right:16px;transform:none;max-width:none}.cmap-hero .maplibregl-ctrl-top-right{top:auto;bottom:140px}}
@media (prefers-reduced-motion:reduce){.om-pulse,.cmap-dot::before,.cmap-open.open i{animation:none}}
/* help desks */
.contact-desks{padding-top:clamp(64px,8vw,96px)}
.desks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:34px}
.desk{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:28px 26px 24px;box-shadow:0 22px 44px -26px rgba(10,60,140,.4);transition:transform .35s,box-shadow .35s;transform-style:preserve-3d}
.desk:hover{transform:perspective(900px) rotateX(4deg) translateY(-6px);box-shadow:0 34px 60px -28px rgba(10,60,140,.55)}
.desk-ic{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 12px 22px -10px var(--accent);transform:rotate(-7deg);margin-bottom:18px}
.desk-ic .svg-i{width:26px;height:26px}
.desk h3{font-size:1.25rem;margin:0 0 6px}.desk p{color:var(--muted);margin:0 0 16px;font-size:.95rem}
.desk-rows{display:grid;gap:8px;border-top:1px dashed var(--line);padding-top:14px}
.desk-rows a{display:flex;align-items:center;gap:9px;color:var(--accent);font-weight:600;font-size:.95rem;word-break:break-word}
.desk-rows a .svg-i{width:16px;height:16px;flex:none}
@media (max-width:980px){.desks{grid-template-columns:1fr 1fr}}@media (max-width:620px){.desks{grid-template-columns:1fr}}
/* office cards */
.offices-sec{background:linear-gradient(180deg,transparent,var(--accent-soft) 60%,transparent)}
.tabs button em{font-style:normal;font-size:.72rem;margin-left:8px;padding:2px 8px;border-radius:20px;background:var(--accent-soft);color:var(--accent);vertical-align:2px}
.ocards{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:22px}
@media (max-width:420px){.ocards{grid-template-columns:1fr}}
.ocard{background:var(--surface);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 24px 48px -28px rgba(10,60,140,.45);display:grid;grid-template-rows:170px 1fr;transition:transform .35s}
.ocard:hover{transform:translateY(-5px)}
.ocard-map{position:relative;overflow:hidden}
.omini{position:absolute;inset:0;width:100%;height:100%}
.ocard-city{position:absolute;left:14px;bottom:12px;display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:30px;background:rgba(255,255,255,.9);color:var(--navy);font-weight:600;font-size:.86rem;box-shadow:0 6px 16px -6px rgba(0,0,0,.35)}
.ocard-city .svg-i{width:15px;height:15px;color:var(--accent)}
:root[data-theme="dark"] .ocard-city{background:rgba(10,24,44,.9);color:#e6eef8}
.ocard-body{padding:22px 24px 24px;display:grid;gap:10px;align-content:start}
.ocard-body h3{font-size:1.12rem;margin:0 0 4px;line-height:1.25}
.ocard-body .o-row a.sel{color:var(--ink)}
.ocard-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.obtn{font:inherit;display:inline-flex;align-items:center;gap:6px;font-size:.84rem;font-weight:600;padding:7px 13px;border-radius:30px;border:1px solid var(--line);background:var(--bg);color:var(--accent);cursor:pointer}
.obtn .svg-i{width:14px;height:14px}
.obtn:hover{border-color:var(--accent);background:var(--accent-soft)}
button.obtn{background:var(--accent);color:#fff;border-color:var(--accent)}
/* enquiry */
.enq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,64px);align-items:start}
.enq-box{margin:22px 0;padding:20px 22px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
.enq-box h3{font-size:1.05rem;margin:0 0 12px}
.enq-box .ticks{grid-template-columns:1fr}.enq-box .ticks li{border:0;padding:4px 0;background:none}
.enq-steps{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.enq-steps li{display:flex;gap:14px;align-items:flex-start}
.enq-steps li>b{flex:none;width:40px;height:40px;border-radius:14px;display:grid;place-items:center;color:#fff;font-family:var(--display);font-size:1.2rem;background:linear-gradient(135deg,var(--accent),var(--accent-2));transform:rotate(-6deg);box-shadow:0 10px 18px -8px var(--accent)}
.enq-steps h4{margin:2px 0 2px;font-size:1rem}.enq-steps p{margin:0;color:var(--muted);font-size:.92rem}
.enq-form{background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:clamp(20px,3vw,34px);box-shadow:0 30px 60px -32px rgba(10,60,140,.5)}
@media (max-width:900px){.enq{grid-template-columns:1fr}}
.cmap-card h1.h-xl{font-size:clamp(2.6rem,4.6vw,4rem);white-space:nowrap}
.cmap-acts .btn{font-size:.9rem;padding:.75em 1.25em}
.ocards[hidden]{display:none}
.ocard-body .o-row{flex-wrap:nowrap}.ocard-body .o-row>span,.ocard-body .o-row>a{flex:0 1 auto;min-width:0}
.ocard-body .o-row>span:first-of-type{flex:1}
.ocard[hidden]{display:none}
/* ===== Careers v2.3 ===== */
.cr-hero{position:relative;overflow:hidden;isolation:isolate;padding:clamp(40px,6vw,72px) 0 120px;background:radial-gradient(1200px 500px at 75% 30%,#d6e9fb,transparent 70%),linear-gradient(180deg,#eef5fc,#dceaf8)}
:root[data-theme="dark"] .cr-hero{background:radial-gradient(1200px 500px at 75% 30%,#12345e,transparent 70%),linear-gradient(180deg,#081a30,#07111e)}
.cr-floor{position:absolute;left:-10%;right:-10%;bottom:-40%;height:80%;z-index:-1;background-image:linear-gradient(rgba(10,111,214,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(10,111,214,.14) 1px,transparent 1px);background-size:64px 64px;transform:perspective(700px) rotateX(62deg);transform-origin:top;-webkit-mask-image:linear-gradient(0deg,#000 30%,transparent);mask-image:linear-gradient(0deg,#000 30%,transparent)}
.cr-in{display:grid;grid-template-columns:minmax(0,540px) minmax(0,1fr);gap:40px;align-items:center;min-height:clamp(480px,56vh,600px)}
.cr-card{max-width:none}
.cr-card h1.h-xl{white-space:normal;font-size:clamp(2.4rem,4.2vw,3.6rem)}
.cr-search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:40px;padding:6px 6px 6px 16px;margin:4px 0 20px;box-shadow:0 10px 24px -14px rgba(8,40,90,.4)}
.cr-search>span{color:var(--accent);display:flex}.cr-search>span .svg-i{width:18px;height:18px}
.cr-search input{flex:1;min-width:0;border:0;background:none;font:inherit;color:var(--ink);padding:8px 4px;outline:none}
.cr-search .btn{border-radius:30px;font-size:.86rem;padding:.7em 1.2em}
.cr-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cr-stats div{text-align:center;padding:10px 4px;border-radius:16px;background:var(--accent-soft)}
.cr-stats b{display:block;font-family:var(--display);font-size:1.5rem;line-height:1.1;color:var(--accent)}.cr-stats span{font-size:.76rem;color:var(--muted)}
.cr-wall{position:relative;height:clamp(380px,44vw,520px);perspective:1400px}
.cr-pic{position:absolute;margin:0;border-radius:22px;overflow:hidden;border:5px solid #fff;box-shadow:0 30px 50px -20px rgba(8,40,90,.55);background:#cfdff0;animation:crfloat 7s ease-in-out infinite}
:root[data-theme="dark"] .cr-pic{border-color:#16304f}
.cr-pic img{width:100%;height:100%;object-fit:cover;display:block}
.cr-pic figcaption{position:absolute;left:10px;bottom:10px;font-size:.74rem;font-weight:600;color:#fff;background:rgba(8,26,48,.7);padding:4px 10px;border-radius:20px}
.cr-p0{left:4%;top:6%;width:56%;height:52%;transform:rotateY(-16deg) rotateZ(-2deg);z-index:3}
.cr-p1{right:0;top:0;width:40%;height:40%;transform:rotateY(-22deg) rotateZ(3deg);z-index:2;animation-delay:-2s}
.cr-p2{right:6%;top:44%;width:42%;height:46%;transform:rotateY(-14deg) rotateZ(-3deg);z-index:4;animation-delay:-4s}
.cr-p3{left:0;bottom:0;width:44%;height:38%;transform:rotateY(-18deg) rotateZ(2deg);z-index:5;animation-delay:-1s}
.cr-p4{left:30%;bottom:-6%;width:30%;height:30%;transform:rotateY(-12deg) rotateZ(-4deg);z-index:1;animation-delay:-3s;opacity:.95}
@keyframes crfloat{50%{translate:0 -10px}}
.cr-chip{position:absolute;z-index:6;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:30px;background:#fff;color:var(--navy);font-weight:600;font-size:.86rem;box-shadow:0 14px 28px -12px rgba(8,40,90,.55);animation:crfloat 6s ease-in-out infinite}
.cr-chip .svg-i{width:16px;height:16px;color:var(--accent)}
.cr-chip.c1{left:46%;top:2%}.cr-chip.c2{right:2%;bottom:6%;animation-delay:-3s;background:var(--accent);color:#fff}.cr-chip.c2 .svg-i{color:#fff}
:root[data-theme="dark"] .cr-chip.c1{background:#0e1b2c;color:#e6eef8}
.cr-depts{bottom:24px}
.cr-depts button>.svg-i{width:16px;height:16px;color:var(--accent)}
.cr-depts button span{background:var(--accent-soft);color:var(--accent);border-radius:20px;padding:1px 8px;font-weight:600}
.cr-depts button.on span{background:rgba(255,255,255,.25);color:#fff}.cr-depts button.on>.svg-i{color:#fff}
@media (max-width:900px){.cr-in{grid-template-columns:1fr}.cr-wall{height:340px}.cr-depts{position:relative;left:auto;bottom:auto;transform:none;margin:16px 16px 0;max-width:none}.cr-hero{padding-bottom:28px}}
@media (max-width:520px){.cr-stats{grid-template-columns:repeat(2,1fr)}.cr-wall{height:260px}.cr-chip.c1{display:none}}
@media (prefers-reduced-motion:reduce){.cr-pic,.cr-chip{animation:none}}
/* perks */
.perks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:30px}
.perk{background:var(--surface);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 22px 44px -26px rgba(10,60,140,.4);transition:transform .35s;padding:0 22px 22px}
.perk:hover{transform:perspective(900px) rotateX(4deg) translateY(-6px)}
.perk-ph{height:150px;margin:0 -22px;overflow:hidden}.perk-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}.perk:hover .perk-ph img{transform:scale(1.06)}
.perk .desk-ic{margin:-28px 0 12px;position:relative;border:4px solid var(--surface)}
.perk h3{font-size:1.15rem;margin:0 0 6px}.perk p{margin:0;color:var(--muted);font-size:.93rem}
@media (max-width:1000px){.perks{grid-template-columns:1fr 1fr}}@media (max-width:560px){.perks{grid-template-columns:1fr}}
/* jobs */
.cr-jobs-sec{background:linear-gradient(180deg,transparent,var(--accent-soft) 50%,transparent)}
.cr-jobs-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:30px;align-items:end;margin-bottom:26px}
.cr-where{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--line);box-shadow:0 22px 44px -26px rgba(10,60,140,.45);background:#a9d4f5}
:root[data-theme="dark"] .cr-where{background:#0b1a2e}
.cr-map{display:block;width:100%;height:auto;aspect-ratio:175/120}
.cr-tag rect{fill:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}.cr-tag text{font-size:4.2px;font-weight:600;fill:#0d1e33;font-family:var(--body)}
.cr-where-cap{position:absolute;left:12px;top:10px;margin:0;display:flex;gap:6px;align-items:center;font-size:.8rem;font-weight:600;background:rgba(255,255,255,.9);color:var(--navy);padding:5px 11px;border-radius:20px}
.cr-where-cap .svg-i{width:14px;height:14px;color:var(--accent)}
.jcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}
.jcard{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:22px 22px 20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 20px 40px -26px rgba(10,60,140,.45);transition:transform .3s,border-color .3s}
.jcard:hover{transform:translateY(-5px);border-color:var(--accent)}
.jcard[hidden]{display:none}
.jc-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.jc-dept{font-size:.76rem;font-weight:600;color:var(--accent);background:var(--accent-soft);padding:4px 10px;border-radius:20px}
.jc-type{font-size:.76rem;font-weight:600;color:var(--muted);border:1px solid var(--line);padding:3px 10px;border-radius:20px}
.jcard h3{margin:4px 0 0;font-size:1.22rem;line-height:1.25}
.jc-loc{display:flex;gap:6px;align-items:center;margin:0;color:var(--muted);font-size:.92rem}.jc-loc .svg-i{width:15px;height:15px;color:var(--accent)}
.jc-pts{margin:0;padding-left:18px;color:var(--muted);font-size:.9rem;display:grid;gap:4px}
.jc-more summary{cursor:pointer;font-weight:600;font-size:.88rem;color:var(--accent);list-style:none;display:flex;gap:6px;align-items:center}.jc-more summary::-webkit-details-marker{display:none}.jc-more summary .svg-i{width:14px;height:14px}
.jc-more[open] summary .svg-i{transform:rotate(45deg)}.jc-more .jc-pts{margin-top:8px}
.jc-acts{margin-top:auto;padding-top:8px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.jc-acts .btn{border-radius:30px}
.jc-dot{display:inline-flex;align-items:center;gap:7px;font-size:.8rem;color:var(--muted)}.jc-dot i{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.jc-gen{border-style:dashed;background:linear-gradient(160deg,var(--surface),var(--accent-soft))}
.jc-gen p{margin:0;color:var(--muted);font-size:.93rem}
.cr-none{margin-top:18px;color:var(--muted)}
@media (max-width:900px){.cr-jobs-head{grid-template-columns:1fr}}
/* hiring steps */
.cr-steps{list-style:none;padding:0;margin:30px 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;position:relative}
.cr-steps::before{content:"";position:absolute;left:8%;right:8%;top:38px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2));opacity:.35}
.cr-steps li{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:20px 18px;text-align:center;box-shadow:0 20px 40px -26px rgba(10,60,140,.45)}
.cr-steps li>b{position:absolute;top:-12px;right:14px;font-family:var(--display);font-size:.9rem;color:#fff;background:var(--navy);width:28px;height:28px;border-radius:50%;display:grid;place-items:center}
.cr-si{width:52px;height:52px;margin:0 auto 12px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-2));transform:rotate(-6deg);box-shadow:0 12px 22px -10px var(--accent)}
.cr-si .svg-i{width:24px;height:24px}
.cr-steps h4{margin:0 0 6px;font-size:1.02rem}.cr-steps p{margin:0;color:var(--muted);font-size:.88rem}
@media (max-width:1000px){.cr-steps{grid-template-columns:1fr 1fr}.cr-steps::before{display:none}}@media (max-width:560px){.cr-steps{grid-template-columns:1fr}}
/* apply */
.cr-safe h3{display:flex;gap:8px;align-items:center}.cr-safe h3 .svg-i{color:var(--accent);width:20px;height:20px}.cr-safe p{margin:0;color:var(--muted);font-size:.93rem}
.cr-drop{position:relative;display:flex!important;flex-direction:row!important;align-items:center;gap:14px;padding:18px;border:2px dashed var(--line);border-radius:18px;background:var(--bg);cursor:pointer;transition:border-color .2s,background .2s}
.cr-drop:hover,.cr-drop.over{border-color:var(--accent);background:var(--accent-soft)}.cr-drop.has{border-style:solid;border-color:var(--accent)}
.cr-drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.cr-drop-ic{width:46px;height:46px;flex:none;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.cr-drop-t{display:grid}.cr-drop-t b{color:var(--ink);font-size:.95rem;word-break:break-all}.cr-drop-t small{color:var(--muted)}
/* ===== v2.3: 3D logo in day mode too ===== */
header.site .logo{position:relative;background:#fff;border-radius:14px;padding:3px 12px;transform-style:preserve-3d;transform:perspective(700px) rotateX(8deg) rotateY(-10deg);border:1px solid #dbe7f7;box-shadow:1px 1px 0 #c7d6ea,2px 2px 0 #b3c6e0,3px 3px 0 #9fb6d6,4px 4px 0 #2f6fd6,5px 5px 0 #1f5bc0,6px 7px 0 #164aa3,0 16px 26px -8px rgba(8,40,90,.45),0 0 18px rgba(80,150,255,.25);animation:logo3d 6s ease-in-out infinite;transition:transform .4s}
header.site .logo::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.75) 46%,transparent 60%);background-size:250% 100%;background-position:150% 0;animation:logoshine 6s ease-in-out infinite}
header.site .logo:hover{animation-play-state:paused;transform:perspective(700px) rotateX(0) rotateY(0) translateY(-3px)}
@media (prefers-reduced-motion:reduce){header.site .logo,header.site .logo::after{animation:none}}
/* ===== Home: sector cards ===== */
.sec3s{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;perspective:1600px}
.sec3{position:relative;display:block;height:clamp(460px,40vw,540px);border-radius:28px;overflow:hidden;color:#fff;isolation:isolate;box-shadow:0 34px 60px -30px rgba(8,40,90,.7);transform:rotateY(var(--ry,0deg));transition:transform .5s,box-shadow .5s}
.sec3:nth-child(1){--ry:7deg}.sec3:nth-child(3){--ry:-7deg}
.sec3:hover{transform:rotateY(0) translateY(-10px);box-shadow:0 44px 70px -30px rgba(8,40,90,.85)}
.sec3>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s}
.sec3:hover>img{transform:scale(1.07)}
.sec3::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(6,20,40,.1) 0,rgba(6,20,40,.25) 35%,rgba(6,24,52,.92) 72%)}
.sec3-no{position:absolute;top:18px;right:22px;font-family:var(--display);font-size:3.4rem;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.7)}
.sec3 .desk-ic{position:absolute;top:20px;left:22px}
.sec3-body{position:absolute;left:14px;right:14px;bottom:14px;padding:20px 20px 18px;border-radius:20px;background:rgba(10,30,60,.42);backdrop-filter:blur(10px) saturate(1.3);-webkit-backdrop-filter:blur(10px) saturate(1.3);border:1px solid rgba(255,255,255,.18)}
.sec3-body h3{margin:0 0 10px;font-size:1.6rem;color:#fff}
.sec3-body ul{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}
.sec3-body li{display:flex;gap:8px;font-size:.9rem;line-height:1.35;color:#e3eefb}.sec3-body li .svg-i{width:15px;height:15px;flex:none;margin-top:2px;color:#7fd0ff}
.sec3-go{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.9rem;padding:7px 14px;border-radius:30px;background:#fff;color:var(--navy)}.sec3-go .svg-i{width:15px;height:15px}
@media (max-width:980px){.sec3s{grid-template-columns:1fr}.sec3{--ry:0deg!important;height:460px}}
/* ===== Home: site crews film ===== */
.film .film-txt.cmap-card{max-width:560px;color:var(--ink)}
.film .film-txt.cmap-card h2{color:var(--navy)}:root[data-theme="dark"] .film .film-txt.cmap-card h2{color:#eaf2fb}
.film .film-txt.cmap-card p{color:var(--muted)}
.film-past{list-style:none;padding:0;margin:4px 0 18px;display:flex;flex-wrap:wrap;gap:8px}
.film-past li{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;padding:6px 12px;border-radius:30px;background:var(--accent-soft);color:var(--accent)}.film-past .svg-i{width:14px;height:14px}
.film-stats{position:absolute;right:max(16px,calc((100vw - 1180px)/2));bottom:28px;display:flex;gap:10px;z-index:3}
.film-stats div{padding:12px 18px;border-radius:18px;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-align:center;box-shadow:0 14px 28px -12px rgba(0,0,0,.5);animation:crfloat 6s ease-in-out infinite}
.film-stats div:nth-child(2){animation-delay:-2s}.film-stats div:nth-child(3){animation-delay:-4s}
.film-stats b{display:block;font-family:var(--display);font-size:1.6rem;color:var(--accent);line-height:1.1}.film-stats span{font-size:.75rem;color:var(--muted)}
:root[data-theme="dark"] .film-stats div{background:rgba(10,24,44,.85)}
@media (max-width:900px){.film-stats{position:static;margin:16px;justify-content:center;flex-wrap:wrap}}
/* ===== Home: site photos as a 3D wall ===== */
.site-photos .ph-grid{perspective:1800px;gap:22px}
.site-photos .site-ph .tl-in{border-radius:22px;border:5px solid #fff;box-shadow:0 30px 50px -24px rgba(8,40,90,.6)}
:root[data-theme="dark"] .site-photos .site-ph .tl-in{border-color:#16304f}
.site-photos .site-ph:nth-child(odd){transform:rotate(-1.2deg)}.site-photos .site-ph:nth-child(even){transform:rotate(1.2deg) translateY(10px)}
.site-photos .site-ph:hover{transform:none;z-index:2}
/* ===== Home: services with photos ===== */
.perks.svcs{grid-template-columns:repeat(4,minmax(0,1fr))}
a.perk{display:block;color:inherit;text-decoration:none}
.perk.svc{display:flex;flex-direction:column}.perk.svc p{flex:1}
.perk.svc .more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-weight:600;font-size:.88rem;color:var(--accent)}.perk.svc .more .svg-i{width:15px;height:15px}
.svc-cta{background:linear-gradient(150deg,var(--accent),#0b4fa8);color:#fff;border:0;padding-top:28px}.svc-cta .desk-ic{margin:0 0 16px;background:#fff;color:var(--accent);border-color:transparent}.svc-cta h3,.svc-cta p,.svc-cta .more{color:#fff!important}
@media (max-width:1000px){.perks.svcs{grid-template-columns:1fr 1fr}}@media (max-width:560px){.perks.svcs{grid-template-columns:1fr}}
/* ===== Home: journey strip ===== */
.jstrip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0 6px}
.jstrip a{display:grid;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line);color:inherit;text-decoration:none;transition:transform .25s,border-color .25s}
.jstrip a:hover{transform:translateY(-3px);border-color:var(--accent)}
.jstrip b{font-family:var(--display);font-size:1.2rem;color:var(--accent);line-height:1.1}.jstrip span{font-size:.78rem;color:var(--muted);line-height:1.3}
/* ===== Page header (About, services) ===== */
.px-hero .px-card h1.h-xl{font-size:clamp(2.2rem,3.8vw,3.3rem)}
.px-hero .cmap-acts{margin:4px 0 18px}
.px-dock button,.px-dock a{font:inherit;display:flex;align-items:center;gap:8px;white-space:nowrap;border:0;background:none;padding:9px 14px;border-radius:18px;cursor:pointer;color:var(--ink);text-decoration:none}
.px-dock i{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);flex:none}
.px-dock b{font-size:.86rem}
.px-dock a:hover,.px-dock button:hover{background:var(--accent-soft)}
.px-dock a.on{background:var(--accent);color:#fff}.px-dock a.on i{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.desks.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.perks.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){.desks.four{grid-template-columns:1fr 1fr}.perks.three{grid-template-columns:1fr}}@media (max-width:560px){.desks.four{grid-template-columns:1fr}}
.why-chips{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.why-chips li{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:30px;background:var(--surface);border:1px solid var(--line);font-size:.92rem;box-shadow:0 10px 20px -14px rgba(10,60,140,.4)}.why-chips .svg-i{color:var(--accent);width:16px;height:16px}
/* ===== Journey timeline ===== */
.jt-sec{background:radial-gradient(900px 400px at 50% 0,var(--accent-soft),transparent 70%)}
.jt{list-style:none;padding:0;margin:40px 0 0;position:relative;display:grid;gap:26px}
.jt::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;margin-left:-2px;border-radius:4px;background:linear-gradient(180deg,var(--accent),var(--accent-2));box-shadow:0 0 18px var(--accent)}
.jt-i{position:relative;display:grid;grid-template-columns:1fr 1fr;perspective:1400px}
.jt-node{position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:#fff;border:5px solid var(--accent);box-shadow:0 0 0 6px var(--accent-soft),0 0 18px var(--accent);z-index:2}
.jt-card{grid-column:1;margin-right:44px;display:grid;grid-template-columns:150px 1fr;background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 26px 50px -28px rgba(10,60,140,.55);transform:rotateY(8deg);transform-origin:right center;transition:transform .45s}
.jt-i.r .jt-card{grid-column:2;margin:0 0 0 44px;transform:rotateY(-8deg);transform-origin:left center}
.jt-card:hover{transform:none}
.jt-ph{position:relative;min-height:160px}.jt-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.jt-tx{padding:18px 20px}
.jt-y{display:inline-block;font-family:var(--display);font-size:1.7rem;line-height:1;padding:6px 12px;border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 10px 18px -8px var(--accent);transform:rotate(-3deg);margin-bottom:10px}
.jt-tx h3{margin:0 0 6px;font-size:1.15rem}.jt-tx p{margin:0;color:var(--muted);font-size:.92rem}
@media (max-width:820px){.jt::before{left:14px}.jt-node{left:14px;top:30px}.jt-i{grid-template-columns:1fr}.jt-card,.jt-i.r .jt-card{grid-column:1;margin:0 0 0 40px;transform:none;grid-template-columns:1fr}.jt-ph{min-height:150px}}
.perks.svc-tiles{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0}
.perks.svc-tiles.two{grid-template-columns:repeat(2,minmax(0,1fr))}
button.perk{font:inherit;text-align:left;cursor:pointer;color:inherit;width:100%}
.perk.svc p{margin:0 0 8px}
@media (max-width:1100px){.perks.svc-tiles{grid-template-columns:1fr 1fr}}@media (max-width:620px){.perks.svc-tiles,.perks.svc-tiles.two{grid-template-columns:1fr}}
.film .film-txt.cmap-card .btn.ghost{color:var(--navy);border-color:var(--navy)}
:root[data-theme="dark"] .film .film-txt.cmap-card .btn.ghost{color:#eaf2fb;border-color:#eaf2fb}
/* ===== Year track collage (Home, About) ===== */
.jc{position:relative;height:clamp(560px,52vw,660px);perspective:1600px}
.jc-track{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:3;pointer-events:none}
.jc-track path{fill:none;stroke:var(--accent);stroke-width:.5;stroke-dasharray:1.6 1.4;vector-effect:non-scaling-stroke;stroke-width:3;opacity:.75;animation:jcdash 30s linear infinite}
@keyframes jcdash{to{stroke-dashoffset:-200}}
.jc-ph{position:absolute;margin:0;border-radius:18px;overflow:hidden;border:5px solid #fff;box-shadow:0 26px 44px -22px rgba(8,40,90,.6);background:#cfdff0;transition:transform .4s;animation:crfloat 8s ease-in-out infinite}
:root[data-theme="dark"] .jc-ph{border-color:#16304f}
.jc-ph img{width:100%;height:100%;object-fit:cover;display:block}
.jc-ph:hover{z-index:5;transform:scale(1.05) rotate(0)!important}
.jc-p0{left:0;top:2%;width:52%;height:33%;transform:rotateY(10deg) rotate(-4deg)}
.jc-p1{left:56%;top:0;width:42%;height:28%;transform:rotateY(-10deg) rotate(3deg);animation-delay:-2s}
.jc-p2{left:46%;top:33%;width:50%;height:27%;transform:rotateY(-8deg) rotate(-2deg);animation-delay:-4s}
.jc-p3{left:2%;top:40%;width:40%;height:25%;transform:rotateY(10deg) rotate(3deg);animation-delay:-1s}
.jc-p4{left:4%;top:70%;width:44%;height:26%;transform:rotateY(8deg) rotate(-3deg);animation-delay:-3s}
.jc-p5{left:54%;top:66%;width:44%;height:27%;transform:rotateY(-8deg) rotate(2deg);animation-delay:-5s}
.jc-st{position:absolute;z-index:4;display:flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:30px;background:#fff;box-shadow:0 12px 24px -10px rgba(8,40,90,.55);white-space:nowrap;transform:translate(-50%,-50%);animation:crfloat 6s ease-in-out infinite}
:root[data-theme="dark"] .jc-st{background:#0e1b2c}
.jc-st b{font-family:var(--display);font-size:1.05rem;color:#fff;padding:5px 10px;border-radius:20px;background:linear-gradient(135deg,var(--accent),var(--accent-2))}
.jc-st em{font-style:normal;font-size:.8rem;font-weight:600;color:var(--ink)}
.jc-s0{left:28%;top:31%}.jc-s1{left:72%;top:27%;animation-delay:-1s}.jc-s2{left:16%;top:64%;animation-delay:-2s}
.jc-s3{left:66%;top:61%;animation-delay:-3s}.jc-s4{left:32%;top:92%;animation-delay:-4s}.jc-s5{left:78%;top:94%;animation-delay:-5s}
.jc-s5 b{background:linear-gradient(135deg,#ff8a1f,#ffb347)}
@media (max-width:900px){.jc{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px;perspective:none}.jc-track{display:none}
 .jc-ph{position:relative;left:auto!important;top:auto!important;width:auto!important;height:130px!important;transform:none!important;animation:none}
 .jc-st{position:relative;left:auto!important;top:auto!important;transform:none;animation:none;white-space:normal}}
@media (prefers-reduced-motion:reduce){.jc-ph,.jc-st,.jc-track path{animation:none}}
.jc-st b{white-space:nowrap}@media (max-width:900px){.jc-st{grid-column:1/-1}}

/* Journey collage: drawn 1997 card and Gulf expansion map */
.jc-art{background:#fff}
.jcf{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:6px 12px 52px;text-align:center;background:linear-gradient(160deg,#0e3a7a,#0a2654);color:#fff;overflow:hidden}
.jcf::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:14px 14px}
.jcf-sky{position:absolute;left:0;right:0;bottom:0;width:100%;height:45%}
.jcf-sky path{fill:none;stroke:rgba(150,200,255,.55);stroke-width:1;stroke-linejoin:round}
.jcf-sky .jcf-dhow{stroke:rgba(255,255,255,.75)}
.jcf-logo{position:relative;width:62%!important;height:auto!important;max-height:34%;object-fit:contain!important;background:#fff;border-radius:10px;padding:5px 9px;box-shadow:0 8px 18px -8px rgba(0,0,0,.5)}
.jcf b{position:relative;font-size:clamp(17px,2vw,24px);letter-spacing:.02em;margin-top:6px}
.jcf em{position:relative;font-style:normal;font-size:12px;opacity:.85;line-height:1.3}
.jcg{width:100%;height:100%;display:block}
.jcg-arc{fill:none;stroke:var(--accent);stroke-width:1.3;stroke-dasharray:3 2.5;animation:jcdash 3s linear infinite}
.jcg-hq{fill:#f08a24;stroke:#fff;stroke-width:1}
.jcg-t{font:600 7px system-ui,sans-serif;fill:#0a2654;text-anchor:middle;paint-order:stroke;stroke:#fff;stroke-width:2}
:root[data-theme="dark"] .jcg-t{fill:#e6f0ff;stroke:#0b1a2e}
@media (max-width:900px){.jcf em{display:none}}

/* Events corner (Life at Multiline) */
.evc{margin:8px 0 40px}
.evc h2{margin:0 0 18px}
.evc-e{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:28px;align-items:center;perspective:1400px}
.evc-head{position:relative;padding:26px 28px;transform:rotateY(6deg)}
.evc-d{display:inline-block;font-size:13px;font-weight:600;color:#fff;background:linear-gradient(135deg,#1e6fe0,#0a3a8c);padding:5px 12px;border-radius:999px}
.evc-head h3{font-size:clamp(22px,2.4vw,30px);margin:12px 0 8px}
.evc-head p{margin:0 0 16px;color:var(--muted)}
.evc-film{margin:0;border-radius:22px;overflow:hidden;border:6px solid #fff;box-shadow:0 34px 60px -28px rgba(8,40,90,.65);transform:rotateY(-7deg) rotate(.6deg);transition:transform .4s;background:#0a2654}
.evc-film:hover{transform:none}
:root[data-theme="dark"] .evc-film{border-color:#16304f}
.evc-film video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
@media (max-width:860px){.evc-e{grid-template-columns:1fr}.evc-head,.evc-film{transform:none}}