/* =====================================================================
   CardExpo — "Premium Collection" design system (TUTTO IL SITO)
   Mood: una teca di carte, di notte, sotto luce da galleria. Pochi elementi,
   ognuno curato. La luce è l'unica decorazione. Le carte vere sono le eroine.
   Foundation + componenti riutilizzabili scoped .xc-page (tutte le pagine); le
   sezioni specifiche (hero, padroni, mondi) usano classi proprie e compaiono solo
   dove il markup le include. Stili per-pagina: assets/css/pages/<slug>.css.
   Convive con tokens/base/components/pages.css (caricato DOPO pages.css).
   ===================================================================== */

/* ---- Token aggiuntivi (additivi, non sovrascrivono i globali) ---- */
:root {
  --xc-prem-bg:      #0a0710;   /* nero teca, più profondo del bg globale  */
  --xc-prem-bg-2:    #110b1a;
  --xc-prem-panel:   #160f22;
  --xc-prem-line:    rgba(255, 244, 230, .08);
  --xc-prem-line-2:  rgba(255, 244, 230, .14);
  --xc-prem-ink:     #f4eefb;
  --xc-prem-dim:     #a99fbd;
  --xc-prem-dim-2:   #7d7390;
  --xc-prem-orange:  #fff704;
  --xc-prem-orange-h:#e8dd00;
  --xc-prem-violet:  #9a6bff;
  --xc-prem-cream:   #fff4e6;
  --xc-font-prem: "Cabinet Grotesk", "Bricolage Grotesque", system-ui, sans-serif;
  --xc-prem-wide: 1280px;
  --xc-ease: cubic-bezier(.22, 1, .36, 1);
}

/* ---------- Base della pagina home ---------- */
.xc-page {
  background: var(--xc-prem-bg);
  color: var(--xc-prem-ink);
  font-family: var(--xc-font-body);
  /* trama finissima (grana) per togliere la piattezza digitale, senza pattern visibile */
  background-image:
    radial-gradient(120% 80% at 50% -10%, rgba(76, 37, 150, .28) 0%, transparent 55%),
    radial-gradient(90% 60% at 110% 8%, rgba(255, 247, 4, .10) 0%, transparent 50%);
  background-attachment: fixed;
}
.xc-page #main { overflow: clip; }

.xc-page .xc-prem {
  /* stessa max-larghezza e padding dell'header (.xc-container): tutti i
     container del sito allineati alla stessa griglia. */
  width: 100%;
  max-width: var(--xc-container);
  margin-inline: auto;
  padding-inline: var(--xc-s3);
}

/* grana sottile su tutta la home */
.xc-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .5;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
}
.xc-page > * { position: relative; z-index: 1; }

/* ---------- Tipografia home ---------- */
.xc-page h1,
.xc-page h2,
.xc-page h3 {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.02;
  text-transform: none;
}
/* annulla i tilt "fumetto" globali sulla home */
.xc-page .xc-tilt { transform: none !important; }

.xc-page .xc-prem-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .6em;
  font-family: var(--xc-font-body);
  font-weight: 600;
  font-size: .72rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--xc-prem-dim);
  margin: 0;
}
.xc-page .xc-prem-eyebrow::before {
  content: "";
  width: 26px;
  height: 1px;
  background: linear-gradient(90deg, var(--xc-prem-orange), transparent);
}

.xc-page .xc-prem-h2 {
  font-size: clamp(2rem, 4.6vw, 3.4rem);
  margin: .5rem 0 0;
  max-width: 18ch;
}
.xc-page .xc-prem-lede {
  font-size: clamp(1rem, 1.4vw, 1.18rem);
  line-height: 1.6;
  color: var(--xc-prem-dim);
  max-width: 52ch;
  margin-top: 1.1rem;
}

/* ---------- Sezioni / ritmo ---------- */
.xc-page .xc-prem-section {
  padding-block: clamp(4.5rem, 9vw, 8rem);
  position: relative;
}
.xc-page .xc-prem-section + .xc-prem-section {
  border-top: 1px solid var(--xc-prem-line);
}
.xc-page .xc-prem-head { max-width: 56ch; }
.xc-page .xc-prem-head--center { max-width: 760px; margin-inline: auto; text-align: center; }
.xc-page .xc-prem-head--center .xc-prem-h2 { margin-inline: auto; }

/* ============================================================
   LUCE D'AMBIENTE — ritmo chiaro/scuro; il viola torna a intervalli.
   Non su tutte le sezioni: alcune restano scure per contrasto.
   Aloni radiali che sfumano nel nulla → nessuna banda netta.
   ============================================================ */

/* Padroni di casa: viola tenue dietro Gom Gom, caldo appena dietro Federic */
.xc-page .xc-pguests {
  background-image:
    radial-gradient(56% 60% at 68% 38%, rgba(154,107,255,.13) 0%, transparent 58%),
    radial-gradient(52% 56% at 30% 36%, rgba(255, 247, 4,.06) 0%, transparent 58%);
}

/* I mondi in fiera: la sezione più illuminata, luce viola "da galleria" */
.xc-page .xc-pflo {
  background-image:
    radial-gradient(78% 92% at 50% -6%, rgba(154,107,255,.18) 0%, transparent 60%),
    radial-gradient(60% 70% at 50% 116%, rgba(255,244,230,.05) 0%, transparent 62%);
}
/* le celle raccolgono un filo di viola nella sezione illuminata */
.xc-page .xc-pflo .xc-flogos__item {
  background:
    linear-gradient(180deg, rgba(154,107,255,.05), transparent 70%),
    var(--xc-prem-bg-2);
  border-color: rgba(154,107,255,.14);
}
.xc-page .xc-pflo .xc-flogos__item:hover {
  border-color: rgba(154,107,255,.34);
  box-shadow: 0 24px 44px -28px rgba(154,107,255,.45);
}

/* ============================================================
   MAIN SPONSOR — fascia dedicata allo sponsor principale.
   Eyebrow "Main Sponsor" + logo grande, centrati. Sta tra "I volti
   di CardExpo" e "I mondi in fiera". Glow NEUTRO (no viola) per non
   litigare con i colori del logo eBay.
   ============================================================ */
.xc-page .xc-msponsor {
  padding-block: clamp(3.4rem, 6vw, 5.4rem);
  text-align: center;
  background-image:
    radial-gradient(46% 78% at 50% 50%, rgba(255, 255, 255, .05) 0%, transparent 62%);
}
.xc-page .xc-msponsor__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.7rem;
}
/* eyebrow centrato: due filetti accento (sinistra + destra) intorno al testo */
.xc-page .xc-msponsor__eyebrow::before {
  background: linear-gradient(90deg, transparent, var(--xc-prem-orange));
}
.xc-page .xc-msponsor__eyebrow::after {
  content: "";
  width: 26px;
  height: 1px;
  background: linear-gradient(90deg, var(--xc-prem-orange), transparent);
}
.xc-page .xc-msponsor__logo {
  display: inline-flex;
  transition: transform .35s var(--xc-ease), filter .35s var(--xc-ease);
}
.xc-page .xc-msponsor__logo img {
  display: block;
  width: clamp(160px, 20vw, 240px);
  height: auto;
}
a.xc-msponsor__logo:hover {
  transform: translateY(-2px);
  filter: drop-shadow(0 14px 30px rgba(0, 0, 0, .5));
}

/* Programma: velo viola appena percettibile, spezza il tratto scuro centrale */
.xc-page .xc-pprog {
  background-image:
    radial-gradient(70% 80% at 22% 42%, rgba(154,107,255,.09) 0%, transparent 60%);
}

