:root { --ink:#0b0b0b; --paper:#f5f4f0; --red:#c72026; --line:#d9d7d1; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
button,a { color:inherit; }
button { font:inherit; }
svg { width:24px; height:24px; }

.announcement { height:35px; overflow:hidden; background:#0c0c0c; color:white; font-size:11px; letter-spacing:.15em; font-weight:700; }
.announcement-track { display:flex; width:max-content; align-items:center; height:100%; gap:34px; animation:marquee 23s linear infinite; }
.announcement-track span,.announcement-track b { white-space:nowrap; }
.announcement-track b { color:#e12229; }
@keyframes marquee { to { transform:translateX(-50%); } }

.site-header { position:sticky; z-index:20; top:0; height:82px; padding:0 4vw; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); background:rgba(245,244,240,.94); backdrop-filter:blur(12px); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; width:max-content; }
.brand-mark { width:48px; height:32px; display:grid; place-items:center; background:#0b0b0b; color:#fff; font-family:Impact,Arial Black,sans-serif; font-size:14px; letter-spacing:-.08em; transform:skew(-7deg); }
.brand-name,.footer-brand { font-family:Impact,Arial Black,sans-serif; font-size:21px; letter-spacing:.04em; }
.desktop-nav { display:flex; gap:36px; font-size:12px; font-weight:800; }
.desktop-nav a { text-decoration:none; position:relative; }
.desktop-nav a::after { content:""; position:absolute; left:0; bottom:-8px; width:0; height:2px; background:#111; transition:.2s; }
.desktop-nav a:hover::after { width:100%; }
.header-actions { justify-self:end; display:flex; align-items:center; gap:8px; }
.header-actions button,.drawer-head button { border:0; background:transparent; display:flex; align-items:center; gap:3px; padding:9px; cursor:pointer; }
.header-actions span { font-size:11px; font-weight:800; }

.hero { position:relative; height:min(780px,calc(100vh - 117px)); min-height:610px; overflow:hidden; background:#d7d7d7; }
.hero>img { width:100%; height:100%; object-fit:cover; object-position:center 38%; filter:saturate(.78) contrast(1.03); }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.67) 0%,rgba(0,0,0,.08) 55%,rgba(0,0,0,.05)); }
.hero-copy { position:absolute; left:6vw; bottom:10%; max-width:720px; color:#fff; }
.hero-copy>p,.eyebrow { margin:0 0 18px; font-size:11px; letter-spacing:.24em; font-weight:800; text-transform:uppercase; }
.hero-copy h1 { margin:0; font-family:Impact,Arial Black,sans-serif; font-size:clamp(74px,10vw,158px); letter-spacing:-.015em; line-height:.78; font-weight:900; }
.hero-copy>span { display:block; margin:30px 0 28px; max-width:430px; font-size:16px; line-height:1.5; }
.hero-copy>a { display:inline-flex; align-items:center; gap:38px; background:#fff; color:#111; text-decoration:none; padding:18px 22px; font-size:12px; font-weight:900; transition:.2s; }
.hero-copy>a:hover { background:var(--red); color:white; gap:48px; }
.hero-index { position:absolute; right:4vw; bottom:5%; color:#fff; font-size:12px; letter-spacing:.18em; }

.manifesto { padding:120px 6vw 110px; text-align:center; border-bottom:1px solid var(--line); }
.manifesto h2 { margin:0 auto 30px; max-width:1050px; font-family:Impact,Arial Black,sans-serif; font-size:clamp(52px,8vw,112px); line-height:.92; letter-spacing:.01em; }
.manifesto h2 em { color:transparent; -webkit-text-stroke:1.5px #111; font-style:normal; }
.manifesto>p:last-child { max-width:610px; margin:0 auto; color:#565656; font-size:16px; line-height:1.7; }

.collection { padding:100px 3vw; }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin:0 1vw 48px; }
.section-heading h2 { margin:0; font-family:Impact,Arial Black,sans-serif; font-size:clamp(50px,6vw,86px); line-height:.9; }
.section-heading>p { margin:0; max-width:310px; color:#666; text-align:right; }
.product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:56px 18px; }
.product-card { min-width:0; }
.product-image { position:relative; display:block; width:100%; aspect-ratio:1/1.08; padding:0; border:0; overflow:hidden; cursor:pointer; background:#e4e2dc; }
.product-image.dark { background:#d9d6cf; }
.product-image.light { background:#e8e8e5; }
.product-image img { width:100%; height:100%; object-fit:contain; transition:transform .55s cubic-bezier(.2,.65,.3,1); }
.product-image:hover img { transform:scale(1.035); }
.drop-number { position:absolute; top:18px; left:18px; width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(0,0,0,.35); background:rgba(255,255,255,.6); font-size:10px; font-weight:800; backdrop-filter:blur(5px); }
.quick-view { position:absolute; left:50%; bottom:18px; transform:translate(-50%,20px); opacity:0; background:#111; color:#fff; padding:14px 24px; font-size:10px; letter-spacing:.14em; font-weight:800; transition:.25s; }
.product-image:hover .quick-view { transform:translate(-50%,0); opacity:1; }
.product-info { display:flex; justify-content:space-between; gap:16px; padding:18px 4px 0; }
.product-info h3 { margin:0 0 7px; font-family:Impact,Arial Black,sans-serif; font-size:24px; letter-spacing:.025em; }
.product-info p { margin:0; color:#777; font-size:12px; }
.product-info strong { white-space:nowrap; font-size:13px; }

.values { display:grid; grid-template-columns:repeat(3,1fr); background:#0c0c0c; color:#fff; }
.values>div { padding:70px 4vw; border-right:1px solid #323232; }
.values span { color:#e1262f; font-size:11px; letter-spacing:.2em; }
.values h3 { margin:48px 0 14px; font-family:Impact,Arial Black,sans-serif; font-size:34px; }
.values p { margin:0; max-width:300px; color:#a8a8a8; line-height:1.6; font-size:13px; }

footer { padding:110px 5vw 36px; background:#e8e6e0; text-align:center; }
.footer-brand { font-size:clamp(80px,16vw,220px); line-height:.8; letter-spacing:-.025em; }
footer>p { margin:58px auto 30px; line-height:1.6; font-weight:700; font-size:13px; letter-spacing:.08em; }
footer>a { display:inline-flex; align-items:center; gap:8px; text-decoration:none; font-weight:800; }
footer>small { display:block; margin-top:90px; padding-top:24px; border-top:1px solid #cecbc4; font-size:9px; letter-spacing:.14em; }

.modal-backdrop { position:fixed; z-index:60; inset:0; background:rgba(0,0,0,.72); display:grid; place-items:center; padding:30px; }
.product-modal { position:relative; width:min(1050px,100%); max-height:90vh; overflow:auto; background:var(--paper); display:grid; grid-template-columns:1.15fr .85fr; }
.modal-close { position:absolute; z-index:2; right:18px; top:18px; display:grid; place-items:center; width:42px; height:42px; border:0; background:#fff; cursor:pointer; }
.modal-image { min-height:620px; background:#ddd; }
.modal-image img { width:100%; height:100%; object-fit:contain; }
.modal-copy { padding:70px 46px 40px; }
.modal-copy h2 { margin:0 0 12px; font-family:Impact,Arial Black,sans-serif; font-size:48px; }
.modal-copy>strong { font-size:18px; }
.modal-copy>p:not(.eyebrow) { margin:28px 0 44px; color:#666; line-height:1.6; font-size:13px; }
.size-label { display:flex; justify-content:space-between; font-size:11px; font-weight:800; letter-spacing:.1em; }
.size-label button { border:0; border-bottom:1px solid #111; padding:0; background:transparent; font-size:10px; cursor:pointer; }
.sizes { display:grid; grid-template-columns:repeat(5,1fr); margin:14px 0 22px; }
.sizes button { height:47px; border:1px solid #bbb; border-right:0; background:transparent; cursor:pointer; }
.sizes button:last-child { border-right:1px solid #bbb; }
.sizes button.active { background:#111; color:#fff; }
.add-button { width:100%; display:flex; justify-content:space-between; align-items:center; border:0; background:#111; color:#fff; padding:19px 22px; font-size:11px; font-weight:900; letter-spacing:.1em; cursor:pointer; }

.drawer,.menu-drawer { position:fixed; z-index:80; top:0; right:0; width:min(440px,92vw); height:100dvh; transform:translateX(105%); background:var(--paper); transition:transform .35s cubic-bezier(.2,.7,.3,1); display:flex; flex-direction:column; }
.drawer.open,.menu-drawer.open { transform:translateX(0); }
.drawer-head { height:78px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; border-bottom:1px solid var(--line); }
.drawer-head h2 { font-family:Impact,Arial Black,sans-serif; font-size:22px; }
.drawer-items { flex:1; overflow:auto; padding:20px; }
.empty { color:#777; text-align:center; margin-top:80px; }
.cart-item { display:grid; grid-template-columns:90px 1fr auto; gap:14px; align-items:center; border-bottom:1px solid var(--line); padding:12px 0; }
.cart-item img { width:90px; height:100px; object-fit:cover; background:#ddd; }
.cart-item h3 { margin:0 0 7px; font-size:13px; }
.cart-item p { margin:0; font-size:12px; }
.cart-item button { border:0; background:transparent; font-size:8px; text-decoration:underline; cursor:pointer; }
.drawer-total { padding:22px; border-top:1px solid var(--line); }
.drawer-total>div { display:flex; justify-content:space-between; margin-bottom:20px; font-weight:900; }
.drawer-total>button { width:100%; border:0; background:#111; color:#fff; padding:18px; font-size:11px; font-weight:900; cursor:pointer; }
.drawer-total small { display:block; text-align:center; margin-top:10px; color:#777; }
.page-overlay { position:fixed; z-index:70; inset:0; border:0; background:rgba(0,0,0,.48); }
.menu-drawer nav { padding:30px; }
.menu-drawer nav a { display:flex; justify-content:space-between; padding:24px 0; border-bottom:1px solid var(--line); text-decoration:none; font-family:Impact,Arial Black,sans-serif; font-size:37px; }
.menu-drawer nav span { color:#999; font-family:Arial,sans-serif; font-size:10px; }
.toast { position:fixed; z-index:100; left:50%; bottom:28px; transform:translateX(-50%); background:#111; color:#fff; padding:15px 22px; font-size:11px; font-weight:800; box-shadow:0 12px 40px rgba(0,0,0,.25); }
.hidden { display:none!important; }

@media (max-width:800px) {
  .site-header { height:68px; padding:0 18px; grid-template-columns:1fr auto; }
  .desktop-nav { display:none; }
  .brand-name { font-size:18px; }
  .brand-mark { width:40px; height:28px; font-size:12px; }
  .header-actions button:first-child { display:none; }
  .hero { height:calc(100svh - 103px); min-height:620px; }
  .hero>img { object-position:58% center; }
  .hero-shade { background:linear-gradient(0deg,rgba(0,0,0,.75) 0%,rgba(0,0,0,.02) 65%); }
  .hero-copy { left:22px; right:22px; bottom:7%; }
  .hero-copy h1 { font-size:clamp(64px,21vw,92px); }
  .hero-copy>span { font-size:13px; margin:22px 0; }
  .hero-copy>a { padding:16px 18px; }
  .hero-index { display:none; }
  .manifesto { padding:84px 22px 76px; }
  .manifesto h2 { font-size:clamp(47px,15vw,68px); }
  .collection { padding:76px 12px; }
  .section-heading { display:block; margin:0 8px 30px; }
  .section-heading>p { text-align:left; margin-top:16px; font-size:13px; }
  .product-grid { gap:38px 9px; }
  .product-image { aspect-ratio:1/1.23; }
  .product-info { display:block; padding-top:12px; }
  .product-info h3 { font-size:19px; }
  .product-info p { display:none; }
  .product-info strong { display:block; margin-top:7px; font-size:11px; }
  .quick-view { display:none; }
  .drop-number { top:9px; left:9px; width:28px; height:28px; }
  .values { grid-template-columns:1fr; }
  .values>div { padding:48px 28px; border-right:0; border-bottom:1px solid #333; }
  .values h3 { margin-top:26px; }
  .footer-brand { font-size:20vw; }
  .product-modal { grid-template-columns:1fr; max-height:94vh; }
  .modal-image { min-height:390px; max-height:48vh; }
  .modal-copy { padding:32px 22px 26px; }
  .modal-copy h2 { font-size:38px; }
  .modal-copy>p:not(.eyebrow) { margin:20px 0 26px; }
}

@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
