/* ============================================================================
   VEST ARCHIVE — COMPONENTS
   Bottoni · Badge · Card · Input · Navbar · Footer · Cart · Search · Filtri
   ============================================================================ */

/* ============================================================================
   LOGO
   ============================================================================ */
.logo { display: inline-flex; align-items: center; gap: .6em; line-height: 1; }
.logo__mark { width: 1.55em; height: 1.55em; flex: none; }
.logo__mark .star-fill { fill: var(--c-text); transition: fill var(--t-med) var(--ease-out); }
.logo:hover .star-fill { fill: var(--c-red); }
.logo__type {
  font-family: var(--font-display);
  font-weight: 900;
  font-stretch: expanded;
  text-transform: uppercase;
  letter-spacing: .01em;
  font-size: 1.02em;
  line-height: 1;
  color: var(--c-text);
}
.logo__type .thin { font-weight: 500; letter-spacing: .04em; }
.logo--stack { flex-direction: column; gap: .35em; text-align: center; }
.logo--lg { font-size: 1.5rem; }

/* Star mark riutilizzabile come glyph */
.spark-glyph { display: inline-block; width: 1em; height: 1em; vertical-align: -.12em; }
.spark-glyph path { fill: currentColor; }

/* ============================================================================
   BUTTONS — primario rosso · secondario outline · ghost
   ============================================================================ */
.btn {
  --btn-bg: var(--c-surface-3);
  --btn-fg: var(--c-text);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  padding: 1.05em 1.8em;
  border-radius: var(--r-pill);
  background: var(--btn-bg);
  color: var(--btn-fg);
  border: 1px solid transparent;
  overflow: hidden;
  transition: transform var(--t-fast) var(--ease-out),
              background var(--t-med) var(--ease-out),
              color var(--t-med) var(--ease-out),
              box-shadow var(--t-med) var(--ease-out),
              border-color var(--t-med) var(--ease-out);
  white-space: nowrap;
}
.btn > * { position: relative; z-index: 1; }
.btn:active { transform: translateY(1px) scale(.99); }

/* Riempimento animato al hover (wipe) */
.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateY(101%);
  transition: transform var(--t-med) var(--ease-out);
  z-index: 0;
}

