/* ==========================================================================
   Giovane Italia — stylesheet condiviso
   Design tokens da: design_handoff_giovane_italia/README.md
   Tono: sobrio editoriale (blu notte + oro, Playfair Display + Source Sans 3)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TOKENS (CSS custom properties)
   -------------------------------------------------------------------------- */
:root {
    /* Brand — palette */
    --navy:       #06285B;
    --navy-deep:  #041C42;
    --navy-soft:  #0B3676;
    --gold:       #FCC759;        /* uso su sfondo navy (contrasto ≥ 8:1) */
    --gold-deep:  #8B6914;        /* uso su sfondo chiaro (WCAG AA: 5:1 su bianco, 4.5:1 su ivory) */
    --gold-bright: #E0A937;       /* decorativo, large display only (es. numeri 48–140px) */
    --ivory:      #F5F3EE;
    --ivory-deep: #ECE8DD;
    --ink:        #1C1C1C;
    --ink-soft:   #2A2A28;
    --ink-mute:   #5A5A56;        /* testo secondario su chiaro (4.7:1 su bianco) */
    --rule:          rgba(28, 28, 28, .12);
    --rule-on-navy:  rgba(255, 255, 255, .16);
    --focus-ring:    var(--navy); /* contrasto ≥ 3:1 su tutti gli sfondi chiari */

    /* Tipografia */
    --serif: 'Playfair Display', 'Times New Roman', serif;
    --sans:  'Source Sans 3', system-ui, -apple-system, sans-serif;

    /* Layout */
    --measure:   1240px;
    --read:      720px;
    --gutter:    32px;
    --header-h:  78px;
    --subnav-h:  64px;
}
html[data-theme="dark"] {
    color-scheme: dark;
    --navy: #0B1220;
    --navy-deep: #070B14;
    --navy-soft: #174B65;
    --gold: #FFCF5A;
    --gold-deep: #75E6D0;
    --gold-bright: #FF7A59;
    --ivory: #121A26;
    --ivory-deep: #1A2837;
    --ink: #F7F1E6;
    --ink-soft: #D8D2C7;
    --ink-mute: #9EB6BE;
    --rule: rgba(117,230,208,.18);
    --rule-on-navy: rgba(255,207,90,.22);
    --focus-ring: #75E6D0;
}

/* --------------------------------------------------------------------------
   2. RESET & BASE
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-h) + 16px);
}
body {
    font-family: var(--sans);
    color: var(--ink);
    background: #fff;
    font-size: 17px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
html[data-theme="dark"] body { background: #080D16; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
    color: inherit;
    padding: 0;
}

.wrap         { max-width: var(--measure); margin: 0 auto; padding: 0 var(--gutter); }
.reading      { max-width: var(--read);    margin: 0 auto; padding: 0 var(--gutter); }
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;white-space:nowrap}

/* Placeholder editoriale "[DA COMPILARE]" per le pagine legali */
.todo {
    background: rgba(252,199,89,.15);
    color: var(--gold-deep);
    padding: 2px 8px;
    border-radius: 2px;
    border: 1px dashed var(--gold-deep);
    font-family: var(--sans);
    font-size: .85em;
    font-weight: 600;
    font-style: normal;
    line-height: 1.4;
}

/* Tabella semplice per le informative legali */
.legal-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0 2em;
    font-family: var(--sans);
    font-size: 15px;
    line-height: 1.55;
}
.legal-table th,
.legal-table td {
    text-align: left;
    padding: 12px 14px;
    border-bottom: 1px solid var(--rule);
    vertical-align: top;
}
.legal-table thead th {
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    border-bottom: 1px solid var(--gold-deep);
}
.legal-table tbody tr:last-child td { border-bottom: 0; }
.legal-table td strong { font-weight: 600; }
.cookie-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 2.4em;
    font-family: var(--sans);
}
.cookie-summary > div {
    min-width: 0;
    padding: 18px 18px 20px;
    border: 1px solid var(--rule);
    background: linear-gradient(180deg, rgba(252,199,89,.08), rgba(252,199,89,.02));
}
.cookie-summary span {
    display: block;
    margin-bottom: 10px;
    color: var(--gold-deep);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.cookie-summary strong {
    display: block;
    color: var(--navy);
    font-size: 18px;
    line-height: 1.2;
}
.cookie-summary p {
    margin: 8px 0 0;
    color: var(--ink-soft);
    font-size: 14.5px;
    line-height: 1.55;
}
html[data-theme="dark"] .cookie-summary > div {
    background: #111A26;
    border-color: rgba(117,230,208,.22);
}
html[data-theme="dark"] .cookie-summary span,
html[data-theme="dark"] .cookie-summary strong {
    color: #fff;
}
html[data-theme="dark"] .cookie-summary p {
    color: var(--ink-soft);
}
@media (max-width: 768px) {
    .legal-table { font-size: 14px; }
    .legal-table th, .legal-table td { padding: 10px 8px; }
    .cookie-summary { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   2.1 ACCESSIBILITÀ — focus visibile, skip link, motion preferences
   -------------------------------------------------------------------------- */

/* Skip link (WCAG 2.4.1 Bypass Blocks). Visibile solo al focus. */
.skip-link {
    position: absolute;
    top: -100px;
    left: 16px;
    background: var(--navy);
    color: var(--gold);
    padding: 12px 20px;
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-decoration: none;
    border-radius: 2px;
    z-index: 200;
    transition: top .2s ease;
}
.skip-link:focus { top: 16px; }

/* Focus visible (WCAG 2.4.7 / 1.4.11 Non-Text Contrast).
   - Su sfondo chiaro: outline navy 2px (contrasto > 17:1).
   - Su sfondo navy/ink: outline gold (override ricorsivo). */
:focus { outline: none; }
:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 3px;
    border-radius: 2px;
}
.site-header :focus-visible,
.hero :focus-visible,
.page-hero :focus-visible,
.questions :focus-visible,
.nl :focus-visible,
.judge :focus-visible,
.cta-final:not(.ivory) :focus-visible,
.site-footer :focus-visible,
.mini-nl :focus-visible {
    outline-color: var(--gold);
}
/* Input, select, textarea: outline-visible aggiunge al cambio di border-bottom */
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
}
.nl-form input:focus-visible,
.mini-nl-form input:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}

/* Riduzione movimento (WCAG 2.3.3) */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .map-marker .pulse { animation: none !important; }
}

/* --------------------------------------------------------------------------
   3. TYPOGRAPHY
   -------------------------------------------------------------------------- */
h1, h2, h3, h4 {
    font-family: var(--serif);
    font-weight: 600;
    letter-spacing: -.005em;
    margin: 0;
}
h2 { font-size: clamp(34px, 3.4vw, 52px); line-height: 1.1; text-wrap: balance; }
h3 { font-size: 24px; line-height: 1.25; }

.eyebrow {
    font-family: var(--sans);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--gold-deep);
}
.eyebrow.on-navy { color: var(--gold); }
.eyebrow .dot {
    display: inline-block;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: currentColor;
    vertical-align: middle;
    margin: 0 .7em 0 0;
    transform: translateY(-1px);
}

.section-eyebrow-bar {
    display: flex; align-items: center; gap: 20px;
    margin-bottom: 24px;
    color: var(--gold-deep);
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
}
.section-eyebrow-bar .rule { width: 48px; height: 1px; background: currentColor; }
.section-eyebrow-bar .num  {
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    color: var(--gold-deep);
    font-size: 18px;
    letter-spacing: 0;
    text-transform: none;
}
.section.navy .section-eyebrow-bar { color: var(--gold); }

.section-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(40px, 4.6vw, 64px);
    line-height: 1.05;
    letter-spacing: -.015em;
    max-width: 820px;
    margin: 0 0 64px;
    text-wrap: balance;
}
.section-title em { font-style: italic; color: var(--gold-deep); font-weight: 500; }
.section.navy .section-title    { color: #fff; }
.section.navy .section-title em { color: var(--gold); }

/* --------------------------------------------------------------------------
   4. BUTTONS
   -------------------------------------------------------------------------- */
.btn {
    display: inline-flex;
    align-items: center;
    gap: .7em;
    font-family: var(--sans);
    font-weight: 600;
    font-size: 15px;
    letter-spacing: .02em;
    padding: 14px 22px;
    border-radius: 2px;
    border: 1px solid transparent;
    white-space: nowrap;
    transition: transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.btn:hover         { transform: translateY(-1px); }
.btn .arrow        { transition: transform .25s ease; }
.btn:hover .arrow  { transform: translateX(3px); }
.btn svg           { flex-shrink: 0; }
.btn-gold          { background: var(--gold); color: var(--navy); }
.btn-gold:hover    { background: #FFD478; }
.btn-ghost-light       { border-color: rgba(255,255,255,.55); color: #fff; }
.btn-ghost-light:hover { border-color: #fff; background: rgba(255,255,255,.06); }
.btn-ghost-dark        { border-color: var(--navy); color: var(--navy); }
.btn-ghost-dark:hover  { background: var(--navy); color: #fff; }
.btn-navy              { background: var(--navy); color: #fff; }
.btn-navy:hover        { background: var(--navy-soft); }
.btn-sm                { padding: 10px 16px; font-size: 14px; }

/* --------------------------------------------------------------------------
   5. HEADER & NAV (componente condiviso iniettato da layout.js)
   -------------------------------------------------------------------------- */
.site-header {
    background: var(--navy);
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.08);
    position: sticky;
    top: 0;
    z-index: 60;
}
.nav {
    display: flex;
    align-items: center;
    gap: 28px;
    height: var(--header-h);
}
.brand {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}
.brand .mark { width: 42px; height: 42px; }
.brand .wordmark {
    font-family: var(--serif);
    font-weight: 600;
    font-size: 20px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1;
}
.brand .wordmark small {
    display: block;
    font-family: var(--sans);
    font-weight: 500;
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--gold);
    margin-top: 5px;
    white-space: nowrap;
}

.nav-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin: 0;
    list-style: none;
    padding: 0;
    flex: 1 1 auto;
    min-width: 0;
}
.nav-links a {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .04em;
    color: rgba(255,255,255,.82);
    padding: 6px 0;
    position: relative;
    white-space: nowrap;
    transition: color .2s ease;
}
.nav-links a:hover,
.nav-links a.active { color: #fff; }
.nav-links a.active::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -2px;
    height: 2px;
    background: var(--gold);
}

.nav-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.nav-profile-button {
    width: 40px;
    min-width: 40px;
    height: 40px;
    justify-content: center;
    gap: 0;
    padding: 0;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(6,40,91,.12);
}
.nav-profile-button .nav-profile-icon {
    width: 18px;
    height: 18px;
    transition: transform .18s ease;
}
.nav-profile-button:hover .nav-profile-icon {
    transform: scale(1.06);
}
.utility-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    letter-spacing: .16em;
    color: rgba(255,255,255,.72);
    font-weight: 600;
    white-space: nowrap;
}
.lang-option {
    color: rgba(255,255,255,.68);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    padding: 6px 4px;
    border-bottom: 1px solid transparent;
}
.lang-option:hover,
.lang-option.active {
    color: #fff;
    border-bottom-color: var(--gold);
}
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 2px;
    color: rgba(255,255,255,.84);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.theme-toggle:hover {
    border-color: var(--gold);
    color: #fff;
    background: rgba(255,255,255,.06);
}
.theme-toggle__icon--sun { display: none; }
.theme-toggle.is-dark .theme-toggle__icon--moon { display: none; }
.theme-toggle.is-dark .theme-toggle__icon--sun { display: block; }

/* --------------------------------------------------------------------------
   5b. BIBLIOTECA INTERNA GLOBALE
   -------------------------------------------------------------------------- */
.gi-library-toggle {
    position: fixed;
    right: 18px;
    top: calc(var(--header-h) + 18px);
    z-index: 72;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.18);
    background: var(--navy);
    color: var(--gold);
    box-shadow: 0 18px 34px rgba(4,28,66,.22);
    transition: right .24s ease, background .2s ease, color .2s ease, transform .15s ease;
}
.gi-library-toggle:hover {
    background: var(--navy-soft);
    transform: translateY(-1px);
}
.gi-library-toggle.is-open {
    right: calc(min(75vw, 1120px) + 18px);
}
.gi-library-drawer {
    position: fixed;
    top: var(--header-h);
    right: 0;
    bottom: 0;
    z-index: 71;
    width: min(75vw, 1120px);
    display: flex;
    flex-direction: column;
    padding: 28px;
    background: #fff;
    border-left: 1px solid var(--rule);
    box-shadow: -24px 0 60px rgba(4,28,66,.18);
    transform: translateX(100%);
    transition: transform .24s ease;
}
.gi-library-drawer.is-open {
    transform: translateX(0);
}
.gi-library-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--rule);
}
.gi-library-kicker {
    display: block;
    margin-bottom: 4px;
    color: var(--gold-deep);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}
