/* =========================================================================
   CULT ON AIR — Home: header, hero, quick access, radio hub
   ========================================================================= */

/* header ---------------------------------------------------------------- */
.site-header{
  position:sticky; top:0; z-index:70;
  background:color-mix(in srgb, var(--bg) 82%, transparent);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--surface-hairline);
}
.site-header::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:linear-gradient(90deg, var(--neon-pink), var(--neon-violet), var(--neon-cyan), var(--neon-green));
}
.site-header .container{
  height:64px; display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.brand{ display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:1.05rem; }
.brand-mark{ width:36px; height:36px; padding:2px; }
.brand-mark img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.header-actions{ display:flex; align-items:center; gap:8px; }
.theme-toggle{
  width:38px; height:38px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid var(--surface-hairline);
  color:var(--text-secondary);
}
.theme-toggle:hover{ border-color:var(--accent); color:var(--accent); }
.theme-toggle .icon-moon{ display:none; }
[data-theme="dark"] .theme-toggle .icon-sun{ display:none; }
[data-theme="dark"] .theme-toggle .icon-moon{ display:block; }

/* hero -------------------------------------------------------------------*/
.hero{
  position:relative; overflow:hidden;
  padding-block:44px 40px;
  isolation:isolate;
}
.hero::before{
  content:''; position:absolute; inset:-20% -10% auto -10%; height:120%;
  background:
    radial-gradient(60% 55% at 18% 15%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%),
    radial-gradient(55% 50% at 90% 10%, color-mix(in srgb, var(--accent2) 26%, transparent), transparent 70%);
  filter:blur(30px);
  z-index:-1;
  animation:drift 22s ease-in-out infinite alternate;
}
@keyframes drift{
  from{ transform:translate3d(0,0,0) scale(1); }
  to{ transform:translate3d(0,-2%,0) scale(1.06); }
}

/* muro dei ricordi — Direzione B, scelta dopo il confronto a 3 -----------
   cuffie + radio vintage + microfono + cassetta + vinile, grandi, come un
   flat-lay fotografico dietro alla card "ora in onda" invece di una singola
   decorazione piccola in un angolo. */
.hero-wall{ position:absolute; inset:0; z-index:-1; pointer-events:none; }
.wall-item{ position:absolute; filter:drop-shadow(0 16px 32px rgba(0,0,0,.4)); }

.wi-radio{ width:clamp(220px,26vw,320px); right:-4%; top:6%; transform:rotate(5deg); opacity:.95; }
.wi-cuffie{ width:clamp(190px,22vw,270px); right:14%; top:30%; transform:rotate(-7deg); }
.wi-vinile{ width:clamp(150px,17vw,210px); right:2%; top:46%; animation:vinyl-spin 30s linear infinite; }
.wi-cassetta{ width:clamp(150px,17vw,210px); right:22%; bottom:4%; transform:rotate(9deg); }
.wi-mic{ width:clamp(110px,13vw,160px); right:0%; bottom:-2%; transform:rotate(-6deg); opacity:.9; }

@media (max-width:899px){
  /* sotto i due-colonne: il muro passa dietro tutto l'hero, più tenue, non
     dietro solo la card — evita che copra il testo con troppo contrasto */
  .hero-wall{ opacity:.5; }
  .wi-radio{ right:-10%; top:2%; }
  .wi-mic{ display:none; } /* troppi elementi in poco spazio sotto i 900px */
  /* BUG SEGNALATO: sotto i due-colonne la card "ora in onda" (con il
     badge circolare del logo appeso al suo angolo alto-destro) scende
     nel flusso e finisce proprio all'altezza delle decorazioni sopra,
     posizionate in percentuale sull'intera hero (molto più alta in
     colonna singola) — il vinile finiva addosso al badge. Spostato più
     in basso, fuori dalla zona del badge. Le cuffie invece, spostate più
     in alto per evitare il badge, finivano addosso al paragrafo di testo
     (illeggibile) — tra le due card che restano poco spazio in verticale
     sotto i 900px, quindi le cuffie vengono nascoste qui come già il
     microfono: radio in alto, vinile+cassetta in basso bastano. */
  .wi-vinile{ top:auto; bottom:6%; right:-4%; width:clamp(110px,26vw,160px); }
  .wi-cuffie{ display:none; }
}

@keyframes vinyl-spin{ to{ transform:rotate(360deg); } }

/* reveal-on-scroll ---------------------------------------------------------*/
[data-reveal]{
  opacity:1; transform:none;
  transition:opacity .5s var(--ease-out), transform .5s var(--ease-out);
}
[data-reveal].is-pending{ opacity:0; transform:translateY(16px); }
[data-reveal].is-visible{ opacity:1; transform:none; }
.hero-grid{
  display:grid; gap:26px;
}
.hero-now{
  position:relative;
  background:linear-gradient(160deg, color-mix(in srgb, var(--surface) 96%, var(--accent) 4%), var(--surface));
  border:1px solid var(--surface-hairline);
  border-radius:var(--r-lg);
  padding:22px;
  box-shadow:var(--shadow-lg);
}
.hero-logo-badge{
  position:absolute; top:-22px; right:22px;
  width:64px; height:64px; padding:3px;
}
.hero-logo-badge img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.hero-now-top{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.hero-now-top .eq{ margin-left:auto; }

/* "Sta suonando" — i metadati protagonisti: sempre presenti, mai nascosti.
   Titolo grande, in primo piano rispetto al palinsesto sotto. */
.now-playing{
  background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 16%, var(--surface)), color-mix(in srgb, var(--accent2) 10%, var(--surface)));
  border:1px solid color-mix(in srgb, var(--accent) 30%, var(--surface-hairline));
  border-radius:var(--r-md); padding:14px 16px; margin-bottom:16px;
}
.now-playing-label{
  display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent); margin-bottom:4px;
}
.now-playing-title{
  display:block; font-family:var(--font-display); font-size:1.15rem; line-height:1.25;
  color:var(--text-primary); text-wrap:balance;
}
.now-playing-foot{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:6px; }
.now-playing-artist{ font-size:var(--fs-sm); color:var(--text-secondary); }
.listeners-badge{
  font-family:var(--font-mono); font-size:10px; color:var(--text-muted); flex:none;
  display:inline-flex; align-items:center; gap:5px;
}
.listeners-badge:not(:empty)::before{ content:'●'; color:var(--success); font-size:7px; }
.hero-title{ font-size:var(--fs-display); line-height:0.98; margin:6px 0 10px; }
.hero-title em{ font-style:normal; color:var(--accent); }
.hero-sub{ color:var(--text-secondary); max-width:52ch; font-size:1.02rem; }

