/* ==========================================================================
   FORESTA DELLE LUCCIOLE — CSS GLOBALE v2.0-performance-candidato
   - Card automatiche su: .wp-block-group, .wp-block-cover, .wp-block-columns
   - Responsive: padding pannelli e padding sito via variabili
   - Titoli/link: stop spezzatura aggressiva su mobile
   ========================================================================== */

/* ==========================================================================
   1) VARIABILI GLOBALI
   ========================================================================== */

:root{
  /* Sfondo */
  --bg-main:#020805;
  --bg-gradient-top:#0b1f18;

  /* Testo */
  --text-main:#e6f7f1;
  --text-muted:#9fc9bb;

  /* Accenti */
  --accent-primary:#6fe3b2;        /* lucciola viva */
  --accent-primary-soft:#9af0cc;   /* alone */
  --accent-secondary:#4fa3ff;      /* riflesso acqua */
  --accent-gold:#d6b56e;           /* resina antica */

  /* Card system */
  --panel-bg: rgba(11,31,24,.95);
  --panel-radius:16px;
  --panel-pad-y:1.7rem;
  --panel-pad-x:1.5rem;
  --panel-shadow:0 0 34px rgba(0,0,0,.68);
  --panel-border:1px solid rgba(111,227,178,.22);

  /* Glow titoli */
  --title-glow:
    0 0 10px rgba(111,227,178,.55),
    0 0 22px rgba(154,240,204,.35),
    0 0 34px rgba(79,163,255,.18);

  /* Spaziatura layout */
  --site-pad-y: 1.7rem;
  --site-pad-x: 1.25rem;
}

/* ==========================================================================
   2) SFONDO GLOBALE + NEBBIA
   ========================================================================== */

