:root {
  --ink:#080a09;
  --panel:#101311;
  --paper:#f5f6f1;
  --muted:#aeb5ad;
  --acid:#a6ff00;
  --line:rgba(255,255,255,.14);
  --display:'Bebas Neue',Impact,sans-serif;
  --body:'Montserrat',Arial,sans-serif;
  color-scheme:dark;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--ink); color:var(--paper); font-family:var(--body); margin:0; overflow-x:hidden; }
body,button { font-family:var(--body); }
a { color:inherit; }
img { max-width:100%; }
button,a { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--acid); outline-offset:4px; }
.page-frame { margin-inline:auto; max-width:1240px; padding-inline:clamp(1.25rem,4vw,3rem); width:100%; }
.skip-link { background:var(--acid); color:var(--ink); font-weight:800; left:1rem; padding:.8rem 1rem; position:fixed; top:-5rem; z-index:100; }
.skip-link:focus { top:1rem; }

.drop-header { background:rgba(8,10,9,.96); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; }
.drop-header .page-frame { align-items:center; display:flex; min-height:76px; }
.drop-logo { display:inline-flex; flex:0 0 auto; width:clamp(8rem,13vw,10.5rem); }
.drop-logo img { display:block; height:auto; width:100%; }
.drop-header nav { display:flex; gap:clamp(1rem,2.5vw,2.2rem); margin-left:auto; }
.drop-header nav a,.header-cart { align-items:center; display:inline-flex; font-size:.72rem; font-weight:700; letter-spacing:.1em; min-height:44px; text-decoration:none; text-transform:uppercase; }
.drop-header nav a:hover,.drop-header nav a[aria-current="page"],.header-cart:hover { color:var(--acid); }
.header-cart { margin-left:clamp(1rem,3vw,2.5rem); }

