@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');
/* ===== Override progetto Scandurra (modifiche di design sul sito riprodotto) ===== */

/* #6/#17 — Voci del menu header su una sola riga (niente a capo) + spaziatura */
/* la colonna del menu non deve restringere le voci: le lascio prendere la larghezza naturale */
.elementor-element-99bf7ad { width: auto !important; max-width: none !important; }
.elementor-element-99bf7ad,
.elementor-element-99bf7ad > .elementor-widget-container,
.elementor-element-99bf7ad .sc_layouts_menu { width: auto; display: inline-block; vertical-align: middle; }
#menu_main {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    column-gap: 42px;           /* spaziatura uniforme tra le voci, come nel design (~42px) */
    width: auto;
    max-width: max-content;
}
/* Ogni voce deve dimensionarsi sulla larghezza reale del testo: il tema le
   restringe alla min-content (parola più lunga) ma con nowrap il testo
   straborda e "SCUOLA GENITORI" finiva sovrapposto a "CONSULENZE".
   Forzo larghezza automatica + nowrap + niente padding orizzontale, così
   l'unica spaziatura tra le voci è il column-gap (uniforme). */
#menu_main > li {
    margin: 0 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
}
#menu_main > li > a,
#menu_main > li > a > span {
    display: inline-block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    white-space: nowrap !important;
    overflow: visible !important;
}
#menu_main > li > a { padding-left: 0 !important; padding-right: 0 !important; }

/* Logo header come nel design (~271×76). Lo tengo a 74px di altezza.
   IMPORTANTE: il tema imponeva max-width:100% così, restringendo la pagina,
   la larghezza del logo veniva schiacciata sulla colonna (ratio ~2.1 invece
   di 3.46) mentre l'altezza restava fissa → logo "schiacciato".
   Con max-width:none + width:auto la larghezza segue sempre il rapporto
   originale e il logo NON si deforma né cambia dimensione al resize. */
.elementor-element-74745d8 .logo_image,   /* logo header desktop */
.elementor-element-03025ce .logo_image {   /* logo header compatto/hamburger */
    height: 56px !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    flex: 0 0 auto !important;
}

/* ===== #17 — Header: riordino voci, niente Blog, niente lente ===== */
/* Ordine target: SCUOLA GENITORI · CONSULENZE · ALTA SENSIBILITÀ (no Blog) */
#menu_main > li:has(a[href*="scuola-genitori"]) { order: 1; }
#menu_main > li:has(a[href*="consulenza-pedagogica-montessoriana"]) { order: 2; }
#menu_main > li:has(a[href*="bambini-altamente-sensibili"]) { order: 3; }
#menu_main > li:has(a[href*="blog-montessori"]) { display: none !important; }
/* Nasconde il widget ricerca (lente) nell'header */
.elementor-widget-trx_sc_layouts_search { display: none !important; }
/* Il bottone ora ha un testo lungo: rendo la colonna header un flex row per
   distribuirla senza sovrapposizioni tra menu e bottone */
.elementor-element-332077b > .elementor-widget-wrap.elementor-element-populated {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    column-gap: 42px;           /* gap menu↔bottone uniforme, come nel design */
}
/* il bottone "Cerca per comportamento" (4034b3b) e l'hamburger (d36036b)
   avevano un margine sinistro di ~29px (regola del tema) che sommato al
   column-gap rendeva gli stacchi nav→bottone e bottone→hamburger troppo
   larghi (~71px). Lo azzero: così tutti gli stacchi restano uniformi a 42px,
   in linea col design (nav 42 · bottone 40 · hamburger 47). */
.elementor-element-332077b > .elementor-widget-wrap > .elementor-element-99bf7ad,
.elementor-element-332077b > .elementor-widget-wrap > .elementor-element-4034b3b,
.elementor-element-332077b > .elementor-widget-wrap > .elementor-element-d36036b {
    margin: 0 !important;
    flex: 0 0 auto !important;
}

/* Header: nella fascia "notebook" 1280–1439px l'header desktop (logo grande +
   menu + bottone + hamburger) non ci sta e il logo finiva sovrapposto al menu.
   In questa fascia mostro l'header compatto con il solo hamburger (lo stesso
   già usato sotto i 1280px), così il logo non si deforma né si rimpicciolisce:
   semplicemente, sotto i 1440px si passa al menu a hamburger.
   (breakpoint del tema: tablet ≤1279, notebook 1280–1679) */
@media (min-width: 1280px) and (max-width: 1439px) {
    .elementor-element-31da358 { display: none !important; }   /* riga header con menu esteso */
    .elementor-element-605bdcc { display: block !important; }  /* riga header compatta (hamburger) */
}

/* ===== Pagina testimonianze (621): contenuto a tutta larghezza =====
   Il body_style_wide limita .entry-content a ~962px e disallinea le sezioni
   full-bleed (titolo, filtri, card). Espando il contenuto come in home. */
body.page-id-621 .content_wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
body.page-id-621 .content_wrap > .content,
body.page-id-621 .post_item_single,
body.page-id-621 .post_content.entry-content {
    width: 100% !important;
    max-width: 100% !important;
}
body.page-id-621 .page_content_wrap { overflow-x: clip; }

/* ===== Pagina RASSEGNA (433): contenuto dentro il container =====
   post-content usa il layout "flow", quindi i blocchi articolo (wp:media-text,
   spacer, ecc.) vanno a tutta larghezza del viewport. Li riporto nel container
   standard (1320px, come header e altre sezioni). Il gruppo intestazione
   (.full-width .top-page-block) ha già un layout constrained interno e resta
   escluso così non ne altero l'allineamento. */
body.page-id-433 .wp-block-post-content > *:not(.full-width) {
    max-width: var(--container);
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
}
/* la sezione elementor copiata non deve sbordare oltre il viewport */
.cst-about-wrap { overflow-x: clip; }
.cst-about-wrap .elementor-section.elementor-top-section { margin-left: 0; margin-right: 0; }
/* come in home: la parte <strong> del titolo è rosa (la regola della home è
   scoped a .elementor-2050, qui la ripristino esplicitamente) */