body{
  /*
   * Atmosfera base già compositata nello sfondo.
   * Nessun velo position:fixed / mix-blend-mode globale:
   * durante lo scroll il browser non deve ricomporre un layer a pieno viewport.
   */
  background:
    radial-gradient(circle at 40% 10%, rgba(39,79,66,.11), transparent 55%),
    radial-gradient(circle at 70% 0%, rgba(82,102,75,.08), transparent 50%),
    radial-gradient(circle at top, var(--bg-gradient-top) 0%, var(--bg-main) 60%, #010307 100%);
  color: var(--text-main);
  font-family:'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.7;
  text-rendering: optimizeLegibility;
}

/* ==========================================================================
   3) WRAPPER SITO (FSE)
   ========================================================================== */

.wp-site-blocks{
  padding: var(--site-pad-y) var(--site-pad-x);
}

/* ==========================================================================
   4) CARD SYSTEM AUTOMATICO (come prima)
   ========================================================================== */

.wp-block-group,
.wp-block-cover,
.wp-block-columns{
  background-color: var(--panel-bg);
  border-radius: var(--panel-radius);
  padding: var(--panel-pad-y) var(--panel-pad-x);
  box-shadow: var(--panel-shadow);
  border: var(--panel-border);
}

/* Piccolo anti-effetto “pannello annidato troppo pesante”:
   se un blocco pannellizzato contiene direttamente un altro pannello,
   riduci un filo la spaziatura interna del pannello “interno” */
.wp-block-group .wp-block-group,
.wp-block-group .wp-block-cover,
.wp-block-group .wp-block-columns,
.wp-block-cover .wp-block-group,
.wp-block-cover .wp-block-cover,
.wp-block-cover .wp-block-columns,
.wp-block-columns .wp-block-group,
.wp-block-columns .wp-block-cover,
.wp-block-columns .wp-block-columns{
  padding: calc(var(--panel-pad-y) * .85) calc(var(--panel-pad-x) * .85);
}

/* ==========================================================================
   5) TIPOGRAFIA + ANTI-SPEZZATURA (fix robusto)
   ========================================================================== */

h1, h2, h3, .wp-block-heading{
  font-family:'Cinzel', serif;
  color: var(--accent-primary);
  letter-spacing:.06em;
  text-shadow: var(--title-glow);

  /* impedisce “lettere spezzate” */
  word-break: normal;
  overflow-wrap: normal;
  hyphens: manual;
}

h1 a, h2 a, h3 a, .wp-block-heading a{
  color: inherit;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: manual !important;
}

h1{ font-size: clamp(2.4rem, 3vw, 3rem); margin-bottom:.8rem; }
h2{ font-size: clamp(1.9rem, 2.4vw, 2.3rem); margin: 1.8rem 0 .75rem; }
h3{ font-size: clamp(1.4rem, 1.9vw, 1.7rem); margin: 1.2rem 0 .5rem; }

p{
  color: var(--text-main);
  margin-bottom:1rem;
}

/* ==========================================================================
   6) LINKS & BUTTONS
   ========================================================================== */

a{
  color: var(--accent-secondary);
  text-decoration:none;
  transition: color .2s ease, text-shadow .2s ease;
}

a:hover, a:focus{
  color: var(--accent-primary-soft);
  text-shadow: 0 0 8px rgba(135,217,201,.5);
}

.wp-block-button__link,
button,
input[type="submit"]{
  border-radius: var(--panel-radius);
  border: 1px solid var(--accent-primary);
  background: linear-gradient(135deg, #0f3f33, #152d47);
  color:#e9fff9;
  padding:.6rem 1.3rem;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  box-shadow: 0 0 18px rgba(95,200,184,.28);
  transition: background .2s ease, box-shadow .2s ease, transform .1s ease;
}

.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover{
  background: linear-gradient(135deg, #164f41, #243d5b);
  box-shadow: 0 0 22px rgba(95,200,184,.32), 0 0 18px rgba(79,168,255,.22);
  transform: translateY(-1px);
}

/* ==========================================================================
   7) RESPONSIVE — qui sta il grosso miglioramento
   ========================================================================== */

@media (max-width: 900px){
  :root{
    --site-pad-y: 1.5rem;
    --site-pad-x: 1rem;
    --panel-pad-y: 1.35rem;
    --panel-pad-x: 1.15rem;
  }
}

@media (max-width: 600px){
  :root{
    --site-pad-y: 1.35rem;
    --site-pad-x: 1rem;
    --panel-pad-y: 1.1rem;
    --panel-pad-x: 1rem;
  }
}

/* ==========================================================================
   8) SEZIONI / AMBIENTI (come prima, con variabili)
   ========================================================================== */

/* Tutte le pagine figlie di Archivio dei Doni (parent-pageid-376) */
body.parent-pageid-376{
  --panel-bg: rgba(6,14,18,.82);
  --panel-shadow: 0 0 20px rgba(0,0,0,.65);
  --panel-border: 1px solid rgba(79,168,255,.18);
  --accent-primary: #75cfc3;
  --accent-secondary: #62aaff;
  --title-glow:
    0 0 16px rgba(75,190,172,.28),
    0 0 26px rgba(62,168,255,.18);
}

/* Tutte le pagine figlie di Sguardo nell’Abisso (parent-pageid-129) */
body.parent-pageid-129{
  --panel-bg: rgba(8,12,20,.84);
  --panel-shadow: 0 0 24px rgba(0,0,0,.70);
  --panel-border: 1px solid rgba(106,160,255,.12);
  --accent-primary: #71aaff;
  --accent-secondary: #4fb8ff;
  --title-glow:
    0 0 18px rgba(71,168,255,.30),
    0 0 28px rgba(95,220,255,.20);
}

/* Pagine dove vuoi pannelli “trasparenti” */
body.page-slug-il-forziere-del-destino{
  --panel-bg: transparent;
  --panel-shadow: none;
  --panel-border: none;
  --panel-pad-y: 0;
  --panel-pad-x: 0;
}

body.page-slug-il-cammino{
  --panel-bg: transparent;
  --panel-shadow: none;
  --panel-border: none;
}

body.page-slug-oracolo,
body.page-slug-oracolo-step-2,
body.page-slug-oracolo-risposta{
  --panel-bg: transparent;
  --panel-shadow: none;
  --panel-border: none;
}

/* ==========================================================================
   9) MOTION SAFE (utile soprattutto con overlay/effetti stagionali)
   ========================================================================== */

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

@media (max-width: 900px){
  .wp-block-group,
  .wp-block-cover,
  .wp-block-columns{
    backdrop-filter: none !important;
  }

  :root{
    --panel-shadow: 0 0 18px rgba(0,0,0,.55);
  }
}

body{
  font-family: 'Spectral', 'Georgia', serif;
  font-size: 1.05rem;
  line-height: 1.8;
  letter-spacing: 0.015em;
}

/* paragrafi: leggibilità + respiro */
p{
  margin-bottom: 1.1rem;
}

/* enfasi più elegante */
strong{
  font-weight: 600;
}

/* corsivo: molto usato nei testi evocativi */
em{
  font-style: italic;
  opacity: 0.95;
}
@media (max-width: 600px){
  body{
    font-size: 1.1rem;
    line-height: 1.85;
  }
}

/* ==========================================================================
   MYSTIKA — TEMA STAGIONALE SU VARIABILI ESISTENTI
   Da incollare IN FONDO al CSS aggiuntivo del sito
   ========================================================================== */

/* Le classi stagionali arrivano già dal PHP prima del primo paint. */

/* ==========================================================================
   PRIMAVERA — petali, ritorno, germoglio
   ========================================================================== */

body.mystika-season-spring{
  --bg-main:#09070d;
  --bg-gradient-top:#241323;

  --text-main:#fff0f7;
  --text-muted:#d9aebe;

  --accent-primary:#ff9fc8;
  --accent-primary-soft:#ffd4e7;
  --accent-secondary:#9df2b5;
  --accent-gold:#f0c77d;

  --panel-bg:rgba(34,16,32,.92);
  --panel-border:1px solid rgba(255,159,200,.28);
  --panel-shadow:0 0 34px rgba(255,159,200,.13), 0 0 44px rgba(0,0,0,.62);

  --title-glow:
    0 0 10px rgba(255,159,200,.55),
    0 0 24px rgba(255,212,231,.30),
    0 0 34px rgba(157,242,181,.16);
}

/* ==========================================================================
   ESTATE — lucciole, oro, verde vivo
   ========================================================================== */

body.mystika-season-summer{
  --bg-main:#030806;
  --bg-gradient-top:#142015;

  --text-main:#efffed;
  --text-muted:#b5d8aa;

  --accent-primary:#f4d66f;
  --accent-primary-soft:#fff1ad;
  --accent-secondary:#8cff9d;
  --accent-gold:#ffd36e;

  --panel-bg:rgba(13,31,19,.93);
  --panel-border:1px solid rgba(244,214,111,.25);
  --panel-shadow:0 0 34px rgba(244,214,111,.12), 0 0 46px rgba(0,0,0,.65);

  --title-glow:
    0 0 10px rgba(244,214,111,.52),
    0 0 24px rgba(255,241,173,.26),
    0 0 34px rgba(140,255,157,.15);
}

/* ==========================================================================
   AUTUNNO — rame, foglie, brace
   ========================================================================== */

body.mystika-season-autumn{
  --bg-main:#0b0503;
  --bg-gradient-top:#281208;

  --text-main:#fff1df;
  --text-muted:#d6a582;

  --accent-primary:#e5863f;
  --accent-primary-soft:#ffb772;
  --accent-secondary:#c45c33;
  --accent-gold:#e0b066;

  --panel-bg:rgba(34,15,8,.93);
  --panel-border:1px solid rgba(229,134,63,.30);
  --panel-shadow:0 0 34px rgba(229,134,63,.15), 0 0 48px rgba(0,0,0,.68);

  --title-glow:
    0 0 10px rgba(229,134,63,.58),
    0 0 24px rgba(255,183,114,.30),
    0 0 34px rgba(196,92,51,.18);
}

/* ==========================================================================
   INVERNO — gelo, silenzio, bianco/blu
   ========================================================================== */

body.mystika-season-winter{
  --bg-main:#03070d;
  --bg-gradient-top:#0e1a2a;

  --text-main:#eef8ff;
  --text-muted:#a8c7dc;

  --accent-primary:#b9e2ff;
  --accent-primary-soft:#e4f5ff;
  --accent-secondary:#82b8ff;
  --accent-gold:#d8c48a;

  --panel-bg:rgba(8,18,30,.93);
  --panel-border:1px solid rgba(185,226,255,.25);
  --panel-shadow:0 0 34px rgba(185,226,255,.12), 0 0 48px rgba(0,0,0,.66);

  --title-glow:
    0 0 10px rgba(185,226,255,.52),
    0 0 24px rgba(228,245,255,.26),
    0 0 34px rgba(130,184,255,.18);
}

/* ==========================================================================
   EVENTI SPECIALI
   ========================================================================== */

/* ==========================================================================
   NATALE MYSTIKA — rosso brillante + oro festivo
   Atmosfera calda, luminosa, celebrativa
   ========================================================================== */

body.mystika-event-christmas{
  --bg-main:#100304;
  --bg-gradient-top:#3a0808;

  --text-main:#fff4ea;
  --text-muted:#f0c9a4;

  --accent-primary:#ff2f2f;        /* rosso brillante */
  --accent-primary-soft:#ff6b4a;   /* rosso caldo */
  --accent-secondary:#ffd36a;      /* oro luminoso */
  --accent-gold:#ffbf3f;           /* oro pieno */

  --panel-bg:rgba(45,6,8,.94);
  --panel-border:1px solid rgba(255,190,64,.42);

  --panel-shadow:
    0 0 28px rgba(255,47,47,.24),
    0 0 42px rgba(255,191,63,.18),
    0 0 60px rgba(0,0,0,.68);

  --title-glow:
    0 0 10px rgba(255,47,47,.75),
    0 0 22px rgba(255,107,74,.48),
    0 0 38px rgba(255,191,63,.36),
    0 0 58px rgba(255,211,106,.22);
}

/* Sfondo natalizio già compositato: niente velo fixed separato. */
body.mystika-season-ready.mystika-event-christmas{
  background:
    radial-gradient(circle at 22% 18%, rgba(255,47,47,.20), transparent 38%),
    radial-gradient(circle at 82% 18%, rgba(255,211,106,.18), transparent 36%),
    radial-gradient(circle at 50% 84%, rgba(255,107,74,.09), transparent 46%),
    radial-gradient(circle at 18% 8%, rgba(255,47,47,.34), transparent 34%),
    radial-gradient(circle at 78% 12%, rgba(255,191,63,.30), transparent 36%),
    radial-gradient(circle at 50% 100%, rgba(70,8,8,.88), transparent 54%),
    linear-gradient(180deg, #3a0808 0%, #100304 58%, #050203 100%) !important;
}

/* Titoli: rosso con fusione dorata */
body.mystika-event-christmas h1,
body.mystika-event-christmas h2,
body.mystika-event-christmas h3,
body.mystika-event-christmas .wp-block-heading{
  color:#ff4a3d;
  text-shadow:
    0 0 10px rgba(255,47,47,.82),
    0 0 22px rgba(255,107,74,.55),
    0 0 36px rgba(255,191,63,.42),
    0 0 58px rgba(255,211,106,.26);
}

/* Link oro caldo */
body.mystika-event-christmas a{
  color:#ffd36a;
}

body.mystika-event-christmas a:hover,
body.mystika-event-christmas a:focus{
  color:#fff0b8;
  text-shadow:
    0 0 10px rgba(255,211,106,.65),
    0 0 20px rgba(255,47,47,.35);
}

/* Card più festive */
body.mystika-event-christmas .wp-block-group,
body.mystika-event-christmas .wp-block-cover,
body.mystika-event-christmas .wp-block-columns{
  background:
    linear-gradient(
      135deg,
      rgba(65,8,10,.94),
      rgba(32,5,7,.95)
    );
  border:1px solid rgba(255,191,63,.42);
  box-shadow:
    0 0 26px rgba(255,47,47,.22),
    0 0 42px rgba(255,191,63,.16),
    0 0 58px rgba(0,0,0,.70);
}

/* Pulsanti: rosso/oro evidente */
body.mystika-event-christmas .wp-block-button__link,
body.mystika-event-christmas button,
body.mystika-event-christmas input[type="submit"]{
  border-color:#ffd36a !important;
  background:
    linear-gradient(
      135deg,
      #d71920 0%,
      #ff3b30 42%,
      #d99a24 100%
    ) !important;
  color:#fff8e8 !important;
  box-shadow:
    0 0 18px rgba(255,47,47,.42),
    0 0 28px rgba(255,191,63,.30);
}

body.mystika-event-christmas .wp-block-button__link:hover,
body.mystika-event-christmas button:hover,
body.mystika-event-christmas input[type="submit"]:hover{
  background:
    linear-gradient(
      135deg,
      #ff2f2f 0%,
      #ff5a3d 38%,
      #ffd36a 100%
    ) !important;
  box-shadow:
    0 0 24px rgba(255,47,47,.55),
    0 0 36px rgba(255,211,106,.42);
}

/* Ricerca archivio: fusione rosso/oro */
body.mystika-event-christmas .mystika-archive-search,
body.mystika-event-christmas .mystika-search-inner{
  border-color:rgba(255,211,106,.48) !important;
  box-shadow:
    0 0 30px rgba(255,47,47,.26),
    0 0 46px rgba(255,211,106,.18),
    inset 0 0 32px rgba(255,47,47,.08) !important;
}

body.mystika-event-christmas .mystika-search-input{
  border-color:rgba(255,211,106,.55) !important;
}

body.mystika-event-christmas .mystika-search-result{
  border-color:rgba(255,211,106,.34) !important;
  background:
    linear-gradient(
      135deg,
      rgba(75,8,10,.82),
      rgba(32,5,7,.86)
    ) !important;
}
/* Halloween / Ognissanti — velo sottile, viola e rame */
body.mystika-event-halloween{
  --bg-main:#07030b;
  --bg-gradient-top:#1a0a24;

  --text-main:#f3e8ff;
  --text-muted:#c7a4d8;

  --accent-primary:#b978ff;
  --accent-primary-soft:#e2c2ff;
  --accent-secondary:#ff873d;
  --accent-gold:#d99a4e;

  --panel-bg:rgba(20,8,30,.94);
  --panel-border:1px solid rgba(185,120,255,.34);
  --panel-shadow:0 0 38px rgba(185,120,255,.16), 0 0 52px rgba(255,135,61,.08);

  --title-glow:
    0 0 12px rgba(185,120,255,.58),
    0 0 26px rgba(226,194,255,.30),
    0 0 38px rgba(255,135,61,.18);
}

/* Solstizi/equinozi — effetto più sacrale, senza cambiare tutto */
body.mystika-event-spring-equinox,
body.mystika-event-summer-solstice,
body.mystika-event-autumn-equinox,
body.mystika-event-winter-solstice{
  --panel-border:1px solid color-mix(in srgb, var(--accent-primary), transparent 62%);
  --panel-shadow:
    0 0 42px color-mix(in srgb, var(--accent-primary), transparent 84%),
    0 0 58px rgba(0,0,0,.62);
}

/* ==========================================================================
   SFONDO E NEBBIA STAGIONALE
   ========================================================================== */

body.mystika-season-ready{
  /*
   * Nebbia stagionale fusa direttamente nel background.
   * Mantiene l'atmosfera senza un layer fixed + blend a pieno schermo.
   */
  background:
    radial-gradient(circle at 36% 8%, color-mix(in srgb, var(--accent-primary), transparent 89%), transparent 52%),
    radial-gradient(circle at 74% 0%, color-mix(in srgb, var(--accent-secondary), transparent 92%), transparent 48%),
    radial-gradient(circle at top, var(--bg-gradient-top) 0%, var(--bg-main) 58%, #010307 100%) !important;
}

/* ==========================================================================
   APPLICAZIONE VISIBILE A ELEMENTI DEL SITO
   ========================================================================== */

body.mystika-season-ready h1,
body.mystika-season-ready h2,
body.mystika-season-ready h3,
body.mystika-season-ready .wp-block-heading{
  color:var(--accent-primary);
  text-shadow:var(--title-glow);
}

body.mystika-season-ready a{
  color:var(--accent-secondary);
}

body.mystika-season-ready a:hover,
body.mystika-season-ready a:focus{
  color:var(--accent-primary-soft);
  text-shadow:0 0 10px color-mix(in srgb, var(--accent-primary-soft), transparent 45%);
}

body.mystika-season-ready .wp-block-button__link,
body.mystika-season-ready button,
body.mystika-season-ready input[type="submit"]{
  border-color:var(--accent-primary);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--accent-primary), #06100b 78%),
      color-mix(in srgb, var(--accent-secondary), #07101c 82%)
    );
  box-shadow:
    0 0 18px color-mix(in srgb, var(--accent-primary), transparent 72%),
    0 0 18px color-mix(in srgb, var(--accent-secondary), transparent 86%);
}

body.mystika-season-ready .wp-block-button__link:hover,
body.mystika-season-ready button:hover,
body.mystika-season-ready input[type="submit"]:hover{
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--accent-primary), #08150e 68%),
      color-mix(in srgb, var(--accent-secondary), #0a1624 74%)
    );
  box-shadow:
    0 0 24px color-mix(in srgb, var(--accent-primary), transparent 65%),
    0 0 22px color-mix(in srgb, var(--accent-secondary), transparent 80%);
}

/* Card già costruite dal tuo CSS: qui cambiano davvero colore */
body.mystika-season-ready .wp-block-group,
body.mystika-season-ready .wp-block-cover,
body.mystika-season-ready .wp-block-columns{
  background-color:var(--panel-bg);
  border:var(--panel-border);
  box-shadow:var(--panel-shadow);
}

/* Ricerca archivio doni */
body.mystika-season-ready .mystika-archive-search,
body.mystika-season-ready .mystika-search-inner{
  border-color:color-mix(in srgb, var(--accent-primary), transparent 65%) !important;
  box-shadow:
    0 0 30px color-mix(in srgb, var(--accent-primary), transparent 76%),
    inset 0 0 32px color-mix(in srgb, var(--panel-bg), transparent 35%) !important;
}

body.mystika-season-ready .mystika-search-input{
  border-color:color-mix(in srgb, var(--accent-primary), transparent 55%) !important;
}

body.mystika-season-ready .mystika-search-result{
  border-color:color-mix(in srgb, var(--accent-primary), transparent 70%) !important;
}

/* ==========================================================================
   MANTIENE TRASPARENTI LE PAGINE CHE AVEVI GIÀ ESCLUSO
   ========================================================================== */

body.page-slug-il-forziere-del-destino{
  --panel-bg:transparent;
  --panel-shadow:none;
  --panel-border:none;
  --panel-pad-y:0;
  --panel-pad-x:0;
}

body.page-slug-il-cammino{
  --panel-bg:transparent;
  --panel-shadow:none;
  --panel-border:none;
}

body.page-slug-oracolo,
body.page-slug-oracolo-step-2,
body.page-slug-oracolo-risposta{
  --panel-bg:transparent;
  --panel-shadow:none;
  --panel-border:none;
}

/* ==========================================================================
   10) PERFORMANCE MOBILE — FASE 2
   - le stagioni ridefiniscono le ombre sul body, quindi l'override deve stare
     dopo TUTTI i temi/eventi;
   - riduce il costo di paint senza rimuovere l'identità cromatica.
   ========================================================================== */

@media (max-width: 900px){
  body.mystika-season-ready{
    --panel-shadow: 0 0 18px rgba(0,0,0,.58);
    --title-glow:
      0 0 10px color-mix(in srgb, var(--accent-primary), transparent 54%);
  }

  /* Natale usa ombre dirette e non la variabile: alleggerimento esplicito. */
  body.mystika-event-christmas .wp-block-group,
  body.mystika-event-christmas .wp-block-cover,
  body.mystika-event-christmas .wp-block-columns{
    box-shadow:
      0 0 16px rgba(255,47,47,.12),
      0 0 20px rgba(0,0,0,.60);
  }

  body.mystika-event-christmas h1,
  body.mystika-event-christmas h2,
  body.mystika-event-christmas h3,
  body.mystika-event-christmas .wp-block-heading{
    text-shadow:
      0 0 10px rgba(255,47,47,.52),
      0 0 18px rgba(255,191,63,.20);
  }

  body.mystika-event-christmas .mystika-archive-search,
  body.mystika-event-christmas .mystika-search-inner{
    box-shadow:
      0 0 18px rgba(255,47,47,.16),
      inset 0 0 18px rgba(255,47,47,.06) !important;
  }
}

/* ==========================================================================
   MYSTIKA — MOBILE LAYOUT RECOVERY v2.0.3
   Correzione mirata dei wrapper FSE/Gutenberg.
   Non modifica width, flex, stacking o allineamenti.
   ========================================================================== */

@media (max-width: 900px) {

    /*
     * MAIN è un wp-block-group, ma è un WRAPPER strutturale:
     * non deve consumare lo stesso padding di una card.
     */
    main.wp-block-group {
        padding-left: .35rem !important;
        padding-right: .35rem !important;
    }

    /*
     * Il post-content WordPress aveva circa 56px per lato.
     *
     * Le variabili vengono ridefinite LOCALMENTE qui:
     * gli eventuali alignfull interni ereditano gli stessi valori,
     * senza alterare header, footer e resto del sito.
     */
    .wp-block-post-content.has-global-padding {
        --wp--style--root--padding-left: 10px;
        --wp--style--root--padding-right: 10px;

        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /*
     * Soltanto i pannelli realmente ANNIDATI dentro il contenuto
     * smettono di accumulare 1rem circa a ogni livello.
     *
     * Il primo Group resta una vera card con il suo normale padding.
     */
    .wp-block-post-content .wp-block-group .wp-block-group,
    .wp-block-post-content .wp-block-group .wp-block-cover,
    .wp-block-post-content .wp-block-group .wp-block-columns,

    .wp-block-post-content .wp-block-cover .wp-block-group,
    .wp-block-post-content .wp-block-cover .wp-block-cover,
    .wp-block-post-content .wp-block-cover .wp-block-columns,

    .wp-block-post-content .wp-block-columns .wp-block-group,
    .wp-block-post-content .wp-block-columns .wp-block-cover,
    .wp-block-post-content .wp-block-columns .wp-block-columns {
        padding-left: .35rem !important;
        padding-right: .35rem !important;
    }
}


/* Telefoni veri: ancora qualche pixel recuperato, senza estremismi. */

@media (max-width: 600px) {

    .wp-site-blocks {
        padding-left: .5rem;
        padding-right: .5rem;
    }

    main.wp-block-group {
        padding-left: .25rem !important;
        padding-right: .25rem !important;
    }

    .wp-block-post-content.has-global-padding {
        --wp--style--root--padding-left: 8px;
        --wp--style--root--padding-right: 8px;

        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .wp-block-post-content .wp-block-group .wp-block-group,
    .wp-block-post-content .wp-block-group .wp-block-cover,
    .wp-block-post-content .wp-block-group .wp-block-columns,

    .wp-block-post-content .wp-block-cover .wp-block-group,
    .wp-block-post-content .wp-block-cover .wp-block-cover,
    .wp-block-post-content .wp-block-cover .wp-block-columns,

    .wp-block-post-content .wp-block-columns .wp-block-group,
    .wp-block-post-content .wp-block-columns .wp-block-cover,
    .wp-block-post-content .wp-block-columns .wp-block-columns {
        padding-left: .25rem !important;
        padding-right: .25rem !important;
    }
}


/* ==========================================================================
   HEADER / FOOTER — SPAZIATURA
   ========================================================================== */

header .wp-block-navigation__container,
footer .wp-block-navigation__container {
    column-gap: clamp(.9rem, 2.5vw, 1.5rem) !important;
    row-gap: .7rem !important;
}

header .wp-block-navigation__responsive-container-content,
footer .wp-block-navigation__responsive-container-content {
    column-gap: clamp(.9rem, 2.5vw, 1.5rem) !important;
    row-gap: .7rem !important;
}

header .wp-block-group.is-layout-flex,
footer .wp-block-group.is-layout-flex {
    column-gap: clamp(1rem, 3vw, 2rem);
    row-gap: .75rem;
}

/* ==========================================================================
   LE NOVITÀ DI MYSTIKAMENTIS — CARD STAGIONALE DEFINITIVA
   - contenuto centrato
   - simbolo stagionale/evento ripristinato
   - colori derivati automaticamente dal tema corrente
   - nessuna animazione
   - nessun backdrop-filter
   - nessun layer fixed
   ========================================================================== */


/* ==========================================================================
   CARD
   ========================================================================== */

.wp-block-group.mystika-readable:has(#mystika-novita-titolo) {
    position: relative;
    overflow: hidden;

    text-align: center;

    margin-left: auto !important;
    margin-right: auto !important;

    background:
        radial-gradient(
            circle at 15% 15%,
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 87%
            ),
            transparent 35%
        ),
        radial-gradient(
            circle at 85% 85%,
            color-mix(
                in srgb,
                var(--accent-secondary),
                transparent 93%
            ),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            color-mix(
                in srgb,
                var(--panel-bg),
                var(--accent-primary) 4%
            ),
            var(--panel-bg) 58%,
            color-mix(
                in srgb,
                var(--panel-bg),
                #000 7%
            )
        );

    border:
        1px solid
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 48%
        );

    box-shadow:
        0 10px 26px rgba(0,0,0,.36),
        inset 0 0 26px
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 95%
        );
}


/* ==========================================================================
   LINEA LUMINOSA SUPERIORE
   ========================================================================== */

.wp-block-group.mystika-readable:has(#mystika-novita-titolo)::before {
    content: "";

    position: absolute;

    top: 0;
    left: 12%;
    right: 12%;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 30%
            ),
            color-mix(
                in srgb,
                var(--accent-secondary),
                transparent 55%
            ),
            transparent
        );

    pointer-events: none;
}


