:root {
  --bg: #0a0a0a;
  --panel: #111;
  --ink: #f3f0e8;
  --muted: #9d9d97;
  --line: rgba(255,255,255,.14);
  --accent: #b7b7b7;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  overflow-x: hidden;
}
body::selection { background: #eee; color: #111; }
.noise {
  position: fixed; inset: 0; z-index: 9999; pointer-events: none; opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.announcement {
  height: 31px; display:flex; align-items:center; justify-content:center; gap:10px;
  background:#ece9e1; color:#0a0a0a; font-size:11px; font-weight:800; letter-spacing:.18em;
}
.site-header {
  position: sticky; top:0; z-index:50; height:72px; display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; padding:0 4vw; border-bottom:1px solid var(--line); background:rgba(10,10,10,.84); backdrop-filter: blur(14px);
}
.brand { color:white; text-decoration:none; font-weight:900; font-size:22px; letter-spacing:-.05em; }
.site-header nav { display:flex; gap:30px; }
.site-header nav a, .footer-links a { color:#d5d5d0; text-decoration:none; text-transform:uppercase; font-size:11px; letter-spacing:.16em; }
.site-header nav a:hover, .footer-links a:hover { color:#fff; }
.cart-btn { justify-self:end; border:0; background:none; color:#fff; text-transform:uppercase; letter-spacing:.14em; font-size:11px; cursor:pointer; }
.cart-btn span { display:inline-flex; min-width:21px; height:21px; border:1px solid #777; border-radius:50%; align-items:center; justify-content:center; margin-left:6px; }
.hero { min-height: calc(100vh - 103px); position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(.3) contrast(1.08) brightness(.58); transform:scale(1.02); }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.48) 60%, rgba(0,0,0,.72)); }
.hero-content { position:relative; z-index:2; text-align:center; max-width:820px; padding:50px 24px; }
.hero-emblem { width:min(680px, 92vw); max-height:420px; object-fit:contain; filter:drop-shadow(0 20px 25px rgba(0,0,0,.7)); }
.eyebrow { font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:#bdbdb7; font-weight:800; }
.hero h1, .section h2 { margin:.25em 0 .2em; text-transform:uppercase; letter-spacing:-.06em; line-height:.9; font-size:clamp(44px, 8vw, 104px); }
.hero-copy { color:#d0d0ca; max-width:520px; margin:18px auto 28px; font-size:15px; }
.cta, .add-btn, .checkout-btn, .signup button {
  display:inline-flex; align-items:center; justify-content:center; background:#f2efe7; color:#0b0b0b; border:0; text-decoration:none;
  padding:15px 22px; text-transform:uppercase; font-weight:900; letter-spacing:.11em; font-size:11px; cursor:pointer;
}
.cta:hover, .add-btn:hover, .signup button:hover { background:#c9c9c2; }
.hero-stamp { position:absolute; z-index:2; right:4vw; bottom:28px; font-size:9px; letter-spacing:.24em; color:#c9c9c4; writing-mode:vertical-rl; }
.ticker { overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#0d0d0d; white-space:nowrap; }
.ticker div { width:max-content; animation:ticker 22s linear infinite; padding:13px 0; font-size:11px; letter-spacing:.18em; color:#b8b8b2; }
@keyframes ticker { to { transform:translateX(-50%); } }
.section { padding:110px 5vw; }
.section-head { display:flex; justify-content:space-between; gap:30px; align-items:flex-end; margin-bottom:40px; }
.section-head h2 { font-size:clamp(48px, 7vw, 86px); margin:0; }
.section-note { color:#8d8d88; text-transform:uppercase; letter-spacing:.14em; font-size:10px; }
.product-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.product-card { border-top:1px solid var(--line); padding-top:14px; }
.product-image-wrap { position:relative; aspect-ratio: 1 / .92; overflow:hidden; background:#e7e5de; }
.product-image-wrap img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.product-card:hover .product-image-wrap img { transform:scale(1.018); }
.product-image-wrap.dark-card { background:#171717; }
.product-image-wrap.dark-card .hoodie-image { object-fit:contain; padding:5%; filter:saturate(.65) contrast(1.05); }
.badge { position:absolute; z-index:2; top:16px; left:16px; background:#111; color:#eee; font-size:9px; letter-spacing:.18em; padding:9px 11px; }
.product-meta { display:flex; justify-content:space-between; gap:20px; padding:18px 2px 12px; }
.product-meta h3 { margin:0 0 7px; font-size:16px; text-transform:uppercase; letter-spacing:.02em; }
.product-meta p { margin:0; color:#8e8e88; font-size:11px; text-transform:uppercase; letter-spacing:.11em; line-height:1.6; }
.product-meta strong { white-space:nowrap; font-size:13px; }
.sizes { display:flex; gap:7px; margin:6px 0 12px; }
.sizes button { width:42px; height:34px; background:#111; border:1px solid #2e2e2e; color:#bbb; cursor:pointer; }
.sizes button.active, .sizes button:hover { color:#111; background:#e8e5dc; border-color:#e8e5dc; }
.add-btn { width:100%; background:#171717; color:#fff; border:1px solid #303030; }
.manifesto { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#0c0c0c; }
.manifesto h2 { font-size:clamp(54px, 7vw, 100px); }
.manifesto-copy > p:last-child { max-width:600px; color:#a5a59f; line-height:1.8; font-size:14px; }
.symbol-card { min-height:500px; display:flex; align-items:center; justify-content:center; background:#141414; border:1px solid #202020; overflow:hidden; }
.symbol-card img { width:70%; max-width:520px; mix-blend-mode:screen; }
.lookbook-frame { border:1px solid #222; overflow:hidden; }
.lookbook-frame img { display:block; width:100%; filter:saturate(.8) contrast(1.05); }
.signup { text-align:center; padding-top:150px; padding-bottom:150px; background:radial-gradient(circle at center, #161616 0, #0a0a0a 60%); }
.signup h2 { font-size:clamp(54px, 8vw, 110px); }
.signup form { width:min(640px, 92vw); margin:35px auto 15px; display:grid; grid-template-columns:1fr auto; border:1px solid #333; }
.signup input { background:#0d0d0d; color:#fff; border:0; outline:0; padding:18px; font-size:12px; letter-spacing:.12em; }
.signup-note { color:#74746f; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }
footer { border-top:1px solid var(--line); padding:50px 5vw; display:grid; gap:30px; }
.footer-brand { font-size:42px; font-weight:900; letter-spacing:-.06em; }
.footer-links { display:flex; flex-wrap:wrap; gap:24px; }
footer p { color:#63635f; font-size:9px; letter-spacing:.16em; }
.cart-drawer { position:fixed; z-index:200; top:0; right:0; width:min(440px, 92vw); height:100vh; background:#0d0d0d; border-left:1px solid #292929; transform:translateX(105%); transition:.32s ease; display:flex; flex-direction:column; }
.cart-drawer.open { transform:translateX(0); }
.cart-head { display:flex; align-items:center; justify-content:space-between; padding:24px; border-bottom:1px solid #242424; }
.cart-head h2 { margin:0; text-transform:uppercase; font-size:18px; letter-spacing:.04em; }
.cart-head button { border:0; background:none; color:#fff; font-size:34px; cursor:pointer; }
.cart-items { flex:1; padding:24px; overflow:auto; }
.empty-cart { color:#777; font-size:12px; text-transform:uppercase; letter-spacing:.12em; }
.cart-item { display:flex; justify-content:space-between; gap:14px; padding:16px 0; border-bottom:1px solid #222; }
.cart-item small { display:block; color:#777; margin-top:4px; }
.cart-item button { background:none; border:0; color:#777; cursor:pointer; text-decoration:underline; padding:0; margin-top:8px; }
.cart-footer { padding:24px; border-top:1px solid #242424; }
.cart-footer > div { display:flex; justify-content:space-between; margin-bottom:18px; text-transform:uppercase; letter-spacing:.09em; font-size:12px; }
.checkout-btn { width:100%; opacity:.5; cursor:not-allowed; }
.cart-backdrop { position:fixed; z-index:150; inset:0; background:rgba(0,0,0,.7); opacity:0; pointer-events:none; transition:.3s; }
.cart-backdrop.show { opacity:1; pointer-events:auto; }
@media (max-width: 800px) {
  .site-header { grid-template-columns:1fr auto; height:62px; }
  .site-header nav { display:none; }
  .brand { font-size:18px; }
  .hero { min-height:78vh; }
  .hero-emblem { width:105vw; max-width:none; }
  .hero-content h1 { font-size:50px; }
  .section { padding:75px 20px; }
  .product-grid, .manifesto { grid-template-columns:1fr; }
  .section-head { align-items:flex-start; flex-direction:column; }
  .section-head h2 { font-size:56px; }
  .product-meta { flex-direction:column; }
  .symbol-card { min-height:340px; }
  .signup form { grid-template-columns:1fr; }
  .signup button { min-height:50px; }
}