/* Biglietti: respiro viola dall'alto — il viola = fascia premium */
.xc-page .xc-ptix-sec {
  background-image:
    radial-gradient(64% 56% at 50% -4%, rgba(154,107,255,.14) 0%, transparent 56%);
}

/* ================= CTA (no pill, no yellow) ================= */
.xc-page .xc-prem-btn {
  --b-bg: var(--xc-prem-orange);
  --b-fg: #1a0f04;
  display: inline-flex;
  align-items: center;
  gap: .6em;
  padding: .92em 1.5em;
  border-radius: 4px;
  border: 1px solid transparent;
  background: var(--b-bg);
  color: var(--b-fg);
  font-family: var(--xc-font-body);
  font-weight: 600;
  font-size: .98rem;
  letter-spacing: .01em;
  text-decoration: none;
  cursor: pointer;
  transition: transform .35s var(--xc-ease), box-shadow .35s var(--xc-ease), background .25s, border-color .25s;
  box-shadow: 0 12px 30px -14px rgba(255, 247, 4, .7);
}
.xc-page .xc-prem-btn:hover {
  transform: translateY(-2px);
  background: var(--xc-prem-orange-h);
  box-shadow: 0 18px 40px -16px rgba(255, 247, 4, .85);
}
.xc-page .xc-prem-btn .xc-prem-btn__arrow { transition: transform .35s var(--xc-ease); }
.xc-page .xc-prem-btn:hover .xc-prem-btn__arrow { transform: translateX(3px); }
.xc-page .xc-prem-btn--ghost {
  --b-bg: transparent;
  --b-fg: var(--xc-prem-ink);
  border-color: var(--xc-prem-line-2);
  box-shadow: none;
}
.xc-page .xc-prem-btn--ghost:hover {
  background: rgba(255, 244, 230, .05);
  border-color: rgba(255, 244, 230, .3);
  box-shadow: none;
}
/* Variante SECONDARIA — "Diventa espositore": bg bianco, testo nero. */
.xc-page .xc-prem-btn--violet {
  --b-bg: #ffffff;
  --b-fg: #0a0710;
  border-color: transparent;
  box-shadow: 0 12px 30px -14px rgba(0, 0, 0, .55);
}
.xc-page .xc-prem-btn--violet:hover {
  background: #ffffff;
  box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .7);
}
.xc-page .xc-prem-btn:focus-visible,
.xc-page a:focus-visible,
.xc-page button:focus-visible,
.xc-page summary:focus-visible {
  outline: 2px solid var(--xc-prem-orange);
  outline-offset: 3px;
  border-radius: 4px;
}
.xc-page .xc-prem-textlink {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  color: var(--xc-prem-ink);
  text-decoration: none;
  font-weight: 600;
  border-bottom: 1px solid var(--xc-prem-line-2);
  padding-bottom: 2px;
  transition: border-color .25s, color .25s;
}
.xc-page .xc-prem-textlink:hover { border-color: var(--xc-prem-orange); color: var(--xc-prem-orange-h); }

/* ============================================================
   CARTA REALE — il componente cardine (xc_real_card)
   ============================================================ */
.xc-rcard {
  position: relative;
  display: block;
  perspective: 1400px;
  --mx: 50%;
  --my: 50%;
  --rx: 0deg;
  --ry: 0deg;
  --lift: 0;
}
.xc-rcard__halo {
  position: absolute;
  inset: -22% -16% -28%;
  border-radius: 50%;
  background: radial-gradient(closest-side,
      color-mix(in srgb, var(--rcard-accent) 55%, transparent) 0%,
      color-mix(in srgb, var(--rcard-accent) 20%, transparent) 42%,
      transparent 72%);
  filter: blur(34px);
  opacity: .55;
  z-index: 0;
  transition: opacity .5s var(--xc-ease);
  pointer-events: none;
}
.xc-rcard__stage {
  position: relative;
  z-index: 1;
  aspect-ratio: var(--rcard-ratio, 63 / 88);
  transform-style: preserve-3d;
  transform: rotateX(var(--rx)) rotateY(var(--ry)) translateZ(0);
  transition: transform .5s var(--xc-ease);
  will-change: transform;
}
.xc-rcard__plate {
  position: absolute;
  inset: 0;
  border-radius: clamp(10px, 3.5%, 22px);
  overflow: hidden;
  transform-style: preserve-3d;
  /* spessore + ombra proiettata morbida (rilievo reale) */
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .14),
    0 2px 1px rgba(0, 0, 0, .5),
    0 26px 40px -18px rgba(0, 0, 0, .85),
    0 50px 80px -30px rgba(0, 0, 0, .7);
  background: #0c0813;
  /* bordo finissimo che fa "carta" */
  outline: 1px solid rgba(255, 255, 255, .06);
  outline-offset: -1px;
}
.xc-rcard__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;        /* MAI croppare la carta */
  object-position: center;
  background: #08060d;
  border-radius: inherit;
  backface-visibility: hidden;
}
/* glare: lampo morbido che segue il puntatore */
.xc-rcard__glare {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(60% 55% at var(--mx) var(--my),
      rgba(255, 255, 255, .42) 0%,
      rgba(255, 255, 255, .12) 28%,
      transparent 62%);
  mix-blend-mode: screen;
  opacity: 0;
  transition: opacity .4s var(--xc-ease);
  z-index: 3;
}
/* foil olografico: scorre sotto la superficie */
.xc-rcard__foil {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  mix-blend-mode: color-dodge;
  background:
    linear-gradient(115deg,
      transparent 18%,
      rgba(255, 138, 216, .5) 32%,
      rgba(125, 243, 255, .5) 45%,
      rgba(255, 214, 107, .5) 58%,
      rgba(177, 139, 255, .5) 70%,
      transparent 84%);
  background-size: 220% 220%;
  background-position: calc(var(--mx) * 1.4) calc(var(--my) * 1.4);
  transition: opacity .45s var(--xc-ease);
}
/* riflesso speculare in basso (la carta "poggia" su una superficie) */
.xc-rcard::after {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -4%;
  height: 16%;
  background: radial-gradient(60% 100% at 50% 0%, rgba(0, 0, 0, .55), transparent 75%);
  filter: blur(8px);
  z-index: 0;
}

/* stato attivo (hover/tilt) */
.xc-rcard.is-live .xc-rcard__glare,
.xc-rcard.is-live .xc-rcard__foil { opacity: 1; }
.xc-rcard.is-live .xc-rcard__halo { opacity: .85; }

/* slot vuoto (Calcio & Sport) */
.xc-rcard--empty .xc-rcard__plate--empty {
  display: grid;
  place-content: center;
  text-align: center;
  gap: .7rem;
  padding: 1.6rem;
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .015) 0 12px, transparent 12px 24px),
    var(--xc-prem-panel);
  border: 1.5px dashed color-mix(in srgb, var(--rcard-accent) 55%, var(--xc-prem-line-2));
  box-shadow: inset 0 0 60px -20px color-mix(in srgb, var(--rcard-accent) 60%, transparent);
}
.xc-rcard--empty .xc-rcard__halo { opacity: .3; }
.xc-rcard__slotmark {
  width: 46px; height: 46px;
  margin: 0 auto;
  border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--rcard-accent) 70%, transparent);
  position: relative;
}
.xc-rcard__slotmark::before,
.xc-rcard__slotmark::after {
  content: ""; position: absolute; inset: 0; margin: auto;
  background: color-mix(in srgb, var(--rcard-accent) 80%, transparent);
}
.xc-rcard__slotmark::before { width: 18px; height: 1.5px; }
.xc-rcard__slotmark::after  { width: 1.5px; height: 18px; }
.xc-rcard__slotlabel {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--xc-prem-ink);
  letter-spacing: -.01em;
}
.xc-rcard__slotline {
  font-size: .82rem;
  color: var(--xc-prem-dim);
  line-height: 1.45;
  max-width: 22ch;
  margin-inline: auto;
}