/* ==========================================================================
   TITOLO
   ========================================================================== */

#mystika-novita-titolo {
    position: relative;

    text-align: center !important;

    margin-left: auto !important;
    margin-right: auto !important;

    text-shadow:
        0 0 8px
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 50%
        ),
        0 0 17px
        color-mix(
            in srgb,
            var(--accent-secondary),
            transparent 80%
        );
}


/* ==========================================================================
   SIMBOLO
   Base: ✦
   Le regole stagionali/evento sottostanti cambiano solo il contenuto.
   ========================================================================== */

#mystika-novita-titolo::before {
    content: "✦";

    display: grid;
    place-items: center;

    width: 2.8rem;
    height: 2.8rem;

    margin:
        0
        auto
        .7rem;

    box-sizing: border-box;

    border-radius: 50%;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 40%
        );

    background:
        radial-gradient(
            circle,
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 82%
            ),
            color-mix(
                in srgb,
                var(--panel-bg),
                transparent 8%
            ) 68%
        );

    color: var(--accent-primary);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.55rem;
    font-weight: 400;
    line-height: 1;

    letter-spacing: 0;

    text-shadow:
        0 0 8px
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 35%
        );

    box-shadow:
        0 0 12px
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 83%
        ),
        inset 0 0 12px
        color-mix(
            in srgb,
            var(--accent-primary),
            transparent 90%
        );
}