.hero-show{
  display:flex; align-items:center; gap:14px;
  margin-top:20px; padding-top:18px; border-top:1px dashed var(--surface-hairline);
}
.hero-show-art{
  width:56px; height:56px; border-radius:var(--r-sm); flex:none;
  background:linear-gradient(150deg, var(--accent2), var(--accent2-strong));
  display:grid; place-items:center; color:#fff;
  box-shadow:var(--shadow-glow);
  transition:transform .16s var(--ease-out), filter .16s;
}
.hero-show-art:hover{ filter:brightness(1.08); }
.hero-show-art:active{ transform:scale(.94); }
.hero-show-meta small{ display:block; font-family:var(--font-mono); font-size:var(--fs-xs); color:var(--text-muted); letter-spacing:.06em; text-transform:uppercase; }
.hero-show-meta strong{ font-size:1.05rem; }
.hero-show-time{ margin-left:auto; font-family:var(--font-mono); color:var(--text-muted); font-size:var(--fs-sm); text-align:right; }

.hero-cta{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }

/* quick access rail ------------------------------------------------------*/
.quick-rail{
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(148px,1fr);
  gap:12px; overflow-x:auto; padding:4px 2px 10px;
  scroll-snap-type:x proximity;
}
.quick-card{
  scroll-snap-align:start;
  background:var(--surface); border:1px solid var(--surface-hairline);
  border-radius:var(--r-md); padding:16px;
  display:flex; flex-direction:column; gap:22px;
  transition:transform .18s var(--ease-out), border-color .18s;
}
.quick-card:hover{ transform:translateY(-3px); border-color:var(--accent); }
.quick-card .icon{ width:22px; height:22px; color:var(--accent); }
.quick-card strong{ font-size:.95rem; }
.quick-card span{ font-size:var(--fs-xs); color:var(--text-muted); }

