/**
 * home-public.css
 * Stili condivisi per la home page pubblica (SSR) e l'anteprima preview.
 * Banner iniettati via AJAX dal client; tutto il resto è server-side.
 */

:root {
    --red: #e30613;
    --text: #111827;
    --muted: #6b7280;
    --border: #e0e0e0;
    --bg: #ffffff;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Roboto', sans-serif; background: var(--bg); color: var(--text); }
.home-article-link { color: inherit; text-decoration: none; }
.home-article-link .ac-title,
.home-article-link .lead-title,
.home-article-link .lead6-title,
.home-article-link .lead7-title,
.home-article-link .spot-title,
.home-article-link .cfg10-ed-title { transition: opacity .15s ease; }
.home-article-link:hover .ac-title,
.home-article-link:hover .lead-title,
.home-article-link:hover .lead6-title,
.home-article-link:hover .lead7-title,
.home-article-link:hover .spot-title,
.home-article-link:hover .cfg10-ed-title { opacity: 0.76; }

.home-article-link:hover,
.home-article-link:active,
.home-article-link:focus,
.lead-link:hover,
.lead7-link:hover,
.lead7-img-link:hover,
.art-card-link:hover,
.spot-card-link:hover,
.cfg10-editorial-link:hover {
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

.home-article-link:hover .ac-summary,
.home-article-link:hover .lead-summary,
.home-article-link:hover .lead6-summary,
.home-article-link:hover .lead7-summary,
.home-article-link:hover .spot-summary,
.home-article-link:hover .cfg10-ed-summary {
    opacity: 1 !important;
    color: inherit;
}
.art-card-link,
.spot-card-link { display: contents; }
.lead-link,
.lead7-link,
.lead7-img-link,
.cfg10-editorial-link { display: block; }

/* ── Wrapper pagina ──────────────────────────────────────────────────────── */
.site-wrap { width: min(100%, 1280px); margin: 0 auto; padding: 16px 0 8px; }

/* ── Blocco ──────────────────────────────────────────────────────────────── */
.section-block { margin-bottom: 20px; background: #fff; border: 0; }
.section-block:nth-of-type(n+3) {
    content-visibility: auto;
    /* keyword "auto": dopo il primo render il browser ricorda la dimensione reale
       del blocco → meno re-layout durante lo scroll e stima iniziale più precisa. */
    contain-intrinsic-size: auto 900px;
}
/* Widget piccoli (altezza reale « 900px di contain-intrinsic-size): con
   content-visibility:auto il blocco riserva ~900px finché è off-screen → resta una
   grande striscia bianca sotto il widget (e "salto" quando entra in viewport).
   Li escludiamo → renderizzati sempre, dimensione reale, niente spazio vuoto.
   - calendario: altezza variabile (griglia + liste)
   - partner "Ora viaggiando": banner basso (~140px) e ultimo blocco prima del footer */
.section-block:has(.home-widget-calendario),
.section-block:has(.home-widget-partner-ora-viaggiando) {
    content-visibility: visible;
    contain-intrinsic-size: none;
}
/* "Ora viaggiando" è l'ULTIMO blocco prima del footer: il suo margine inferiore
   si somma al padding-bottom di .site-wrap (24px) e al margin-top del footer (20px),
   lasciando il piccolo banner sospeso con troppo bianco sopra il footer. Azzeriamo
   il margine del blocco → resta solo il distacco standard di fine pagina. */
.section-block:has(.home-widget-partner-ora-viaggiando) { margin-bottom: 0; }
.section-block.has-bg,
.section-block.has-bg .section-body,
.section-block.has-bg .art-grid > div,
.section-block.has-bg .cfg0-left > div:not(.lead-divider),
.section-block.has-bg .cfg0-cols12 > div,
.section-block.has-bg .cfg0-right,
.section-block.has-bg .cfg7-title-row,
.section-block.has-bg .cfg7-right-wrap,
.section-block.has-bg .cfg9-spotlight,
.section-block.has-bg .cfg9-hero-public,
.section-block.has-bg .cfg9-lanes,
.section-block.has-bg .cfg9-main-lane,
.section-block.has-bg .cfg9-mini-lane,
.section-block.has-bg .cfg9-side-lane,
.section-block.has-bg .cfg2-lead,
.section-block.has-bg .cfg2-col,
.section-block.has-bg .art-card,
.section-block.has-bg .spot-card,
.section-block.has-bg .spot-card--hero,
.section-block.has-bg .spot-copy,
.section-block.has-bg .banner-card {
    background: var(--block-bg, #fff);
}
.section-block.widget-bare {
    border: 0;
    background: transparent !important;
    box-shadow: none;
    padding: 0;
}
.section-block.widget-bare .section-body {
    background: transparent !important;
    padding: 0;
}
.section-block.widget-bare .home-widget > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.checkin-header-banner {
    --c-accent: #3c3d8f;
    --c-accent-dark: #2a2b66;
    --c-bg: #f0f5ff;
    --c-bg-gradient: #d3e4fc;
    --c-border: #b8d0f5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    min-height: 75px;
    margin: 0;
    padding: 12px 28px 20px;
    border: 0;
    border-radius: 0;
    background: linear-gradient(135deg, var(--c-bg) 0%, var(--c-bg-gradient) 30%, #fff 50%, var(--c-bg-gradient) 70%, var(--c-bg) 100%);
    background-size: 200% 100%;
    box-shadow: none;
    color: var(--c-accent);
    text-decoration: none;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.checkin-header-banner:hover {
    box-shadow: 0 12px 36px rgba(60, 61, 143, 0.28);
}
.checkin-header-banner.is-checkin-animate {
    animation: checkinBgShift 3s ease 1;
}
.checkin-logo {
    height: 50px;
    width: auto;
    max-width: 320px;
    object-fit: contain;
    flex-shrink: 0;
    filter: brightness(1.02) contrast(1.05);
}
.checkin-center-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 0 20px;
}
.checkin-title-text {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 800;
    color: var(--c-accent);
}
.checkin-subtitle {
    margin: 0;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 600;
    color: #4f5699;
}
.checkin-right-group {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
}
.checkin-badge {
    height: 50px;
    width: auto;
    margin-right: 8px;
    filter: brightness(0) saturate(100%) invert(23%) sepia(67%) saturate(1789%) hue-rotate(224deg) brightness(90%) contrast(104%);
}
.checkin-header-banner.is-checkin-animate .checkin-badge {
    animation: checkinGlowBadge 3s ease-in-out 1;
}
.banner-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--c-accent) 0%, var(--c-accent-dark) 100%);
    color: #fff;
    box-shadow: 0 4px 10px rgba(60, 61, 143, 0.2);
    transition: transform 0.3s ease, background 0.3s ease;
}
.checkin-header-banner:hover .banner-arrow {
    transform: translateX(8px) scale(1.08);
    background: linear-gradient(135deg, var(--c-accent-dark) 0%, #1a1b45 100%);
}
@keyframes checkinBgShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes checkinGlowBadge {
    0%, 100% { filter: brightness(0) saturate(100%) invert(23%) sepia(67%) saturate(1789%) hue-rotate(224deg) brightness(90%) contrast(104%) drop-shadow(0 0 0 rgba(60, 61, 143, 0)); }
    50% { filter: brightness(0) saturate(100%) invert(23%) sepia(67%) saturate(1789%) hue-rotate(224deg) brightness(90%) contrast(104%) drop-shadow(0 0 8px rgba(60, 61, 143, 0.6)); }
}
@media (max-width: 700px) {
    /* Mobile: solo logo (più grande) + freccia; testo/badge nascosti */
    .checkin-header-banner { padding: 14px 12px; gap: 8px; }
    .checkin-logo { height: 46px; max-width: 220px; }
    .checkin-center-content { display: none; }
    .checkin-subtitle,
    .checkin-badge { display: none; }
    .checkin-right-group { gap: 0; }
    .banner-arrow { width: 32px; height: 32px; }
    .banner-arrow svg { width: 16px; height: 16px; }
}
@media (max-width: 480px) {
    .checkin-header-banner { padding: 12px 10px; min-height: 70px; gap: 6px; }
    .checkin-logo { height: 40px; max-width: 180px; }
    .banner-arrow { width: 28px; height: 28px; }
    .banner-arrow svg { width: 14px; height: 14px; }
}
.section-title {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 12px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .1em; color: #fff; background: var(--red); padding: 5px 12px;
}
.section-body { padding: 0; }
/* Blocchi magazine con intestazione semplice (Attualità, Salute): stesso respiro
   verticale dei blocchi check-in/wine (16px), così lo sfondo colorato non viene
   tagliato sopra né resta a filo del contenuto sotto */
.section-block.has-simple .section-body { padding: 16px 0; }
@media (max-width: 760px) { .section-block.has-simple .section-body { padding: 12px 0; } }
/* Intestazioni generiche (Pasqua, Natale, ...): angoli superiori arrotondati come check-in/wine */
.section-block.has-intestazione { overflow: hidden; border-radius: 8px 8px 0 0; }
/* Check-in block: banner integrated, no visual stacco */
.section-block.has-checkin { overflow: hidden; border-radius: 8px 8px 0 0; }

.section-block.has-checkin .checkin-header-banner { margin: 0; border-radius: 0; box-shadow: none; }
/* ── WiNE block header ──────────────────────────────────────────────────── */
.wine-header-banner {
    --w-accent: #a81e3a;
    --w-accent-dark: #7d1426;
    --w-bg: #fff0f3;
    --w-bg-gradient: #ffe8ed;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    min-height: 75px;
    margin: 0;
    padding: 12px 28px 20px;
    border: 0;
    border-radius: 0;
    background: linear-gradient(135deg, var(--w-bg) 0%, var(--w-bg-gradient) 30%, #fff 50%, var(--w-bg-gradient) 70%, var(--w-bg) 100%);
    background-size: 200% 100%;
    animation: wineBgShift 10s ease infinite;
    box-shadow: none;
    color: var(--w-accent);
    text-decoration: none;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.wine-header-banner:hover {
    box-shadow: 0 12px 36px rgba(168, 30, 58, 0.28);
}
.wine-logo {
    height: 50px;
    width: auto;
    max-width: 320px;
    object-fit: contain;
    flex-shrink: 0;
    filter: brightness(1.02) contrast(1.05);
}
.wine-center-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 0 20px;
}
.wine-title-text {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 800;
    color: var(--w-accent);
}
.wine-subtitle {
    margin: 0;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 600;
    color: #8b4f5e;
}
.wine-right-group {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
}
.wine-badge {
    height: 50px;
    width: auto;
    margin-right: 8px;
    filter: brightness(0) saturate(100%) invert(14%) sepia(67%) saturate(3389%) hue-rotate(308deg) brightness(90%) contrast(104%);
    animation: wineGlowBadge 2.5s ease-in-out infinite;
}
.wine-header-banner .banner-arrow {
    background: linear-gradient(135deg, var(--w-accent) 0%, var(--w-accent-dark) 100%);
    box-shadow: 0 4px 10px rgba(168, 30, 58, 0.2);
}
.wine-header-banner:hover .banner-arrow {
    transform: translateX(8px) scale(1.08);
    background: linear-gradient(135deg, var(--w-accent-dark) 0%, #5a0f1e 100%);
    box-shadow: 0 6px 16px rgba(125, 20, 38, 0.35);
}
@keyframes wineBgShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes wineGlowBadge {
    0%, 100% { filter: brightness(0) saturate(100%) invert(14%) sepia(67%) saturate(3389%) hue-rotate(308deg) brightness(90%) contrast(104%) drop-shadow(0 0 0 rgba(168, 30, 58, 0)); }
    50% { filter: brightness(0) saturate(100%) invert(14%) sepia(67%) saturate(3389%) hue-rotate(308deg) brightness(90%) contrast(104%) drop-shadow(0 0 8px rgba(168, 30, 58, 0.6)); }
}
@media (max-width: 700px) {
    /* Mobile: solo logo (più grande) + freccia; testo/badge nascosti */
    .wine-header-banner { padding: 14px 12px; gap: 8px; }
    .wine-logo { height: 46px; max-width: 220px; }
    .wine-center-content { display: none; }
    .wine-subtitle,
    .wine-badge { display: none; }
    .wine-right-group { gap: 0; }
}
@media (max-width: 480px) {
    .wine-header-banner { padding: 12px 10px; min-height: 70px; gap: 6px; }
    .wine-logo { height: 40px; max-width: 180px; }
}
/* WiNE block: banner integrated */
.section-block.has-wine { overflow: hidden; border-radius: 8px 8px 0 0; }

.section-block.has-wine .wine-header-banner { margin: 0; border-radius: 0; box-shadow: none; }


/* ── Lead articolo V1 (cfg0) ─────────────────────────────────────────────── */
.lead-wrap { padding: 14px 16px 14px; }
.lead-oc {
    font-family: 'Faustina', Georgia, serif;
    font-size: 18px; font-weight: 600; text-transform: uppercase;
    color: var(--red); margin-bottom: 8px; line-height: 1.1;
    display: inline-block;
    overflow: hidden; white-space: nowrap;
    max-width: 0;
    border-right: 2px solid var(--red);
    animation: typewriter 2s steps(40, end) 0.3s forwards,
               cursorBlink 0.5s step-end 0.3s 4,
               cursorFade 0.3s ease 2.3s forwards;
}
@keyframes typewriter  { to { max-width: 40ch; } }
@keyframes cursorBlink { 50% { border-color: transparent; } }
@keyframes cursorFade  { to { border-color: transparent; } }
.lead-title {
    font-family: 'Faustina', Georgia, serif;
    font-size: 44px; font-weight: 600; line-height: 1.1;
    color: var(--text); margin-bottom: 10px;
}
.lead-author { font-size: 16px; color: #444; margin: -3px 0 3px; line-height: 1.2; }
.lead-content { display: flex; gap: 16px; align-items: flex-start; margin-top: 8px; }
.lead-img-wrap {
    width: 65%; flex-shrink: 0; position: relative; overflow: hidden; border-radius: 8px;
}
.lead-img {
    width: 100%; display: block; object-fit: cover; aspect-ratio: 16/10;
    animation: leadZoom 3s cubic-bezier(0.25,0.46,0.45,0.94) both;
}
.lead-summary {
    font-family: 'Roboto', sans-serif;
    font-size: 20px; font-weight: 200; line-height: 1.1; color: #000; flex: 1;
}

/* ── Griglia articoli ────────────────────────────────────────────────────── */
.art-grid { display: grid; gap: 0; background: transparent; }
.art-grid.g3 { grid-template-columns: repeat(3, 1fr); }
.art-grid.g3-asym { grid-template-columns: 3fr 2fr 3fr; }
.art-grid.g4 { grid-template-columns: repeat(4, 1fr); }
.art-grid.g4-asym { grid-template-columns: 3fr 2fr 2fr 3fr; }
.art-grid.g2 { grid-template-columns: repeat(2, 1fr); }
.art-grid.g1-2 { grid-template-columns: 2fr 1fr; max-width: 1250px; margin-left: auto; margin-right: auto; }
.art-grid > div { background: #fff; padding: 16px; }

.cfg2-outer { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; background: transparent; }
.cfg2-left-stack { grid-column: 1 / 3; grid-row: 1; display: flex; flex-direction: column; min-width: 0; align-self: start; }
.cfg2-lower-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cfg2-lead { grid-column: 1 / 3; grid-row: 1; background: #fff; align-self: start; }
.cfg2-col { background: #fff; padding: 16px; min-width: 0; }
.cfg2-col1 { grid-column: 1; grid-row: 2; }
.cfg2-col2 { grid-column: 2; grid-row: 2; }
.cfg2-col3 { grid-column: 3; grid-row: 1; }
.cfg2-col4 { grid-column: 4; grid-row: 1; }
/* cfg2 lead V1: font overrides */
.cfg2-lead .lead-title { font-size: 38px; }
.cfg2-lead .lead-summary { font-size: 18px; }
/* cfg2 lead V2: font overrides */
.cfg2-lead .lead6-title { font-size: 36px; }
.cfg2-lead .lead6-summary { font-size: 19px; }

/* ── Layout cfg 0 / cfg 6 / cfg 7 ───────────────────────────────────────── */
.cfg0-outer { display: grid; grid-template-columns: 2fr 1fr; gap: 0; background: transparent; }
.cfg0-left  { display: flex; flex-direction: column; gap: 0; background: transparent; }
.cfg0-left > div:not(.lead-divider) { background: #fff; }
.cfg0-cols12 { display: grid; grid-template-columns: 1fr 1fr; gap: 0; background: transparent; flex: 1; }
.cfg0-cols12 > div { background: #fff; padding: 16px; }
.cfg0-right  { background: #fff; padding: 14px 16px 16px; }/* padding-top 14px: allinea l'occhiello dello slot 14 (dx) a quello del lead A1 (.lead-wrap 14px), era 16px → sfalsava di 2px */

.cfg7-outer     { display: grid; grid-template-columns: 2fr 1fr; gap: 0; background: transparent; }
.cfg7-title-row { grid-column: 1 / -1; background: #fff; padding: 14px 16px 12px; }
.lead7-title    { font-family: 'Faustina', Georgia, serif; font-size: 48px; font-weight: 600; line-height: 1.1; margin-bottom: 10px; }
.art-card--a1app .ac-title { font-style: italic; font-weight: 600; }
.cfg7-appr-sign { display: inline-flex; align-items: center; gap: 5px; margin: 8px 0 4px; color: var(--dc, #e30613); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; font-family: sans-serif; }
.lead7-summary  { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 200; line-height: 1.4; color: #000; margin-bottom: 4px; }
.lead7-summary2 { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 200; line-height: 1.4; color: #000; }
.lead7-body     { padding: 0 16px 14px; }
.cfg7-right-wrap { background: #fff; display: flex; flex-direction: column; padding: 0 16px; }

@media (min-width: 901px) {
    .art-grid.g3 { grid-template-columns: repeat(3, minmax(0, 426.667px)); justify-content: center; }
    .art-grid.g3-asym { grid-template-columns: minmax(0, 480px) minmax(0, 320px) minmax(0, 480px); justify-content: center; }
    .cfg2-outer { grid-template-columns: repeat(4, minmax(0, 320px)); justify-content: center; }
    .cfg0-outer, .cfg7-outer { grid-template-columns: minmax(0, 853.333px) minmax(0, 426.667px); justify-content: center; }
}

/* ── Divisore colorato ──────────────────────────────────────────────────── */
.lead-divider {
    height: 3px;
    background: linear-gradient(90deg, var(--dc, #e30613) 0%, transparent 65%);
    flex-shrink: 0;
    margin: 0 16px;
}

/* ── Lead V2 (cfg6) — verticale ─────────────────────────────────────────── */
.lead6-wrap { padding: 14px 16px 14px; }
.lead6-oc {
    font-family: 'Faustina', Georgia, serif;
    font-size: 18px; font-weight: 600; text-transform: uppercase;
    color: var(--red); margin-bottom: 8px; line-height: 1.1;
    display: block; width: -moz-fit-content; width: fit-content; overflow: hidden; white-space: nowrap;
    max-width: 0; border-right: 2px solid var(--red);/* block (non inline-block): evita lo spazio del line-box sotto l'occhiello → pareggia il gap occhiello→foto a quello dello slot 14 (.ac-oc è block) */
    animation: typewriter 2s steps(40, end) 0.3s forwards,
               cursorBlink 0.5s step-end 0.3s 4,
               cursorFade 0.3s ease 2.3s forwards;
}
.lead6-img-wrap { width: 100%; overflow: hidden; border-radius: 8px; margin-bottom: 12px; }
.lead6-img {
    width: 100%; display: block; object-fit: cover; aspect-ratio: 16/9;
    animation: leadZoom 3s cubic-bezier(0.25,0.46,0.45,0.94) both;
}
.lead6-title {
    font-family: 'Faustina', Georgia, serif;
    font-size: 44px; font-weight: 600; line-height: 1.1;
    color: var(--text); margin-bottom: 10px;
}
.lead6-author { font-size: 16px; color: #444; margin: -3px 0 3px; line-height: 1.2; }
.lead6-summary {
    font-family: 'Roboto', sans-serif;
    font-size: 20px; font-weight: 200; line-height: 1.1; color: #000;
}
@keyframes leadZoom {
    from { transform: scale(1.08); }
    to   { transform: scale(1); }
}

/* ── Colonna articoli con divisori ──────────────────────────────────────── */
.art-col { display: flex; flex-direction: column; }
.art-divider {
    height: 2px;
    background: linear-gradient(90deg, var(--dc, #e30613) 0%, transparent 65%);
    margin: 14px 0 12px;
    flex-shrink: 0;
}

/* ── Pareggia colonne ────────────────────────────────────────────────────── */
@media (min-width: 700px) {
    .blk--eq .art-grid > div,
    .blk--eq .cfg0-cols12 > div { display: flex; flex-direction: column; }
    .blk--eq .cfg0-right        { display: flex; flex-direction: column; }
    .blk--eq .art-col           { flex: 1; justify-content: space-between; }
}

/* ── Card articolo ───────────────────────────────────────────────────────── */
article.art-card { background: #fff; display: flex; flex-direction: column; }
.art-card .ac-oc {
    font-family: 'Faustina', Georgia, serif;
    font-size: 18px; font-weight: 600; text-transform: uppercase;
    margin-bottom: 8px; line-height: 1.1;
}
.art-card .ac-img { width: 100%; aspect-ratio: 3/2; object-fit: cover; display: block; border-radius: 8px; margin-bottom: 8px; }
/* Foto disattivata SOLO su desktop (toggle opzFoto OFF): l'<img> resta nel DOM se la
   vuole il mobile (opzMobFoto ON), qui la nascondo sul desktop. Nel mobile stream viene
   ri-mostrata dalla regola più specifica dentro la media query (≤699px). */
.art-card--no-foto .ac-img { display: none !important; }
.art-card .ac-title {
    font-family: 'Faustina', serif;
    font-size: 28px; line-height: 1; font-weight: 600;
    color: var(--text); margin-bottom: 14px; flex: 1;
}
.art-card .ac-author { font-size: 16px; color: #444; margin: -3px 0 3px; line-height: 1.2; }
.art-card .ac-summary {
    font-family: 'Roboto', sans-serif;
    font-size: 18px; font-weight: 200; line-height: 1.1; color: #000;
}
.mobile-align-pair { display: contents; }
.mobile-layout-stream { display: none; }
@media (max-width: 699px) {
    .desktop-layout-stream { display: none; }
    .mobile-layout-stream { display: block; padding: 0 14px; }
    .mobile-layout-flow { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .mobile-align-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
    .mobile-align-pair .art-card .ac-oc { font-size: 14px; }
    .mobile-align-pair .art-card .ac-title { font-size: 22px; }
    .mobile-align-pair .art-card .ac-summary { font-size: 14px; }
    /* Foto/sommario disattivati SOLO su mobile (toggle opzMobFoto/opzMobSommario):
       la card è renderizzata identica, qui nascondo l'elemento nello stream mobile. */
    .mobile-layout-stream .art-card--no-foto-mob .ac-img { display: none !important; }
    .mobile-layout-stream .art-card--no-summ-mob .ac-summary { display: none !important; }
    /* Foto OFF su desktop ma ON su mobile: nello stream mobile la riattivo (vince per
       specificità sulla regola globale .art-card--no-foto). */
    .mobile-layout-stream .art-card--no-foto .ac-img { display: block !important; }
    .section-block.widget-bare .section-body,
    .section-block.has-composable .section-body { padding-left: 14px; padding-right: 14px; }
    .home-widget { padding-left: 14px; padding-right: 14px; }
    .section-block.widget-bare .home-widget,
    .section-block.has-composable .home-widget,
    .mobile-layout-stream .home-widget { padding-left: 0; padding-right: 0; }
}

/* ── Banner ──────────────────────────────────────────────────────────────── */
.banner-card { background: #fff; display: flex; align-items: center; justify-content: center; padding: 16px; }
.banner-card img { width: 100%; display: block; height: auto; border-radius: 8px; }
/* Banner cfg2 e cfg0: zero padding → immagine occupa l'intera larghezza colonna (320px e 426.667px) */
.cfg2-outer .banner-card,
.cfg0-outer .banner-card,
.cfg7-outer .banner-card,
.art-grid .banner-card { padding: 0; }
.cfg2-outer .banner-card img,
.cfg0-outer .banner-card img,
.cfg7-outer .banner-card img,
.art-grid .banner-card img { width: 100%; max-width: 100%; height: auto; border-radius: 0; }
/* Placeholder banner (SSR): nascosto fino a hydration AJAX */
.banner-ph { display: none; }
/* CLS fix: i placeholder CON banner assegnato riservano lo spazio (aspect-ratio inline da SSR) */
.banner-ph[data-has-banner] { display: block; width: 100%; }
.banner-card { box-sizing: border-box; }
/* Etichetta "Pubblicità" sopra i banner in griglia (trasparenza/IAP art.7) */
.banner-adv { width: 100%; box-sizing: border-box; border: 1px solid #d8d8d8; border-radius: 8px; padding: 5px 6px 6px; background: transparent; }
.banner-adv .adv-label { display: block; font-size: 9px; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; color: #707070; font-weight: 600; margin: 0 0 3px; padding: 0; }


/* -- Config 9: Magazine Spotlight -- */
/* ===== cfg9 — Slideshow "Attualità" ====================================== */
.cfg9-slideshow{max-width:1250px;margin:0 auto}
.cfg9-stage{position:relative;width:100%;aspect-ratio:21/9;border-radius:8px;overflow:hidden;background:#111}
.cfg9-sl{position:absolute;inset:0;opacity:0;transition:opacity .55s ease;pointer-events:none}
.cfg9-sl--on{opacity:1;pointer-events:auto}
.cfg9-sl-link{display:block;position:absolute;inset:0;color:#fff;text-decoration:none}
.cfg9-ph{position:absolute;inset:0;display:block;background:#222}
.cfg9-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;border-radius:0}
.cfg9-img--none{background:linear-gradient(135deg,#2a3a4a,#54647a)}
.cfg9-scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.34) 42%,rgba(0,0,0,.06) 72%)}
.cfg9-copy{position:absolute;left:50%;transform:translateX(-50%);bottom:9%;max-width:74%;padding:16px 24px 18px;color:#fff;z-index:2;text-align:center;background:rgba(18,18,20,.30);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);border-radius:8px}
.cfg9-oc{font-family:'Faustina',serif;font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--dc,var(--red));display:inline-block;padding:3px 9px;border-radius:8px;margin-bottom:12px}
.cfg9-ti{font-family:'Faustina',serif;font-size:36px;line-height:1.08;font-weight:700;margin-bottom:10px;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.cfg9-su{font-family:'Roboto',sans-serif;font-size:17px;font-weight:300;line-height:1.4;opacity:.95;max-width:90%;margin-left:auto;margin-right:auto}
.cfg9-leggi{display:inline-block;margin-top:14px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-bottom:2px solid #fff;padding-bottom:2px;color:#fff}
.cfg9-sl--adv{background:#faf7f1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.cfg9-adlab{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#b0a589;font-weight:700}
.cfg9-sl--adv .banner-adv{max-width:436px;width:86%;border:0;padding:0;background:transparent}
.cfg9-sl--adv .banner-adv .adv-label{display:none}
.cfg9-sl--adv .banner-card{padding:0;background:transparent}
.cfg9-sl--adv .banner-card img{width:100%;height:auto;border-radius:8px;display:block}
.cfg9-sl--adv .banner-ph{width:436px;max-width:86%;aspect-ratio:436/240}
/* Famiglia SLIDE: video (quadrato) a tutto stage, object-fit:contain su gradiente brand */
.cfg9-sl--adv:has(.banner-adv--video){background:linear-gradient(135deg,#2b0a0f 0%,#7a1620 52%,#b21f2d 100%)}
.cfg9-sl--adv .banner-adv--video{position:absolute;inset:0;max-width:none;width:100%;height:100%;display:block;background:transparent}
.cfg9-sl--adv .banner-card--video{position:absolute;inset:0;width:100%;height:100%;padding:0;background:transparent}
.cfg9-sl--adv .banner-card--video a{display:block;width:100%;height:100%}
.cfg9-sl--adv .banner-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;background:transparent;border-radius:0}
.cfg9-sl--adv:has(.banner-adv--video) .cfg9-adlab{position:absolute;top:10px;left:12px;z-index:3;color:rgba(255,255,255,.88);background:rgba(0,0,0,.34);padding:3px 8px;border-radius:6px}
.cfg9-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.85);cursor:pointer;font-size:20px;color:#111;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.cfg9-nav:hover{background:#fff}
.cfg9-prev{left:14px}.cfg9-next{right:14px}
.cfg9-bar{position:absolute;top:0;left:0;height:3px;background:var(--red);width:0;z-index:6;transition:width .1s linear}
.cfg9-pp{position:absolute;top:10px;right:12px;z-index:7;width:30px;height:30px;border:0;border-radius:50%;background:rgba(0,0,0,.42);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cfg9-pp:hover{background:rgba(0,0,0,.62)}
.cfg9-pp svg{display:block}
/* cfg9 fascia sotto: 7a verticale + 8a/9a editoriali (stile cfg10 senza flash) */
.cfg10-outer.cfg9-bottom{margin-top:10px;max-width:1250px;margin-left:auto;margin-right:auto;padding:0;gap:24px}
.cfg9-vcol{min-width:0;padding-top:18px}
.cfg9-vlink{display:block;color:inherit;text-decoration:none}
.cfg9-vimg{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;border-radius:8px;background:#f4f4f4}
.cfg9-vimg--none{display:block;width:100%;aspect-ratio:3/2;border-radius:8px;background:linear-gradient(135deg,#2a3a4a,#54647a)}
.cfg9-voc{font-family:'Faustina',Georgia,serif;font-size:16px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--dc,var(--red));margin:12px 0 6px}
.cfg9-vti{font-family:'Faustina',Georgia,serif;font-size:28px;line-height:1.18;font-weight:700;color:#111827;margin-bottom:8px}
.cfg9-vsu{font-family:'Roboto',sans-serif;font-size:18px;font-weight:300;line-height:1.3;color:#4b5563}
.cfg9-vcol .ac-oc{font-size:18px;margin-bottom:8px}/* allineato a .art-card .ac-oc del blocco A (era 16px/9px) */
.cfg9-vlink:hover .cfg9-vti{opacity:.76}
@media (max-width:760px){.cfg9-bottom{grid-template-columns:1fr}.cfg9-vti{font-size:22px}}
.cfg9-ctrl{display:none;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;background:#f4f4f4;border-radius:8px;padding:8px 10px}
.cfg9-cbtn{flex:0 0 auto;border:1px solid #ddd;background:#fff;border-radius:8px;padding:9px 14px;font-family:'Roboto',sans-serif;font-size:13px;font-weight:700;color:#222;cursor:pointer}
.cfg9-cbtn:active{background:#eee}
.cfg9-cpos{font-size:13px;font-weight:700;color:#555;letter-spacing:.03em}
.cfg9-stripwrap{position:relative;margin-top:24px}
.cfg9-strip{display:flex;align-items:flex-start;gap:10px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;scroll-padding:0 48px}
.cfg9-strip::-webkit-scrollbar{display:none}
.cfg9-sar{position:absolute;top:calc(50% - 15px);transform:translateY(-50%);z-index:4;display:none;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.96);box-shadow:0 2px 9px rgba(0,0,0,.28);cursor:pointer;font-size:20px;line-height:1;color:#111;align-items:center;justify-content:center}
.cfg9-sar:hover{background:#fff}
.cfg9-sar-l{left:4px}
.cfg9-sar-r{right:4px}
.cfg9-stripwrap.has-l .cfg9-sar-l{display:flex}
.cfg9-stripwrap.has-r .cfg9-sar-r{display:flex}
.cfg9-thumb{flex:0 0 calc((100% - 30px) / 4);min-width:0;cursor:pointer;border:0;background:none;padding:0;text-align:left;opacity:1;font:inherit}
.cfg9-thumb.on,.cfg9-thumb:hover{opacity:1}
.cfg9-tph{display:block;width:100%;aspect-ratio:16/9;border-radius:8px;background:#54647a;background-size:cover;background-position:center}
.cfg9-thumb.on .cfg9-tph{box-shadow:inset 0 0 0 3px var(--dc,var(--red))}
.cfg9-tt{font-family:'Faustina',serif;font-size:18px;line-height:1.2;margin-top:8px;font-weight:600;color:#222;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cfg9-thumb--adv .cfg9-tph{aspect-ratio:436/240;background-color:#f3ece0;background-size:contain;background-repeat:no-repeat;background-position:center}
.cfg9-adtag{display:block;margin-top:6px;font-size:10px;color:#b0a589;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.cfg9-more{display:flex;align-items:center;justify-content:center;gap:5px;flex:0 0 auto;align-self:center;min-width:50px;padding:0 4px}
.cfg9-more span{width:7px;height:7px;border-radius:50%;background:#cbd0d6}
.cfg9-tph--ph{background:repeating-linear-gradient(45deg,#efe3d0,#efe3d0 8px,#e9dcc6 8px,#e9dcc6 16px)}
@media (max-width:760px){
  .cfg9-stage{aspect-ratio:4/3}
  .cfg9-copy{max-width:94%;bottom:7%;padding:12px 16px 14px}
  .cfg9-scrim{background:linear-gradient(0deg,rgba(0,0,0,.80) 0%,rgba(0,0,0,.25) 55%,rgba(0,0,0,.05) 100%)}
  .cfg9-ti{font-size:24px}
  .cfg9-su{display:none}
  .cfg9-nav{display:none}
  .cfg9-ctrl{display:flex}
  .cfg9-thumb{flex:0 0 calc((100% - 20px) / 3)}
}

/* ===== cfg9 mobile — slider "peek" (card che si intravedono) + lista "Altre notizie" =====
   Sotto i 760px il blocco desktop (.cfg9-desktop) è nascosto e si mostra .cfg9-m.
   JS: initPeek() in /cfg9-slide.js. */
.cfg9-m{display:none}
.cfg9-m-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}
.cfg9-m-track::-webkit-scrollbar{display:none}
.cfg9-mc{flex:0 0 86%;scroll-snap-align:center;position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/5;background:#111}
.cfg9-mc-link{display:block;position:absolute;inset:0;color:#fff;text-decoration:none}
.cfg9-mc-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.cfg9-mc-img--none{background:linear-gradient(135deg,#2a3a4a,#54647a)}
.cfg9-mc-scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.88) 3%,rgba(0,0,0,.30) 46%,rgba(0,0,0,0) 80%)}
.cfg9-mc-copy{position:absolute;left:0;right:0;bottom:0;padding:16px 15px;color:#fff}
.cfg9-mc-oc{display:inline-block;font-family:'Faustina',serif;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--dc,var(--red));padding:3px 8px;border-radius:6px;margin-bottom:9px}
.cfg9-mc-ti{display:block;font-family:'Faustina',serif;font-size:20px;line-height:1.12;font-weight:700;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.cfg9-mc-su{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-family:'Roboto',sans-serif;font-weight:300;font-size:14px;line-height:1.36;margin-top:7px;opacity:.95}
.cfg9-mc--adv{display:flex;align-items:center;justify-content:center;background:#0e0f12}
.cfg9-mc--adv .cfg9-adlab{position:absolute;top:10px;left:12px;z-index:3;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.88);background:rgba(0,0,0,.34);padding:3px 8px;border-radius:6px;font-weight:700}
/* l'idratazione (home-banner-loader.js) inserisce .banner-adv > .banner-card > (img|video.banner-video).
   La card è 4/5: contieni media alla proporzione corretta, niente stiramenti. La nostra label
   .cfg9-adlab basta → nascondi quella interna del banner. */
.cfg9-mc--adv .banner-ph,
.cfg9-mc--adv .banner-adv,
.cfg9-mc--adv .banner-card{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;padding:0;background:transparent;display:flex;align-items:center;justify-content:center}
.cfg9-mc--adv .banner-adv .adv-label{display:none}
.cfg9-mc--adv .banner-card > a{display:block;width:100%;height:100%}
.cfg9-mc--adv .banner-video,
.cfg9-mc--adv .banner-card img,
.cfg9-mc--adv .banner-adv img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;border-radius:0;background:#0e0f12}
.cfg9-m-dots{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:12px}
.cfg9-m-dots button{width:8px;height:8px;border-radius:50%;border:0;background:#d2d6dc;cursor:pointer;padding:0;transition:width .2s ease,background .2s ease}
.cfg9-m-dots button.on{background:var(--red);width:22px;border-radius:5px}
.cfg9-m-more{display:flex;align-items:center;gap:9px;margin:20px 2px 2px}
.cfg9-m-more span{font-size:13px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#6b7280}
.cfg9-m-more i{flex:1;height:1px;background:#ececec}
.cfg9-ml-row{border-bottom:1px solid #ededed}
.cfg9-ml-row:last-child{border-bottom:0}
.cfg9-ml-link{display:grid;grid-template-columns:132px 1fr;gap:13px;align-items:center;padding:12px 0;text-decoration:none;color:inherit}
.cfg9-ml-th{width:132px;aspect-ratio:3/2;object-fit:cover;border-radius:8px;display:block;background:#eee}
.cfg9-ml-th--none{aspect-ratio:3/2;background:linear-gradient(135deg,#2a3a4a,#54647a)}
.cfg9-ml-oc{display:block;font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--dc,var(--red));margin-bottom:4px}
.cfg9-ml-ti{display:block;font-family:'Faustina',serif;font-size:19px;line-height:1.22;font-weight:700;color:#1a1a1a}
@media (max-width:760px){
  .cfg9-desktop{display:none}
  .cfg9-m{display:block}
  /* gutter laterale 14px come gli altri blocchi (mobile-stream/composable) */
  .section-block.has-mgutter .section-body{padding-left:14px;padding-right:14px}
}

/* ── Intestazione semplice (scritta a sinistra + divisore, allineata al blocco, max 1250px) ── */
.iat-ih{display:flex;align-items:center;gap:16px;max-width:1250px;margin:0 auto;padding:2px 0 14px}
.iat-ih-title{flex:0 0 auto;display:flex;align-items:center;gap:13px;font-family:'Faustina',Georgia,'Times New Roman',serif;font-size:27px;line-height:1;font-weight:700;color:#1a1a1a;letter-spacing:.2px;white-space:nowrap}
.iat-ih-title::before{content:"";width:6px;height:24px;background:var(--ih-accent,#d62629);border-radius:3px;flex:none}
.iat-ih-rule{flex:1 1 auto;height:2px;background:#e7e7e7}
@media (max-width:760px){.iat-ih{padding-bottom:10px}.iat-ih-title{font-size:21px}.iat-ih-title::before{height:20px}}

/* ── cfg13 "Salute Deck" — carosello di schede; accento da deck_colore (default rosso), chrome neutro ── */
.cfg13-deck{--gr-ink:#b1122a;--gr-accent:#d62629;max-width:1250px;margin:0 auto;position:relative}
.cfg13-viewport{overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}
.cfg13-viewport::-webkit-scrollbar{display:none}
.cfg13-track{display:flex;gap:20px;padding:6px 2px}
.cfg13-card{flex:0 0 calc((100% - 40px)/3);scroll-snap-align:start;min-width:0;background:#fff;border:1px solid #e7e7e7;border-radius:8px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.06);transition:box-shadow .25s ease,transform .25s ease}
.cfg13-card:hover{box-shadow:0 12px 30px rgba(0,0,0,.14);transform:translateY(-3px)}
.cfg13-card-link{display:block;color:inherit;text-decoration:none}
.cfg13-media{display:block;position:relative;width:100%;aspect-ratio:16/10;background:#eee;overflow:hidden}
.cfg13-img{width:100%;height:100%;object-fit:cover;display:block}
.cfg13-img--none{display:block;width:100%;height:100%;background:linear-gradient(135deg,#c9ccd1,#9aa0a8)}
.cfg13-body{padding:16px 18px 18px}
.cfg13-oc{display:inline-block;font-family:'Faustina',serif;font-size:12.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--gr-accent);padding:3px 9px;border-radius:8px;margin-bottom:10px}
.cfg13-ti{font-family:'Faustina',Georgia,serif;font-size:21px;line-height:1.14;font-weight:700;color:#1a1a1a;margin:0 0 8px}
.cfg13-su{font-family:'Roboto',sans-serif;font-size:14.5px;font-weight:300;line-height:1.4;color:#555;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cfg13-leggi{display:inline-block;margin-top:12px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gr-ink);border-bottom:2px solid var(--gr-accent);padding-bottom:2px}
.cfg13-card--adv{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#f7f7f7;border-style:dashed;border-color:#e2e2e2}
.cfg13-adlab{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#aaa;font-weight:700}
.cfg13-card--adv .banner-ph{width:100%;max-width:340px;aspect-ratio:436/240}
.cfg13-card--adv .banner-adv{border:0;padding:0;background:transparent}
.cfg13-card--adv .banner-adv .adv-label{display:none}
.cfg13-card--adv .banner-card{padding:0;background:transparent}
.cfg13-card--adv .banner-card img,.cfg13-card--adv .banner-adv img{width:100%;height:auto;border-radius:8px;display:block}
.cfg13-nav{position:absolute;top:38%;transform:translateY(-50%);z-index:5;width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:var(--gr-ink);cursor:pointer;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 12px rgba(0,0,0,.18)}
.cfg13-nav:hover{background:var(--gr-ink);color:#fff}
.cfg13-prev{left:8px}.cfg13-next{right:8px}
.cfg13-dots{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:16px}
.cfg13-dot{width:8px;height:8px;border-radius:50%;border:0;background:#dcdcdc;cursor:pointer;padding:0;transition:width .2s ease,background .2s ease}
.cfg13-dot.on{background:var(--gr-accent);width:22px;border-radius:5px}
@media (max-width:980px){.cfg13-card{flex-basis:calc((100% - 20px)/2)}}
@media (max-width:680px){
  .cfg13-card{flex-basis:86%}
  .cfg13-nav{display:none}
  .cfg13-ti{font-size:19px}
}

/* ── cfg14 "Verticale + Editoriali" — righe [verticale/banner | editoriali], 2ª ribaltabile ── */
.cfg14-wrap{max-width:1250px;margin:0 auto}
.cfg14-row{display:grid;grid-template-columns:minmax(280px,.52fr) minmax(0,1.22fr);gap:22px;padding:14px 0;align-items:start}
/* divisore di riga rimosso: su tema colorato (es. Natale) il filetto grigio sembrava bianco */
.cfg14-wrap > .cfg14-row:not(:last-child){border-bottom:0}
.cfg14-row--rev{grid-template-columns:minmax(0,1.22fr) minmax(280px,.52fr)}
.cfg14-row--rev .cfg14-edcol{grid-column:1;grid-row:1}
.cfg14-row--rev .cfg14-vcol{grid-column:2;grid-row:1}
/* nel ribaltamento le foto degli editoriali restano LATERALI (immagine a sinistra), non al centro:
   si scambiano solo le colonne della riga, l'interno delle card resta invariato. */
.cfg14-vcol{min-width:0}/* padding-top:6px rimosso: allinea l'occhiello A14 a quello del blocco A1 (lead6-wrap 14px) */
.cfg14-edcol{min-width:0}
.cfg14-vcol .ac-oc{font-size:18px;margin-bottom:8px}/* allineato a .art-card .ac-oc del blocco A (era 16px/9px) */
.cfg14-vbanner{display:flex;flex-direction:column;align-items:center;gap:6px}
.cfg14-vbanner .cfg14-adlab{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#b0a589;font-weight:700;align-self:flex-start}
.cfg14-vbanner .banner-ph{width:100%;max-width:360px;aspect-ratio:3/4}
.cfg14-vbanner .banner-adv{border:0;padding:0;background:transparent;width:100%;max-width:360px}
.cfg14-vbanner .banner-adv .adv-label{display:none}
.cfg14-vbanner .banner-card{padding:0;background:transparent}
.cfg14-vbanner .banner-card img,.cfg14-vbanner .banner-adv img{width:100%;height:auto;border-radius:8px;display:block}
@media (max-width:760px){.cfg14-row,.cfg14-row--rev{grid-template-columns:1fr}.cfg14-row--rev .cfg14-vcol,.cfg14-row--rev .cfg14-edcol{grid-column:1}}

/* ── Flash news ──────────────────────────────────────────────────────────── */
ul.flash-list { display: flex; flex-direction: column; list-style: none; }
.flash-list .flash-item {
    padding: 7px 12px; border-bottom: 1px solid var(--border);
    font-family: 'Roboto Condensed', sans-serif; font-size: 16px; font-weight: 600;
    color: var(--text); line-height: 1.3;
}
.flash-list .flash-item:last-child { border-bottom: none; }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .art-grid.g3, .art-grid.g4 { grid-template-columns: repeat(2, 1fr); }
    .art-grid.g3-asym { grid-template-columns: 1fr 1fr; }
    .art-grid.g1-2 { grid-template-columns: 1fr 1fr; }
    .art-grid.g4-asym { grid-template-columns: 1fr 1fr; }
    .cfg2-outer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cfg2-left-stack, .cfg2-lead, .cfg2-col1, .cfg2-col2, .cfg2-col3, .cfg2-col4 { grid-column: auto; grid-row: auto; }
    .cfg2-lead { grid-column: 1 / -1; }
    .lead-content { flex-direction: column; }
    .lead-img-wrap { width: 100%; }
}
@media (max-width: 540px) {
    .art-grid.g3, .art-grid.g4, .art-grid.g2, .art-grid.g3-asym, .art-grid.g4-asym, .art-grid.g1-2 { grid-template-columns: 1fr; }
    .cfg2-outer { grid-template-columns: 1fr; }
    .cfg0-outer, .cfg7-outer { grid-template-columns: 1fr; }
    .cfg0-cols12 { grid-template-columns: 1fr; }
.cfg2-lower-pair { grid-template-columns: 1fr; }
    .cfg2-lead { grid-column: auto; }
    .lead-title, .lead6-title, .lead7-title { font-size: 32px; }
}
@media (max-width: 699px) {
    /* Componibili: su mobile scorrono in orizzontale invece di impilarsi.
       La card a 82% lascia "sbirciare" la successiva = affordance di scroll. */
    .section-block.has-composable .art-grid.widget-composable {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 82%;
        gap: 12px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 8px;
        scrollbar-width: none;
    }
    .section-block.has-composable .art-grid.widget-composable > * { scroll-snap-align: start; }
    .section-block.has-composable .art-grid.widget-composable::-webkit-scrollbar { display: none; }
    /* cfg12 (video 2x1 + abbonamenti): su mobile NON i due pannelli affiancati all'82%,
       ma video sopra a tutta larghezza (scorre a swipe internamente) e abbonamenti sotto.
       minmax(0,1fr) + min-width:0 = niente blow-out: la colonna resta alla larghezza dello
       schermo e l'overflow-x del video viene ritagliato (swipe); senza, le card a 78vw
       gonfiavano la traccia a ~1250px (video fuori schermo, abbonamenti schiacciato).
       Scoped a .g1-2 → il componibile cfg11 (.g3) resta a pannelli. */
    .section-block.has-composable .art-grid.g1-2.widget-composable {
        grid-auto-flow: row;
        grid-template-columns: minmax(0, 1fr);
        overflow-x: visible;
        scroll-snap-type: none;
    }
    .section-block.has-composable .art-grid.g1-2.widget-composable > .art-col,
    .section-block.has-composable .art-grid.g1-2.widget-composable > .art-col > .home-widget {
        min-width: 0;
        width: 100%;
    }
}

/* ── Fascia Widget Composabili (cfg11) ───────────────────────────────────── */
.section-block.has-composable {
    background: radial-gradient(900px 280px at 0% 120%, #ffd6cc 0%, transparent 55%),
                linear-gradient(130deg, #fff8f5 0%, #ffeee6 100%);
    max-width: 1250px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 8px;
}
.section-block.has-composable .section-body { background: transparent; }
.section-block.has-composable .art-grid > div { background: transparent; padding: 12px 8px; }
/* widget componibili: stessa altezza in riga (più letti / sequestri / newsletter) */
.section-block.has-composable .art-grid { align-items: stretch; }
.section-block.has-composable .art-col { display: flex; align-self: stretch; }
.section-block.has-composable .art-col > .home-widget { flex: 1 1 auto; display: flex; flex-direction: column; width: 100%; }
.section-block.has-composable .art-col > .home-widget > * { flex: 1 1 auto; min-height: 100%; }

/* ── Widget: max 1250 centrati + niente ombre (tutti i widget e colonne con widget) ── */
.home-widget { max-width: 1250px; margin-left: auto; margin-right: auto; }
.art-col:has(.home-widget), .art-grid > div:has(.home-widget), .cfg0-right:has(.home-widget), .cfg0-left:has(.home-widget) { max-width: 1250px; margin-left: auto; margin-right: auto; }
.home-widget, .home-widget *, .section-block.has-composable, .section-block.has-composable .art-grid > div, .section-block.widget-bare .section-body, .section-block.widget-bare * { box-shadow: none !important; }


/* ==================================================================
   IPAD-TABLET-TUNE-20260608  (fascia 701-1023 verticale)
   Inserito da intervento performance/layout iPad. Rimovibile in blocco.
   ================================================================== */
/* ===== iPad portrait (701–1023) — WIDGET ===== */
@media (min-width:701px) and (max-width:1023px){
  /* Widget componibili: scroll ORIZZONTALE come sul telefono quando le card
     si rimpiccioliscono — niente colonna singola, card che "sbircia". */
  .section-block.has-composable .art-grid.widget-composable{
    display:grid;
    grid-template-columns:none;
    grid-auto-flow:column;
    grid-auto-columns:clamp(240px,40%,320px);
    gap:14px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .section-block.has-composable .art-grid.widget-composable>*{scroll-snap-align:start;}
  .section-block.has-composable .art-grid.widget-composable::-webkit-scrollbar{display:none;}

  /* cfg9 spotlight: 3 corsie in 2 colonne lasciavano una cella vuota (spazio bianco).
     Hero a tutta larghezza, poi mini + side affiancate. */
  .cfg9-lanes,.cfg9-lanes.cfg9-lanes-inv{grid-template-columns:1fr 1fr;}
  .cfg9-lanes .cfg9-main-lane{grid-column:1 / -1;}
}

/* ===== iPad portrait (701–1023) — PRIMO PIANO + INTESTAZIONI ===== */
@media (min-width:701px) and (max-width:1023px){
  /* PRIMO PIANO (cfg7/cfg0): a 2fr|1fr la colonna destra restava VUOTA (spazio bianco).
     Hero a tutta larghezza; eventuali articoli secondari in 2 colonne sotto (non impilati). */
  .cfg0-outer,.cfg7-outer{grid-template-columns:1fr;}
  .cfg0-cols12{grid-template-columns:1fr 1fr;}
  .lead7-title,.lead6-title,.lead-title{font-size:clamp(30px,4.6vw,42px);}
  .lead7-summary,.lead7-summary2,.lead6-summary{font-size:clamp(15px,1.9vw,18px);}

  /* INTESTAZIONI blocco WiNE / Check-In: testo snellito e adattato al tablet,
     badge nascosto per dare respiro al testo (come su mobile, ma con sottotitolo). */
  .wine-header-banner,.checkin-header-banner{padding:12px 18px 14px;gap:14px;}
  .wine-logo,.checkin-logo{height:clamp(34px,5vw,44px);max-width:220px;}
  .wine-center-content,.checkin-center-content{padding:0 12px;}
  .wine-title-text,.checkin-title-text{font-size:clamp(13px,1.9vw,15px);line-height:1.2;}
  .wine-subtitle,.checkin-subtitle{font-size:clamp(10px,1.35vw,12px);line-height:1.25;}
  .wine-badge,.checkin-badge{display:none;}
  .wine-right-group,.checkin-right-group{gap:10px;}
}

/* ============================================================
   HOME CARD: cliccabili SOLO foto e titolo (non occhiello/autore/sommario).
   Vale per TUTTE le configurazioni (lead, art-card, cfg9/10/13...) perché
   tutte usano .home-article-link. Tecnica: link inerte (pointer-events:none),
   riattivato auto solo sugli elementi foto+titolo. Click sul figlio "auto"
   risale comunque all'<a> e naviga; click su sommario/occhiello = inerte.
   ============================================================ */
.home-article-link { pointer-events: none; }
.home-article-link img,
.home-article-link .ac-img,
.home-article-link .lead-img, .home-article-link .lead-img-wrap,
.home-article-link .lead6-img, .home-article-link .lead6-img-wrap,
.home-article-link .cfg9-img, .home-article-link .cfg9-mc-img,
.home-article-link .cfg10-ed-img, .home-article-link .cfg13-img,
.home-article-link .ac-title,
.home-article-link .lead-title, .home-article-link .lead6-title, .home-article-link .lead7-title,
.home-article-link .cfg9-ti, .home-article-link .cfg9-vti, .home-article-link .cfg9-tt,
.home-article-link .cfg9-mc-ti, .home-article-link .cfg9-ml-ti,
.home-article-link .cfg10-ed-title, .home-article-link .cfg13-ti,
.home-article-link .cfg9-leggi, .home-article-link .cfg13-leggi,
.home-article-link .gh-tematico-titolo {
    pointer-events: auto;
    cursor: pointer;
}

.cfg9-author{font-family:'Roboto',sans-serif;font-size:15px;color:#fff;opacity:.92;margin:0 0 6px;text-shadow:0 1px 8px rgba(0,0,0,.45)}