.cst-about-wrap h2 strong { color: #F768BD; }
/* bottoni come in home: niente colore-link rosa né sottolineatura.
   "La mia storia" = testo scuro su outline; "Contattami" = testo bianco su teal. */
.cst-about-wrap .elementor-button,
.cst-about-wrap .elementor-button .elementor-button-text { text-decoration: none !important; }
.cst-about-wrap .elementor-element-a7afbca .elementor-button,
.cst-about-wrap .elementor-element-a7afbca .elementor-button .elementor-button-text { color: #262626 !important; }
.cst-about-wrap .elementor-element-0e9f0ef .elementor-button,
.cst-about-wrap .elementor-element-0e9f0ef .elementor-button .elementor-button-text { color: #ffffff !important; }

/* ===== cst-pagehead: titolo di sezione centrato su fondo rosa (da Titolo.svg) ===== */
.cst-pagehead {
    background: #F9F3F2;
    width: 100vw;                       /* full-bleed a tutta larghezza, come nell'SVG */
    margin-left: calc(50% - 50vw);
    padding: var(--vsp) 20px;
    text-align: center;
    box-sizing: border-box;
}
.cst-pagehead__inner {
    max-width: 1120px;
    margin: 0 auto;
}
.cst-pagehead__title {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    font-size: 50.88px;
    line-height: 1.1;
    color: #262626;
    margin: 0 0 28px;
}
.cst-pagehead__sub {
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    font-size: 31.68px;
    line-height: 1.086;
    color: #F768BD;
    margin: 0;
}
@media (max-width: 900px) {
    .cst-pagehead { padding: var(--vsp) 20px; }
    .cst-pagehead__title { font-size: 36px; }
    .cst-pagehead__sub { font-size: 22px; }
}
/* variante allineata a sinistra: titolo/sottotitolo a bandiera, allineati
   al bordo sinistro della colonna di contenuto (1320px) invece che centrati */
.cst-pagehead.is-align-left { text-align: left; }
.cst-pagehead.is-align-left .cst-pagehead__inner { max-width: 1320px; }

/* ===== cst-tgrid: griglia testimonianze a card (da Testimonianze.svg) ===== */
.cst-tgrid {
    background: #ffffff;
    padding: 0 0 70px;
}
.cst-tgrid__inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}
.cst-tgrid__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.cst-tgrid .cst-is-hidden { display: none; }
.cst-tgrid__footer {
    text-align: center;
    margin-top: 48px;
}
.cst-tgrid__more {
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 1;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #262626;
    background: transparent;
    border: 1px solid #262626;
    border-radius: 0;
    padding: 17px 40px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.cst-tgrid__more:hover { background: #262626; color: #ffffff; }
@media (max-width: 980px) {
    .cst-tgrid__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .cst-tgrid__grid { grid-template-columns: 1fr; }
    /* blog: card senza sfondo/bordo -> in colonna serve più stacco per non confonderle */
    .blog .cst-tgrid__grid { gap: 46px; }
}

/* ===== cst-filters: barra filtri categorie testimonianze (da Filtri.svg) ===== */
.cst-filters {
    padding: 40px 0;            /* 40px sopra e sotto, come richiesto */
    background: #ffffff;
}
.cst-filters__inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 14px;
}
.cst-filters__pill {
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #8A8A8A;
    background: transparent;
    border: 1px solid #8A8A8A;
    border-radius: 0;
    padding: 5px 16px;
    line-height: 1.4;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.cst-filters__pill:hover {
    color: #F768BD;
    border-color: #F768BD;
}
.cst-filters__pill--active,
.cst-filters__pill--active:hover {
    color: #ffffff;
    background: #F768BD;
    border-color: #F768BD;
}
/* variante per pagina dettaglio: pill allineati a sinistra (da Filtridettaglio.svg) */
.cst-filters--left .cst-filters__inner {
    justify-content: flex-start;
}
/* dropdown categorie (mobile): su desktop nascosto (restano i pill); sotto i 900px
   nasconde i pill e mostra il <select> generato da filters-dropdown.js. */
.cst-filters__select { display: none; }
@media (max-width: 900px) {
    .cst-filters__pill { display: none; }
    .cst-filters__select {
        display: block;
        width: 100%;
        font-family: "Quicksand", sans-serif;
        font-weight: 500;
        font-size: 15px;
        letter-spacing: 0.3px;
        text-transform: uppercase;
        color: #262626;
        background-color: #ffffff;
        border: 1px solid #8A8A8A;
        border-radius: 0;
        padding: 13px 44px 13px 16px;
        cursor: pointer;
        -webkit-appearance: none;
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23262626' stroke-width='1.6'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 16px center;
    }
    .cst-filters__select:focus { outline: none; border-color: #F768BD; }
}

/* ===== Sezione testimonianze statica (no JS slider) ===== */
.cst-testi {
    background: #ffffff;
    padding: var(--vsp) 20px;
    overflow-x: clip;            /* evita scroll orizzontale per le frecce fuori container */
}
.cst-testi__inner {
    max-width: 1320px;
    margin: 0 auto;
}
.cst-testi__eyebrow {
    text-align: center;
    color: #F768BD;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 18px;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__title {
    text-align: center;
    color: #262626;
    font-weight: 700;
    font-size: 47.04px;
    line-height: 1.021;
    letter-spacing: 0;
    margin: 0 0 36px;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__row {
    position: relative;
}
.cst-testi__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;            /* le card riempiono esattamente il container */
}
.cst-testi__arrow {
    position: absolute;
    top: 50%;
    color: #C9C3C1;
    font-size: 40px;
    line-height: 1;
    font-weight: 300;
    user-select: none;
    /* clickable (era <span>, ora <button>) */
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: color .2s ease;
    z-index: 2;
}
.cst-testi__arrow:hover:not(:disabled) { color: var(--pink); }
.cst-testi__arrow:disabled { opacity: .3; cursor: default; }
/* frecce FUORI dal container, a 48px dai bordi */
.cst-testi__row > .cst-testi__arrow:first-child {
    left: 0;
    transform: translate(calc(-100% - 48px), -50%);
}
.cst-testi__row > .cst-testi__arrow:last-child {
    right: 0;
    transform: translate(calc(100% + 48px), -50%);
}
.cst-testi__card {
    background: #F9F3F2;
    padding: 40px;
    display: flex;
    flex-direction: column;
    position: relative;
}
/* tutta la card cliccabile → pagina dettaglio (articolo/recensione) */
.cst-testi__read::after { content: ""; position: absolute; inset: 0; z-index: 1; }
/* …ma il TAG resta cliccabile a parte (sopra l'overlay) → pagina comportamento */
.hb-card__tag, .cst-testi__tag { position: relative; z-index: 2; text-decoration: none; cursor: pointer; }
.hb-card__tag:hover, .cst-testi__tag:hover { background: var(--pink); color: #fff; }
.cst-testi__head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}
.cst-testi__photo {
    width: 80px;
    height: 80px;
    border-radius: 50% !important;
    overflow: hidden;
    object-fit: cover;
    object-position: center;
    flex: 0 0 auto;
}
.cst-testi__name {
    font-weight: 600;
    color: #262626;
    font-size: 18px;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__tag {
    display: inline-block;
    align-self: flex-start;
    border: 1px solid #F768BD;
    color: #F768BD;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 0.5px;
    font-weight: 600;
    padding: 2px 8px;
    margin-bottom: 20px;
    line-height: 1.3;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__ctitle {
    font-weight: 700;
    color: #262626;
    font-size: 22px;
    line-height: 1.3;
    margin: 0 0 16px;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__text {
    color: #262626;
    line-height: 1.7;
    font-size: 16px;
    margin: 0 0 28px;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__read {
    margin-top: auto;
    color: #262626 !important;
    text-transform: uppercase;
    text-decoration: underline !important;
    text-underline-offset: 6px;
    text-decoration-thickness: 1px;
    font-size: 17px;
    font-weight: 500;
    letter-spacing: 0.5px;
    font-family: "Quicksand", sans-serif;
}
/* titolo card cliccabile verso la pagina dettaglio: mantiene lo stile del titolo (no rosa/sottolineatura del tema) */
.is_single .entry-content h3.cst-testi__ctitle a {
    color: inherit !important;
    text-decoration: none !important;
    transition: color 0.15s ease;
}
.is_single .entry-content h3.cst-testi__ctitle a:hover { color: #F768BD !important; }
.cst-testi__footer {
    text-align: center;
    margin-top: 44px;
}
.cst-testi__btn {
    display: inline-flex;
    align-items: center;
    gap: 28px;
    border: 1px solid #262626;
    color: #000000 !important;
    text-transform: uppercase;
    text-decoration: none !important;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 18px 32px;
    font-family: "Quicksand", sans-serif;
}
.cst-testi__btn-arrow {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}
.cst-testi__btn-arrow svg {
    display: block;
    width: 44px;
    height: 18px;
}

/* ===== Sezione "Contenuti gratuiti" statica (riusa .cst-testi*) ===== */
/* riga rosa del titolo (2ª riga) */
.cst-testi__title .pink { color: #F768BD; }
/* immagine in alto nella card (ratio ~16/10, angoli netti) */
.cst-feat__img {
    display: block;
    width: 100%;
    aspect-ratio: 440 / 283;     /* come Frame 65 */
    object-fit: cover;
    object-position: center;
    margin-bottom: 24px;
    border-radius: 0;
}
/* testo introduttivo articolo: Quicksand Medium 23/27 #262626 */
.cst-feat__text {
    color: #262626;
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    font-size: 23px;
    line-height: 27px;
    margin: 0 0 34px;
}
/* ===== Card "Contenuti gratuiti" come Frame 65: niente sfondo, su bianco, card centrale sfalsata ===== */
.cst-feat .cst-testi__card {
    background: transparent;
    padding: 0;
}
.cst-feat .cst-testi__tag { margin-bottom: 30px; }
.cst-feat .cst-testi__grid { align-items: start; }
.cst-feat .cst-testi__grid > .cst-testi__card:nth-child(2) { margin-top: 40px; }

/* ===== Sezione "Libri" statica (no JS slider) ===== */
.cst-libri {
    background: #ffffff;
    padding: var(--vsp) 20px;
    overflow-x: clip;
    position: relative;   /* riferimento per il pannello rosa full-bleed */
}
/* pannello rosa unico, fuori dalle slide: tocca il bordo destro del viewport */
.cst-libri__panelbg {
    position: absolute;
    top: calc(var(--vsp) / 2);       /* più alto: metà del padding sopra */
    bottom: calc(var(--vsp) / 2);    /* più alto: metà del padding sotto */
    right: 0;              /* arriva fino al bordo destro del viewport */
    left: 54%;             /* parte ~a metà-destra della sezione */
    background: #F9F3F2;
    z-index: 0;
}
.cst-libri__inner {
    position: relative;
    z-index: 1;            /* contenuto sopra al pannello rosa */
    max-width: 1320px;
    margin: 0 auto;
}
/* ogni slide è il vero contenitore flex testo+media; nascosta di default */
.cst-libri__slide { display: none; }
.cst-libri__slide.is-active {
    display: flex;
    align-items: flex-start;   /* allinea in alto testo e cover */
    gap: 40px;
}
/* pallini di navigazione */
.cst-libri__dots {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    max-width: 1320px;
    /* allinea i pallini sotto la cover: stesso offset sinistro della colonna media */
    margin: 28px auto 0;
    padding-left: calc(52% + 40px); /* salta la colonna testo (52%) + gap (40px) */
    box-sizing: border-box;
}
.cst-libri__dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #DADADA;
    cursor: pointer;
    transition: background .2s ease;
}
.cst-libri__dot.is-active { background: #262626; }
.cst-libri__dot:hover { background: #F768BD; }
.cst-libri__text { flex: 0 0 52%; max-width: 52%; }
.cst-libri__eyebrow { text-align: left; }
.cst-libri__title {
    color: #262626;
    font-weight: 700;
    font-size: 34px;
    line-height: 1.25;
    margin: 0 0 22px;
    max-width: 500px;      /* riga rosa più corta: va a capo prima */
    font-family: "Quicksand", sans-serif;
}
.cst-libri__title-pink { color: #F768BD; }
.cst-libri__desc {
    color: #636363;
    font-weight: 400;
    font-size: 19.2px;
    line-height: 1.3;
    margin: 0 0 32px;
    max-width: 540px;
    font-family: "Quicksand", sans-serif;
}
.cst-libri__btns {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
/* bottone outline scuro con freccia rosa (riusa .cst-testi__btn) */
.cst-libri__btn--outline {
    gap: 16px;
    background: transparent;
}
/* bottone pieno teal */
.cst-libri__btn--buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #007EA7;
    border: 1px solid #007EA7;
    color: #ffffff !important;
    text-transform: uppercase;
    text-decoration: none !important;
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 0;
    height: 57px;
    min-height: 57px;
    padding: 0 32px;
    box-sizing: border-box;
}
/* colonna destra: la cover sporge a sinistra del pannello rosa full-bleed */
.cst-libri__media {
    flex: 0 0 48%;
    max-width: 48%;
    position: relative;
    display: flex;
    align-items: flex-start;  /* cover ancorata in alto */
    justify-content: flex-start;
}
.cst-libri__cover {
    position: relative;
    z-index: 1;
    display: block;
    width: 320px;          /* cover più piccola */
    max-width: 70%;
    height: auto;
    aspect-ratio: 410 / 571;
    object-fit: contain;
    /* top della cover allineato al top del TITOLO (sotto l'eyebrow ~17px + 18px margine) */
    margin-top: 35px;
}
@media (max-width: 900px) {
    /* MOBILE: niente slider. È un binario flex con transform inline (JS): in colonna
       singola transform + riga flex sfasano le cover. Smonto la meccanica — track a
       blocco, transform annullata, entrambe le slide impilate (cascata) e pallini off. */
    .cst-libri__panelbg { display: none !important; }
    .cst-libri__viewport { overflow: visible !important; }
    .cst-libri__track { display: block !important; transform: none !important; }
    .cst-libri__dots { display: none !important; }
    /* Specificità rialzata col prefisso .cst-libri: i blocchi desktop "Libri #23"/
       "Libri.svg" più sotto nel file usano !important a specificità (0,1,0) e vengono
       DOPO in sorgente; qui (0,2,0) li batte comunque, a parità di !important. */
    .cst-libri .cst-libri__slide { flex-direction: column !important; align-items: stretch !important; gap: 24px !important; margin-bottom: 56px; }
    .cst-libri .cst-libri__slide:last-child { margin-bottom: 0; }
    .cst-libri .cst-libri__text, .cst-libri .cst-libri__media { flex: 1 1 auto !important; max-width: 100% !important; width: 100% !important; }
    .cst-libri .cst-libri__title { font-size: 30px; max-width: 100% !important; }
    .cst-libri .cst-libri__desc { max-width: 100% !important; }
    .cst-libri .cst-libri__media { justify-content: center !important; padding: 6px 0 0; }
    /* la cover sta in un .cst-libri__coverlink inline-block (larghezza = contenuto):
       una width in % qui è circolare e collassa a 0. Serve una misura assoluta. */
    /* annullo anche transform/margin del "cover a cavallo" desktop (translateX(-120px),
       margin-bottom:-56px globali più sotto): in cascata centrata sfaserebbero la cover. */
    .cst-libri .cst-libri__cover { width: 210px !important; max-width: none !important; margin-top: 0 !important; margin-bottom: 0 !important; transform: none !important; }
    /* i due bottoni (Scopri di più / Acquista) centrati sotto al testo */
    .cst-libri .cst-libri__btns { justify-content: center; }
}

/* ===== Freccine bottoni Elementor in linea col testo (no impilate/storte) — site-wide ===== */
.elementor-button .elementor-button-content-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px;
}
.elementor-button .elementor-button-icon {
    display: inline-flex;
    align-items: center;
    margin: 0;
}
.elementor-button .elementor-button-icon svg {
    display: block;
    width: 28px;
    height: auto;
    flex: 0 0 auto;
}

/* ===== Stile uniforme di TUTTI i bottoni — font Quicksand Medium 20/25, altezza 57px ===== */
.elementor-button,
.cst-testi__btn,
.cst-hero__btn.elementor-button {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 500 !important;          /* Medium */
    font-size: 20px !important;
    line-height: 25px !important;
    letter-spacing: 0 !important;
    height: 57px !important;
    min-height: 57px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    overflow: hidden;                     /* la freccia resta dentro al bottone */
}
.cst-testi__btn { gap: 16px; }
/* nav circolare (frecce) dello slider testimonianze — visibile solo su mobile */
.cst-testi__nav { display: none; }
.cst-testi__navbtn {
    width: 52px; height: 52px; border-radius: 50%;
    border: 1px solid #D8D2D0; background: #ffffff; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; padding: 0;
    transition: border-color .2s ease, background .2s ease;
}
.cst-testi__navbtn svg { width: 26px; height: 12px; display: block; }
.cst-testi__navbtn--prev svg { transform: rotate(180deg); }
.cst-testi__navbtn:hover { border-color: var(--pink); }
.cst-testi__navbtn:disabled { opacity: .35; cursor: default; }

/* ===== Variante carosello: grid orizzontale scrollabile con 3 card visibili
   (o meno in tablet/mobile), navigata dalle frecce sotto la griglia. */
.cst-testi--carousel .cst-testi__grid {
    display: grid;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 40px) / 3);      /* 3 card visibili + 2 gap da 20px */
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: none;                          /* la nav JS controlla lo scroll con precisione */
    /* NB: nessuno `scroll-behavior: smooth` qui — su Chrome + CSS grid scroller
       blocca sia scrollBy che l'assegnazione di scrollLeft. L'animazione viene
       gestita interamente in JS via requestAnimationFrame (view.js). */
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
    /* drag col mouse: cursore "afferrato" e no selezione testo durante il drag */
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    touch-action: pan-y;                             /* touch verticale del corpo pagina resta nativo */
}
.cst-testi--carousel .cst-testi__grid.is-dragging { cursor: grabbing; }
.cst-testi--carousel .cst-testi__grid.is-dragging * { pointer-events: none; }
.cst-testi--carousel .cst-testi__grid::-webkit-scrollbar { display: none; }
/* Nel carosello le frecce laterali sono la navigazione: la nav circolare in
 * fondo resta un fallback (visibile solo su mobile, come nel design HTML di
 * riferimento). */
.cst-testi--carousel .cst-testi__nav { display: none; }
@media (max-width: 640px) {
    .cst-testi--carousel .cst-testi__nav {
        display: flex;
        justify-content: center;
        gap: 18px;
        margin-top: 26px;
    }
}
/* Hover bordo rosa sulle card (colore primario). Bordo trasparente in stato
   base per evitare shift di layout al passaggio del mouse. */
.cst-testi__card {
    border: 2px solid transparent;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.cst-testi__card:hover {
    border-color: var(--pink);
}

@media (max-width: 880px) {
    .cst-testi { padding: var(--vsp) 16px; }   /* spaziatura verticale uniforme (--vsp) */
    .cst-testi__title { font-size: 30px; }
    .cst-testi__arrow { display: none; }
    /* carosello su tablet: 2 card visibili */
    .cst-testi--carousel .cst-testi__grid { grid-auto-columns: calc((100% - 20px) / 2); }
}
/* tablet (641-880): griglia a 2 colonne, niente slider/frecce */
@media (min-width: 641px) and (max-width: 880px) {
    .cst-testi__grid { grid-template-columns: repeat(2, 1fr); }
}
/* mobile vero (<=640): slider orizzontale, una card a tutta larghezza container per
   volta, con le frecce circolari. Solo qui (su tablet/desktop niente slider) per
   evitare l'overflow orizzontale che il binario causava dove c'è la scrollbar. */
@media (max-width: 640px) {
    .cst-testi__grid {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 100%;
        gap: 16px;
        padding-bottom: 4px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    /* mobile carosello: una card a schermo intero */
    .cst-testi--carousel .cst-testi__grid { grid-auto-columns: 100%; gap: 16px; }
    .cst-testi__grid::-webkit-scrollbar { display: none; }
    .cst-testi__card { scroll-snap-align: center; }
    .cst-testi__nav { display: flex; justify-content: center; gap: 18px; margin-top: 26px; }
    /* card un po' più larghe + testo meno stretto: riduco il padding esterno della sezione
       e quello interno (40px era troppo su mobile → card strette e lunghissime). */
    .cst-testi { padding-left: 12px; padding-right: 12px; }
    .cst-testi .cst-testi__inner { padding-left: 12px !important; padding-right: 12px !important; }
    .cst-testi__card { padding: 28px 22px; }
}

/* ===== cst-hero: hero statico home (riproduzione del hero live danielascandurra.com) ===== */
/* Rettangolo rosa #F9F3F2 a tutta altezza sul ~60% sinistro, bianco a destra;
   3 foto a destra (bebè, adolescente ribassata, bambino) che entrano da destra. */
/* Il rosa prosegue anche dietro all'header (solo in home), come sul sito live. */
body.home .top_panel {
    background: linear-gradient(to right, #F9F3F2 0, #F9F3F2 60%, #ffffff 60%, #ffffff 100%) !important;
}
.cst-hero {
    background: linear-gradient(to right, #F9F3F2 0, #F9F3F2 60%, #ffffff 60%, #ffffff 100%);
    padding: 60px 0;
    width: 100%;
    overflow: hidden;           /* nasconde le foto mentre entrano da destra */
}
.cst-hero__container {
    max-width: 1320px;          /* stesso container principale delle altre sezioni */
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 60px;
    box-sizing: border-box;
}
.cst-hero__text {
    flex: 0 1 42%;
    min-width: 0;
}
.cst-hero__title {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;            /* Figma: Quicksand Bold 50 / line-height 50 / Dark */
    font-size: 50px;
    line-height: 50px;
    color: #262626;
    margin: 0 0 26px;
}
.cst-hero__lead {
    font-family: "Montserrat", sans-serif;   /* Figma: Montserrat Regular 33 / line-height 35 / Rosa2 */
    font-weight: 400;
    font-size: 33px;
    line-height: 35px;
    color: #F768BD;              /* rgb(247,104,189) */
    margin: 0 0 40px;
}
/* Bottone primario: stesso stile dei bottoni pieni del sito (es. "Contattami") */
.cst-hero__btn.elementor-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #007EA7;
    text-transform: uppercase;
    font-family: "Quicksand", sans-serif;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 0.5px;
    text-decoration: none;
    padding: 15px 34px;
    border: none;
    border-radius: 0;
    transition: background-color 0.2s ease;
}
.cst-hero__btn.elementor-button,
.cst-hero__btn .elementor-button-text {
    color: #ffffff !important;   /* evita che il colore link rosa del tema sovrascriva il testo */
}
.cst-hero__btn.elementor-button:hover {
    background-color: #006688;
}
.cst-hero__media {
    flex: 1 1 58%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 2.5%;
    min-width: 0;
    /* le foto escono dal container e arrivano a 40px dal bordo destro dello
       schermo (non full-width). In entrata sbordano oltre, l'overflow le ritaglia. */
    margin-right: min(0px, calc(40px - (100vw - 100%) / 2));
}
.cst-hero__imgwrap {
    width: 31%;
    aspect-ratio: 290 / 600;     /* proporzioni reali delle foto */
    background: transparent;     /* nessuno sfondo dietro alle foto */
}
.cst-hero__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    box-shadow: none;            /* nessuna ombreggiatura intorno alle foto */
    /* Comparsa: ogni foto viene svelata da una maschera che si apre da
       sinistra verso destra (la foto resta ferma, cresce in larghezza).
       Stessa durata e stesso ritardo per tutte = si svelano insieme. */
    clip-path: inset(0 100% 0 0);
    animation: cstHeroReveal 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.3s both;
}
.cst-hero__imgwrap--1 { margin-top: 0; }
.cst-hero__imgwrap--2 { margin-top: 8%; }    /* foto centrale ribassata (~50px sul live) */
.cst-hero__imgwrap--3 { margin-top: 0; }

@keyframes cstHeroReveal {
    from { clip-path: inset(0 100% 0 0); }
    to   { clip-path: inset(0 0 0 0); }
}
/* NB: reveal SEMPRE attiva (scelta esplicita) — niente override prefers-reduced-motion,
   quindi parte anche con "movimento ridotto" di sistema attivo. */

@media (max-width: 900px) {
    /* HERO mobile: "una schermata". L'intera sezione occupa almeno l'altezza del
       viewport (svh = small viewport, evita il salto della barra URL) e il contenuto
       è centrato verticalmente; misure e spazi ridotti per starci tutto senza scroll. */
    .cst-hero {
        /* "una schermata" = header (≈92px su mobile) + hero. Sottraggo header + un
           margine: meno altezza vuota -> ~25% di spazio in meno sopra l'h1, restando
           comunque in una schermata. */
        min-height: calc(100vh - 114px);
        min-height: calc(100svh - 114px);
        display: flex;
        align-items: center;
        padding: 12px 0;
        box-sizing: border-box;
        background: #F9F3F2;     /* su mobile il rosa copre tutta la sezione */
    }
    /* contenuti un filo più larghi: riduco il gutter laterale (override del 20px !important globale) */
    .cst-hero__container { flex-direction: column; gap: 22px; padding-left: 12px !important; padding-right: 12px !important; }
    .cst-hero__text, .cst-hero__media { flex: 0 0 auto; width: 100%; }
    /* il base ha line-height in px FISSI (=~1.0 sui font desktop 50/33); coi font
       ridotti restano ~1.5-1.75 -> interlinea enorme. Qui le riporto proporzionate. */
    .cst-hero__title { font-size: 30px; line-height: 1.12; margin: 0 0 16px; }
    .cst-hero__lead { font-size: 19px; line-height: 1.3; margin: 0 0 24px; }
    .cst-hero__media { justify-content: center; gap: 2.5%; }
    /* le 3 foto: altezza fissa contenuta (crop cover) così la riga sta nello schermo. */
    .cst-hero__imgwrap { width: 31%; aspect-ratio: auto; height: 30vh; max-height: 230px; margin-top: 0; }
    .cst-hero__img { height: 100%; object-fit: cover; }
}

/* ===== JOB 2/#Banner CTA — banner statico al posto della newsletter ===== */
.cst-cta {
    position: relative;
    width: 100%;
    min-height: 520px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url("/wp-content/uploads/2025/06/webinar-cta-bg.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    box-sizing: border-box;
    padding: var(--vsp) 20px;
}
/* Solo home: banner più alto, lo spazio extra va SOPRA (distanza da "Inizia ora");
   contenuto ancorato in basso così il padding inferiore resta quello base (invariato). */
body.home .cst-cta {
    align-items: flex-end;
    min-height: 640px;
}
/* mobile: su desktop il contenuto è ancorato in basso (banner alto 640px); su mobile
   questo lo schiaccia in fondo -> lo ricentro e riduco l'altezza/padding del banner. */
@media (max-width: 900px) {
    .cst-cta { min-height: 0; padding: var(--vsp) 20px; }
    body.home .cst-cta { align-items: center; min-height: 0; }
    .cst-cta__title { font-size: 30px; margin-bottom: 20px; }
    .cst-cta__subtitle { margin-bottom: 34px; }
}
.cst-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(38, 38, 38, 0.7);
    z-index: 0;
}
.cst-cta__inner {
    position: relative;
    z-index: 1;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    color: #ffffff;
}
.cst-cta__eyebrow {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 14px;
    color: #F768BD;
    margin: 0 0 18px;
}
.cst-cta__title {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    color: #ffffff;
    font-size: 47.04px;
    line-height: 1.021;
    max-width: 823px;
    margin: 0 auto 30px;
}
.cst-cta__subtitle {
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.5;
    max-width: 800px;
    margin: 0 auto 50px;
}
.cst-cta__btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 18px;
    width: 424px;
    max-width: 100%;
    height: 56px;
    border: 1px solid #ffffff !important;
    background: transparent;
    color: #ffffff !important;
    font-family: "Quicksand", sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 16px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    transition: background 0.25s ease, color 0.25s ease;
    box-sizing: border-box;
}
.cst-cta__btn:hover { background: #ffffff; color: #262626 !important; }
.cst-cta__btn:hover .cst-cta__btn-arrow svg path { stroke: #262626; }

/* ===== cst-detail-hero: hero pagina dettaglio testimonianza (da Titolodettaglio.svg) ===== */
.cst-detail-hero {
    background: #F9F3F2;
    width: 100vw;                       /* full-bleed, come nell'SVG */
    margin-left: calc(50% - 50vw);
    padding: var(--vsp) 20px;
    text-align: center;
    box-sizing: border-box;
}
.cst-detail-hero__inner {
    max-width: 1120px;
    margin: 0 auto;
}
.cst-detail-hero__title {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    font-size: 50.88px;
    line-height: 1.1;
    color: #262626;
    margin: 0 0 48px;
}
.cst-detail-hero__author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
}
.cst-detail-hero__avatar {
    width: 80px;
    height: 80px;
    flex: 0 0 80px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}
.cst-detail-hero__name {
    font-family: "Quicksand", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 1.3;
    color: #262626;
    margin: 0;
}
@media (max-width: 900px) {
    .cst-detail-hero { padding: var(--vsp) 20px; }
    .cst-detail-hero__title { font-size: 32px; margin-bottom: 36px; }
    .cst-detail-hero__avatar { width: 64px; height: 64px; flex-basis: 64px; }
    .cst-detail-hero__name { font-size: 18px; }
}

/* ===== cst-detail-text: corpo testuale testimonianza (da "Solo txt dettaglio.svg") ===== */
.cst-detail-text {
    max-width: 1320px;          /* container generale, flush al bordo sinistro (x≈60) */
    margin: 0 auto;
    padding: 30px 0 90px;
    box-sizing: border-box;
}
.cst-detail-text__inner {
    max-width: 1014px;          /* larghezza invariata */
    margin: 0;                  /* allineato al bordo sinistro del container, non centrato */
}
.cst-detail-text__inner p.cst-detail-text__lead {
    font-family: "Montserrat", sans-serif;   /* da specifiche font: Montserrat Regular 33/35, colore Rosa2 */
    font-weight: 400;
    font-size: 31.68px;
    line-height: 1.086;
    color: #F768BD;
    margin: 0 0 40px;
}
.cst-detail-text__inner p {
    font-family: "Quicksand", sans-serif;     /* da specifiche font: Quicksand Regular 21/30 */
    font-weight: 400;
    font-size: 19.2px;
    line-height: 1.3;
    color: #636363;                           /* colore corpo esatto da SVG */
    margin: 0 0 24px;
}
/* bottone "Leggi altre testimonianze": solido teal (white uppercase) */
.cst-detail-text__btn { margin-top: 24px; }
.cst-detail-text a.cst-detail-text__btn {
    background: var(--teal);
    color: #fff !important;
    border: none;
    gap: 0;
    padding: 17px 46px;
}
.cst-detail-text a.cst-detail-text__btn .cst-testi__btn-arrow { display: none; }
/* override ad alta specificità contro le regole link del tema (.post_content a) */
.cst-detail-text a.cst-detail-text__btn,
.cst-detail-text a.cst-detail-text__btn:hover,
.cst-detail-text a.cst-detail-text__btn:focus,
.cst-detail-text a.cst-detail-text__btn span {
    text-decoration: none !important;
    box-shadow: none !important;
    border-bottom: none !important;
    background-image: none !important;
}
@media (max-width: 900px) {
    .cst-detail-text { padding: 20px 20px 60px; }
    .cst-detail-text__lead { font-size: 24px; line-height: 1.2; margin-bottom: 30px; }
    .cst-detail-text__inner p { font-size: 18px; line-height: 1.5; }
}
.cst-cta__btn-arrow { display: inline-flex; align-items: center; line-height: 0; }
.cst-cta__btn-arrow svg { display: block; width: 40px; height: 16px; }
/* mobile: col testo su due righe la freccia (flex sibling) veniva spinta al bordo
   destro, staccata dal testo. La rendo inline, subito dopo l'ultima parola, e centro. */
@media (max-width: 900px) {
    .cst-cta__btn { display: block !important; height: auto !important; width: 424px; max-width: 100%; padding: 16px 22px !important; line-height: 1.35 !important; text-align: center; }
    .cst-cta__btn-arrow { display: inline-flex; vertical-align: middle; margin-left: 12px; line-height: 0; }
}
@media (max-width: 768px) {
    .cst-cta { min-height: 0; padding: var(--vsp) 18px; }
    .cst-cta__title { font-size: 30px; }
    .cst-cta__subtitle { font-size: 18px; }
}


/* ===== cst-about: sezione "Mi chiamo Daniela Scandurra" (CSS per-id ripreso dalla home, pagina testimonianze) ===== */
.elementor-2050 .elementor-element.elementor-element-88c94b5 .trx_addons_bg_text{z-index:0;}
.elementor-2050 .elementor-element.elementor-element-88c94b5 .trx_addons_bg_text.trx_addons_marquee_wrap:not(.trx_addons_marquee_reverse) .trx_addons_marquee_element{padding-right:50px;}
.elementor-2050 .elementor-element.elementor-element-88c94b5 .trx_addons_bg_text.trx_addons_marquee_wrap.trx_addons_marquee_reverse .trx_addons_marquee_element{padding-left:50px;}
.elementor-2050 .elementor-element.elementor-element-88c94b5{margin-top:85px;margin-bottom:0px;}
.elementor-2050 .elementor-element.elementor-element-1d9867a > .elementor-element-populated.elementor-column-wrap{padding:0px 20px 0px 0px;}
.elementor-2050 .elementor-element.elementor-element-1d9867a > .elementor-element-populated.elementor-widget-wrap{padding:0px 20px 0px 0px;}
.elementor-2050 .elementor-element.elementor-element-d377641{text-align:center;}
.elementor-2050 .elementor-element.elementor-element-5194c9a2 .sc_item_title_text{-webkit-text-stroke-width:0px;font-size:120px;font-weight:400;line-height:1.2em;}
.elementor-2050 .elementor-element.elementor-element-5194c9a2 .sc_item_title_text2{-webkit-text-stroke-width:0px;}
.elementor-bc-flex-widget .elementor-2050 .elementor-element.elementor-element-be6a4d5.elementor-column .elementor-widget-wrap{align-items:center;}
.elementor-2050 .elementor-element.elementor-element-be6a4d5.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}
.elementor-2050 .elementor-element.elementor-element-da904fa > .elementor-widget-container{margin:0px 0px 35px 0px;}
.elementor-2050 .elementor-element.elementor-element-da904fa{font-size:20px;line-height:1.4em;}
.elementor-2050 .elementor-element.elementor-element-a7afbca{width:auto;max-width:auto;}
.elementor-2050 .elementor-element.elementor-element-a7afbca .elementor-button-content-wrapper{flex-direction:row-reverse;}
.elementor-2050 .elementor-element.elementor-element-a7afbca .elementor-button .elementor-button-content-wrapper{gap:13px;}
.elementor-2050 .elementor-element.elementor-element-88c94b5{margin-top:35px;margin-bottom:0px;}
.elementor-2050 .elementor-element.elementor-element-1d9867a > .elementor-element-populated.elementor-column-wrap{padding:0px 0px 0px 0px;}
.elementor-2050 .elementor-element.elementor-element-1d9867a > .elementor-element-populated.elementor-widget-wrap{padding:0px 0px 0px 0px;}
.elementor-2050 .elementor-element.elementor-element-5194c9a2 > .elementor-widget-container{margin:0px 0px -20px 0px;}
.elementor-2050 .elementor-element.elementor-element-a7afbca{width:100%;max-width:100%;}
.elementor-2050 .elementor-element.elementor-element-a7afbca > .elementor-widget-container{margin:0px 0px 17px 0px;padding:0px 0px 0px 0px;}


/* Eyebrow sezione servizi (tema) — stesso stile/distanza degli eyebrow custom (come banner) */
.elementor-element-1ba33b0 .elementor-heading-title {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    color: #F768BD !important;
}
.elementor-element-1ba33b0 { margin-bottom: 18px !important; }

/* Bottone "LA MIA STORIA" (about, id a7afbca, riusato in più pagine):
   freccia a DESTRA, in linea e centrata DENTRO al bottone (no freccia sopra) */
.elementor-element-a7afbca .elementor-button-content-wrapper {
    display: inline-flex !important;
    flex-direction: row-reverse !important;   /* icona (1ª nel DOM) va a destra */
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
}
.elementor-element-a7afbca .elementor-button-icon {
    display: inline-flex !important;
    align-items: center;
    line-height: 0;
    margin: 0 !important;
    flex: 0 0 auto;
}
.elementor-element-a7afbca .elementor-button-icon svg { width: 34px !important; height: 14px !important; display: block; }

/* Fix dimensione freccia bottone LA MIA STORIA (svg collassava a 0 per width:1em del tema) */
.elementor-element-a7afbca .elementor-button-icon { font-size: 16px !important; width: auto !important; min-width: 36px !important; overflow: visible !important; }
.elementor-element-a7afbca .elementor-button-icon svg {
    width: 36px !important;
    height: 15px !important;
    min-width: 36px !important;
    display: block !important;
    flex: 0 0 auto !important;
}
.elementor-element-a7afbca .elementor-button { overflow: visible !important; }

/* Annulla l'animazione hover del tema che mette l'icona in absolute (freccia sopra) */
.elementor-element-a7afbca .elementor-button-content-wrapper,
.elementor-element-a7afbca .elementor-button-icon,
.elementor-element-a7afbca .elementor-button-icon svg,
.elementor-element-a7afbca .elementor-button-text {
    position: static !important;
    transform: none !important;
    transition: none !important;
    top: auto !important;
    left: auto !important;
    inset: auto !important;
}
.elementor-element-a7afbca .elementor-button-icon {
    display: inline-flex !important;
    align-items: center !important;
    height: auto !important;
    line-height: 0 !important;
}

/* Sezione "Mi chiamo Daniela": i due bottoni (LA MIA STORIA + CONTATTAMI) in linea, affiancati */
.elementor-element-a7afbca { width: auto !important; max-width: none !important; }

/* Frecce accanto alle CTA "Dettagli del percorso" / "Cosa ti offro" (sezione Montessori in famiglia) */
.cst-cardlink { display: inline-flex !important; align-items: center; gap: 12px; }
.cst-cardlink__arrow { display: inline-flex; align-items: center; line-height: 0; }
.cst-cardlink__arrow svg { display: block; width: 36px; height: 15px; }

/* ===== Libri #23: pannello fisso, testo più largo, meno gap, cover, pallini centrati ===== */
.cst-libri__panelbg { top: 150px !important; bottom: auto !important; height: 470px !important; left: 52% !important; }
.cst-libri__slide.is-active { gap: 24px !important; }
.cst-libri__text { flex: 0 0 56% !important; max-width: 56% !important; }
.cst-libri__title { max-width: 600px !important; }
.cst-libri__desc { max-width: 600px !important; }
.cst-libri__media { justify-content: center !important; }
.cst-libri__cover { width: 360px !important; }
.cst-libri__dots { padding-left: 56% !important; padding-right: 0 !important; justify-content: center !important; }

/* ===== Blog "Contenuti gratuiti": ripristino hover zoom sulle immagini ===== */
.cst-feat__imgwrap { display: block; overflow: hidden; }
.cst-feat__img { transition: transform .55s ease; }
.cst-feat .cst-testi__card:hover .cst-feat__img { transform: scale(1.06); }

/* Allineamento dei due bottoni about (stessa linea, stessa altezza) */
.elementor-element-a7afbca > .elementor-widget-container,
.elementor-element-0e9f0ef > .elementor-widget-container { margin-top: 0 !important; margin-bottom: 0 !important; }
.elementor-element-a7afbca, .elementor-element-0e9f0ef { align-self: flex-start !important; }

/* ===== Blog "Contenuti gratuiti": overlay + lente d'ingrandimento all'hover (come live) ===== */
.cst-feat__imgwrap { position: relative; }
.cst-feat__imgwrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(38, 38, 38, 0.45);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='7'/%3E%3Cline x1='15.5' y1='15.5' x2='21' y2='21'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none;
}
.cst-feat .cst-testi__card:hover .cst-feat__imgwrap::after { opacity: 1; }

/* ===== Libri: riposizionamento secondo Libri.svg (testo 50%, cover, pannello 58% full-bleed, pallini centrati sotto la cover) =====
   SOLO desktop: questi !important forzano testo al 56% e cover affiancata; sotto i
   900px la slide stacka (vedi @media max-width:900px più sopra), quindi qui scopo a
   min-width:901px o il !important vincerebbe sul layout a colonna e schiaccerebbe il testo. */
@media (min-width: 901px) {
.cst-libri__text { flex: 0 0 56% !important; max-width: 56% !important; }
.cst-libri__title { max-width: 600px !important; }
.cst-libri__desc { max-width: 600px !important; }
.cst-libri__slide.is-active { gap: 24px !important; }
.cst-libri__media { justify-content: center !important; }
.cst-libri__cover { width: 440px !important; max-width: 100% !important;
  box-shadow: 0 22px 34px -12px rgba(0,0,0,.28) !important; }
.cst-libri__panelbg { left: 58% !important; top: 70px !important; bottom: auto !important; height: 540px !important; }
.cst-libri__dots { padding-left: 0 !important; padding-right: 0 !important; justify-content: flex-start !important; margin-left: calc(50% + 200px) !important; }
}
.cst-libri__dot { width: 12px !important; height: 12px !important; background: #ffffff !important; border: 1px solid #DADADA !important; }
.cst-libri__dot.is-active { background: #DADADA !important; border-color: #DADADA !important; }

/* Contenuti gratuiti: più spazio tra il titolo e le card */
.cst-feat .cst-testi__title { margin-bottom: 56px !important; }
/* About "Mi chiamo Daniela": padding sopra la sezione (home + altre pagine, stesso id 88c94b5) */
.elementor-element-88c94b5 { padding-top: 60px !important; }
.cst-about-wrap .elementor-element-88c94b5 { padding-top: 60px !important; }

/* ===== cst-list-icons: icone delle liste contenuto (da advice-child/style.css) =====
   Il tema definisce .page_content_wrap ul.<nome>-list li:before con URL ASSOLUTI
   (url(/wp-content/...)), che nell'export statico (path relativi) non si risolvono e
   lasciano le liste senza icona. Qui ridichiaro solo background-image con path RELATIVO
   (custom-overrides.css carica dopo lo style del tema, quindi vince a parità di specificità).
   Usato in consulenza-pedagogica-montessoriana.html: lista benefici = checkmarks-list,
   lista "Se tuo figlio" = alert-triangle-list. */
.page_content_wrap ul.checkmarks-list li:before   { background-image: url(/wp-content/uploads/2025/05/checkmark-icon.svg) !important; }
.page_content_wrap ul.close-list li:before        { background-image: url(/wp-content/uploads/2025/05/close-icon.svg) !important; }
.page_content_wrap ul.star-list li:before         { background-image: url(/wp-content/uploads/2025/05/star-icon.svg) !important; }
.page_content_wrap ul.gift-list li:before         { background-image: url(/wp-content/uploads/2025/05/gift-icon.svg) !important; }
.page_content_wrap ul.alert-triangle-list li:before { background-image: url(/wp-content/uploads/2025/05/alert-triangle-icon.svg) !important; }
.page_content_wrap ul.smile-list li:before        { background-image: url(/wp-content/uploads/2025/05/smile-icon.svg) !important; }
.page_content_wrap ul.target-list li:before       { background-image: url(/wp-content/uploads/2025/05/target-icon.svg) !important; }
.page_content_wrap ul.downscale-list li:before    { background-image: url(/wp-content/uploads/2025/05/downscale-icon.svg) !important; }
.page_content_wrap ul.upscale-list li:before      { background-image: url(/wp-content/uploads/2025/05/upscale-icon.svg) !important; }
.page_content_wrap ul.idea-list li:before         { background-image: url(/wp-content/uploads/2025/05/idea-icon.svg) !important; }
.page_content_wrap ul.balloon-list li:before      { background-image: url(/wp-content/uploads/2025/05/balloon-icon.svg) !important; }
.page_content_wrap ul.heart-list li:before        { background-image: url(/wp-content/uploads/2025/05/heart-icon.svg) !important; }
.page_content_wrap ul.question-list li:before     { background-image: url(/wp-content/uploads/2025/05/question-icon.svg) !important; }
.page_content_wrap ul.hand-list li:before         { background-image: url(/wp-content/uploads/2025/05/hand-icon.svg) !important; }
.page_content_wrap ul.pin-list li:before          { background-image: url(/wp-content/uploads/2025/05/pin-icon.svg) !important; }
.page_content_wrap ul.house-list li:before        { background-image: url(/wp-content/uploads/2025/05/home-icon.svg) !important; }

/* ===== Libri: correzioni cover/pannello/pallini (da Libri.svg) ===== */
/* cover più piccola (SVG 479 su 1640 ≈ proporzione ridotta) */
.cst-libri__cover { width: 340px !important; }
/* pannello rosa: sborda SOPRA e SOTTO la cover e anche oltre i pallini (più alto, fisso) */
.cst-libri__panelbg { left: 60% !important; top: 96px !important; bottom: auto !important; height: 560px !important; }
/* selettore: due PALLINI tondi (non quadrati), bordo sottile */
.cst-libri__dot {
    border-radius: 50% !important;
    width: 12px !important;
    height: 12px !important;
    padding: 0 !important;
    border: 1.5px solid #DADADA !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}
.cst-libri__dot.is-active { background: #DADADA !important; border-color: #DADADA !important; }
.cst-libri__dots { margin-left: calc(50% + 158px) !important; padding-left: 0 !important; justify-content: flex-start !important; gap: 8px !important; }

/* Libri: pannello con sbordo SIMMETRICO sopra/sotto la cover (65px per lato) + pallini un filo più grandi */
.cst-libri__panelbg { top: 40px !important; height: 604px !important; }
.cst-libri__dot { width: 14px !important; height: 14px !important; }
.cst-libri__dots { gap: 9px !important; }

/* Libri: cover a cavallo (sborda sotto) + spostata 40px a sinistra + pallini centrati sotto la cover */
.cst-libri__cover { margin-bottom: -56px !important; position: relative !important; z-index: 2 !important; transform: translateX(-120px) !important; }
.cst-libri__dots { margin-left: auto !important; margin-right: 0 !important; width: calc(44% - 24px) !important; justify-content: center !important; padding: 0 !important; transform: translateX(-120px) !important; }

/* ===== webinar.html: header con sfondo bianco (solo questa pagina) =====
   La pagina condivide le classi body della home (page-id-2050), quindi uso
   la classe custom .cst-page-webinar sul <body> per non toccare la home.
   La sezione header (31da358) è trasparente e lascia vedere lo sfondo pagina
   (#F9F3F2): forzo il bianco sul top_panel e sulla sezione elementor. */
body.cst-page-webinar .top_panel.top_panel_custom { background-color: #ffffff !important; }
body.cst-page-webinar .elementor-2042 .elementor-element-31da358 { background-color: #ffffff !important; }

/* ===== webinar.html: hero usa cst-pagehead; senza sottotitolo azzero il margine del titolo ===== */
.cst-pagehead__title:last-child { margin-bottom: 0; }

/* ===== cst-webintro: sezione "Prima di premere Play" a 2 colonne (da Introwebinar.svg) ===== */
.cst-webintro {
    background: #ffffff;
    padding: var(--vsp) 20px;
    box-sizing: border-box;
}
.cst-webintro__inner {
    max-width: 1320px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;     /* tre container impilati: titolo · testo · autrice */
    gap: 34px;
}
/* ogni container è una griglia a due colonne uguali, così le colonne
   restano allineate fra titolo, testo e autrice (come nell'SVG) */
.cst-webintro__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
}
.cst-webintro__cell { min-width: 0; }
.cst-webintro__row--author { margin-top: 8px; }   /* un filo più d'aria prima dell'autrice */
.cst-webintro__title {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    font-size: 47.04px;
    line-height: 1.021;
    color: #262626;
    margin: 0;                  /* la spaziatura verticale la gestisce il gap dei container */
}
.cst-webintro__p {
    font-family: "Quicksand", sans-serif;
    font-weight: 400;
    font-size: 19.2px;
    line-height: 1.3;
    color: #636363;
    margin: 0 0 20px;
}
.cst-webintro__p:last-child { margin-bottom: 0; }
.cst-webintro__p--pink {
    color: #F768BD;
    font-weight: 500;
}
.cst-webintro__author {
    display: flex;
    align-items: center;
    gap: 16px;                  /* dentro la seconda colonna, allineata a sinistra come nell'SVG */
}
.cst-webintro__photo {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center top;
    flex: 0 0 auto;
    display: block;
}
.cst-webintro__meta { display: flex; flex-direction: column; line-height: 1.3; }
.cst-webintro__name {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: #262626;
}
.cst-webintro__role {
    font-family: "Quicksand", sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #636363;
}
@media (max-width: 768px) {
    .cst-webintro { padding: var(--vsp) 20px; }
    .cst-webintro__inner { gap: 22px; }
    .cst-webintro__row { grid-template-columns: 1fr; gap: 22px; }
    .cst-webintro__cell:empty { display: none; }   /* niente celle vuote a mobile */
    .cst-webintro__title { font-size: 26px; }
}
/* cst-webform (Accedi al webinar): senza regola mobile restava a 2 colonne con gap
   118px e sforava lo schermo. Stack a colonna full-width. */
@media (max-width: 900px) {
    .cst-webform__inner { flex-direction: column; gap: 28px; }
    .cst-webform__media, .cst-webform__box { flex: 1 1 auto; width: 100%; }
    .cst-webform__img { min-height: 240px; }
    .cst-webform__box { padding: 32px 22px; }
    .cst-webform__title { font-size: 30px; }
}

/* ===== cst-webform: form "Accedi al webinar" — PLACEHOLDER per embed ActiveCampaign (da Accediwebinar.svg) ===== */
.cst-webform {
    background: #ffffff;
    padding: var(--vsp) 20px;
    box-sizing: border-box;
}
.cst-webform__inner {
    max-width: 1320px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;       /* immagine e form stessa altezza */
    gap: 118px;                 /* padding centrale richiesto */
}
.cst-webform__media {
    flex: 1 1 calc(50% - 59px); /* metà esatta: immagine e form stessa larghezza */
    min-width: 0;
}
.cst-webform__img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 340px;
    object-fit: cover;
}
.cst-webform__box {
    flex: 1 1 calc(50% - 59px); /* metà esatta, uguale all'immagine */
    min-width: 0;
    box-sizing: border-box;
    background: #ffffff;
    border: 1px solid #F768BD;       /* bordo rosa sottile, come nell'SVG */
    padding: 48px 40px;
}
.cst-webform__title {
    font-family: "Quicksand", sans-serif;
    font-weight: 700;
    font-size: 47.04px;
    line-height: 1.021;
    color: #262626;
    margin: 0 0 16px;
}
.cst-webform__lead {
    font-family: "Quicksand", sans-serif;
    font-weight: 400;
    font-size: 19.2px;
    line-height: 1.3;
    color: #636363;
    margin: 0 0 30px;
}
.cst-webform__label {
    display: block;
    font-family: "Quicksand", sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #636363;
    margin-bottom: 8px;
}
.cst-webform__input {
    display: block;
    width: 100%;
    box-sizing: border-box;
    height: 40px;
    padding: 8px 14px;
    font-family: "Quicksand", sans-serif;
    font-size: 15px;
    color: #262626;
    background: #ffffff;
    border: 1px solid #E9E4E0;       /* colore bordo input dall'SVG */
    border-radius: 0;
    margin-bottom: 22px;
}
.cst-webform__input:focus { outline: none; border-color: #F768BD; }
.cst-webform__check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-family: "Quicksand", sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #636363;
    margin-bottom: 24px;
}
.cst-webform__check input[type="checkbox"] { margin-top: 2px; flex: 0 0 auto; }
.cst-webform__check a { color: #636363; text-decoration: underline; }
.cst-webform__recaptcha {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 344px;
    max-width: 100%;
    box-sizing: border-box;
    height: 78px;
    padding: 0 16px;
    margin-bottom: 26px;
    background: #f9f9f9;
    border: 1px solid #d3d3d3;
    border-radius: 3px;
}
.cst-webform__recaptcha-box {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    background: #ffffff;
    border: 2px solid #c1c1c1;
    border-radius: 2px;
}
.cst-webform__recaptcha-label {
    font-family: "Quicksand", sans-serif;
    font-size: 14px;
    color: #555555;
}
.cst-webform__btn {
    display: inline-block;
    border: none;
    cursor: pointer;
    min-width: 279px;
    height: 57px;
    padding: 0 28px;
    font-family: "Quicksand", sans-serif;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 0.5px;
    color: #ffffff;
    background: #007EA7;              /* blu/teal accent, come nell'SVG */
    border-radius: 0;
    transition: background 0.2s;
}
.cst-webform__btn:hover { background: #006a8d; }
.cst-webform__note {
    margin: 24px 0 0;
    font-family: "Quicksand", sans-serif;
    font-size: 13px;
    color: #636363;
}

/* webintro + webform: stack su mobile */
@media (max-width: 900px) {
    .cst-webintro { padding: var(--vsp) 20px; }
    .cst-webintro__inner { flex-direction: column; gap: 40px; }
    .cst-webintro__col { flex: 1 1 100%; }
    .cst-webintro__title { font-size: 26px; }
    .cst-webform { padding: 0 20px var(--vsp); }
    /* quando il webform segue il banner webinar (pagine comportamento) l'immagine
       restava attaccata al banner colorato: ripristino lo stacco superiore SOLO lì
       (su webinar.html il webform segue cst-webintro che ha già il suo margine). */
    .cst-cta ~ .cst-webform { padding-top: var(--vsp); }
    .cst-webform__inner { flex-direction: column; gap: 28px; }
    .cst-webform__media, .cst-webform__box { flex: 1 1 100%; }
    .cst-webform__img { min-height: 240px; }
    .cst-webform__box { padding: 32px 24px; }
    .cst-webform__title { font-size: 26px; }
}

/* About "Mi chiamo Daniela": immagine allineata a SINISTRA del container (era centrata nella colonna -> 43px di vuoto a sx) */
.elementor-element-88c94b5 .elementor-widget-container:has(> img) { text-align: left !important; }

/* Testimonianze "Cosa dicono...": più padding sotto il titolo (vale per tutte le pagine, classe condivisa) */
.cst-testi__title { margin-bottom: 58px !important; }

/* ===== Libri slider: scorrimento fluido (transform) + trascinamento (drag/swipe) ===== */
.cst-libri__viewport { overflow: hidden; width: 100%; touch-action: pan-y; cursor: grab; }
.cst-libri__viewport.is-grabbing { cursor: grabbing; user-select: none; }
.cst-libri__track { display: flex; transition: transform .55s cubic-bezier(.22,.61,.36,1); will-change: transform; }
/* le slide ora stanno entrambe nel binario (niente più display:none/toggle istantaneo) */
.cst-libri__slide { display: flex !important; flex: 0 0 100%; min-width: 0; align-items: flex-start; gap: 24px; }

/* Libri: cover cliccabile (stesso link di "Scopri di più") */
.cst-libri__coverlink { display: inline-block; line-height: 0; cursor: pointer; }

/* ===== cst-cta: fix spaziatura webinar quando il banner è dentro il footer .elementor
   (regole tema/Elementor come ".elementor p" battono per specificità le classi singole,
   azzerando i margini di titolo/sottotitolo → bottone attaccato al testo). Forziamo il ritmo verticale. ===== */
.cst-cta .cst-cta__eyebrow  { margin: 0 0 18px !important; }
.cst-cta .cst-cta__title    { margin: 0 auto 30px !important; }
.cst-cta .cst-cta__subtitle { margin: 0 auto 50px !important; }

/* ===== chi-sono: pagina "Chi sono" (de-Elementor, contenuto Gutenberg) =====
   Hero full-bleed con split crema/bianco a 65.3% del viewport (foto che attraversa
   il confine, come lo split dell'header). Corpo = colonna 1005px allineata a
   sinistra nel container 1320; box "beige" crema a fondo (#come_posso). */
/* container principale di riferimento: 1320 flush (come heroBlock/entry del sito,
   contenuto a sinistra ~60px @1440). Padding solo quando il viewport lo richiede. */
.chisono__wrap{max-width:1320px;margin:0 auto;padding:0;}
@media(max-width:1360px){.chisono__wrap{padding:0 20px;}}

/* hero trasparente: la crema viene dal rettangolo di sfondo (body::before) */
.chisono-hero{background:transparent;}
/* LAYOUT HERO CONDIVISO — identico su chi-sono / scuola-genitori / bambini / consulenza.
   Titolo in alto (align-items:flex-start), testo a sx + immagine al bordo dx (space-between). */
.chisono-hero .chisono__wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:60px;padding:var(--vsp) 0;}
.chisono-hero__text{flex:0 0 645px;max-width:645px;min-width:0;}
.chisono-hero__img{flex:0 0 452px;}
.chisono-hero__img img{display:block;width:452px;height:452px;object-fit:cover;}
.chisono-hero__text h1{font-family:"Quicksand",sans-serif;font-size:50.88px;font-weight:700;line-height:55.97px;color:var(--ink);margin:0 0 20px;}
.chisono-hero__text .lead{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;line-height:34.4px;color:var(--pink);margin:0 0 20px;}
.chisono-hero__text .medium{font-family:"Quicksand",sans-serif;font-size:20px;font-weight:400;line-height:26px;color:#6B6E71;margin:0 0 36px;}

.btn-teal{display:inline-block;background:var(--teal);color:#fff !important;
  font-family:"Quicksand",sans-serif;font-size:17px;font-weight:700;text-transform:uppercase;
  letter-spacing:.3px;padding:17px 57px 18px;text-decoration:none !important;line-height:1.2;}
.btn-teal:hover{opacity:.92;}

/* Corpo: ogni blocco ha solo margin-bottom (il gap fra fratelli = mb del precedente,
   come nel layout Gutenberg originale). Niente margin-top sugli heading. */
.chisono-body{padding:var(--vsp) 0;}
.chisono-body .chisono__wrap > *,
.chisono-body .video,
.chisono-beige{max-width:1005px;}
.chisono-body h2,.chisono-beige h2{font-family:"Quicksand",sans-serif;font-size:47.04px;font-weight:700;line-height:48.03px;color:var(--ink);margin:0 0 20px;}
.chisono-body h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;line-height:34.4px;color:var(--ink);margin:0 0 20px;}
.chisono-body p,.chisono-beige p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:24.96px;color:#6B6E71;margin:0 0 34.56px;}
.chisono-body strong,.chisono-beige strong{font-weight:700;color:inherit;}
/* nel tema, <strong> dentro un heading è ROSA (nei paragrafi resta grigio) */
.chisono-body h2 strong,.chisono-body h3 strong,.chisono-beige h2 strong{color:var(--pink);}
.chisono-body a,.chisono-beige a{color:var(--pink);text-decoration:underline;}
.chisono-body .video{margin:var(--vsp) 0;}
.chisono-body .video iframe{width:100%;aspect-ratio:16/9;height:auto;display:block;border:0;}
.chisono .spacer{height:30px;}

/* box "Come posso esserti d'aiuto": crema che SBORDA full-width verso sinistra
   (box-shadow), come nel live (::before a left negativo). */
.chisono-beige{background:var(--cream);padding:var(--vsp) 0;margin:var(--vsp) 0;position:relative;}
.chisono-beige::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:100vw;background:var(--cream);}

@media(max-width:900px){
  .chisono-hero{background:var(--cream);}
  .chisono-hero .chisono__wrap{flex-direction:column;align-items:flex-start;gap:28px;}
  /* in colonna il flex-basis:645px diventa ALTEZZA (con shrink:0) -> testo alto 645px
     e grande vuoto prima dell'immagine. Riporto basis ad auto. */
  .chisono-hero__text{flex:0 0 auto;width:100%;max-width:100%;}
  .chisono-hero__img{flex:0 0 auto;width:100%;}
  .chisono-hero__img img{width:100%;height:auto;max-width:452px;margin:0;}
  .chisono-hero__text h1{font-size:32px;line-height:1.12;margin:0 0 16px;}
  .chisono-hero__text .lead{font-size:24px;line-height:1.3;}
  .chisono-body h2,.chisono-beige h2{font-size:32px;}
  .chisono-body h3{font-size:24px;}
}

/* ===== Utility riusabili (container di riferimento + box crema bleed-left) ===== */
.wrap{max-width:1320px;margin:0 auto;padding:0;}
@media(max-width:1360px){.wrap{padding:0 20px;}}
.beige-box{background:var(--cream);padding:var(--vsp) 0;margin:var(--vsp) 0;position:relative;}
.beige-box::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:100vw;background:var(--cream);}

/* ===== MOBILE: box crema full-width edge-to-edge =====
   Su desktop questi box sbordano SOLO a sinistra (::before con right:100%;width:100vw),
   lasciando il gutter destro di 20px non crema. Su mobile li rendo full-bleed su entrambi
   i lati. !important per battere .sg-body/.con-body .beige-box (specificità 0,2,0). */
@media(max-width:900px){
  .beige-box,.chisono-beige,.bas-cream,.cmp-ask,.libro-cream{
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    width:100vw !important;
    max-width:100vw !important;
    box-sizing:border-box !important;
  }
  .beige-box,.chisono-beige,.bas-cream,.libro-cream{padding-left:20px !important;padding-right:20px !important;}
  .beige-box::before,.chisono-beige::before,.bas-cream::before,.libro-cream::before{display:none;}
}

/* pulsanti pagina (teal grande / rosa) */
.sg-btn{display:inline-block;color:#fff !important;font-family:"Quicksand",sans-serif;font-weight:700;
  text-transform:uppercase;text-decoration:none !important;padding:17px 57px 18px;line-height:1.2;letter-spacing:.3px;}
.sg-btn:hover{opacity:.92;}
.sg-btn--teal{background:var(--teal);font-size:20px;}
.sg-btn--pink{background:var(--pink);font-size:17px;}
.sg-btnrow{display:flex;justify-content:center;margin:var(--vsp) 0;}
.sg-btnrow--left{justify-content:flex-start;}
.sg-btnrow--top{margin-top:38px;}

/* ===== scuola-genitori ===== */
.sg-hero{background:transparent;}
.sg-hero .wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:60px;padding:var(--vsp) 0;}
.sg-hero__text{flex:0 0 645px;max-width:645px;min-width:0;}
.sg-hero__img{flex:0 0 452px;}
.sg-hero__img img{display:block;width:452px;height:452px;object-fit:cover;}
.sg-hero__text h2{font-family:"Quicksand",sans-serif;font-size:47.04px;font-weight:700;line-height:48.03px;color:var(--ink);margin:0 0 20px;}
.sg-hero__text h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:600;line-height:34.4px;color:var(--ink);margin:0;}
.sg-hero__text h3 strong{color:var(--pink);font-weight:600;}

.sg-body{padding:var(--vsp) 0;}
.sg-body .wrap > *,.sg-body .video,.sg-body .beige-box,.sg-body .sg-cols{max-width:1005px;}
.sg-body h2{font-family:"Quicksand",sans-serif;font-size:47.04px;font-weight:700;line-height:48.03px;color:var(--ink);margin:0 0 20px;}
.sg-body h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;line-height:34.4px;color:var(--ink);margin:0 0 20px;}
.sg-body h3 strong{color:var(--pink);}        /* strong in h3 = rosa */
.sg-stars{display:inline-flex;align-items:center;gap:5px;vertical-align:middle;margin-left:8px;position:relative;top:-2px;}
.sg-stars svg{width:26px;height:26px;display:block;fill:#F5A623;}
.sg-body h2 strong{color:inherit;}            /* strong in h2 = scuro */
.sg-body p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:24.96px;color:#6B6E71;margin:0 0 34.56px;}
.sg-body strong{font-weight:700;color:inherit;}
.sg-body a{color:var(--pink);text-decoration:underline;}
.sg-h2-center{text-align:center;}
.sg-h2-left{text-align:left;}
/* crema dei box esteso oltre il testo a destra (non si ferma al limite del testo) */
.sg-body .beige-box{max-width:1085px;padding:var(--vsp) 80px var(--vsp) 0;}
.sg .spacer{flex:none;height:0 !important;}
.sg-body .video{margin:var(--vsp) 0;}
.sg-body .video iframe{width:100%;aspect-ratio:16/9;height:auto;display:block;border:0;}

/* "Cosa puoi aspettarti": usa il CONTAINER PRINCIPALE (1320, non il 1005 stretto)
   così da allargare tutti gli elementi; immagine, frecce e testi un po' più grandi. */
.sg-body .sg-h2-left,.sg-body .sg-cols{max-width:none;}
.sg-cols{display:flex;gap:64px;align-items:flex-start;margin:var(--vsp) 0;}
.sg-cols__img{flex:0 0 30%;}
.sg-cols__img img{display:block;width:100%;height:auto;}
.sg-cols__list{flex:1;min-width:0;}
.sg-list{list-style:none;margin:0 0 36px;padding:0;}
.sg-list li{position:relative;padding-left:62px;margin:0 0 22px;font-size:21px;line-height:28px;color:#6B6E71;}
.sg-list li strong{color:inherit;}
.sg-list li::before{content:"";position:absolute;left:0;top:3px;width:40px;height:40px;
  background:url(/wp-content/uploads/2023/09/arrow-right-svgrepo-com-1-4.svg) no-repeat left center;background-size:contain;}

/* testimonianze */
.sg-testi{display:flex;align-items:center;gap:30px;margin:0 0 30px;}
.sg-testi__avatar{flex:0 0 150px;max-width:150px;text-align:center;}
.sg-testi__avatar img{display:inline-block;width:100%;max-width:150px;height:auto;}
.sg-testi__cap{font-size:14px;line-height:1.3;color:var(--ink);margin-top:8px;}
.sg-testi__body{flex:1;min-width:0;}
.sg-testi__stars{font-size:18px;margin:0 0 12px;}
.sg-testi blockquote{background:var(--cream);color:#262626;margin:0;padding:40px 45px;
  font-size:19.2px;line-height:1.5;}
.sg-testi blockquote p{color:#262626;margin:0;font-size:19.2px;line-height:1.5;}

/* form ActiveCampaign */
.sg-form{max-width:1005px;margin:0 0 10px;}
.sg-form--narrow{max-width:600px;margin:0 auto;}

/* ===== sezione iscrizione: form (sx) + immagine (dx), 2 colonne STESSA ALTEZZA =====
   L'immagine è in position:absolute dentro la sua colonna: NON contribuisce all'altezza
   della riga, che viene definita SOLO dal form. La colonna immagine si stira (align-items:
   stretch) all'altezza del form e l'immagine la riempie esatta via object-fit:cover. */
.sg-iscrizione{padding:20px 0 60px;}
.sg-iscrizione .wrap{display:flex;gap:60px;align-items:stretch;}
.sg-iscrizione__form{flex:1 1 50%;min-width:0;}
.sg-iscrizione__img{flex:1 1 50%;position:relative;}
.sg-iscrizione__img img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 35%;}
/* l'embed AC mette margin-top:25px sul <form> → margin-collapse crea 25px di vuoto
   in cima alla colonna (colonna 762 vs form 737); lo annullo così form e immagine combaciano. */
.sg-iscrizione__form form{margin-top:0 !important;}

@media(max-width:900px){
  .sg-hero{background:var(--cream);}
  .sg-hero .wrap{flex-direction:column;align-items:flex-start;gap:28px;}
  /* in colonna il flex-basis:645px diventa ALTEZZA (shrink:0) -> grande vuoto sotto il testo */
  .sg-hero__text{flex:0 0 auto;width:100%;max-width:100%;}
  .sg-hero__img{flex:0 0 auto;width:100%;}
  .sg-hero__img img{width:100%;height:auto;max-width:452px;}
  .sg-cols{flex-direction:column;}
  .sg-cols__img{flex:0 0 auto;max-width:325px;}
  .sg-iscrizione .wrap{flex-direction:column;}
  /* su mobile l'immagine sotto al form non viene mostrata */
  .sg-iscrizione__img{display:none;}
  .sg-testi{flex-direction:column;text-align:center;}
  .sg-body h2,.sg-hero__text h2{font-size:32px;line-height:1.15;}
  .sg-body h3,.sg-hero__text h3{font-size:24px;}
  /* spaziature testo head uniformi (come index): titolo 1.12 + 16px, sottotitolo 1.3 */
  .sg-hero__text h2{line-height:1.12;margin:0 0 16px;}
  .sg-hero__text h3{line-height:1.3;}
}

/* ===== blog-montessori: griglia articoli (stile card testimonianze + thumbnail) ===== */
.cst-post__card{background:#F9F3F2;display:flex;flex-direction:column;}
.cst-post__thumb{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;}
.cst-post__body{padding:26px 30px 30px;display:flex;flex-direction:column;flex:1;}
.cst-post__tag{display:inline-block;align-self:flex-start;border:1px solid #F768BD;color:#F768BD;
  text-transform:uppercase;font-size:13px;letter-spacing:.5px;font-weight:600;padding:2px 8px;margin:0 0 16px;
  line-height:1.3;font-family:"Quicksand",sans-serif;}
.cst-post__title{font-weight:700;color:#262626;font-size:21px;line-height:1.3;margin:0 0 22px;font-family:"Quicksand",sans-serif;}
.cst-post__title a{color:inherit;text-decoration:none;transition:color .15s ease;}
.cst-post__title a:hover{color:#F768BD;}
.cst-post__read{margin-top:auto;color:#262626;text-transform:uppercase;text-decoration:underline;
  text-underline-offset:6px;text-decoration-thickness:1px;font-size:16px;font-weight:500;letter-spacing:.5px;
  font-family:"Quicksand",sans-serif;}
.cst-post__read:hover{color:#F768BD;}

/* CTA box "Guarda il webinar gratuito" */
.blog-cta{background:var(--cream);padding:64px 20px;text-align:center;}
.blog-cta__inner{max-width:780px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.blog-cta__eyebrow{text-transform:uppercase;letter-spacing:1.5px;font-size:14px;font-weight:700;color:#F768BD;
  margin:0 0 16px;font-family:"Quicksand",sans-serif;}
.blog-cta__title{font-size:47.04px;font-weight:700;color:#262626;line-height:1.021;margin:0 0 30px;font-family:"Quicksand",sans-serif;}
.blog-cta__btn{display:inline-block;background:var(--teal);color:#fff !important;font-family:"Quicksand",sans-serif;
  font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:18px 52px;text-decoration:none !important;}
.blog-cta__btn:hover{opacity:.92;}
@media(max-width:900px){ .blog-cta__title{font-size:28px;} }

/* ===== bambini-altamente-sensibili (landing Alta Sensibilità, contenuto Gutenberg) ===== */
.bas .has-text-link-3-color{color:var(--pink) !important;background:transparent !important;}
.bas .has-text-dark-color{color:#262626 !important;background:transparent !important;}
.bas mark{background:transparent;}

.bas-hero{background:transparent;}
.bas-hero .wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:60px;padding:var(--vsp) 0;}
.bas-hero__text{flex:0 0 645px;max-width:645px;min-width:0;}
.bas-hero__img{flex:0 0 452px;}
.bas-hero__img img{display:block;width:452px;height:452px;object-fit:cover;}
.bas-hero__text h2{font-family:"Quicksand",sans-serif;font-size:42px;font-weight:700;line-height:1.12;color:#262626;margin:0 0 22px;}
.bas-hero__text p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:24.96px;color:#6B6E71;margin:0;}

.bas-body{padding:var(--vsp) 0;}
.bas-body .wrap > *,.bas-body .bas-cols,.bas-body .bas-img{max-width:1005px;}
.bas-body h2{font-family:"Quicksand",sans-serif;font-size:47.04px;font-weight:700;line-height:1.05;color:#262626;margin:14px 0 22px;}
.bas-body h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:300;line-height:1.2;color:#262626;margin:10px 0 18px;}
.bas-body h4{font-family:"Quicksand",sans-serif;font-size:20px;font-weight:300;line-height:1.35;color:#262626;margin:0 0 18px;}
.bas-body h4.bas-h4-lg{font-size:33.6px;line-height:1.15;}
.bas-body p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:24.96px;color:#6B6E71;margin:0 0 26px;}
.bas-body strong{font-weight:700;color:inherit;}
.bas-body a{color:var(--pink);text-decoration:underline;}
.bas-body h2 strong,.bas-body h4 strong{color:inherit;}
.bas-body h3 strong{color:var(--pink);}

/* immagine landscape full-width della colonna */
.bas-img{margin:var(--vsp) 0;}
.bas-img img{display:block;width:100%;height:auto;}
.bas-img figcaption{margin-top:8px;font-family:"Quicksand",sans-serif;font-size:13px;color:#636363;text-align:center;}
/* blocco 2 colonne immagine+testo */
.bas-cols{display:flex;gap:48px;align-items:flex-start;margin:var(--vsp) 0;}
.bas-cols__img{flex:0 0 33%;}
.bas-cols__img img{display:block;width:100%;height:auto;}
.bas-cols__txt{flex:1;min-width:0;}
.bas-cols__txt p:last-child{margin-bottom:0;}
/* foto "Mi chiamo" float a sinistra con testo che avvolge */
.bas-figleft{float:left;margin:6px 34px 18px 0;width:250px;}
.bas-figleft img{display:block;width:100%;height:auto;}
.bas-clear{clear:both;}

/* bottoni */
.bas-btnrow{display:flex;justify-content:center;margin:var(--vsp) 0;clear:both;}
.bas-btnrow--left{justify-content:flex-start;}
.bas-btn{display:inline-block;color:#fff !important;font-family:"Quicksand",sans-serif;font-size:17px;font-weight:700;
  text-transform:uppercase;letter-spacing:.3px;text-decoration:none !important;padding:17px 50px 18px;line-height:1.25;text-align:center;}
.bas-btn--pink{background:var(--pink);}
.bas-btn--teal{background:var(--teal);}
.bas-btn:hover{opacity:.92;}

/* lista icone (standalone, non dipende dal tema) */
.bas ul.wp-block-list{list-style:none;margin:0 0 26px;padding:0;}
.bas ul.wp-block-list li{position:relative;padding-left:62px;margin:0 0 14px;font-family:"Quicksand",sans-serif;
  font-size:19.2px;line-height:1.5;color:#6B6E71;}
.bas ul.wp-block-list li strong{color:inherit;}
/* icone liste dimensionate come il riferimento .sg-list ("Cosa puoi aspettarti") */
.bas ul.wp-block-list li::before{content:"";position:absolute;left:0;top:3px;width:40px;height:40px;
  background:url(/wp-content/uploads/2023/09/arrow-right-svgrepo-com-1-4.svg) no-repeat left center;background-size:contain;}
.bas ul.checkmarks-list li::before{background-image:url(/wp-content/uploads/2025/05/checkmark-icon.svg);}
.bas ul.close-list li::before{background-image:url(/wp-content/uploads/2025/05/close-icon.svg);}
.bas ul.alert-triangle-list li::before{background-image:url(/wp-content/uploads/2025/05/alert-triangle-icon.svg);}
.bas ul.pin-list li::before{background-image:url(/wp-content/uploads/2025/05/pin-icon.svg);}
.bas ul.downscale-list li::before{background-image:url(/wp-content/uploads/2025/05/downscale-icon.svg);}
.bas ul.upscale-list li::before{background-image:url(/wp-content/uploads/2025/05/upscale-icon.svg);}
.bas ul.balloon-list li::before{background-image:url(/wp-content/uploads/2025/05/balloon-icon.svg);}
.bas ul.smile-list li::before{background-image:url(/wp-content/uploads/2025/05/smile-icon.svg);}
.bas ul.idea-list li::before{background-image:url(/wp-content/uploads/2025/05/idea-icon.svg);}
.bas ul.house-list li::before{background-image:url(/wp-content/uploads/2025/05/home-icon.svg);}
.bas ul.hand-list li::before{background-image:url(/wp-content/uploads/2025/05/hand-icon.svg);}
.bas ul.star-list li::before{background-image:url(/wp-content/uploads/2025/05/star-icon.svg);}
.bas ul.gift-list li::before{background-image:url(/wp-content/uploads/2025/05/gift-icon.svg);}

/* ===== Banda crema full-bleed dentro .bas-body (sezioni "Mi chiamo Daniela",
   "Il punto di svolta…"). Lo sfondo sborda 100vw; il testo resta a 1005px. ===== */
.bas-body .wrap > .bas-cream{max-width:1085px;}
.bas-cream{position:relative;background:var(--cream);padding:var(--vsp) 80px var(--vsp) 0;margin:var(--vsp) 0;}
.bas-cream::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:100vw;background:var(--cream);z-index:0;}
.bas-cream > *{position:relative;z-index:1;max-width:1005px;}
/* padding sopra/sotto la CTA "Richiedi informazioni" nella banda crema */
.bas-cream .bas-btnrow{margin:0;padding:32px 0 32px;}

.bas-form{max-width:1005px;margin:10px 0 44px;}
@media(max-width:900px){
  .bas-hero{background:var(--cream);}
  .bas-hero .wrap{flex-direction:column;align-items:flex-start;gap:28px;}
  /* in colonna il flex-basis:645px diventa ALTEZZA (shrink:0) -> grande vuoto sotto il testo */
  .bas-hero__text{flex:0 0 auto;width:100%;max-width:100%;}
  .bas-hero__img{flex:0 0 auto;width:100%;}
  .bas-hero__img img{width:100%;height:auto;max-width:452px;}
  .bas-hero__text h2{font-size:30px;line-height:1.12;margin:0 0 16px;}
  .bas-hero__text p{line-height:1.3;}
  .bas-cols{flex-direction:column;}
  /* immagine "sopra" (bas-cols) ingrandita a tutta la larghezza del container */
  .bas-cols__img{flex:0 0 auto;max-width:100%;width:100%;}
  /* sezione "Mi chiamo Daniela": l'immagine non floata più a sinistra col testo a
     fianco; diventa block full-container e il testo scorre SOTTO. */
  .bas-figleft{float:none;width:100%;max-width:100%;margin:0 0 24px;}
  .bas-figleft img{width:100%;}
  .bas-body h2{font-size:32px;}
  .bas-body h3{font-size:24px;}
}

/* ===== consulenza-pedagogica-montessoriana (contenuto Gutenberg) ===== */
.con-hero{background:transparent;}
.con-hero .wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:60px;padding:var(--vsp) 0;}
.con-hero__text{flex:0 0 645px;max-width:645px;min-width:0;}
.con-hero__img{flex:0 0 452px;}
.con-hero__img img{display:block;width:452px;height:452px;object-fit:cover;}
.con-hero__text h2{font-family:"Quicksand",sans-serif;font-size:47.04px;font-weight:700;line-height:1.05;color:var(--ink);margin:0 0 20px;}
.con-hero__text h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;line-height:1.2;color:var(--pink);margin:0 0 26px;}
.con-hero__text h3 strong{color:inherit;}

.con-btn{display:inline-block;background:var(--teal);color:#fff !important;font-family:"Quicksand",sans-serif;
  font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;padding:16px 46px;text-decoration:none !important;line-height:1.25;}
.con-btn:hover{opacity:.92;}
.con-btnrow{margin:var(--vsp) 0;}
.con-body .con-btnrow{text-align:center;margin:0;padding:40px 0;}
/* spazio uniforme sopra/sotto le CTA: azzero i margini degli elementi adiacenti */
.con-body :is(p,h2,h3,.con-img,.beige-box):has(+ .con-btnrow){margin-bottom:0;}
.con-body .con-btnrow + .con-bio > h2{margin-top:0;}
/* più spazio sotto la CTA che precede la sezione "Cosa mi ha portato" */
.con-body .con-btnrow:has(+ .con-bio){padding-bottom:80px;}

.con-body{padding:var(--vsp) 0;}
.con-body .wrap > *,.con-body .beige-box,.con-body .con-img,.con-body .con-video{max-width:1005px;}
.con-body .beige-box{max-width:1085px;padding:var(--vsp) 80px var(--vsp) 0;}
.con-body h2{font-family:"Quicksand",sans-serif;font-size:47.04px;font-weight:700;line-height:1.05;color:var(--ink);margin:16px 0 22px;}
.con-body h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;line-height:1.25;color:var(--ink);margin:10px 0 18px;}
.con-body h3 strong{color:var(--pink);}
.con-body h2 strong{color:inherit;}
.con-body p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:24.96px;color:#6B6E71;margin:0 0 26px;}
.con-body em{font-style:italic;}
.con-body strong{font-weight:700;color:inherit;}
.con-body a{color:var(--pink);text-decoration:underline;}
.con-img{margin:var(--vsp) 0;text-align:center;}
.con-img img{display:inline-block;height:auto;}
.con-img--book img{width:185px;}
.con-video{margin:8px 0 0;}
/* "Quindi…": spazio bianco sopra = padding crema sotto il video → confine centrato */
.con-body h2.con-wtop{margin-top:45px;}
.con-video iframe{width:100%;aspect-ratio:16/9;height:auto;display:block;border:0;}

/* bio "Cosa mi ha portato": foto float a sinistra, testo che avvolge */
.con-bio{overflow:hidden;}
.con-figleft{float:left;width:300px;margin:6px 45px 16px 0;}
.con-figleft img{display:block;width:100%;height:auto;}

/* "In che modo si svolgono": elenco numerato */
.con-ol{margin:0 0 26px;padding-left:26px;}
.con-ol li{font-family:"Quicksand",sans-serif;font-size:19.2px;line-height:24.96px;color:#6B6E71;margin:0 0 14px;padding-left:8px;}
.con-ol li strong{color:inherit;}

.con ul.wp-block-list{list-style:none;margin:0 0 26px;padding:0;}
.con ul.wp-block-list li{position:relative;padding-left:62px;margin:0 0 14px;font-family:"Quicksand",sans-serif;font-size:19.2px;line-height:1.5;color:#6B6E71;}
.con ul.wp-block-list li strong{color:inherit;}
/* icone liste dimensionate come il riferimento .sg-list ("Cosa puoi aspettarti") */
.con ul.wp-block-list li::before{content:"";position:absolute;left:0;top:3px;width:40px;height:40px;background:url(/wp-content/uploads/2023/09/arrow-right-svgrepo-com-1-4.svg) no-repeat left center;background-size:contain;}
.con ul.checkmarks-list li::before{background-image:url(/wp-content/uploads/2025/05/checkmark-icon.svg);}
.con ul.alert-triangle-list li::before{background-image:url(/wp-content/uploads/2025/05/alert-triangle-icon.svg);}

@media(max-width:900px){
  .con-hero{background:var(--cream);}
  .con-hero .wrap{flex-direction:column;align-items:flex-start;gap:28px;}
  /* in colonna il flex-basis:645px diventa ALTEZZA (shrink:0) -> grande vuoto sotto il testo */
  .con-hero__text{flex:0 0 auto;width:100%;max-width:100%;}
  .con-hero__img{flex:0 0 auto;width:100%;}
  .con-hero__img img{width:100%;height:auto;max-width:452px;}
  .con-body h2,.con-hero__text h2{font-size:32px;}
  .con-body h3,.con-hero__text h3{font-size:24px;}
  /* "Cosa mi ha portato": la foto non floata più a sinistra col testo a fianco;
     diventa block full-container e il testo scorre SOTTO. (la cover libro
     .con-img--book resta volutamente piccola, non toccata) */
  .con-figleft{float:none;width:100%;max-width:100%;margin:0 0 24px;}
  .con-figleft img{width:100%;}
  /* spaziature testo head uniformi (come index): titolo 1.12 + 16px, sottotitolo 1.3 */
  .con-hero__text h2{line-height:1.12;margin:0 0 16px;}
  .con-hero__text h3{line-height:1.3;}
}

/* ===== HOME (index) — sezioni in HTML pulito (riusa cst-hero + cst-post__card) ===== */
/* crema dietro l'header trasparente, split 60% come il cst-hero */
body.home .site-header{background:linear-gradient(to right,var(--cream) 0,var(--cream) 60%,#ffffff 60%,#ffffff 100%);}
/* mobile: niente split 60/40 — l'header poggia su crema piena, in continuità con
   il cst-hero (che a sua volta è full crema sotto i 900px). */
@media(max-width:1024px){body.home .site-header{background:var(--cream);}}
/* blog: header su bianco, così la banda cream della pagehead non si fonde col cream dell'header */
.page-blog .site-header{background:#ffffff;}
/* webinar + testimonianze: header su bianco (la pagehead cream sotto non deve fondersi con l'header) */
.page-webinar .site-header,
.page-testimonianze .site-header{background:#ffffff;}
.home-wrap{max-width:1320px;margin:0 auto;padding:0;box-sizing:border-box;}

/* ===== Container principale unico: max 1320px + 20px di gutter laterale OVUNQUE.
   Gli sfondi full-bleed (sezioni crema/teal, pseudo-elementi 100vw) restano invariati,
   perché qui tocchiamo solo i wrapper del CONTENUTO, non i background. ===== */
.site-header__row,.page-content,.home-wrap,.wrap,.chisono__wrap,
.cst-hero__container,.cst-pagehead__inner,.cst-tgrid__inner,.cst-filters__inner,
.cst-testi__inner,.cst-libri__inner,.cst-cta__inner,.cst-detail-hero__inner,
.cst-detail-text__inner,.cst-webintro__inner,.cst-webform__inner,
.site-footer__inner,.site-copyright__inner{
  padding-left:20px !important;padding-right:20px !important;box-sizing:border-box !important;
}

/* Non è facile essere genitori oggi */
.home-hard{padding:var(--vsp) 0;}
.home-hard__title{font-family:"Quicksand",sans-serif;font-size:47px;font-weight:700;line-height:1.1;color:var(--ink);margin:0 0 40px;max-width:560px;}
.home-hard__body{display:flex;gap:64px;align-items:stretch;}
.home-hard__l{flex:0 0 38%;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;}
.home-hard__person{display:flex;align-items:center;gap:16px;}
.home-hard__person img{width:80px;height:80px;border-radius:50%;object-fit:cover;flex:0 0 auto;display:block;}
.home-hard__who{display:flex;flex-direction:column;line-height:1.3;}
.home-hard__who b{font-family:"Quicksand",sans-serif;font-size:25px;font-weight:300;color:#1B0707;}
.home-hard__who span{font-family:"Quicksand",sans-serif;font-size:16px;font-weight:400;line-height:18px;color:#867B80;}
.home-hard__r{flex:1;min-width:0;display:flex;gap:40px;}
.home-hard__col{flex:1;min-width:0;display:flex;flex-direction:column;}
.home-hard__r p{font-family:"Quicksand",sans-serif;font-size:18px;font-weight:400;line-height:1.5;color:#6B6E71;margin:0 0 22px;}
.home-hard__r p:last-child{margin-bottom:0;}
.home-hard__r .pink{color:var(--pink);}

/* About: Mi chiamo Daniela */
.home-about{padding:var(--vsp) 0;}
.home-about .home-wrap{display:flex;gap:64px;align-items:center;}
.home-about__media{flex:0 0 42%;min-width:0;position:relative;display:flex;justify-content:flex-start;}
.home-about__media img{width:100%;max-width:520px;height:auto;display:block;}
/* badge "25+ ANNI DI ESPERIENZA": riquadro arrotondato in basso a destra,
   sbordante sotto l'immagine (come da design). */
/* badge "25+ ANNI DI ESPERIENZA": forma teal (Rectangle 30.svg) + numero counter + etichetta */
.home-about__badge{position:absolute;right:18px;bottom:-28px;width:138px;height:138px;transform:translateX(-60px);
  background:url(/wp-content/uploads/2025/05/badge-shape.svg) no-repeat center;background-size:contain;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-bottom:14px;}
.home-about__badge-num{font-family:"Quicksand",sans-serif;font-weight:700;font-size:66px;line-height:.85;color:#fff;letter-spacing:-1px;}
.home-about__badge-lbl{font-family:"Quicksand",sans-serif;font-weight:700;font-size:16px;line-height:1.05;color:#fff;text-transform:uppercase;margin-top:2px;}
/* mobile: il badge "ANNI DI ESPERIENZA" più a destra (su desktop il translateX(-60px)
   lo centra sotto la foto; qui lo riporto verso il bordo destro dell'immagine).
   Regola sulla classe condivisa -> vale per home e tutte le pagine col template about. */
@media(max-width:900px){
  .home-about__badge{transform:none;right:12px;}
  /* più aria sotto l'immagine col badge (il badge sborda -28px) e padding inferiore
     di sezione ridotto, per allinearlo al ritmo di "Cosa posso fare per te".
     Uso margin-bottom sul media (non conteso) perché il gap a 32px è imposto più sotto. */
  .home-about{padding:var(--vsp) 0;}
  .home-about__media{margin-bottom:26px;justify-content:center;}
}
.home-about__text{flex:1;min-width:0;}
.home-about__text h2{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;line-height:1.15;color:#262626;margin:0 0 24px;}
.home-about__text .pink{color:var(--pink);}
.home-about__text p{font-family:"Quicksand",sans-serif;font-size:20px;font-weight:500;line-height:1.5;color:#636363;margin:0 0 30px;}
.home-about__btns{display:flex;gap:18px;flex-wrap:wrap;}
.home-btn{display:inline-block;font-family:"Quicksand",sans-serif;font-size:17px;font-weight:700;text-transform:uppercase;
  letter-spacing:.3px;padding:15px 36px;text-decoration:none !important;line-height:1.25;}
/* CTA bordata con freccia rosa (es. "La mia storia") */
.home-btn--arrow{display:inline-flex;align-items:center;gap:14px;}
.home-btn__arr{display:inline-flex;align-items:center;line-height:0;}
.home-btn__arr svg{display:block;width:40px;height:16px;}
.home-btn--teal{background:var(--teal);color:#fff !important;}
.home-btn--out{background:transparent;color:var(--ink) !important;border:1px solid var(--ink);}
.home-btn--pink{background:var(--pink);color:#fff !important;}
.home-btn:hover{opacity:.92;}

/* Consulenza e formazione (eyebrow + h2 center + p + 2 card) */
/* sfondo crema a tutta larghezza (full-bleed robusto via pseudo-elemento) */
.home-offer{position:relative;padding:var(--vsp) 0;background:transparent;}
/* sfondo crema come scatola contenuta (non full-width) */
.home-offer>.home-wrap{position:relative;z-index:1;background:var(--cream);padding:60px 60px;box-sizing:border-box;}
.home-offer__eyebrow{text-align:center;text-transform:uppercase;letter-spacing:1.5px;font-size:14px;font-weight:700;color:var(--pink);margin:0 0 14px;font-family:"Quicksand",sans-serif;}
.home-offer h2{text-align:center;font-family:"Quicksand",sans-serif;font-size:47px;font-weight:700;color:var(--ink);margin:0 0 16px;line-height:1.1;}
.home-offer__sub{text-align:center;max-width:820px;margin:0 auto 44px;font-family:"Quicksand",sans-serif;font-size:19.2px;color:#6B6E71;line-height:1.5;}
.home-offer__sub strong{color:var(--ink);font-weight:700;}
.home-offer__cards{display:flex;gap:30px;justify-content:center;}
.home-card{background:#fff;flex:1 1 0;max-width:560px;display:flex;flex-direction:column;}
.home-card__media{position:relative;display:block;}
.home-card__media img{display:block;width:100%;height:auto;aspect-ratio:499/332;object-fit:cover;}
.home-card__badge{position:absolute;right:0;bottom:18px;background:var(--teal);color:#fff;font-family:"Quicksand",sans-serif;
  font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:7px 16px;}
.home-card__body{padding:28px 32px 32px;display:flex;flex-direction:column;flex:1;}
.home-card__body h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;color:var(--ink);margin:0 0 16px;line-height:1.15;}
.home-card__body p{font-family:"Quicksand",sans-serif;font-size:20px;font-weight:500;color:#636363;line-height:1.5;margin:0 0 22px;}
.home-card__body .pink{color:var(--pink);}
.home-card__link{margin-top:auto;display:inline-flex;align-items:center;gap:12px;font-family:"Quicksand",sans-serif;font-weight:700;color:var(--ink);text-transform:uppercase;font-size:15px;letter-spacing:.5px;text-decoration:none;}
.home-card__arr{display:inline-flex;align-items:center;line-height:0;}
.home-card__arr svg{display:block;width:38px;height:15px;}
.home-card__link:hover{color:var(--pink);}

/* Non sai da dove iniziare (riga: cerchio ? + testo + CTA, separatore sopra) */
/* riga "Non sai da dove iniziare": larga quanto le due card (2×560 + gap 30 = 1150), centrata */
.home-start{display:flex;align-items:center;gap:30px;max-width:1150px;margin:60px auto 0;padding-top:48px;border-top:1px solid rgba(38,38,38,.12);}
.home-start__q{flex:0 0 auto;width:78px;height:78px;border-radius:50%;background:var(--pink-soft);color:#fff;
  display:flex;align-items:center;justify-content:center;font-family:"Quicksand",sans-serif;font-weight:700;font-size:40px;line-height:1;}
.home-start__txt{flex:1;min-width:0;}
.home-start h3{font-family:"Quicksand",sans-serif;font-size:34px;font-weight:700;color:var(--ink);margin:0 0 8px;}
.home-start p{font-family:"Quicksand",sans-serif;font-size:19.2px;color:#6B6E71;margin:0;}
.home-start .home-btn{flex:0 0 auto;}

/* Cosa dicono i genitori (10 card) */
.home-testi{background:var(--cream);padding:var(--vsp) 0;}
.home-testi h2{text-align:center;font-family:"Quicksand",sans-serif;font-size:47px;font-weight:700;color:var(--ink);margin:0 0 40px;line-height:1.1;}
.home-testi__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.home-tcard{background:#fff;padding:30px 28px;display:flex;flex-direction:column;}
.home-tcard h3{font-family:"Quicksand",sans-serif;font-size:22px;font-weight:700;color:var(--ink);margin:0 0 16px;line-height:1.25;}
.home-tcard__head{display:flex;align-items:center;gap:12px;margin:0 0 14px;}
.home-tcard__head img{width:60px;height:60px;border-radius:50%;object-fit:cover;flex:0 0 auto;}
.home-tcard p{font-family:"Quicksand",sans-serif;font-size:16px;color:#6B6E71;line-height:1.6;margin:0;}
@media(max-width:980px){.home-testi__grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.home-testi__grid{grid-template-columns:1fr;}}

/* Come ti aiuterò + Inizia ora (2-col) */
.home-method{position:relative;padding:var(--vsp) 0;background:var(--cream);}
.home-method::before{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100vw;background:var(--cream);z-index:0;}
.home-method>.home-wrap{position:relative;z-index:1;}
.home-method .home-wrap{display:flex;gap:60px;align-items:stretch;}
.home-method__l{flex:0 0 44%;min-width:0;display:flex;flex-direction:column;}
.home-method__l h2{font-family:"Quicksand",sans-serif;font-size:42px;font-weight:700;color:var(--ink);line-height:1.1;margin:0 0 20px;}
.home-method__l p{font-family:"Quicksand",sans-serif;font-size:19.2px;color:#6B6E71;line-height:1.5;margin:0 0 30px;}
/* box "Inizia ora!" bianco, testo centrato (come da Aiutohome.svg) */
/* box "Inizia ora!" bianco: spinto in basso e leggermente a cavallo della sezione sotto */
.home-startbox{background:#fff;padding:44px 40px;text-align:center;margin-top:auto;margin-bottom:-90px;position:relative;z-index:2;}
.home-startbox h3{font-family:"Quicksand",sans-serif;font-size:51px;font-weight:700;line-height:53px;color:var(--pink);margin:0 0 14px;}
.home-startbox p{font-family:"Quicksand",sans-serif;font-size:18px;color:#6B6E71;line-height:1.5;margin:0 0 22px;}
.home-method__r{flex:1;min-width:0;}
/* timeline scroll-driven: default solo 1° attivo (verde), gli altri rosa-chiaro;
   al raggiungimento della linea di scorrimento si attivano (verde) e la linea cresce. */
.home-tl{position:relative;list-style:none;margin:0;padding:0;}
.home-tl__track,.home-tl__progress{position:absolute;left:21px;width:3px;top:22px;z-index:0;}
.home-tl__track{height:0;background:#E7E3DF;}
.home-tl__progress{height:0;background:#9BC53D;transition:height .2s linear;}
.home-tl__item{position:relative;z-index:1;display:flex;align-items:flex-start;gap:26px;padding-bottom:34px;}
.home-tl__item:last-child{padding-bottom:0;}
.home-tl__dot{flex:0 0 auto;width:44px;height:44px;border-radius:50%;transition:background-color .3s ease;
  background-color:#FBD1E5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;}
.home-tl__item.is-active .home-tl__dot{background-color:#9BC53D;}
.home-tl__bubble{flex:1;min-width:0;border-radius:14px;padding:18px 26px;
  font-family:"Quicksand",sans-serif;font-size:18px;line-height:1.45;color:#636363;background:#fff;
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  opacity:0;transform:translateY(18px);
  transition:opacity .5s ease,transform .5s ease,background-color .3s ease,color .3s ease;}
.home-tl__item.is-revealed .home-tl__bubble{opacity:1;transform:none;}
.home-tl__item.is-active .home-tl__bubble{background:#9BC53D;color:#fff;}

/* Newsletter banner */
.home-news{background:#1A1818;background-image:linear-gradient(rgba(38,38,38,.7),rgba(38,38,38,.7)),url(/wp-content/uploads/2025/06/webinar-cta-bg.jpg);
  background-size:cover;background-position:center;padding:var(--vsp) 20px;text-align:center;color:#fff;}
.home-news h2{font-family:"Quicksand",sans-serif;font-size:46px;font-weight:700;color:#fff;margin:0 0 14px;line-height:1.1;}
.home-news p{font-family:"Quicksand",sans-serif;font-size:18px;color:#fff;margin:0 0 28px;}
.home-news__form{display:flex;justify-content:center;gap:0;max-width:560px;margin:0 auto;flex-wrap:wrap;}
.home-news__form input{flex:1 1 320px;border:0;padding:16px 20px;font-family:"Quicksand",sans-serif;font-size:16px;}
.home-news__form button{border:0;background:var(--pink);color:#fff;font-family:"Quicksand",sans-serif;font-weight:700;text-transform:uppercase;padding:16px 34px;cursor:pointer;font-size:15px;letter-spacing:.5px;}

/* Strategie e strumenti (blog cards, riusa cst-post__card) */
.home-blog{padding:var(--vsp) 0;}
.home-blog__eyebrow{text-align:center;text-transform:uppercase;letter-spacing:1.5px;font-size:14px;font-weight:700;color:var(--pink);margin:0 0 14px;font-family:"Quicksand",sans-serif;}
.home-blog h2{text-align:center;font-family:"Quicksand",sans-serif;font-size:47px;font-weight:700;color:var(--ink);margin:0 0 40px;line-height:1.1;}
.home-blog h2 .pink{color:var(--pink);}
.home-blog__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
/* slider blog (3 card visibili + frecce) come da Bloghome.svg */
.hb-slider{position:relative;}
.hb-slider__track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:8px;scrollbar-width:none;}
.hb-slider__track::-webkit-scrollbar{display:none;}
.hb-card{scroll-snap-align:start;position:relative;}
/* tutta la card cliccabile (incl. il tag) → pagina articolo, via link "stretched";
   l'immagine resta sopra così l'hover lente/zoom continua a funzionare */
.hb-card__title a::after{content:"";position:absolute;inset:0;z-index:0;}
.hb-card__imgwrap{position:relative;z-index:1;display:block;overflow:hidden;aspect-ratio:4/3;border-radius:0;}
.hb-card__imgwrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s ease;}
.hb-card__imgwrap:hover img{transform:scale(1.07);}
/* hover: immagine leggermente oscurata + lente rosa */
.hb-card__imgwrap::after{content:"";position:absolute;inset:0;background-color:rgba(38,38,38,.32);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46' viewBox='0 0 24 24' fill='none' stroke='%23F768BD' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='7'/%3E%3Cline x1='15.5' y1='15.5' x2='21' y2='21'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;opacity:0;transition:opacity .3s ease;pointer-events:none;}
.hb-card__imgwrap:hover::after{opacity:1;}
/* card sfalsate: 1ª e 3ª più in alto, la centrale più in basso */
.hb-slider__track .hb-card:nth-child(even){margin-top:42px;}
/* su mobile le card dello slider devono essere allineate (niente sfalsamento) */
@media(max-width:900px){.hb-slider__track .hb-card:nth-child(even){margin-top:0;}}
.hb-card__tag{display:inline-block;margin:18px 0 14px;color:var(--pink);text-transform:uppercase;font-size:12px;font-weight:600;letter-spacing:.5px;font-family:"Quicksand",sans-serif;border:1px solid var(--pink);padding:5px 14px;}
.hb-card__title{font-family:"Quicksand",sans-serif;font-size:21px;font-weight:500;line-height:1.3;color:var(--ink);margin:0 0 18px;text-transform:none;}
.hb-card__title a{color:inherit;}
.hb-card__title a:hover{color:var(--pink);}
.hb-card__read{font-family:"Quicksand",sans-serif;font-weight:300;text-transform:uppercase;font-size:14px;letter-spacing:.5px;color:var(--ink);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;}
.hb-card__read:hover{color:var(--pink);}
.hb-slider__nav{position:absolute;top:32%;transform:translateY(-50%);z-index:2;width:40px;height:40px;border:0;background:none;cursor:pointer;font-size:42px;line-height:1;color:#C9C3C1;font-family:"Quicksand",sans-serif;padding:0;}
.hb-slider__nav--prev{left:-46px;}
.hb-slider__nav--next{right:-46px;}
.hb-slider__nav:hover{color:var(--pink);}
@media(max-width:980px){.hb-slider__track{grid-auto-columns:calc((100% - 24px)/2);}}
@media(max-width:640px){.hb-slider__track{grid-auto-columns:86%;}}
/* le frecce nav sono posizionate FUORI dal track (left/right:-46px): sotto i ~1024px
   il container non ha margine laterale e sforerebbero a destra. Su touch si scorre con
   swipe, quindi le nascondo (anche su tablet) per evitare l'overflow orizzontale. */
@media(max-width:1024px){.hb-slider__nav{display:none;}}
/* blog listing: hb-card in griglia allineata (niente stagger dello slider) + tag multipli in lista */
.cst-tgrid__grid .hb-card{display:flex;flex-direction:column;height:100%;}
/* il filtro/paginazione nasconde le card con .cst-is-hidden; deve battere il
   display:flex qui sopra (stessa specificità ma definito dopo), quindi lo
   rendiamo più specifico. */
.cst-tgrid__grid .hb-card.cst-is-hidden{display:none;}
.cst-tgrid__grid .hb-card__read{margin-top:auto;}
.hb-card__tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 14px;}
.hb-card__tags .hb-card__tag{margin:0;}
/* pagine dettaglio: chip dei tag assegnati (bordo grigio, come da design) */
.detail-tags{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px;}
.detail-tag{display:inline-block;border:1px solid #9a9a9a;color:#6b6b6b;text-transform:uppercase;font-size:12px;font-weight:600;letter-spacing:.5px;font-family:"Quicksand",sans-serif;padding:6px 14px;text-decoration:none;line-height:1.2;}
.detail-tag:hover{border-color:var(--pink);color:var(--pink);}
/* i tag/chip comportamento sono <a>: dentro .art-body/.cmp-text ecc. le regole
   "a{text-decoration:underline}" li sottolineano come link. !important per evitarlo
   ovunque (sono pill, non link testuali). */
.hb-card__tag,.cst-testi__tag,.detail-tag,.cst-post__tag{text-decoration:none !important;}
.home-blog__footer{text-align:center;margin-top:44px;}

/* Sezione video YouTube (3 thumbnail + Iscriviti al canale) */
.home-yt{padding:var(--vsp) 0;}
.home-yt__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
.home-yt__item{position:relative;display:block;overflow:hidden;aspect-ratio:16/9;background:#000;}
.home-yt__item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.home-yt__item:hover img{transform:scale(1.05);}
.home-yt__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:48px;border-radius:12px;background:rgba(0,0,0,.72);}
.home-yt__play::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-38%,-50%);
  border-style:solid;border-width:11px 0 11px 18px;border-color:transparent transparent transparent #fff;}
.home-yt__footer{text-align:center;margin-top:40px;}
.home-yt__btn{display:inline-flex;align-items:center;gap:12px;background:var(--pink);color:#fff;
  font-family:"Quicksand",sans-serif;font-weight:700;text-transform:uppercase;font-size:15px;letter-spacing:.5px;
  padding:16px 34px;text-decoration:none;}
.home-yt__btn svg{width:24px;height:auto;display:block;}
.home-yt__btn:hover{opacity:.92;}
@media(max-width:760px){.home-yt__grid{grid-template-columns:1fr;max-width:440px;margin:0 auto;}}
@media(max-width:980px){.home-blog__grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.home-blog__grid{grid-template-columns:1fr;}}

@media(max-width:900px){
  .home-hard__body,.home-about .home-wrap,.home-method .home-wrap{flex-direction:column;gap:32px;}
  .home-hard__r{flex-direction:column;gap:0;}
  .home-hard__l{align-items:flex-start;}
  .home-offer__cards{flex-direction:column;align-items:center;}
  .home-start{flex-direction:column;text-align:center;gap:18px;}
  .home-start h3{font-size:26px;}
  /* in colonna singola il box "Inizia ora" non sta più nella colonna sinistra:
     azzero lo scavalco -90px (pensato per il desktop) o coprirebbe il 1° step della timeline. */
  .home-startbox{margin-bottom:32px;}
  .home-startbox h3{font-size:32px;line-height:1.1;}
  .home-hard__title,.home-about__text h2,.home-offer h2,.home-testi h2,.home-blog h2,.home-method__l h2,.home-news h2{font-size:32px;}
}

/* ===== articoli blog (pagina dettaglio) ===== */
.art-hero{position:relative;min-height:540px;display:flex;align-items:center;justify-content:center;text-align:center;
  background-size:cover;background-position:center;}
.art-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 0,rgba(0,0,0,.5) 70%);}
.art-hero__inner{position:relative;z-index:1;max-width:1000px;padding:var(--vsp) 20px;}
.art-hero__tag{display:inline-block;border:1px solid rgba(255,255,255,.85);color:#fff;text-transform:uppercase;
  font-size:13px;letter-spacing:.6px;padding:4px 14px;margin:0 0 20px;font-weight:600;font-family:"Quicksand",sans-serif;}
.art-hero__title{font-family:"Quicksand",sans-serif;font-size:42px;font-weight:700;color:#fff;line-height:1.18;margin:0;text-transform:uppercase;}

.art-body{max-width:1008px;margin:0 auto;padding:var(--vsp) 20px;}
.art-body h2{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;color:var(--ink);line-height:1.15;margin:30px 0 20px;}
.art-body h2 strong{color:inherit;font-weight:700;}
.art-body h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;color:var(--ink);line-height:1.2;margin:26px 0 14px;}
.art-body h3 strong{color:var(--pink);font-weight:700;}
/* Scala titoli articolo — progressiva verso il basso.
 * h2:40 → h3:31.68 → h4:26 → h5:22 → h6:20 (body: 19.2). */
.art-body h4{font-family:"Quicksand",sans-serif;font-size:26px;font-weight:700;color:var(--ink);line-height:1.2;margin:22px 0 14px;}
.art-body h4 strong{color:inherit;font-weight:700;}
.art-body h5{font-family:"Quicksand",sans-serif;font-size:22px;font-weight:700;color:var(--ink);line-height:1.25;margin:20px 0 12px;}
.art-body h5 strong{color:inherit;font-weight:700;}
.art-body h6{font-family:"Quicksand",sans-serif;font-size:20px;font-weight:700;color:var(--ink);line-height:1.3;margin:18px 0 10px;}
.art-body h6 strong{color:inherit;font-weight:700;}
.art-body p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.5;color:#6B6E71;margin:0 0 24px;}
.art-body strong{font-weight:700;color:inherit;}
.art-body em{font-style:italic;}
.art-body a{color:var(--pink);text-decoration:underline;word-break:break-word;}
/* Liste dentro il corpo articolo. site.css azzera globalmente il list-style
 * di tutti gli <ul>; qui aggiungiamo un bullet custom (freccetta rosa) usato
 * come cifra visiva sui blog post. L'SVG è inline data-URI così non dipende
 * da file uploadati. Nel canvas dell'editor Gutenberg le liste restano con
 * disc/decimal standard (editor.css) per non fuorviare chi scrive. */
.art-body ul.wp-block-list,
.art-body ol.wp-block-list{list-style:none;padding:0 0 0 32px;margin:0 0 24px;}
.art-body ul.wp-block-list li,
.art-body ol.wp-block-list li{
	position:relative;padding-left:34px;margin:0 0 10px;
	font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.5;color:#6B6E71;
}
.art-body ul.wp-block-list li::before{
	content:"";position:absolute;left:0;top:.55em;width:22px;height:12px;
	background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='12' viewBox='0 0 22 12' fill='none'><path d='M15 1l5 5-5 5' stroke='%23F768BD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/><path d='M0 6h20' stroke='%23F768BD' stroke-width='2' stroke-linecap='round'/></svg>") no-repeat left center;
	background-size:contain;
}
/* Numerata: numeri rosa auto-generati con counter, per coerenza cromatica. */
.art-body ol.wp-block-list{counter-reset:art-ol;}
.art-body ol.wp-block-list li{counter-increment:art-ol;}
.art-body ol.wp-block-list li::before{
	content:counter(art-ol) ".";position:absolute;left:0;top:0;
	color:var(--pink);font-weight:700;font-family:"Quicksand",sans-serif;font-size:19.2px;line-height:1.5;
}
.art-form{max-width:1008px;margin:0 auto;padding:0 20px 56px;}
@media(max-width:900px){
  .art-hero__title{font-size:28px;}
  .art-body h2{font-size:30px;}
  .art-body h3{font-size:24px;}
}

/* =====================================================================
   COMPORTAMENTO (cmp-) — template unico per ogni pagina-comportamento.
   Design identico per tutti i comportamenti: cambiano SOLO i testi/immagini.
   ===================================================================== */
/* HERO: testo a sinistra (titolo scuro + sottotitolo rosa) + immagine
   orizzontale a destra che sborda dal rettangolo crema verso la zona bianca. */
.cmp-hero{background:transparent;}
.cmp-hero .wrap{display:flex;align-items:center;justify-content:space-between;gap:60px;padding:var(--vsp) 20px;}
.cmp-hero__text{flex:0 1 600px;max-width:600px;min-width:0;}
.cmp-hero__text h1{font-family:"Quicksand",sans-serif;font-size:42px;font-weight:700;line-height:1.12;color:var(--ink);margin:0 0 22px;}
.cmp-hero__text p{font-family:"Quicksand",sans-serif;font-size:24px;font-weight:500;line-height:1.3;color:var(--pink);margin:0;}
.cmp-hero__img{flex:0 0 570px;}
.cmp-hero__img img{display:block;width:570px;height:404px;object-fit:cover;}
@media(max-width:900px){
  .cmp-hero{background:var(--cream);}
  .cmp-hero .wrap{flex-direction:column;align-items:flex-start;gap:28px;padding:var(--vsp) 24px;}
  .cmp-hero__text{flex:0 1 auto;max-width:none;}
  .cmp-hero__text h1{font-size:30px;}
  .cmp-hero__text p{font-size:20px;}
  .cmp-hero__img{flex:0 0 auto;width:100%;}
  .cmp-hero__img img{width:100%;height:auto;max-width:570px;}
}

/* TITOLO DINAMICO: banda full-bleed crema con il nome del comportamento
   centrato (Quicksand Bold 50, box interno 1160, banda ~210px). */
.cmp-title{background:var(--cream);}
.cmp-title__inner{max-width:1160px;margin:0 auto;padding:var(--vsp) 20px;text-align:center;}
.cmp-title__inner h2{font-family:"Quicksand",sans-serif;font-size:50px;font-weight:700;line-height:1.05;color:var(--ink);margin:0;}
@media(max-width:900px){
  .cmp-title__inner{padding:var(--vsp) 24px;}
  .cmp-title__inner h2{font-size:32px;}
}

/* BLOCCO TESTO + IMMAGINE (ripetibile): heading + sottotitolo, poi due
   colonne (immagine a sx ~34% / testo a dx) con CTA rosa. La variante
   --alt cambia solo lo sfondo (crema invece di bianco). */
.cmp-block{background:#fff;}
.cmp-block--alt{background:var(--cream);}
.cmp-block__inner{max-width:1320px;margin:0 auto;padding:var(--vsp) 20px;}
.cmp-block__title{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;line-height:1.25;color:var(--ink);margin:0 0 14px;}
.cmp-block__sub{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.4;color:#6B6E71;margin:0 0 34px;}
.cmp-block__cols{display:flex;gap:48px;align-items:flex-start;}
.cmp-block__img{flex:0 0 34%;}
.cmp-block__img img{display:block;width:100%;height:auto;}
.cmp-block__txt{flex:1;min-width:0;}
.cmp-block__txt p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.4;color:#6B6E71;margin:0 0 22px;}
.cmp-block__txt strong{font-weight:700;color:inherit;}
.cmp-btn{display:inline-block;margin-top:8px;background:var(--pink);color:#fff !important;font-family:"Quicksand",sans-serif;
  font-size:15px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:14px 28px;text-decoration:none !important;line-height:1.4;}
.cmp-btn:hover{opacity:.92;}
/* SEZIONE TESTUALE (solo testo, sfondo bianco): colonna singola allineata a
   sinistra al container, chiusa da CTA rosa. */
.cmp-text{background:#fff;}
.cmp-text__inner{max-width:1320px;margin:0 auto;padding:var(--vsp) 20px;}
.cmp-text__col{max-width:820px;}
.cmp-text__col h2{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;line-height:1.25;color:var(--ink);margin:0 0 22px;}
.cmp-text__col p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.45;color:#6B6E71;margin:0 0 22px;}
.cmp-text__col strong{font-weight:700;color:inherit;}
.cmp-text__col a{color:var(--pink);text-decoration:underline;}
@media(max-width:900px){
  .cmp-text__inner{padding:var(--vsp) 24px;}
  .cmp-text__col h2{font-size:30px;}
}

/* SEZIONE TESTUALE CON SFONDO A METÀ: crema full-bleed a sinistra che si
   ferma a ~77% e diventa bianco a destra (rettangolo 1270/1640 del design).
   Testo mono-colonna allineato a sinistra, chiuso da CTA rosa. */
.cmp-textbg{background:linear-gradient(to right, var(--cream) 0, var(--cream) 77.4%, #fff 77.4%, #fff 100%);}
.cmp-textbg__inner{max-width:1320px;margin:0 auto;padding:var(--vsp) 20px;}
.cmp-textbg__col{max-width:820px;}
.cmp-textbg__col h2{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;line-height:1.25;color:var(--ink);margin:0 0 26px;}
.cmp-textbg__col p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.45;color:#6B6E71;margin:0 0 22px;}
.cmp-textbg__col strong{font-weight:700;color:inherit;}
@media(max-width:900px){
  .cmp-textbg{background:var(--cream);}
  .cmp-textbg__inner{padding:var(--vsp) 24px;}
  .cmp-textbg__col h2{font-size:30px;}
}

/* variante speculare: immagine a destra, testo a sinistra (immagine più ampia) */
.cmp-block--mirror .cmp-block__cols{flex-direction:row-reverse;}
.cmp-block--mirror .cmp-block__img{flex:0 0 40%;}
@media(max-width:900px){
  .cmp-block__inner{padding:var(--vsp) 24px;}
  .cmp-block__title{font-size:30px;}
  .cmp-block__cols{flex-direction:column;gap:28px;}
  /* anche i blocchi --mirror (row-reverse, specificità 0,2,0) devono impilare:
     altrimenti l'immagine resta piccola a lato. Forzo column + immagine full. */
  .cmp-block--mirror .cmp-block__cols{flex-direction:column;}
  .cmp-block__img,.cmp-block--mirror .cmp-block__img{flex:0 0 auto;max-width:100%;width:100%;}
}

/* ===== cmp-cta: 2 box "Non sai da dove iniziare?" + "Fai il primo passo" (3 card) ===== */
.cmp-cta{background:#fff;}
.cmp-cta__inner{max-width:1320px;margin:0 auto;padding:var(--vsp) 20px;box-sizing:border-box;}
/* box "da dove iniziare" */
.cmp-ask{display:flex;align-items:center;gap:30px;background:var(--cream);padding:32px 44px;margin-bottom:24px;}
.cmp-ask__icon{flex:0 0 auto;width:64px;height:64px;border-radius:50%;background:var(--pink-soft);color:#fff;font-family:"Quicksand",sans-serif;font-weight:700;font-size:34px;line-height:1;display:flex;align-items:center;justify-content:center;}
.cmp-ask__txt{flex:1;min-width:0;}
.cmp-ask__title{font-family:"Quicksand",sans-serif;font-size:26px;font-weight:700;line-height:1.15;color:var(--ink);margin:0 0 6px;}
.cmp-ask__p{font-family:"Quicksand",sans-serif;font-size:18px;font-weight:400;line-height:1.4;color:#6B6E71;margin:0;}
.cmp-ask__btn{flex:0 0 auto;}
/* "Fai il primo passo" */
.cmp-step{margin-top:64px;text-align:center;}
.cmp-step__eyebrow{text-align:center;text-transform:uppercase;letter-spacing:1.5px;font-size:14px;font-weight:700;color:var(--pink);margin:0 0 14px;font-family:"Quicksand",sans-serif;}
.cmp-step__title{font-family:"Quicksand",sans-serif;font-size:50px;font-weight:700;line-height:1.05;color:var(--ink);margin:0 0 48px;}
.cmp-step__cards{display:flex;gap:30px;align-items:stretch;}
.cmp-step__card{flex:1 1 0;min-width:0;background:var(--cream);padding:40px 36px;text-align:left;display:flex;flex-direction:column;}
.cmp-step__icon{display:block;width:74px;height:auto;margin:0 0 26px;}
.cmp-step__ctitle{font-family:"Quicksand",sans-serif;font-size:22px;font-weight:700;text-transform:uppercase;line-height:1.25;color:var(--ink);margin:0 0 18px;}
.cmp-step__ctitle .pink{color:var(--pink);}
.cmp-step__ctext{font-family:"Quicksand",sans-serif;font-size:17px;font-weight:400;line-height:1.5;color:#6B6E71;margin:0 0 16px;}
.cmp-step__ctext--note{font-weight:700;color:var(--ink);}
.cmp-step__link{margin-top:auto;padding-top:22px;border-top:1px solid rgba(38,38,38,.15);display:inline-flex;align-items:center;gap:12px;font-family:"Quicksand",sans-serif;font-size:18px;font-weight:500;color:var(--ink);text-decoration:none;}
.cmp-step__arr{display:inline-flex;align-items:center;line-height:0;}
.cmp-step__arr svg{display:block;width:34px;height:14px;}
@media(max-width:900px){
  .cmp-ask{flex-direction:column;align-items:center;text-align:center;gap:18px;padding:28px 24px;}
  .cmp-step{margin-top:48px;}
  .cmp-step__title{font-size:32px;margin-bottom:32px;}
  .cmp-step__cards{flex-direction:column;}
}

/* ===== cmp-crow: 3 banner CTA orizzontali (icona + testo + bottone), dopo la sezione card ===== */
.cmp-crow{background:#fff;}
/* niente padding-top: la sezione cmp-cta precedente chiude gi&agrave; con var(--vsp) → gap card→banner = --vsp */
.cmp-crow__inner{max-width:1320px;margin:0 auto;padding:0 20px var(--vsp);box-sizing:border-box;}
.cmp-crow__row{display:flex;align-items:center;gap:38px;background:var(--cream);padding:34px 44px;margin-bottom:24px;}
.cmp-crow__row:last-child{margin-bottom:0;}
.cmp-crow__icon{flex:0 0 auto;width:100px;display:flex;align-items:center;justify-content:center;}
.cmp-crow__icon img{display:block;width:74px;height:auto;}
.cmp-crow__body{flex:1;min-width:0;}
.cmp-crow__title{font-family:"Quicksand",sans-serif;font-size:26px;font-weight:700;text-transform:uppercase;line-height:1.2;color:var(--ink);margin:0 0 10px;}
.cmp-crow__title .pink{color:var(--pink);}
.cmp-crow__text{font-family:"Quicksand",sans-serif;font-size:17px;font-weight:400;line-height:1.5;color:#6B6E71;margin:0 0 6px;}
.cmp-crow__text:last-child{margin-bottom:0;}
.cmp-crow__text--note{font-weight:700;color:var(--ink);}
.cmp-crow__btn{flex:0 0 auto;white-space:nowrap;}
@media(max-width:900px){
  .cmp-crow__row{flex-direction:column;align-items:center;text-align:center;gap:18px;padding:28px 24px;
    margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw;max-width:100vw;box-sizing:border-box;}
  .cmp-crow__body{width:100%;}   /* evita che il body si stringa alla larghezza del titolo → il titolo va a capo */
  .cmp-crow__title{font-size:22px;overflow-wrap:break-word;}
}

/* ===== pagine LIBRO (dettaglio) ===== */
/* padding verticale sull'hero (il blocco usa .libro-hero__row, non .wrap, quindi
   il padding di .wrap non si applicava): così l'hero riempie la fascia crema di
   testa (body::before, 600px) e il corpo parte SOTTO la fascia, separato dall'header.
   .libro-metodo .libro-hero ha già lo stesso valore (più specifico) → 1480 invariato. */
.libro-hero{background:transparent;padding:var(--vsp) 0;}
.libro-hero .wrap{display:flex;align-items:center;gap:60px;padding:var(--vsp) 0;}
.libro-hero__text{flex:1 1 auto;min-width:0;}
.libro-hero__text h1{font-family:"Quicksand",sans-serif;font-size:46px;font-weight:700;line-height:1.12;color:var(--ink);margin:0 0 20px;}
.libro-hero__text h3{font-family:"Quicksand",sans-serif;font-size:31.68px;font-weight:700;line-height:1.2;color:var(--pink);margin:0;}
.libro-hero__text h3 strong{color:inherit;}
.libro-hero__cover{flex:0 0 300px;}
.libro-hero__cover img{width:100%;height:auto;display:block;}

/* corpo testo allineato a SINISTRA sulla colonna contenuto (1320px, come l'hero
   e le altre pagine); testo cappato a ~700px (colonna di lettura stretta come
   nel sito live) e allineato al bordo sinistro della colonna. */
.libro-body{max-width:1320px;margin:0 auto;padding:30px 20px 10px;}
.libro-body>*{max-width:700px;margin-left:0;margin-right:0;}
.libro-body p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.5;color:#6B6E71;margin:0 0 18px;}
.libro-body strong{font-weight:700;color:inherit;}
.libro-body em{font-style:italic;}
.libro-body a{color:var(--pink);text-decoration:underline;}

/* box acquisto = "card" crema (cover + nota + prezzo + bottone, contenuto
   centrato dentro la card) ALLINEATA A SINISTRA sulla colonna contenuto:
   .libro-buy è la colonna 1320, .libro-buy__card è la card 760 a sinistra. */
.libro-buy{max-width:1320px;margin:24px auto;padding:0 20px;}
.libro-buy__card{background:var(--cream);max-width:760px;margin:0;padding:var(--vsp) 40px;text-align:center;box-sizing:border-box;}
.libro-buy img{width:300px;max-width:100%;height:auto;margin:0 auto 24px;display:block;}
.libro-buy__note{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.5;color:#6B6E71;max-width:480px;margin:0 auto 20px;}
.libro-buy__price{font-family:"Quicksand",sans-serif;font-size:22px;font-weight:700;color:var(--ink);margin:0 0 22px;}
/* bottone rettangolare maiuscolo come il live/.con-btn */
.libro-buy .wp-block-button__link{border-radius:2px;text-transform:uppercase;letter-spacing:.3px;font-weight:700;padding:16px 44px;}

/* sezione autrice: contenuto nella stessa colonna di lettura (~700px, allineata
   a sinistra come intro/bio); foto + nome CENTRATI rispetto a quella colonna,
   bio a sinistra. */
.libro-about{max-width:1320px;margin:0 auto;padding:24px 20px 40px;}
.libro-about>*{max-width:700px;margin-left:0;margin-right:0;}
.libro-about h2{font-family:"Quicksand",sans-serif;font-size:47px;font-weight:700;color:var(--ink);margin:0 0 24px;text-align:center;}
.libro-about .wp-block-image img{margin-left:auto;margin-right:auto;display:block;}
.libro-about p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.6;color:#6B6E71;margin:0;}
.libro-about a{color:var(--pink);text-decoration:underline;}

.libro-form{max-width:1320px;margin:0 auto;padding:10px 20px 50px;}
.libro-form>*{max-width:760px;margin-left:0;margin-right:0;}
.libro-form h2{font-family:"Quicksand",sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:0 0 10px;}
.libro-form p{font-family:"Quicksand",sans-serif;font-size:18px;color:#6B6E71;margin:0 0 18px;}
@media(max-width:900px){
  .libro-hero .wrap{flex-direction:column;align-items:flex-start;gap:28px;}
  .libro-hero__cover{flex:0 0 auto;max-width:260px;align-self:center;}
  .libro-hero__text h1{font-size:32px;}
  /* titoli pagine libro: su mobile erano fuori scala (40-47px) */
  .libro-about h2,.libro-about2__h2{font-size:30px;line-height:1.15;}
  .libro-cream__h2{font-size:28px;}
  .libro-h2-big{font-size:30px !important;}
}

/* ===== libro-sul-metodo — rebuild fedele al live (scoped .libro-metodo, non tocca libro-unaltra) ===== */
.libro-metodo{--libro-cream:#F9F3F2;}
.libro-main{max-width:1320px;margin:0 auto;padding:0 20px;box-sizing:border-box;}
.libro-metodo .libro-sec{padding:16px 0;}

/* HERO: testo a sx (container più stretto), copertina a dx */
.libro-metodo .libro-hero{padding:var(--vsp) 0;}
.libro-hero__row{display:flex;align-items:center;justify-content:space-between;gap:56px;}
.libro-hero__row .libro-hero__text{flex:1 1 auto;min-width:0;max-width:660px;}
.libro-hero__row .libro-hero__text h1{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;line-height:1.16;color:var(--ink);margin:0 0 18px;}
.libro-hero__row .libro-hero__text h3{font-family:"Quicksand",sans-serif;font-size:24px;font-weight:700;line-height:1.3;color:var(--pink);margin:0;}
.libro-hero__row .libro-hero__cover{flex:0 0 300px;}

/* corpo bianco, testo allineato a sinistra del container principale */
.libro-metodo .libro-sec h2{font-family:"Quicksand",sans-serif;font-size:34px;font-weight:700;line-height:1.18;color:var(--ink);margin:8px 0 18px;}
.libro-metodo .libro-sec p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.6;color:#6B6E71;margin:0 0 18px;}
.libro-metodo .libro-sec strong{font-weight:700;color:inherit;}
.libro-metodo .libro-sec a{color:var(--pink);text-decoration:underline;}
.libro-h2-center{text-align:center !important;}
.libro-h2-big{font-size:40px !important;line-height:1.1 !important;}
.libro-center-p{max-width:880px;margin-left:auto;margin-right:auto;text-align:center;}

/* blocco CTA centrato: copertina + (note) + prezzo + bottoni */
.libro-cta{text-align:center;padding:24px 0 8px;}
.libro-cta__cover{width:390px;max-width:100%;height:auto;margin:0 auto 26px;display:block;}
.libro-metodo .libro-cta .libro-cta__note{font-family:"Quicksand",sans-serif;font-size:36px;font-weight:400;line-height:50px;color:#6B6E71;margin:0 auto 18px;max-width:760px;text-align:center;}
.libro-metodo .libro-cta .libro-cta__price{font-family:"Quicksand",sans-serif;font-size:36px;font-weight:400;line-height:50px;color:#6B6E71;margin:0 0 26px;text-align:center;}
.libro-cta__btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* bottoni */
.libro-btn{display:inline-block;font-family:"Quicksand",sans-serif;font-size:18px;font-weight:700;line-height:1;letter-spacing:.3px;padding:18px 34px;text-decoration:none !important;transition:background .2s ease,color .2s ease,opacity .2s ease;}
.libro-btn--buy{background:var(--teal);color:#fff !important;text-transform:uppercase;}
.libro-btn--buy:hover{background:#006a8d;}
.libro-btn--buy-pink{background:var(--pink);color:#fff !important;text-transform:uppercase;}
.libro-btn--buy-pink:hover{opacity:.92;}
.libro-btn--out{background:transparent;color:var(--ink) !important;border:2px solid var(--ink);}
.libro-btn--out:hover{background:var(--ink);color:#fff !important;}

/* sezioni CREMA: scatola che sborda full-width verso sinistra */
.libro-cream{position:relative;background:var(--libro-cream);max-width:1320px;margin:var(--vsp) auto;padding:var(--vsp) 56px;box-sizing:border-box;}
.libro-cream::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:100vw;background:var(--libro-cream);}
.libro-cream>*{position:relative;z-index:1;}
.libro-cream__h2{font-family:"Quicksand",sans-serif;font-size:40px;font-weight:700;line-height:1.1;color:var(--ink);margin:0 0 30px;text-align:left;}

/* "Cosa otterrai": griglia 3x2, badge numerati */
.libro-benefits__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 30px;margin:0;}
.libro-benefit{text-align:left;}
.libro-benefit__num{width:54px;height:54px;border-radius:50%;background:#FDD9EF;color:#262626;font-family:"Quicksand",sans-serif;font-size:24px;font-weight:700;line-height:54px;text-align:center;margin:0 0 14px;}
.libro-benefit h4{font-family:"Quicksand",sans-serif;font-size:19px;font-weight:700;line-height:25px;color:#6B6E71;margin:0 0 10px;}
.libro-benefit p{font-family:"Quicksand",sans-serif;font-size:19px;font-weight:400;line-height:25px;color:#6B6E71;margin:0;}

/* "Queste sono solo alcune delle lezioni": copertina sx + lista dx */
.libro-metodo .libro-lezioni h2{margin-bottom:46px;}
.libro-lezioni__row{display:flex;gap:50px;align-items:flex-start;margin:0 0 10px;}
.libro-lezioni__cover{flex:0 0 33%;max-width:33%;}
.libro-lezioni__cover img{width:100%;height:auto;display:block;}
.libro-lezioni__list{flex:1;min-width:0;}
.libro-lezioni__list ul{list-style:none;margin:0;padding:0;}
.libro-lezioni__list li{position:relative;padding-left:46px;margin:0 0 18px;font-family:"Quicksand",sans-serif;font-size:19px;line-height:1.5;color:#6B6E71;}
.libro-lezioni__list li::before{content:"";position:absolute;left:0;top:3px;width:28px;height:28px;background:url(/wp-content/uploads/2023/09/arrow-right-svgrepo-com-1-4.svg) no-repeat left center;background-size:contain;}

/* Recensioni: foto+nome sx, quote dx */
.libro-rev__row{display:flex;gap:50px;align-items:flex-start;margin:0 0 10px;}
.libro-rev__who{flex:0 0 20%;max-width:20%;text-align:center;}
.libro-rev__who img{width:150px;height:150px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 12px;max-width:100%;}
.libro-rev__name{font-family:"Quicksand",sans-serif;font-size:16px;line-height:1.4;color:#6B6E71;}
.libro-rev__quote{flex:1;min-width:0;position:relative;padding-left:48px;}
.libro-rev__quote::before{content:"\201C";position:absolute;left:0;top:-6px;font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:72px;line-height:1;color:#007EA7;}
.libro-rev__quote p{font-family:"Quicksand",sans-serif;font-size:18px;font-weight:400;line-height:1.6;color:#6B6E71;margin:0 0 16px;}

/* About + form */
.libro-about2{text-align:center;}
.libro-about2__photo{width:150px;height:150px;border-radius:50%;object-fit:cover;margin:6px auto 18px;display:block;}
.libro-about2__h2{font-family:"Quicksand",sans-serif;font-size:47px;font-weight:700;line-height:48px;color:#262626;margin:0 0 22px;text-align:center;}
.libro-about2__bio{font-family:"Quicksand",sans-serif;font-size:19px;font-weight:400;line-height:1.6;color:#6B6E71;text-align:left;max-width:1008px;margin:0 auto;}
.libro-about2__bio strong{font-weight:700;color:inherit;}
.libro-about2__bio a{color:var(--pink);text-decoration:underline;}
.libro-metodo .libro-form{max-width:760px;margin:24px auto 50px;text-align:left;}
.libro-metodo .libro-form h2{font-family:"Quicksand",sans-serif;font-size:26px;font-weight:700;color:var(--ink);margin:0 0 10px;text-align:left;}
.libro-metodo .libro-form p{font-family:"Quicksand",sans-serif;font-size:18px;color:#6B6E71;margin:0 0 18px;}

@media(max-width:900px){
  .libro-hero__row{flex-direction:column;align-items:flex-start;gap:28px;}
  .libro-hero__row .libro-hero__text{max-width:none;}
  .libro-hero__row .libro-hero__cover{flex:0 0 auto;max-width:260px;align-self:center;}
  .libro-hero__row .libro-hero__text h1{font-size:30px;}
  .libro-benefits__grid{grid-template-columns:1fr;}
  .libro-lezioni__row,.libro-rev__row{flex-direction:column;gap:24px;}
  /* copertine/foto: centrate su mobile */
  .libro-lezioni__cover,.libro-rev__who{flex:0 0 auto;max-width:260px;align-self:center;}
  /* titoli libro-sul-metodo: ridotti su mobile (le regole desktop scoped .libro-metodo
     stanno più sopra in sorgente e vincevano sulle riduzioni generiche → qui, dopo di esse). */
  .libro-metodo .libro-sec h2{font-size:30px;line-height:1.2;}
  .libro-h2-big{font-size:30px !important;}
  .libro-cream__h2{font-size:28px;}
  .libro-about2__h2{font-size:30px;line-height:1.15;}
}

/* contatti: l'embed AC mette margin-top:25px sul <form>, quindi il bordo del form
   parte 25px sotto il top della colonna. Allineo il testo della colonna destra
   ("Puoi contattarmi anche tramite") alla bordatura superiore del form. */
#form_contatti > .col-50:last-child{margin-top:25px;}
/* lo stacco dalla sezione sottostante lo dà già il padding-bottom di .page-content
   (--vsp). Qui niente extra, altrimenti raddoppia (era 60px + --vsp = esagerato). */
#form_contatti{padding-bottom:0;}
@media(max-width:860px){#form_contatti > .col-50:last-child{margin-top:0;}}

/* ===== Dropdown "Comportamenti": si apre al click sul bottone header e lista tutte le pagine ===== */
/* header sopra il main così il menu non finisce dietro l'hero (sotto l'overlay menu z=1000) */
.site-header{z-index:900;}
.site-header__dd{position:relative;}
/* il bottone riusa lo stile .site-header__cta ma è un <button>: reset font/cursore */
.site-header__dd .site-header__cta{font-family:"Quicksand",sans-serif;cursor:pointer;}

/* ===== "Cerca per comportamento" CTA come voce di menu WordPress =====
   Aggiungi la classe `menu-cta` al campo "Classi CSS (facoltativo)" della voce
   di menu in Aspetto → Menu per farla apparire come pulsante CTA. */
.menu-item.menu-cta > a,
li.menu-cta > a{
  display:inline-block;
  padding:9px 35px 10px;
  border:1px solid var(--ink);
  background:transparent;
  color:var(--ink-nav) !important;
  font-family:"Quicksand",sans-serif;
  font-size:17px;
  font-weight:300;
  line-height:1.5;
  text-transform:uppercase;
  text-decoration:none !important;
  transition:background .2s ease,color .2s ease;
}
.menu-item.menu-cta > a:hover,
li.menu-cta > a:hover{
  background:var(--ink);
  color:#fff !important;
}
/* neutralizza la sottolineatura animata del nav standard, se presente */
.menu-item.menu-cta > a::after,
li.menu-cta > a::after{display:none !important;}
.header-menu{position:absolute;top:calc(100% + 14px);right:0;width:320px;max-width:92vw;
  background:#fff;border-radius:5px;box-shadow:0 18px 50px rgba(0,0,0,.16);
  padding:10px 0;z-index:120;}
.header-menu[hidden]{display:none;}
.header-menu a{display:block;padding:11px 24px;text-decoration:none !important;
  font-family:"Quicksand",sans-serif;font-size:16px;font-weight:400;line-height:1.3;color:#262626;
  transition:background .15s ease,color .15s ease;}
.header-menu a:hover{background:var(--cream);color:var(--pink);}
.header-menu a.is-current{color:var(--pink);font-weight:700;}
@media(max-width:680px){.header-menu{right:auto;left:0;}}

/* ===== Menu hamburger mobile: tutte le voci in UNA schermata =====
   - l'overlay è vincolato alla viewport VISIBILE (height:100dvh, non inset:0 che su iOS
     copre la large viewport dietro le barre Safari) + safe-area insets → niente componenti
     tagliati dalla barra URL sopra o dalla toolbar/home-indicator sotto;
   - ritmo verticale compresso così le ~9 voci + ricerca + social stanno senza scroll;
   - overflow-y:auto resta → quando si apre l'accordion "Comportamenti" il menu torna a scorrere;
   - il bottone WhatsApp flottante (z-index 9999) viene nascosto mentre il menu è aperto,
     altrimenti resta sopra e copre le voci. */
body.menu-open .wa-float{display:none;}
@media(max-width:900px){
  .menu-overlay{
    height:100dvh;bottom:auto;              /* fallback: se dvh non supportato resta inset:0 */
    padding:calc(10px + env(safe-area-inset-top)) 12px calc(10px + env(safe-area-inset-bottom));
    align-items:flex-start;
  }
  .menu-overlay__panel{
    max-height:100%;                        /* = altezza overlay (100dvh - padding) */
    padding:10px 24px 18px;
  }
  .menu-overlay__search{margin:8px 0 12px;}
  .menu-overlay__search input{font-size:18px;padding:5px 2px;}
  .menu-overlay__nav > a,
  .menu-overlay__toggle{padding:8px 0;font-size:21px;}
  .menu-overlay__sub{padding:0 0 6px 16px;}
  .menu-overlay__sub a{padding:6px 0;font-size:17px;}
  .menu-overlay__socials{margin-top:14px;gap:12px;}
  .menu-overlay__socials a{width:40px;height:40px;}
  .menu-overlay__socials img{max-width:18px;max-height:17px;}
}

/* La vecchia pagina cerca.html usava un componente .search-results, ma quella
 * classe è anche aggiunta da WordPress al <body> nelle pagine di ricerca: la
 * regola .search-results{max-width:1320px;margin:0 auto} finiva quindi per
 * ingabbiare l'intera pagina (header/main/footer). Il design attuale usa
 * page-head + blog-grid (vedi templates/search.html), quindi il componente è
 * stato rimosso per eliminare la collisione. */

/* Pagina di ricerca: l'header resta sul rettangolo crema globale (body::before,
 * come nelle altre pagine interne), mentre il titolo .cst-pagehead è su bianco
 * anziché sul fondo rosa. Il bianco full-bleed copre la crema nella sua fascia. */
body.search .cst-pagehead { background: #ffffff; }

/* ===== Gap ai bordi di sezioni/box ESATTAMENTE = --vsp =====
   Il padding verticale dei body/box è uniforme (--vsp), ma il margin-top del PRIMO
   figlio (es. h2) e il margin-bottom dell'ULTIMO figlio si sommavano al padding,
   facendo sembrare i gap diversi (sopra il titolo più grande del gap sotto, ecc.).
   Azzerandoli, lo spazio fra bordo e contenuto = esattamente il padding del box. */
.chisono-body .chisono__wrap > :first-child,
.bas-body .wrap > :first-child,
.con-body .wrap > :first-child,
.sg-body .wrap > :first-child,
.art-body > :first-child,
.libro-body > :first-child,
.beige-box > :first-child,
.chisono-beige > :first-child,
.bas-cream > :first-child,
.libro-cream > :first-child,
.cmp-block__txt > :first-child,
.cmp-text__col > :first-child,
.cmp-textbg__col > :first-child,
.cst-cta__inner > :first-child{ margin-top:0 !important; }

.chisono-body .chisono__wrap > :last-child,
.bas-body .wrap > :last-child,
.con-body .wrap > :last-child,
.sg-body .wrap > :last-child,
.art-body > :last-child,
.libro-body > :last-child,
.beige-box > :last-child,
.chisono-beige > :last-child,
.bas-cream > :last-child,
.libro-cream > :last-child,
.cmp-block__txt > :last-child,
.cmp-text__col > :last-child,
.cmp-textbg__col > :last-child,
.cst-cta__inner > :last-child{ margin-bottom:0 !important; }

/* ===== pagina GRAZIE: corpo testo Quicksand grigio, liste con freccia rosa
   (arrow-right-svgrepo, #F768BD) e link rosa — come il sito live. ===== */
.grazie-prose{max-width:1320px;margin:0 auto;padding:var(--vsp) 20px;}
.grazie-prose>*{max-width:760px;margin-left:0;margin-right:0;}
.grazie-prose p{font-family:"Quicksand",sans-serif;font-size:19.2px;font-weight:400;line-height:1.6;color:#6B6E71;margin:0 0 18px;}
.grazie-prose a{color:var(--pink);text-decoration:underline;}
.grazie-prose a:hover{opacity:.85;}
.grazie-arrows{list-style:none;margin:0 0 22px;padding:0 0 0 40px;}
.grazie-arrows li{position:relative;padding-left:52px;margin:0 0 15px;min-height:24px;
  font-family:"Quicksand",sans-serif;font-size:19.2px;line-height:1.4;color:#6B6E71;}
.grazie-arrows li::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:36px;height:24px;background:url("/wp-content/uploads/2023/09/arrow-right-svgrepo-com-1-4.svg") no-repeat left center;background-size:36px auto;}
.grazie-arrows a{color:var(--pink);text-decoration:underline;font-weight:400;}

/* ===== FIX: salto del contenuto quando l'header diventa sticky =====
   L'header è position:sticky (resta nel flusso e RISERVA la sua altezza).
   Con .is-stuck si rimpiccioliva di ~32px (logo 58→46, padding verticale 25→15):
   riducendo il box nel flusso, tutto il contenuto sotto saliva di ~31px (il salto).
   Riservo un'altezza COSTANTE alla barra desktop: il box non cambia più dimensione
   → nessun salto. Il logo continua comunque a rimpicciolirsi dentro la barra. */
.site-header__row.site-header__desktop{min-height:108px;}

/* ===== Pagina EVENTI (ID 599): TUTTO allineato a sinistra =====
   Contenuto legacy (classic editor) pieno di text-align:center inline, align="center"
   e immagini .aligncenter. Forzo tutto a sinistra solo su questa pagina. */
body.page-id-599 .entry-content *{text-align:left !important;}
body.page-id-599 .entry-content img.aligncenter,
body.page-id-599 .entry-content .aligncenter,
body.page-id-599 .entry-content figure.wp-block-image img,
body.page-id-599 .entry-content img{margin-left:0 !important;margin-right:auto !important;}