/* ===== Steele Group — shared site styles ===== */
:root{
  --black:#000; --ink:#FFF; --muted:#9BA1A6; --faint:#5F656A;
  --red:#E5402E; --line:rgba(255,255,255,.14);
  --gut:24px; --nav:72px; --maxw:1600px;
}
[data-theme="light"]{
  --black:#FFF; --ink:#0C0E12; --muted:#5C636B; --faint:#9AA1A8; --line:rgba(0,0,0,.13);
}
*{margin:0;padding:0;box-sizing:border-box}
/* overflow-x:clip, not hidden — `hidden` on one axis forces the other to `auto`,
   which turns body into a scroll container and fights the smooth-scroll library.
   `hidden` is kept first as a fallback for browsers without `clip`. */
body{background:var(--black);color:var(--ink);font-family:'Schibsted Grotesk',sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip;line-height:1.5}
a{color:inherit;text-decoration:none}
h1,h2,h3{letter-spacing:-.02em;line-height:1.05;font-weight:600}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.lab{font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--muted)}

.prog{position:fixed;top:0;left:0;width:100%;height:3px;background:var(--red);z-index:100;pointer-events:none;transform:translateX(-100%)}
.prog .cap{display:none}

/* NAV */
/* own layer: smooth scrolling lands on sub-pixel offsets, and re-rasterising a
   sticky bar at those offsets reads as a shimmer/shake */
header{position:sticky;top:0;z-index:60;background:var(--black);will-change:transform}
.nav{height:var(--nav);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--gut)}
.brand{display:flex;align-items:center}
.brand img{height:51px;width:auto;display:block}
.brand .logo-dark{display:none}
[data-theme="light"] .brand .logo-light{display:none}
[data-theme="light"] .brand .logo-dark{display:block}
.links{display:flex;gap:clamp(20px,2.3vw,38px);justify-content:center}
.links a{font-size:15px;color:var(--ink);opacity:.9;transition:opacity .2s;cursor:pointer;white-space:nowrap}
.links a:hover,.links a.trig-active{opacity:.55}
.links a.cur{opacity:1;color:var(--red)}
.util{display:flex;gap:clamp(14px,1.6vw,22px);justify-content:flex-end;align-items:center}
.util a{font-size:15px;white-space:nowrap}.util a:hover{opacity:.6}
.theme-toggle{width:36px;height:36px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:none;color:var(--ink);transition:border-color .2s;flex:0 0 auto}
.theme-toggle:hover{border-color:var(--muted)}
.theme-toggle svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round}
.theme-toggle .ic-moon{display:none}
[data-theme="light"] .theme-toggle .ic-sun{display:none}
[data-theme="light"] .theme-toggle .ic-moon{display:block}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer}.burger span{width:22px;height:2px;background:var(--ink)}

/* MEGA MENU */
.mega{position:absolute;left:0;right:0;top:100%;background:#08090b;border-top:1px solid var(--line);border-bottom:1px solid var(--line);max-height:0;opacity:0;overflow:hidden;transition:max-height .5s cubic-bezier(.16,1,.3,1),opacity .3s ease;pointer-events:none}
.mega.open{max-height:80vh;opacity:1;pointer-events:auto}
[data-theme="light"] .mega{background:#fff;box-shadow:0 30px 60px -30px rgba(0,0,0,.22)}
.mega-inner{max-width:1500px;margin:0 auto;padding:clamp(36px,4vw,58px) var(--gut) clamp(42px,5vw,64px)}
.mega-content{display:none;grid-template-columns:minmax(260px,.9fr) 2fr;gap:clamp(40px,6vw,110px)}
.mega-content.active{display:grid;animation:megaIn .5s cubic-bezier(.16,1,.3,1)}
@keyframes megaIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.mega-left .lab{display:block;margin-bottom:16px}
.mega-left h3{font-size:clamp(22px,2.4vw,32px);line-height:1.1}
.mega-left p{color:var(--muted);font-size:15px;line-height:1.6;margin-top:16px;max-width:34ch}
.alllink{display:inline-flex;gap:8px;align-items:center;margin-top:22px;font-size:13.5px;font-weight:500;border-bottom:1px solid var(--line);padding-bottom:4px;transition:.25s}
.alllink:hover{border-color:var(--ink);gap:12px}
.mega-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(30px,4vw,64px);align-content:start}
.mega-item{display:flex;gap:13px;align-items:baseline;padding:13px 4px 13px 0;border-bottom:1px solid var(--line);transition:padding-left .3s}
.mega-item:hover{padding-left:8px}
.mega-item .plus{color:var(--red);font-size:15px;transition:transform .3s}.mega-item:hover .plus{transform:rotate(90deg)}
.mega-item .mi-name{font-size:clamp(15px,1.35vw,19px);font-weight:600}
.mega-item .mi-sub{display:block;font-size:12.5px;color:var(--muted);margin-top:3px}
.mega-scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .35s;z-index:55}
.mega-scrim.on{opacity:1}