.gi-library-head h2 {
    font-size: 30px;
}
.gi-library-close {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid var(--rule);
    color: var(--ink);
    font-size: 24px;
    line-height: 1;
}
.gi-library-tools {
    padding: 16px 0 12px;
}
.gi-library-search {
    display: grid;
    gap: 6px;
}
.gi-library-search span,
.gi-library-upload label span {
    color: var(--ink-soft);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.gi-library-search input,
.gi-library-upload select,
.gi-library-upload input[type="file"] {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #fff;
    color: var(--ink);
    font: 600 14px/1.25 var(--sans);
}
.gi-library-status {
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(45,125,70,.24);
    background: rgba(45,125,70,.08);
    color: #215c35;
    font-size: 14px;
    font-weight: 700;
}
.gi-library-status[hidden] {
    display: none;
}
.gi-library-status.is-error {
    border-color: rgba(180,32,42,.24);
    background: rgba(180,32,42,.08);
    color: #b4202a;
}
.gi-library-sections {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}
.gi-library-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 10px;
    border: 1px solid var(--rule);
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
    text-align: left;
}
.gi-library-section.active {
    border-color: var(--navy);
    background: var(--navy);
    color: #fff;
}
.gi-library-section b {
    color: var(--gold-deep);
    font-size: 12px;
}
.gi-library-section.active b {
    color: var(--gold);
}
.gi-library-files {
    min-height: 0;
    overflow: auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 10px;
    align-content: start;
    padding-right: 4px;
}
.gi-library-file {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    border: 1px solid var(--rule);
    color: var(--ink);
}
.gi-library-file:hover {
    border-color: var(--navy);
}
.gi-library-file-link {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 12px;
}
.gi-library-file-icon {
    width: 34px;
    height: 42px;
    border: 2px solid var(--navy);
    border-radius: 2px;
    position: relative;
}
.gi-library-file-icon::after {
    content: "";
    position: absolute;
    top: 7px;
    left: 7px;
    right: 7px;
    height: 2px;
    background: var(--gold);
    box-shadow: 0 8px 0 var(--gold), 0 16px 0 var(--gold);
}
.gi-library-file-main {
    min-width: 0;
}
.gi-library-file-main strong,
.gi-library-file-main small {
    display: block;
}
.gi-library-file-main strong {
    overflow-wrap: anywhere;
    line-height: 1.2;
}
.gi-library-file-main small,
.gi-library-empty {
    margin: 4px 0 0;
    color: var(--ink-soft);
    font-size: 13px;
}
.gi-library-delete {
    align-self: stretch;
    min-width: 88px;
    padding: 0 12px;
    border-left: 1px solid var(--rule);
    background: rgba(180,32,42,.06);
    color: #b4202a;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.gi-library-delete:hover {
    background: #b4202a;
    color: #fff;
}
.gi-library-delete:disabled {
    opacity: .62;
    cursor: wait;
}
.gi-library-upload {
    display: grid;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--rule);
}
.gi-library-upload[hidden] {
    display: none;
}
.gi-library-upload-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}
.gi-library-upload-title strong {
    color: var(--ink);
}
.gi-library-upload-title span {
    color: var(--gold-deep);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.gi-library-upload label {
    display: grid;
    gap: 6px;
}
html[data-theme="dark"] .gi-library-drawer {
    background: #121A26;
    border-left-color: rgba(117,230,208,.24);
}
html[data-theme="dark"] .gi-library-file,
html[data-theme="dark"] .gi-library-delete {
    border-color: rgba(117,230,208,.2);
}
html[data-theme="dark"] .gi-library-search input,
html[data-theme="dark"] .gi-library-upload select,
html[data-theme="dark"] .gi-library-upload input[type="file"] {
    background: #0B1220;
    color: var(--ink);
    border-color: rgba(117,230,208,.2);
}

@media (max-width: 680px) {
    .gi-library-toggle {
        top: auto;
        right: 16px;
        bottom: 18px;
    }
    .gi-library-toggle.is-open {
        right: 16px;
    }
    .gi-library-drawer {
        top: var(--header-h);
        width: 100vw;
        padding: 20px;
    }
    .gi-library-sections {
        grid-template-columns: 1fr;
    }
    .gi-library-files {
        grid-template-columns: 1fr;
    }
    .gi-library-file {
        grid-template-columns: 1fr;
    }
    .gi-library-delete {
        min-height: 40px;
        border-left: 0;
        border-top: 1px solid var(--rule);
    }
}

/* Hamburger / menu toggle (visibile solo ≤720px) */
.menu-toggle {
    display: none;
    background: transparent;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 2px;
    color: #fff;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease;
}
.menu-toggle:hover { border-color: var(--gold); }
.menu-toggle__bars {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 22px;
    align-items: stretch;
}
.menu-toggle__bars span {
    display: block;
    height: 2px;
    width: 100%;
    background: currentColor;
    transition: transform .25s ease, opacity .2s ease;
}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(2) {
    opacity: 0;
}
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* --------------------------------------------------------------------------
   6. HERO (homepage)
   -------------------------------------------------------------------------- */
.hero {
    background: var(--navy);
    color: #fff;
    position: relative;
    overflow: hidden;
    padding: 96px 0 120px;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.hero::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 80% 60% at 80% 0%, rgba(252,199,89,.08), transparent 60%),
        radial-gradient(ellipse 60% 50% at 0% 100%, rgba(252,199,89,.045), transparent 60%);
}
.hero .wrap {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 64px;
    align-items: end;
}
.hero-meta {
    display: flex; align-items: center; gap: 14px;
    font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
    color: rgba(255,255,255,.55);
    margin-bottom: 28px;
}
.hero-meta .divider { width: 30px; height: 1px; background: var(--gold); }
.hero-meta b        { color: var(--gold); letter-spacing: .2em; }
.hero h1 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(46px, 5.8vw, 92px);
    line-height: 1.02;
    letter-spacing: -.015em;
    margin: 0 0 32px;
    text-wrap: balance;
}
.hero h1 em { font-style: italic; color: var(--gold); font-weight: 500; }
.hero-sub {
    font-size: 20px; line-height: 1.55;
    color: rgba(255,255,255,.75);
    max-width: 640px;
    margin: 0 0 44px;
    font-weight: 300;
}
.hero-sub b { color: #fff; font-weight: 500; }
.hero-cta   { display: flex; gap: 16px; flex-wrap: wrap; }

.hero-aside {
    border-left: 1px solid rgba(255,255,255,.2);
    padding: 6px 0 6px 28px;
    color: rgba(255,255,255,.72);
    font-size: 14px;
    line-height: 1.6;
}
.hero-aside .label {
    display: block;
    font-size: 11px; letter-spacing: .24em; text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 14px;
    font-weight: 600;
}
.hero-aside p { margin: 0 0 14px; }
.hero-aside .sig {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.55);
    font-size: 12.5px;
    letter-spacing: .04em;
}

/* --------------------------------------------------------------------------
   7. PAGE HERO (pagine interne)
   -------------------------------------------------------------------------- */
.page-hero {
    background: var(--navy);
    color: #fff;
    position: relative;
    overflow: hidden;
    padding: 80px 0 100px;
}
.page-hero::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 80% 60% at 80% 0%, rgba(252,199,89,.07), transparent 60%),
        radial-gradient(ellipse 60% 50% at 0% 100%, rgba(252,199,89,.04), transparent 60%);
}
.page-hero .wrap { position: relative; }
.page-hero.compact { padding: 72px 0 84px; }

.crumbs {
    font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
    color: rgba(255,255,255,.75);
    font-weight: 600;
    margin-bottom: 28px;
    display: flex; align-items: center; gap: 14px;
}
.crumbs a       { color: rgba(255,255,255,.85); transition: color .2s ease; }
.crumbs a:hover { color: var(--gold); }
.crumbs .sep    { color: var(--gold); opacity: .7; }
.crumbs b       { color: #fff; }

.page-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: 80px;
    align-items: end;
}
.page-hero h1 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(48px, 5.8vw, 92px);
    line-height: .98;
    letter-spacing: -.02em;
    margin: 0;
    color: #fff;
    text-wrap: balance;
}
.page-hero h1 em {
    font-style: italic;
    color: var(--gold);
    font-weight: 500;
}
.page-hero h1.block em {
    display: block;
    margin-top: 6px;
}

.page-hero-side {
    border-left: 1px solid rgba(255,255,255,.18);
    padding-left: 36px;
    padding-bottom: 8px;
}
.page-hero-side .label {
    display: block;
    font-size: 11px; letter-spacing: .24em; text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 18px;
    font-weight: 600;
}
.page-hero-side p {
    font-size: 17px;
    line-height: 1.55;
    font-weight: 300;
    color: rgba(255,255,255,.8);
    margin: 0 0 16px;
}
.page-hero-side p b { color: #fff; font-weight: 500; }
.page-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 24px 0 0;
}
.page-hero-meta {
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.12);
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
    color: rgba(255,255,255,.55);
    font-size: 12px;
    letter-spacing: .04em;
}
.page-hero-meta b {
    display: block;
    color: var(--gold);
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    margin-bottom: 4px;
    white-space: nowrap;
}

/* --------------------------------------------------------------------------
   8. SECTION SCAFFOLD
   -------------------------------------------------------------------------- */
.section          { padding: 120px 0; position: relative; }
.section.alt      { background: var(--ivory); }
.section.navy     { background: var(--navy); color: #fff; }

.section-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: end;
    margin-bottom: 60px;
}
.section-head .num {
    font-family: var(--serif);
    font-size: 84px;
    font-weight: 300;
    color: var(--gold);
    line-height: 1;
    opacity: .4;
}
.section-head h2     { margin-top: 14px; }
.section-head .lede  {
    color: var(--ink-soft);
    opacity: .75;
    font-size: 17px;
    line-height: 1.6;
    max-width: 460px;
}
.section-head .all-link {
    align-self: end;
    justify-self: end;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--navy);
    border-bottom: 1px solid var(--navy);
    padding-bottom: 4px;
}

/* --------------------------------------------------------------------------
   9. EDITORIAL READING COLUMN (Chi siamo, articoli lunghi)
   -------------------------------------------------------------------------- */
.editorial p {
    font-size: 19px;
    line-height: 1.7;
    margin: 0 0 1.4em;
    color: var(--ink);
    text-wrap: pretty;
}
.editorial p.lede {
    font-family: var(--serif);
    font-size: 26px;
    line-height: 1.4;
    font-weight: 400;
    font-style: italic;
    margin-bottom: 1.6em;
}
.editorial p.lede + p::first-letter {
    font-family: var(--serif);
    float: left;
    font-size: 5.2em;
    line-height: .85;
    padding: 6px 14px 0 0;
    color: var(--navy);
    font-weight: 600;
}
.editorial h3 {
    font-size: 30px;
    line-height: 1.2;
    font-weight: 500;
    margin: 2.2em 0 .9em;
    letter-spacing: -.01em;
}
.editorial h3 .num {
    display: inline-block;
    font-family: var(--sans);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .22em;
    color: var(--gold-deep);
    margin-right: 14px;
    transform: translateY(-6px);
    vertical-align: middle;
}
.editorial blockquote {
    margin: 2em 0;
    padding: 6px 0 6px 32px;
    border-left: 3px solid var(--gold);
    font-family: var(--serif);
    font-style: italic;
    font-size: 24px;
    line-height: 1.4;
    color: var(--ink);
}
.editorial blockquote .cite {
    display: block;
    margin-top: 14px;
    font-family: var(--sans);
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: .6;
}
.editorial em     { font-style: italic; }
.editorial strong { font-weight: 600; }
.editorial hr.glyph {
    border: none;
    text-align: center;
    margin: 2.6em 0;
    color: var(--gold);
}
.editorial hr.glyph::before { content: "§ § §"; letter-spacing: .5em; font-family: var(--serif); font-size: 18px; }

/* --------------------------------------------------------------------------
   10. MOTTO (home)
   -------------------------------------------------------------------------- */
.motto {
    background: var(--ivory);
    padding: 84px 0;
    border-bottom: 1px solid var(--rule);
    text-align: center;
}
.motto-inner { max-width: 880px; margin: 0 auto; }
.motto-quote {
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    color: var(--navy);
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.25;
    letter-spacing: -.01em;
    text-wrap: balance;
    margin: 0;
}
.motto-quote::before,
.motto-quote::after {
    content: "";
    display: block;
    width: 36px; height: 1px;
    background: var(--gold);
    margin: 0 auto 32px;
}
.motto-quote::after { margin: 32px auto 0; }
.motto-source {
    margin-top: 24px;
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: .6;
    font-weight: 600;
}

/* --------------------------------------------------------------------------
   11. LENS (home + Chi siamo)
   -------------------------------------------------------------------------- */
.lens { padding: 120px 0; background: #fff; }
.lens-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border-top: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
}
.lens-card {
    padding: 48px 48px 52px;
    border-left: 4px solid;
    background: #fff;
    position: relative;
}
.lens-card.left  { border-left-color: var(--gold); background: linear-gradient(to right, rgba(252,199,89,.04), transparent 40%); }
.lens-card.right { border-left-color: var(--navy); background: linear-gradient(to right, rgba(6,40,91,.035), transparent 40%); box-shadow: inset 1px 0 0 var(--rule); }
.lens-card .lens-eyebrow {
    font-size: 11px; letter-spacing: .24em; text-transform: uppercase; font-weight: 700;
    margin-bottom: 18px;
}
.lens-card.left  .lens-eyebrow { color: var(--gold-deep); }
.lens-card.right .lens-eyebrow { color: var(--navy); }
.lens-card h3 {
    font-size: 34px;
    line-height: 1.15;
    letter-spacing: -.01em;
    margin-bottom: 18px;
}
.lens-card h3 em { font-style: italic; font-weight: 500; }
.lens-card p {
    color: var(--ink-soft);
    font-size: 16px;
    line-height: 1.65;
    margin: 0 0 14px;
}
.lens-card .markers { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px; }
.marker {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .02em;
    padding: 6px 12px;
    border-radius: 2px;
    background: var(--ivory);
    color: var(--ink-soft);
    border: 1px solid var(--rule);
}

/* Lens "pair" variante Chi siamo (con divisore VS) */
.lens-pair {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 0;
    align-items: stretch;
    border: 1px solid var(--rule);
    background: #fff;
}
.lens-block { padding: 64px 56px; display: flex; flex-direction: column; gap: 24px; position: relative; }
.lens-block.si { background: linear-gradient(180deg, rgba(252,199,89,.06), rgba(252,199,89,0) 70%); }
.lens-block.no { background: linear-gradient(180deg, rgba(6,40,91,.04),  rgba(6,40,91,0) 70%); }
.lens-sign {
    font-family: var(--serif);
    font-size: 120px;
    line-height: .9;
    font-weight: 300;
    letter-spacing: -.04em;
}
.lens-block.si .lens-sign { color: var(--gold); }
.lens-block.no .lens-sign { color: var(--navy); opacity: .5; }
.lens-label {
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
}
.lens-block.si .lens-label { color: var(--gold-deep); }
.lens-block.no .lens-label { color: var(--navy); }
.lens-block h3 { font-size: 36px; line-height: 1.15; letter-spacing: -.01em; }
.lens-block h3 em { font-style: italic; font-weight: 500; }
.lens-block.si h3 em { color: var(--gold-deep); }
.lens-block.no h3 em { color: var(--navy); }
.lens-block p { font-size: 16.5px; line-height: 1.65; color: var(--ink-soft); margin: 0; }
.lens-list {
    list-style: none;
    padding: 0;
    margin-top: auto;
    display: flex; flex-direction: column;
    gap: 10px;
    padding-top: 32px;
    border-top: 1px solid var(--rule);
}
.lens-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--ink-soft);
}
.lens-list li::before {
    content: "";
    width: 8px; height: 8px;
    flex-shrink: 0;
    margin-top: 8px;
}
.lens-block.si .lens-list li::before { background: var(--gold); border-radius: 50%; }
.lens-block.no .lens-list li::before { background: var(--navy); transform: rotate(45deg); }
.lens-divider { width: 1px; background: var(--rule); position: relative; }
.lens-divider::before {
    content: "VS";
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    font-size: 18px;
    color: var(--ink-soft);
    opacity: .4;
    background: #fff;
    padding: 8px 0;
    letter-spacing: .05em;
}

/* --------------------------------------------------------------------------
   12. QUESTIONS (home — 10 domande)
   -------------------------------------------------------------------------- */
.questions {
    background: var(--navy);
    color: #fff;
    padding: 120px 0;
    position: relative;
    overflow: hidden;
}
.questions::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 50% 60% at 100% 50%, rgba(252,199,89,.05), transparent 60%);
}
.questions .wrap { position: relative; }
.q-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: end;
    margin-bottom: 72px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--rule-on-navy);
}
.q-head h2 { color: #fff; max-width: 680px; }
.q-head h2 em { color: var(--gold); font-style: italic; font-weight: 500; }
.q-head .q-lede { color: rgba(255,255,255,.65); font-size: 16px; line-height: 1.65; max-width: 380px; }

.q-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.q-list > li { margin: 0; padding: 0; }
.q-item {
    display: grid;
    grid-template-columns: 100px 1fr 80px;
    gap: 40px;
    align-items: baseline;
    padding: 36px 0;
    border-top: 1px solid var(--rule-on-navy);
    cursor: default;
}
.q-list > li:last-child,
.q-list > li:last-child .q-item { border-bottom: 1px solid var(--rule-on-navy); }
.q-num {
    font-family: var(--serif);
    font-size: 42px;
    font-weight: 300;
    font-style: italic;
    color: var(--gold);
    line-height: 1;
}
.q-text {
    font-family: var(--serif);
    font-size: clamp(22px, 2vw, 28px);
    line-height: 1.3;
    font-weight: 400;
    color: rgba(255,255,255,.82);
    letter-spacing: -.005em;
}
.q-arrow {
    justify-self: end;
    color: rgba(255,255,255,.4);
    font-size: 20px;
}
.q-item.hidden { display: none; }
.q-list.expanded .q-item.hidden {
    display: grid;
    animation: slideDown .4s ease both;
}
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.q-toggle-wrap { margin-top: 48px; display: flex; justify-content: center; }
.q-toggle {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--sans);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--gold);
    padding: 14px 28px;
    border: 1px solid rgba(252,199,89,.4);
    border-radius: 2px;
    transition: background .2s ease, border-color .2s ease;
}
.q-toggle:hover { background: rgba(252,199,89,.08); border-color: var(--gold); }
.q-toggle .icon { display: inline-block; transition: transform .25s ease; }
.q-list.expanded ~ .q-toggle-wrap .q-toggle .icon { transform: rotate(180deg); }

/* --------------------------------------------------------------------------
   13. TEMI (home — griglia 5×2)
   -------------------------------------------------------------------------- */