/* Primario */
.btn--primary { --btn-bg: var(--c-red); --btn-fg: var(--c-on-red); }
.btn--primary::after { background: #fff; }
.btn--primary:hover { color: var(--c-red); box-shadow: var(--sh-red); }
.btn--primary:hover::after { transform: translateY(0); }

/* Secondario (outline) */
.btn--outline { --btn-bg: transparent; --btn-fg: var(--c-text); border-color: var(--c-line-strong); }
.btn--outline::after { background: var(--c-text); }
.btn--outline:hover { color: var(--c-ink); border-color: var(--c-text); }
.btn--outline:hover::after { transform: translateY(0); }

/* Ghost */
.btn--ghost { --btn-bg: transparent; --btn-fg: var(--c-text-2); }
.btn--ghost:hover { --btn-fg: var(--c-text); background: var(--c-surface-2); }

/* Chrome (speciale) */
.btn--chrome { --btn-fg: #111; background: var(--grad-chrome-soft); }
.btn--chrome:hover { box-shadow: var(--sh-lg); transform: translateY(-2px); }
.btn--chrome::after { display: none; }

.btn--sm { padding: .7em 1.2em; font-size: var(--fs-2xs); }
.btn--lg { padding: 1.2em 2.4em; font-size: var(--fs-xs); }
.btn--block { display: flex; width: 100%; }
.btn--icon { padding: 1.05em; aspect-ratio: 1; }
.btn .arrow { transition: transform var(--t-med) var(--ease-out); }
.btn:hover .arrow { transform: translateX(4px); }

/* Icon button tondo (wishlist, cart, ecc.) */
.iconbtn {
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-pill);
  color: var(--c-text-2);
  border: 1px solid var(--c-line);
  background: var(--glass-bg);
  transition: all var(--t-fast) var(--ease-out);
}
.iconbtn:hover { color: var(--c-text); border-color: var(--c-line-strong); background: var(--c-surface-2); transform: translateY(-1px); }
.iconbtn[aria-pressed="true"] { color: var(--c-red); border-color: var(--c-red); }
.iconbtn svg { width: 18px; height: 18px; }
.iconbtn__badge {
  position: absolute; top: -4px; right: -4px;
  min-width: 18px; height: 18px; padding: 0 4px;
  background: var(--c-red); color: #fff;
  font-family: var(--font-mono); font-size: 10px; font-weight: 700;
  border-radius: 99px; display: grid; place-items: center;
  border: 2px solid var(--c-ink);
}
.iconbtn-wrap { position: relative; }

/* Link con freccia / underline animato */
.link-arrow {
  font-family: var(--font-mono); font-size: var(--fs-xs);
  letter-spacing: .12em; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: .6em;
  color: var(--c-text-2);
  transition: color var(--t-fast);
}
.link-arrow:hover { color: var(--c-text); }
.link-arrow .arrow { transition: transform var(--t-med) var(--ease-out); }
.link-arrow:hover .arrow { transform: translateX(5px); }
.link-underline { position: relative; }
.link-underline::after {
  content:""; position:absolute; left:0; bottom:-3px; width:100%; height:1px;
  background: currentColor; transform: scaleX(0); transform-origin: right;
  transition: transform var(--t-med) var(--ease-out);
}
.link-underline:hover::after { transform: scaleX(1); transform-origin: left; }

/* ============================================================================
   BADGES / PILLS / TAGS
   ============================================================================ */
.badge {
  display: inline-flex; align-items: center; gap: .4em;
  font-family: var(--font-mono); font-size: var(--fs-2xs); font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  padding: .42em .7em; border-radius: var(--r-xs);
  line-height: 1;
}
.badge--red    { background: var(--c-red); color:#fff; }
.badge--soft   { background: var(--c-red-soft); color: var(--c-red-400); border:1px solid rgba(225,6,0,.3); }
.badge--ghost  { background: rgba(0,0,0,.55); color: var(--c-text); border:1px solid var(--c-line); backdrop-filter: blur(6px); }
.badge--chrome { background: var(--grad-chrome-soft); color:#111; }
.badge--dot::before { content:""; width:5px; height:5px; border-radius:99px; background: currentColor; }
.badge--live { background: var(--c-red-soft); color: var(--c-red-400); }
.badge--live::before { content:""; width:6px;height:6px;border-radius:99px;background: var(--c-red); box-shadow:0 0 0 0 var(--c-red-glow); animation: pulse 1.8s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 var(--c-red-glow);}70%{box-shadow:0 0 0 7px rgba(225,6,0,0);}100%{box-shadow:0 0 0 0 rgba(225,6,0,0);} }

.chip {
  display:inline-flex; align-items:center; gap:.5em;
  font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing:.06em;
  padding:.6em 1em; border-radius: var(--r-pill);
  border:1px solid var(--c-line); color: var(--c-text-2);
  background: var(--c-surface); text-transform: uppercase;
  transition: all var(--t-fast) var(--ease-out);
  cursor:pointer; white-space:nowrap;
}
.chip:hover { color: var(--c-text); border-color: var(--c-line-strong); }
.chip[aria-selected="true"], .chip.is-active { background: var(--c-text); color: var(--c-ink); border-color: var(--c-text); }
.chip .x { opacity:.6; }

/* ============================================================================
   PRODUCT CARD
   ============================================================================ */
.pcard { position: relative; display: flex; flex-direction: column; }
.pcard__media {
  position: relative;
  aspect-ratio: 3/4;
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--grad-panel);
  border: 1px solid var(--c-line);
  isolation: isolate;
}
.pcard__img {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  transition: transform var(--t-slow) var(--ease-out), filter var(--t-med);
}
.pcard:hover .pcard__img { transform: scale(1.06); }
.pcard__img img { width:100%; height:100%; object-fit: cover; }

/* Badge angolo + wishlist */
.pcard__badges { position:absolute; top:12px; left:12px; display:flex; gap:6px; z-index:3; flex-wrap:wrap; }
.pcard__wish {
  position:absolute; top:10px; right:10px; z-index:3;
  width:38px; height:38px; border-radius:99px;
  display:grid; place-items:center;
  background: rgba(0,0,0,.5); backdrop-filter: blur(8px);
  border:1px solid var(--c-line); color:#fff;
  opacity:0; transform: translateY(-6px);
  transition: all var(--t-med) var(--ease-out);
}
.pcard:hover .pcard__wish { opacity:1; transform:none; }
.pcard__wish:hover { border-color: var(--c-red); color: var(--c-red); }
.pcard__wish[aria-pressed="true"] { opacity:1; transform:none; color: var(--c-red); border-color: var(--c-red); }
.pcard__wish svg { width:16px; height:16px; }

/* Quick add (slide up al hover) */
.pcard__quick {
  position:absolute; left:10px; right:10px; bottom:10px; z-index:3;
  transform: translateY(120%); opacity:0;
  transition: all var(--t-med) var(--ease-out);
}
.pcard:hover .pcard__quick { transform:none; opacity:1; }
.pcard__catno { position:absolute; bottom:10px; left:12px; z-index:2; }
.pcard:hover .pcard__catno { opacity:0; }

.pcard__body { padding-top: var(--sp-3); display:flex; flex-direction:column; gap:3px; }
.pcard__brand {
  font-family: var(--font-mono); font-size: var(--fs-2xs);
  letter-spacing:.14em; text-transform:uppercase; color: var(--c-text-3);
  display:flex; align-items:center; gap:.4em;
}
.pcard__brand .verified { color: var(--c-red); }
.pcard__name { font-size: var(--fs-sm); font-weight:600; color: var(--c-text); letter-spacing:-.01em; }
.pcard__row { display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-3); margin-top:2px; }
.pcard__price { font-family: var(--font-mono); font-size: var(--fs-sm); font-weight:700; color: var(--c-text); }
.pcard__price .was { color: var(--c-text-3); text-decoration: line-through; margin-right:.4em; font-weight:400; }
.pcard__meta { font-family: var(--font-mono); font-size: var(--fs-2xs); color: var(--c-text-3); }
.pcard__swatches { display:flex; gap:5px; margin-top:6px; }
.swatch { width:13px; height:13px; border-radius:99px; border:1px solid var(--c-line-strong); }