/* ==========================================================================
   SIMBOLI DELLE QUATTRO STAGIONI
   ========================================================================== */

body.mystika-season-spring
#mystika-novita-titolo::before {
    content: "✿";
}

body.mystika-season-summer
#mystika-novita-titolo::before {
    content: "☀";
}

body.mystika-season-autumn
#mystika-novita-titolo::before {
    content: "❧";
}

body.mystika-season-winter
#mystika-novita-titolo::before {
    content: "❄";
}


/* ==========================================================================
   EVENTI SPECIALI
   Sono dichiarati DOPO le stagioni, quindi hanno precedenza.
   ========================================================================== */

body.mystika-event-christmas
#mystika-novita-titolo::before {
    content: "★";

    color: var(--accent-gold);

    border-color:
        color-mix(
            in srgb,
            var(--accent-gold),
            transparent 32%
        );

    text-shadow:
        0 0 9px
        color-mix(
            in srgb,
            var(--accent-gold),
            transparent 28%
        );
}

body.mystika-event-halloween
#mystika-novita-titolo::before {
    content: "☾";
}

body.mystika-event-spring-equinox
#mystika-novita-titolo::before {
    content: "❀";
}

body.mystika-event-summer-solstice
#mystika-novita-titolo::before {
    content: "☼";
}