.temi { padding: 120px 0; background: #fff; }
.temi-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    border: 1px solid var(--rule);
}
.tema-card {
    padding: 36px 28px;
    border-right: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 200px;
    transition: background .2s ease, transform .2s ease;
    position: relative;
    background: #fff;
}
.tema-card:nth-child(5n)   { border-right: none; }
.tema-card:nth-child(n+6)  { border-bottom: none; }
.tema-card:nth-child(n+6):not(.tema-card-ai) { border-bottom: 1px solid var(--rule); }
.tema-card.tema-card-ai {
    grid-column: 1 / -1;
    min-height: 160px;
    border-right: none;
    border-bottom: none;
}
.tema-card:hover           { background: var(--ivory); }
.tema-card:hover .tema-arrow { opacity: 1; transform: translateX(0); }
.tema-icon { width: 36px; height: 36px; color: var(--navy); margin-bottom: 32px; }
.tema-name {
    font-family: var(--serif);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.15;
    color: var(--ink);
    letter-spacing: -.005em;
}
.tema-num {
    position: absolute;
    top: 18px; right: 20px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    color: var(--gold-deep);
    font-feature-settings: "tnum";
}
.tema-arrow {
    position: absolute;
    bottom: 24px; right: 24px;
    color: var(--gold-deep);
    font-size: 18px;
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity .2s ease, transform .2s ease;
}
.source-note {
    margin-top: 28px;
    font-size: 14px;
}
.source-note a {
    color: var(--navy);
    border-bottom: 1px solid currentColor;
}

/* --------------------------------------------------------------------------
   14. NEWS (home + News page)
   -------------------------------------------------------------------------- */
.news { background: var(--ivory); padding: 120px 0; border-top: 1px solid var(--rule); }
.news-section { padding: 64px 0 24px; background: #fff; }

.news-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.news-section .news-grid {
    grid-template-columns: 1fr 1fr;
    gap: 48px 40px;
}

.news-card {
    background: #fff;
    border: 1px solid var(--rule);
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    cursor: pointer;
    overflow: hidden;
}
.news-card:hover {
    transform: translateY(-3px);
    border-color: rgba(28,28,28,.18);
    box-shadow: 0 18px 36px -22px rgba(6,40,91,.32);
}
.news-card.is-hidden { display: none; }

.news-img {
    aspect-ratio: 4 / 3;
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-soft) 70%, #143F8C 100%);
}
.news-section .news-img { aspect-ratio: 16 / 9; }
.news-img.gradient-a { background: linear-gradient(135deg, var(--navy) 0%, var(--navy-soft) 70%, #143F8C 100%); }
.news-img.gradient-b { background: linear-gradient(160deg, var(--navy-deep) 0%, var(--navy) 60%, var(--navy-soft) 100%); }
.news-img.gradient-c { background: linear-gradient(110deg, #0A3373 0%, var(--navy) 50%, var(--navy-deep) 100%); }
.news-img::after {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 60% 80% at 30% 20%, rgba(252,199,89,.16), transparent 60%),
        radial-gradient(ellipse 50% 60% at 90% 90%, rgba(255,255,255,.06), transparent 60%);
}
.news-tag {
    position: absolute;
    top: 18px; left: 18px;
    z-index: 2;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    padding: 6px 11px;
    border-radius: 2px;
    line-height: 1;
}
.news-tag.comunicato { background: var(--navy); color: var(--gold); }
.news-tag.analisi    { background: var(--gold); color: var(--navy); }
.news-tag.evento     { background: #fff; color: var(--navy); border: 1px solid var(--navy); }

.news-placeholder {
    position: absolute; inset: 0;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    padding: 24px 28px;
}
.news-placeholder-text,
.placeholder-mark {
    color: rgba(255,255,255,.18);
    font-family: var(--serif);
    font-weight: 600;
    font-size: 84px;
    line-height: .9;
    letter-spacing: -.04em;
}
.placeholder-mark {
    position: absolute;
    left: 24px; bottom: 24px;
    font-size: 90px;
}
.news-placeholder-text.numeric {
    font-style: italic;
    font-weight: 400;
    font-size: 120px;
}
.news-img-mark {
    position: absolute;
    right: 24px; top: 24px;
    z-index: 1;
    color: rgba(255,255,255,.45);
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase;
    font-weight: 600;
}
.news-img-glyph {
    position: absolute;
    right: 32px; bottom: 32px;
    z-index: 1;
    width: 60px; height: 60px;
    color: rgba(252,199,89,.22);
}

.news-body {
    padding: 28px 30px 30px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.news-meta,
.news-date {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: .8;
    font-weight: 600;
    margin-bottom: 14px;
}
.news-meta .dot { width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.news-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: 22px;
    line-height: 1.25;
    letter-spacing: -.005em;
    color: var(--ink);
    margin: 0 0 16px;
    text-wrap: balance;
}
.news-section .news-title { font-size: 24px; }
.news-excerpt {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ink-soft);
    opacity: .8;
    margin: 0 0 22px;
    flex: 1;
}
.news-section .news-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.news-read {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--navy);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 4px;
    border-bottom: 1px solid transparent;
    width: fit-content;
    transition: border-color .2s ease;
}
.news-read .arrow { color: var(--gold-deep); transition: transform .2s ease; }
.news-card:hover .news-read         { border-bottom-color: var(--navy); }
.news-card:hover .news-read .arrow  { transform: translateX(4px); }

/* News filterbar */
.filterbar {
    background: rgba(255,255,255,.94);
    border-bottom: 1px solid var(--rule);
    padding: 28px 0;
    position: sticky;
    top: var(--header-h);
    z-index: 40;
    backdrop-filter: saturate(1.4) blur(8px);
    -webkit-backdrop-filter: saturate(1.4) blur(8px);
}
.filterbar .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.filterbar-left { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.filterbar-label {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    padding-right: 14px;
    border-right: 1px solid var(--rule);
    margin-right: 8px;
    white-space: nowrap;
}
.pill {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--sans);
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--ink-soft);
    padding: 9px 18px;
    border: 1px solid var(--rule);
    border-radius: 999px;
    background: #fff;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    white-space: nowrap;
}
.pill:hover         { border-color: var(--ink-soft); color: var(--ink); }
.pill .count        { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 13px; opacity: .8; }
.pill.active        { background: var(--gold); border-color: var(--gold); color: var(--navy); }
.pill.active .count { color: var(--navy); opacity: .65; }
.filterbar-right { display: flex; align-items: center; gap: 14px; color: var(--ink-soft); opacity: .7; font-size: 13px; }
.filter-control {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ink-soft);
}
.filter-control select,
.filterbar-right .sort {
    min-height: 38px;
    padding: 8px 34px 8px 12px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #fff;
    font-size: 13px;
    color: var(--ink-soft);
    cursor: pointer;
}
.filter-control select {
    font-family: var(--sans);
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: none;
}
.filterbar-right .sort:hover { border-color: var(--ink-soft); color: var(--ink); }

/* --------------------------------------------------------------------------
   DARK MODE
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .section,
html[data-theme="dark"] .temi,
html[data-theme="dark"] .news-section,
html[data-theme="dark"] .signup-section,
html[data-theme="dark"] .contact-section,
html[data-theme="dark"] .map-section {
    background: #080D16;
}
html[data-theme="dark"] .section.alt,
html[data-theme="dark"] .news,
html[data-theme="dark"] .motto,
html[data-theme="dark"] .lens {
    background: var(--ivory);
}
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .hero,
html[data-theme="dark"] .page-hero,
html[data-theme="dark"] .questions,
html[data-theme="dark"] .nl,
html[data-theme="dark"] .article-hero,
html[data-theme="dark"] .site-footer {
    color: #fff;
}
html[data-theme="dark"] .hero-meta,
html[data-theme="dark"] .hero-sub,
html[data-theme="dark"] .hero-sub b,
html[data-theme="dark"] .hero-aside,
html[data-theme="dark"] .hero-aside .sig,
html[data-theme="dark"] .page-hero-side p,
html[data-theme="dark"] .page-hero-side p b,
html[data-theme="dark"] .page-hero-meta,
html[data-theme="dark"] .crumbs,
html[data-theme="dark"] .crumbs a,
html[data-theme="dark"] .q-head .q-lede,
html[data-theme="dark"] .q-text,
html[data-theme="dark"] .nl-left p,
html[data-theme="dark"] .article-meta,
html[data-theme="dark"] .article-back {
    color: #fff;
}
html[data-theme="dark"] .eyebrow.on-navy,
html[data-theme="dark"] .hero-aside .label,
html[data-theme="dark"] .page-hero-side .label,
html[data-theme="dark"] .q-num,
html[data-theme="dark"] .q-arrow {
    color: #fff;
}
html[data-theme="dark"] .section-head .lede,
html[data-theme="dark"] .editorial p,
html[data-theme="dark"] .editorial li,
html[data-theme="dark"] .news-excerpt,
html[data-theme="dark"] .indice-sub,
html[data-theme="dark"] .legal-table td,
html[data-theme="dark"] .no-results {
    color: var(--ink-soft);
}
html[data-theme="dark"] .tema-card,
html[data-theme="dark"] .news-card,
html[data-theme="dark"] .indice-card,
html[data-theme="dark"] .related-card,
html[data-theme="dark"] .lens-card,
html[data-theme="dark"] .lens-block,
html[data-theme="dark"] .positions,
html[data-theme="dark"] .contact-aside,
html[data-theme="dark"] .map-overlay,
html[data-theme="dark"] .gi-cookie-banner,
html[data-theme="dark"] .gi-cookie-modal__box {
    background: #111A26;
    border-color: var(--rule);
}
html[data-theme="dark"] .tema-card:hover,
html[data-theme="dark"] .indice-card:hover,
html[data-theme="dark"] .news-card:hover,
html[data-theme="dark"] .related-card:hover {
    background: #18283A;
    border-color: rgba(117,230,208,.36);
}
html[data-theme="dark"] .filterbar,
html[data-theme="dark"] .subnav {
    background: rgba(8,13,22,.94);
    border-color: var(--rule);
}
html[data-theme="dark"] .pill,
html[data-theme="dark"] .filter-control select,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    background: #0B1220;
    color: var(--ink);
    border-color: var(--rule);
}
html[data-theme="dark"] .news-title,
html[data-theme="dark"] .tema-name,
html[data-theme="dark"] .indice-name,
html[data-theme="dark"] .editorial h3,
html[data-theme="dark"] .gi-cookie-banner__text b,
html[data-theme="dark"] .gi-cookie-modal__box h2,
html[data-theme="dark"] .gi-cookie-category h3 {
    color: var(--ink);
}
html[data-theme="dark"] .news-read,
html[data-theme="dark"] .gi-cookie-banner__text a,
html[data-theme="dark"] .gi-cookie-link,
html[data-theme="dark"] .map-overlay .indications {
    color: var(--gold);
    border-bottom-color: var(--gold);
}
html[data-theme="dark"] .gi-cookie-btn--secondary {
    color: var(--gold);
    border-color: var(--gold);
}
html[data-theme="dark"] .gi-cookie-btn--secondary:hover {
    background: var(--gold);
    color: #08111C;
}
html[data-theme="dark"] .todo {
    background: rgba(117,230,208,.12);
    color: var(--gold-deep);
    border-color: rgba(117,230,208,.6);
}
html[data-theme="dark"] .section-head .all-link,
html[data-theme="dark"] .editorial p.lede + p::first-letter,
html[data-theme="dark"] .distinct-card .marker,
html[data-theme="dark"] .not-block h3 em,
html[data-theme="dark"] .cta-final.ivory h2 em,
html[data-theme="dark"] .form-title em,
html[data-theme="dark"] .signup-panel .form-success a,
html[data-theme="dark"] .article-content h2 em,
html[data-theme="dark"] .dashboard-action,
html[data-theme="dark"] .dashboard-app-copy strong {
    color: #fff;
}
html[data-theme="dark"] .section-head .all-link,
html[data-theme="dark"] .signup-panel .form-success a {
    border-bottom-color: #fff;
}

@media (max-width: 1280px) {
    .nav {
        gap: 20px;
    }
    .brand .wordmark {
        font-size: 18px;
        letter-spacing: .14em;
    }
    .brand .wordmark small {
        letter-spacing: .22em;
    }
    .nav-links {
        gap: 18px;
    }
    .nav-links a {
        font-size: 13.5px;
    }
    .nav-access {
        display: none;
    }
}

@media (max-width: 1120px) {
    .menu-toggle {
        display: inline-flex;
    }
    .nav {
        gap: 14px;
    }
    .nav-right {
        margin-left: auto;
    }
    .nav-links {
        display: flex;
        position: fixed;
        top: var(--header-h);
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--navy);
        border-top: 1px solid var(--rule-on-navy);
        padding: 16px var(--gutter) 32px;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        margin: 0;
        max-height: calc(100vh - var(--header-h));
        overflow-y: auto;
        box-shadow: 0 16px 24px -16px rgba(0,0,0,.4);
        transform: translateY(-12px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: transform .28s cubic-bezier(.2,.7,.2,1), opacity .22s ease, visibility 0s linear .28s;
    }
    .nav-links.open {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: transform .32s cubic-bezier(.2,.7,.2,1), opacity .22s ease, visibility 0s linear 0s;
    }
    .nav-links li {
        border-bottom: 1px solid var(--rule-on-navy);
    }
    .nav-links li:last-child {
        border-bottom: 0;
        padding-top: 12px;
    }
    .nav-links a {
        display: block;
        padding: 18px 0;
        font-size: 17px;
    }
    .nav-links a.active::after {
        display: none;
    }
    .nav-links a.active {
        color: var(--gold);
    }
}

.no-results {
    display: none;
    text-align: center;
    padding: 80px 0 40px;
    color: var(--ink-soft);
    opacity: .7;
}
.no-results.show { display: block; }
.no-results p    { font-family: var(--serif); font-style: italic; font-size: 22px; margin: 0; }

/* Pagination */
.pagination {
    display: flex; justify-content: center; align-items: center; gap: 10px;
    padding: 72px 0 96px;
    background: #fff;
}
.page-btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; height: 44px;
    padding: 0 14px;
    border: 1px solid var(--rule);
    background: #fff;
    color: var(--ink);
    font-family: var(--sans);
    font-weight: 500;
    font-size: 14.5px;
    border-radius: 2px;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    cursor: pointer;
}
.page-btn:hover { border-color: var(--ink); }
.page-btn.active {
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
    font-family: var(--serif);
    font-style: italic;
    font-weight: 500;
    font-size: 16px;
}
.page-btn[disabled] { opacity: .35; cursor: not-allowed; }
.page-arrow { font-size: 18px; color: var(--ink-soft); }
.page-info {
    margin-left: 18px;
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--ink-soft);
    opacity: .8;
}
.pagination-divider { width: 1px; height: 24px; background: var(--rule); margin: 0 6px; }

/* --------------------------------------------------------------------------
   15. NEWSLETTER (sezione navy condivisa)
   -------------------------------------------------------------------------- */
.nl {
    background: var(--navy);
    color: #fff;
    padding: 110px 0;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255,255,255,.08);
}
.nl::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 40% 50% at 15% 30%, rgba(252,199,89,.06), transparent 60%),
        radial-gradient(ellipse 50% 60% at 85% 80%, rgba(252,199,89,.05), transparent 60%);
}
.nl .wrap {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 80px;
    align-items: center;
}
.nl-left h2 {
    color: #fff;
    margin-bottom: 18px;
    font-size: clamp(34px, 3.4vw, 52px);
    line-height: 1.05;
    font-weight: 500;
}
.nl-left h2 em { color: var(--gold); font-style: italic; font-weight: 500; }
.nl-left p {
    color: rgba(255,255,255,.7);
    font-size: 17px;
    line-height: 1.6;
    max-width: 500px;
    margin: 0;
}
.nl-right {
    border-left: 1px solid rgba(255,255,255,.14);
    padding-left: 48px;
}