/* ============================================================================
   BRAND CARD
   ============================================================================ */
.bcard {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--c-line);
  background: var(--grad-panel);
  min-height: 320px;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding: var(--sp-6);
  transition: border-color var(--t-med), transform var(--t-med) var(--ease-out);
}
.bcard::before {
  content:""; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(90% 60% at 50% 0%, rgba(225,6,0,.14), transparent 60%),
    var(--grad-panel);
  opacity:.9;
}
.bcard::after {
  content:""; position:absolute; inset:0; z-index:1;
  background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.82) 100%);
}
.bcard > * { position: relative; z-index:2; }
.bcard:hover { border-color: var(--c-line-strong); transform: translateY(-4px); }
.bcard__logo {
  position:absolute; top:var(--sp-6); left:var(--sp-6); z-index:2;
  font-family: var(--font-display); font-weight:900; font-stretch: expanded;
  text-transform:uppercase; font-size: var(--fs-h4); color: var(--c-text);
  letter-spacing:-.01em;
}
.bcard__watermark {
  position:absolute; inset:0; display:grid; place-items:center; z-index:1;
  font-family: var(--font-display); font-weight:900; font-stretch:expanded;
  font-size: clamp(3rem,7vw,6rem); text-transform:uppercase;
  color: transparent; -webkit-text-stroke:1px rgba(255,255,255,.06);
  letter-spacing:-.03em; pointer-events:none;
}
.bcard__meta { display:flex; align-items:center; gap:var(--sp-3); margin-bottom:var(--sp-2); }
.bcard__name { font-size: var(--fs-h3); text-transform:uppercase; }
.bcard__desc { color: var(--c-text-2); font-size: var(--fs-sm); max-width: 40ch; }
.bcard__foot { display:flex; align-items:center; justify-content:space-between; margin-top:var(--sp-4); }

