/**
 * 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 24px; }

/* ── Blocco ──────────────────────────────────────────────────────────────── */
.section-block { margin-bottom: 20px; background: #fff; border: 0; }
.section-block:nth-of-type(n+3) {
    content-visibility: auto;
    contain-intrinsic-size: 900px;
}
.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: 15px 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) {
    .checkin-header-banner { padding: 14px 12px; gap: 8px; }
    .checkin-logo { height: 35px; max-width: 140px; }
    .checkin-center-content { padding: 0; }
    .checkin-title-text { font-size: 12px; line-height: 1.3; }
    .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: 30px; max-width: 110px; }
    .checkin-title-text { font-size: 11px; font-weight: 700; }
    .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; }
/* Check-in block: banner integrated, no visual stacco */
.section-block.has-checkin { overflow: hidden; border-radius: 12px 12px 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) {
    .wine-header-banner { padding: 14px 12px; gap: 8px; }
    .wine-logo { height: 35px; max-width: 140px; }
    .wine-center-content { padding: 0; }
    .wine-title-text { font-size: 12px; line-height: 1.3; }
    .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: 30px; max-width: 110px; }
    .wine-title-text { font-size: 11px; font-weight: 700; }
}
/* WiNE block: banner integrated */
.section-block.has-wine { overflow: hidden; border-radius: 12px 12px 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: 'Playfair Display', 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: 'Playfair Display', Georgia, serif;
    font-size: 44px; font-weight: 600; line-height: 1.1;
    color: var(--text); margin-bottom: 10px;
}
.lead-author { font-size: 14px; color: var(--muted); margin-bottom: 12px; }
.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.g4 { grid-template-columns: repeat(4, 1fr); }
.art-grid.g2 { grid-template-columns: repeat(2, 1fr); }
.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: 16px; }