.nl-form {
    display: flex;
    gap: 0;
    align-items: stretch;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(255,255,255,.3);
    padding-bottom: 14px;
}
.nl-form input {
    flex: 1;
    background: transparent;
    border: none;
    color: #fff;
    font-family: var(--sans);
    font-size: 18px;
    font-weight: 400;
    padding: 10px 0;
    outline: none;
}
.nl-form input::placeholder { color: rgba(255,255,255,.4); }
.nl-form button {
    background: var(--gold);
    color: var(--navy);
    font-family: var(--sans);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 14px 26px;
    transition: background .2s ease;
    align-self: center;
}
.nl-form button:hover { background: #FFD478; }
.nl-note {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: rgba(255,255,255,.55);
    margin-top: 18px;
}
.nl-note .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.nl-success {
    display: none;
    padding: 14px 18px;
    background: rgba(252,199,89,.1);
    border: 1px solid rgba(252,199,89,.3);
    color: var(--gold);
    font-size: 14px;
    margin-bottom: 14px;
}
.nl-success.show { display: block; }
.nl-error {
    display: none;
    padding: 12px 16px;
    background: rgba(255, 80, 80, .12);
    border: 1px solid rgba(255, 80, 80, .35);
    color: #ffb4b4;
    font-size: 13.5px;
    margin-bottom: 12px;
}
.nl-error.show { display: block; }

/* --------------------------------------------------------------------------
   16. COSA CI DISTINGUE / NON SIAMO (Chi siamo)
   -------------------------------------------------------------------------- */
.distinct-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    border-top: 1px solid rgba(28,28,28,.16);
    border-bottom: 1px solid rgba(28,28,28,.16);
}
.distinct-card {
    padding: 44px 32px 40px;
    border-right: 1px solid rgba(28,28,28,.10);
    display: flex;
    flex-direction: column;
    transition: background .2s ease;
}
.distinct-card:last-child { border-right: none; }
.distinct-card:hover      { background: rgba(255,255,255,.6); }
.distinct-num {
    font-family: var(--serif);
    font-style: italic;
    font-size: 48px;
    font-weight: 300;
    color: var(--gold-deep);
    line-height: 1;
    margin-bottom: 32px;
}
.distinct-card h3 {
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: -.005em;
    color: var(--ink);
    margin-bottom: 16px;
    text-wrap: balance;
}
.distinct-card p {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ink-soft);
    opacity: .85;
    margin: 0;
}
.distinct-card .marker {
    margin-top: auto;
    padding-top: 24px;
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--navy);
    background: none;
    border: none;
}

.not-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
    border-top: 1px solid var(--rule);
}
.not-block {
    padding: 56px 56px 56px 40px;
    border-bottom: 1px solid var(--rule);
    border-left: 1px solid var(--rule);
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.not-block:nth-child(2n+1)        { border-left: none; }
.not-block:nth-last-child(-n+2)   { border-bottom: none; }
.not-strike {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-family: var(--serif);
    font-style: italic;
    font-size: 30px;
    font-weight: 500;
    letter-spacing: -.005em;
    color: var(--ink);
}
.not-strike .x {
    color: var(--gold-deep);
    font-style: normal;
    font-weight: 600;
    font-size: 36px;
    line-height: 1;
    transform: translateY(-2px);
}
.not-strike s {
    text-decoration: line-through;
    text-decoration-color: var(--gold);
    text-decoration-thickness: 2px;
    color: var(--ink);
    opacity: .5;
}
.not-block h3     { font-size: 26px; line-height: 1.2; font-weight: 500; }
.not-block h3 em  { font-style: italic; font-weight: 500; color: var(--navy); }
.not-block p      { font-size: 16px; line-height: 1.65; color: var(--ink-soft); opacity: .85; margin: 0; }

/* --------------------------------------------------------------------------
   17. CTA FINALE
   -------------------------------------------------------------------------- */
.cta-final {
    background: var(--navy);
    color: #fff;
    padding: 140px 0;
    position: relative;
    overflow: hidden;
    text-align: center;
    border-top: 1px solid rgba(255,255,255,.08);
}
.cta-final.ivory { background: var(--ivory); color: var(--ink); border-top: 0; }
.cta-final.ivory h2     { color: var(--ink); }
.cta-final.ivory h2 em  { color: var(--navy); }
.cta-final.ivory .sub   { color: var(--ink-soft); opacity: .8; }
.cta-final::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 40% 50% at 20% 30%, rgba(252,199,89,.07), transparent 60%),
        radial-gradient(ellipse 50% 60% at 80% 70%, rgba(252,199,89,.05), transparent 60%);
}
.cta-final.ivory::before { display: none; }
.cta-final .wrap { position: relative; }
.cta-final h2 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(40px, 4.8vw, 64px);
    line-height: 1.05;
    letter-spacing: -.015em;
    max-width: 880px;
    margin: 0 auto 24px;
    color: #fff;
    text-wrap: balance;
}
.cta-final h2 em { font-style: italic; color: var(--gold); font-weight: 500; }
.cta-final .sub {
    font-size: 19px;
    line-height: 1.55;
    color: rgba(255,255,255,.7);
    max-width: 640px;
    margin: 0 auto 48px;
    font-weight: 300;
}
.cta-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 64px;
}
.cta-divider { width: 48px; height: 1px; background: rgba(255,255,255,.2); margin: 0 auto 40px; }
.cta-nl { max-width: 560px; margin: 0 auto; }
.cta-nl-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--gold);
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 18px;
}
.cta-nl-label::before,
.cta-nl-label::after { content: ""; width: 24px; height: 1px; background: rgba(252,199,89,.4); }

/* --------------------------------------------------------------------------
   18. INDICE (Programma — griglia 5×2)
   -------------------------------------------------------------------------- */
.indice {
    background: #fff;
    padding: 96px 0 40px;
    border-bottom: 1px solid var(--rule);
}
.indice-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: end;
    margin-bottom: 56px;
}
.indice-head h2 {
    font-size: clamp(38px, 3.6vw, 56px);
    letter-spacing: -.01em;
    line-height: 1.05;
    font-weight: 500;
    text-wrap: balance;
}
.indice-head h2 em { font-style: italic; color: var(--gold-deep); font-weight: 500; }
.indice-head .lede {
    color: var(--ink-soft);
    opacity: .78;
    font-size: 17px;
    line-height: 1.65;
    max-width: 440px;
}
.indice-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    border-top: 1px solid var(--rule);
    border-left: 1px solid var(--rule);
}
.indice-card {
    padding: 32px 28px 36px;
    border-right: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
    background: #fff;
    transition: background .2s ease;
    min-height: 220px;
}
.indice-card:hover { background: var(--ivory); }
.indice-card:hover .indice-arrow { opacity: 1; transform: translateX(0); }
.indice-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
.indice-num {
    font-family: var(--serif);
    font-style: italic;
    font-size: 32px;
    font-weight: 300;
    color: var(--gold-deep);
    line-height: 1;
    letter-spacing: -.01em;
}
.indice-icon { width: 32px; height: 32px; color: var(--navy); flex-shrink: 0; }
.indice-name {
    font-family: var(--serif);
    font-size: 21px;
    font-weight: 500;
    line-height: 1.18;
    color: var(--ink);
    letter-spacing: -.005em;
}
.indice-sub {
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-soft);
    opacity: .72;
    margin-top: auto;
}
.indice-arrow {
    position: absolute;
    bottom: 22px; right: 24px;
    color: var(--gold-deep);
    font-size: 18px;
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity .2s ease, transform .2s ease;
}

/* --------------------------------------------------------------------------
   19. SUBNAV (Programma)
   -------------------------------------------------------------------------- */
html.has-subnav { scroll-padding-top: calc(var(--header-h) + var(--subnav-h) + 16px); }
.subnav {
    position: sticky;
    top: var(--header-h);
    z-index: 50;
    background: rgba(255,255,255,.94);
    backdrop-filter: saturate(1.4) blur(8px);
    -webkit-backdrop-filter: saturate(1.4) blur(8px);
    border-top: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
    height: var(--subnav-h);
    display: flex;
    align-items: center;
}
.subnav .wrap   { display: flex; width: 100%; }
.subnav-scroll  {
    display: flex;
    align-items: center;
    gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    width: 100%;
}
.subnav-scroll::-webkit-scrollbar { display: none; }
.subnav-label {
    flex-shrink: 0;
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    padding: 0 22px 0 0;
    margin-right: 18px;
    border-right: 1px solid var(--rule);
    height: 24px;
    display: flex;
    align-items: center;
}
.subnav-chip {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 500;
    letter-spacing: .01em;
    color: var(--ink-soft);
    padding: 0 14px;
    height: 36px;
    border-radius: 2px;
    white-space: nowrap;
    transition: color .2s ease, background .2s ease;
    position: relative;
}
.subnav-chip:hover,
.subnav-chip.active { color: var(--navy); background: var(--ivory); }
.subnav-chip.active::after {
    content: "";
    position: absolute;
    left: 14px; right: 14px; bottom: -1px;
    height: 2px;
    background: var(--gold);
}
.subnav-chip .n {
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    color: var(--gold-deep);
    font-size: 14px;
}

/* --------------------------------------------------------------------------
   20. TEMA SECTION (Programma — sezioni dei capitoli)
   -------------------------------------------------------------------------- */
.tema { padding: 120px 0 130px; position: relative; background: #fff; }
.tema.alt { background: var(--ivory); }
.tema-head {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 48px;
    align-items: start;
    margin-bottom: 64px;
    padding-bottom: 48px;
    border-bottom: 1px solid var(--rule);
}
.tema-num-block { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.tema-num-block .tema-num {
    font-family: var(--serif);
    font-weight: 300;
    font-size: 140px;
    line-height: .9;
    color: var(--gold);
    letter-spacing: -.04em;
    position: static;
}
.tema-icon-wrap { width: 54px; height: 54px; color: var(--navy); }
.tema-titleblock { padding-top: 14px; }
.tema-eyebrow {
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.tema-eyebrow .rule { width: 36px; height: 1px; background: currentColor; }
.tema-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(44px, 4.8vw, 68px);
    line-height: 1.04;
    letter-spacing: -.018em;
    color: var(--ink);
    margin: 0 0 18px;
    text-wrap: balance;
}
.tema-title em { font-style: italic; color: var(--navy); font-weight: 500; }
.tema-subtitle {
    font-family: var(--serif);
    font-style: italic;
    font-size: 24px;
    line-height: 1.35;
    font-weight: 400;
    color: var(--ink-soft);
    opacity: .78;
    margin: 0;
}
.tema-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 460px);
    gap: 80px;
    align-items: start;
}
.tema-prose p {
    font-size: 18px;
    line-height: 1.7;
    color: var(--ink);
    margin: 0 0 1.3em;
    text-wrap: pretty;
}
.tema-prose p:first-child {
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    line-height: 1.45;
    font-weight: 400;
}
.tema-prose p strong { font-weight: 600; }
.tema-prose p em     { font-style: italic; }

.tema-aside {
    position: sticky;
    top: calc(var(--header-h) + var(--subnav-h) + 32px);
}
.positions { background: #fff; border: 1px solid var(--rule); padding: 32px 32px 28px; }
.positions-label {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.positions-label::after { content: ""; flex: 1; height: 1px; background: var(--rule); }
.positions ol { list-style: none; padding: 0; margin: 0; }
.positions li {
    padding: 16px 0 16px 36px;
    border-bottom: 1px solid var(--rule);
    font-size: 15px;
    line-height: 1.55;
    color: var(--ink);
    position: relative;
}
.positions li:last-child  { border-bottom: none; padding-bottom: 0; }
.positions li:first-child { padding-top: 6px; }
.positions li:first-child::before { top: 8px; }
.positions li::before {
    content: counter(list-item, decimal-leading-zero);
    position: absolute;
    left: 0; top: 18px;
    font-family: var(--serif);
    font-style: italic;
    font-size: 14px;
    color: var(--gold-deep);
    font-weight: 400;
}
.positions li strong { font-weight: 600; }
.tema-pullquote {
    margin-top: 24px;
    padding: 24px 0 0;
    border-top: 1px solid var(--rule);
    font-family: var(--serif);
    font-style: italic;
    font-size: 18px;
    line-height: 1.5;
    color: var(--ink-soft);
}
.tema-pullquote::before {
    content: "§";
    display: block;
    color: var(--gold);
    font-size: 24px;
    font-style: normal;
    margin-bottom: 8px;
}

.tema-foot {
    margin-top: 64px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 24px;
    border-top: 1px solid var(--rule);
    gap: 24px;
    flex-wrap: wrap;
}
.tema-foot .deep-link {
    font-size: 13px;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--navy);
    border-bottom: 1px solid var(--navy);
    padding-bottom: 3px;
}
.tema-foot .next-tema {
    font-size: 13.5px;
    color: var(--ink-soft);
    opacity: .75;
    display: flex;
    align-items: center;
    gap: 10px;
}
.tema-foot .next-tema b {
    color: var(--navy);
    font-family: var(--serif);
    font-style: italic;
    font-weight: 500;
    font-size: 15px;
}
.tema-foot .next-tema:hover         { opacity: 1; }
.tema-foot .next-tema:hover .arrow  { transform: translateX(4px); }
.tema-foot .arrow                   { color: var(--gold-deep); transition: transform .2s ease; }

/* --------------------------------------------------------------------------
   21. JUDGE (Programma — come giudichiamo)
   -------------------------------------------------------------------------- */
.judge {
    background: var(--navy);
    color: #fff;
    padding: 140px 0;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255,255,255,.08);
}
.judge::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 50% 60% at 100% 0%, rgba(252,199,89,.07), transparent 60%),
        radial-gradient(ellipse 50% 60% at 0% 100%, rgba(252,199,89,.04), transparent 60%);
}
.judge .wrap { position: relative; }
.judge-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: end;
    padding-bottom: 48px;
    border-bottom: 1px solid var(--rule-on-navy);
    margin-bottom: 64px;
}
.judge-head h2 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(40px, 4.4vw, 60px);
    line-height: 1.05;
    letter-spacing: -.015em;
    max-width: 640px;
    color: #fff;
    text-wrap: balance;
}
.judge-head h2 em { color: var(--gold); font-style: italic; font-weight: 500; }
.judge-head .lede { color: rgba(255,255,255,.7); font-size: 17px; line-height: 1.65; max-width: 420px; }

.judge-list { list-style: none; padding: 0; margin: 0; counter-reset: judge; }
.judge-item {
    counter-increment: judge;
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 48px;
    align-items: baseline;
    padding: 36px 0;
    border-top: 1px solid var(--rule-on-navy);
}
.judge-item:last-child { border-bottom: 1px solid var(--rule-on-navy); }
.judge-item::before {
    content: counter(judge, decimal-leading-zero);
    font-family: var(--serif);
    font-style: italic;
    font-size: 48px;
    font-weight: 300;
    color: var(--gold);
    line-height: 1;
}
.judge-q {
    font-family: var(--serif);
    font-weight: 400;
    font-size: clamp(22px, 1.9vw, 28px);
    line-height: 1.3;
    letter-spacing: -.005em;
    color: #fff;
}
.judge-q em { color: var(--gold); }
.judge-q small {
    display: block;
    font-family: var(--sans);
    font-style: normal;
    font-size: 14.5px;
    line-height: 1.55;
    font-weight: 400;
    color: rgba(255,255,255,.6);
    margin-top: 10px;
}

/* --------------------------------------------------------------------------
   22. CONTATTI — form + aside + mappa
   -------------------------------------------------------------------------- */