/* section shell ------------------------------------------------------------*/
.section{ padding-block:46px; }
.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
.section-head h2{ font-size:var(--fs-h2); margin-top:6px; }
.section-head p{ color:var(--text-secondary); max-width:56ch; margin-top:6px; }

/* barra azioni stile RDS (segmenti pieni, squadrati, maiuscolo) -----------*/
.action-bar{
  display:flex; position:sticky; top:64px; z-index:65;
  box-shadow:0 6px 16px -8px rgba(0,0,0,0.35);
}
.action-seg{
  flex:1; display:flex; align-items:center; justify-content:center; gap:7px;
  padding:13px 10px; font-weight:800; font-size:.82rem; letter-spacing:.02em;
  text-transform:uppercase; color:#fff; text-align:center;
  transition:filter .15s, transform .15s;
}
.action-seg:hover{ filter:brightness(1.08); }
.action-seg:active{ transform:scale(.98); }
.action-seg .icon{ width:15px; height:15px; flex:none; }
.action-seg-play{
  flex:1.3;
  background:linear-gradient(135deg, var(--amber-300), var(--amber-500) 70%, var(--amber-600));
  color:#1B0F04;
}
.action-seg-rubriche{ background:linear-gradient(135deg, var(--neon-violet), var(--accent2-strong)); }
.action-seg-vinci{ background:linear-gradient(135deg, var(--neon-cyan), #0E8FA8); color:#04262B; }

@media (max-width:639px){
  .hero-cta{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }
  .hero-cta .btn{
    width:100%;
    min-height:58px;
    justify-content:center;
    font-size:1rem;
  }
  .hero-show{
    gap:12px;
    align-items:center;
  }
  .hero-show-art{
    width:68px;
    height:68px;
    border-radius:20px;
  }
  .hero-show-art .icon{
    width:28px !important;
    height:28px !important;
  }
  .action-seg{
    min-height:64px;
    padding:18px 10px;
    font-size:.94rem;
  }
  .action-seg .icon{
    width:19px;
    height:19px;
  }
  .quick-rail{
    grid-auto-flow:row;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    overflow-x:visible;
    gap:12px;
  }
  .quick-card{
    min-height:118px;
    border-radius:18px;
    padding:18px;
    gap:16px;
  }
  .quick-card .icon{
    width:34px;
    height:34px;
  }
  .quick-card strong{
    font-size:1.02rem;
  }
  .rubriche-grid{
    grid-template-columns:1fr;
  }
  .rubrica-card{
    min-height:132px;
    border-radius:18px;
    padding:18px;
  }
  .rubrica-icon{
    width:48px;
    height:48px;
    border-radius:15px;
  }
  .rubrica-icon .icon{
    width:24px;
    height:24px;
  }
}

/* ascoltaci anche su ------------------------------------------------------*/
.platforms-strip{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.platform-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 16px; border-radius:var(--r-pill);
  font-size:var(--fs-sm); font-weight:700;
  background:var(--surface); border:1px solid var(--surface-hairline);
  transition:transform .16s var(--ease-out), border-color .16s;
}
.platform-badge::before{
  content:''; width:9px; height:9px; border-radius:50%; background:var(--platform-color, var(--accent));
}
.platform-badge:hover{ transform:translateY(-2px); border-color:var(--platform-color, var(--accent)); }

/* concorso (stile Capital FM "Cash Call", colori CULT) ----------------------
   .contest-art ospita la foto vera del premio (assets/img/val-di-fassa-*.jpg). */
.contest{
  display:grid; gap:0; overflow:hidden;
  border-radius:var(--r-lg); border:1px solid var(--surface-hairline);
  box-shadow:var(--shadow-lg);
}
@media (min-width:700px){ .contest{ grid-template-columns:1.15fr 1fr; } }
.contest-art{
  position:relative;
  min-height:320px;
  background:var(--ink-950);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
@media (min-width:700px){ .contest-art{ min-height:100%; } }
.contest-art svg{ width:100%; height:100%; }
.contest-art img{ width:100%; height:100%; object-fit:cover; display:block; }
.contest-photo-credit{
  position:absolute; left:0; right:0; bottom:0;
  padding:6px 12px; font-size:10px; line-height:1.4;
  color:rgba(255,255,255,.85); background:linear-gradient(0deg, rgba(0,0,0,.65), rgba(0,0,0,0));
}
.contest-body{
  padding:32px; display:flex; flex-direction:column; gap:14px;
  background:var(--surface);
}
.contest-eyebrow{ font-weight:700; font-size:var(--fs-body); color:var(--neon-pink); }
.contest-title{ font-size:var(--fs-h1); }
.contest-prize{ font-size:1.05rem; color:var(--text-secondary); }
.contest-prize em{ font-style:normal; color:var(--accent); font-weight:700; }
.contest-steps{ list-style:none; margin:4px 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.contest-steps li{ font-size:var(--fs-body); color:var(--text-secondary); }
.contest-steps b{ color:var(--accent2); margin-right:4px; }
.contest .btn{ align-self:flex-start; margin-top:6px; font-size:var(--fs-body); padding:14px 28px; }
.contest-legal{ font-size:10px; color:var(--text-muted); line-height:1.5; margin-top:6px; }

/* la voce di CULT ON AIR — foto vera dello speaker in cabina, stesso
   linguaggio visivo del concorso (grid a due colonne, stesso raggio/ombra),
   ma con l'ordine invertito: testo a sinistra, foto a destra, per dare
   ritmo alla pagina invece di ripetere lo stesso layout due volte di fila. */
.host{
  display:grid; gap:0; overflow:hidden;
  border-radius:var(--r-lg); border:1px solid var(--surface-hairline);
  box-shadow:var(--shadow-lg);
}
@media (min-width:700px){ .host{ grid-template-columns:1fr 1.15fr; } }
.host-body{
  padding:32px; display:flex; flex-direction:column; gap:14px;
  background:var(--surface); justify-content:center;
  order:2;
}
@media (min-width:700px){ .host-body{ order:1; } }
.host-eyebrow{ font-weight:700; font-size:var(--fs-body); color:var(--neon-cyan); }
.host-title{ font-size:var(--fs-h1); }
.host-text{ color:var(--text-secondary); font-size:1.05rem; line-height:1.55; }
.host .btn{ align-self:flex-start; margin-top:6px; }
.host-art{
  min-height:280px;
  background:var(--ink-950);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  order:1;
}
@media (min-width:700px){ .host-art{ min-height:100%; order:2; } }
.host-art img{ width:100%; height:100%; object-fit:cover; display:block; }

/* sponsor in evidenza (Armonia Fit Food) — striscia compatta, non invasiva */
.sponsor-strip{
  display:flex; align-items:center; gap:12px;
  background:var(--surface); border:1px solid var(--surface-hairline);
  border-left:3px solid var(--neon-green);
  border-radius:var(--r-sm); padding:11px 14px;
  transition:border-color .16s, background-color .16s;
}
.sponsor-strip:hover{ background:var(--surface-2); }
.sponsor-strip-icon{
  width:30px; height:30px; flex:none; border-radius:8px;
  display:grid; place-items:center; color:#173B1F; background:var(--neon-green);
}
.sponsor-strip-icon .icon{ width:16px; height:16px; }
.sponsor-strip-text{ flex:1; min-width:0; font-size:var(--fs-sm); color:var(--text-secondary); }
.sponsor-strip-text b{ color:var(--text-primary); }
.sponsor-strip-cta{
  flex:none; display:inline-flex; align-items:center; gap:5px;
  font-size:var(--fs-xs); font-weight:700; color:var(--neon-green);
}

/* rubriche -----------------------------------------------------------------*/
.rubriche{ background:var(--surface-2); border-top:1px solid var(--surface-hairline); border-bottom:1px solid var(--surface-hairline); }

.rubriche-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media (min-width:640px){ .rubriche-grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:960px){ .rubriche-grid{ grid-template-columns:repeat(4,1fr); } }

.rubrica-card{
  position:relative; text-align:left;
  background:var(--surface); border:1px solid var(--surface-hairline);
  border-radius:var(--r-md); padding:16px;
  display:flex; flex-direction:column; gap:12px; min-height:150px;
  transition:transform .16s var(--ease-out), border-color .16s, box-shadow .16s;
}
.rubrica-card:hover{ transform:translateY(-3px); border-color:var(--accent2); box-shadow:var(--shadow-md); }
.rubrica-icon{
  width:36px; height:36px; border-radius:10px; flex:none;
  display:grid; place-items:center; color:#fff;
}
.rubrica-icon .icon{ width:18px; height:18px; }
.rubrica-title{ font-size:.95rem; }
.rubrica-tagline{ font-size:var(--fs-xs); color:var(--text-muted); line-height:1.4; }
.rubrica-status{
  position:absolute; top:14px; right:14px;
  font-family:var(--font-mono); font-size:9px; letter-spacing:.05em; text-transform:uppercase;
  padding:3px 7px; border-radius:var(--r-xs);
  border:1px solid var(--surface-hairline); color:var(--text-muted);
}
.rubrica-status.status-live{ color:var(--success); border-color:color-mix(in srgb, var(--success) 45%, transparent); }
.rubrica-status.status-ready{ color:var(--accent2); border-color:color-mix(in srgb, var(--accent2) 45%, transparent); }
.rubrica-card.is-sponsored{ border-color:color-mix(in srgb, var(--neon-pink) 45%, var(--surface-hairline)); }
.rubrica-card.is-sponsored .rubrica-status{ color:var(--neon-pink); border-color:color-mix(in srgb, var(--neon-pink) 50%, transparent); }

/* sponsor / media kit --------------------------------------------------------*/
.sponsor{
  background:linear-gradient(160deg, var(--ink-900), var(--ink-950));
  color:var(--paper-100); border-radius:var(--r-lg);
  margin-inline:var(--gutter); padding:30px 24px;
  display:flex; flex-direction:column; gap:26px;
}
.sponsor h3{ color:#fff; font-size:var(--fs-h2); max-width:24ch; }
.sponsor > p{ color:#C6BFD1; max-width:56ch; font-size:var(--fs-sm); }

.sponsor-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
@media (min-width:640px){ .sponsor-grid{ grid-template-columns:repeat(4,1fr); } }
.sponsor-stat{
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.09);
  border-radius:var(--r-sm); padding:14px;
}
.sponsor-stat strong{ display:block; font-family:var(--font-display); font-size:1.4rem; color:var(--accent-soft); }
.sponsor-stat span{ font-size:var(--fs-xs); color:#A79FB4; }

.sponsor-slots{ display:flex; flex-direction:column; gap:8px; }
.sponsor-slot{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--r-sm); padding:12px 14px; font-size:var(--fs-sm); color:#E4DEEE;
}
.sponsor-slot b{ color:#fff; font-weight:700; }
.sponsor-slot span{ color:#A79FB4; font-size:var(--fs-xs); }
.sponsor-slot.is-active{ border-color:color-mix(in srgb, var(--neon-green) 45%, rgba(255,255,255,0.08)); background:color-mix(in srgb, var(--neon-green) 8%, rgba(255,255,255,0.04)); }
.sponsor-slot.is-active > span:first-child{ display:flex; flex-direction:column; gap:2px; }
.sponsor-slot-badge{
  display:inline-flex; align-items:center; gap:5px; flex:none;
  font-size:var(--fs-xs); font-weight:700; color:var(--neon-green);
  border:1px solid color-mix(in srgb, var(--neon-green) 45%, transparent);
  border-radius:var(--r-pill); padding:4px 10px;
}

.sponsor-cta{ display:flex; flex-wrap:wrap; gap:10px; }
.sponsor-cta .btn-ghost{ background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.14); color:#fff; }

/* modale (Palinsesto, Astro CULT, CULT AI, Top 10) ---------------------------*/
.modal{
  position:fixed; inset:0; z-index:100;
  display:flex; align-items:flex-end; justify-content:center;
  background:rgba(8,7,12,0.6); backdrop-filter:blur(4px);
}
.modal[hidden]{
  display:none !important;
}
@media (min-width:640px){ .modal{ align-items:center; padding:24px; } }
.modal-dialog{
  width:100%; max-width:520px; max-height:min(80vh, 640px);
  background:var(--surface); border:1px solid var(--surface-hairline);
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  display:flex; flex-direction:column; overflow:hidden;
  box-shadow:var(--shadow-lg);
}
@media (min-width:640px){ .modal-dialog{ border-radius:var(--r-lg); } }
.modal-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:18px 20px; border-bottom:1px solid var(--surface-hairline); flex:none;
}
.modal-head h3{ font-size:var(--fs-h3); }
.modal-close{
  width:32px; height:32px; border-radius:50%; display:grid; place-items:center;
  color:var(--text-muted); border:1px solid var(--surface-hairline);
}
.modal-close:hover{ color:var(--text-primary); border-color:var(--accent); }
.modal-close .icon{ width:14px; height:14px; }
.modal-body{ padding:8px 20px 20px; overflow-y:auto; }

.pal-list{ display:flex; flex-direction:column; }
.pal-row{
  display:flex; align-items:center; gap:12px;
  padding:12px 4px; border-bottom:1px solid var(--surface-hairline);
}
.pal-row:last-child{ border-bottom:0; }
.pal-time{ color:var(--text-muted); font-size:var(--fs-sm); width:96px; flex:none; }
.pal-title{ flex:1; font-weight:600; }
.pal-row.is-now{ background:color-mix(in srgb, var(--accent) 8%, transparent); border-radius:var(--r-sm); }
.pal-row.is-now .pal-time, .pal-row.is-now .pal-title{ color:var(--text-primary); font-weight:700; }

.astro-list{ display:flex; flex-direction:column; }
.astro-row{
  display:flex; gap:12px; padding:12px 4px; border-bottom:1px solid var(--surface-hairline);
}
.astro-row:last-child{ border-bottom:0; }
.astro-emoji{ font-size:1.4rem; flex:none; width:28px; text-align:center; }
.astro-dates{ font-size:var(--fs-xs); color:var(--text-muted); font-weight:400; }
.astro-row p{ margin-top:2px; font-size:var(--fs-sm); color:var(--text-secondary); }

.ai-chat{ display:flex; flex-direction:column; gap:10px; }
.ai-messages{
  display:flex; flex-direction:column; gap:8px;
  max-height:280px; overflow-y:auto; padding:4px 2px;
}
.ai-msg{
  max-width:82%; padding:9px 13px; border-radius:var(--r-md); font-size:var(--fs-sm); line-height:1.4;
}
.ai-msg-bot{ align-self:flex-start; background:var(--surface-2); border:1px solid var(--surface-hairline); }
.ai-msg-user{ align-self:flex-end; background:linear-gradient(135deg, var(--accent2), var(--accent2-strong)); color:#fff; }
.ai-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.ai-form{ display:flex; gap:8px; }
.ai-input{
  flex:1; background:var(--surface-2); border:1px solid var(--surface-hairline);
  border-radius:var(--r-pill); padding:10px 16px; color:var(--text-primary); outline:0;
}
.ai-input:focus{ border-color:var(--accent2); }
.ai-disclaimer{ text-align:center; font-size:var(--fs-xs); color:var(--text-muted); }

.t10-intro{ font-size:var(--fs-sm); color:var(--text-secondary); margin-bottom:14px; }
.t10-list{ display:flex; flex-direction:column; }
.t10-row{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px;
  padding:4px 0; border-bottom:1px solid var(--surface-hairline);
}
.t10-row:last-child{ border-bottom:0; }
.t10-pos{
  font-family:var(--font-display); font-size:1.6rem; font-weight:700;
  color:var(--accent2); opacity:.55;
  width:36px; text-align:center; flex:none;
}
.t10-main{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:12px 0; text-align:left; min-width:0;
}
.t10-titles strong{ display:block; font-size:.95rem; }
.t10-artist{ font-size:var(--fs-xs); color:var(--text-muted); }
.t10-chevron{ width:16px; height:16px; color:var(--text-muted); flex:none; transition:transform .16s; }
.t10-row.is-open .t10-chevron{ transform:rotate(180deg); }
.t10-fav{ width:32px; height:32px; border-radius:50%; display:grid; place-items:center; color:var(--text-muted); flex:none; }
.t10-fav .icon{ width:17px; height:17px; }
.t10-fav.is-fav{ color:var(--neon-pink); }
.t10-fav.is-fav .icon{ fill:var(--neon-pink); }
.t10-detail{
  grid-column:1 / -1; padding:0 0 14px 46px; font-size:var(--fs-sm); color:var(--text-secondary);
}
.t10-detail a{ display:inline-block; margin-top:6px; color:var(--accent2); font-size:var(--fs-xs); font-weight:600; }

.soon-box{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px;
  padding:28px 12px;
}
.soon-box p{ color:var(--text-secondary); max-width:36ch; }
.soon-tag{
  font-family:var(--font-mono); font-size:var(--fs-xs); letter-spacing:.05em; text-transform:uppercase;
  color:var(--accent2); border:1px solid color-mix(in srgb, var(--accent2) 40%, transparent);
  padding:5px 12px; border-radius:var(--r-pill);
}

footer.site-footer{ padding:36px var(--gutter) 24px; color:var(--text-muted); font-size:var(--fs-xs); text-align:center; }

@media (min-width:900px){
  .hero-grid{ grid-template-columns:1.1fr 0.9fr; align-items:center; }
}


/* I 10 Dischi del Cuore — richiesta ascoltatore */
.t10-request{margin-top:28px;padding:22px;border:1px solid var(--surface-hairline);border-radius:20px;background:var(--surface-2)}
.t10-request-head h3{margin:4px 0 8px;font-size:clamp(24px,4vw,38px);line-height:1}.t10-request-head p{margin:0 0 18px;color:var(--text-secondary)}
.t10-request-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.t10-request-row{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:8px}.t10-request-row>span{font-weight:900;text-align:center;color:var(--accent)}
.t10-request input,.t10-request textarea{width:100%;border:1px solid var(--surface-hairline);border-radius:12px;background:var(--surface);padding:11px 12px;outline:none}.t10-request input:focus,.t10-request textarea:focus{border-color:var(--accent2)}
.t10-request-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.t10-request textarea{min-height:90px;resize:vertical;margin-top:10px}.t10-request-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.t10-request-status{min-height:1.4em;margin:10px 0 0;color:var(--text-secondary);font-size:13px}
@media(max-width:680px){.t10-request-grid,.t10-request-meta{grid-template-columns:1fr}.t10-request{padding:16px}.t10-request-actions .btn{width:100%}}