.apparel-hero { background:linear-gradient(120deg,rgba(5,7,7,.98),rgba(8,12,10,.8)),url('/assets/crispaf/backgrounds/crispaf-midnight-garage-no-car.png') center/cover; border-bottom:1px solid rgba(166,255,0,.25); }
.apparel-hero > .page-frame { display:grid; gap:3rem; grid-template-columns:minmax(0,1.3fr) minmax(14rem,.7fr); min-height:31rem; padding-block:clamp(4rem,9vw,8rem); }
.apparel-hero-copy { align-self:center; max-width:48rem; }
.kicker { color:var(--acid); font-size:.7rem; font-weight:800; letter-spacing:.2em; margin:0 0 1rem; text-transform:uppercase; }
.apparel-hero h1,.apparel-section-heading h2,.apparel-detail-copy h2 { color:#fff; font-family:var(--display); font-weight:400; letter-spacing:.02em; margin:0; text-transform:uppercase; }
.apparel-hero h1 { font-size:clamp(4.5rem,10vw,8.5rem); line-height:.82; margin-bottom:1.5rem; }
.apparel-hero h1 em,.apparel-section-heading h2 em { color:var(--acid); font-style:normal; }
.apparel-hero-lede { color:#d7d3c9; font-size:clamp(1rem,2vw,1.3rem); line-height:1.6; margin:0; max-width:34rem; }
.apparel-hero-meta { align-self:end; border-left:2px solid var(--acid); color:var(--muted); font-size:.68rem; font-weight:600; letter-spacing:.12em; line-height:1.7; margin:0; padding:.3rem 0 .3rem 1rem; text-transform:uppercase; }

.apparel-catalog { background:linear-gradient(135deg,#0a0b0b,#111511); padding-block:clamp(4rem,8vw,7rem); }
.apparel-section-heading { align-items:end; display:flex; gap:2rem; justify-content:space-between; margin-bottom:2rem; }
.apparel-section-heading > div { min-width:0; }
.apparel-section-heading .kicker { margin-bottom:.8rem; }
.apparel-section-heading h2 { font-size:clamp(3rem,6vw,5.5rem); line-height:.86; }
.apparel-section-heading > p { color:var(--muted); font-size:.74rem; letter-spacing:.05em; line-height:1.7; margin:0; max-width:20rem; text-align:right; text-transform:uppercase; }
.apparel-toolbar { align-items:center; border-bottom:1px solid var(--line); border-top:1px solid rgba(166,255,0,.2); color:var(--muted); display:flex; font-size:.64rem; font-weight:600; justify-content:space-between; letter-spacing:.1em; margin-bottom:2rem; padding:.85rem 0; text-transform:uppercase; }
.apparel-toolbar b { color:#fff; font-size:.86rem; font-weight:600; margin-right:.35rem; }
.apparel-toolbar-status { align-items:center; display:flex; gap:.5rem; }
.apparel-toolbar-status i { background:var(--acid); border-radius:50%; box-shadow:0 0 .7rem rgba(166,255,0,.7); display:block; height:.4rem; width:.4rem; }

.apparel-products { display:grid; gap:1.25rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.apparel-product-card { background:var(--panel); border:1px solid rgba(166,255,0,.2); display:flex; flex-direction:column; min-width:0; transition:border-color .2s ease,transform .2s ease; }
.apparel-product-card:hover { border-color:var(--acid); transform:translateY(-.2rem); }
.apparel-product-art { aspect-ratio:1 / 1; background:radial-gradient(circle at 50% 45%,rgba(166,255,0,.12),transparent 38%),#0b0d0c; overflow:hidden; position:relative; }
.apparel-product-image-link { align-items:center; display:flex; height:100%; justify-content:center; padding:.75rem; width:100%; }
.apparel-product-image { display:block; height:100%; object-fit:contain; transition:transform .25s ease; width:100%; }
.apparel-product-card:hover .apparel-product-image { transform:scale(1.02); }
.product-status { background:var(--acid); color:var(--ink); font-size:.6rem; font-weight:800; letter-spacing:.1em; padding:.5rem .65rem; pointer-events:none; position:absolute; right:.8rem; text-transform:uppercase; top:.8rem; }
.product-image-count { bottom:.8rem; color:#d7d3c9; font-size:.58rem; font-weight:600; left:.8rem; letter-spacing:.12em; pointer-events:none; position:absolute; text-transform:uppercase; }
.apparel-product-copy { display:flex; flex:1; flex-direction:column; padding:1.35rem; }
.apparel-product-category { color:var(--acid); font-size:.62rem; font-weight:700; letter-spacing:.12em; margin:0 0 .65rem; text-transform:uppercase; }
.apparel-product-copy h2 { font-family:var(--display); font-size:clamp(1.8rem,3vw,2.5rem); font-weight:400; letter-spacing:.02em; line-height:.95; margin:0 0 1rem; text-transform:uppercase; }
.apparel-product-copy h2 a { text-decoration:none; }
.apparel-product-copy h2 a:hover { color:var(--acid); }
.apparel-product-description { color:#c8cdc5; font-size:.88rem; line-height:1.6; margin:0 0 1.25rem; }
.apparel-product-details { border-top:1px solid rgba(166,255,0,.2); color:#d7d3c9; display:grid; gap:.55rem 1rem; grid-template-columns:repeat(2,minmax(0,1fr)); list-style:none; margin:0; padding:1rem 0 1.25rem; }
.apparel-product-details li { font-size:.61rem; line-height:1.5; padding-left:1rem; position:relative; text-transform:uppercase; }
.apparel-product-details li::before { color:var(--acid); content:'+'; left:0; position:absolute; }
.apparel-product-footer { align-items:end; border-top:1px solid var(--line); display:flex; gap:1rem; justify-content:space-between; margin-top:auto; padding-top:1rem; }
.apparel-product-price { color:#fff; font-size:.76rem; font-weight:700; letter-spacing:.04em; }
.apparel-product-action { align-items:center; background:transparent; border:1px solid var(--acid); color:var(--acid); cursor:pointer; display:inline-flex; font-size:.62rem; font-weight:800; justify-content:center; letter-spacing:.1em; min-height:46px; padding:.8rem 1rem; text-transform:uppercase; transition:background .2s ease,color .2s ease,transform .2s ease; }
.apparel-product-action:hover,.apparel-product-action:focus-visible { background:var(--acid); color:var(--ink); transform:translateY(-1px); }
.apparel-note { border-top:1px solid rgba(166,255,0,.2); color:var(--muted); font-size:.65rem; letter-spacing:.08em; line-height:1.6; margin:2.5rem 0 0; padding-top:1rem; text-transform:uppercase; }

.apparel-detail { background:#111412; border:1px solid rgba(166,255,0,.5); color:#fff; max-height:calc(100vh - 2rem); max-width:70rem; padding:0; width:calc(100% - 2rem); }
.apparel-detail::backdrop { background:rgba(0,0,0,.84); }
.apparel-detail-shell { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(18rem,.95fr); min-height:34rem; }
.apparel-detail-close { background:#080909; border:1px solid rgba(255,255,255,.3); color:#fff; cursor:pointer; font-size:1.6rem; height:2.5rem; line-height:1; position:absolute; right:1rem; top:1rem; width:2.5rem; z-index:2; }
.apparel-detail-close:hover { border-color:var(--acid); color:var(--acid); }
.apparel-detail-media { background:#0a0c0b; min-height:30rem; padding:1.25rem; position:relative; }
.apparel-detail-image { display:block; height:100%; max-height:29rem; object-fit:contain; width:100%; }
.apparel-detail-thumbs { bottom:1.25rem; display:flex; gap:.45rem; left:1.25rem; max-width:calc(100% - 2.5rem); overflow-x:auto; position:absolute; right:1.25rem; }
.apparel-detail-thumb { background:#111412; border:1px solid rgba(255,255,255,.18); cursor:pointer; flex:0 0 3.5rem; height:3.5rem; opacity:.62; padding:0; }
.apparel-detail-thumb.is-active,.apparel-detail-thumb:hover { border-color:var(--acid); opacity:1; }
.apparel-detail-thumb img { height:100%; object-fit:cover; width:100%; }
.apparel-detail-copy { display:flex; flex-direction:column; overflow-y:auto; padding:clamp(1.5rem,4vw,3rem); }
.apparel-detail-copy h2 { font-size:clamp(2.5rem,5vw,4.5rem); line-height:.9; margin:.5rem 0 1rem; }
.apparel-detail-description { color:#c8cdc5; font-size:.92rem; line-height:1.6; margin:0 0 1.25rem; }
.apparel-detail-price { border-bottom:1px solid rgba(166,255,0,.2); color:var(--acid); font-size:1rem; font-weight:700; letter-spacing:.06em; padding-bottom:1rem; }
.apparel-options { display:grid; gap:1rem; margin-top:1.25rem; }
.apparel-option-group { border:0; margin:0; padding:0; }
.apparel-option-group legend { color:var(--muted); font-size:.61rem; font-weight:700; letter-spacing:.1em; margin-bottom:.55rem; text-transform:uppercase; }
.apparel-option-choices { display:flex; flex-wrap:wrap; gap:.45rem; }
.apparel-option { background:transparent; border:1px solid rgba(255,255,255,.25); color:#d7d3c9; cursor:pointer; font-size:.65rem; min-height:42px; min-width:3rem; padding:.55rem .65rem; }
.apparel-option:hover:not(:disabled),.apparel-option.is-selected { border-color:var(--acid); color:var(--acid); }
.apparel-option:disabled { color:#6e746d; cursor:not-allowed; opacity:.55; text-decoration:line-through; }
.apparel-selection-status { color:#d7d3c9; font-size:.62rem; letter-spacing:.06em; line-height:1.5; margin:1.25rem 0; min-height:1.1rem; text-transform:uppercase; }
.apparel-selection-status.is-unavailable { color:#e8b84a; }
.apparel-cart-button { background:var(--acid); border:1px solid var(--acid); color:var(--ink); cursor:pointer; font-size:.7rem; font-weight:800; letter-spacing:.12em; min-height:50px; padding:1rem; text-transform:uppercase; }
.apparel-cart-button:hover:not(:disabled) { background:var(--paper); border-color:var(--paper); }
.apparel-cart-button:disabled { background:#293027; border-color:#293027; color:#92998c; cursor:not-allowed; }
.apparel-checkout-link { color:var(--muted); font-size:.62rem; font-weight:700; letter-spacing:.1em; margin-top:1rem; min-height:44px; padding:.75rem; text-align:center; text-transform:uppercase; }
.apparel-checkout-link:hover { color:var(--acid); }

.drop-footer { background:#050605; border-top:1px solid rgba(166,255,0,.3); padding-top:4rem; }
.footer-layout { display:grid; gap:2.5rem; grid-template-columns:1.5fr repeat(2,1fr); padding-bottom:3rem; }
.footer-brand p { color:var(--acid); font-family:var(--display); font-size:1.25rem; letter-spacing:.08em; }
.footer-layout h2 { color:var(--paper); font-family:var(--body); font-size:.68rem; font-weight:800; letter-spacing:.16em; margin:0 0 1rem; text-transform:uppercase; }
.footer-layout nav { align-items:flex-start; display:flex; flex-direction:column; }
.footer-layout nav a { color:var(--muted); font-size:.78rem; line-height:2.2; text-decoration:none; }
.footer-layout nav a:hover,.footer-layout nav a[aria-current="page"] { color:var(--acid); }
.footer-bottom { align-items:center; border-top:1px solid var(--line); color:#858b85; display:flex; font-size:.7rem; justify-content:space-between; padding-block:1.25rem; }
.footer-bottom p { margin:0; }
.footer-bottom a { min-height:44px; padding-block:1rem; }

@media (max-width:900px) {
  .drop-header nav { display:none; }
  .header-cart { margin-left:auto; }
  .apparel-products { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:699px) {
  .apparel-hero > .page-frame { grid-template-columns:1fr; min-height:0; padding-block:4.5rem; }
  .apparel-hero-meta { align-self:start; }
  .apparel-section-heading { align-items:flex-start; flex-direction:column; }
  .apparel-section-heading > p { text-align:left; }
  .apparel-toolbar { align-items:flex-start; flex-direction:column; gap:.65rem; }
  .apparel-detail { max-height:calc(100vh - 1rem); width:calc(100% - 1rem); }
  .apparel-detail-shell { display:block; }
  .apparel-detail-media { min-height:16rem; padding:1rem; }
  .apparel-detail-image { max-height:20rem; }
  .apparel-detail-thumbs { bottom:.75rem; left:1rem; right:1rem; }
  .apparel-detail-copy { padding:1.5rem; }
  .footer-layout { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-brand { grid-column:1 / -1; }
}

@media (max-width:560px) {
  .page-frame { padding-inline:1rem; }
  .drop-header .page-frame { min-height:68px; }
  .drop-logo { width:8rem; }
  .apparel-hero h1 { font-size:clamp(3.8rem,20vw,5.8rem); }
  .apparel-products { grid-template-columns:1fr; }
  .apparel-product-image-link { padding:.5rem; }
  .apparel-product-copy { padding:1.2rem; }
  .apparel-product-details { grid-template-columns:1fr; }
  .apparel-product-action { min-height:48px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .apparel-product-card,.apparel-product-image,.apparel-product-action { transition:none; }
}