:root { color-scheme: dark; --ink:#0d1010; --panel:#171b1b; --orange:#ff8a00; --green:#77ff79; --paper:#f2efe8; }
* { box-sizing: border-box; }
html, body { margin:0; min-height:100%; background:var(--ink); color:var(--paper); font-family:Arial,Helvetica,sans-serif; }
body { overflow-x:hidden; }
.site-head { height:82px; padding:0 max(5vw,32px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #313838; background:#0b0d0d; position:relative; z-index:2; }
.wordmark { color:#fff; font-size:29px; font-weight:900; letter-spacing:-1px; text-decoration:none; }
.wordmark span { color:var(--orange); }
.site-head nav { display:flex; gap:30px; }
.site-head nav a, .site-head details a { color:#cbd0ce; text-decoration:none; text-transform:uppercase; font-size:13px; font-weight:700; letter-spacing:1.4px; padding:31px 0 27px; border-bottom:3px solid transparent; cursor:pointer; }
.site-head nav a:hover, .site-head nav a:focus, .site-head nav a.active { color:#fff; border-color:var(--orange); outline-offset:4px; }
.site-head details { display:none; }
main { min-height:calc(100vh - 164px); }
.hero { max-width:1320px; margin:0 auto; position:relative; min-height:590px; overflow:hidden; background:#151919; }
.hero img { display:block; width:100%; height:590px; object-fit:cover; object-position:center; opacity:.78; }
.hero:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,10,10,.88) 0%,rgba(8,10,10,.25) 58%,rgba(8,10,10,.05)); pointer-events:none; }
.hero-copy { position:absolute; z-index:1; left:7%; bottom:58px; width:min(640px,84%); }
.hero-copy > p { color:var(--green); font-size:13px; letter-spacing:3px; font-weight:800; }
.hero h1 { margin:12px 0 18px; max-width:760px; color:#fff; font-size:clamp(48px,6.2vw,92px); line-height:.95; letter-spacing:-3px; }
.hero-copy > div { max-width:620px; color:#eef0ee; font-size:20px; line-height:1.55; }
.feature-grid, .work-grid, .copy { width:min(1180px,90vw); margin:64px auto 84px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.feature { min-height:230px; padding:34px; color:#e9ece9; background:var(--panel); border:1px solid #2b3131; text-decoration:none; cursor:pointer; transition:transform .2s,border-color .2s; }
.feature:hover, .feature:focus { transform:translateY(-5px); border-color:var(--orange); outline:none; }
.feature span, .work-grid b { color:var(--orange); font-size:12px; letter-spacing:2px; }
.feature h2, .work-grid h2, .copy h2 { margin:28px 0 12px; color:#fff; font-size:28px; }
.feature p, .work-grid p, .copy p, .notice { color:#b8bfbc; font-size:16px; line-height:1.7; }
.copy { max-width:850px; }
.copy h2 { font-size:42px; }
.copy p { font-size:18px; }
.work-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.work-grid article { min-height:230px; padding:36px; background:linear-gradient(135deg,#1b2020,#111414); border-top:4px solid var(--orange); }
.store-grid { grid-template-columns:repeat(3,1fr); margin-bottom:28px; }
.notice { width:min(1180px,90vw); margin:0 auto 84px; padding:18px 24px; border-left:3px solid var(--green); background:#171b1b; }
footer { min-height:82px; padding:26px max(5vw,32px); display:flex; justify-content:space-between; gap:20px; color:#87908c; border-top:1px solid #313838; background:#0b0d0d; }
footer a { color:#fff; font-weight:800; text-decoration:none; cursor:pointer; }
a:not([href]) { cursor:default; }
@media(max-width:760px){.site-head nav{display:none}.site-head details{display:block;position:relative}.site-head summary{cursor:pointer;text-transform:uppercase;font-weight:800}.site-head details div{position:absolute;right:0;top:36px;width:210px;padding:12px 22px;background:#151919;border:1px solid #343b3b}.site-head details a{display:block;padding:12px 0}.hero,.hero img{min-height:500px;height:500px}.hero-copy>div{font-size:17px}.feature-grid,.work-grid,.store-grid{grid-template-columns:1fr}.hero h1{letter-spacing:-2px}.copy h2{font-size:34px}footer{flex-direction:column}}