/* =============================================================================
   TEMA SUÉLTATE — Palette 1 "Mediterráneo cálido" + Hero variante B (scura)
   -----------------------------------------------------------------------------
   Sorgente di verità del tema della index. Caricato come ULTIMO foglio di stile
   in index.html (dopo style-v2.css e dopo lo <style> inline) → vince il cascade
   esattamente come faceva il blocco di anteprima.

   REVERSIBILE: per tornare al tema originale basta rimuovere il
   <link rel="stylesheet" href="css/sueltate-theme.css"> da index.html ed eliminare
   questo file. Nessun CSS condiviso è stato modificato in-place.

   Ruoli / override principali:
     --primary-blue #C0532B  → brand/primario (era #00445E)
     --accent-mint  #F08A24  → CTA/azione      (era #40F99B)
     --snow-mint    #FBF4EA  → sfondo          (era #F5FBEF)
     --soft-slate   #6E5F52  → testo secondario(era #61707D)
     --mist-blue    #1E6E6A  → accento         (era #B1C5CE)
     body text      #2B2520  → inchiostro leggibile (WCAG AA)
     HERO (scoped)  sfondo espresso #2B1A12 + testi chiari + CTA arancio + accento teal #5FC9B4
   Semantici NON toccati: success/error/warning, rosso colonna negativa, verde WhatsApp.
   La headline images/head1.png (testo bianco + box mint) è corretta su hero scura.
   ============================================================================= */

/* ===== (a) BASE — Palette 1 (Mediterráneo cálido), da PALETTE-REPORT §3 ===== */
:root {
  --primary-blue: #C0532B;   /* RUOLO brand/primario (era #00445E) */
  --accent-mint:  #F08A24;     /* RUOLO CTA/azione    (era #40F99B) */
  --snow-mint:    #FBF4EA;      /* RUOLO sfondo        (era #F5FBEF) */
  --soft-slate:   #6E5F52;   /* testo secondario    (era #61707D) */
  --mist-blue:    #1E6E6A; /* accento             (era #B1C5CE) */
}
/* --primary-blue ora = brand → ripristino il TESTO scuro per leggibilità (WCAG AA) */
body { color: #2B2520; }
/* Label su sfondo azione (accent-mint) → testo scuro, alto contrasto sul CTA */
.mega-cta, .btn-primary-v2, .bonus-cta-btn, .badge-pill, .guarantee-highlight,
.highlight-mint, .highlight-red-box, .video-header-v2, .avatar-initials-v2,
.value-stack-item.bonus .item-badge-header.bonus { color: #2B1A12 !important; }
/* Gradient CTA: il partner chiaro (era #7ce3cb) → tinta chiara del nuovo CTA */
.mega-cta, .btn-primary-v2, .badge-pill, .guarantee-highlight, .bonus-cta-btn {
  background: linear-gradient(135deg, #F08A24 0%, #F7B36B 100%);
}
/* Hero: fine del gradient scuro (era #002D3E) → brand scuro */
.hero { background: radial-gradient(circle at top, #C0532B 0%, #8E3C1E 100%) !important; }
/* Duplicati hard-coded del brand-text presenti nella index */
.benefit-content-v7 h3 { color: #C0532B; }
.benefit-content-v7 p  { color: #2B2520; }

/* ===== (b) HERO-SCOPED OVERRIDE — VARIANTE B (SCURA, espresso) — solo dentro .hero ===== */
/* Sfondo hero: espresso (famiglia terracotta) */
section.hero { background: #2B1A12 !important; }
/* Sottotitolo / paragrafi hero */
.hero .subheadline { color: #D8C4AF !important; }
/* Trust: testo + stelle/rating */
.hero .social-proof-text { color: #D8C4AF !important; }
.hero .stars { color: #F8A94C !important; }
/* CTA primario hero: sfondo pieno azione + label scuro */
.hero .mega-cta { background: #F08A24 !important; color: #3A1F04 !important; }
/* FIX5: rimosso il bordo verde (teal #5FC9B4) del frame VSL → ricade sull'inline
   border var(--primary-blue) = terracotta #C0532B (cornice strutturale calda). */
/* La headline images/head1.png (testo bianco + box mint) è nata per sfondo scuro → su espresso legge bene. */


/* =============================================================================
   (c) PASSATA DI RESTYLE INDEX — richieste S1–S7 / C-S
   Caricato per ULTIMO → vince sul cascade. Niente !important dove non serve:
   così gli stili INLINE (box negativi rossi, highlight) restano intatti e
   gli override agiscono solo per source-order.
   ============================================================================= */

/* ---- S1: copy "nero leggibile" sui blocchi marcati .ink-black --------------
   I blocchi target hanno la classe .ink-black nel markup. Si toccano SOLO
   paragrafi e liste (no titoli/headings, no box negativi inline, no highlight).
   I box negativi (#c53030) e gli highlight hanno colore INLINE → vincono su
   queste regole (nessun !important) e restano invariati.                      */
.ink-black p,
.ink-black li {
  color: #1a1a1a;
  opacity: 1;
}
/* Eccezione di contrasto: il .dark-narrative-block ("Come mai lo spagnolo non
   ti entra in testa?") è ANNIDATO nel blocco (b) ma sta su sfondo SCURO e NON
   è tra i blocchi richiesti → ripristino i suoi testi a chiaro (regola 4).    */
.ink-black .dark-narrative-block p,
.ink-black .dark-narrative-block h2 {
  color: #fff;
}

/* ---- S2: "SOLO 27€" in VERDE (il verde di sistema già presente sul prezzo:
   --success, lo stesso di "INCLUSO"/free-val). Su card prezzo bianca.         */
.price-new-v2 {
  color: #059669; /* F2: verde più scuro già in palette (.verified-badge-v2) → leggibilità su bianco */
}

/* ---- S3/F1: ombra dei CTA tintata sullo STESSO arancio del bottone (#F08A24),
   morbida. Niente alone verde sotto bottoni arancioni.                        */
.mega-cta,
.btn-primary-v2,
.bonus-cta-btn {
  box-shadow: 0 10px 25px rgba(240, 138, 36, 0.35);
}

/* ---- B1: badge "INCLUSO" senza pill: solo TESTO colorato col colore che prima
   era il fill (mint/accent = var(--accent-mint)). Nessun box dietro.          */
.item-value-pill .free-val {
  color: var(--accent-mint);
  background: none;
  padding: 0;
}

/* ---- R1: S5 e S6 RIMOSSI → ripristinato il look originale delle card bonus
   (badge "Bonus Esclusivo" con testo scuro, bordo card originale). Card bonus
   chiare in contrasto netto col percorso principale (scuro).                  */

/* ---- S7: componente "4 cerchi + linea" (.cinematic-flow-v2 dentro il
   dark-narrative-block, sfondo terracotta #C0532B): cerchi/numeri/linea
   resi leggibili. Cerchio crema, numero espresso, linea crema.               */
.dark-narrative-block .node-v2 {
  background: var(--snow-mint); /* crema #FBF4EA: pop su terracotta */
  border-color: #2B1A12;
  color: #2B1A12;
  box-shadow: 0 0 14px rgba(0, 0, 0, 0.25);
}
.dark-narrative-block .cinematic-flow-v2::before {
  background: rgba(251, 244, 234, 0.55); /* linea crema invece del verde fuori palette */
}
