:root{--bg:#08090a;--panel:#101214;--soft:#e9e9e5;--ink:#101112;--fg:#f3f3ef;--muted:#777c81;--line:#292d31;--accent:#d7d9da}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}
nav{height:72px;position:sticky;top:0;z-index:50;background:rgba(8,9,10,.94);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid #181b1e}
.logo{font-weight:900;letter-spacing:7px;font-size:21px}.navlinks{display:flex;gap:27px;font-size:9px;letter-spacing:1.5px}.tools{display:flex;gap:16px;font-size:9px;letter-spacing:1px}
.hero{min-height:calc(100vh - 72px);display:flex;align-items:flex-end;position:relative;overflow:hidden;background:#08090a url("noxxen-hero-g80.webp") center 48%/cover no-repeat}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,7,.90) 0%,rgba(5,6,7,.66) 34%,rgba(5,6,7,.16) 67%,rgba(5,6,7,.08) 100%),linear-gradient(0deg,rgba(5,6,7,.72) 0%,transparent 45%)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.20),transparent 24%);pointer-events:none}
.heroCopy{position:relative;z-index:2;padding:0 4vw 8vh;max-width:830px}.k{font-size:8px;letter-spacing:3px;color:#999da1}.hero h1{font-size:clamp(60px,8vw,118px);line-height:.84;letter-spacing:-.06em;margin:17px 0}.hero h1 span{color:#73777b}.hero p{max-width:520px;color:#9ca0a4;line-height:1.75;font-size:12px}.btn{display:inline-block;border:1px solid #686d72;padding:14px 20px;margin:20px 7px 0 0;font-size:8px;letter-spacing:2px}.btn.white{background:#efefeb;color:#101112;border-color:#efefeb}
.strip{display:flex;justify-content:space-around;padding:14px;background:#111315;border-block:1px solid #25282c;font-size:8px;letter-spacing:2px;color:#898e92}
.section{padding:105px 4vw}.light{background:var(--soft);color:var(--ink)}.head{display:flex;justify-content:space-between;align-items:end;margin-bottom:43px}.head h2{font-size:clamp(40px,5.4vw,75px);line-height:.92;letter-spacing:-.055em;margin:10px 0}.head p{max-width:420px;color:#73777b;line-height:1.7;font-size:11px}
.garage{background:#d9d9d4;border:1px solid #c8c8c3;padding:22px;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;margin-bottom:32px}.garage select{padding:14px;background:#efefeb;border:1px solid #bbb}.garage button{border:0;background:#111;color:white;padding:0 22px;font-size:9px;letter-spacing:1.5px}
.categories{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.category{min-height:350px;background:#121416;position:relative;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.category:before{content:"";position:absolute;left:10%;right:10%;top:20%;height:85px;border:23px solid #353a3e;border-radius:60%;transform:rotate(-10deg);opacity:.75}.category>*{position:relative;z-index:2}.category small{font-size:8px;letter-spacing:2px;color:#7f8488}.category h3{font-size:25px;margin:7px 0}.category span{font-size:8px;letter-spacing:1.5px}
.feature{display:grid;grid-template-columns:1.15fr .85fr;min-height:660px}.featureVisual{background:radial-gradient(circle at 45%,#373b3e,#141618 55%,#08090a);position:relative}.featureVisual:after{content:"";position:absolute;width:66%;height:125px;border:35px solid #555b60;border-radius:90px;left:16%;top:39%;transform:rotate(-15deg);box-shadow:inset 0 0 50px #070809,0 30px 70px #000}.featureCopy{padding:8vw 6vw}.featureCopy h2{font-size:56px;letter-spacing:-3px;line-height:.95}.featureCopy p{font-size:12px;color:#858a8e;line-height:1.8}.spec{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:16px 0;font-size:9px}.spec span{color:#696e73}
.techGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#292c2f}.techCard{background:#0e1012;padding:29px;min-height:270px}.techCard b{font-size:21px;display:block;margin:55px 0 12px}.techCard p{font-size:10px;color:#777d82;line-height:1.7}
.stories{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2px}.story{background:#d8d8d3;min-height:360px;padding:24px;display:flex;flex-direction:column;justify-content:flex-end}.story:first-child{min-height:520px}.story small{font-size:8px;letter-spacing:2px;color:#777}.story h3{font-size:25px;margin:9px 0}
.owners{text-align:center}.owners input{width:min(430px,70%);padding:15px;background:transparent;border:1px solid #999}.owners button{padding:16px 20px;border:0;background:#111;color:white;font-size:9px}.owners p{font-size:11px;color:#777}
footer{padding:55px 4vw;border-top:1px solid #23262a;display:flex;justify-content:space-between;color:#70757a;font-size:9px;line-height:1.8}
@media(max-width:820px){.navlinks{display:none}.tools span:not(:last-child){display:none}.garage{grid-template-columns:1fr}.garage button{padding:14px}.categories,.techGrid{grid-template-columns:1fr 1fr}.feature{grid-template-columns:1fr}.featureVisual{min-height:450px}.stories{grid-template-columns:1fr 1fr}.story:first-child{grid-column:1/-1}.head{display:block}.hero:after{width:80vw;height:25vw;right:-20%}}
@media(max-width:820px){.hero{min-height:calc(100svh - 72px);background-position:57% center}.hero:before{background:linear-gradient(0deg,rgba(5,6,7,.92) 0%,rgba(5,6,7,.48) 45%,rgba(5,6,7,.10) 72%) }.heroCopy{padding-bottom:7vh}.hero h1{font-size:clamp(54px,16vw,82px)}}