/* ============================================================
   HERO — MANIFESTO CENTRATO + MURO DI CARTE (poster)
   L'ingresso a una fiera: un muro di carte UNICHE a tutta larghezza sul
   fondo, un manifesto CENTRATO davanti con data, luogo e scala. I Pokémon
   iconici (feature) sono nitidi, grandi e tirati avanti, ai LATI del testo.
   ============================================================ */
.xc-page .xc-phero {
  position: relative;
  min-height: clamp(30rem, 74vh, 44rem);
  display: flex;
  align-items: center;
  text-align: center;
  padding-top: clamp(3.6rem, 6vw, 5.5rem);
  padding-bottom: clamp(3.4rem, 5.5vw, 5rem);
  overflow: clip;
  isolation: isolate;
}

/* ---- Muro di carte (backdrop a tutta larghezza) ---- */
.xc-phero__wall {
  position: absolute;
  inset: -8% -6% -10%;
  z-index: -2;
  /* prospettiva: il muro si inclina e fugge verso l'alto come un pavimento fiera */
  perspective: 1600px;
  perspective-origin: 50% 30%;
  pointer-events: none;
}
.xc-phero__wallgrid {
  position: absolute;
  inset: -16% -14% -18% -14%;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-auto-rows: minmax(0, auto);
  gap: clamp(.5rem, 1vw, 1rem);
  /* carte oblique/trasversali: il muro si inclina in diagonale come un pavimento fiera */
  transform: rotateX(20deg) rotateZ(-6deg) scale(1.24);
  transform-origin: 50% 40%;
}
.xc-phero__tile {
  aspect-ratio: 63 / 88;
  border-radius: 9px;
  background-size: cover;
  background-position: center 20%;
  box-shadow: 0 14px 28px -14px rgba(0,0,0,.9), inset 0 0 0 1px rgba(255,255,255,.05);
  /* tessere uniformi ma più leggibili: si devono intravedere le carte vere */
  filter: brightness(.62) saturate(.9) contrast(1.02);
  opacity: 1;
}
/* solo un micro-sfalsamento di profondità: stessa luminosità per tutte */
.xc-phero__tile--0 { transform: translateY(-3%); }
.xc-phero__tile--1 { transform: translateY(2%); }
.xc-phero__tile--2 { transform: translateY(-1%); }
.xc-phero__tile--3 { transform: translateY(3%); }

/* (nessuna carta in evidenza: muro uniforme) */

/* niente faro su singole carte: appena un alito di calore al centro */
.xc-phero__spot {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(60% 60% at 50% 44%, rgba(255, 214, 170, .06) 0%, transparent 72%);
  mix-blend-mode: screen;
}
/* scrim: velo scuro più marcato (overlay aumentato) per far risaltare il testo
   centrato e abbassare l'insieme; il muro resta una texture di fondo. */
.xc-phero__scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(62% 70% at 50% 50%, rgba(8,6,13,.8) 0%, rgba(8,6,13,.6) 40%, rgba(8,6,13,.34) 66%, rgba(8,6,13,.14) 88%),
    linear-gradient(0deg, var(--xc-prem-bg) 1%, rgba(10,7,16,.42) 22%, rgba(10,7,16,.22) 50%, rgba(10,7,16,.42) 82%, var(--xc-prem-bg) 100%),
    rgba(8,6,13,.16);
    opacity: 0.6;
}

.xc-phero__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--xc-container);
  margin-inline: auto;
  padding-inline: var(--xc-s3);
}
.xc-phero__poster {
  max-width: 46rem;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.xc-phero__eyebrow { margin-bottom: 1.3rem; }
.xc-phero__eyebrow::before { display: none; } /* niente trattino off-center sul layout centrato */

.xc-phero__title {
  font-size: clamp(2.9rem, 7.4vw, 6rem);
  font-weight: 800!important;
  margin: 15px 0 0;
  letter-spacing: -.035em;
  line-height: .94;
  line-height: 0.8!important;
  text-wrap: balance;
}
.xc-phero__accent {
  background: linear-gradient(100deg, var(--xc-prem-orange) 0%, var(--xc-prem-orange) 52%, var(--xc-prem-orange) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.xc-phero__tagline {
  margin-top: 1.4rem;
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  line-height: 1.6;
  color: var(--xc-prem-ink);
  opacity: .82;
  max-width: 50ch;
  margin-inline: auto;
  text-wrap: balance;
}

/* ---- Cartiglio data/luogo da manifesto (centrato) ---- */
.xc-phero__bill {
  display: inline-flex;
  align-items: stretch;
  gap: clamp(1rem, 2vw, 1.6rem);
  margin-top: 1.9rem;
  padding: .95rem 1.4rem;
  border: 1px solid var(--xc-prem-line-2);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.012));
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.xc-phero__bill-when,
.xc-phero__bill-where { display: flex; flex-direction: column; justify-content: center; line-height: 1.05; }
.xc-phero__bill-day {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: clamp(1.15rem, 2.2vw, 1.55rem);
  color: var(--xc-prem-cream);
  letter-spacing: -.01em;
}
.xc-phero__bill-year {
  font-size: .76rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--xc-prem-orange);
  margin-top: .35rem;
}
.xc-phero__bill-sep { width: 1px; background: var(--xc-prem-line-2); }
.xc-phero__bill-place {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: clamp(1.15rem, 2.2vw, 1.55rem);
  color: var(--xc-prem-cream);
  letter-spacing: -.01em;
}
.xc-phero__bill-city {
  font-size: .76rem;
  text-transform: uppercase;
  color: var(--xc-prem-dim);
  margin-top: .35rem;
}

.xc-phero__cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .9rem;
  margin-top: 1.9rem;
}

/* ---- Scala dell'evento subito sotto l'hero (centrata) ---- */
.xc-phero__scale {
  list-style: none;
  margin: 2.2rem auto 0;
  padding: 1.5rem 0 0;
  border-top: 1px solid var(--xc-prem-line);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(1.6rem, 5vw, 3.4rem);
  width: fit-content;
  max-width: 100%;
}
.xc-phero__scale-item { display: flex; align-items: baseline; gap: .55rem; }
.xc-phero__scale-item b {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  line-height: 1;
  color: var(--xc-prem-cream);
  font-variant-numeric: tabular-nums;
}
.xc-phero__scale-item span {
  font-size: .8rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--xc-prem-dim);
}

/* ============================================================
   NUMERI
   ============================================================ */
.xc-page .xc-pstats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(1rem, 3vw, 2.5rem);
}
.xc-pstats__item {
  padding-top: 1.1rem;
  border-top: 1px solid var(--xc-prem-line-2);
}
.xc-pstats__value {
  display: block;
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--xc-prem-cream);
  font-variant-numeric: tabular-nums;
}
.xc-pstats__label {
  display: block;
  margin-top: .55rem;
  font-size: .82rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--xc-prem-dim);
}

/* ============================================================
   PADRONI DI CASA — 2 referenti reali (Federic, Gom Gom Cards)
   ============================================================ */