/* Brand ticker (loghi in riga) */
.brandstrip { display:flex; align-items:center; gap: clamp(2rem,5vw,5rem); }
.brandstrip__logo {
  font-family: var(--font-display); font-weight:900; font-stretch: expanded;
  text-transform:uppercase; font-size: clamp(1rem,2vw,1.6rem);
  color: var(--c-text-3); letter-spacing:-.01em; white-space:nowrap;
  transition: color var(--t-fast);
}
.brandstrip__logo:hover { color: var(--c-text); }

/* ============================================================================
   CATEGORY CARD
   ============================================================================ */
.catcard {
  position: relative; display:flex; flex-direction:column; justify-content:flex-end;
  aspect-ratio: 4/5; padding: var(--sp-5);
  border-radius: var(--r-md); overflow:hidden;
  border:1px solid var(--c-line);
  background: var(--grad-panel);
  transition: border-color var(--t-med);
}
.catcard::after { content:""; position:absolute; inset:0; background: linear-gradient(180deg,transparent 40%, rgba(0,0,0,.7)); z-index:1; }
.catcard > * { position:relative; z-index:2; }
.catcard:hover { border-color: var(--c-red); }
.catcard__num { position:absolute; top:var(--sp-4); left:var(--sp-5); z-index:2; }
.catcard__glyph { position:absolute; inset:0; display:grid; place-items:center; z-index:0; color: rgba(255,255,255,.05); }
.catcard__glyph svg { width:55%; height:55%; }
.catcard:hover .catcard__glyph { color: rgba(225,6,0,.14); }
.catcard__name { font-family: var(--font-display); font-weight:800; text-transform:uppercase; font-size: var(--fs-h4); }
.catcard__count { font-family: var(--font-mono); font-size: var(--fs-2xs); color: var(--c-text-3); }

/* ============================================================================
   INPUT / FORM
   ============================================================================ */
.field { display:flex; flex-direction:column; gap:var(--sp-2); }
.field__label { font-family: var(--font-mono); font-size: var(--fs-2xs); letter-spacing:.14em; text-transform:uppercase; color: var(--c-text-3); }
.input, .textarea, .select {
  width:100%;
  background: var(--c-surface);
  border:1px solid var(--c-line);
  border-radius: var(--r-sm);
  padding: .95em 1.1em;
  color: var(--c-text);
  font-size: var(--fs-sm);
  transition: border-color var(--t-fast), background var(--t-fast), box-shadow var(--t-fast);
}
.input::placeholder, .textarea::placeholder { color: var(--c-text-4); }
.input:focus, .textarea:focus, .select:focus {
  outline:none; border-color: var(--c-line-strong);
  background: var(--c-surface-2);
  box-shadow: 0 0 0 3px rgba(255,255,255,.04);
}
.input:focus { border-color: var(--c-red); box-shadow: 0 0 0 3px var(--c-red-soft); }
.textarea { resize:vertical; min-height:120px; }

/* Input newsletter inline */
.inline-field {
  display:flex; align-items:center; gap:var(--sp-2);
  border:1px solid var(--c-line-strong); border-radius: var(--r-pill);
  padding:6px 6px 6px 22px; background: rgba(255,255,255,.02);
  transition: border-color var(--t-fast);
  max-width: 460px;
}
.inline-field:focus-within { border-color: var(--c-red); }
.inline-field input { flex:1; background:none; border:none; outline:none; font-size: var(--fs-sm); color: var(--c-text); min-width:0; }
.inline-field input::placeholder { color: var(--c-text-4); }

/* Size selector */
.sizes { display:flex; flex-wrap:wrap; gap:8px; }
.size {
  min-width:52px; padding:.75em .5em; text-align:center;
  border:1px solid var(--c-line); border-radius: var(--r-sm);
  font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--c-text-2);
  cursor:pointer; transition: all var(--t-fast) var(--ease-out); background: var(--c-surface);
}
.size:hover { border-color: var(--c-text); color: var(--c-text); }
.size[aria-checked="true"] { background: var(--c-text); color: var(--c-ink); border-color: var(--c-text); }
.size[disabled], .size.is-out { color: var(--c-text-4); cursor:not-allowed; position:relative; }
.size.is-out::after { content:""; position:absolute; inset:0; background: linear-gradient(to top right, transparent 46%, var(--c-line) 47%, var(--c-line) 53%, transparent 54%); }