.contact-section { background: #fff; padding: 96px 0 0; }
.contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 80px;
    align-items: start;
}
.form-eyebrow-bar {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 24px;
    color: var(--gold-deep);
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
}
.form-eyebrow-bar .rule { width: 40px; height: 1px; background: currentColor; }
.form-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(34px, 3.4vw, 48px);
    line-height: 1.05;
    letter-spacing: -.015em;
    margin: 0 0 18px;
    text-wrap: balance;
}
.form-title em { font-style: italic; color: var(--navy); font-weight: 500; }
.form-lede {
    font-size: 17px;
    line-height: 1.6;
    color: var(--ink-soft);
    opacity: .8;
    max-width: 520px;
    margin: 0 0 48px;
}
.form-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 24px; }
.field        { display: flex; flex-direction: column; }
.field.full   { grid-column: 1 / -1; }
.field label {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--ink-soft);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.field label .req {
    color: var(--gold-deep);
    font-style: italic;
    font-family: var(--serif);
    font-size: 13px;
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
}
.field input,
.field select,
.field textarea {
    width: 100%;
    font-family: var(--sans);
    font-size: 16px;
    color: var(--ink);
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--rule);
    padding: 10px 0 14px;
    outline: none;
    transition: border-color .2s ease;
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
}
.field input:focus,
.field select:focus,
.field textarea:focus { border-bottom-color: var(--navy); }
.field input:focus-visible,
.field select:focus-visible,
.field textarea:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
    border-bottom-color: var(--navy);
}
.field input::placeholder,
.field textarea::placeholder { color: var(--ink-soft); opacity: .45; }
.field input.invalid,
.field select.invalid,
.field textarea.invalid { border-bottom-color: var(--gold-deep); }
.field select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23E0A937' stroke-width='1.6'><path d='M1 1l5 5 5-5'/></svg>");
    background-repeat: no-repeat;
    background-position: right 4px center;
    background-size: 12px 8px;
    padding-right: 30px;
    cursor: pointer;
}
.field textarea {
    min-height: 140px;
    resize: vertical;
    line-height: 1.55;
    padding-top: 14px;
}
.field-hint {
    margin-top: 8px;
    font-size: 12.5px;
    color: var(--ink-soft);
    opacity: .6;
}
.checkbox-field {
    grid-column: 1 / -1;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-top: 8px;
}
.checkbox-field input {
    appearance: none;
    -webkit-appearance: none;
    width: 20px; height: 20px;
    flex-shrink: 0;
    margin-top: 3px;
    border: 1.5px solid var(--rule);
    background: #fff;
    border-radius: 2px;
    cursor: pointer;
    position: relative;
    transition: border-color .15s ease, background .15s ease;
}
.checkbox-field input:hover    { border-color: var(--ink-soft); }
.checkbox-field input:checked  { background: var(--navy); border-color: var(--navy); }
.checkbox-field input:checked::after {
    content: "";
    position: absolute;
    left: 5px; top: 1px;
    width: 6px; height: 11px;
    border: solid var(--gold);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.checkbox-field input.invalid { border-color: var(--gold-deep); }
.checkbox-field label {
    font-size: 14px;
    line-height: 1.55;
    color: var(--ink-soft);
    letter-spacing: 0;
    text-transform: none;
    font-weight: 400;
    margin: 0;
    cursor: pointer;
}
.checkbox-field label a {
    color: var(--navy);
    border-bottom: 1px solid var(--navy);
}
.form-submit {
    grid-column: 1 / -1;
    margin-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.form-submit .note {
    font-size: 13px;
    color: var(--ink-soft);
    opacity: .6;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.form-submit .note::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.verification-code-form {
    margin-top: 28px;
    padding-top: 28px;
    border-top: 1px solid var(--rule);
}
.verification-code-input {
    max-width: 220px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .16em;
    text-align: center;
}

.form-success {
    display: none;
    padding: 24px 28px;
    background: rgba(252,199,89,.12);
    border: 1px solid rgba(252,199,89,.35);
    border-left: 3px solid var(--gold);
    color: var(--ink);
    font-size: 15px;
    line-height: 1.55;
}
.form-success.show { display: block; }
.form-success strong {
    display: block;
    font-family: var(--serif);
    font-style: italic;
    font-weight: 500;
    font-size: 20px;
    color: var(--navy);
    margin-bottom: 6px;
}

/* Aside con info contatti */
.contact-aside {
    background: var(--ivory);
    padding: 48px 44px;
    border-top: 3px solid var(--gold);
    align-self: start;
    position: relative;
}
.aside-block + .aside-block {
    margin-top: 36px;
    padding-top: 36px;
    border-top: 1px solid var(--rule);
}
.aside-label {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.aside-label .n {
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    color: var(--gold-deep);
    font-size: 16px;
    letter-spacing: 0;
    text-transform: none;
}
.aside-block h3 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: 24px;
    line-height: 1.2;
    letter-spacing: -.005em;
    margin: 0 0 14px;
}
.aside-block h3 em { font-style: italic; color: var(--navy); font-weight: 500; }
.aside-block p {
    font-size: 15px;
    line-height: 1.6;
    color: var(--ink-soft);
    margin: 0 0 12px;
}
.aside-line {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--rule);
    font-size: 15px;
}
.aside-line:last-of-type { border-bottom: none; }
.aside-line .lbl {
    min-width: 112px;
    padding-right: 12px;
    flex-shrink: 0;
    font-size: 11px;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--ink-soft);
    opacity: .8;
    white-space: nowrap;
}
.aside-line .val { color: var(--ink); flex: 1; word-break: break-word; }
.aside-line .val a {
    border-bottom: 1px solid transparent;
    transition: border-color .2s ease;
}
.aside-line .val a:hover { border-bottom-color: var(--navy); }

.social-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.social-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid var(--rule);
    font-size: 13.5px;
    font-weight: 500;
    color: var(--ink);
    transition: border-color .2s ease;
}
.social-chip:hover { border-color: var(--navy); }
.social-chip svg   { width: 16px; height: 16px; color: var(--navy); }
.social-chip .handle { color: var(--ink-soft); opacity: .6; font-size: 13px; }

/* Mini newsletter dentro contatti */
.mini-nl {
    background: var(--navy);
    color: #fff;
    margin: 36px -44px -48px;
    padding: 32px 44px 36px;
}
.mini-nl .aside-label,
.mini-nl .aside-label .n { color: var(--gold); }
.mini-nl h3 { color: #fff; margin-bottom: 10px; }
.mini-nl h3 em { color: var(--gold); font-style: italic; font-weight: 500; }
.mini-nl p { color: rgba(255,255,255,.7); font-size: 14px; line-height: 1.55; margin: 0 0 20px; }
.mini-nl-form {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid rgba(255,255,255,.3);
    padding-bottom: 10px;
}
.mini-nl-form input {
    flex: 1;
    background: transparent;
    border: none;
    color: #fff;
    font-family: var(--sans);
    font-size: 15px;
    padding: 8px 0;
    outline: none;
}
.mini-nl-form input::placeholder { color: rgba(255,255,255,.4); }
.mini-nl-form button {
    background: var(--gold);
    color: var(--navy);
    font-family: var(--sans);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 10px 16px;
    align-self: center;
    transition: background .2s ease;
}
.mini-nl-form button:hover { background: #FFD478; }
.mini-nl-note { font-size: 12px; color: rgba(255,255,255,.75); margin-top: 14px; }
.mini-nl-success {
    display: none;
    color: var(--gold);
    font-size: 14px;
    padding: 12px 0;
}
.mini-nl-success.show { display: block; }

/* Mappa */
.map-section { padding: 96px 0 0; }
.map-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: end;
    margin-bottom: 48px;
}
.map-head h2 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(34px, 3.2vw, 48px);
    line-height: 1.05;
    letter-spacing: -.01em;
    margin: 0;
    text-wrap: balance;
}
.map-head h2 em { font-style: italic; color: var(--navy); font-weight: 500; }
.map-head .map-meta { display: flex; flex-direction: column; gap: 6px; align-self: end; }
.map-head .map-meta .addr {
    font-family: var(--serif);
    font-style: italic;
    font-size: 18px;
    color: var(--ink);
}
.map-head .map-meta .hint { font-size: 13px; color: var(--ink-soft); opacity: .65; }

.map-frame {
    position: relative;
    aspect-ratio: 21 / 9;
    background: linear-gradient(180deg, var(--ivory) 0%, var(--ivory-deep) 100%);
    border: 1px solid var(--rule);
    overflow: hidden;
}
.map-overlay {
    position: absolute;
    left: 32px; bottom: 32px;
    background: #fff;
    padding: 24px 28px;
    max-width: 340px;
    border-left: 3px solid var(--gold);
    box-shadow: 0 18px 36px -22px rgba(6,40,91,.35);
}
.map-overlay .o-eyebrow {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    margin-bottom: 10px;
}
.map-overlay h3 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: 20px;
    line-height: 1.2;
    color: var(--ink);
    margin: 0 0 10px;
}
.map-overlay p { font-size: 14px; line-height: 1.55; color: var(--ink-soft); margin: 0 0 14px; }
.map-overlay .indications {
    font-size: 12px;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--navy);
    border-bottom: 1px solid var(--navy);
    padding-bottom: 3px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.map-overlay .indications:hover .arrow { transform: translateX(3px); }
.map-overlay .arrow { color: var(--gold-deep); transition: transform .2s ease; }

.map-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.map-grid line { stroke: rgba(6,40,91,.08); stroke-width: .5; }
.map-streets path { stroke: rgba(6,40,91,.18); stroke-width: 1.2; fill: none; }
.map-streets path.major { stroke: rgba(6,40,91,.32); stroke-width: 1.8; }
.map-streets path.river { stroke: rgba(6,40,91,.22); stroke-width: 5; stroke-linecap: round; }
.map-blocks rect { fill: rgba(6,40,91,.04); stroke: rgba(6,40,91,.10); stroke-width: .5; }
.map-label {
    font-family: var(--sans);
    font-size: 9px;
    font-weight: 600;
    fill: rgba(6,40,91,.5);
    letter-spacing: .18em;
    text-transform: uppercase;
}
.map-marker .pulse {
    fill: var(--gold);
    opacity: .25;
    transform-origin: center;
    animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse {
    0%, 100% { transform: scale(1);   opacity: .35; }
    50%      { transform: scale(1.6); opacity: 0;   }
}
.map-marker-pin { fill: var(--gold); stroke: var(--navy); stroke-width: 1.5; }

/* --------------------------------------------------------------------------
   23. FOOTER
   -------------------------------------------------------------------------- */
.site-footer {
    background: var(--ink);
    color: rgba(255,255,255,.55);
    padding: 48px 0 56px;
    font-size: 13px;
    margin-top: 120px;
}
.section + .site-footer,
.cta-final + .site-footer,
.nl + .site-footer { margin-top: 0; }
.footer-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 48px;
    align-items: center;
    padding-bottom: 32px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    margin-bottom: 24px;
}
.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-brand .mark { width: 32px; height: 32px; }
.footer-brand .wm {
    font-family: var(--serif);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: #fff;
}
.footer-tag {
    text-align: center;
    font-family: var(--serif);
    font-style: italic;
    color: rgba(255,255,255,.7);
    font-size: 14px;
}
.footer-links {
    display: flex;
    justify-content: flex-end;
    gap: 28px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-links a       { color: rgba(255,255,255,.65); transition: color .2s ease; }
.footer-links a:hover { color: var(--gold); }
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: rgba(255,255,255,.7);
    font-size: 12px;
}
.footer-bottom .legal { display: flex; gap: 18px; flex-wrap: wrap; }

html[data-theme="dark"] .site-footer {
    background: #080D16;
    color: rgba(255,255,255,.55);
}

/* --------------------------------------------------------------------------
   24. COOKIE BANNER (GDPR, gestito da js/cookie-banner.js)
   -------------------------------------------------------------------------- */
.gi-cookie-banner {
    position: fixed;
    left: 24px; right: 24px; bottom: 24px;
    background: #fff;
    border-top: 3px solid var(--gold);
    box-shadow: 0 16px 40px -10px rgba(6,40,91,.25), 0 0 0 1px var(--rule);
    padding: 22px 28px;
    z-index: 100;
    max-width: 1100px;
    margin: 0 auto;
}
.gi-cookie-banner__inner {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.gi-cookie-banner__text {
    flex: 1 1 320px;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--ink-soft);
}
.gi-cookie-banner__text b { color: var(--ink); font-weight: 600; }
.gi-cookie-banner__text a { color: var(--navy); border-bottom: 1px solid var(--navy); }
.gi-cookie-banner__actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.gi-cookie-btn {
    padding: 11px 18px;
    border-radius: 2px;
    font-family: var(--sans);
    font-weight: 600;
    font-size: 13px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.gi-cookie-btn--primary {
    background: var(--gold);
    color: var(--navy);
    border-color: var(--gold);
}
.gi-cookie-btn--primary:hover { background: #FFD478; border-color: #FFD478; }
.gi-cookie-btn--secondary {
    background: transparent;
    color: var(--navy);
    border-color: var(--navy);
}
.gi-cookie-btn--secondary:hover { background: var(--navy); color: #fff; }
.gi-cookie-link {
    background: none;
    border: 0;
    color: var(--navy);
    cursor: pointer;
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .04em;
    border-bottom: 1px solid var(--navy);
    padding: 0;
}
.gi-cookie-link:hover { color: var(--gold-deep); border-bottom-color: var(--gold-deep); }

/* Pannello personalizzazione */
.gi-cookie-modal {
    position: fixed;
    inset: 0;
    background: rgba(6,40,91,.55);
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.gi-cookie-modal__box {
    background: #fff;
    border-top: 3px solid var(--gold);
    max-width: 600px;
    width: 100%;
    max-height: 88vh;
    overflow-y: auto;
    padding: 40px 44px;
    box-shadow: 0 24px 60px rgba(6,40,91,.35);
}
.gi-cookie-modal__box h2 {
    margin: 0 0 12px;
    font-family: var(--serif);
    font-weight: 500;
    font-size: 32px;
    color: var(--ink);
    letter-spacing: -.01em;
}
.gi-cookie-modal__box > p {
    font-size: 15px;
    color: var(--ink-soft);
    line-height: 1.55;
    margin: 0 0 20px;
}
.gi-cookie-category {
    border: 1px solid var(--rule);
    padding: 18px 20px;
    margin-bottom: 14px;
}
.gi-cookie-category__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}
.gi-cookie-category h3 {
    margin: 0;
    font-family: var(--sans);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .04em;
    text-transform: none;
    color: var(--ink);
}
.gi-cookie-category p {
    margin: 8px 0 0;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--ink-soft);
    opacity: .8;
}
.gi-cookie-modal__actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
    margin-top: 18px;
}

/* Toggle switch */
.gi-toggle {
    position: relative;
    display: inline-block;
    width: 42px; height: 22px;
    flex-shrink: 0;
}
.gi-toggle input { opacity: 0; width: 0; height: 0; }
.gi-toggle__slider {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background: #c5c9d2;
    transition: .2s ease;
    border-radius: 22px;
}
.gi-toggle__slider::before {
    content: "";
    position: absolute;
    height: 16px; width: 16px;
    left: 3px; bottom: 3px;
    background: #fff;
    transition: .2s ease;
    border-radius: 50%;
}
.gi-toggle input:checked + .gi-toggle__slider          { background: var(--navy); }
.gi-toggle input:checked + .gi-toggle__slider::before  { transform: translateX(20px); }
.gi-toggle input:disabled + .gi-toggle__slider {
    background: var(--gold);
    cursor: not-allowed;
    opacity: .9;
}

/* --------------------------------------------------------------------------
   24b. ARTICLE — singolo articolo /news/*.html
   -------------------------------------------------------------------------- */
.article {
    --article-read: 680px;
}
.article-hero {
    background: var(--navy);
    color: #fff;
    padding: 72px 0 64px;
    position: relative;
    overflow: hidden;
}
.article-hero::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 60% 50% at 80% 0%, rgba(252,199,89,.07), transparent 60%),
        radial-gradient(ellipse 50% 50% at 0% 100%, rgba(252,199,89,.04), transparent 60%);
}
.article-hero .wrap {
    position: relative;
    max-width: var(--article-read);
    margin: 0 auto;
}
.article-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255,255,255,.8);
    margin-bottom: 28px;
    transition: color .2s ease;
}
.article-back:hover { color: var(--gold); }
.article-category {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 2px;
    margin-bottom: 28px;
}
.article-category.cat-comunicato { background: var(--gold); color: var(--navy); }
.article-category.cat-analisi    { background: rgba(252,199,89,.18); color: var(--gold); border: 1px solid rgba(252,199,89,.4); }
.article-category.cat-evento     { background: #fff; color: var(--navy); }

.article-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(36px, 5vw, 56px);
    line-height: 1.1;
    letter-spacing: -.015em;
    color: #fff;
    margin: 0 0 28px;
    text-wrap: balance;
}
.article-title em { font-style: italic; color: var(--gold); font-weight: 500; }
.article-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 14px;
    font-size: 14px;
    color: rgba(255,255,255,.8);
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,.16);
}
.article-meta .dot { color: var(--gold); }
.article-meta time { font-weight: 500; }
.article-meta strong { color: #fff; font-weight: 600; }

/* Article body */
.article-body {
    max-width: var(--article-read);
    margin: 0 auto;
    padding: 72px var(--gutter) 0;
}
.article-content { font-size: 19px; line-height: 1.7; color: var(--ink); }
.article-content p.lede {
    font-family: var(--serif);
    font-style: italic;
    font-size: 24px;
    line-height: 1.5;
    color: var(--ink);
    margin: 0 0 1.8em;
    text-wrap: pretty;
}
.article-content p {
    margin: 0 0 1.4em;
    text-wrap: pretty;
}
.article-content p strong { font-weight: 600; }
.article-content p em { font-style: italic; }
.article-content h2 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(28px, 3vw, 36px);
    line-height: 1.2;
    letter-spacing: -.01em;
    color: var(--ink);
    margin: 2em 0 .8em;
    text-wrap: balance;
}
.article-content h2 em { font-style: italic; color: var(--navy); font-weight: 500; }
.article-content h3 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: 22px;
    line-height: 1.25;
    margin: 1.8em 0 .6em;
}
.article-content blockquote {
    margin: 1.8em 0;
    padding: 6px 0 6px 28px;
    border-left: 3px solid var(--gold);
    font-family: var(--serif);
    font-style: italic;
    font-size: 22px;
    line-height: 1.45;
    color: var(--ink);
}
.article-content blockquote cite,
.article-content blockquote .cite {
    display: block;
    margin-top: 14px;
    font-family: var(--sans);
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: .7;
}
.article-content ul,
.article-content ol {
    margin: 0 0 1.4em;
    padding-left: 1.5em;
}
.article-content li {
    margin-bottom: .6em;
    padding-left: .4em;
}
.article-content ul li::marker { color: var(--gold-deep); }
.article-content ol li::marker { color: var(--gold-deep); font-style: italic; font-family: var(--serif); }
.article-content figure {
    margin: 2em 0;
    text-align: center;
}
.article-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    border-radius: 2px;
}
.article-content figcaption {
    margin-top: 12px;
    font-size: 13.5px;
    color: var(--ink-soft);
    opacity: .8;
    font-style: italic;
}
.article-content hr {
    border: 0;
    text-align: center;
    margin: 2.4em 0;
    color: var(--gold);
}
.article-content hr::before {
    content: "§ § §";
    letter-spacing: .5em;
    font-family: var(--serif);
    font-size: 18px;
}
.article-content a {
    color: var(--navy);
    border-bottom: 1px solid var(--gold-deep);
    transition: border-color .2s ease, background .2s ease;
}
.article-content a:hover {
    background: rgba(252,199,89,.12);
    border-bottom-color: var(--navy);
}

