/* BASE · regole comuni a tutti i siti. Nessun colore o font di un creator: i valori arrivano dai token del design. */
:root {
  /* PALETTE (--p-*): valori NEUTRI. Ogni sito li sostituisce con i token del suo design (design.css);
     le impostazioni del tema scelte nell'editor vincono su tutto (snippet c_theme). */
  --p-bg: #FFFFFF; --p-alt: #F2F2F0; --p-ink: #1C1C1C; --p-ink-2: #4A4A4A;
  --p-accent: #3A3A3A; --p-second: #5C5C5C; --p-high: #A8A8A8;
  --c-out: cubic-bezier(.2, .8, .2, 1); --c-spring: cubic-bezier(.34, 1.56, .64, 1);
  --c-pad-y: clamp(48px, 7vw, 96px); --c-pad-x: clamp(20px, 5vw, 48px);
  --c-r-card: 20px; --c-r-img: 24px;
  --c-font-head: Georgia, serif; --c-font-body: system-ui, -apple-system, sans-serif;
  --c-ok: #479F32; --c-no: #C62D28; /* verde e rosso dei prezzi WeLearn (screen sito Ana, 20/10/2026) */
  --c-h2: clamp(2.25rem, 1.55rem + 2.1vw, 3.5rem);
}
/* colori di lavoro (--c-*): si ricavano dalla palette su ogni sezione, così lo «Stile della sezione» li può scambiare */
.creator {
  --c-bg: var(--p-bg); --c-alt: var(--p-alt); --c-ink: var(--p-ink); --c-ink-2: var(--p-ink-2);
  --c-accent: var(--p-accent); --c-accent-d: var(--p-accent-d, color-mix(in srgb, var(--p-accent) 85%, black));
  --c-second: var(--p-second); --c-high: var(--p-high);
  --c-line: color-mix(in srgb, var(--c-ink) 14%, transparent);
}
/* STILE DELLA SEZIONE (pannello Colori → «Stile della sezione»): automatico = come il disegno */
.creator.c-flex.c-tone-light { --c-sec-bg: var(--p-bg); --mk-bg: var(--p-bg); --notch: var(--p-bg); }
.creator.c-flex.c-tone-alt { --c-sec-bg: var(--p-alt); --mk-bg: var(--p-alt); --notch: var(--p-alt); }
.creator.c-flex.c-tone-dark {
  --c-bg: var(--p-ink); --c-ink: var(--p-bg); --c-ink-2: color-mix(in srgb, var(--p-bg) 78%, var(--p-ink));
  --c-alt: color-mix(in srgb, var(--p-bg) 9%, var(--p-ink)); --c-second: color-mix(in srgb, var(--p-second) 35%, var(--p-bg));
  --c-sec-bg: var(--p-ink); --mk-bg: var(--p-ink); --notch: var(--p-ink); color: var(--p-bg);
}
html { scroll-behavior: smooth; }
.creator { position: relative; box-sizing: border-box; font-family: var(--c-font-body); font-size: 18px; line-height: 1.65; color: var(--c-ink); background: var(--c-bg); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.creator *, .creator *::before, .creator *::after { box-sizing: border-box; }
.creator h1, .creator h2, .creator h3, .creator p, .creator ul, .creator ol, .creator figure, .creator blockquote { margin: 0; padding: 0; }
.creator ul, .creator ol { list-style: none; }
.creator h1, .creator h2, .creator h3 { font-family: var(--c-font-head); font-weight: var(--c-head-weight, 500); letter-spacing: var(--c-head-track, -.02em); text-transform: var(--c-head-case, none); color: inherit; text-wrap: balance; font-optical-sizing: auto; }
.creator p, .creator li, .creator blockquote, .creator cite { text-wrap: pretty; }
.creator p { font-size: 18px; }
.creator img { display: block; max-width: 100%; height: auto; }
.creator a { color: inherit; }
.creator .c-wrap { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 var(--c-pad-x); }
.creator.c-sec { padding: var(--c-pad-y) 0; }
.creator .c-h2 { font-size: var(--c-h2); line-height: 1.06; }
.creator .c-h3 { font-size: clamp(1.375rem, 1.15rem + .55vw, 1.625rem); line-height: 1.22; font-weight: 600; }
/* ---------- pulsanti: stessa forma, dimensione e colore ovunque ---------- */
.creator .c-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 0 30px; border: 0; border-radius: var(--c-btn-radius, 999px); background: var(--c-btn-bg, var(--c-accent)); color: var(--c-btn-color, #fff); font: 600 16px/1 var(--c-font-body); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; cursor: pointer; box-shadow: 0 12px 26px -14px color-mix(in srgb, var(--c-accent) 75%, transparent); transition: background-color .25s var(--c-out); }
.creator .c-btn:hover { background: var(--c-btn-bg-h, var(--c-accent-d)); }
.creator .c-btn:focus-visible { outline: 3px solid var(--c-high); outline-offset: 3px; }
.creator .c-btn__in { display: inline-flex; align-items: center; gap: 14px; transition: transform .25s var(--c-out); }
.creator .c-btn:active .c-btn__in { transform: scale(.97); }
.creator .c-btn svg { width: 18px; height: 18px; flex: none; transition: transform .3s var(--c-out); }
.creator .c-btn:hover svg { transform: translateX(4px); }
.creator .c-btn--full { width: 100%; }
/* ---------- E·37 comparsa a cascata (solo per ciò che è sotto la piega) ---------- */
.creator .rv { transition: opacity .8s var(--c-out), transform .8s var(--c-out); transition-delay: calc(var(--d, 0) * 80ms); }
.creator .rv.pre { opacity: 0; transform: translateY(32px); }
.creator .rv.pre.in { opacity: 1; transform: none; }
/* ---------- immagine che si rivela (pannello che si ritira: solo transform) ---------- */
.creator .c-mask { position: relative; overflow: hidden; }
.creator .c-mask::after { content: ""; position: absolute; inset: 0; background: var(--mk-bg, var(--c-bg)); transform: scaleY(0); transform-origin: top; pointer-events: none; }
.creator .c-mask.mk-pre::after { transform: scaleY(1); }
.creator .c-mask.mk-pre.mk-go::after { transform: scaleY(0); transition: transform 1.1s cubic-bezier(.77, 0, .18, 1) var(--md, 0ms); }
.creator .c-mask img { transition: transform 1.4s var(--c-out) var(--md, 0ms); }
.creator .c-mask.mk-pre img { transform: scale(1.1); }
.creator .c-mask.mk-pre.mk-go img { transform: none; }
/* ---------- ogni cornice ritaglia sempre la sua foto (indipendente dalle animazioni) ---------- */
/* ---------- ingressi delle immagini: ognuno diverso, mai lo stesso effetto in fila ---------- */
.creator .c-mask--l::after, .creator .c-mask--r::after { transform: scaleX(0); }
.creator .c-mask--l::after { transform-origin: right; }
.creator .c-mask--r::after { transform-origin: left; }
.creator .c-mask--l.mk-pre::after, .creator .c-mask--r.mk-pre::after { transform: scaleX(1); }
.creator .c-mask--l.mk-pre.mk-go::after, .creator .c-mask--r.mk-pre.mk-go::after { transform: scaleX(0); }
.creator .rv.rv--zoom.pre:not(.in) { opacity: 0; transform: scale(.9); }
.creator .rv.rv--pop.pre:not(.in) { opacity: 0; transform: translateY(28px) rotate(-4deg) scale(.94); }
.creator .rv.rv--left.pre:not(.in) { opacity: 0; transform: translateX(-56px); }
.creator .rv.rv--kb { overflow: hidden; }
.creator .rv.rv--kb img { transition: transform 1.8s var(--c-out); }
.creator .rv.rv--kb.pre:not(.in) { opacity: 0; transform: none; }
.creator .rv.rv--kb.pre:not(.in) img { transform: scale(1.18); }
@keyframes c-card-in { from { opacity: 0; transform: translate(-40px, 18px) rotate(-3deg); } }
/* ---------- E·03 barra di avanzamento ---------- */
.creator .c-progress { position: fixed; top: 0; left: 0; width: 100%; height: 3px; z-index: 9999; pointer-events: none; }
.creator .c-progress span { display: block; height: 100%; background: var(--c-accent); transform: scaleX(0); transform-origin: left; will-change: transform; }
/* ---------- S01 barra con countdown ---------- */
.creator .c-countdown { display: flex; }
.creator .c-countdown__unit { display: flex; flex-direction: column; align-items: center; min-width: 58px; padding: 2px 10px; border-left: 1px solid color-mix(in srgb, var(--c-bg) 18%, transparent); }
.creator .c-countdown__unit:first-child { border-left: 0; }
.creator .c-countdown__num { font-family: var(--c-font-head); font-size: 26px; line-height: 1.1; font-weight: 500; font-variant-numeric: tabular-nums; }
.creator .c-countdown__lab { margin-top: 2px; font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--c-high); }
/* ---------- S02 hero ---------- */
@keyframes c-rise { to { opacity: 1; transform: none; } }
/* ---------- S03 problema ---------- */
/* ---------- S04 promessa ---------- */
/* ---------- S05 chi è Chiara ---------- */
/* ---------- S06 risultati ---------- */
/* ---------- S07 il corso (E·26 linea disegnata dallo scroll) ---------- */
/* ---------- S08 cosa è incluso (griglia a mosaico, nessuna casella vuota) ---------- */
/* ---------- S09 testimonianze ---------- */
/* ---------- S10 chiamata (E·28 parallasse a 2 livelli, solo desktop) ---------- */
/* ---------- S11 prezzi (calmi; E·22 bordo rotante solo sul piano consigliato) ---------- */
@property --c-ang { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
.creator .c-conic { display: flex; padding: 2px; border-radius: 26px; background: conic-gradient(from var(--c-ang), color-mix(in srgb, var(--c-high) 12%, transparent) 0deg, var(--c-high) 70deg, var(--c-accent) 130deg, color-mix(in srgb, var(--c-high) 12%, transparent) 200deg, color-mix(in srgb, var(--c-high) 12%, transparent) 360deg); animation: c-spin 7s linear infinite; }
@keyframes c-spin { to { --c-ang: 360deg; } }
.creator.paused *, .creator.paused *::before, .creator.paused *::after { animation-play-state: paused !important; }
/* schede dei prezzi: si evidenziano al passaggio del mouse, al tocco e con la tastiera (micro-interazione, il prezzo resta fermo e leggibile) */
.creator .c-conic { transition: transform .35s var(--c-out), box-shadow .35s var(--c-out); }
.creator .c-conic:hover, .creator .c-conic:focus-within, .creator .c-conic.is-on { transform: translateY(-8px); box-shadow: 0 0 0 2px var(--c-high), 0 34px 60px -26px color-mix(in srgb, var(--c-ink) 65%, transparent); }
/* ---------- S12 garanzia (calma) ---------- */
/* ---------- S13 bonus (biglietti) ---------- */
.creator.c-flex { background: transparent !important; padding: 0 !important; }
.creator.c-flex .sizer { position: relative; z-index: 1; }
.creator.c-flex .section__overlay { z-index: 0; pointer-events: none; }
.creator.c-flex .c-wrap { max-width: 1280px; }
/* ---------- S14 FAQ (E·34 fisarmonica fluida; aperta se manca JavaScript) ---------- */
.creator .c-acc { border-bottom: 1px solid var(--c-line); }
.creator .c-acc__q { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; border: 0; background: none; color: var(--c-ink); text-align: left; cursor: pointer; font-family: var(--c-font-head); font-size: 21px; line-height: 1.3; }
.creator .c-acc__q:focus-visible { outline: 3px solid var(--c-high); outline-offset: 4px; border-radius: 6px; }
.creator .c-acc__ico { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--c-accent); color: var(--c-accent); transition: transform .5s var(--c-spring), background-color .25s, color .25s; }
.creator .c-acc__ico svg { width: 14px; height: 14px; }
.creator .c-acc__a { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .55s var(--c-out); }
.creator .c-acc__a > div { overflow: hidden; }
.creator .c-acc__a p { padding: 0 58px 24px 0; color: var(--c-ink-2); transition: opacity .4s var(--c-out) .1s, transform .4s var(--c-out) .1s; }
.c-js .creator .c-acc__a { grid-template-rows: 0fr; }
.c-js .creator .c-acc__a p { opacity: 0; transform: translateY(-6px); }
.c-js .creator .c-acc.open .c-acc__a { grid-template-rows: 1fr; }
.c-js .creator .c-acc.open .c-acc__a p { opacity: 1; transform: none; }
.creator .c-acc.open .c-acc__ico { transform: rotate(135deg); background: var(--c-accent); color: #fff; }
/* ---------- S15 chiusura e footer ---------- */
/* ---------- tablet ---------- */
/* ---------- telefono ---------- */
@media (max-width: 760px) {
  .creator .c-countdown__unit { min-width: 52px; padding: 0 8px; }
  .creator .c-countdown__num { font-size: 22px; }
  .creator .c-acc__a p { padding-right: 0; }
}
/* ---------- movimento ridotto ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .creator *, .creator *::before, .creator *::after { animation: none !important; transition: none !important; }
  .creator .rv.pre { opacity: 1; transform: none; }
  .creator .c-mask.mk-pre::after { transform: scaleY(0); }
  .creator .c-mask.mk-pre img { transform: none; }
  .creator .c-conic:hover { transform: none; }
}
/* =========================================================================
   Standard «flessibile» (creator6): blocchi generici, posizione immagine, colori dall'editor
   ========================================================================= */
.creator.c-flex { text-align: var(--c-align, left); }
.creator .c-tx { color: var(--c-ink-2); }
.creator .c-font--serif { font-family: var(--c-font-quote, var(--c-font-head)); font-style: italic; }
.creator .c-tx.c-font--serif { color: inherit; }
.creator .c-tx--l.c-font--serif { font-size: clamp(1.375rem, 1.15rem + .55vw, 1.625rem); line-height: 1.3; }
.creator .c-line { padding: 18px 0; border-bottom: 1px solid var(--c-line); font-size: 19px; }
.creator .c-blk.c-blk--line + .c-blk--line { margin-top: 0; }
.creator .c-blk.c-blk--heading + .c-blk--line { margin-top: 32px; }
.creator .c-blk.c-blk--line + .c-blk--callout { margin-top: 36px; }
.creator .c-callout { position: relative; overflow: hidden; border-radius: var(--c-r-card); padding: clamp(28px, 4vw, 44px); background-color: var(--c-second); background-size: cover; background-position: center; color: var(--c-bg); }
.creator .c-callout--photo::before { content: ""; position: absolute; inset: 0; background: var(--c-veil, linear-gradient(110deg, color-mix(in srgb, var(--c-second) 94%, transparent), color-mix(in srgb, var(--c-second) 72%, transparent))); opacity: .9; }
.creator .c-callout p { position: relative; color: inherit; font-size: clamp(1.6rem, 1.2rem + 1.3vw, 2.25rem); line-height: 1.2; }
.creator .c-callout p.c-font--sans { font-size: 19px; line-height: 1.6; }
.creator .c-deco { display: inline-block; height: auto; color: var(--c-accent); vertical-align: middle; }
.creator .c-tex { position: absolute; inset: 0; background-size: cover; background-position: center; pointer-events: none; z-index: 0; }
.creator.c-noanim .rv.pre { opacity: 1 !important; transform: none !important; }
.creator.c-noanim .c-hd .ch { opacity: 1 !important; transform: none !important; animation: none !important; }
/* blocchi generici */
.creator .c-blk + .c-blk { margin-top: 24px; }
.creator .c-blk.c-blk--button + .c-blk--button { margin-top: 14px; }
.creator .c-blk.c-blk--heading + .c-blk--text { margin-top: 20px; }
.creator .c-hd { margin: 0; letter-spacing: var(--c-head-track, -.02em); }
.creator .c-hd--xl { font-size: var(--c-h1, clamp(2.75rem, 1.35rem + 4.3vw, 5.25rem)); line-height: 1.03; letter-spacing: var(--c-head-track-xl, -.03em); }
.creator .c-hd--l { font-size: var(--c-h2); line-height: 1.06; }
.creator .c-hd--m { font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2.4rem); line-height: 1.12; }
.creator .c-hd--s { font-size: clamp(1.375rem, 1.15rem + .55vw, 1.625rem); line-height: 1.22; font-weight: 600; }
.creator .c-hd__b { font-style: italic; font-weight: 400; color: var(--c-accent); }
.creator .c-hd .w { display: inline-block; overflow: hidden; vertical-align: top; padding: 0 .06em .1em 0; margin: 0 -.06em -.1em 0; }
.creator .c-hd .ch { display: inline-block; opacity: 0; transform: translateY(110%) rotate(8deg); animation: c-rise .7s var(--c-out) forwards; animation-delay: calc(var(--i) * 13ms + 120ms); }
.creator .c-tx { max-width: 60ch; }
.creator .c-tx--l { font-size: 19px; }
.creator .c-tx--s { font-size: 16px; }
.creator[data-align="center"] .c-tx, .creator .c-blk--al-center .c-tx { margin-left: auto; margin-right: auto; }
.creator .c-blk--al-left .c-tx { margin-left: 0; margin-right: 0; }
.creator .c-blk--al-right .c-tx { margin-left: auto; margin-right: 0; }
.creator .c-trust { font-size: 18px; font-weight: 500; color: var(--c-second); font-variant-numeric: tabular-nums; text-wrap: balance; }
.creator .c-trust::before { content: ""; display: inline-block; vertical-align: middle; width: 28px; height: 2px; margin-right: 14px; background: var(--c-line-acc, var(--c-high)); }
.creator .c-btn--small { min-height: 44px; padding: 0 22px; font-size: 14px; }
.creator .c-btn--large { min-height: 64px; padding: 0 38px; font-size: 17px; }
.creator .c-img { margin: 0; display: inline-block; max-width: 100%; overflow: hidden; vertical-align: top; }
.creator .c-blk--image { text-align: inherit; }
.creator .c-img img { width: 100%; height: auto; display: block; }
.creator .c-img--rounded { border-radius: var(--c-r-img); }
.creator .c-img--arch { border-radius: 999px 999px var(--c-r-img) var(--c-r-img); }
.creator .c-img--circle { border-radius: 50%; aspect-ratio: 1; }
.creator .c-img--circle img { height: 100%; object-fit: cover; }
/* posizione dell'immagine principale (sezioni a due colonne) */
.creator .c-split { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.creator .c-split > .c-split__text { min-width: 0; }
.creator .c-split > .c-split__media { min-width: 0; }
.creator.c-img-left .c-split { grid-template-columns: 5fr 7fr; }
.creator.c-img-left .c-split__media { order: -1; }
.creator.c-img-top .c-split, .creator.c-img-bottom .c-split { grid-template-columns: 1fr; }
.creator.c-img-top .c-split__media { order: -1; }
.creator.c-img-top .c-split__media, .creator.c-img-bottom .c-split__media { width: 100%; max-width: 560px; justify-self: center; }
.creator.c-no-media .c-split { grid-template-columns: 1fr; }
@media (max-width: 980px) {
  .creator .c-split, .creator.c-img-left .c-split { grid-template-columns: 1fr; }
  .creator .c-split__media { width: 100%; max-width: 460px; justify-self: center; order: 0; }
  .creator.c-img-m-top .c-split__media { order: -1; }
  .creator.c-img-m-bottom .c-split__media { order: 1; }
}
/* S02 forme del ritratto */
/* ---- creator6: collegamenti tra opzioni dell'editor e design ---- */
.creator .c-head:empty, .creator .c-foot:empty { display: none; }
.creator .c-foot { margin-top: clamp(32px, 4vw, 48px); }
.creator .c-shape--arch { border-radius: 999px 999px var(--c-r-img) var(--c-r-img) !important; }
.creator .c-shape--rounded { border-radius: var(--c-r-img) !important; }
.creator .c-shape--square { border-radius: 0 !important; }
.creator .c-shape--circle { border-radius: 50% !important; aspect-ratio: 1 !important; }
/* S01 */
/* S03 */
/* S04 */
/* S05 */
/* S06 */
/* S07 */
/* S09, S11, S13 griglie che seguono il numero di elementi */
/* S10 */
/* S11 */
/* S12 */
/* S13 */
/* S14 */
/* S15 */
/* ==== creator6 v2: palette unica, sfondi di default, stili di box, nascondi per blocco, WD ==== */
/* sfondo di default di ogni sezione = palette (il colore scelto nell'editor lo sostituisce) */
.creator.c-flex .section__overlay { background-color: var(--c-sec-bg, var(--c-bg)); }
.creator.c-flex.c-bg-image .section__overlay { background-color: transparent; }
/* stili di box pronti (la designer sceglie; i colori vengono dalla palette) */
.creator .c-v-light { background-color: var(--c-bg); color: var(--c-ink); }
.creator .c-v-sand { background-color: var(--c-alt); color: var(--c-ink); }
.creator .c-v-white { background-color: #fff; color: var(--c-ink); }
.creator .c-v-secondary { background-color: var(--c-second); color: var(--c-bg); --c-accent: var(--c-high); }
.creator .c-v-dark { background-color: var(--c-ink); color: var(--c-bg); --c-accent: var(--c-high); }
.creator .c-v-accent { background-color: var(--c-accent); color: #fff; --c-accent: var(--c-bg); }
.creator .c-v-secondary p, .creator .c-v-dark p, .creator .c-v-accent p, .creator .c-v-secondary h3, .creator .c-v-dark h3, .creator .c-v-accent h3 { color: inherit; }
/* nascondi per blocco */
@media (min-width: 768px) {
  .creator .c-hide-d { display: none !important; }
}
@media (max-width: 767px) {
  .creator .c-hide-m { display: none !important; }
}
/* grassetto nei testi (**parola**) */
.creator strong { font-weight: 600; }
.creator .c-hl strong, .creator .c-tx strong { color: inherit; }
/* barra in alto (WD: banner accento + countdown + CTA START NOW) */
.creator .c-btn--light { background: var(--c-bg); color: var(--c-ink); box-shadow: none; min-height: 44px; padding: 0 22px; font-size: 14px; }
.creator .c-btn--light:hover { background: #fff; }
/* countdown come blocco */
.creator .c-blk--countdown .c-countdown { display: inline-flex; justify-content: center; }
.creator .c-blk--countdown .c-countdown__num { font-size: clamp(2rem, 1.4rem + 2vw, 3rem); }
.creator .c-blk--countdown .c-countdown__unit { min-width: 84px; border-left-color: color-mix(in srgb, currentColor 25%, transparent); }
.creator .c-blk--countdown .c-countdown__lab { color: var(--c-high); }
/* video */
.creator .c-video { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--c-r-img); background: var(--c-ink); }
.creator .c-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* prezzi: valore totale rosso, prezzo finale verde, bonus barrati + FREE (WD) */
.creator .c-was { margin-left: 6px; color: var(--c-no); opacity: .9; }
.creator .c-free { margin-left: 6px; font-weight: 700; color: var(--c-ok); letter-spacing: .04em; }
/* bonus: valore barrato rosso + FREE verde, icona */
/* testimonianze: foto sopra (WD) */
/* FAQ a box (WD: box chiare, bordo, + dello stesso colore del bordo) */
/* garanzia in un riquadro (WD) */
/* animazioni spente (anche dall'interruttore globale) */
.creator.c-noanim .c-mask::after { display: none; }
.creator.c-noanim .c-mask img { transform: none !important; }
.creator.c-noanim .c-conic { animation: none; }
.creator .c-btn--light.c-btn--large { min-height: 56px; padding: 0 30px; font-size: 16px; }
/* v4: correzioni dalla verifica completa */
.creator .c-btn--light.c-btn--small { min-height: 38px; padding: 0 16px; font-size: 13px; }
/* S07: con un colore di sezione la texture si fonde invece di coprirlo */
/* v5: allineamenti che seguono la scelta dell'editor anche dove il design li fissava */
.creator .c-video__vuoto { position: absolute; inset: 0; display: grid; place-items: center; color: color-mix(in srgb, var(--c-bg) 70%, transparent); font-size: 14px; letter-spacing: .1em; text-transform: uppercase; }
/* ---- S16 sezione libera ---- */
/* ---- S17 recensioni video ---- */

/* ---- blocco Etichetta (eyebrow): piccola, maiuscola, spaziata ---- */
.creator .c-eyebrow { font-family: var(--c-font-eyebrow, var(--c-font-body)); font-size: 13px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--c-eyebrow, var(--c-accent)); }
.creator .c-eyebrow[data-line]::before { content: ""; display: inline-block; vertical-align: middle; width: 28px; height: 1px; margin-right: 12px; background: currentColor; }
.creator .c-blk.c-blk--eyebrow + .c-blk--heading { margin-top: 14px; }
/* ---- ombre e righe nelle sezioni scure ---- */
.creator.c-tone-dark .c-line { border-color: color-mix(in srgb, var(--c-ink) 18%, transparent); }

/* ---- foto con zoom d'entrata (.c-zoom: la classe zm-pre/zm-go la mette il JS solo se le animazioni sono attive) ---- */
.creator .c-zoom { overflow: hidden; }
.creator .c-zoom.zm-pre > .c-zoom__in { transform: scale(1.14); transition: transform 2.6s var(--c-out); will-change: transform; }
.creator .c-zoom.zm-pre.zm-go > .c-zoom__in { transform: none; }
.creator.c-noanim .c-zoom > .c-zoom__in { transform: none !important; transition: none; }

/* ---- foto di sfondo della sezione (gruppo «Foto di sfondo»): foto + velo nel colore della sezione, così il testo resta leggibile ---- */
.creator .c-bgphoto { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.creator .c-bgphoto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.creator .c-bgphoto__veil { position: absolute; inset: 0; background: color-mix(in srgb, var(--bgp-c, var(--c-sec-bg, var(--p-bg))) var(--bgp-a, 84%), transparent); }
/* PANNELLO v1 (20/10/2026): testo ricco nei blocchi, riga che si toglie, posizione e dimensione degli elementi */
.creator .c-rt p { font-size: inherit; line-height: inherit; }
.creator .c-rt p + p, .creator .c-rt p + ul, .creator .c-rt ul + p { margin-top: .75em; }
.creator .c-rt ul { list-style: disc; padding-left: 1.2em; }
.creator .c-rt ol { list-style: decimal; padding-left: 1.2em; }
.creator .c-rt a { text-decoration: underline; }
.creator .c-line.c-line--off { border-bottom-color: transparent !important; }
/* video in attesa del file vero: copertina + tasto play (demo, 20/10/2026) */
.creator .c-video__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.creator .c-play { position: absolute; left: 50%; top: 50%; width: clamp(56px, 8vw, 84px); translate: -50% -50%; color: var(--c-accent); filter: drop-shadow(0 10px 24px rgba(0,0,0,.28)); transition: scale .25s var(--c-out); pointer-events: none; }
.creator .c-play svg { display: block; width: 100%; height: auto; }
.creator .c-video:hover .c-play, .creator figure:hover .c-play { scale: 1.08; }
/* bonus con foto in alto (come le schede bonus dei siti WeLearn) */
.creator .s13__photo { margin: -36px -32px 6px; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--c-r-card) var(--c-r-card) 0 0; }
.creator .s13__photo img { width: 100%; height: 100%; object-fit: cover; }