/* Rating */
.stars { display:inline-flex; gap:2px; color: var(--c-red); }
.stars svg { width:14px; height:14px; }
.stars .empty { color: var(--c-line-strong); }

/* Qty stepper */
.stepper { display:inline-flex; align-items:center; border:1px solid var(--c-line); border-radius: var(--r-pill); overflow:hidden; }
.stepper button { width:42px; height:42px; color: var(--c-text-2); transition: background var(--t-fast), color var(--t-fast); }
.stepper button:hover { background: var(--c-surface-2); color: var(--c-text); }
.stepper span { min-width:36px; text-align:center; font-family: var(--font-mono); font-size: var(--fs-sm); }

/* ============================================================================
   NAVBAR
   ============================================================================ */
.ticker-bar {
  height: var(--ticker-h);
  background: var(--c-red);
  color:#fff; overflow:hidden; display:flex; align-items:center;
  font-family: var(--font-mono); font-size: var(--fs-2xs); letter-spacing:.14em; text-transform:uppercase;
  position: relative; z-index: calc(var(--z-nav) + 1);
}
.ticker-bar .marquee__item { font-family: var(--font-mono); font-weight:700; font-size: var(--fs-2xs); gap: var(--sp-5); }
.ticker-bar .spark { opacity:.7; }

.nav {
  position: sticky; top:0; z-index: var(--z-nav);
  height: var(--nav-h);
  display:flex; align-items:center;
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-bottom:1px solid var(--glass-line);
  transition: height var(--t-med) var(--ease-out), background var(--t-med);
}
.nav.is-scrolled { height:60px; background: rgba(8,8,10,.85); }
.nav__inner { display:flex; align-items:center; gap:var(--sp-6); width:100%; }
.nav__logo { font-size:1.15rem; margin-right:var(--sp-4); }
.nav__links { display:flex; align-items:center; gap:var(--sp-5); margin-inline:auto; }
.nav__link {
  font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing:.1em; text-transform:uppercase;
  color: var(--c-text-2); position:relative; padding:.4em 0;
  transition: color var(--t-fast);
}
.nav__link:hover { color: var(--c-text); }
.nav__link::after { content:""; position:absolute; left:0; bottom:-2px; height:1px; width:100%; background: var(--c-red); transform: scaleX(0); transform-origin:right; transition: transform var(--t-med) var(--ease-out); }
.nav__link:hover::after, .nav__link.is-active::after { transform: scaleX(1); transform-origin:left; }
.nav__link.is-active { color: var(--c-text); }
.nav__actions { display:flex; align-items:center; gap:var(--sp-2); }
.nav__burger { display:none; }
@media (max-width: 1000px){
  .nav__links { display:none; }
  .nav__burger { display:inline-flex; }
  .nav__logo { margin-right:auto; }
}
@media (max-width: 480px){
  .nav__inner { gap: var(--sp-3); }
  .nav__logo { font-size: .92rem; margin-right:auto; }
  .nav__logo .logo__type { white-space: nowrap; }
  .nav__actions { gap: 4px; }
  .nav__actions .iconbtn { width: 38px; height: 38px; }
  .nav__actions .iconbtn svg { width:16px; height:16px; }
}
@media (max-width: 340px){
  .nav__logo { font-size: .84rem; }
  .nav__actions .iconbtn { width: 34px; height: 34px; }
}

/* ============================================================================
   CART DRAWER (laterale) + SEARCH OVERLAY
   ============================================================================ */
.scrim {
  position: fixed; inset:0; z-index: var(--z-drawer);
  background: rgba(0,0,0,.6); backdrop-filter: blur(3px);
  opacity:0; visibility:hidden; transition: opacity var(--t-med), visibility var(--t-med);
}
.scrim.is-open { opacity:1; visibility:visible; }