/* Share buttons */
.article-share {
    max-width: var(--article-read);
    margin: 48px auto 0;
    padding: 28px var(--gutter);
    border-top: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
}
.article-share-label {
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-deep);
    margin-bottom: 14px;
}
.share-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.share-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: #fff;
    border: 1px solid var(--rule);
    border-radius: 2px;
    font-family: var(--sans);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, color .2s ease;
    text-decoration: none;
}
.share-btn:hover {
    border-color: var(--navy);
    background: var(--navy);
    color: var(--gold);
}
.share-btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.share-btn.copied {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--navy);
}

/* Article footer — related articles */
.article-foot {
    max-width: 1100px;
    margin: 80px auto 0;
    padding: 0 var(--gutter) 80px;
}
.related-heading {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(26px, 3vw, 36px);
    color: var(--ink);
    margin: 0 0 32px;
    letter-spacing: -.01em;
}
.related-heading em { font-style: italic; color: var(--gold-deep); font-weight: 500; }
.related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
    margin-bottom: 48px;
}
.related-card {
    display: flex;
    flex-direction: column;
    padding: 24px 24px 26px;
    background: var(--ivory);
    border: 1px solid var(--rule);
    border-radius: 2px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.related-card:hover {
    transform: translateY(-3px);
    border-color: rgba(28,28,28,.18);
    box-shadow: 0 18px 36px -22px rgba(6,40,91,.32);
}
.related-card .related-cat {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--gold-deep);
    margin-bottom: 12px;
}
.related-card .related-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: 19px;
    line-height: 1.25;
    color: var(--ink);
    margin: 0 0 14px;
    text-wrap: balance;
}
.related-card .related-date {
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: .8;
    font-weight: 600;
    margin-top: auto;
}
.related-card.related-card--all {
    background: var(--navy);
    color: #fff;
    border-color: var(--navy);
    justify-content: center;
    text-align: center;
}
.related-card.related-card--all .related-title { color: #fff; font-style: italic; }
.related-card.related-card--all .related-cat { color: var(--gold); }
.related-card.related-card--all .related-date { color: rgba(255,255,255,.7); }

.back-to-news {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 22px;
    background: transparent;
    color: var(--navy);
    border: 1px solid var(--navy);
    border-radius: 2px;
    font-family: var(--sans);
    font-weight: 600;
    font-size: 14px;
    letter-spacing: .04em;
    transition: background .2s ease, color .2s ease;
}
.back-to-news:hover { background: var(--navy); color: var(--gold); }

/* Responsive article */
@media (max-width: 1024px) {
    .related-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .article-hero { padding: 48px 0 48px; }
    .article-title { font-size: clamp(30px, 7.5vw, 42px); }
    .article-body { padding: 48px var(--gutter) 0; }
    .article-content { font-size: 17.5px; }
    .article-content p.lede { font-size: 21px; }
    .article-content h2 { font-size: clamp(24px, 6vw, 30px); margin: 1.6em 0 .6em; }
    .article-content blockquote { font-size: 19px; padding-left: 20px; }
    .article-share { padding: 24px var(--gutter); margin-top: 36px; }
    .article-foot { margin-top: 56px; padding-bottom: 56px; }
    .related-grid { grid-template-columns: 1fr; gap: 18px; }
    .share-buttons { gap: 8px; }
    .share-btn { padding: 10px 14px; flex: 1; justify-content: center; }
}

/* --------------------------------------------------------------------------
   25. RESPONSIVE — breakpoints
   - Desktop:  ≥ 1025px
   - Tablet:   769–1024px  (≤1024px)
   - Mobile:   ≤ 768px
   - Small:    ≤ 480px (riduzioni aggiuntive)
   - Griglia news: 3 col desktop, 2 col tablet, 1 col mobile
   -------------------------------------------------------------------------- */

/* ===== TABLET (≤ 1024px) ===== */
@media (max-width: 1024px) {
    :root                       { --gutter: 24px; }

    /* Hero / page hero */
    .hero                       { padding: 72px 0 96px; }
    .hero .wrap                 { grid-template-columns: 1fr; gap: 48px; }
    .hero-aside                 { border-left: 0; border-top: 1px solid rgba(255,255,255,.2); padding: 24px 0 0; }
    .page-hero                  { padding: 64px 0 80px; }
    .page-hero.compact          { padding: 56px 0 64px; }
    .page-hero-grid             { grid-template-columns: 1fr; gap: 40px; }
    .page-hero-side             { border-left: 0; border-top: 1px solid rgba(255,255,255,.18); padding: 32px 0 0; }

    /* Section heads */
    .section                    { padding: 96px 0; }
    .section-head               { grid-template-columns: 1fr; gap: 24px; }
    .q-head                     { grid-template-columns: 1fr; gap: 24px; }

    /* Lente */
    .lens                       { padding: 96px 0; }
    .lens-grid                  { grid-template-columns: 1fr; }
    .lens-pair                  { grid-template-columns: 1fr; }
    .lens-divider               { width: auto; height: 1px; }
    .lens-divider::before       { padding: 4px 12px; background: var(--ivory); }

    /* Temi grid: 5 → 3 → 2 */
    .temi-grid                  { grid-template-columns: repeat(3, 1fr); }
    .tema-card                  { border-right: 1px solid var(--rule) !important; border-bottom: 1px solid var(--rule) !important; }
    .tema-card:nth-child(5n)    { border-right: 1px solid var(--rule) !important; }
    .tema-card:nth-child(3n)    { border-right: none !important; }

    /* News grid: 3 → 2 col su tablet (homepage + listing) */
    .news-grid                  { grid-template-columns: repeat(2, 1fr); gap: 32px; }
    .news-grid > :nth-child(3)  { grid-column: auto; }
    .news-section .news-grid    { grid-template-columns: repeat(2, 1fr); gap: 36px 28px; }

    /* Newsletter */
    .nl                         { padding: 88px 0; }
    .nl .wrap                   { grid-template-columns: 1fr; gap: 40px; }
    .nl-right                   { border-left: 0; border-top: 1px solid rgba(255,255,255,.14); padding: 40px 0 0; }

    /* Cosa ci distingue / non siamo */
    .distinct-grid              { grid-template-columns: repeat(2, 1fr); border-bottom: none; }
    .distinct-card              { border-bottom: 1px solid rgba(28,28,28,.10); }
    .distinct-card:nth-child(2n){ border-right: none; }
    .not-grid                   { grid-template-columns: 1fr; }
    .not-block                  { border-left: 0 !important; padding: 40px 0; }
    .not-block:last-child       { border-bottom: 0; }

    /* Indice programma: 5 → 2 */
    .indice                     { padding: 72px 0 32px; }
    .indice-grid                { grid-template-columns: repeat(2, 1fr); }
    .indice-head                { grid-template-columns: 1fr; gap: 24px; }

    /* Tema sezioni */
    .tema                       { padding: 96px 0 104px; }
    .tema-head                  { grid-template-columns: 1fr; gap: 24px; padding-bottom: 32px; margin-bottom: 48px; }
    .tema-num-block .tema-num   { font-size: 108px; }
    .tema-body                  { grid-template-columns: 1fr; gap: 48px; }
    .tema-aside                 { position: static; }

    /* Come giudichiamo */
    .judge                      { padding: 112px 0; }
    .judge-head                 { grid-template-columns: 1fr; gap: 32px; }
    .judge-item                 { grid-template-columns: 80px 1fr; gap: 32px; }
    .judge-item::before         { font-size: 38px; }

    /* Contatti */
    .contact-section            { padding: 72px 0 0; }
    .contact-grid               { grid-template-columns: 1fr; gap: 56px; }
    .form-fields                { grid-template-columns: 1fr; }
    .map-section                { padding: 72px 0 0; }
    .map-head                   { grid-template-columns: 1fr; gap: 24px; }
    .map-frame                  { aspect-ratio: 4 / 3; }
    .map-overlay                { left: 16px; right: 16px; bottom: 16px; max-width: none; }

    /* CTA */
    .cta-final                  { padding: 112px 0; }
    .questions                  { padding: 96px 0; }
}

/* ===== MOBILE (≤ 768px) ===== */
@media (max-width: 768px) {
    :root                       { --gutter: 20px; }

    /* Header / Burger menu mobile con animazione slide-in */
    .menu-toggle                { display: inline-flex; }
    .nav-right .btn             { display: none; }  /* "Unisciti a noi" non in header su mobile */
    .nav                        { gap: 12px; }
    .nav-right                  { gap: 8px; margin-left: auto; }
    .utility-controls           { gap: 6px; }
    .lang-switch                { font-size: 11px; letter-spacing: .08em; }
    .theme-toggle               { min-width: 40px; width: 40px; padding: 0; }
    .theme-toggle span          { display: none; }

    .nav-links {
        display: flex;
        position: fixed;
        top: var(--header-h);
        left: 0; right: 0;
        bottom: 0;
        background: var(--navy);
        border-top: 1px solid var(--rule-on-navy);
        padding: 16px var(--gutter) 32px;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        margin: 0;
        max-height: calc(100vh - var(--header-h));
        overflow-y: auto;
        box-shadow: 0 16px 24px -16px rgba(0,0,0,.4);
        /* Slide-in: parte off-screen sopra, scende quando .open */
        transform: translateY(-12px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: transform .28s cubic-bezier(.2,.7,.2,1),
                    opacity .22s ease,
                    visibility 0s linear .28s;
    }
    .nav-links.open {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: transform .32s cubic-bezier(.2,.7,.2,1),
                    opacity .22s ease,
                    visibility 0s linear 0s;
    }
    .nav-links li               { border-bottom: 1px solid var(--rule-on-navy); }
    .nav-links li:last-child    { border-bottom: 0; padding-top: 12px; }
    .nav-links a                { display: block; padding: 18px 0; font-size: 17px; }
    .nav-links a.active::after  { display: none; }
    .nav-links a.active         { color: var(--gold); }

    /* Brand wordmark: nasconde la subline su mobile */
    .brand .wordmark small      { display: none; }
    .brand .wordmark            { font-size: 17px; }

    /* Hero: testo ridotto + CTA stacked */
    .hero                       { padding: 56px 0 72px; }
    .hero h1                    { font-size: clamp(34px, 9vw, 48px); margin-bottom: 24px; }
    .hero-sub                   { font-size: 17px; margin-bottom: 32px; }
    .hero-cta                   { flex-direction: column; align-items: stretch; gap: 12px; }
    .hero-cta .btn              { justify-content: center; }
    .hero-meta                  { font-size: 11px; flex-wrap: wrap; gap: 10px; }
    .hero-aside                 { font-size: 13.5px; padding-top: 24px; }

    /* Page hero compact */
    .page-hero                  { padding: 48px 0 56px; }
    .page-hero.compact          { padding: 40px 0 48px; }
    .page-hero h1               { font-size: clamp(38px, 10vw, 60px); }
    .page-hero-meta             { gap: 18px; flex-direction: column; }
    .page-hero-meta > div       { width: 100%; }

    /* Motto */
    .motto                      { padding: 64px 0; }
    .motto-quote                { font-size: clamp(22px, 5.5vw, 30px); }

    /* Section scaffold */
    .section                    { padding: 72px 0; }
    .section-title              { font-size: clamp(32px, 7vw, 44px); margin-bottom: 40px; }
    .section.alt                { padding: 72px 0; }

    /* Lens cards stacked */
    .lens                       { padding: 72px 0; }
    .lens-card                  { padding: 36px 28px 40px; }
    .lens-card h3               { font-size: 28px; }
    .lens-block                 { padding: 40px 28px; }
    .lens-block h3              { font-size: 28px; }
    .lens-sign                  { font-size: 80px; }

    /* Footer */
    .footer-row                 { grid-template-columns: 1fr; gap: 24px; text-align: center; }
    .footer-brand,
    .footer-links               { justify-content: center; }
    .footer-bottom              { flex-direction: column; gap: 12px; text-align: center; }

    /* Temi grid: 3 → 2 col su mobile */
    .temi                       { padding: 72px 0; }
    .temi-grid                  { grid-template-columns: repeat(2, 1fr); }
    .tema-card:nth-child(3n)    { border-right: 1px solid var(--rule) !important; }
    .tema-card:nth-child(2n)    { border-right: none !important; }

    /* News: 1 col mobile */
    .news                       { padding: 72px 0; }
    .news-grid,
    .news-section .news-grid    { grid-template-columns: 1fr; gap: 28px; }
    .news-section               { padding: 40px 0 16px; }
    .news-img                   { aspect-ratio: 16 / 10; }
    .news-section .news-img     { aspect-ratio: 16 / 10; }
    .news-title                 { font-size: 21px; }
    .news-body                  { padding: 22px 22px 24px; }
    .news-img-mark              { font-size: 10px; right: 16px; top: 16px; }
    .news-placeholder-text      { font-size: 64px; }
    .news-placeholder-text.numeric { font-size: 90px; }

    /* Filterbar */
    .filterbar                  { padding: 16px 0; position: static; }
    .filterbar .wrap            { flex-direction: column; align-items: stretch; gap: 14px; }
    .filterbar-left             { gap: 8px; }
    .filterbar-label            { margin-right: 0; padding-right: 8px; border-right: 0; }
    .pill                       { padding: 8px 14px; font-size: 12.5px; }
    .filterbar-right            { justify-content: space-between; flex-wrap: wrap; opacity: 1; }
    .filter-control             { flex: 1 1 150px; align-items: stretch; flex-direction: column; gap: 6px; }
    .filter-control select      { width: 100%; }

    /* Pagination */
    .pagination                 { padding: 48px 0 64px; gap: 6px; flex-wrap: wrap; }
    .page-btn                   { min-width: 40px; height: 40px; padding: 0 10px; }
    .page-info                  { width: 100%; text-align: center; margin: 8px 0 0; }

    /* Newsletter */
    .nl                         { padding: 72px 0; }
    .nl-left h2                 { font-size: clamp(28px, 7vw, 38px); }
    .nl-form                    { flex-direction: column; gap: 14px; border-bottom: 0; padding-bottom: 0; }
    .nl-form input              { border-bottom: 1px solid rgba(255,255,255,.3); padding-bottom: 14px; font-size: 17px; }
    .nl-form button             { padding: 14px 22px; }

    /* Cookie banner: bottom sheet su mobile */
    .gi-cookie-banner           { left: 0; right: 0; bottom: 0; padding: 18px var(--gutter) 22px; border-radius: 0; max-width: none; }
    .gi-cookie-banner__inner    { gap: 14px; }
    .gi-cookie-banner__actions  { width: 100%; justify-content: stretch; }
    .gi-cookie-banner__actions .gi-cookie-btn { flex: 1; min-width: 120px; }
    .gi-cookie-banner__actions .gi-cookie-link { width: 100%; text-align: center; padding: 8px; }
    .gi-cookie-modal__box       { padding: 28px 22px; }

    /* Cosa ci distingue / non siamo */
    .distinct-grid              { grid-template-columns: 1fr; }
    .distinct-card              { border-right: none; padding: 32px 22px 36px; }
    .distinct-num               { font-size: 40px; margin-bottom: 24px; }

    /* Indice programma: 2 → 1 col */
    .indice                     { padding: 56px 0 24px; }
    .indice-grid                { grid-template-columns: 1fr; }
    .indice-card                { min-height: 0; padding: 28px 22px; }

    /* Subnav */
    .subnav-label               { padding-right: 14px; margin-right: 12px; }

    /* Tema sezioni */
    .tema                       { padding: 64px 0 72px; }
    .tema-num-block .tema-num   { font-size: 80px; }
    .tema-icon-wrap             { width: 44px; height: 44px; }
    .tema-title                 { font-size: clamp(28px, 7vw, 38px); }
    .tema-subtitle              { font-size: 20px; }
    .tema-prose p               { font-size: 17px; }
    .positions                  { padding: 24px 22px 22px; }
    .tema-foot                  { gap: 16px; }

    /* Come giudichiamo */
    .judge                      { padding: 72px 0; }
    .judge-head h2              { font-size: clamp(28px, 6.5vw, 40px); }
    .judge-item                 { grid-template-columns: 1fr; gap: 8px; padding: 28px 0; }
    .judge-item::before         { font-size: 32px; }
    .judge-q                    { font-size: 20px; }

    /* Editoriale */
    .editorial p                { font-size: 17px; line-height: 1.65; }
    .editorial p.lede           { font-size: 21px; }
    .editorial p.lede + p::first-letter { font-size: 4.2em; padding: 4px 10px 0 0; }
    .editorial blockquote       { font-size: 19px; padding: 4px 0 4px 22px; }
    .editorial h3               { font-size: 24px; margin: 1.8em 0 .7em; }

    /* Contatti */
    .contact-section            { padding: 56px 0 0; }
    .form-title                 { font-size: clamp(26px, 6vw, 36px); }
    .form-lede                  { margin-bottom: 32px; }
    .mini-nl                    { margin: 28px -20px -32px; padding: 24px 22px 28px; }
    .contact-aside              { padding: 32px 22px; }
    .map-section                { padding: 56px 0 0; }
    .map-overlay                { padding: 18px 18px; max-width: none; }
    .map-overlay h3             { font-size: 18px; }
    .map-frame                  { aspect-ratio: 1 / 1; }

    /* CTA finali */
    .cta-final                  { padding: 80px 0; }
    .cta-final h2               { font-size: clamp(28px, 7vw, 40px); }
    .cta-final .sub             { font-size: 17px; }
    .cta-actions                { flex-direction: column; align-items: stretch; gap: 12px; margin-bottom: 48px; }
    .cta-actions .btn           { justify-content: center; }

    /* Questions */
    .questions                  { padding: 72px 0; }
    .q-item                     { grid-template-columns: 56px 1fr; gap: 16px; padding: 24px 0; }
    .q-arrow                    { display: none; }
    .q-num                      { font-size: 32px; }
    .q-text                     { font-size: 19px; line-height: 1.35; }
}

/* ===== SMALL MOBILE (≤ 480px) — ulteriori riduzioni ===== */
@media (max-width: 480px) {
    :root                       { --gutter: 16px; }
    body                        { font-size: 16px; }
    .hero h1                    { font-size: clamp(30px, 9vw, 40px); }
    .page-hero h1               { font-size: clamp(34px, 11vw, 52px); }
    .section-title              { font-size: clamp(28px, 8vw, 36px); }
    .lens-block                 { padding: 32px 20px; }
    .lens-sign                  { font-size: 64px; }
    .news-body                  { padding: 18px 18px 22px; }
}

/* --------------------------------------------------------------------------
   28. ISCRIZIONE — account + profilo associativo
   -------------------------------------------------------------------------- */
.signup-section {
    background: #fff;
    padding: 96px 0 112px;
}
.signup-section .section-title {
    margin-bottom: 56px;
}
.signup-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 72px;
    align-items: start;
}
.signup-grid-single {
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
}
.signup-grid-email-only {
    grid-template-columns: minmax(0, 720px);
    gap: 0;
}
.signup-panel {
    min-width: 0;
    padding-top: 4px;
}
.signup-side-note {
    border-left: 1px solid var(--rule);
    padding-left: 40px;
}
.signup-form {
    margin-top: 32px;
}
.form-error {
    display: none;
    padding: 20px 24px;
    margin: 0 0 26px;
    background: rgba(139,105,20,.08);
    border: 1px solid rgba(139,105,20,.28);
    border-left: 3px solid var(--gold-deep);
    color: var(--ink);
    font-size: 15px;
    line-height: 1.55;
}
.form-error.show {
    display: block;
}
.signup-panel .form-success {
    margin: 0 0 26px;
}
.signup-panel .form-success a {
    color: var(--navy);
    border-bottom: 1px solid var(--navy);
    font-weight: 700;
}
.btn[disabled] {
    opacity: .65;
    cursor: wait;
    transform: none;
}
.api-message {
    min-height: 100vh;
    display: flex;
    align-items: center;
    background: var(--ivory);
    padding: 80px 0;
}
.api-message h1 {
    font-size: clamp(42px, 6vw, 76px);
    margin-bottom: 18px;
}
.api-message p {
    max-width: 620px;
    color: var(--ink-soft);
}

@media (max-width: 980px) {
    .signup-grid {
        grid-template-columns: 1fr;
        gap: 64px;
    }
    .signup-side-note {
        border-left: 0;
        border-top: 1px solid var(--rule);
        padding: 40px 0 0;
    }
}

@media (max-width: 640px) {
    .signup-section {
        padding: 64px 0 80px;
    }
    .signup-section .section-title {
        margin-bottom: 40px;
    }
    .signup-form {
        margin-top: 24px;
    }
}

/* --------------------------------------------------------------------------
   29. ACCEDI + DASHBOARD ISCRITTO
   -------------------------------------------------------------------------- */
.access-section {
    min-height: 52vh;
}
.dashboard-hero {
    background: var(--navy);
    color: #fff;
    padding: 42px 0 38px;
}
.dashboard-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
    gap: 48px;
    align-items: end;
}
.dashboard-crumbs {
    margin-bottom: 22px;
}
.dashboard-kicker {
    margin: 0 0 12px;
    color: var(--gold);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
}
.dashboard-hero h1 {
    font-size: clamp(42px, 5vw, 72px);
    line-height: 1;
}
.dashboard-hero h1 em {
    color: var(--gold);
    font-style: italic;
    font-weight: 500;
}
.dashboard-profile-card {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 18px;
    align-items: center;
    padding: 22px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 2px;
}
.dashboard-avatar {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    background: var(--gold);
    color: var(--navy);
    border-radius: 50%;
    font-weight: 800;
    letter-spacing: .08em;
}
.dashboard-name {
    color: #fff;
    font-size: 19px;
    font-weight: 700;
}
.dashboard-email {
    color: rgba(255,255,255,.68);
    font-size: 14px;
    word-break: break-word;
}
.dashboard-section {
    background: var(--ivory);
    padding: 38px 0 88px;
}
.dashboard-gate {
    max-width: 760px;
}
.dashboard-gate p {
    margin: 18px 0 0;
}
.dashboard-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--rule);
}
.dashboard-member-nav {
    position: sticky;
    top: calc(var(--header-h) + 8px);
    z-index: 30;
    display: flex;
    gap: 8px;
    align-items: center;
    margin: 0 0 24px;
    padding: 10px;
    overflow-x: auto;
    background: #fff;
    border: 1px solid var(--rule);
    box-shadow: 0 16px 34px rgba(4,28,66,.07);
    scrollbar-width: thin;
}
.dashboard-member-nav[hidden] {
    display: none;
}
.dashboard-member-nav-item {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 9px 13px;
    border: 1px solid transparent;
    border-radius: 2px;
    background: var(--ivory);
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}
.dashboard-member-nav-item:hover,
.dashboard-member-nav-item.active {
    border-color: var(--navy);
    background: var(--navy);
    color: #fff;
}
.dashboard-member-nav-item[hidden] {
    display: none;
}
.dashboard-panel,
.dashboard-stat {
    scroll-margin-top: calc(var(--header-h) + 82px);
}
.dashboard-heading {
    font-size: clamp(30px, 3.2vw, 44px);
    line-height: 1.12;
}
.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1px;
    margin-bottom: 24px;
    background: var(--rule);
    border: 1px solid var(--rule);
}
.dashboard-stat {
    min-height: 116px;
    padding: 18px;
    background: #fff;
}
.dashboard-stat-label {
    display: block;
    margin-bottom: 14px;
    color: var(--gold-deep);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}