body.mystika-event-autumn-equinox
#mystika-novita-titolo::before {
    content: "❦";
}

body.mystika-event-winter-solstice
#mystika-novita-titolo::before {
    content: "✧";
}


/* ==========================================================================
   TESTO
   ========================================================================== */

.wp-block-group.mystika-readable:has(#mystika-novita-titolo) p {
    text-align: center;

    color:
        color-mix(
            in srgb,
            var(--text-main),
            white 5%
        );
}


/* ==========================================================================
   PULSANTE / LINK
   ========================================================================== */

.wp-block-group.mystika-readable:has(#mystika-novita-titolo)
.wp-block-buttons {
    justify-content: center !important;
}

.wp-block-group.mystika-readable:has(#mystika-novita-titolo)
.wp-block-button {
    margin-left: auto;
    margin-right: auto;
}

.wp-block-group.mystika-readable:has(#mystika-novita-titolo) a {
    font-weight: 600;
}


/* ==========================================================================
   DESKTOP
   ========================================================================== */

@media (min-width: 901px) {

    .wp-block-group.mystika-readable:has(#mystika-novita-titolo) {
        box-shadow:
            0 14px 32px rgba(0,0,0,.40),
            0 0 20px
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 91%
            ),
            inset 0 0 30px
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 94%
            );
    }

    #mystika-novita-titolo::before {
        width: 3rem;
        height: 3rem;

        font-size: 1.7rem;
    }
}