.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: 'Playfair Display', 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, 426.667px); justify-content: center; }
    .cfg2-outer { grid-template-columns: repeat(4, 320px); justify-content: center; }
    .cfg0-outer, .cfg7-outer { grid-template-columns: 853.333px 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: 'Playfair Display', 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;
}
.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: 'Playfair Display', Georgia, serif;
    font-size: 44px; font-weight: 600; line-height: 1.1;
    color: var(--text); margin-bottom: 10px;
}
.lead6-author { font-size: 14px; color: var(--muted); margin-bottom: 12px; }
.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: 'Playfair Display', 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; }
.art-card .ac-title {
    font-family: 'Playfair Display', serif;
    font-size: 28px; line-height: 1; font-weight: 600;
    color: var(--text); margin-bottom: 14px; flex: 1;
}
.art-card .ac-author { font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.art-card .ac-summary {
    font-family: 'Roboto', sans-serif;
    font-size: 18px; font-weight: 200; line-height: 1.1; color: #000;
}

/* ── 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: 4px; }
/* 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; }


/* -- Config 9: Magazine Spotlight -- */
.cfg9-spotlight { background: #fff; }
.cfg9-hero-public { border-bottom: 0; }
.cfg9-lanes { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(220px, .82fr) minmax(280px, 1fr); gap: 0; margin-top: 18px; }
.cfg9-lanes.cfg9-lanes-inv { grid-template-columns: minmax(280px, 1fr) minmax(220px, .82fr) minmax(0, 1.6fr); }
.cfg9-main-lane { order: 1; }
.cfg9-mini-lane  { order: 2; }
.cfg9-side-lane  { order: 3; }
.cfg9-lanes.cfg9-lanes-inv .cfg9-main-lane { order: 3; }
.cfg9-lanes.cfg9-lanes-inv .cfg9-side-lane { order: 1; }
.cfg9-hero-inv .spot-card--hero .spot-img-crop { order: 2; }
.cfg9-hero-inv .spot-card--hero .spot-img { order: 2; }
.cfg9-hero-inv .spot-card--hero .spot-copy    { order: 1; }
.cfg9-hero-inv .spot-card--hero .spot-copy::before { left: auto; right: 0; }
.cfg9-main-lane, .cfg9-mini-lane, .cfg9-side-lane { min-width: 0; }
.cfg9-main-lane, .cfg9-mini-lane { border-right: 0; }
.spot-card { position: relative; display: grid; gap: 14px; background: #fff; border-top: 0; padding: 16px; }
.cfg9-lane .art-divider { margin: 0 16px; }
.spot-img { width: 100%; display: block; object-fit: cover; border-radius: 4px; background: #f4f4f4; }
.spot-img-crop { display: block; width: 100%; aspect-ratio: 1200 / 580; overflow: hidden; background: #f4f4f4; border-radius: 8px; }
.spot-img-crop .spot-img { height: 100%; border-radius: inherit; object-position: var(--crop-x, 50%) var(--crop-y, 50%); transform: scale(var(--crop-scale, 1)); transform-origin: var(--crop-x, 50%) var(--crop-y, 50%); }
.spot-oc { font-family: 'Playfair Display', serif; font-size: 15px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--dc, var(--red)); margin-bottom: 8px; }
.spot-title { font-family: 'Playfair Display', serif; line-height: 1; font-weight: 600; color: var(--text); margin-bottom: 14px; }
.spot-summary { font-size: 18px; font-weight: 300; line-height: 1.2; color: #1f2937; margin-top: 10px; }
.spot-card--hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: stretch; min-height: 330px; border-top: 0; padding: 0; background: #fafafa; }
.spot-card--hero .spot-img { width: 100%; height: auto; aspect-ratio: 1200 / 580; min-height: 0; border-radius: 8px; object-fit: cover; }
.spot-card--hero .spot-img-crop .spot-img { height: 100%; aspect-ratio: auto; }
.spot-card--hero .spot-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 24px 30px 24px 36px; border-left: 0; background: #fff; }
.spot-card--hero::after { content: ''; position: absolute; left: 16px; right: 16px; bottom: -14px; height: 2px; background: linear-gradient(90deg, var(--dc, var(--red)) 0%, transparent 65%); }
.spot-card--hero .spot-copy::before { content: ''; position: absolute; left: 0; top: 24px; bottom: 24px; width: 3px; background: linear-gradient(180deg, var(--dc, var(--red)) 0%, transparent 80%); }
.spot-card--hero .spot-title { font-size: 36px; letter-spacing: 0; max-width: none; }
.spot-card--hero .spot-summary { font-size: 18px; line-height: 1.28; max-width: none; }
.spot-card--main { grid-template-columns: 150px minmax(0, 1fr); align-items: start; }
.spot-card--main .spot-img { aspect-ratio: 4/3; }
.spot-card--main .spot-title { font-size: 24px; }
.spot-card--mini { grid-template-columns: 72px minmax(0, 1fr); align-items: center; padding: 12px; }
.spot-card--mini .spot-img { aspect-ratio: 1/1; }
.spot-card--mini .spot-summary { display: none; }
.spot-card--mini .spot-oc { display: block; font-size: 14px; margin-bottom: 6px; }
.spot-card--mini .spot-title { font-size: 18px; }
.spot-card--no-img { grid-template-columns: 1fr !important; }
.spot-card--no-img .spot-copy { width: 100%; min-width: 0; }
.spot-card--mini.spot-card--no-img { padding: 14px 16px; align-items: start; }
.spot-card--mini.spot-card--no-img .spot-title { font-size: 21px; }
.spot-card--main.spot-card--no-img .spot-title, .spot-card--side.spot-card--no-img .spot-title { max-width: none; }
.spot-card--side { padding: 16px 18px 18px; }
.spot-card--side .spot-img { aspect-ratio: 16/10; }
.spot-card--side .spot-title { font-size: 26px; }
@media (min-width: 901px) { .cfg9-spotlight { width: 100%; max-width: none; margin: 0; } }
@media (max-width: 900px) {
    .cfg9-lanes { grid-template-columns: 1fr 1fr; }
    .cfg9-main-lane { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
    .cfg9-mini-lane { border-right: 0; }
    .spot-card--hero { display: block; min-height: 0; }
    .spot-card--hero .spot-img { min-height: 0; height: auto; aspect-ratio: 1200 / 580; border-radius: 8px; }
    .spot-card--hero .spot-img-crop .spot-img { height: 100%; aspect-ratio: auto; }
    .spot-card--hero .spot-copy { padding: 18px 20px 22px; }
    .spot-card--hero::after { left: 20px; right: 20px; bottom: -12px; }
    .spot-card--hero .spot-copy::before { left: 20px; right: 20px; top: 0; bottom: auto; width: auto; height: 2px; background: linear-gradient(90deg, var(--dc, var(--red)) 0%, transparent 65%); }
    .spot-card--hero .spot-title { font-size: 30px; max-width: none; }
    .spot-card--hero .spot-summary { font-size: 17px; line-height: 1.25; max-width: none; }
}
@media (max-width: 540px) {
    .cfg9-lanes { grid-template-columns: 1fr; }
    .cfg9-mini-lane, .cfg9-main-lane { border-right: 0; }
    .spot-card { padding: 14px; }
    .spot-card--main { grid-template-columns: 1fr; gap: 10px; }
    .spot-card--main .spot-img { aspect-ratio: 16/9; }
    .spot-card--mini { grid-template-columns: 76px minmax(0, 1fr); gap: 11px; }
    .spot-card--hero { padding: 0; }
    .spot-card--hero .spot-copy { padding: 16px 18px 20px; }
    .spot-card--hero .spot-title { font-size: 25px; max-width: none; }
    .spot-card--hero .spot-summary { font-size: 15px; }
    .spot-card--main .spot-title, .spot-card--side .spot-title { font-size: 24px; }
    .spot-card--main .spot-summary, .spot-card--side .spot-summary { font-size: 15px; line-height: 1.25; }
    .spot-card--mini .spot-title { font-size: 17px; }
    .spot-card--mini.spot-card--no-img .spot-title { font-size: 21px; }
}

/* ── 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); }
    .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 { 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; }
}