.dashboard-stat strong {
    display: block;
    color: var(--ink);
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.1;
    overflow-wrap: anywhere;
}
.dashboard-stat small {
    display: block;
    margin-top: 8px;
    color: var(--ink-soft);
}
.dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
    gap: 24px;
    align-items: start;
}
.dashboard-panel {
    min-width: 0;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--rule);
    border-radius: 2px;
    box-shadow: 0 18px 42px rgba(4,28,66,.06);
}
.dashboard-panel-main {
    grid-row: span 2;
}
.dashboard-panel-wide {
    grid-column: 1 / -1;
}
.dashboard-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}
.dashboard-panel h3 {
    font-size: 24px;
}
.dashboard-chip {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    background: rgba(252,199,89,.18);
    color: var(--gold-deep);
    border: 1px solid rgba(139,105,20,.24);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}
.dashboard-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin: 0;
    border-top: 1px solid var(--rule);
}
.dashboard-details div {
    padding: 18px 0;
    border-bottom: 1px solid var(--rule);
}
.dashboard-details div:nth-child(odd) {
    padding-right: 18px;
}
.dashboard-details div:nth-child(even) {
    padding-left: 18px;
    border-left: 1px solid var(--rule);
}
.dashboard-details dt {
    margin: 0 0 6px;
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.dashboard-details dd {
    margin: 0;
    color: var(--ink);
    font-weight: 600;
    word-break: break-word;
}
.dashboard-steps {
    display: grid;
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.dashboard-steps li {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 14px;
}
.dashboard-steps li > span {
    width: 22px;
    height: 22px;
    margin-top: 2px;
    border: 2px solid var(--rule);
    border-radius: 50%;
    background: #fff;
}
.dashboard-steps li.done > span {
    border-color: var(--gold);
    background: var(--gold);
    box-shadow: inset 0 0 0 5px #fff;
}
.dashboard-steps strong {
    display: block;
    color: var(--ink);
    line-height: 1.25;
}
.dashboard-steps small {
    color: var(--ink-soft);
}
.dashboard-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.dashboard-action {
    display: grid;
    align-content: space-between;
    gap: 16px;
    min-height: 92px;
    padding: 14px;
    border: 1px solid var(--rule);
    background: var(--ivory);
    color: var(--ink);
}
.dashboard-action:last-child {
    border-bottom: 1px solid var(--rule);
}
.dashboard-action span {
    font-weight: 700;
}
.dashboard-action b {
    color: var(--gold-deep);
    font-size: 12px;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.dashboard-app-panel {
    border-top: 3px solid var(--navy);
}
.dashboard-app-card {
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
}
.dashboard-app-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    background: var(--navy);
    color: var(--gold);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
}
.dashboard-app-copy {
    min-width: 0;
}
.dashboard-app-copy strong,
.dashboard-app-copy small {
    display: block;
}
.dashboard-app-copy strong {
    color: var(--ink);
    font-size: 18px;
    line-height: 1.2;
}
.dashboard-app-copy small {
    margin-top: 5px;
    color: var(--ink-soft);
    line-height: 1.4;
}
.dashboard-app-download {
    width: 100%;
    justify-content: center;
}
.dashboard-app-disclaimer {
    margin: 12px 0 0;
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1.45;
}
.dashboard-qr-panel {
    border-top: 3px solid var(--gold);
}
.dashboard-qr-box {
    display: grid;
    place-items: center;
    min-height: 220px;
    margin-bottom: 16px;
    padding: 16px;
    background: #fff;
    border: 1px solid rgba(10, 36, 68, .14);
}
.dashboard-qr-box svg {
    width: min(100%, 220px);
    height: auto;
    display: block;
    padding: 12px;
    background: #fff;
}
.dashboard-qr-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.dashboard-admin-panel {
    border-top: 3px solid var(--gold);
}
.dashboard-admin-feedback {
    margin-bottom: 16px;
}
.dashboard-admin-list {
    display: grid;
    gap: 12px;
}
.dashboard-admin-empty {
    margin: 0;
    color: var(--ink-soft);
}
.dashboard-admin-request {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, auto);
    gap: 20px;
    align-items: center;
    padding: 16px 0;
    border-top: 1px solid var(--rule);
}
.dashboard-admin-request:first-child {
    border-top: 0;
    padding-top: 0;
}
.dashboard-admin-main {
    min-width: 0;
}
.dashboard-admin-main strong,
.dashboard-admin-main span,
.dashboard-admin-main small {
    display: block;
}
.dashboard-admin-main strong {
    color: var(--ink);
    font-size: 18px;
    line-height: 1.25;
}
.dashboard-admin-main span {
    margin-top: 5px;
    color: var(--ink-soft);
    font-size: 14px;
    overflow-wrap: anywhere;
}
.dashboard-admin-main small {
    margin-top: 6px;
    color: var(--ink-mute);
    line-height: 1.45;
}
.dashboard-admin-controls {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
}
.dashboard-level-select {
    min-width: 220px;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #fff;
    color: var(--ink);
    font: 600 14px/1.2 var(--sans);
}
.dashboard-members-head {
    align-items: flex-start;
}
.dashboard-members-count {
    display: block;
    margin-top: 6px;
    color: var(--ink-soft);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.dashboard-members-tools {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.dashboard-members-list {
    display: grid;
    gap: 16px;
}
.dashboard-member-record {
    padding: 18px 0;
    border-top: 1px solid var(--rule);
}
.dashboard-member-record:first-child {
    padding-top: 0;
    border-top: 0;
}
.dashboard-member-record-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 16px;
}
.dashboard-member-record-head strong,
.dashboard-member-record-head span {
    display: block;
}
.dashboard-member-record-head strong {
    color: var(--ink);
    font-size: 18px;
    line-height: 1.25;
}
.dashboard-member-record-head span:not(.dashboard-chip) {
    margin-top: 5px;
    color: var(--ink-soft);
    font-size: 14px;
    overflow-wrap: anywhere;
}
.dashboard-member-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.dashboard-member-field {
    display: grid;
    gap: 6px;
    min-width: 0;
}
.dashboard-member-field span {
    color: var(--ink-soft);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.dashboard-member-field input,
.dashboard-member-field select,
.dashboard-member-field textarea {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #fff;
    color: var(--ink);
    font: 600 14px/1.25 var(--sans);
}
.dashboard-member-field textarea {
    min-height: 86px;
    resize: vertical;
    font-weight: 500;
}
.dashboard-member-field select:disabled {
    opacity: .65;
    cursor: not-allowed;
}
.dashboard-member-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 14px;
}
.dashboard-permissions-panel {
    border-top: 3px solid var(--gold);
}
.dashboard-permissions-list {
    display: grid;
    gap: 16px;
}
.dashboard-permission-record {
    padding: 18px 0;
    border-top: 1px solid var(--rule);
}
.dashboard-permission-record:first-child {
    padding-top: 0;
    border-top: 0;
}
.dashboard-permission-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}
.dashboard-permission-head strong,
.dashboard-permission-head span {
    display: block;
}
.dashboard-permission-head strong {
    color: var(--ink);
    font-size: 18px;
    line-height: 1.25;
}
.dashboard-permission-head span {
    color: var(--ink-soft);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.dashboard-permission-options {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.dashboard-permission-option {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 11px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    color: var(--ink);
    font-size: 13px;
    font-weight: 700;
}
.dashboard-permission-option input {
    flex: 0 0 auto;
}
details.dashboard-collapsible-record {
    display: block;
    padding: 0;
    border-top: 1px solid var(--rule);
}
details.dashboard-collapsible-record:first-child {
    border-top: 0;
}
.dashboard-record-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 14px;
    align-items: center;
    margin: 0;
    padding: 16px 0;
    list-style: none;
    cursor: pointer;
}
.dashboard-record-summary::-webkit-details-marker {
    display: none;
}
.dashboard-record-summary::after {
    content: "Apri";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 5px 10px;
    border: 1px solid var(--rule);
    color: var(--navy);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
details[open] > .dashboard-record-summary::after {
    content: "Chiudi";
}
.dashboard-record-body {
    padding: 0 0 18px;
}
.dashboard-record-note {
    display: block;
    margin: 0 0 12px;
    color: var(--ink-mute);
    line-height: 1.45;
}
.dashboard-record-summary .dashboard-chip {
    justify-self: end;
}
html[data-theme="dark"] .dashboard-record-summary::after {
    color: var(--ink);
    border-color: rgba(245,243,238,.18);
}
.dashboard-site-panel {
    border-top: 3px solid var(--navy);
}
.dashboard-site-head {
    align-items: flex-start;
}
.dashboard-site-controls {
    max-width: 520px;
    margin-bottom: 12px;
}
.dashboard-site-editor {
    width: 100%;
    min-height: 460px;
    padding: 14px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #0F1620;
    color: #F5F3EE;
    font: 500 13px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    resize: vertical;
    tab-size: 2;
}
.dashboard-news-editor-panel {
    border-top: 3px solid var(--gold);
}
.dashboard-news-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .85fr);
    gap: 24px;
    align-items: start;
}
.dashboard-news-editor-main {
    min-width: 0;
}
.dashboard-news-field {
    margin-bottom: 14px;
}
.dashboard-news-title-editor,
.dashboard-news-body-editor {
    width: 100%;
    min-height: 54px;
    padding: 14px 16px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #fff;
    color: var(--ink);
    outline: none;
}
.dashboard-news-title-editor {
    font-family: var(--serif);
    font-size: clamp(26px, 2.8vw, 38px);
    line-height: 1.12;
    font-weight: 500;
}
.dashboard-news-body-editor {
    min-height: 420px;
    overflow: auto;
}
.dashboard-news-title-editor:focus,
.dashboard-news-body-editor:focus {
    border-color: var(--navy);
    box-shadow: 0 0 0 2px rgba(6, 40, 91, .08);
}
.dashboard-news-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 2px 0 10px;
}
.dashboard-news-tool {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    min-height: 38px;
    padding: 7px 11px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: #fff;
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
}
.dashboard-news-tool:hover {
    border-color: var(--navy);
    color: var(--navy);
}
.dashboard-news-preview {
    position: sticky;
    top: calc(var(--header-h) + 20px);
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--rule);
    border-radius: 2px;
    background: var(--ivory);
}
.dashboard-news-preview > span {
    display: block;
    margin-bottom: 12px;
    color: var(--gold-deep);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}