/* ==========================================================================
   MOBILE
   Mantiene simbolo e atmosfera ma usa ombre più economiche.
   ========================================================================== */

@media (max-width: 900px) {

    .wp-block-group.mystika-readable:has(#mystika-novita-titolo) {
        box-shadow:
            0 6px 15px rgba(0,0,0,.32),
            inset 0 0 18px
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 96%
            );
    }

    #mystika-novita-titolo {
        text-shadow:
            0 0 7px
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 57%
            );
    }

    #mystika-novita-titolo::before {
        width: 2.65rem;
        height: 2.65rem;

        font-size: 1.45rem;

        box-shadow:
            inset 0 0 10px
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 91%
            );
    }
}

/* ==========================================================================
   PROFILE BUILDER — FIX CONTRASTO DEFINITIVO
   Login / Registrazione / Modifica account / Password / Cancellazione
   Non modifica layout, dimensioni o comportamento dei form.
   ========================================================================== */


/* ----------------------------------------------------------
   LABEL E TESTI NATIVI PROFILE BUILDER
   ---------------------------------------------------------- */

#wppb-edit-user label,
#wppb-register-user label,
#wppb-login-wrap label,
.wppb-user-forms label,
.wppb-user-forms .wppb-form-field > label,
.wppb-user-forms legend,
.wppb-user-forms .wppb-field-label,
.wppb-user-forms li > label {
    color: var(--text-main) !important;
}


/* ----------------------------------------------------------
   TESTI / TITOLI INTERNI CHE IL PLUGIN PUÒ IMPOSTARE SCURI
   ---------------------------------------------------------- */

