:root{--bg:#08090a;--panel:#111315;--panel2:#17191c;--text:#f5f5f3;--muted:#9da2a6;--orange:#ff5a12;--line:#2a2d30}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:18px 5vw;background:rgba(8,9,10,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.brand{display:flex;flex-direction:column}.brand span{font-size:28px;font-weight:900;font-style:italic;letter-spacing:-1px;color:var(--orange)}.brand small{font-size:8px;letter-spacing:2.5px}
nav{display:flex;gap:24px;font-size:14px;font-weight:700}nav a:hover{color:var(--orange)}
.hero{min-height:72vh;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding:70px 7vw;background:radial-gradient(circle at 85% 20%,#3b1b0c 0,transparent 35%)}
.eyebrow{color:var(--orange);font-weight:900;letter-spacing:2px;font-size:12px}.hero h1,.section h2{margin:.15em 0;font-size:clamp(46px,7vw,92px);line-height:.9;letter-spacing:-4px}.hero h1 span{color:var(--orange)}
.lead{max-width:640px;color:#c3c6c8;font-size:20px;line-height:1.55}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-block;border:1px solid var(--line);padding:16px 20px;font-weight:900;cursor:pointer}.primary{background:var(--orange);border-color:var(--orange);color:#090909}.secondary{background:#111}
.hero-card{min-height:360px;border:1px solid var(--line);background:linear-gradient(145deg,#17191c,#0c0d0e);display:flex;flex-direction:column;justify-content:flex-end;padding:30px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.terrain{font-size:clamp(38px,5vw,70px);font-weight:950;line-height:.9}.terrain span{color:var(--orange)}.hero-card p{color:var(--muted);font-size:12px;line-height:1.8}
.brand-strip{display:flex;gap:35px;overflow:auto;padding:22px 5vw;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:#c9ccce;font-weight:900;white-space:nowrap}
.section{padding:90px 7vw}.section.alt{background:#0d0f10}.section-head{max-width:880px;margin-bottom:40px}.section h2{font-size:clamp(42px,6vw,72px)}
.finder-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px}.finder-card,.results,article{border:1px solid var(--line);background:var(--panel);padding:28px}.finder-card{display:grid;gap:18px}
label{display:grid;gap:8px;font-weight:800}select{width:100%;background:#0a0b0c;color:white;border:1px solid #333;padding:14px;font-size:16px}.results{min-height:330px}.result-item{padding:16px 0;border-bottom:1px solid var(--line)}.result-item:last-child{border:0}.result-item strong{color:var(--orange)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.shoe-card{border:1px solid var(--line);background:var(--panel);padding:22px;display:flex;flex-direction:column;min-height:245px}.shoe-card .tag{align-self:flex-start;color:var(--orange);font-size:11px;font-weight:900;letter-spacing:1px}.shoe-card h3{font-size:22px;margin:18px 0 8px}.shoe-card p{color:var(--muted);line-height:1.5}.shoe-card a{margin-top:auto;color:var(--orange);font-weight:900}
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}article h3{font-size:24px}article p{color:var(--muted);line-height:1.6}
.recycle{display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:center;background:linear-gradient(120deg,#17191c,#0c0d0e)}.recycle-badge{border:2px solid var(--orange);padding:36px;font-weight:950;font-size:28px;color:var(--orange);transform:rotate(-2deg)}.small{font-size:13px;color:var(--muted)}
footer{display:flex;justify-content:space-between;gap:30px;align-items:end;padding:40px 7vw;border-top:1px solid var(--line);color:var(--muted);font-size:12px}
@media(max-width:900px){nav{display:none}.hero,.finder-grid,.recycle{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}.guide-grid{grid-template-columns:1fr}.hero h1,.section h2{letter-spacing:-2px}.hero{padding-top:45px}.hero-card{min-height:250px}}
@media(max-width:560px){.cards{grid-template-columns:1fr}.section,.hero{padding-left:5vw;padding-right:5vw}footer{flex-direction:column;align-items:flex-start}}