.drawer {
  position: fixed; top:0; right:0; height:100%; width: min(440px, 92vw);
  z-index: calc(var(--z-drawer) + 1);
  background: var(--c-ink-2);
  border-left:1px solid var(--c-line);
  transform: translateX(100%);
  transition: transform var(--t-med) var(--ease-in-out);
  display:flex; flex-direction:column;
  box-shadow: var(--sh-xl);
}
.drawer.is-open { transform:none; }
.drawer__head { display:flex; align-items:center; justify-content:space-between; padding:var(--sp-5) var(--sp-6); border-bottom:1px solid var(--c-line); }
.drawer__title { font-family: var(--font-display); font-weight:800; text-transform:uppercase; font-size: var(--fs-h4); }
.drawer__body { flex:1; overflow-y:auto; padding:var(--sp-5) var(--sp-6); display:flex; flex-direction:column; gap:var(--sp-4); }
.drawer__foot { padding: var(--sp-5) var(--sp-6); border-top:1px solid var(--c-line); background: var(--c-ink); }

.cart-item { display:flex; gap:var(--sp-4); }
.cart-item__media { width:82px; aspect-ratio:3/4; border-radius: var(--r-sm); overflow:hidden; background: var(--grad-panel); border:1px solid var(--c-line); flex:none; }
.cart-item__media img { width:100%; height:100%; object-fit:cover; }
.cart-item__body { flex:1; display:flex; flex-direction:column; gap:3px; }
.cart-item__top { display:flex; justify-content:space-between; gap:var(--sp-3); }
.cart-item__name { font-size: var(--fs-sm); font-weight:600; }
.cart-item__brand { font-family: var(--font-mono); font-size: var(--fs-2xs); letter-spacing:.12em; text-transform:uppercase; color: var(--c-text-3); }
.cart-item__price { font-family: var(--font-mono); font-size: var(--fs-sm); font-weight:700; white-space:nowrap; }
.cart-item__ctrl { display:flex; align-items:center; justify-content:space-between; margin-top:auto; }
.cart-remove { font-family: var(--font-mono); font-size: var(--fs-2xs); letter-spacing:.1em; text-transform:uppercase; color: var(--c-text-3); }
.cart-remove:hover { color: var(--c-red); }

.cart-total { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:var(--sp-4); }
.cart-total__label { font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing:.14em; text-transform:uppercase; color: var(--c-text-3); }
.cart-total__val { font-family: var(--font-display); font-weight:800; font-size: var(--fs-h3); }
.freeship { font-family: var(--font-mono); font-size: var(--fs-2xs); color: var(--c-text-3); margin-top:var(--sp-3); text-align:center; letter-spacing:.06em; }
.freeship b { color: var(--c-red); }

/* Search overlay */
.search-overlay {
  position: fixed; inset:0; z-index: var(--z-modal);
  background: var(--glass-bg); backdrop-filter: blur(22px) saturate(140%);
  opacity:0; visibility:hidden; transition: opacity var(--t-med), visibility var(--t-med);
  display:flex; flex-direction:column;
}
.search-overlay.is-open { opacity:1; visibility:visible; }
.search-overlay__inner { max-width: 900px; margin:0 auto; width:100%; padding: clamp(2rem,8vh,6rem) var(--gutter); }
.search-big { display:flex; align-items:center; gap:var(--sp-4); border-bottom:2px solid var(--c-line-strong); padding-bottom:var(--sp-4); }
.search-big input { flex:1; background:none; border:none; outline:none; font-family: var(--font-display); font-weight:800; font-size: clamp(1.6rem,5vw,3rem); text-transform:uppercase; color: var(--c-text); letter-spacing:-.02em; }
.search-big input::placeholder { color: var(--c-text-4); }
.search-suggest { margin-top: var(--sp-6); display:flex; flex-wrap:wrap; gap:var(--sp-2); }

/* ============================================================================
   FOOTER
   ============================================================================ */