#wppb-edit-user h1,
#wppb-edit-user h2,
#wppb-edit-user h3,
#wppb-edit-user h4,
#wppb-register-user h1,
#wppb-register-user h2,
#wppb-register-user h3,
#wppb-register-user h4,
.wppb-user-forms h1,
.wppb-user-forms h2,
.wppb-user-forms h3,
.wppb-user-forms h4 {
    color: var(--accent-primary) !important;
}


/* ----------------------------------------------------------
   DESCRIZIONI E NOTE
   ---------------------------------------------------------- */

#wppb-edit-user .description,
#wppb-register-user .description,
.wppb-user-forms .description,
.wppb-user-forms .wppb-description-delimiter,
.wppb-user-forms small {
    color: var(--text-muted) !important;
}


/* ----------------------------------------------------------
   TESTO DEGLI INPUT
   I campi bianchi devono mantenere caratteri scuri.
   ---------------------------------------------------------- */

#wppb-edit-user input[type="text"],
#wppb-edit-user input[type="email"],
#wppb-edit-user input[type="password"],
#wppb-register-user input[type="text"],
#wppb-register-user input[type="email"],
#wppb-register-user input[type="password"],
.wppb-user-forms input[type="text"],
.wppb-user-forms input[type="email"],
.wppb-user-forms input[type="password"],
.wppb-user-forms input[type="url"],
.wppb-user-forms input[type="tel"],
.wppb-user-forms input[type="number"],
.wppb-user-forms textarea,
.wppb-user-forms select {
    color: #17201c !important;
}


/* Placeholder */
.wppb-user-forms input::placeholder,
.wppb-user-forms textarea::placeholder {
    color: #65706a !important;
    opacity: 1 !important;
}


/* ----------------------------------------------------------
   LINK
   ---------------------------------------------------------- */

#wppb-edit-user a,
#wppb-register-user a,
#wppb-login-wrap a,
.wppb-user-forms a {
    color: var(--accent-secondary) !important;
}

#wppb-edit-user a:hover,
#wppb-register-user a:hover,
#wppb-login-wrap a:hover,
.wppb-user-forms a:hover {
    color: var(--accent-primary-soft) !important;
}

/* ==========================================================================
   MYSTIKA — PRESET PAGINA TESTUALE
   Uso:
   aggiungere "mystika-prose-page" al Group principale della pagina.
   ========================================================================== */

.mystika-prose-page {
    --mystika-prose-paragraph-gap: 1.15rem;
    --mystika-prose-h1-bottom: 1.4rem;
    --mystika-prose-h2-top: 2.5rem;
    --mystika-prose-h2-bottom: .9rem;
    --mystika-prose-h3-top: 1.9rem;
    --mystika-prose-h3-bottom: .7rem;
}


/* Titolo principale */
.mystika-prose-page h1 {
    margin-top: 0;
    margin-bottom: var(--mystika-prose-h1-bottom);
}


/* Titoli di sezione */
.mystika-prose-page h2 {
    margin-top: var(--mystika-prose-h2-top);
    margin-bottom: var(--mystika-prose-h2-bottom);
}


/* Sottosezioni */
.mystika-prose-page h3 {
    margin-top: var(--mystika-prose-h3-top);
    margin-bottom: var(--mystika-prose-h3-bottom);
}


/* Testo */
.mystika-prose-page p {
    margin-top: 0;
    margin-bottom: var(--mystika-prose-paragraph-gap);
}


/* Liste */
.mystika-prose-page ul,
.mystika-prose-page ol {
    margin-top: .6rem;
    margin-bottom: 1.35rem;
}


/* Evita uno spazio inutile alla fine della pagina */
.mystika-prose-page > :last-child {
    margin-bottom: 0;
}


/* Mobile: proporzioni leggermente più compatte */
@media (max-width: 600px) {

    .mystika-prose-page {
        --mystika-prose-paragraph-gap: 1.05rem;
        --mystika-prose-h1-bottom: 1.25rem;
        --mystika-prose-h2-top: 2.1rem;
        --mystika-prose-h2-bottom: .8rem;
        --mystika-prose-h3-top: 1.65rem;
        --mystika-prose-h3-bottom: .65rem;
    }
}

/* ==========================================================================
   MYSTIKA — HEADER MOBILE v1
   Architettura separata desktop / mobile
   ========================================================================== */


/* ----------------------------------------------------------
   DESKTOP
   L'header mobile non esiste visivamente.
   ---------------------------------------------------------- */

.mystika-header-mobile {
    display: none !important;
}


/* ----------------------------------------------------------
   TELEFONO
   ---------------------------------------------------------- */