/* BUTTONS */
.btn{font-size:14px;font-weight:500;padding:14px 24px;background:var(--ink);color:var(--black);display:inline-flex;gap:8px;align-items:center;transition:.25s;cursor:pointer;border:0;font-family:inherit}
.btn:hover{background:var(--red);color:#fff}
.btn2{border:1px solid var(--line);color:var(--ink);background:transparent}
.btn2:hover{background:transparent;border-color:var(--ink);color:var(--ink)}

/* PAGE HERO (interior) */
.phero{position:relative;min-height:60vh;display:flex;align-items:flex-end;overflow:hidden;border-bottom:1px solid var(--line)}
.phero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.4) brightness(.42) contrast(1.05)}
.phero .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.1) 40%,rgba(0,0,0,.85))}
.phero .inner{position:relative;z-index:2;padding:clamp(48px,7vw,96px) var(--gut);max-width:var(--maxw);margin:0 auto;width:100%}
.phero .lab{color:rgba(255,255,255,.72)}
.phero h1{color:#fff;font-size:clamp(38px,6vw,84px);max-width:16ch;margin-top:18px}
.phero p{color:rgba(255,255,255,.82);max-width:560px;margin-top:24px;font-size:clamp(15px,1.4vw,18px);line-height:1.6}

/* STAT BAND */
.band{border-bottom:1px solid var(--line)}
.bg4{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--maxw);margin:0 auto}
.bs{padding:clamp(26px,3vw,44px) 28px;border-right:1px solid var(--line)}
.bs:last-child{border-right:0}
.bn{font-size:clamp(26px,3vw,44px);font-weight:600;letter-spacing:-.03em}
.bl{margin-top:9px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-family:'JetBrains Mono'}

/* FEATURE ROWS */
.frow{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border-bottom:1px solid var(--line)}
.frow .media{position:relative;min-height:440px;overflow:hidden}
.frow .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.4) brightness(.62) contrast(1.05);transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.frow:hover .media img{transform:scale(1.05)}
.frow .body{padding:clamp(40px,5vw,84px);display:flex;flex-direction:column;justify-content:center;max-width:640px}
.frow.flip .media{order:2}
.frow .num{font-family:'JetBrains Mono';font-size:12px;color:var(--faint);letter-spacing:.1em}
.frow .tag{color:var(--red);font-family:'JetBrains Mono';font-size:12px;text-transform:uppercase;letter-spacing:.12em;margin-top:16px}
.frow h2{font-size:clamp(28px,3.4vw,46px);margin:12px 0 18px}
.frow .desc{color:var(--muted);font-size:16px;line-height:1.7}
.frow .stats{display:flex;gap:28px;flex-wrap:wrap;margin:28px 0 30px}
.frow .stats .n{font-size:clamp(20px,2vw,28px);font-weight:600;letter-spacing:-.02em}
.frow .stats .l{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:'JetBrains Mono';margin-top:5px}
.frow .go{display:inline-flex;gap:9px;align-items:center;font-family:'JetBrains Mono';font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--line);padding-bottom:5px;width:fit-content;transition:.25s}
.frow .go:hover{gap:14px;border-color:var(--ink)}

/* SECTION HELPERS */
.sec{padding:clamp(70px,10vw,140px) var(--gut);max-width:var(--maxw);margin:0 auto}
.sec-head{margin-bottom:clamp(34px,4vw,56px)}
.sec-head h2{font-size:clamp(28px,3.8vw,54px);font-weight:600;max-width:22ch}
.sec-head .lab{display:block;margin-bottom:14px}

/* CTA + FOOTER */
.cta{border-top:1px solid var(--line);padding:clamp(90px,12vw,160px) var(--gut);text-align:center}
.cta h2{font-size:clamp(32px,5vw,72px)}
.cta p{color:var(--muted);max-width:430px;margin:20px auto 32px}
footer{border-top:1px solid var(--line);padding:56px var(--gut) 36px}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;max-width:1500px}
.fg .brand img{height:57px}
.fg .about{color:var(--muted);font-size:14px;max-width:30ch;margin-top:16px}
.fg h4{font-family:'JetBrains Mono';font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--faint);margin-bottom:16px}
.fg a{display:block;color:var(--muted);font-size:14px;margin-bottom:10px}.fg a:hover{color:var(--ink)}
.fbot{display:flex;justify-content:space-between;margin-top:50px;padding-top:24px;border-top:1px solid var(--line);flex-wrap:wrap;gap:12px;color:var(--faint);font-size:13px;font-family:'JetBrains Mono'}

.rv{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}

@media(max-width:1000px){
  .links,.util,.mega,.mega-scrim{display:none}
  .nav{grid-template-columns:auto 1fr}
}
@media(max-width:900px){
  .bg4{grid-template-columns:1fr 1fr}.bs:nth-child(2){border-right:0}.bs:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .frow{grid-template-columns:1fr}.frow.flip .media{order:0}.frow .media{min-height:300px}
  .fg{grid-template-columns:1fr 1fr}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}