.dashboard-news-preview h4 {
    margin: 0 0 12px;
    color: var(--ink);
    font-family: var(--serif);
    font-size: clamp(24px, 2.4vw, 34px);
    line-height: 1.14;
}
.dashboard-news-preview p {
    margin: 0 0 18px;
    color: var(--ink-soft);
    font-size: 15px;
    line-height: 1.5;
}
.dashboard-news-preview-body {
    max-height: 520px;
    overflow: auto;
    padding-top: 16px;
    border-top: 1px solid var(--rule);
    font-size: 16px;
}
.dashboard-timeline {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.dashboard-timeline div {
    border-left: 2px solid var(--gold);
    padding-left: 16px;
}
.dashboard-timeline time {
    color: var(--gold-deep);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.dashboard-timeline p {
    margin: 8px 0 0;
    color: var(--ink-soft);
}
html[data-theme="dark"] .dashboard-section {
    background: #080D16;
}
html[data-theme="dark"] .dashboard-stat,
html[data-theme="dark"] .dashboard-panel,
html[data-theme="dark"] .dashboard-toolbar,
html[data-theme="dark"] .dashboard-member-nav {
    background: #111A26;
}
html[data-theme="dark"] .dashboard-member-nav-item {
    background: #0B1220;
    color: var(--ink);
    border-color: rgba(117,230,208,.16);
}
html[data-theme="dark"] .dashboard-member-nav-item:hover,
html[data-theme="dark"] .dashboard-member-nav-item.active {
    background: var(--gold);
    color: #0B1220;
    border-color: var(--gold);
}
html[data-theme="dark"] .dashboard-heading,
html[data-theme="dark"] .dashboard-panel h3,
html[data-theme="dark"] .dashboard-stat strong,
html[data-theme="dark"] .dashboard-details dd,
html[data-theme="dark"] .dashboard-steps strong,
html[data-theme="dark"] .dashboard-admin-main strong,
html[data-theme="dark"] .dashboard-member-record-head strong,
html[data-theme="dark"] .dashboard-permission-head strong,
html[data-theme="dark"] .dashboard-record-summary::after {
    color: #fff;
}
html[data-theme="dark"] .dashboard-app-panel,
html[data-theme="dark"] .dashboard-site-panel {
    border-top-color: var(--gold);
}
html[data-theme="dark"] .dashboard-app-icon {
    background: #0B1220;
    color: var(--gold);
    border: 1px solid rgba(255,255,255,.12);
}
html[data-theme="dark"] .dashboard-level-select {
    background: #0B1220;
    color: var(--ink);
    border-color: rgba(117,230,208,.2);
}
html[data-theme="dark"] .dashboard-member-field input,
html[data-theme="dark"] .dashboard-member-field select,
html[data-theme="dark"] .dashboard-member-field textarea {
    background: #0B1220;
    color: var(--ink);
    border-color: rgba(117,230,208,.2);
}
html[data-theme="dark"] .dashboard-news-title-editor,
html[data-theme="dark"] .dashboard-news-body-editor,
html[data-theme="dark"] .dashboard-news-tool {
    background: #0B1220;
    color: var(--ink);
    border-color: rgba(117,230,208,.2);
}
html[data-theme="dark"] .dashboard-news-preview {
    background: #0B1220;
    border-color: rgba(117,230,208,.2);
}
html[data-theme="dark"] .dashboard-steps li > span {
    background: #111A26;
}
html[data-theme="dark"] .dashboard-steps li.done > span {
    box-shadow: inset 0 0 0 5px #111A26;
}

@media (max-width: 1024px) {
    .dashboard-hero-grid,
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
    .dashboard-admin-request {
        grid-template-columns: 1fr;
    }
    .dashboard-admin-controls {
        justify-content: stretch;
    }
    .dashboard-admin-controls .btn,
    .dashboard-level-select {
        flex: 1 1 auto;
    }
    .dashboard-member-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dashboard-permission-options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dashboard-panel-main,
    .dashboard-panel-wide {
        grid-column: auto;
        grid-row: auto;
    }
}

@media (max-width: 680px) {
    .dashboard-hero {
        padding: 40px 0;
    }
    .dashboard-profile-card {
        grid-template-columns: 52px 1fr;
        padding: 18px;
    }
    .dashboard-avatar {
        width: 52px;
        height: 52px;
    }
    .dashboard-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
    .dashboard-toolbar .btn {
        justify-content: center;
    }
    .dashboard-member-nav {
        position: static;
        margin-bottom: 18px;
    }
    .dashboard-stats,
    .dashboard-details,
    .dashboard-timeline {
        grid-template-columns: 1fr;
    }
    .dashboard-admin-controls {
        flex-direction: column;
        align-items: stretch;
    }
    .dashboard-level-select {
        width: 100%;
        min-width: 0;
    }
    .dashboard-members-head,
    .dashboard-member-record-head,
    .dashboard-permission-head {
        flex-direction: column;
    }
    .dashboard-members-tools,
    .dashboard-member-actions {
        justify-content: stretch;
    }
    .dashboard-members-tools .btn,
    .dashboard-member-actions .btn {
        flex: 1 1 auto;
        justify-content: center;
    }
    .dashboard-actions {
        grid-template-columns: 1fr;
    }
    .dashboard-member-form {
        grid-template-columns: 1fr;
    }
    .dashboard-permission-options {
        grid-template-columns: 1fr;
    }
    .dashboard-record-summary {
        grid-template-columns: minmax(0, 1fr) auto;
    }
    .dashboard-record-summary .dashboard-chip,
    .dashboard-permission-head span {
        grid-column: 1 / -1;
        justify-self: start;
    }
    .dashboard-news-grid {
        grid-template-columns: 1fr;
    }
    .dashboard-news-preview {
        position: static;
    }
    .dashboard-details div:nth-child(odd),
    .dashboard-details div:nth-child(even) {
        padding-left: 0;
        padding-right: 0;
        border-left: 0;
    }
}

/* ==========================================================================
   Utility classes — sostituiscono gli inline style="..." per consentire la
   rimozione di 'unsafe-inline' da style-src nella CSP.
   ========================================================================== */

/* Honeypot anti-bot: input fuori viewport ma visibile ai bot. */
.gi-honeypot { position: absolute; left: -5000px; }

/* Margine superiore "ravvicinato" sui titoli H2 successivi a un eyebrow. */
.gi-h2-tight { margin-top: 14px; }

/* Citazione legale: dichiarazione finale firmata in privacy/cookie-policy. */
.gi-legal-quote { font-style: italic; text-align: center; margin-top: 2.6em; }

/* Note legali fine pagina: piccolo grigio, opacità ridotta. */
.gi-legal-fineprint { text-align: center; font-size: 13px; color: var(--ink-soft); opacity: .7; }

/* Eyebrow centrato (variante flex) — chi-siamo §lente, programma extra. */
.gi-eyebrow-centered { display: flex; justify-content: center; gap: 10px; margin-bottom: 24px; }

/* Eyebrow con solo margin-bottom — programma §metodo. */
.gi-eyebrow-spaced { margin-bottom: 18px; }

/* Wrapper link che si comporta come contenuto trasparente (news cards). */
.gi-card-link { display: contents; color: inherit; text-decoration: none; }

/* Hint testuale piccolo grigio — apertura su appuntamento, contatti. */
.gi-text-hint { font-size: 13.5px; opacity: .7; }

/* CTA centrata cookie policy. */
.gi-cta-row-center { text-align: center; margin: 1.5em 0 2em; }

/* ==========================================================================
   Pagina 404 — spostato dal blocco <style> inline di 404.html per consentire
   la rimozione di 'unsafe-inline' da style-src nella CSP.
   ========================================================================== */
.page-404 {
    min-height: calc(100vh - var(--header-h));
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--navy);
    color: #fff;
    padding: 80px var(--gutter);
    position: relative;
    overflow: hidden;
}
.page-404::before {
    content: "";
    position: absolute; inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 60% 50% at 80% 20%, rgba(252,199,89,.10), transparent 60%),
        radial-gradient(ellipse 50% 50% at 10% 80%, rgba(252,199,89,.06), transparent 60%);
}
.page-404 .inner { position: relative; max-width: 720px; text-align: center; }
.page-404 .code {
    font-family: var(--serif);
    font-style: italic;
    font-weight: 300;
    font-size: clamp(120px, 22vw, 220px);
    line-height: 1;
    color: var(--gold);
    letter-spacing: -.04em;
    margin: 0 0 8px;
    opacity: .9;
}
.page-404 .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: var(--sans);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--gold);
    margin: 0 auto 24px;
}
.page-404 .eyebrow::before,
.page-404 .eyebrow::after {
    content: "";
    width: 28px;
    height: 1px;
    background: var(--gold);
    opacity: .5;
}
.page-404 h1 {
    font-family: var(--serif);
    font-weight: 500;
    font-size: clamp(28px, 4.4vw, 44px);
    line-height: 1.15;
    letter-spacing: -.015em;
    color: #fff;
    margin: 0 0 18px;
    text-wrap: balance;
}
.page-404 h1 em { font-style: italic; color: var(--gold); font-weight: 500; }
.page-404 .lede {
    font-family: var(--serif);
    font-style: italic;
    font-size: clamp(18px, 2vw, 22px);
    line-height: 1.5;
    color: rgba(255,255,255,.8);
    max-width: 560px;
    margin: 0 auto 36px;
    text-wrap: pretty;
}
.page-404 .actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; margin-bottom: 56px; }
.page-404 .quick-links {
    padding-top: 36px;
    border-top: 1px solid rgba(255,255,255,.16);
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(255,255,255,.55);
    font-weight: 600;
}
.page-404 .quick-links ul { list-style: none; padding: 0; margin: 18px 0 0; display: flex; justify-content: center; flex-wrap: wrap; gap: 20px 28px; }
.page-404 .quick-links a { color: rgba(255,255,255,.82); border-bottom: 1px solid transparent; padding-bottom: 2px; transition: color .2s ease, border-color .2s ease; }
.page-404 .quick-links a:hover { color: var(--gold); border-bottom-color: var(--gold); }
@media (max-width: 768px) {
    .page-404                  { padding: 56px var(--gutter); }
    .page-404 .actions         { flex-direction: column; align-items: stretch; }
    .page-404 .actions .btn    { justify-content: center; }
}