.xc-page .xc-pguests__tease {
  display: block;
  color: var(--xc-prem-orange);
  font-weight: 500;
  font-size: .58em;
  letter-spacing: -.01em;
  margin-top: .35rem;
}
.xc-page .xc-pguests__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1.2rem, 2.6vw, 2rem);
  margin-top: clamp(2.5rem, 5vw, 4rem);
  max-width: 60rem;
  margin-inline: auto;
}
.xc-phost {
  --g-accent: var(--xc-prem-orange);
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--xc-prem-line-2);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), transparent 55%), var(--xc-prem-panel);
  overflow: hidden;
  transition: transform .45s var(--xc-ease), border-color .35s, box-shadow .45s;
}
.xc-phost::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  z-index: 2;
  background: linear-gradient(90deg, transparent, var(--g-accent), transparent);
  opacity: .85;
}
.xc-phost:hover {
  transform: translateY(-6px);
  border-color: color-mix(in srgb, var(--g-accent) 55%, var(--xc-prem-line-2));
  box-shadow: 0 42px 72px -40px color-mix(in srgb, var(--g-accent) 60%, transparent);
}
.xc-phost__media {
  position: relative;
  aspect-ratio: 1000 / 780;
  overflow: hidden;
  background: #0c0813;
}
.xc-phost__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s var(--xc-ease);
}
.xc-phost:hover .xc-phost__img { transform: scale(1.03); }
.xc-phost__no {
  position: absolute;
  z-index: 1;
  right: 14px; top: 12px;
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: 1.4rem;
  color: rgba(255,255,255,.55);
  text-shadow: 0 2px 12px rgba(0,0,0,.55);
}
.xc-phost__body {
  padding: 1.4rem 1.5rem 1.6rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.xc-phost__role {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  font-size: .68rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--g-accent);
  padding: .35em .75em;
  border: 1px solid color-mix(in srgb, var(--g-accent) 45%, transparent);
  border-radius: 999px;
}
.xc-phost__role::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--g-accent);
  box-shadow: 0 0 8px var(--g-accent);
}
.xc-phost__name {
  margin: .9rem 0 0;
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: clamp(1.5rem, 2.4vw, 1.9rem);
  color: var(--xc-prem-ink);
  letter-spacing: -.01em;
  line-height: 1.05;
}
.xc-phost__note {
  margin: .5rem auto 0;
  font-size: .95rem;
  line-height: 1.5;
  color: var(--xc-prem-dim);
  max-width: 36ch;
}

/* ============================================================
   I MONDI IN FIERA — wall di loghi (colori originali su celle scure)
   ============================================================ */
.xc-page .xc-flogos {
  list-style: none;
  margin: clamp(2.5rem, 5vw, 4rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: clamp(.7rem, 1.4vw, 1.1rem);
}
.xc-flogos__item {
  display: grid;
  place-items: center;
  min-height: clamp(96px, 11vw, 132px);
  padding: clamp(1.1rem, 2.2vw, 1.8rem) clamp(.9rem, 1.8vw, 1.5rem);
  background: var(--xc-prem-bg-2);
  border: 1px solid var(--xc-prem-line);
  border-radius: 14px;
  transition: background .35s var(--xc-ease), border-color .35s, transform .35s var(--xc-ease);
}
.xc-flogos__item:hover {
  background: var(--xc-prem-panel);
  border-color: var(--xc-prem-line-2);
  transform: translateY(-3px);
}
.xc-flogos__img {
  width: 100%;
  max-height: 58px;
  height: auto;
  object-fit: contain;
}
@media (max-width: 940px) { .xc-page .xc-flogos { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .xc-page .xc-flogos { grid-template-columns: repeat(2, 1fr); } }

/* ============================================================
   COSA PUOI FARE — indice editoriale numerato (niente icone/riquadri)
   ============================================================ */
.xc-page .xc-pdo__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2rem, 4vw, 3rem);
}
@media (min-width: 880px) {
  .xc-page .xc-pdo__inner {
    grid-template-columns: 0.82fr 1.18fr;
    gap: clamp(3rem, 6vw, 6rem);
    align-items: start;
  }
  .xc-page .xc-pdo__intro { position: sticky; top: 6rem; }
}
/* Immagine sopra il titolo della colonna intro (locandina di default):
   a larghezza piena della colonna. */
.xc-page .xc-pdo__logo {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 clamp(1.1rem, 2.4vw, 1.8rem);
  border-radius: 14px;
  box-shadow: 0 26px 55px -26px rgba(0, 0, 0, .75);
}
.xc-pdo__statement {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.03;
  font-size: clamp(2.1rem, 4.4vw, 3.3rem);
  margin: .6rem 0 0;
}
.xc-pdo__sub {
  margin: 1.1rem 0 0;
  color: var(--xc-prem-dim);
  font-size: 1.02rem;
  line-height: 1.6;
  max-width: 38ch;
}
.xc-pdo__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--xc-prem-line);
}
.xc-pdo__row {
  display: grid;
  grid-template-columns: 3rem 1fr;
  gap: clamp(1rem, 2.4vw, 2.2rem);
  align-items: baseline;
  padding: clamp(1.1rem, 2vw, 1.6rem) 0;
  border-bottom: 1px solid var(--xc-prem-line);
  transition: padding-left .4s var(--xc-ease);
}
.xc-pdo__row:hover { padding-left: .7rem; }
.xc-pdo__num {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--xc-prem-orange);
  letter-spacing: .02em;
}
.xc-pdo__text { min-width: 0; }
.xc-pdo__title {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  letter-spacing: -.01em;
  font-size: clamp(1.3rem, 2.3vw, 1.75rem);
  margin: 0;
  color: var(--xc-prem-ink);
}
.xc-pdo__line {
  margin: .35rem 0 0;
  font-size: .96rem;
  line-height: 1.55;
  color: var(--xc-prem-dim);
  max-width: 54ch;
}

/* ============================================================
   LOCATION — NUMBER ONE: la foto reale della discoteca in evidenza
   ============================================================ */
.xc-page .xc-ploc__inner {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
.xc-ploc__media {
  position: relative;
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--xc-prem-line-2);
  box-shadow:
    0 40px 80px -40px rgba(0,0,0,.9),
    0 0 0 1px rgba(255,255,255,.04);
}
.xc-ploc__img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
}
/* velo scuro: unifica la foto diurna e fa leggere il logo */
.xc-ploc__veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(8,6,13,.34) 0%, transparent 30%, transparent 52%, rgba(8,6,13,.80) 100%);
}
/* banda di luce calda in basso: la sala "si accende" */
.xc-ploc__frameglow {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(0deg, rgba(8,6,13,.55) 0%, transparent 42%),
    radial-gradient(80% 60% at 50% 108%, rgba(255, 247, 4,.32) 0%, transparent 60%);
  mix-blend-mode: screen;
}
/* logo Number One sovrapposto (nero su trasparente → reso crema) */
.xc-ploc__brand {
  position: absolute;
  z-index: 3;
  left: clamp(1.1rem, 3.5vw, 2rem);
  bottom: clamp(1rem, 3.5vw, 1.7rem);
  width: min(50%, 14rem);
  pointer-events: none;
}
.xc-ploc__logo {
  display: block;
  width: 100%;
  height: auto;
  filter: brightness(0) invert(1) drop-shadow(0 2px 12px rgba(0,0,0,.7));
  opacity: .95;
}
.xc-ploc__copy { max-width: 34rem; }
.xc-ploc__title {
  font-size: clamp(1.9rem, 4vw, 3rem);
  margin: .55rem 0 0;
}
.xc-ploc__addr {
  display: flex;
  align-items: center;
  gap: .6em;
  margin: 1.3rem 0 0;
  font-size: .95rem;
  letter-spacing: .01em;
  color: var(--xc-prem-cream);
}
.xc-ploc__pin {
  flex: none;
  width: 12px; height: 12px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(45deg);
  border: 2px solid var(--xc-prem-orange);
}
.xc-ploc__desc {
  margin-top: 1rem;
  font-size: 1.02rem;
  line-height: 1.65;
  color: var(--xc-prem-dim);
}
.xc-ploc__cta { margin-top: 1.8rem; }