.footer { background: var(--c-black-abs); border-top:1px solid var(--c-line); position:relative; z-index:2; }
.footer__mega {
  font-family: var(--font-display); font-weight:900; font-stretch:expanded;
  text-transform:uppercase; letter-spacing:-.03em; line-height:.82;
  font-size: clamp(3.4rem, 17vw, 17rem);
  color: transparent; -webkit-text-stroke:1px var(--c-line-strong);
  padding: clamp(2rem,5vw,4rem) 0 0; text-align:center; white-space:nowrap; overflow:hidden;
}
.footer__grid { display:grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: var(--sp-8); padding-block: var(--sp-9); }
@media (max-width: 900px){ .footer__grid { grid-template-columns: 1fr 1fr; gap: var(--sp-7); } }
@media (max-width: 520px){ .footer__grid { grid-template-columns: 1fr; } }
.footer__col h4 { font-family: var(--font-mono); font-weight:700; font-size: var(--fs-2xs); letter-spacing:.16em; text-transform:uppercase; color: var(--c-text-3); margin-bottom: var(--sp-4); }
.footer__col ul { display:flex; flex-direction:column; gap:var(--sp-3); }
.footer__col a { font-size: var(--fs-sm); color: var(--c-text-2); transition: color var(--t-fast); }
.footer__col a:hover { color: var(--c-text); }
.footer__bottom { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); padding-block: var(--sp-5); border-top:1px solid var(--c-line); font-family: var(--font-mono); font-size: var(--fs-2xs); letter-spacing:.08em; text-transform:uppercase; color: var(--c-text-3); flex-wrap:wrap; }
.footer__social { display:flex; gap:var(--sp-2); }

/* ============================================================================
   TABS / ACCORDION
   ============================================================================ */
.tabs { display:flex; gap:var(--sp-5); border-bottom:1px solid var(--c-line); }
.tab {
  font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing:.12em; text-transform:uppercase;
  color: var(--c-text-3); padding:var(--sp-3) 0; position:relative;
  transition: color var(--t-fast);
}
.tab:hover { color: var(--c-text-2); }
.tab.is-active { color: var(--c-text); }
.tab.is-active::after { content:""; position:absolute; left:0; bottom:-1px; width:100%; height:2px; background: var(--c-red); }

.acc__item { border-bottom:1px solid var(--c-line); }
.acc__head { width:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); padding:var(--sp-5) 0; text-align:left; font-family:var(--font-display); font-weight:700; text-transform:uppercase; font-size: var(--fs-h4); }
.acc__icon { transition: transform var(--t-med) var(--ease-out); color: var(--c-text-3); }
.acc__item.is-open .acc__icon { transform: rotate(45deg); color: var(--c-red); }
.acc__panel { max-height:0; overflow:hidden; transition: max-height var(--t-med) var(--ease-out); }
.acc__panel-inner { padding-bottom: var(--sp-5); color: var(--c-text-2); font-size: var(--fs-sm); max-width: 60ch; }

/* ============================================================================
   MISC — pannelli, media editoriali, chrome plate
   ============================================================================ */
.panel { background: var(--c-surface); border:1px solid var(--c-line); border-radius: var(--r-lg); }
.panel--pad { padding: var(--sp-6); }

.chrome-plate {
  background: var(--grad-chrome);
  border-radius: var(--r-lg);
  position: relative; overflow:hidden;
}
.chrome-plate::after { content:""; position:absolute; inset:0; background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.6) 45%, transparent 60%); mix-blend-mode: screen; }

/* Toast */
.toast {
  position: fixed; left:50%; bottom:26px; transform: translate(-50%, 120%);
  z-index: var(--z-toast);
  background: var(--c-text); color: var(--c-ink);
  padding:.9em 1.4em; border-radius: var(--r-pill);
  font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing:.08em; text-transform:uppercase; font-weight:700;
  display:flex; align-items:center; gap:.6em;
  box-shadow: var(--sh-lg); transition: transform var(--t-med) var(--ease-spring);
}
.toast.is-show { transform: translate(-50%,0); }
.toast .dot { width:7px;height:7px;border-radius:99px;background: var(--c-red); }

/* Placeholder media "editoriale" (usa gradienti/glyph invece di foto) */
.ed-media { position:relative; overflow:hidden; background: var(--grad-panel); }
.ed-media__grid { position:absolute; inset:0; background-image: linear-gradient(var(--c-line-faint) 1px, transparent 1px), linear-gradient(90deg, var(--c-line-faint) 1px, transparent 1px); background-size: 40px 40px; opacity:.6; }
.ed-media__spark { position:absolute; inset:0; display:grid; place-items:center; color: rgba(255,255,255,.08); }