/* Layout: Naspers-style modular corporate stack — white canvas, full-bleed media blocks
   with overlapping navy cards, pill CTAs with gradient arrow discs, overlay mega-menu.
   Identity: OmniCore navy / signal blue / cyan, silver logomark, Sora + Inter. */
:root{
  --paper:#ffffff;
  --paper-2:#f2f5fb;
  --ink:#14203d;
  --ink-soft:#56627e;
  --line:rgba(20,32,61,.12);
  --accent:#1547b8;
  --panel:#0a1430;
  --panel-2:#0f1f47;
  --on-panel:#eaf1ff;
  --on-panel-soft:#a9badb;
  --cyan:#37e6ff;
  --blue:#2f6bff;
  --grad:linear-gradient(120deg,#37e6ff 0%,#4f8cff 45%,#2f6bff 100%);
  --hdr-bg:rgba(255,255,255,.96);
  --logo-solid:url(#lg-navy);
  --shadow:0 18px 50px -24px rgba(10,20,48,.35);
  --f-display:"Sora","Segoe UI",system-ui,sans-serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --t-xs:.78rem;--t-sm:.9rem;--t-base:1rem;--t-md:1.125rem;--t-lg:1.45rem;
  --t-xl:clamp(1.85rem,1.2rem + 2.3vw,2.7rem);
  --t-2xl:clamp(2.1rem,1.2rem + 3.4vw,3.5rem);
  --r:18px;--maxw:1240px;--hdr:76px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#05070f;--paper-2:#0a1022;--ink:#eaf1ff;--ink-soft:#9fb2d8;--line:rgba(120,160,255,.16);
  --accent:#6fa0ff;--panel:#0d1938;--panel-2:#13244f;--hdr-bg:rgba(5,7,15,.94);--logo-solid:url(#lg-silver);
  --shadow:0 18px 50px -24px rgba(0,0,0,.7);color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#05070f;--paper-2:#0a1022;--ink:#eaf1ff;--ink-soft:#9fb2d8;--line:rgba(120,160,255,.16);
  --accent:#6fa0ff;--panel:#0d1938;--panel-2:#13244f;--hdr-bg:rgba(5,7,15,.94);--logo-solid:url(#lg-silver);
  --shadow:0 18px 50px -24px rgba(0,0,0,.7);color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:var(--t-base);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.15;margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
a{color:inherit}
img,video{max-width:100%;display:block}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}
section[id],div[id].anchor{scroll-margin-top:calc(var(--hdr) + 12px)}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:900px){.wrap{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}
.sec{padding-block:clamp(64px,9vw,120px)}
.eyebrow{font-size:var(--t-xs);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.on-dark .eyebrow,.card .eyebrow{color:var(--cyan)}
.lead{font-size:var(--t-md);color:var(--ink-soft);max-width:62ch}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- logo ---------- */
.logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
.logo svg{width:40px;height:35px;flex:none}
.logo .wm{line-height:1}
.logo .wm b{display:block;font-family:var(--f-display);font-weight:700;font-size:18px;letter-spacing:.1em}
.logo .wm small{display:block;font-size:9px;letter-spacing:.42em;margin-top:5px;opacity:.75}
.mark{--lf:url(#lg-silver)}
.mark use{fill:var(--lf);stroke:var(--lf)}

/* ---------- buttons ---------- */
.pill{display:inline-flex;align-items:center;gap:14px;padding:7px 7px 7px 22px;border-radius:100px;border:1.5px solid currentColor;background:transparent;font-weight:600;font-size:var(--t-base);text-decoration:none;transition:background .25s,color .25s,border-color .25s}
.pill .disc{width:38px;height:38px;border-radius:50%;background:var(--grad);display:grid;place-items:center;color:#05070f;transition:transform .3s}
.pill .disc svg{width:18px;height:18px}
.pill:hover .disc{transform:translateX(4px)}
.pill:hover{border-color:var(--blue)}
.pill.solid{background:var(--grad);border-color:transparent;color:#05070f}
.pill.solid .disc{background:#05070f;color:var(--cyan)}
.tlink{display:inline-flex;align-items:center;gap:10px;font-weight:600;text-decoration:none}
.tlink svg{width:16px;height:16px;color:var(--cyan);transition:transform .25s}
.tlink.light svg{color:var(--accent)}
.tlink:hover svg{transform:translateX(4px)}
.tlink span{background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .3s}
.tlink:hover span{background-size:100% 1.5px}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:50;padding-top:env(safe-area-inset-top,0px);color:#fff;transition:background .3s,color .3s,box-shadow .3s}
.hdr .bar{height:var(--hdr);display:flex;align-items:center;justify-content:space-between;gap:16px}
.hdr.solid{background:var(--hdr-bg);color:var(--ink);box-shadow:0 1px 0 var(--line);backdrop-filter:blur(10px)}
.hdr.solid .mark{--lf:var(--logo-solid)}
.hdr .tools{display:flex;align-items:center;gap:6px}
.lang{display:flex;border:1px solid currentColor;border-radius:100px;padding:3px;opacity:.9}
.lang button{border:0;background:none;padding:4px 11px;border-radius:100px;font-size:var(--t-xs);font-weight:600;letter-spacing:.08em}
.lang button[aria-pressed="true"]{background:var(--grad);color:#05070f}
.ibtn{width:44px;height:44px;border:0;background:none;border-radius:50%;display:grid;place-items:center}
.ibtn:hover{background:rgba(127,150,200,.16)}
.ibtn svg{width:22px;height:22px}
.burger{display:flex;align-items:center;gap:12px;border:0;background:none;padding:8px 4px 8px 10px;font-weight:600;font-size:var(--t-sm)}
.burger i{display:grid;gap:6px;width:28px}
.burger i b{display:block;height:2px;border-radius:2px;background:currentColor}
.burger i b:nth-child(2){width:70%;justify-self:end;background:var(--cyan)}
@media (max-width:560px){.burger .lbl{display:none}.lang button{padding:4px 8px}}

/* ---------- menu bar ---------- */
.hdr{transition:background .3s,color .3s,box-shadow .3s,transform .4s cubic-bezier(.2,.7,.2,1)}
.hdr.hide{transform:translateY(-100%)}
.util{font-size:var(--t-xs);border-bottom:1px solid rgba(255,255,255,.14);overflow:hidden;max-height:40px;transition:max-height .35s,opacity .3s,border-color .3s}
.util .wrap{height:38px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.util .u-l,.util .u-r{display:flex;align-items:center;gap:22px;min-width:0;white-space:nowrap}
.util a,.util span{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:7px;opacity:.86}
.util span span{opacity:1}
.util a:hover{opacity:1;color:var(--cyan)}
.util svg{width:13px;height:13px;flex:none;color:var(--cyan)}
.hdr.solid .util{max-height:0;opacity:0;border-color:transparent}
@media (max-width:1179px){.util{display:none}}
.bar{position:relative}
.nav{flex:1;display:flex;justify-content:center;min-width:0}
.nav>ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px}
.nav>ul>li{position:relative}
.nav>ul>li.mg{position:static}
.nav>ul>li>a,.nav>ul>li>button{display:flex;align-items:center;gap:6px;height:44px;padding:0 14px;border:0;background:none;border-radius:100px;font-weight:600;font-size:var(--t-sm);text-decoration:none;color:inherit;position:relative;white-space:nowrap;transition:background .2s}
.nav>ul>li>a:hover,.nav>ul>li>button:hover,.nav>ul>li.open>button{background:rgba(127,150,200,.16)}
.nav>ul>li>a::after,.nav>ul>li>button::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.nav>ul>li.on>a::after,.nav>ul>li.on>button::after{transform:scaleX(1)}
.nav .cv{width:12px;height:12px;transform:rotate(90deg);transition:transform .25s;opacity:.7}
.nav li.open .cv{transform:rotate(-90deg)}
.drop{position:absolute;top:calc(100% + 12px);left:50%;z-index:5;min-width:320px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:10px;display:grid;gap:2px;opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .22s,transform .22s,visibility .22s}
.drop::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.nav li.open>.drop{opacity:1;visibility:visible;transform:translate(-50%,0)}
.drop a{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:center;padding:10px 12px;border-radius:12px;text-decoration:none;color:inherit;transition:background .2s}
.drop a:hover,.drop a:focus-visible{background:var(--paper-2)}
.drop .di{width:40px;height:40px;border-radius:12px;background:var(--paper-2);display:grid;place-items:center;color:var(--accent);transition:background .2s,color .2s}
.drop a:hover .di{background:var(--grad);color:#05070f}
.drop .di svg{width:20px;height:20px}
.drop b{display:block;font-weight:600;font-size:var(--t-sm);line-height:1.3}
.drop small{display:block;color:var(--ink-soft);font-size:var(--t-xs);line-height:1.45;margin-top:2px}
.drop a.hl{border-top:1px solid var(--line);border-radius:0 0 12px 12px;margin-top:4px;padding-top:14px}
.drop.mega{width:min(860px,calc(100vw - 80px));grid-template-columns:minmax(0,1fr) 250px;gap:10px}
.drop.mega .cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;align-content:start}
.drop .feat{display:grid;grid-template-columns:1fr;gap:10px;align-content:start;background:var(--panel);color:var(--on-panel);border-radius:14px;padding:12px 12px 16px}
.drop .feat:hover{background:var(--panel-2)}
.drop .feat .media{display:block;aspect-ratio:16/10;border-radius:10px}
.drop .feat .eyebrow{color:var(--cyan);margin:4px 4px 0}
.drop .feat .ft{font-size:var(--t-sm);color:var(--on-panel-soft);line-height:1.5;margin:0 4px}
.drop .feat .tlink{color:var(--on-panel);margin:0 4px;font-size:var(--t-sm)}
.drop .feat .tlink svg{color:var(--cyan)}
.cta-h{padding:4px 4px 4px 16px;gap:10px;font-size:var(--t-sm);margin-left:6px}
.cta-h .disc{width:32px;height:32px}
.cta-h .disc svg{width:15px;height:15px}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--grad);transform:scaleX(var(--p,0));transform-origin:0 50%;opacity:0;transition:opacity .3s}
.hdr.solid .progress{opacity:1}
@media (max-width:1179px){.nav,.cta-h{display:none}}
@media (min-width:1180px){.burger{display:none}}
@media (max-width:1319px){.nav .xl{display:none}}

/* ---------- overlay menu ---------- */
.menu{position:fixed;inset:0;z-index:70;background:var(--panel);color:var(--on-panel);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.menu.open{opacity:1;visibility:visible}
.menu .bar{height:var(--hdr);display:flex;align-items:center;justify-content:space-between}
.menu-grid{flex:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,.9fr);gap:clamp(24px,4vw,64px);padding-block:clamp(24px,5vh,64px)}
.m-main{list-style:none;margin:0;padding:0;display:grid;gap:4px;align-content:start}
.m-main button,.m-main a{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;background:none;text-align:left;padding:10px 0;font-family:var(--f-display);font-size:clamp(1.35rem,1rem + 1.4vw,2rem);font-weight:600;text-decoration:none;color:var(--on-panel-soft);transition:color .2s}
.m-main button[aria-expanded="true"],.m-main button:hover,.m-main a:hover{color:var(--on-panel)}
.m-main button svg{width:22px;height:22px;color:var(--cyan);opacity:0;transform:translateX(-8px);transition:.25s}
.m-main button[aria-expanded="true"] svg{opacity:1;transform:none}
.m-sub{border-left:1px solid rgba(120,160,255,.2);padding-left:clamp(20px,3vw,40px)}
.m-sub h3{font-size:var(--t-lg);margin-bottom:18px;color:var(--on-panel)}
.m-sub ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.m-sub a{display:block;padding:9px 0;color:var(--on-panel-soft);text-decoration:none;font-size:var(--t-md)}
.m-sub a:hover{color:var(--cyan)}
.m-panel[hidden]{display:none!important}
.m-feature{border-radius:var(--r);overflow:hidden;background:var(--panel-2);align-self:start}
.m-feature .media{aspect-ratio:16/10;border-radius:0}
.m-feature .body{padding:22px;display:grid;gap:14px}
.m-feature p{color:var(--on-panel-soft);font-size:var(--t-sm)}
.m-mobile-sub{display:none}
.m-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;padding-block:22px 28px;border-top:1px solid rgba(120,160,255,.18)}
.m-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px 28px}
.m-foot li{display:flex;align-items:center;gap:8px;color:var(--on-panel-soft);font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.m-foot li svg{width:16px;height:16px;color:var(--cyan)}
.m-foot a{color:inherit;text-decoration:none}
.m-foot a:hover{color:var(--on-panel)}
.m-foot .pill{color:#05070f}
.m-main>li{border-bottom:1px solid rgba(120,160,255,.12)}
@media (max-width:860px){
  .menu-grid{grid-template-columns:1fr}
  .m-sub,.m-feature{display:none}
  .m-mobile-sub{display:block;padding:0 0 10px 4px}
  .m-mobile-sub[hidden]{display:none}
  .m-mobile-sub a{display:block;padding:8px 0;color:var(--on-panel-soft);text-decoration:none}
}

/* ---------- search ---------- */
.search{position:fixed;inset:0;z-index:80;background:rgba(5,7,15,.72);backdrop-filter:blur(6px);display:flex;justify-content:center;align-items:flex-start;padding:calc(env(safe-area-inset-top,0px) + 12vh) max(16px,env(safe-area-inset-right,0px)) 24px max(16px,env(safe-area-inset-left,0px))}
.search[hidden]{display:none!important}
.search-box{width:min(720px,100%);background:var(--paper);color:var(--ink);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.search-box .row{display:flex;align-items:center;gap:10px;padding:10px 10px 10px 20px;border-bottom:1px solid var(--line)}
.search-box input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:var(--t-md);color:var(--ink);padding:12px 0;outline:none}
.results{max-height:52vh;overflow-y:auto;padding:8px}
.results a{display:block;padding:12px 14px;border-radius:12px;text-decoration:none}
.results a:hover,.results a:focus-visible{background:var(--paper-2)}
.results b{display:block;font-family:var(--f-display);font-weight:600}
.results small{color:var(--ink-soft);font-size:var(--t-sm)}
.results mark{background:none;color:var(--accent);font-weight:600}
.results .empty{padding:16px;color:var(--ink-soft)}

/* ---------- media fallback ---------- */
.media{position:relative;overflow:hidden;border-radius:var(--r);background:
  radial-gradient(120% 90% at 85% 10%,rgba(55,230,255,.28),transparent 55%),
  radial-gradient(90% 80% at 10% 100%,rgba(47,107,255,.35),transparent 60%),#0a1430}
.media::before{content:"";position:absolute;width:62%;aspect-ratio:1;right:-14%;top:-18%;border-radius:50%;border:clamp(14px,3vw,34px) solid rgba(196,206,215,.12);border-left-color:transparent}
.media img,.media video{position:relative;width:100%;height:100%;object-fit:cover;transition:opacity .4s,transform 1.2s}
.media img.broken,.media video.broken{opacity:0}
.media video.hv,.media video.lv{position:absolute;inset:0;opacity:0;transition:opacity .8s}
.media video.hv.on,.media video.lv.on{opacity:1}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--panel);color:#fff;overflow:hidden}
.slides{position:absolute;inset:0}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.slide.on{opacity:1}
.slide .media{position:absolute;inset:0;border-radius:0}
.slide.on img{transform:scale(1.04)}
.slide img{transform:scale(1.12);transition:transform 7s ease-out,opacity .4s}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,7,15,.82) 0%,rgba(5,7,15,.45) 50%,rgba(5,7,15,.15) 100%),linear-gradient(0deg,rgba(5,7,15,.6),transparent 40%);pointer-events:none}
.hero-inner{position:relative;z-index:2;min-height:clamp(560px,82vh,780px);display:flex;align-items:flex-end;padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px));padding-bottom:clamp(28px,5vw,56px)}
.hero-panel{width:min(660px,100%);display:grid;gap:22px}
.hcopy{display:none;gap:18px}
.hcopy.on{display:grid;animation:rise .8s cubic-bezier(.2,.7,.2,1)}
.hcopy .eyebrow{color:var(--cyan)}
.hcopy h1,.hcopy .h{font-size:var(--t-2xl);font-weight:700}
.hcopy h1 em,.hcopy .h em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hcopy p{color:#cfdaf2;max-width:56ch}
.hcopy .acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.dots{display:flex;gap:10px;padding-top:6px}
.dot{flex:1;max-width:76px;border:0;background:none;padding:22px 0 10px;position:relative;color:var(--cyan);font-family:var(--f-display);font-size:var(--t-xs);font-weight:600;text-align:left}
.dot span{position:absolute;top:2px;left:0;opacity:0;transition:opacity .3s}
.dot.on span{opacity:1}
.dot i{display:block;height:2px;background:rgba(255,255,255,.28);border-radius:2px;overflow:hidden}
.dot i b{display:block;height:100%;width:0;background:var(--grad)}
.dot.on i b{animation:fill var(--dur,6.5s) linear forwards}
.hero.paused .dot.on i b{animation-play-state:paused}
@keyframes fill{to{width:100%}}
.hctl{display:flex;align-items:flex-end;gap:12px;padding-top:6px}
.hctl .dots{flex:1;min-width:0;padding-top:0}
.hbtn{width:40px;height:40px;flex:none;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(5,7,15,.35);color:#fff;display:grid;place-items:center;transition:background .2s,border-color .2s}
.hbtn:hover{background:rgba(255,255,255,.16);border-color:#fff}
.hbtn svg{width:16px;height:16px}
.hbtn.prev svg{transform:rotate(180deg)}
@media (max-width:700px){.hbtn.prev,.hbtn.next{display:none}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hero-stats{position:relative;z-index:2;background:rgba(5,7,15,.55);backdrop-filter:blur(8px);border-top:1px solid rgba(120,160,255,.18)}
.hero-stats ul{list-style:none;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding-block:18px}
.hero-stats li{display:grid;gap:2px;padding-inline:16px;border-left:1px solid rgba(120,160,255,.18)}
.hero-stats li:first-child{border-left:0;padding-left:0}
.hero-stats b{font-family:var(--f-display);font-size:var(--t-lg);font-variant-numeric:tabular-nums}
.hero-stats small{color:#a9badb;font-size:var(--t-xs);letter-spacing:.04em}
@media (max-width:700px){
  .hero-stats ul{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}
  .hero-stats li:nth-child(3){border-left:0;padding-left:0}
}

/* ---------- statement ---------- */
.statement .grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:40px;align-items:center}
.statement h2{font-size:var(--t-xl);font-weight:600;max-width:20ch}
.statement h2 em{font-style:normal;color:var(--accent)}
.statement .acts{margin-top:34px}
.arcs{width:100%;max-width:360px;justify-self:end;color:var(--accent)}
@media (max-width:760px){.statement .grid{grid-template-columns:1fr}.arcs{max-width:220px;justify-self:start;order:-1}}

/* ---------- about ---------- */
.about{background:var(--paper-2)}
.about .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:center}
.about .txt{display:grid;gap:20px}
.about h2{font-size:var(--t-xl)}
.about p{color:var(--ink-soft);max-width:60ch}
.checks{list-style:none;padding:0;margin:6px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}
.checks li{display:flex;gap:10px;align-items:center;font-weight:500;font-size:var(--t-sm)}
.checks svg{width:18px;height:18px;flex:none;padding:3px;border-radius:50%;background:var(--grad);color:#05070f}
.about .pic{position:relative}
.about .pic .media{aspect-ratio:5/6;max-width:100%}
.badge{position:absolute;left:-28px;bottom:32px;background:var(--panel);color:var(--on-panel);border-radius:14px;padding:16px 20px;box-shadow:var(--shadow);display:grid;gap:2px}
.badge b{font-family:var(--f-display)}
.badge small{color:var(--on-panel-soft)}
.stats{list-style:none;padding:0;margin:clamp(48px,6vw,80px) 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.stats li{padding:26px 20px 0 0;display:grid;gap:6px}
.stats b{font-family:var(--f-display);font-size:clamp(2.2rem,1.4rem + 2.6vw,3.4rem);font-weight:700;line-height:1;font-variant-numeric:tabular-nums;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stats span{color:var(--ink-soft);font-size:var(--t-sm)}
@media (max-width:860px){.about .grid{grid-template-columns:1fr}.badge{left:12px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px}}
@media (max-width:440px){.checks{grid-template-columns:1fr}}

/* ---------- feature (image + overlapping card) ---------- */
.feature{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
.feature .media{grid-column:1/10;grid-row:1;aspect-ratio:16/9}
.feature .card{grid-column:7/13;grid-row:1;align-self:end;margin-bottom:-64px;position:relative;z-index:2}
.feature.rev .media{grid-column:4/13}
.feature.rev .card{grid-column:1/7}
.feature + .after{height:64px}
.card{background:var(--panel);color:var(--on-panel);border-radius:var(--r);padding:clamp(24px,3.4vw,44px);display:grid;gap:16px;box-shadow:var(--shadow)}
.card h2,.card h3{font-size:var(--t-xl);color:var(--cyan);font-weight:600}
.card p{color:var(--on-panel-soft)}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.chips li{font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;padding:6px 12px;border-radius:100px;border:1px solid rgba(120,160,255,.3);color:var(--on-panel)}
@media (max-width:860px){
  .feature .media,.feature.rev .media{grid-column:1/-1;aspect-ratio:4/3}
  .feature .card,.feature.rev .card{grid-column:1/-1;grid-row:2;margin:-56px 12px 0}
  .feature + .after{height:0}
}

/* ---------- method ---------- */
.method .head{display:grid;gap:16px;max-width:760px}
.method h2{font-size:var(--t-xl)}
.steps{list-style:none;padding:0;margin:clamp(40px,5vw,64px) 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;counter-reset:s}
.steps li{position:relative;padding-top:28px;display:grid;gap:10px;align-content:start}
.steps li::before{content:"";position:absolute;top:0;left:0;right:-24px;height:2px;background:var(--line)}
.steps li:last-child::before{right:0}
.steps li::after{content:"";position:absolute;top:-5px;left:0;width:12px;height:12px;border-radius:50%;background:var(--grad);box-shadow:0 0 0 5px var(--paper)}
.steps .n{font-family:var(--f-display);font-weight:700;font-size:var(--t-sm);color:var(--accent);letter-spacing:.08em}
.steps h3{font-size:var(--t-md)}
.steps p{color:var(--ink-soft);font-size:var(--t-sm)}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}.steps li:nth-child(2)::before{right:0}}
@media (max-width:520px){.steps{grid-template-columns:1fr}.steps li::before{right:0}}

/* ---------- services grid (insights pattern) ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.6vw,36px)}
.svc-intro{display:grid;gap:16px;align-content:start;padding-top:8px}
.svc-intro h2{font-size:var(--t-xl)}
.svc-intro p{color:var(--ink-soft)}
.scard{display:grid;gap:12px;align-content:start;text-align:left;border:0;background:none;padding:0;text-decoration:none;color:inherit}
.scard .media{aspect-ratio:4/3}
.scard .media img{transition:transform .8s,opacity .4s}
.scard:hover .media img{transform:scale(1.05)}
.scard .eyebrow{margin-top:6px}
.scard h3{font-size:var(--t-lg);font-weight:600}
.scard p{color:var(--ink-soft);font-size:var(--t-sm)}
.scard .tlink{color:var(--ink);margin-top:2px}
.scard.big{grid-column:2/4}
.scard.big .media{aspect-ratio:16/8.4}
.scard.big h3{font-size:var(--t-xl)}
@media (max-width:900px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-intro,.scard.big{grid-column:1/-1}}
@media (max-width:560px){.svc-grid{grid-template-columns:1fr}}

/* ---------- why ---------- */
.why{background:var(--paper-2)}
.why .head{display:grid;gap:16px;max-width:760px;margin-bottom:clamp(36px,5vw,56px)}
.why h2{font-size:var(--t-xl)}
.why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.why-grid .card{gap:14px;align-content:start;padding:28px;box-shadow:none;transition:transform .35s,box-shadow .35s}
.why-grid .card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.why-grid .ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(55,230,255,.1);color:var(--cyan);border:1px solid rgba(55,230,255,.25)}
.why-grid .ico svg{width:24px;height:24px}
.why-grid h3{font-size:var(--t-md);color:var(--on-panel)}
.why-grid p{font-size:var(--t-sm)}
@media (max-width:1000px){.why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:540px){.why-grid{grid-template-columns:1fr}}

/* ---------- action band ---------- */
.action .media{aspect-ratio:21/8;min-height:280px}
.action .card{width:min(780px,calc(100% - 24px));margin:-120px auto 0;position:relative;z-index:2}
.action .acts{margin-top:8px}
.action .pill{color:var(--on-panel)}
@media (max-width:700px){.action .media{aspect-ratio:4/3}.action .card{margin-top:-60px}}

/* ---------- cta band ---------- */
.band{background:var(--grad);color:#05070f}
.band .wrap{padding-block:clamp(40px,5vw,60px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.band .l{display:flex;gap:18px;align-items:flex-start;min-width:0;flex:1 1 420px}
.band .ring{width:52px;height:52px;flex:none;border-radius:50%;border:1.5px solid #05070f;display:grid;place-items:center}
.band .ring svg{width:22px;height:22px}
.band h2{font-size:var(--t-lg);font-weight:600}
.band p{margin-top:6px;font-weight:500;opacity:.85;font-variant-numeric:tabular-nums}
.band .pill{border-color:#05070f}
.band .pill .disc{background:#05070f;color:var(--cyan)}

/* ---------- contact ---------- */
.contact .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,90px);align-items:start}
.contact .txt{display:grid;gap:18px}
.contact h2{font-size:var(--t-xl)}
.contact .txt>p{color:var(--ink-soft)}
.info{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:4px;border-top:1px solid var(--line)}
.info li{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);min-width:0}
.info .ic{width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--paper-2);color:var(--accent)}
.info .ic svg{width:18px;height:18px}
.info .v{flex:1;min-width:0;overflow-wrap:anywhere}
.info .v small{display:block;color:var(--ink-soft);font-size:var(--t-xs);letter-spacing:.08em;text-transform:uppercase}
.info .v span{user-select:all;font-weight:500;font-variant-numeric:tabular-nums}
.copy{border:1px solid var(--line);background:none;border-radius:100px;padding:6px 12px;font-size:var(--t-xs);font-weight:600;color:var(--ink-soft)}
.copy:hover{color:var(--accent);border-color:var(--accent)}
.form{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(24px,3.4vw,40px);box-shadow:var(--shadow);display:grid;gap:22px}
.form .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.fld{display:grid;gap:6px}
.fld label{font-size:var(--t-xs);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.fld input,.fld textarea,.fld select{font:inherit;color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid var(--line);padding:10px 0;border-radius:0;outline:none;transition:border-color .2s;width:100%}
.fld select{appearance:none;background:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%) calc(100% - 10px) 55%/6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,var(--ink-soft) 50%) calc(100% - 4px) 55%/6px 6px no-repeat}
.fld textarea{resize:vertical;min-height:110px}
.fld input:focus,.fld textarea:focus,.fld select:focus{border-color:var(--blue)}
.fld .err{color:#d9344a;font-size:var(--t-xs);min-height:1em}
.form .pill{justify-self:start;color:var(--ink)}
.ready{border-radius:14px;background:var(--paper-2);padding:18px;display:grid;gap:12px}
.ready[hidden]{display:none!important}
.ready p{font-size:var(--t-sm);color:var(--ink-soft)}
.ready .acts{display:flex;flex-wrap:wrap;gap:10px}
.ready .acts a,.ready .acts button{border:1.5px solid var(--ink);background:none;border-radius:100px;padding:8px 16px;font-weight:600;font-size:var(--t-sm);text-decoration:none}
@media (max-width:860px){.contact .grid{grid-template-columns:1fr}}
@media (max-width:520px){.form .two{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.foot{background:var(--panel);color:var(--on-panel);padding-bottom:env(safe-area-inset-bottom,0px)}
.foot .top{padding-block:clamp(56px,7vw,88px) 40px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr);gap:40px}
.foot h4{font-size:var(--t-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin-bottom:16px;font-family:var(--f-body);font-weight:600}
.foot p,.foot address{color:var(--on-panel-soft);font-size:var(--t-sm);font-style:normal;line-height:1.7}
.foot .brand{display:grid;gap:18px;align-content:start}
.foot ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.foot ul a{color:var(--on-panel-soft);text-decoration:none;font-size:var(--t-sm)}
.foot ul a:hover{color:var(--cyan)}
.cert{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;align-items:center}
.cert .doc{aspect-ratio:3/4;border-radius:8px;background:linear-gradient(160deg,#f4f7fb,#d9e1ea);position:relative;box-shadow:0 12px 30px -12px rgba(0,0,0,.6);display:grid;place-items:center;padding:10px}
.cert .doc svg{width:42px;height:37px}
.cert .doc::after{content:"";position:absolute;inset:auto 12px 14px;height:22px;background:repeating-linear-gradient(0deg,#b8c3cf 0 2px,transparent 2px 7px)}
.cert b{display:block;font-family:var(--f-display);font-size:var(--t-md);margin-bottom:6px;color:var(--on-panel)}
.foot .bottom{border-top:1px solid rgba(120,160,255,.16);padding-block:22px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center;color:var(--on-panel-soft);font-size:var(--t-xs)}
.foot .bottom .lang{color:var(--on-panel)}
@media (max-width:980px){.foot .top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.foot .top{grid-template-columns:1fr}}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 16px) max(16px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 16px) max(16px,env(safe-area-inset-left,0px));background:rgba(5,7,15,.7);backdrop-filter:blur(6px)}
.modal[hidden]{display:none!important}
.modal-box{width:min(760px,100%);max-height:100%;overflow-y:auto;background:var(--paper);color:var(--ink);border-radius:var(--r);box-shadow:var(--shadow);animation:rise .4s}
.modal-box .media{aspect-ratio:16/7;border-radius:0}
.modal-box .body{padding:clamp(22px,3.4vw,40px);display:grid;gap:16px}
.modal-box h3{font-size:var(--t-xl)}
.modal-box p{color:var(--ink-soft)}
.modal-box ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.modal-box li{display:flex;gap:10px;align-items:flex-start}
.modal-box li svg{width:20px;height:20px;flex:none;margin-top:2px;padding:4px;border-radius:50%;background:var(--grad);color:#05070f}
.modal-box .pill{justify-self:start;color:var(--ink);margin-top:6px}
.modal-close{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(5,7,15,.6);color:#fff;display:grid;place-items:center;z-index:2}
.modal-close svg{width:20px;height:20px}
.modal-box{position:relative}
.mdata{display:none}
.subh{font-family:var(--f-body);font-size:var(--t-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-top:8px}

/* ---------- top button, toast ---------- */
.totop{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:40;width:52px;height:52px;border:0;border-radius:12px;background:var(--grad);color:#05070f;display:grid;place-items:center;box-shadow:var(--shadow);opacity:0;transform:translateY(12px);pointer-events:none;transition:.3s}
.totop.show{opacity:1;transform:none;pointer-events:auto}
.totop svg{width:24px;height:24px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--panel);color:var(--on-panel);padding:12px 20px;border-radius:100px;font-weight:500;font-size:var(--t-sm);opacity:0;transition:.3s;z-index:95;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- video + play affordances ---------- */
.media video{object-fit:cover}
.play{position:absolute;left:16px;bottom:16px;z-index:3;display:inline-flex;align-items:center;gap:10px;padding:5px 16px 5px 5px;border-radius:100px;background:rgba(5,7,15,.58);backdrop-filter:blur(8px);color:#fff;border:1px solid rgba(255,255,255,.22);font-weight:600;font-size:var(--t-sm);transition:background .25s}
.play i{width:34px;height:34px;border-radius:50%;background:var(--grad);display:grid;place-items:center;color:#05070f}
.play i svg{width:14px;height:14px;margin-left:2px}
.play:hover{background:rgba(5,7,15,.8)}
.hero-watch{position:absolute;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(100% + 18px);left:auto}
@media (min-width:900px){.hero-watch{right:max(40px,env(safe-area-inset-right,0px))}}
.hero-stats{overflow:visible;background:none!important;border:0!important;backdrop-filter:none!important;height:0}
.hero-watch{bottom:clamp(28px,5vw,56px)!important}
.feature .play{top:16px;bottom:auto}
@media (max-width:700px){.hero-watch{display:none}}

/* ---------- statement reel ---------- */
.statement{overflow:clip}
.reel{position:relative;justify-self:end;width:min(300px,100%)}
.reel .arcs{position:absolute;inset:-14% -22% auto auto;width:150%;max-width:none;z-index:0;opacity:.9}
.reel .media{position:relative;z-index:1;aspect-ratio:9/14;box-shadow:var(--shadow)}
@media (max-width:760px){.reel{justify-self:start;width:min(260px,72%)}}

/* ---------- about collage ---------- */
.about .pic .media.sm{position:absolute;right:-26px;top:-30px;width:40%;aspect-ratio:1;border:6px solid var(--paper-2);border-radius:22px;z-index:2;box-shadow:var(--shadow)}
@media (max-width:860px){.about .pic .media.sm{right:10px;top:-24px}}

/* ---------- pests strip ---------- */
.rowhead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:clamp(28px,4vw,44px)}
.rowhead .h{display:grid;gap:14px;max-width:720px;min-width:0}
.rowhead h2{font-size:var(--t-xl)}
.rowhead p{color:var(--ink-soft)}
.arrows{display:flex;gap:10px}
.arrows button{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line);background:var(--paper);display:grid;place-items:center;color:var(--ink);transition:border-color .2s,background .2s}
.arrows button:hover{border-color:var(--blue)}
.arrows button svg{width:18px;height:18px}
.arrows .prev svg{transform:rotate(180deg)}
.track{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,calc((100% - 3*20px)/4));gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.track::-webkit-scrollbar{display:none}
@media (max-width:900px){.track{grid-auto-columns:minmax(200px,44%)}}
@media (max-width:520px){.track{grid-auto-columns:76%}}
.pest{scroll-snap-align:start;position:relative;display:block;border-radius:var(--r);overflow:hidden;text-decoration:none;color:#fff}
.pest .media{aspect-ratio:3/4;border-radius:0}
.pest .media img{transition:transform .8s,opacity .4s}
.pest:hover .media img{transform:scale(1.06)}
.pest .cap{position:absolute;inset:auto 0 0;padding:60px 18px 18px;background:linear-gradient(0deg,rgba(5,7,15,.92),rgba(5,7,15,0));display:grid;gap:4px}
.pest .cap b{font-family:var(--f-display);font-size:var(--t-lg);font-weight:600}
.pest .cap small{display:inline-flex;align-items:center;gap:6px;color:var(--cyan);font-weight:600;font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase}
.pest .cap small svg{width:12px;height:12px}
.note{margin-top:22px;color:var(--ink-soft);font-size:var(--t-sm)}

/* ---------- spaces mosaic ---------- */
.spaces{background:var(--paper-2)}
.mosaic{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tile{position:relative;margin:0;border-radius:var(--r);overflow:hidden;color:#fff}
.tile .media{aspect-ratio:4/3;border-radius:0}
.tile .media img{transition:transform .9s,opacity .4s}
.tile:hover .media img{transform:scale(1.06)}.tile figcaption,.tile .tcap{position:absolute;inset:auto 0 0;padding:56px 20px 18px;background:linear-gradient(0deg,rgba(5,7,15,.9),rgba(5,7,15,0));display:grid;gap:4px}.tile figcaption b,.tile .tcap b{font-family:var(--f-display);font-size:var(--t-lg);font-weight:600}
.tile .eyebrow{color:var(--cyan)}
@media (max-width:900px){.mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.mosaic{grid-template-columns:1fr}}

/* ---------- PPE catalogue ---------- */
.ppe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,28px)}
.item{display:grid;gap:10px;align-content:start}
.item .media{aspect-ratio:4/3}
.item .media img{transition:transform .8s,opacity .4s}
.item:hover .media img{transform:scale(1.05)}
.item h3{font-size:var(--t-md);margin-top:6px}
.item p{color:var(--ink-soft);font-size:var(--t-sm)}
.ppe-foot{display:flex;flex-wrap:wrap;gap:18px 28px;align-items:center;justify-content:space-between;margin-top:clamp(28px,4vw,40px);padding-top:24px;border-top:1px solid var(--line)}
.ppe-foot p{color:var(--ink-soft);max-width:62ch;min-width:0}
.ppe-foot .pill{color:var(--ink)}
@media (max-width:900px){.ppe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.ppe-grid{grid-template-columns:1fr}}

/* ---------- method split with sticky video ---------- */
.method .split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,90px);align-items:start}
.method .stick{position:sticky;top:calc(var(--hdr) + 24px)}
.method .stick .media{aspect-ratio:4/5}
.method .split .steps{grid-template-columns:1fr;gap:0;margin-top:clamp(28px,4vw,40px)}
.method .split .steps li{padding:0 0 30px 46px}
.method .split .steps li::before{top:8px;bottom:0;left:5px;right:auto;width:2px;height:auto}
.method .split .steps li:last-child::before{display:none}
.method .split .steps li::after{top:2px;box-shadow:0 0 0 5px var(--paper)}
@media (max-width:860px){.method .split{grid-template-columns:1fr}.method .stick{position:relative;top:0}.method .stick .media{aspect-ratio:16/10}}

/* ---------- gallery ---------- */
.gallery .wall{columns:3 280px;column-gap:16px}
.gi{display:block;width:100%;margin:0 0 16px;break-inside:avoid;border:0;padding:0;background:none;position:relative;border-radius:var(--r);overflow:hidden;color:#fff;text-align:left}
.gi .media{display:block;border-radius:0;aspect-ratio:4/3}
.gi.tall .media{aspect-ratio:3/4}
.gi.wide .media{aspect-ratio:16/10}
.gi .media img,.gi .media video{transition:transform .8s,opacity .4s}
.gi:hover .media img,.gi:hover .media video{transform:scale(1.05)}
.gi .cap{position:absolute;inset:auto 0 0;padding:44px 16px 14px;background:linear-gradient(0deg,rgba(5,7,15,.88),rgba(5,7,15,0));font-weight:600;font-size:var(--t-sm);display:flex;align-items:center;gap:10px}
.gi .cap i{width:28px;height:28px;flex:none;border-radius:50%;background:var(--grad);display:grid;place-items:center;color:#05070f}
.gi .cap i svg{width:12px;height:12px}
.gi .tag{position:absolute;top:12px;left:12px;z-index:2;font-size:var(--t-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:100px;background:rgba(5,7,15,.55);backdrop-filter:blur(6px)}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;z-index:100;background:rgba(3,5,12,.94);display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:calc(env(safe-area-inset-top,0px) + 8px) max(12px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 16px) max(12px,env(safe-area-inset-left,0px));color:#fff}
.lb[hidden]{display:none!important}
.lb .top{display:flex;justify-content:space-between;align-items:center;height:56px;font-variant-numeric:tabular-nums;color:#a9badb;font-size:var(--t-sm)}
.lb .stage{display:grid;place-items:center;min-height:0;position:relative}
.lb .stage img,.lb .stage video{max-width:100%;max-height:100%;border-radius:12px;object-fit:contain;background:#0a1430}
.lb .stage .fallback{width:min(720px,100%);aspect-ratio:16/9;border-radius:12px}
.lb .bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px}
.lb .bottom p{font-family:var(--f-display);font-weight:600;min-width:0}
.lb .nav{display:flex;gap:10px}
.lb .nav button,.lb .x{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;display:grid;place-items:center}
.lb .nav button svg,.lb .x svg{width:20px;height:20px}
.lb .nav .prev svg{transform:rotate(180deg)}
.lb .nav button:hover,.lb .x:hover{background:rgba(255,255,255,.14)}

.maplink{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-xs);font-weight:600;color:var(--accent);text-decoration:none;margin-top:4px}
.maplink:hover{text-decoration:underline}


/* =================== responsive optimisation =================== */
.sec{padding-block:clamp(52px,8vw,112px)}
.tint{background:var(--paper-2)}
.lang button{min-height:32px}
.arrows button:disabled{opacity:.35;cursor:default;border-color:var(--line)}

/* menu bar: full nav from 1024px, contact button from 1180px */
@media (min-width:1024px) and (max-width:1179px){
  .nav{display:flex}
  .burger{display:none}
  .nav>ul>li>a,.nav>ul>li>button{padding:0 11px}
}

/* hero */
@media (max-width:1023px){.hero-watch{display:none}}
@media (max-width:700px){
  .hero-inner{min-height:clamp(520px,88svh,680px);padding-bottom:22px}
  .hcopy{gap:14px}
  .hcopy p{font-size:var(--t-sm)}
  .hcopy .acts .pill{font-size:var(--t-sm);padding-left:16px}
  .hcopy .acts .pill .disc{width:32px;height:32px}
}

/* statement reel */
@media (max-width:760px){
  .statement .grid{gap:28px}
  .reel{width:100%}
  .reel .media{aspect-ratio:16/10}
  .reel .arcs{display:none}
}

/* about */
@media (max-width:1023px){
  .about .grid{gap:40px}
  .about .pic .media{aspect-ratio:16/10}
  .about .pic .media.sm{width:28%;top:-20px;right:14px;border-width:4px}
  .badge{left:14px;bottom:14px}
}

/* services: 2x2 on tablet, compact rows on phones */
@media (max-width:900px){
  .scard.big{grid-column:auto}
  .scard.big .media{aspect-ratio:4/3}
  .scard.big h3{font-size:var(--t-lg)}
}
@media (max-width:600px){
  .svc-grid{grid-template-columns:1fr;gap:12px}
  .svc-intro{margin-bottom:8px}
  .scard,.scard.big{grid-template-columns:104px minmax(0,1fr);column-gap:14px;row-gap:3px;padding:10px;border:1px solid var(--line);border-radius:16px;background:var(--paper);align-items:start}
  .scard .media,.scard.big .media{grid-row:1 / span 5;aspect-ratio:1;border-radius:12px}
  .scard .eyebrow{margin-top:2px;font-size:.66rem;letter-spacing:.1em}
  .scard h3,.scard.big h3{font-size:var(--t-md)}
  .scard p{font-size:var(--t-xs);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .scard .tlink{font-size:var(--t-xs)}
}

/* spaces: two-up tiles on phones */
@media (max-width:600px){
  .mosaic{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .tile .media{aspect-ratio:1}.tile figcaption,.tile .tcap{padding:44px 12px 12px;gap:2px}.tile figcaption b,.tile .tcap b{font-size:var(--t-base);line-height:1.25}
  .tile .eyebrow{font-size:.6rem;letter-spacing:.1em}
}

/* method: side by side from tablet */
@media (min-width:700px){
  .method .split{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  .method .stick{position:sticky;top:calc(var(--hdr) + 24px)}
  .method .stick .media{aspect-ratio:4/5}
}

/* PPE: always at least two columns */
@media (max-width:600px){
  .ppe-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
  .item .media{aspect-ratio:1;border-radius:14px}
  .item h3{font-size:var(--t-sm);margin-top:2px}
  .item p{font-size:var(--t-xs)}
  .ppe-foot{flex-direction:column;align-items:flex-start}
}

/* why: swipeable cards on phones */
@media (max-width:600px){
  .why-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:82%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;padding-bottom:4px}
  .why-grid::-webkit-scrollbar{display:none}
  .why-grid .card{scroll-snap-align:start}
}

/* gallery: two-up on phones, first six shown until "show all" */
.gmore{display:none;justify-content:center;margin-top:24px}
.gmore .pill{color:var(--ink)}
@media (max-width:1023px){
  .wall.clip .gi:nth-child(n+7){display:none}
  .wall.clip + .gmore{display:flex}
}
@media (max-width:600px){
  .gallery .wall{columns:2;column-gap:10px}
  .gi{margin-bottom:10px;border-radius:14px}
  .gi .cap{padding:30px 10px 10px;font-size:var(--t-xs);gap:8px}
  .gi .cap i{width:22px;height:22px}
  .gi .cap i svg{width:10px;height:10px}
  .gi .tag{display:none}
}

/* action card + band */
@media (max-width:600px){
  .action .card{width:calc(100% - 16px)}
  .band .pill{width:100%;justify-content:space-between}
}

/* footer */
@media (max-width:560px){
  .foot .top{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 20px}
  .foot .brand,.foot .cert{grid-column:1/-1}
  .foot .bottom{padding-bottom:calc(22px + 72px)}
}

/* modal becomes a bottom sheet on phones */
@media (max-width:600px){
  .modal{align-items:flex-end;padding:calc(env(safe-area-inset-top,0px) + 24px) 0 0}
  .modal-box{width:100%;max-height:92vh;border-radius:22px 22px 0 0;animation:sheet .38s cubic-bezier(.2,.7,.2,1);padding-bottom:env(safe-area-inset-bottom,0px)}
  .modal-box .media{aspect-ratio:16/9}
  .modal-box::before{content:"";position:absolute;top:8px;left:50%;width:44px;height:4px;border-radius:4px;background:rgba(255,255,255,.7);transform:translateX(-50%);z-index:3}
}
@keyframes sheet{from{transform:translateY(40%);opacity:.4}to{transform:none;opacity:1}}

/* phone quick-action bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:none;gap:10px;padding:10px max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));background:var(--hdr-bg);backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.mbar.show{transform:none}
.mbar a{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;border-radius:100px;font-weight:600;font-size:var(--t-sm);text-decoration:none}
.mbar .call{flex:1;border:1.5px solid var(--ink);color:var(--ink)}
.mbar .req{flex:1.8;background:var(--grad);color:#05070f}
.mbar svg{width:17px;height:17px}
@media (max-width:700px){
  .mbar{display:flex}
  body.mbar-on .totop{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
}


/* tablet: denser grids, shorter feature photos */
@media (min-width:601px) and (max-width:1023px){
  .mosaic,.ppe-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tile figcaption b,.tile .tcap b{font-size:var(--t-md)}
}
@media (min-width:601px) and (max-width:860px){
  .feature .media,.feature.rev .media{aspect-ratio:16/10}
}

/* tighter vertical rhythm between sections */
.sec{padding-block:clamp(36px,5vw,72px)}
.rowhead{margin-bottom:clamp(20px,3vw,32px)}
.why .head,.method .head{margin-bottom:0}
.why .head{margin-bottom:clamp(24px,3.5vw,40px)}
.stats{margin-top:clamp(32px,4vw,56px)}
.feature + .after{height:56px}
#nuisibles{padding-top:0!important}
#fourniture .rowhead[style]{margin-top:clamp(40px,5vw,64px)!important}
.action .card{margin-top:-96px}
@media (max-width:860px){.feature + .after{height:0}}
@media (max-width:700px){.action .card{margin-top:-56px}}

/* phones: "Pourquoi OmniCore" listed like the service rows */
@media (max-width:600px){
  .why-grid{display:grid;grid-template-columns:1fr;grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none;gap:12px;padding-bottom:0}
  .why-grid .card{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:14px;row-gap:3px;align-items:start;padding:12px;border-radius:16px;background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:none}
  .why-grid .card:hover{transform:none;box-shadow:none}
  .why-grid .ico{grid-row:1 / span 2;width:64px;height:64px;border-radius:12px;background:var(--panel);border:0;color:var(--cyan)}
  .why-grid .ico svg{width:26px;height:26px}
  .why-grid h3{font-size:var(--t-md);color:var(--ink);margin-top:2px}
  .why-grid p{font-size:var(--t-xs);color:var(--ink-soft);line-height:1.5}
}

/* phones: "Pourquoi OmniCore" as a list, matching the services rows */
@media (max-width:600px){
  .why-grid{grid-auto-flow:row;grid-template-columns:1fr;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none;gap:12px;padding-bottom:0}
  .why-grid .card{grid-template-columns:56px minmax(0,1fr);column-gap:14px;row-gap:3px;align-items:start;padding:12px;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:16px;box-shadow:none}
  .why-grid .card:hover{transform:none;box-shadow:none}
  .why-grid .ico{grid-row:1 / span 2;width:56px;height:56px;border-radius:12px;background:var(--paper-2);border:0;color:var(--accent)}
  .why-grid h3{font-size:var(--t-md);color:var(--ink);margin-top:2px}
  .why-grid p{font-size:var(--t-xs);color:var(--ink-soft)}
}

/* phones: "Pourquoi OmniCore" uses the exact services row: photo, label, title, text */
.wthumb,.weye{display:none}
@media (max-width:600px){
  .why-grid .card{grid-template-columns:104px minmax(0,1fr);column-gap:14px;row-gap:3px;padding:10px}
  .why-grid .ico{display:none}
  .why-grid .wthumb{display:block;grid-row:1 / span 3;aspect-ratio:1;border-radius:12px}
  .why-grid .weye{display:block;margin-top:2px;font-size:.66rem;letter-spacing:.1em;color:var(--accent)}
  .why-grid h3{margin-top:0}
}
a.tile{display:block;text-decoration:none}
a.tile .tcap b{display:flex;align-items:center;gap:8px}
a.tile:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

/* gallery: even grid, same tile size everywhere */
.gallery .wall{columns:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.gi{margin:0}
.gi .media,.gi.tall .media,.gi.wide .media{aspect-ratio:4/3}
@media (max-width:1023px){.wall.clip .gi:nth-child(n+7){display:none}}
@media (max-width:600px){
  .gallery .wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .gi:first-child{grid-column:1/-1}
  .gi:first-child .media{aspect-ratio:16/9}
  .wall.clip .gi:nth-child(7){display:block}
  .wall.clip .gi:nth-child(n+8){display:none}
}
/* ---------- reveal (visible at rest, animates on entry) ---------- */
.rv.in{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.rv.in.d1{animation-delay:.08s}.rv.in.d2{animation-delay:.16s}.rv.in.d3{animation-delay:.24s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* =================== multipage: inner-page banner, service details, search =================== */
.pbanner{position:relative;background:var(--panel);color:#fff;overflow:hidden}
.pbanner>.media{position:absolute;inset:0;border-radius:0}
.pbanner>.media img{transform:scale(1.03)}
.pbanner::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(5,7,15,.88) 0%,rgba(5,7,15,.55) 55%,rgba(5,7,15,.25) 100%),linear-gradient(0deg,rgba(5,7,15,.55),transparent 45%)}
.pb-inner{position:relative;z-index:2;display:grid;gap:16px;align-content:end;min-height:clamp(380px,52vh,520px);padding-top:calc(var(--hdr) + 38px + env(safe-area-inset-top,0px) + 40px);padding-bottom:clamp(36px,6vw,64px)}
.pbanner.short .pb-inner{min-height:clamp(320px,40vh,420px)}
@media (max-width:1179px){.pb-inner{padding-top:calc(var(--hdr) + env(safe-area-inset-top,0px) + 32px)}}
.pb-inner .eyebrow{color:var(--cyan)}
.pb-inner h1{font-size:var(--t-2xl);font-weight:700;max-width:20ch}
.pb-inner .lead{color:#cfdaf2;max-width:60ch}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:var(--t-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.crumbs a{color:#a9badb;text-decoration:none}
.crumbs a:hover{color:#fff}
.crumbs svg{width:12px;height:12px;color:var(--cyan)}
@media (max-width:600px){.pb-inner{min-height:clamp(340px,62svh,460px)}.pb-inner .lead{font-size:var(--t-base)}}
.clist{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.clist li{display:flex;gap:10px;align-items:flex-start;color:var(--on-panel);font-size:var(--t-sm)}
.clist svg{width:20px;height:20px;flex:none;margin-top:1px;padding:4px;border-radius:50%;background:var(--grad);color:#05070f}
.card .pill{color:var(--on-panel);justify-self:start;margin-top:6px}
.svc-detail + .svc-detail{padding-top:0}
@media (min-width:861px){
  .svc-detail .feature{align-items:center}
  .svc-detail .feature .media{grid-column:1/8;aspect-ratio:4/3}
  .svc-detail .feature .card{grid-column:7/13;align-self:center;margin:0}
  .svc-detail .feature.rev .media{grid-column:6/13}
  .svc-detail .feature.rev .card{grid-column:1/7}
  .svc-detail .after{display:none}
}
.gmore.show{display:flex!important}
.drop.mega .cols a.all{grid-column:1/-1}
.results .rp{display:inline-block;margin-left:8px;font-size:var(--t-xs);font-weight:600;color:var(--accent);letter-spacing:.06em;text-transform:uppercase;vertical-align:middle}
.results b{display:inline}
.results small{display:block}
.m-main li.on>a,.m-main li.on>button{color:var(--on-panel)}
.m-main li.on>a::before,.m-main li.on>button::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--grad);margin-right:12px;vertical-align:middle}
.m-main li.on>button{justify-content:flex-start}
.m-main li.on>button svg{margin-left:auto}
.action .media{max-width:100%}
@media (max-width:700px){.action .media{min-height:0}}