/* ============================================================
   PROGRAMMA (anteprima) — restyle pulito
   ============================================================ */
.xc-page .xc-pprog__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  margin-top: clamp(2.5rem, 5vw, 4rem);
}
.xc-pday__title {
  font-size: 1.05rem;
  font-family: var(--xc-font-body);
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--xc-prem-orange);
  padding-bottom: 1rem;
  margin: 0 0 .5rem;
  border-bottom: 1px solid var(--xc-prem-line-2);
}
.xc-pevent {
  display: grid;
  grid-template-columns: 5.2rem 1fr;
  gap: 1.2rem;
  padding: 1.15rem 0;
  border-bottom: 1px solid var(--xc-prem-line);
  align-items: baseline;
}
.xc-pevent__time {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--xc-prem-cream);
  font-variant-numeric: tabular-nums;
}
.xc-pevent__type {
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--xc-prem-dim-2);
}
.xc-pevent__title {
  font-family: var(--xc-font-body);
  font-weight: 600;
  font-size: 1.02rem;
  line-height: 1.3;
  margin: .25rem 0 0;
  color: var(--xc-prem-ink);
}
.xc-pevent__place {
  margin-top: .3rem;
  font-size: .85rem;
  color: var(--xc-prem-dim);
}
.xc-pprog__more { margin-top: 2.5rem; }

/* ============================================================
   BIGLIETTI (teaser)
   ============================================================ */
.xc-page .xc-ptix__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(1rem, 2.4vw, 1.6rem);
  margin-top: clamp(2.5rem, 5vw, 4rem);
  max-width: 60rem;
  margin-inline: auto;
}
.xc-ptix {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 1.8rem;
  border: 1px solid var(--xc-prem-line-2);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent 60%), var(--xc-prem-panel);
  transition: transform .4s var(--xc-ease), border-color .3s, box-shadow .4s;
}
.xc-ptix:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 244, 230, .26);
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .9);
}
.xc-ptix--featured {
  border-color: color-mix(in srgb, var(--xc-prem-orange) 60%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--xc-prem-orange) 30%, transparent), 0 30px 60px -34px rgba(255, 247, 4, .5);
}
/* Badge "Più scelto": pill pieno (testo scuro su giallo), su riga propria in
   alto → non si confonde col rarity giallo accanto. */
.xc-ptix__flag {
  align-self: flex-start;
  margin-bottom: .75rem;
  padding: .34em .8em;
  border-radius: 999px;
  background: var(--xc-prem-orange);
  color: #1a0f04;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  box-shadow: 0 6px 16px -8px rgba(255, 247, 4, .6);
}
.xc-ptix__rarity {
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--xc-prem-dim);
}
.xc-ptix__name {
  font-size: 1.35rem;
  margin: .6rem 0 0;
}
.xc-ptix__price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 1.1rem 0 0;
  padding-bottom: 1.3rem;
  border-bottom: 1px solid var(--xc-prem-line);
}
/* Diritti di prevendita: riga piccola sotto il prezzo, dentro la stessa cornice. */
.xc-ptix__price .xc-ptix__ddp {
  flex-basis: 100%;
  margin-top: .2rem;
  font-size: .78rem;
  font-weight: 500;
  color: var(--xc-prem-dim);
}
/* Nota "reindirizzato su Vivaticket": dentro ogni card, sotto il bottone (visibile anche su mobile). */
.xc-ptix__redirect {
  margin: .7rem 0 0;
  font-size: .74rem;
  line-height: 1.4;
  color: var(--xc-prem-dim);
  text-align: center;
}
.xc-ptix__price b {
  font-family: var(--xc-font-prem);
  font-weight: 600;
  font-size: 2.4rem;
  line-height: 1;
  color: var(--xc-prem-cream);
}
.xc-ptix__price span { font-size: .85rem; color: var(--xc-prem-dim); }
.xc-ptix__features {
  list-style: none;
  margin: 1.3rem 0 0;
  padding: 0;
  display: grid;
  gap: .7rem;
  flex: 1;
  align-content: start; /* voci impacchettate in alto: il bottone resta in fondo via flex:1 */
}
.xc-ptix__features li {
  position: relative;
  padding-left: 1.5rem;
  font-size: .9rem;
  line-height: 1.45;
  color: var(--xc-prem-dim);
}
.xc-ptix__features li::before {
  content: "";
  position: absolute;
  left: 0; top: .42em;
  width: 7px; height: 7px;
  border-right: 1.5px solid var(--xc-prem-orange);
  border-bottom: 1.5px solid var(--xc-prem-orange);
  transform: rotate(45deg);
}
.xc-ptix .xc-prem-btn { margin-top: 1.6rem; justify-content: center; }

/* ============================================================
   FAQ — restyle pulito sull'accordion esistente
   ============================================================ */
.xc-page .xc-faq { max-width: 760px; }
.xc-page .xc-faq__item {
  border: 0;
  border-bottom: 1px solid var(--xc-prem-line-2);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  margin: 0;
  padding: 0;
}
.xc-page .xc-faq__q {
  font-family: var(--xc-font-prem);
  font-weight: 500;
  font-size: clamp(1.05rem, 2vw, 1.3rem);
  letter-spacing: -.01em;
  color: var(--xc-prem-ink);
  padding: 1.5rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  cursor: pointer;
  list-style: none;
}
.xc-page .xc-faq__q::-webkit-details-marker { display: none; }
.xc-page .xc-faq__icon {
  flex: none;
  width: 34px; height: 34px;
  display: grid; place-content: center;
  background: transparent;
  border: 1px solid var(--xc-prem-line-2);
  border-radius: 50%;
  color: var(--xc-prem-orange);
  transition: transform .4s var(--xc-ease), background .3s, color .3s, border-color .3s;
}
.xc-page .xc-faq__icon svg { display: block; }
.xc-page .xc-faq__q:hover .xc-faq__icon {
  border-color: color-mix(in srgb, var(--xc-prem-orange) 50%, transparent);
  background: rgba(255, 247, 4, .08);
}
.xc-page .xc-faq__item[open] .xc-faq__icon {
  transform: rotate(45deg);
  background: var(--xc-prem-orange);
  border-color: transparent;
  color: #1a0f04;
}
.xc-page .xc-faq__a { padding: 0 0 1.6rem; }
.xc-page .xc-faq__a p {
  margin: 0;
  max-width: 60ch;
  font-size: 1rem;
  line-height: 1.65;
  color: var(--xc-prem-dim);
}

/* ============================================================
   HEADER tweak su home (più trasparente, premium)
   ============================================================ */