@media (max-width: 782px) {

    /* Vecchio header completamente escluso */
    .mystika-header-desktop {
        display: none !important;
    }


    /* Nuovo header mobile */
    .mystika-header-mobile {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box;

        margin: 0 !important;
        padding: .38rem .5rem !important;

        background:
            color-mix(
                in srgb,
                var(--panel-bg),
                #020805 12%
            ) !important;

        border: 0 !important;
        border-bottom:
            1px solid
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 72%
            ) !important;

        border-radius: 0 !important;

        box-shadow:
            0 4px 12px rgba(0,0,0,.28) !important;
    }


    /* ------------------------------------------------------
       Neutralizza il sistema automatico delle card
       SOLO dentro il nuovo header.
       ------------------------------------------------------ */

    .mystika-header-mobile .wp-block-group {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ------------------------------------------------------
       Riga principale
       ------------------------------------------------------ */

    .mystika-header-mobile-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;

        align-items: center !important;

        width: 100% !important;
        max-width: 100% !important;

        min-height: 46px;

        gap: .42rem !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ------------------------------------------------------
       Logo
       ------------------------------------------------------ */

    .mystika-header-mobile-row .wp-block-site-logo {
        flex: 0 0 40px !important;

        width: 40px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .mystika-header-mobile-row .wp-block-site-logo img {
        display: block;

        width: 40px !important;
        height: 40px !important;

        max-width: 40px !important;
        max-height: 40px !important;

        object-fit: cover;

        border-radius: 50%;
    }


    /* ------------------------------------------------------
       Titolo sito
       È l'elemento che assorbe la variazione di larghezza.
       ------------------------------------------------------ */

    .mystika-header-mobile-row .wp-block-site-title {
        flex: 1 1 auto !important;

        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        font-size: clamp(.9rem, 4vw, 1.08rem) !important;
        line-height: 1 !important;
        letter-spacing: .015em !important;

        white-space: nowrap;

        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mystika-header-mobile-row .wp-block-site-title a {
        color: var(--accent-primary) !important;

        text-shadow:
            0 0 7px
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 60%
            );
    }


    /* ------------------------------------------------------
       Navigazione / hamburger
       Gutenberg controlla apertura e chiusura.
       ------------------------------------------------------ */

    .mystika-header-mobile-row .wp-block-navigation {
        flex: 0 0 auto !important;

        min-width: 36px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .mystika-header-mobile-row
    .wp-block-navigation__responsive-container-open {
        align-items: center;
        justify-content: center;

        width: 36px !important;
        height: 36px !important;

        min-width: 36px !important;

        margin: 0 !important;
        padding: 0 !important;

        border:
            1px solid
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 58%
            ) !important;

        border-radius: 50% !important;

        background:
            color-mix(
                in srgb,
                var(--panel-bg),
                transparent 8%
            ) !important;

        color: var(--accent-primary-soft) !important;

        box-shadow: none !important;
    }


    /* ------------------------------------------------------
       Account
       ------------------------------------------------------ */

    .mystika-header-mobile-row .wp-block-shortcode {
        flex: 0 0 auto !important;

        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        white-space: nowrap;
    }

    .mystika-header-mobile-row .wp-block-shortcode a {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        min-height: 34px;

        box-sizing: border-box;

        padding: .32rem .44rem;

        border:
            1px solid
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 62%
            );

        border-radius: 999px;

        background:
            color-mix(
                in srgb,
                var(--panel-bg),
                transparent 8%
            );

        color: var(--accent-primary-soft) !important;

        font-size: .74rem;
        line-height: 1;

        text-shadow: none !important;
    }


    /* ------------------------------------------------------
       Sicurezza geometrica
       ------------------------------------------------------ */

    .mystika-header-mobile,
    .mystika-header-mobile * {
        box-sizing: border-box;
    }
}

/* ==========================================================================
   MYSTIKA — FOOTER RESPONSIVE
   Desktop e mobile separati
   ========================================================================== */


/* ==========================================================
   DESKTOP
   ========================================================== */

/* Il footer mobile non viene mostrato su desktop */
.mystika-footer-mobile {
    display: none !important;
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 782px) {

    /* Nasconde completamente il vecchio footer scenografico */
    .mystika-footer-desktop {
        display: none !important;
    }


    /* Mostra soltanto il footer costruito per telefono */
    .mystika-footer-mobile {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box;

        gap: .75rem !important;

        margin: 0 !important;
        padding: 1rem .7rem !important;

        background:
            color-mix(
                in srgb,
                var(--panel-bg),
                #020805 14%
            ) !important;

        border: 0 !important;
        border-top:
            1px solid
            color-mix(
                in srgb,
                var(--accent-primary),
                transparent 76%
            ) !important;

        border-radius: 0 !important;

        box-shadow: none !important;
    }


    /* ======================================================
       Neutralizza il sistema automatico delle card
       dentro il footer mobile
       ====================================================== */

    .mystika-footer-mobile .wp-block-group,
    .mystika-footer-mobile .wp-block-columns,
    .mystika-footer-mobile .wp-block-navigation {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ======================================================
       Riga interna
       ====================================================== */

    .mystika-footer-mobile .wp-block-group.is-layout-flex {
        display: flex !important;

        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        gap: .7rem !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ======================================================
       MENU LEGALE
       Non hamburger: tre collegamenti compatti
       ====================================================== */

    .mystika-footer-mobile
    .wp-block-navigation__responsive-container,
    .mystika-footer-mobile
    .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: block !important;

        position: static !important;

        width: 100% !important;

        background: transparent !important;

        padding: 0 !important;
    }

    /* Nel footer non serve il pulsante hamburger */
    .mystika-footer-mobile
    .wp-block-navigation__responsive-container-open,
    .mystika-footer-mobile
    .wp-block-navigation__responsive-container-close {
        display: none !important;
    }

    .mystika-footer-mobile
    .wp-block-navigation__responsive-container-content {
        display: block !important;

        width: 100% !important;

        padding: 0 !important;
    }

    .mystika-footer-mobile
    .wp-block-navigation__container {
        display: flex !important;

        flex-direction: row !important;
        flex-wrap: wrap !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        column-gap: .9rem !important;
        row-gap: .4rem !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .mystika-footer-mobile
    .wp-block-navigation-item {
        width: auto !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .mystika-footer-mobile
    .wp-block-navigation-item__content {
        padding: .15rem 0 !important;

        color: var(--text-muted) !important;

        font-size: .82rem !important;
        line-height: 1.25 !important;

        white-space: nowrap;
    }


    /* ======================================================
       SOCIAL
       ====================================================== */

    .mystika-footer-mobile .wp-block-social-links {
        display: flex !important;

        justify-content: center !important;
        align-items: center !important;

        gap: .8rem !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .mystika-footer-mobile .wp-social-link {
        margin: 0 !important;
    }


    /* ======================================================
       COPYRIGHT
       ====================================================== */

    .mystika-footer-mobile > p,
    .mystika-footer-mobile .wp-block-paragraph {
        margin: 0 !important;

        color: var(--text-muted) !important;

        font-size: .78rem !important;
        line-height: 1.3 !important;

        text-align: center !important;
    }


    /* Sicurezza geometrica */
    .mystika-footer-mobile,
    .mystika-footer-mobile * {
        box-sizing: border-box;
    }
}