.xc-page .xc-header {
  background: color-mix(in srgb, var(--xc-prem-bg) 70%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--xc-prem-line);
  /* lo sticky va RI-affermato: la regola generica .xc-page > * imposta
     position:relative (per lo z-index sopra la hero) e altrimenti annullerebbe
     lo sticky di components.css → l'header non resterebbe in alto. */
  position: sticky;
  top: 0;
  /* deve stare sopra l'hero (.xc-page > * lo porterebbe a z-index:1) */
  z-index: 60;
  /* iOS: lo sticky rispetta la notch/status bar (safe-area), niente sovrapposizioni */
  padding-top: env(safe-area-inset-top, 0px);
}

/* Utente loggato: lo sticky header scende sotto la admin bar di WordPress.
   NB: WP mette `admin-bar` e `xc-page` sullo STESSO <body> → selettore compound
   `body.admin-bar` (non discendente). La admin bar è fixed 32px (>782px) /
   46px (601–782px); sotto i 600px diventa absolute (scorre via) → header a top:0. */
body.admin-bar .xc-header { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar .xc-header { top: 46px; }
}
@media screen and (max-width: 600px) {
  body.admin-bar .xc-header { top: 0; }
}

/* ============================================================
   FIX "flip" header allo scroll.
   components.css con `.xc-header.is-compact` (JS: scrollY>80) rimpiccioliva
   l'header sticky IN FLUSSO (79px→52px) → il contenuto sotto SALTAVA di ~27px
   (animato) a ogni attraversamento della soglia. Manteniamo l'altezza COSTANTE
   (niente shrink di padding/logo): nessun cambio di flusso, nessun salto. Il
   feedback "scrolled" resta come bg leggermente più opaco + ombra (no layout).
   ============================================================ */
.xc-page .xc-header.is-compact .xc-header__inner { padding-block: .8rem; }
.xc-page .xc-header.is-compact .xc-header__logo img { height: 52px; }
.xc-page .xc-header.is-compact {
  background: color-mix(in srgb, var(--xc-prem-bg) 84%, transparent);
  box-shadow: 0 10px 30px -14px rgba(0, 0, 0, .55);
}

/* Logo PIÙ GRANDE e leggibile quando l'header NON è compatto (in cima, sopra
   l'hero): 64px + alone scuro che lo stacca dallo sfondo semi-trasparente. Da
   compatto torna 52px senza ombra. L'ALTEZZA dell'header resta COSTANTE: il
   padding ridotto al top compensa il logo più alto
   (.425rem×2 + 64px = .8rem×2 + 52px = 77.6px) → nessun salto, il fix "flip"
   resta rispettato. */
.xc-page .xc-header__inner { padding-block: .425rem; }
.xc-page .xc-header__logo img {
  height: 64px;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .9)) drop-shadow(0 6px 16px rgba(0, 0, 0, .55));
  transition: height .25s, filter .3s var(--xc-ease);
}
.xc-page .xc-header.is-compact .xc-header__logo img {
  filter: none;
}

/* ============================================================
   CTA HEADER (desktop) — premium, via lo stile "comic".
   Gerarchia: "Biglietti" è la hero (pill arancio gradiente, glow,
   freccia che scorre); "Diventa espositore" è la secondaria, una
   pill "vetro" viola coordinata (stessa altezza/raggio). Su mobile
   valgono gli override del menu (.is-open), qui non entrano.
   ============================================================ */
@media (min-width: 768px) {
  /* link nav: niente sottolineatura, hover = leggera opacità (no underline) */
  .xc-page .xc-header__nav a:not(.xc-btn) { transition: opacity .2s; }
  .xc-page .xc-header__nav a:not(.xc-btn):hover { text-decoration: none; opacity: .7; }

  .xc-page .xc-header__nav .xc-btn {
    /* reset del look comic ereditato (bordo spesso, ombra dura, display maiuscolo) */
    display: inline-flex;
    align-items: center;
    gap: .5em;
    font-family: var(--xc-font-body);
    font-weight: 600;
    text-transform: none;
    letter-spacing: -.01em;
    font-size: .92rem;
    line-height: 1;
    padding: .72em 1.3em;
    border-radius: 999px;
    border: 1px solid transparent;
    box-shadow: none;
    transition: transform .25s var(--xc-ease), box-shadow .3s var(--xc-ease),
                background .25s var(--xc-ease), border-color .25s var(--xc-ease), color .2s;
  }
  .xc-page .xc-header__nav .xc-btn:active { transform: translateY(0); }
  .xc-page .xc-header__nav .xc-btn:focus-visible {
    outline: 2px solid var(--xc-prem-orange);
    outline-offset: 3px;
  }

  /* SECONDARIO — "Diventa espositore": pill BIANCA piena, testo nero */
  .xc-page .xc-header__nav .xc-btn--outline {
    color: #0a0710;
    background: #ffffff;
    border-color: #ffffff;
  }
  .xc-page .xc-header__nav .xc-btn--outline:hover {
    color: #0a0710;
    background: #ffffff;
    border-color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 10px 26px -14px rgba(0, 0, 0, .5);
  }

  /* PRIMARIO (hero) — "Biglietti": arancio gradiente + glow + freccia */
  .xc-page .xc-header__nav .xc-btn:not(.xc-btn--outline) {
    color: #1a0f04;
    background: var(--xc-prem-orange);
    box-shadow:
      0 10px 26px -12px color-mix(in srgb, var(--xc-prem-orange) 70%, transparent),
      inset 0 1px 0 rgba(255, 255, 255, .35);
  }
  .xc-page .xc-header__nav .xc-btn:not(.xc-btn--outline)::after {
    content: "\2192";
    font-size: .95em;
    transition: transform .25s var(--xc-ease);
  }
  .xc-page .xc-header__nav .xc-btn:not(.xc-btn--outline):hover {
    background: var(--xc-prem-orange);
    transform: translateY(-1px);
    box-shadow:
      0 14px 34px -10px color-mix(in srgb, var(--xc-prem-orange) 82%, transparent),
      inset 0 1px 0 rgba(255, 255, 255, .45);
  }
  .xc-page .xc-header__nav .xc-btn:not(.xc-btn--outline):hover::after {
    transform: translateX(3px);
  }
}

/* ============================================================
   BARRA AZIONI MOBILE — fissa in basso, appare allo scroll.
   Solo mobile; non renderizzata su espositori/biglietti (vedi footer.php).
   Gestisce la safe-area iOS (home indicator) con env().
   ============================================================ */
.xc-mbar { display: none; }
@media (max-width: 767px) {
  .xc-mbar {
    display: flex;
    gap: .6rem;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 45;
    padding: .6rem .9rem calc(.6rem + env(safe-area-inset-bottom, 0px));
    background: color-mix(in srgb, var(--xc-prem-bg) 86%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid var(--xc-prem-line-2);
    /* nascosta finché non si scrolla (slide-up) */
    transform: translateY(130%);
    transition: transform .35s var(--xc-ease);
  }
  .xc-mbar.is-visible { transform: translateY(0); }
  .xc-mbar__btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: .7rem .8rem;
    border-radius: 12px;
    font-family: var(--xc-font-prem);
    font-weight: 600;
    font-size: .92rem;
    letter-spacing: -.01em;
    text-align: center;
    border: 1px solid transparent;
    transition: filter .2s;
  }
  .xc-mbar__btn--primary {
    background: var(--xc-prem-orange);
    color: #1a0f04;
  }
  /* "Diventa espositore": stesso peso del biglietto — bg bianco, testo nero. */
  .xc-mbar__btn--ghost {
    background: #ffffff;
    color: #0a0710;
    border-color: transparent;
  }
  .xc-mbar__btn:hover { text-decoration: none; }
  .xc-mbar__btn:active { filter: brightness(.94); }
  /* il footer non resta coperto dalla barra quando è visibile */
  body:has(.xc-mbar) .xc-footerp {
    padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
  }
}

/* Badge Iubenda (riapri preferenze cookie): su mobile, quando la barra azioni scorre
   in vista, lo solleviamo sopra la barra così non copre "Diventa espositore".
   Iubenda impone `bottom:0 !important` con un selettore ad alta specificità: per
   vincere replichiamo lo stesso selettore anteponendo l'id #xc-body (l'id batte le
   classi). NB: il widget Iubenda è attivo solo sul dominio di produzione. */
@media (max-width: 767px) {
  #xc-body:has(.xc-mbar.is-visible) .iubenda-tp-btn:not(.iubenda-floatable-tb-btn)[data-tp-float][data-tp-float=bottom-left],
  #xc-body:has(.xc-mbar.is-visible) .iubenda-tp-btn:not(.iubenda-floatable-tb-btn)[data-tp-float][data-tp-float=bottom-right] {
    bottom: calc(4.8rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ============================================================
   MENU MOBILE — override premium (solo home). Il dropdown comic di
   components.css (bg-raised/ink, bottone xc-btn) stona sulla home dark:
   qui lo trasformiamo in un pannello pulito premium.
   ============================================================ */
@media (max-width: 767px) {
  /* pannello a tutta larghezza sotto l'header: superficie OPACA e distinta dallo
     sfondo (gradiente più chiaro/violaceo), accento arancio in alto, ombra forte e
     uno scrim a tutta pagina (box-shadow esteso) che stacca il menu dal contenuto. */
  .xc-page .xc-header__nav.is-open {
    inset: 100% 0 auto 0;
    padding: .6rem 1.3rem 1.5rem;
    gap: 0;
    background: linear-gradient(180deg, #1c1430 0%, #130d20 100%);
    border-top: 2px solid var(--xc-prem-orange);
    border-bottom: 1px solid var(--xc-prem-line-2);
    /* niente più anello-scrim qui (offuscava anche la testata): lo scrim è uno
       strato a parte SOTTO l'header (vedi .xc-page:has(...)::after) */
    box-shadow: 0 30px 60px -22px rgba(0, 0, 0, .92);
  }
  /* link del menu: tipografia display, riga ampia con chevron, hover che scorre */
  .xc-page .xc-header__nav.is-open a:not(.xc-btn) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1.05rem .35rem;
    color: var(--xc-prem-ink);
    font-family: var(--xc-font-prem);
    font-weight: 600;
    font-size: 1.2rem;
    letter-spacing: -.01em;
    border-bottom: 1px solid var(--xc-prem-line);
    transition: color .2s, padding-left .28s var(--xc-ease);
  }
  .xc-page .xc-header__nav.is-open a:not(.xc-btn)::after {
    content: "→";
    font-family: var(--xc-font-body);
    font-size: .95rem;
    color: var(--xc-prem-orange);
    opacity: .5;
    transition: transform .28s var(--xc-ease), opacity .2s;
  }
  .xc-page .xc-header__nav.is-open a:not(.xc-btn):hover {
    color: var(--xc-prem-orange);
    padding-left: .65rem;
  }
  .xc-page .xc-header__nav.is-open a:not(.xc-btn):hover::after {
    transform: translateX(4px);
    opacity: 1;
  }
  .xc-page .xc-header__nav.is-open a[aria-current="page"] {
    color: var(--xc-prem-orange);
  }
  .xc-page .xc-header__nav.is-open a[aria-current="page"]::after { opacity: 1; }
  /* "Biglietti": dal look comic al bottone premium (arancio, 4px, full-width) */
  .xc-page .xc-header__nav.is-open .xc-btn {
    display: block;
    width: 100%;
    margin-top: .9rem;
    padding: .92em 1.5em;
    text-align: center;
    text-transform: none;
    letter-spacing: .01em;
    font-family: var(--xc-font-body);
    font-weight: 600;
    font-size: .98rem;
    color: #1a0f04;
    background: var(--xc-prem-orange);
    border: 1px solid transparent;
    border-radius: 4px;
    box-shadow: 0 12px 30px -16px rgba(255, 247, 4, .7);
  }
  .xc-page .xc-header__nav.is-open .xc-btn:hover {
    background: var(--xc-prem-orange-h);
  }
  .xc-page .xc-header__nav.is-open .xc-btn:active { transform: none; }
  /* "Diventa espositore": bg bianco, testo nero — stesso peso di "Biglietti". */
  .xc-page .xc-header__nav.is-open .xc-btn--outline {
    margin-top: 1.1rem;
    color: #0a0710;
    background: #ffffff;
    border: 1px solid transparent;
    box-shadow: 0 12px 30px -16px rgba(0, 0, 0, .5);
  }
  .xc-page .xc-header__nav.is-open .xc-btn--outline:hover {
    background: #f2f0ec;
    color: #0a0710;
  }
  /* barre del burger in colore premium */
  .xc-page .xc-header__burger span { background: var(--xc-prem-ink); }

  /* ---- MENU APERTO: testata pulita + scrim solo sul contenuto sotto ----
     Lo scrim è un velo full-screen a z-index 40 (< header z-index 60): offusca
     la pagina ma NON la testata, che resta sopra. L'header diventa opaco così
     dietro al vetro non traspare il contenuto offuscato (logo + burger pieni). */
  .xc-page:has(.xc-header__nav.is-open)::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 40;
    pointer-events: none;
    background: rgba(5, 3, 9, .58);
  }
  .xc-page:has(.xc-header__nav.is-open) .xc-header {
    background: var(--xc-prem-bg);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  /* la barra azioni in basso non convive col menu aperto */
  .xc-page:has(.xc-header__nav.is-open) .xc-mbar { display: none; }

  /* ---- BURGER → X (stato letto da aria-expanded, niente JS extra) ---- */
  .xc-page .xc-header__burger span {
    transition: transform .3s var(--xc-ease), opacity .2s var(--xc-ease);
  }
  .xc-page .xc-header__burger[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  .xc-page .xc-header__burger[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }
  .xc-page .xc-header__burger[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 940px) {
  .xc-page .xc-ploc__inner { grid-template-columns: 1fr; gap: 2.2rem; }
  .xc-page .xc-ploc__media { order: -1; }
  .xc-page .xc-ploc__copy { max-width: none; }
  .xc-page .xc-pguests__grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .xc-page .xc-ptix__grid { grid-template-columns: 1fr; max-width: 26rem; margin-inline: auto; }
  .xc-page .xc-pprog__grid { grid-template-columns: 1fr; }
  .xc-page .xc-pstats { grid-template-columns: repeat(2, 1fr); row-gap: 2.4rem; }
  .xc-page .xc-phero__wallgrid { grid-template-columns: repeat(5, 1fr); transform: rotateX(12deg) scale(1.18); }
}
@media (max-width: 600px) {
  .xc-page .xc-phero { min-height: auto; padding-top: clamp(3.2rem, 13vw, 4.5rem); }
  .xc-page .xc-phero__title { font-size: clamp(2.5rem, 12vw, 3.6rem); }
  .xc-page .xc-phero__scrim {
    background:
      radial-gradient(80% 60% at 50% 42%, rgba(8,6,13,.74) 0%, rgba(8,6,13,.48) 44%, rgba(8,6,13,.2) 72%, transparent 92%),
      linear-gradient(180deg, rgba(10,7,16,.34) 0%, rgba(10,7,16,.68) 60%, var(--xc-prem-bg) 100%);
  }
  .xc-page .xc-phero__wallgrid { grid-template-columns: repeat(4, 1fr); transform: rotateX(13deg) scale(1.3) translateY(-2%); }
  .xc-page .xc-phero__bill { width: 100%; }
  .xc-page .xc-pguests__grid { grid-template-columns: 1fr; max-width: 26rem; margin-inline: auto; }
  .xc-page .xc-phero__cta { flex-direction: column; align-items: stretch; width: 100%; }
  .xc-page .xc-phero__cta .xc-prem-btn { justify-content: center; }
  .xc-page .xc-pstats { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   FOOTER PREMIUM — condiviso da tutte le pagine (NON scoped a home)
   premium.css è caricato ovunque, quindi qui niente prefisso .xc-page.
   Sostituisce il vecchio footer "fumetto" (.xc-footer) ora non più emesso.
   ============================================================ */
.xc-footerp {
  position: relative;
  background: #0a0710;
  color: #f4eefb;
  border-top: 1px solid rgba(255, 244, 230, .1);
  padding-block: clamp(3rem, 6vw, 5rem);
  font-family: var(--xc-font-body, "Sora", system-ui, sans-serif);
  background-image:
    radial-gradient(80% 120% at 100% 0%, rgba(154, 107, 255, .14), transparent 55%),
    radial-gradient(60% 100% at 0% 100%, rgba(255, 247, 4, .08), transparent 55%);
}
.xc-footerp__inner {
  width: 100%;
  max-width: var(--xc-container);
  margin-inline: auto;
  padding-inline: var(--xc-s3);
}
.xc-footerp__top {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
  padding-bottom: clamp(1.4rem, 3vw, 2.2rem);
}
.xc-footerp__brand { display: flex; flex-direction: column; gap: 1.2rem; }
.xc-footerp__logo { display: inline-block; width: max-content; }
.xc-footerp__logo img { display: block; height: auto; width: 120px; }
.xc-footerp__meta { display: flex; flex-direction: column; gap: .35rem; margin: 0; }
.xc-footerp__date {
  font-family: var(--xc-font-prem, sans-serif);
  font-weight: 600;
  font-size: 1.05rem;
  color: #fff4e6;
  letter-spacing: -.01em;
}
.xc-footerp__venue { font-size: .9rem; color: #a99fbd; }

.xc-footerp__news { max-width: 30rem; justify-self: end; width: 100%; }
.xc-footerp__news-kicker {
  margin: 0;
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #fff704;
  font-weight: 600;
}
.xc-footerp__news-line { margin: .55rem 0 1rem; font-size: .95rem; line-height: 1.55; color: #a99fbd; }
.xc-footerp__form {
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
  position: relative;
}
.xc-footerp__form input {
  flex: 1 1 12rem;
  min-width: 0;
  padding: .85em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255, 244, 230, .16);
  background: rgba(255, 255, 255, .04);
  color: #f4eefb;
  font: inherit;
  font-size: .95rem;
}
.xc-footerp__form input::placeholder { color: #7d7390; }
.xc-footerp__form input:focus-visible {
  outline: 2px solid #fff704;
  outline-offset: 2px;
  border-color: transparent;
}
.xc-footerp__form button {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  padding: .85em 1.4em;
  border-radius: 8px;
  border: 0;
  background: #fff704;
  color: #1a0f04;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background .25s, transform .25s;
}
.xc-footerp__form button:hover { background: #e8dd00; transform: translateY(-1px); }
.xc-footerp__form button:disabled { opacity: .6; cursor: default; transform: none; }
.xc-footerp__form button:focus-visible { outline: 2px solid #fff4e6; outline-offset: 2px; }
.xc-footerp__form .xc-form__ok {
  flex-basis: 100%;
  margin: .3rem 0 0;
  font-size: .9rem;
  color: #5ee08a;
}

/* Menu nel footer: ora vive nella colonna brand (sotto data/luogo), riga compatta senza banda. */
.xc-footerp__nav {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem 1.6rem;
}
.xc-footerp__nav a {
  color: #f4eefb;
  text-decoration: none;
  font-size: .95rem;
  font-weight: 500;
  transition: color .2s;
}
.xc-footerp__nav a:hover { color: #fff704; }

/* "Powered by" — credito partner con i loghi (Gom Gom Cards + Federic). */
/* Main Sponsor: banda dedicata sopra il "Powered by", più in evidenza. */
.xc-footerp__sponsor {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .8rem;
  padding-block: clamp(1.6rem, 3.5vw, 2.4rem);
  border-bottom: 1px solid rgba(255, 244, 230, .08);
}
.xc-footerp__sponsor-label {
  font-size: .74rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--xc-prem-orange);
}
.xc-footerp__sponsor-logo { display: block; }
.xc-footerp__sponsor-logo img {
  display: block;
  height: 48px;
  width: auto;
}
.xc-footerp__powered {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .9rem clamp(1.4rem, 3vw, 2.2rem);
  padding-block: clamp(1.4rem, 3vw, 2rem);
  border-bottom: 1px solid rgba(255, 244, 230, .08);
}
.xc-footerp__powered-label {
  font-size: .74rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-weight: 600;
  color: #7d7390;
}
.xc-footerp__powered-logos {
  display: flex;
  align-items: center;
  gap: clamp(1.4rem, 4vw, 2.6rem);
  list-style: none;
  margin: 0;
  padding: 0;
}
.xc-footerp__powered-logos a { display: block; }
.xc-footerp__powered-logos img {
  display: block;
  height: 34px;
  width: auto;
  opacity: .92;
  transition: opacity .2s, transform .2s;
}
.xc-footerp__powered-logos li:hover img { opacity: 1; transform: translateY(-1px); }

.xc-footerp__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-top: clamp(1.4rem, 3vw, 2rem);
}
.xc-footerp__copy, .xc-footerp__legal { margin: 0; font-size: .85rem; color: #7d7390; }
.xc-footerp__social { display: flex; gap: .7rem; }
.xc-footerp__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  color: #a99fbd;
  text-decoration: none;
  border: 1px solid rgba(255, 244, 230, .12);
  background: rgba(255, 255, 255, .03);
  transition: color .2s, border-color .2s, background .2s, transform .2s;
}
.xc-footerp__social a:hover {
  color: #f4eefb;
  border-color: rgba(255, 244, 230, .28);
  background: rgba(255, 255, 255, .06);
  transform: translateY(-2px);
}
.xc-footerp__social svg { display: block; }
.xc-footerp__legal { display: inline-flex; align-items: center; gap: .6em; flex-wrap: wrap; }
.xc-footerp__legal a { color: #7d7390; text-decoration: none; transition: color .2s; }
.xc-footerp__legal a:hover { color: #f4eefb; }
.xc-footerp a:focus-visible, .xc-footerp button:focus-visible {
  outline: 2px solid #fff704;
  outline-offset: 3px;
  border-radius: 4px;
}

@media (max-width: 760px) {
  .xc-footerp__top { grid-template-columns: 1fr; }
  .xc-footerp__news { justify-self: start; }
  .xc-footerp__bottom { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   REDUCED MOTION — carte ferme, niente tilt, ombra statica curata
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  .xc-page * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
  .xc-rcard__stage { transform: none !important; }
  .xc-rcard.is-live .xc-rcard__glare,
  .xc-rcard.is-live .xc-rcard__foil { opacity: 0 !important; }
  .xc-pguest__badge::before { animation: none !important; }
}