/* ==========================================================================
   Blu Vita — Polish layer (load LAST)
   Eleva l'identità visiva: tipografia editoriale, palette ink-blue raffinata,
   ritmo verticale coerente, micro-interazioni, atmosfera. Non riscrive le
   strutture: corregge contrasti, ombre, raggi, spaziature, accenti.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Fraunces:opsz,wght,SOFT@9..144,300..900,0..100&family=JetBrains+Mono:wght@500&display=swap');

/* ---------- Token system ---------- */
:root {
    /* Ink palette — sostituisce il bootstrap blue */
    --ink-950: #060a18;
    --ink-900: #0c1330;
    --ink-800: #122146;
    --ink-700: #1a2f63;
    --ink-600: #234189;

    /* Cyan/electric accent — vivacità misurata */
    --cyan-600: #0085c7;
    --cyan-500: #19a7e6;
    --cyan-400: #4cc7ff;
    --cyan-200: #b8eaff;

    /* Warm — solo per hover, mai per CTA primarie */
    --warm-500: #ff7a59;

    /* Neutri caldi (non grigi piatti) */
    --paper:    #fbfaf7;
    --paper-2:  #f4f2ec;
    --line:     rgba(12, 19, 48, 0.08);
    --line-2:   rgba(12, 19, 48, 0.14);
    --muted:    #5d6478;
    --muted-2:  #8089a0;

    /* Override variabili esistenti per coerenza globale */
    --primary-blue: var(--ink-700);
    --secondary-blue: #eaf2ff;
    --text-color:   var(--ink-900);

    /* Ridefinisce gradienti del livello enhancements */
    --grad-primary: linear-gradient(135deg, var(--ink-800) 0%, var(--ink-600) 60%, var(--cyan-600) 100%);
    --grad-warm:    linear-gradient(135deg, var(--ink-800) 0%, var(--warm-500) 100%);
    --grad-fresh:   linear-gradient(135deg, var(--ink-700) 0%, var(--cyan-500) 100%);
    --grad-dream:   linear-gradient(135deg, var(--ink-900) 0%, var(--ink-600) 55%, var(--cyan-500) 100%);
    --grad-ink:     linear-gradient(180deg, var(--ink-950) 0%, var(--ink-800) 100%);

    /* Shadow system — più morbide, meno "bootstrap glow" */
    --shadow-sm:   0 1px 2px rgba(12,19,48,0.06), 0 2px 6px rgba(12,19,48,0.04);
    --shadow-md:   0 4px 12px rgba(12,19,48,0.08), 0 12px 28px rgba(12,19,48,0.06);
    --shadow-lg:   0 14px 40px rgba(12,19,48,0.12), 0 4px 10px rgba(12,19,48,0.05);
    --shadow-xl:   0 30px 80px rgba(12,19,48,0.20), 0 6px 14px rgba(12,19,48,0.06);
    --shadow-glow: 0 18px 48px rgba(35,65,137,0.22);

    /* Raggi sistema (prevale sui literal) */
    --r-sm: 10px;
    --r-md: 14px;
    --r-lg: 20px;
    --r-xl: 28px;
    --r-pill: 999px;

    /* Easing */
    --ease-out: cubic-bezier(.22, 1, .36, 1);
    --ease-bounce: cubic-bezier(.34, 1.4, .64, 1);
}

/* ---------- Reset di superficie ---------- */
html { scroll-behavior: smooth; }
body {
    font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
    background: var(--paper);
    color: var(--ink-900);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: 'ss01', 'cv11', 'kern';
    letter-spacing: -0.005em;
}

/* Selezione testo brand */
::selection {
    background: var(--ink-800);
    color: var(--cyan-200);
}

/* Focus visibile, accessibile, brand */
*:focus-visible {
    outline: 2px solid var(--cyan-500);
    outline-offset: 3px;
    border-radius: 4px;
}

/* ---------- Tipografia editoriale ---------- */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 700;
    color: var(--ink-900);
    letter-spacing: -0.025em;
    line-height: 1.08;
}
h1 { font-weight: 800; letter-spacing: -0.035em; }
h2 { letter-spacing: -0.028em; line-height: 1.12; }

/* Accent serif per moments editoriali (hero h1 .accent, ecc.) */
.accent, .hero h1 .accent, .eventi-hero h1 .hero-highlight {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    font-variation-settings: 'opsz' 144, 'SOFT' 30;
    letter-spacing: -0.04em;
    /* Sovrascrive il gradient bianco esistente con uno più sofisticato */
    background: linear-gradient(180deg, #ffffff 0%, var(--cyan-200) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    padding-right: .08em;
}

/* Su hero scuri il testo è bianco, nelle pagine resta ink */
.page-hero h1, .hero h1, .eventi-hero h1 { color: #fff; }

p { color: var(--ink-900); line-height: 1.65; }
.page-section p, .feature-card p, .contact-info-item span { color: var(--muted); }

/* Eyebrow micro-label coerente */
.hero-eyebrow, .eventi-eyebrow {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .72rem !important;
    text-transform: uppercase;
    letter-spacing: .18em !important;
    font-weight: 500 !important;
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.22) !important;
    backdrop-filter: blur(12px) saturate(140%);
    padding: .5rem 1rem !important;
    border-radius: var(--r-pill);
}

/* ---------- Header / nav: vetro + tipografia ---------- */
header {
    padding: 1.1rem 2.5rem;
    transition: background .35s var(--ease-out), padding .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
header.scrolled {
    background: rgba(251, 250, 247, 0.78) !important;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border-bottom: 1px solid var(--line) !important;
    box-shadow: 0 1px 0 rgba(12,19,48,0.04), 0 8px 24px rgba(12,19,48,0.04) !important;
    padding: .7rem 2.5rem;
}
header.scrolled .logo {
    background: linear-gradient(135deg, var(--ink-900) 0%, var(--ink-600) 70%, var(--cyan-600) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.logo {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.04em !important;
    font-size: 1.6rem !important;
}
.nav-links a {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: .92rem !important;
    letter-spacing: -0.005em;
    opacity: .92;
}
.nav-links a:hover { opacity: 1; }
.nav-links a::after {
    height: 1.5px !important;
    background: currentColor !important;
    bottom: -4px !important;
    opacity: .6;
}
.nav-links a.active-nav::after { width: 100%; }

/* Lang selector — più discreto */
.lang-toggle {
    border-radius: var(--r-pill) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    background: rgba(255,255,255,0.08) !important;
    backdrop-filter: blur(10px);
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .72rem !important;
    letter-spacing: .12em;
    padding: .4rem .8rem !important;
}
header.scrolled .lang-toggle {
    background: rgba(12,19,48,0.05) !important;
    border-color: var(--line-2) !important;
    color: var(--ink-800);
}

/* ---------- Hero — atmosfera ---------- */
.hero, .eventi-hero, .page-hero {
    background-color: var(--ink-900);
    isolation: isolate;
}
.hero::before, .eventi-hero::before, .page-hero::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(60% 50% at 18% 22%, rgba(76,199,255,0.22), transparent 70%),
        radial-gradient(45% 60% at 85% 78%, rgba(35,65,137,0.55), transparent 75%),
        radial-gradient(80% 80% at 50% 110%, rgba(6,10,24,0.6), transparent 70%);
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: screen;
}
.hero-content, .eventi-hero-content, .page-hero > div { position: relative; z-index: 3; }
.hero::after { z-index: 2; }

/* Grain sottile — solo su hero scuri */
.hero::after, .page-hero::after {
    background-image:
        linear-gradient(180deg, rgba(6,10,24,0.55) 0%, rgba(6,10,24,0.25) 35%, rgba(6,10,24,0.85) 100%),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence baseFrequency='0.9' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 1   0 0 0 0 1   0 0 0 0 1   0 0 0 0.045 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
    background-size: cover, 160px 160px;
}
.page-hero::after {
    content: '';
    position: absolute; inset: 0;
    pointer-events: none;
    z-index: 2;
}

/* Hero h1 — scala + ritmo */
.hero h1 {
    font-size: clamp(2.6rem, 6.5vw, 5.6rem) !important;
    font-weight: 800;
    line-height: 1.0 !important;
    letter-spacing: -0.045em !important;
    text-shadow: none;
    margin-bottom: 1.25rem !important;
}
.hero-content > p {
    font-size: clamp(1.05rem, 1.4vw, 1.25rem) !important;
    color: rgba(255,255,255,0.78) !important;
    text-shadow: none !important;
    font-weight: 400;
    max-width: 580px !important;
}

.hero-scroll {
    font-family: 'JetBrains Mono', monospace;
    font-size: .68rem !important;
    letter-spacing: .25em !important;
    opacity: .55;
}

/* ---------- Bottoni — sistema unificato ---------- */
.hero-btn, .pulsing-btn,
.about-btn, .cta-banner a,
.community-cta-content a,
.contact-form-card button,
.search-submit, .auth-btn {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: -0.005em !important;
    border-radius: var(--r-pill) !important;
    transition: transform .25s var(--ease-out), box-shadow .25s var(--ease-out), background .25s !important;
    will-change: transform;
}

.hero-btn, .pulsing-btn {
    background: #ffffff !important;
    color: var(--ink-900) !important;
    border: none !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18), inset 0 0 0 1px rgba(255,255,255,0.6) !important;
    animation: none !important;
    padding: 1rem 2rem !important;
}
.hero-btn:hover, .pulsing-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(0,0,0,0.28), inset 0 0 0 1px rgba(255,255,255,0.6) !important;
    background: var(--cyan-200) !important;
}

.hero-btn-secondary {
    border: 1px solid rgba(255,255,255,0.35) !important;
    background: transparent !important;
    backdrop-filter: blur(10px);
    padding: 1rem 1.6rem !important;
    border-radius: var(--r-pill) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 500 !important;
    letter-spacing: -0.005em;
}
.hero-btn-secondary:hover {
    background: rgba(255,255,255,0.08) !important;
    transform: translateY(-2px);
}

.about-btn {
    background: var(--ink-900) !important;
    color: #fff !important;
    padding: .9rem 1.75rem !important;
    box-shadow: 0 6px 18px rgba(12,19,48,0.18) !important;
    text-decoration: none;
    display: inline-block;
}
.about-btn:hover {
    transform: translateY(-2px);
    background: var(--ink-700) !important;
    box-shadow: 0 12px 28px rgba(12,19,48,0.28) !important;
}

/* CTA a fondo bianco */
.community-cta-content a, .cta-banner a {
    background: #fff !important;
    color: var(--ink-900) !important;
    padding: 1rem 2rem !important;
    box-shadow: 0 10px 28px rgba(0,0,0,0.22) !important;
}
.community-cta-content a:hover, .cta-banner a:hover {
    background: var(--cyan-200) !important;
    transform: translateY(-3px) !important;
}

/* ---------- Search bar — pill premium ---------- */
.search-bar-section {
    margin-top: -3rem;
    position: relative;
    z-index: 5;
}
.search-bar-container {
    background: #fff !important;
    border-radius: var(--r-pill) !important;
    box-shadow: 0 24px 60px rgba(12,19,48,0.18), 0 4px 12px rgba(12,19,48,0.06) !important;
    border: 1px solid var(--line) !important;
    padding: .35rem !important;
}
.search-bar-container:hover {
    box-shadow: 0 28px 72px rgba(12,19,48,0.24), 0 4px 12px rgba(12,19,48,0.06) !important;
}
.search-form {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
}
.search-field {
    padding: .9rem 1.5rem !important;
    flex: 1;
}
.search-field label {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .65rem !important;
    text-transform: uppercase;
    letter-spacing: .15em;
    color: var(--muted-2) !important;
    margin-bottom: .25rem !important;
    display: block;
    font-weight: 500;
}
.search-select {
    border: none !important;
    background: transparent !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    color: var(--ink-900) !important;
    font-size: .98rem !important;
    padding: 0 !important;
    width: 100%;
    cursor: pointer;
}
.search-divider {
    width: 1px !important;
    height: 38px !important;
    background: var(--line) !important;
}
.search-submit {
    background: var(--ink-900) !important;
    color: #fff !important;
    border: none !important;
    padding: 1rem 1.75rem !important;
    border-radius: var(--r-pill) !important;
    font-weight: 600 !important;
    cursor: pointer;
    margin-left: .5rem !important;
}
.search-submit:hover {
    background: var(--cyan-600) !important;
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(25,167,230,0.35) !important;
}

/* Stats inline — tipografia editoriale */
.stats-inline {
    margin-top: 5rem !important;
    border-top: 1px solid var(--line);
    padding-top: 3rem !important;
}
.stats-inline .si-num {
    font-family: 'Fraunces', serif !important;
    font-weight: 500 !important;
    font-variation-settings: 'opsz' 144;
    background: none !important;
    -webkit-text-fill-color: var(--ink-900) !important;
    color: var(--ink-900) !important;
    font-size: clamp(2rem, 3.6vw, 3rem) !important;
    letter-spacing: -0.04em;
}
.stats-inline .si-label {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .7rem !important;
    text-transform: uppercase;
    letter-spacing: .14em !important;
    color: var(--muted-2) !important;
    margin-top: .5rem !important;
}

/* ---------- Section title — più editoriale ---------- */
.section-title {
    font-size: clamp(1.8rem, 3.2vw, 2.6rem) !important;
    margin-left: 0 !important;
    transform: none !important;
    text-align: center;
    width: 100%;
    padding-bottom: 0 !important;
    margin-bottom: 3rem !important;
}
.section-title::after { display: none !important; }
.section-title::before {
    content: '— ';
    color: var(--cyan-600);
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
}

/* Sezioni: ritmo verticale */
section { scroll-margin-top: 80px; }
.scelti-per-te, .reels-section, .gallery-section {
    padding: 6rem 1.5rem !important;
    max-width: 1300px;
    margin: 0 auto;
}

/* ---------- Card system ---------- */
.card, .reel-card, .feature-card, .contact-info-card, .contact-form-card,
.evento-card, .faq-item {
    border-radius: var(--r-lg) !important;
    border: 1px solid var(--line) !important;
    background: #fff;
    box-shadow: var(--shadow-sm);
    transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out), border-color .35s !important;
}
.card:hover, .reel-card:hover, .evento-card:hover {
    transform: translateY(-6px) !important;
    scale: 1 !important;
    border-color: var(--line-2) !important;
    box-shadow: var(--shadow-lg) !important;
}
.feature-card:hover, .faq-item[open] {
    border-color: var(--ink-700) !important;
    box-shadow: var(--shadow-md) !important;
}

.feature-icon {
    border-radius: var(--r-md) !important;
    width: 52px !important; height: 52px !important;
    background: var(--ink-900) !important;
    box-shadow: 0 8px 20px rgba(12,19,48,0.18);
}
.feature-card:nth-child(2) .feature-icon { background: var(--ink-700) !important; }
.feature-card:nth-child(3) .feature-icon { background: var(--cyan-600) !important; }
.feature-card:nth-child(4) .feature-icon { background: var(--warm-500) !important; }
.feature-card h3 { font-size: 1.15rem !important; letter-spacing: -0.02em; }

/* ---------- About sections (Chi Siamo / Cosa Facciamo) ----------
   Layout 2 colonne basato sull'ordine del DOM:
   - About Us: <content> + <image>  →  descrizione sinistra, foto destra
   - What We Do: <image> + <content>  →  foto sinistra, descrizione destra
   La variante .about-dark aggiunge solo il tema scuro, non altera il layout. */
.about-section {
    padding: 5rem 1.5rem;
}
.about-section .about-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}
.about-section .about-image {
    height: 420px;
    overflow: hidden;
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-xl);
}
.about-section .about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: var(--r-xl);
}
.about-content h2 {
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    margin-bottom: 1.25rem;
}
.about-content ul {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 2rem;
}
.about-content ul li {
    padding: .5rem 0 .5rem 1.5rem;
    position: relative;
    line-height: 1.5;
}
.about-content ul li::before {
    content: '';
    position: absolute;
    left: 0; top: 1.05em;
    width: 8px; height: 1.5px;
    background: var(--cyan-500);
}

/* Variante scura per About Us */
.about-section.about-dark {
    background: var(--grad-ink);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.about-section.about-dark::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(45% 60% at 80% 20%, rgba(76,199,255,0.18), transparent 70%),
        radial-gradient(50% 60% at 10% 90%, rgba(35,65,137,0.4), transparent 70%);
    pointer-events: none;
}
.about-section.about-dark > * { position: relative; }
.about-section.about-dark h2 { color: #fff; }
.about-section.about-dark p { color: rgba(255,255,255,0.78); }
.about-section.about-dark ul li { color: rgba(255,255,255,0.85); }
.about-section.about-dark .about-btn {
    background: #fff;
    color: var(--ink-900);
}
.about-section.about-dark .about-btn:hover {
    background: var(--cyan-200);
}
.about-section.about-dark .about-image {
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
}

@media (max-width: 900px) {
    .about-section { padding: 4rem 1.5rem; }
    .about-section .about-container {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .about-section .about-image { height: 280px; }
    /* In mobile, foto sempre sopra alla descrizione */
    .about-section .about-image   { order: 1; }
    .about-section .about-content { order: 2; }
}

/* ---------- Reels — più cinematic ---------- */
.reel-info {
    padding: 1rem 1.25rem !important;
}
.reel-title {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    color: var(--ink-900);
    letter-spacing: -0.02em;
    font-size: 1.05rem;
}
.reel-location {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .72rem !important;
    color: var(--muted-2) !important;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-top: .25rem;
}

/* ---------- Gallery ---------- */
.gallery-grid .gx {
    border-radius: var(--r-md) !important;
    box-shadow: var(--shadow-sm) !important;
    transition: transform .5s var(--ease-out), filter .35s !important;
}
.gallery-grid .gx:hover {
    transform: scale(1.02) !important;
    filter: saturate(1.05) !important;
    box-shadow: var(--shadow-lg) !important;
}

/* ---------- Community CTA ---------- */
.community-cta-inner {
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-xl) !important;
}
.community-cta-inner::after {
    background: linear-gradient(135deg, rgba(6,10,24,0.85) 0%, rgba(35,65,137,0.7) 50%, rgba(25,167,230,0.6) 100%) !important;
}
.community-cta-content h2 {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: clamp(2rem, 4vw, 3.2rem) !important;
    letter-spacing: -0.035em !important;
    color: #fff !important;
}
.community-cta-content h2::after {
    content: '.';
    color: var(--cyan-400);
    font-family: 'Fraunces', serif;
}
.community-cta-content p {
    color: rgba(255,255,255,0.85) !important;
    font-size: 1.1rem;
    max-width: 540px;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ---------- Page hero (chi-siamo, contatti, faq, privacy) ---------- */
.page-hero {
    background: var(--grad-ink) !important;
    min-height: 56vh;
}
.page-hero h1 {
    font-size: clamp(2.2rem, 5vw, 4rem) !important;
    font-weight: 800;
    letter-spacing: -0.04em !important;
    text-wrap: balance;
    -webkit-text-wrap: balance;
    max-width: 18ch;
    margin-left: auto !important;
    margin-right: auto !important;
}
.page-hero p {
    color: rgba(255,255,255,0.85) !important;
    font-size: 1.35rem !important;
    max-width: 640px;
    margin: 1.25rem auto 0 !important;
}

.page-section { padding: 6rem 1.5rem !important; }
.page-section h2 {
    font-size: clamp(1.7rem, 2.8vw, 2.4rem) !important;
    color: var(--ink-900) !important;
    letter-spacing: -0.025em;
    margin-bottom: 1.25rem !important;
}

/* ---------- Form refinements (contatti + iscrizione) ---------- */
.contact-form-card {
    border-radius: var(--r-xl) !important;
    padding: 2.5rem !important;
}
.contact-form-card label {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .68rem !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--muted) !important;
    font-weight: 500 !important;
}
.contact-form-card input,
.contact-form-card textarea,
.contact-form-card select {
    border-radius: var(--r-sm) !important;
    border: 1px solid var(--line-2) !important;
    background: #fff !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 500 !important;
    transition: border-color .2s, box-shadow .2s !important;
}
.contact-form-card input:focus,
.contact-form-card textarea:focus,
.contact-form-card select:focus {
    border-color: var(--ink-700) !important;
    box-shadow: 0 0 0 4px rgba(35,65,137,0.10) !important;
}
.contact-form-card button {
    background: var(--ink-900) !important;
    border-radius: var(--r-pill) !important;
    padding: 1rem 1.75rem !important;
    box-shadow: 0 8px 22px rgba(12,19,48,0.20) !important;
}
.contact-form-card button:hover {
    background: var(--cyan-600) !important;
    box-shadow: 0 14px 32px rgba(25,167,230,0.30) !important;
}

.contact-info-card {
    border-radius: var(--r-xl) !important;
    padding: 2rem !important;
}
.contact-info-icon {
    background: var(--ink-900) !important;
    color: var(--cyan-400) !important;
    border-radius: var(--r-md) !important;
}
.contact-info-item strong {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .7rem !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--muted) !important;
    font-weight: 500;
}
.contact-info-item span {
    font-size: 1rem !important;
    color: var(--ink-900) !important;
    font-weight: 500;
}

/* ---------- FAQ refinements ---------- */
.faq-item {
    border-radius: var(--r-md) !important;
}
.faq-item summary {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.02rem;
    color: var(--ink-900) !important;
    padding: 1.5rem 1.75rem !important;
}
.faq-item summary::after {
    color: var(--ink-700) !important;
    font-weight: 300;
}
.faq-answer {
    padding: 0 1.75rem 1.5rem !important;
    color: var(--muted) !important;
    line-height: 1.7;
}

/* ---------- Footer — più sobrio, ink ---------- */
.site-footer {
    background: var(--grad-ink) !important;
    color: rgba(255,255,255,0.7);
    margin-top: 6rem;
    position: relative;
    overflow: hidden;
}
.site-footer::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(60% 80% at 50% -20%, rgba(76,199,255,0.10), transparent 70%);
    pointer-events: none;
}
.footer-top { padding: 5rem 1.5rem 3rem !important; position: relative; }
.footer-container {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1.4fr;
    gap: 4rem;
    max-width: 1300px;
    margin: 0 auto;
}
@media (max-width: 900px) {
    .footer-container { grid-template-columns: 1fr; gap: 3rem; }
}
.footer-logo {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 800 !important;
    letter-spacing: -0.04em !important;
    font-size: 1.8rem !important;
    color: #fff !important;
    background: linear-gradient(135deg, #fff 0%, var(--cyan-400) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 1rem !important;
}
.footer-col h3 {
    color: #fff !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: .72rem !important;
    text-transform: uppercase;
    letter-spacing: .18em !important;
    font-weight: 500 !important;
    margin-bottom: 1.5rem !important;
}
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col ul li { margin-bottom: .65rem; }
.footer-col a {
    color: rgba(255,255,255,0.7) !important;
    text-decoration: none;
    font-size: .95rem;
    transition: color .2s;
}
.footer-col a:hover { color: var(--cyan-400) !important; }
.brand-col p {
    color: rgba(255,255,255,0.65) !important;
    font-size: .95rem;
    line-height: 1.65;
    max-width: 320px;
}
.social-icons {
    display: flex;
    gap: .75rem;
    margin-top: 1.5rem;
}
.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px; height: 40px;
    border-radius: var(--r-pill);
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.85) !important;
    transition: all .25s var(--ease-out);
}
.social-icon:hover {
    background: var(--cyan-500);
    border-color: var(--cyan-500);
    color: #fff !important;
    transform: translateY(-2px);
}

.contact-form-footer input,
.contact-form-footer textarea {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    color: #fff !important;
    border-radius: var(--r-sm) !important;
    padding: .85rem 1rem !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    width: 100%;
    margin-bottom: .75rem;
}
.contact-form-footer input::placeholder,
.contact-form-footer textarea::placeholder {
    color: rgba(255,255,255,0.45) !important;
}
.contact-form-footer input:focus,
.contact-form-footer textarea:focus {
    border-color: var(--cyan-400) !important;
    background: rgba(255,255,255,0.10) !important;
    outline: none;
}
.contact-textarea-footer { min-height: 100px; resize: vertical; }
.contact-submit-footer {
    width: 100%;
    background: #fff !important;
    color: var(--ink-900) !important;
    border: none !important;
    padding: .9rem 1rem !important;
    border-radius: var(--r-pill) !important;
    font-weight: 700 !important;
    cursor: pointer;
    transition: all .25s var(--ease-out);
}
.contact-submit-footer:hover {
    background: var(--cyan-400) !important;
    color: var(--ink-900) !important;
    transform: translateY(-2px);
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.08) !important;
    padding: 1.5rem !important;
    position: relative;
}
.footer-bottom-container {
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: .85rem;
}
.footer-bottom p {
    color: rgba(255,255,255,0.55) !important;
    margin: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: .75rem;
    letter-spacing: .05em;
}
.footer-legal {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.footer-legal a {
    color: rgba(255,255,255,0.55) !important;
    text-decoration: none;
    font-size: .8rem;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: .05em;
    transition: color .2s;
}
.footer-legal a:hover { color: var(--cyan-400) !important; }

/* ---------- Auth page polish ---------- */
.auth-body {
    background:
        radial-gradient(40% 50% at 80% 20%, rgba(76,199,255,0.18), transparent 70%),
        radial-gradient(50% 60% at 10% 90%, rgba(35,65,137,0.30), transparent 70%),
        var(--ink-950) !important;
    min-height: 100vh;
}
.auth-brand {
    color: #fff !important;
}
.auth-brand-name {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
}
.auth-brand-mark {
    background: #fff !important;
    color: var(--ink-900) !important;
    border-radius: var(--r-md) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 800 !important;
}
.auth-card {
    background: rgba(255,255,255,0.98) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-xl) !important;
    border: 1px solid rgba(255,255,255,0.5);
    backdrop-filter: blur(20px);
}
.auth-tab {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
}
.auth-tab.active {
    color: var(--ink-900) !important;
}
.auth-panel h2 {
    font-size: 1.8rem !important;
    letter-spacing: -0.03em !important;
}
.auth-field input {
    border-radius: var(--r-sm) !important;
    border: 1px solid var(--line-2) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}
.auth-field input:focus {
    border-color: var(--ink-700) !important;
    box-shadow: 0 0 0 4px rgba(35,65,137,0.10) !important;
}
.auth-btn {
    background: var(--ink-900) !important;
    border-radius: var(--r-pill) !important;
    padding: 1rem !important;
    box-shadow: 0 8px 22px rgba(12,19,48,0.25) !important;
}
.auth-btn:hover {
    background: var(--cyan-600) !important;
    transform: translateY(-2px);
}

/* ---------- Eventi page hero ---------- */
.eventi-hero {
    background: var(--grad-ink) !important;
    min-height: 60vh;
}
.eventi-hero-bg { display: none; }
.eventi-hero h1 {
    font-size: clamp(2.6rem, 6vw, 5rem) !important;
    font-weight: 800;
    letter-spacing: -0.04em !important;
    color: #fff !important;
}
.eventi-hero p {
    color: rgba(255,255,255,0.78) !important;
    font-size: 1.15rem !important;
}
.eventi-hero-wave svg path {
    fill: var(--paper) !important;
}

/* ---------- Reduce motion ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   Index v2 — layout edits (search rimossa, stats centrate, sezioni asimmetriche,
   reels full-bleed, gallery editorial mosaic)
   ========================================================================== */

/* Stats section centrate (al posto della search bar) */
.stats-section {
    position: relative;
    z-index: 5;
    margin-top: -2.5rem;
    padding: 0 1.5rem;
}
.stats-section .stats-inline {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--r-xl);
    box-shadow: 0 24px 60px rgba(12,19,48,0.12), 0 4px 12px rgba(12,19,48,0.05);
    padding: 2rem 2.5rem !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    border-top: 0;
    grid-template-columns: repeat(4, 1fr) !important;
    align-items: center;
    position: relative;
}
.stats-section .stats-inline > div {
    position: relative;
    padding: .25rem 0;
}
.stats-section .stats-inline > div + div::before {
    content: '';
    position: absolute;
    left: 0; top: 20%; bottom: 20%;
    width: 1px;
    background: var(--line);
}
@media (max-width: 700px) {
    .stats-section .stats-inline { grid-template-columns: repeat(2, 1fr) !important; gap: 1.5rem; padding: 1.5rem !important; }
    .stats-section .stats-inline > div + div::before { display: none; }
}

/* Search bar nei filtri di eventi */
.search-bar-in-filters {
    margin: 0 auto 1.5rem !important;
    max-width: 1000px;
    margin-top: -3.5rem !important;
    position: relative;
    z-index: 6;
}

/* ---------- Upcoming Events: sfondo direzionale dx → sx ---------- */
.scelti-per-te {
    position: relative;
    overflow: hidden;
    padding: 7rem 1.5rem 6rem !important;
    max-width: none !important;
    margin: 4rem 0 0 !important;
    isolation: isolate;
}
.scelti-per-te::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(270deg,
            rgba(35,65,137,0.10) 0%,
            rgba(76,199,255,0.06) 22%,
            rgba(251,250,247,0) 60%,
            rgba(251,250,247,0) 100%),
        linear-gradient(270deg,
            var(--ink-900) 0%,
            transparent 35%);
    z-index: -1;
    pointer-events: none;
    opacity: .14;
}
.scelti-per-te::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -8%;
    width: 60%;
    height: 130%;
    transform: translateY(-50%);
    background: radial-gradient(ellipse at right center,
        rgba(35,65,137,0.18) 0%,
        rgba(76,199,255,0.12) 30%,
        transparent 65%);
    z-index: -1;
    pointer-events: none;
    filter: blur(20px);
}
.scelti-per-te .section-title { text-align: center; max-width: 1300px; margin: 0 auto 3rem !important; padding-left: 0; display: block; }
.scelti-per-te .cards-grid { max-width: 1300px; margin: 0 auto; }

/* ---------- Reels — full-bleed, basso, sfondo diverso ---------- */
.reels-section {
    position: relative;
    max-width: none !important;
    margin: 5rem 0 !important;
    padding: 4rem 1.5rem 4.5rem !important;
    background:
        radial-gradient(60% 80% at 80% 100%, rgba(76,199,255,0.18), transparent 70%),
        radial-gradient(50% 70% at 15% 0%, rgba(35,65,137,0.30), transparent 70%),
        var(--paper-2);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    overflow: hidden;
}
.reels-section::before {
    content: '';
    position: absolute; inset: 0;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence baseFrequency='0.85' numOctaves='2' seed='5'/><feColorMatrix values='0 0 0 0 0   0 0 0 0 0   0 0 0 0 0   0 0 0 0.04 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
    background-size: 160px 160px;
    pointer-events: none;
    opacity: .6;
}
.reels-section > * { position: relative; }
.reels-section .section-title {
    margin-bottom: 2.5rem !important;
    color: var(--ink-900);
}
.reels-container {
    max-width: 1300px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
@media (max-width: 900px) {
    .reels-container { grid-template-columns: 1fr; }
}
.reel-card {
    background: #fff;
    border-radius: var(--r-lg) !important;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(12,19,48,0.10);
}
.reel-video-container {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--ink-900);
}
.reel-video-container .static-img,
.reel-video-container .reel-video {
    width: 100%; height: 100%; object-fit: cover;
}
.reel-video-container .static-img {
    transition: transform .8s var(--ease-out), opacity .35s;
}
.reel-card:hover .reel-video-container .static-img { opacity: 0; transform: scale(1.06); }

/* ---------- Gallery — editorial mosaic ---------- */
.gallery-section {
    max-width: none !important;
    padding: 7rem 1.5rem 6rem !important;
    background: var(--paper);
    position: relative;
}
.gallery-head {
    max-width: 1300px;
    margin: 0 auto 3.5rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: end;
}
@media (max-width: 800px) {
    .gallery-head { grid-template-columns: 1fr; gap: 1rem; }
}
.gallery-eyebrow {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    color: var(--cyan-600);
    font-size: 1rem;
    letter-spacing: -0.01em;
    display: block;
    margin-bottom: .75rem;
}
.gallery-title {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: clamp(2.4rem, 5vw, 4rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    margin: 0;
    color: var(--ink-900);
}
.gallery-title::after {
    content: '.';
    color: var(--cyan-500);
    font-family: 'Fraunces', serif;
}
.gallery-lead {
    color: var(--muted);
    font-size: 1.05rem;
    line-height: 1.6;
    max-width: 460px;
    margin: 0;
    justify-self: end;
}
@media (max-width: 800px) {
    .gallery-lead { justify-self: start; }
}

/* Gallery head centrata (variante senza eyebrow/lead) */
.gallery-head-center {
    grid-template-columns: 1fr !important;
    text-align: center;
    margin-bottom: 3.5rem !important;
}
.gallery-head-center .gallery-title {
    margin: 0 auto;
}

.gallery-mosaic {
    max-width: 1300px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    grid-template-rows: 280px 280px;
    gap: 1rem;
}
.gm-tile {
    position: relative;
    margin: 0;
    overflow: hidden;
    border-radius: var(--r-md);
    background: var(--ink-900);
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(12,19,48,0.08);
}
.gm-tile img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .8s var(--ease-out), filter .35s;
}
.gm-tile::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(6,10,24,0.78) 100%);
    opacity: 0;
    transition: opacity .35s var(--ease-out);
    pointer-events: none;
}
.gm-tile figcaption {
    position: absolute;
    left: 1rem; right: 1rem; bottom: 1rem;
    display: flex;
    align-items: center;
    gap: .9rem;
    color: #fff;
    transform: translateY(8px);
    opacity: 0;
    transition: transform .4s var(--ease-out), opacity .35s;
    z-index: 2;
    pointer-events: none;
}
.gm-num {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 1.6rem;
    color: var(--cyan-400);
    letter-spacing: -0.02em;
}
.gm-cap {
    font-family: 'JetBrains Mono', monospace;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: rgba(255,255,255,0.92);
}
.gm-tile:hover img { transform: scale(1.06); filter: saturate(1.08); }
.gm-tile:hover::after { opacity: 1; }
.gm-tile:hover figcaption { transform: translateY(0); opacity: 1; }

/* Featured occupa 2 righe a sinistra */
.gm-feature {
    grid-column: 1;
    grid-row: 1 / 3;
}
/* Le 4 tile rimanenti riempiono la griglia 2x2 a destra */
.gallery-mosaic .gm-tile:nth-child(2) { grid-column: 2; grid-row: 1; }
.gallery-mosaic .gm-tile:nth-child(3) { grid-column: 3; grid-row: 1; }
.gallery-mosaic .gm-tile:nth-child(4) { grid-column: 2; grid-row: 2; }
.gallery-mosaic .gm-tile:nth-child(5) { grid-column: 3; grid-row: 2; }

@media (max-width: 900px) {
    .gallery-mosaic {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 240px 200px 200px;
    }
    .gm-feature { grid-column: 1 / 3; grid-row: 1; }
    .gallery-mosaic .gm-tile:nth-child(2) { grid-column: 1; grid-row: 2; }
    .gallery-mosaic .gm-tile:nth-child(3) { grid-column: 2; grid-row: 2; }
    .gallery-mosaic .gm-tile:nth-child(4) { grid-column: 1; grid-row: 3; }
    .gallery-mosaic .gm-tile:nth-child(5) { grid-column: 2; grid-row: 3; }
}

/* ==========================================================================
   PAGE: About / Contact / FAQ — shared elements
   ========================================================================== */

/* Section heading wrapper used across pages */
.section-head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 3rem;
}
.section-head h2 {
    font-family: 'Fraunces', serif;
    font-size: clamp(1.9rem, 3.4vw, 2.8rem);
    letter-spacing: -0.02em;
    margin: .35rem 0 .75rem;
    color: var(--ink-900);
}
.section-head p {
    color: var(--muted);
    font-size: 1.05rem;
    line-height: 1.65;
    max-width: 620px;
    margin: 0 auto;
}
.section-eyebrow {
    display: inline-block;
    font-family: 'JetBrains Mono', monospace;
    font-size: .72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--cyan-600);
    padding: .35rem .9rem;
    border: 1px solid var(--line-2);
    border-radius: var(--r-pill);
    background: rgba(76,199,255,0.06);
}

/* Eyebrow on dark page-hero */
.page-hero .hero-eyebrow {
    display: inline-block;
    font-family: 'JetBrains Mono', monospace;
    font-size: .72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--cyan-200);
    padding: .4rem 1rem;
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: var(--r-pill);
    background: rgba(255,255,255,0.06);
    margin-bottom: 1.25rem;
    backdrop-filter: blur(8px);
}

/* Numbered feature cards (chi-siamo) */
.feature-card .feature-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: .8rem;
    color: var(--cyan-600);
    letter-spacing: .12em;
    margin-bottom: .9rem;
    font-weight: 600;
}

/* Values section — full width, soft tinted */
.values-section {
    padding: 6rem 1.5rem;
    background:
        radial-gradient(60% 80% at 80% 0%, rgba(76,199,255,0.10), transparent 65%),
        radial-gradient(50% 70% at 0% 100%, rgba(35,65,137,0.08), transparent 65%),
        var(--paper-2);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}
.values-inner {
    max-width: 1200px;
    margin: 0 auto;
}
.values-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}
.value-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 2rem 1.75rem;
    transition: transform .35s var(--ease-out), box-shadow .35s, border-color .35s;
    position: relative;
    overflow: hidden;
}
.value-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--ink-700), var(--cyan-500));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .5s var(--ease-out);
}
.value-card:hover {
    transform: translateY(-4px);
    border-color: var(--ink-700);
    box-shadow: var(--shadow-md);
}
.value-card:hover::before { transform: scaleX(1); }
.value-mark {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--ink-700), var(--cyan-500));
    margin-bottom: 1.25rem;
    box-shadow: 0 8px 18px rgba(35,65,137,0.18);
}
.value-card h3 {
    font-family: 'Fraunces', serif;
    font-size: 1.35rem;
    margin: 0 0 .5rem;
    color: var(--ink-900);
    letter-spacing: -0.01em;
}
.value-card p {
    color: var(--muted);
    line-height: 1.6;
    margin: 0;
    font-size: .95rem;
}
@media (max-width: 900px) {
    .values-grid { grid-template-columns: 1fr; }
    .values-section { padding: 4rem 1.5rem; }
}

/* ==========================================================================
   Timeline — centered, alternating cards (zig-zag)
   ========================================================================== */
.timeline-section {
    padding: 6rem 1.5rem;
    background:
        radial-gradient(50% 70% at 100% 0%, rgba(76,199,255,0.07), transparent 65%),
        radial-gradient(50% 70% at 0% 100%, rgba(35,65,137,0.06), transparent 65%);
    position: relative;
}
.timeline-section .section-head { margin-bottom: 4rem; }

.timeline {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    max-width: 1080px;
    position: relative;
    counter-reset: timeline;
}
/* Central vertical line */
.timeline::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg,
        rgba(35,65,137,0.18) 0%,
        var(--ink-700) 30%,
        var(--cyan-500) 70%,
        rgba(76,199,255,0.25) 100%);
    border-radius: 2px;
    transform: translateX(-50%);
}

.timeline-item {
    position: relative;
    width: 50%;
    padding: 1.25rem 3rem;
    box-sizing: border-box;
}
/* Odd items on the LEFT, even on the RIGHT */
.timeline-item:nth-child(odd) {
    margin-left: 0;
    text-align: right;
}
.timeline-item:nth-child(even) {
    margin-left: 50%;
    text-align: left;
}

/* Connector dot on the central line */
.timeline-item::before {
    content: '';
    position: absolute;
    top: 2.25rem;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--ink-700);
    box-shadow: 0 4px 10px rgba(35,65,137,0.18);
    z-index: 2;
    transition: transform .3s var(--ease-bounce);
}
.timeline-item:nth-child(odd)::before  { right: -9px; }
.timeline-item:nth-child(even)::before { left: -9px; }

/* Connector arm from dot toward the card */
.timeline-item::after {
    content: '';
    position: absolute;
    top: 2.7rem;
    width: 2.25rem;
    height: 2px;
    background: linear-gradient(90deg, rgba(35,65,137,0.18), rgba(35,65,137,0.0));
}
.timeline-item:nth-child(odd)::after  { right: 9px; background: linear-gradient(270deg, rgba(35,65,137,0.18), rgba(35,65,137,0)); }
.timeline-item:nth-child(even)::after { left: 9px; }

/* Current item — accent */
.timeline-item.is-current::before {
    border-color: var(--cyan-500);
    background: var(--cyan-500);
    box-shadow:
        0 0 0 6px rgba(76,199,255,0.18),
        0 0 24px rgba(76,199,255,0.45);
    animation: timeline-pulse 2.4s ease-in-out infinite;
}
@keyframes timeline-pulse {
    0%, 100% { box-shadow: 0 0 0 6px rgba(76,199,255,0.18), 0 0 24px rgba(76,199,255,0.45); }
    50%      { box-shadow: 0 0 0 10px rgba(76,199,255,0.10), 0 0 32px rgba(76,199,255,0.6); }
}

/* The card body */
.timeline-body {
    display: inline-block;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 1.5rem 1.75rem;
    box-shadow:
        0 1px 0 rgba(255,255,255,0.5) inset,
        0 4px 12px rgba(12,19,48,0.05),
        0 18px 40px rgba(12,19,48,0.06);
    transition: transform .3s var(--ease-out), box-shadow .3s, border-color .3s;
    position: relative;
    text-align: left;
    max-width: 100%;
}
.timeline-item:hover .timeline-body {
    transform: translateY(-4px);
    border-color: rgba(35,65,137,0.18);
    box-shadow:
        0 1px 0 rgba(255,255,255,0.5) inset,
        0 6px 16px rgba(12,19,48,0.07),
        0 28px 60px rgba(35,65,137,0.16);
}
.timeline-item:hover::before {
    transform: scale(1.15);
}

/* Year stamp inside the card */
.timeline-year {
    display: inline-block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--cyan-600);
    letter-spacing: 0.14em;
    background: rgba(76,199,255,0.10);
    border: 1px solid rgba(76,199,255,0.25);
    padding: 0.3rem 0.75rem;
    border-radius: 999px;
    margin-bottom: 0.85rem;
    text-transform: uppercase;
}
.timeline-item.is-current .timeline-year {
    color: #fff;
    background: linear-gradient(135deg, var(--ink-700), var(--cyan-500));
    border-color: transparent;
    box-shadow: 0 4px 12px rgba(35,65,137,0.25);
}
.timeline-body h3 {
    font-family: 'Fraunces', serif;
    font-size: 1.35rem;
    margin: 0 0 0.55rem;
    color: var(--ink-900);
    letter-spacing: -0.01em;
    line-height: 1.25;
}
.timeline-body p {
    color: var(--muted);
    line-height: 1.65;
    margin: 0;
    font-size: 0.95rem;
}

/* Mobile: collapse to single column with line on left */
@media (max-width: 800px) {
    .timeline-section { padding: 4rem 1rem; }
    .timeline::before { left: 18px; transform: none; }
    .timeline-item,
    .timeline-item:nth-child(odd),
    .timeline-item:nth-child(even) {
        width: 100%;
        margin-left: 0;
        padding: 0.85rem 0 0.85rem 3rem;
        text-align: left;
    }
    .timeline-item::before,
    .timeline-item:nth-child(odd)::before,
    .timeline-item:nth-child(even)::before {
        left: 9px;
        right: auto;
        top: 1.85rem;
        width: 16px; height: 16px;
    }
    .timeline-item::after,
    .timeline-item:nth-child(odd)::after,
    .timeline-item:nth-child(even)::after {
        left: 25px;
        right: auto;
        top: 2.3rem;
        width: 1rem;
        background: linear-gradient(90deg, rgba(35,65,137,0.18), rgba(35,65,137,0));
    }
    .timeline-body { padding: 1.2rem 1.4rem; }
}

/* ==========================================================================
   PAGE: Contact — extended styles
   ========================================================================== */

.contact-info-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.contact-info-list .contact-info-item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.1rem 0;
    border-bottom: 1px dashed var(--line);
}
.contact-info-list .contact-info-item:last-child { border-bottom: none; }
.contact-info-mark {
    flex: none;
    width: 38px; height: 38px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--ink-800), var(--cyan-600));
    color: #fff;
    box-shadow: 0 6px 16px rgba(35,65,137,0.18);
}
.contact-info-list strong {
    display: block;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--ink-700);
    margin-bottom: .2rem;
    font-weight: 600;
}
.contact-info-list a,
.contact-info-list span {
    color: var(--ink-900);
    font-size: 1rem;
    text-decoration: none;
    line-height: 1.4;
}
.contact-info-list a { color: var(--ink-900); transition: color .2s; }
.contact-info-list a:hover { color: var(--cyan-600); }

.contact-form-sub {
    color: var(--muted);
    margin: 0 0 1.75rem;
    font-size: .95rem;
}
.contact-form-card .field { margin-bottom: 1rem; }
.contact-form-card .form-row .field { margin-bottom: 0; }
.contact-form-consent {
    display: flex;
    gap: .65rem;
    align-items: flex-start;
    font-weight: 400;
    font-size: .85rem;
    color: var(--muted);
    margin: .25rem 0 1.25rem;
    cursor: pointer;
}
.contact-form-consent input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    flex: none;
    accent-color: var(--ink-700);
}
.contact-form-consent a {
    color: var(--cyan-600);
    text-decoration: none;
    font-weight: 600;
}
.contact-form-consent a:hover { text-decoration: underline; }

/* ==========================================================================
   PAGE: FAQ — group title
   ========================================================================== */

.faq-group-title {
    font-family: 'Fraunces', serif;
    font-size: clamp(1.4rem, 2.4vw, 1.85rem);
    text-align: center;
    margin: 3rem 0 1.5rem;
    color: var(--ink-900);
    letter-spacing: -0.01em;
}
.faq-group-title:first-of-type { margin-top: 1rem; }

/* ==========================================================================
   Events: loading spinner (replaces emoji ⏳)
   ========================================================================== */

.ev-loading {
    text-align: center;
    padding: 3rem 1.5rem;
}
.ev-loading-spinner {
    width: 40px; height: 40px;
    border: 3px solid var(--line-2);
    border-top-color: var(--cyan-500);
    border-radius: 50%;
    margin: 0 auto 1rem;
    animation: ev-spin .8s linear infinite;
}
@keyframes ev-spin {
    to { transform: rotate(360deg); }
}
.ev-empty-icon {
    color: var(--muted-2);
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}

/* ==========================================================================
   COMPREHENSIVE MOBILE LAYER
   Page-specific tweaks + generic mobile polish.
   This layer is loaded LAST and intentionally overrides earlier rules.
   ========================================================================== */

/* Hamburger color on dark eventi/auth/policy bodies */
.eventi-body .hamburger-line { background: #fff; }
header.scrolled.eventi-body .hamburger-line { background: var(--ink-900); }

/* ----- Tablet & below (≤900px) ----- */
@media (max-width: 900px) {
    /* Page hero (about, contact, faq) */
    .page-hero {
        padding: 6rem 1.25rem 4rem !important;
        min-height: auto !important;
    }
    .page-hero h1 { font-size: clamp(1.85rem, 6vw, 2.6rem) !important; }
    .page-hero p { font-size: 1rem !important; }
    .page-hero .hero-eyebrow { font-size: .68rem !important; }

    /* Section heads */
    .section-head { margin-bottom: 2rem; }
    .section-head h2 { font-size: clamp(1.6rem, 4.5vw, 2.1rem); }
    .section-head p { font-size: .98rem; }

    /* Generic page-section padding */
    .page-section { padding: 4rem 1.25rem !important; }

    /* Feature grid (chi-siamo) collapses */
    .feature-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 1rem !important;
    }
    .feature-card { padding: 1.4rem 1.2rem !important; }
    .feature-card h3 { font-size: 1.05rem !important; }

    /* Team grid 2 cols */
    .team-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 1rem !important;
    }
    .team-card { padding: 1.25rem 1rem !important; }
    .team-avatar { width: 56px !important; height: 56px !important; font-size: 1.2rem !important; }

    /* Stats strip 2x2 grid */
    .stats-strip { padding: 2.5rem 1rem !important; }
    .stats-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.25rem 1rem !important;
    }
    .stat-num { font-size: clamp(1.6rem, 6vw, 2.1rem) !important; }
    .stat-label { font-size: .8rem !important; }

    /* Stats inline (index) */
    .stats-section .stats-inline {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.25rem !important;
        padding: 1.25rem 1rem !important;
    }

    /* Contact layout: stack form below info */
    .contact-layout {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }
    .contact-info-card,
    .contact-form-card {
        padding: 1.5rem 1.4rem !important;
    }
    .contact-form-card .form-row {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    .contact-info-list .contact-info-item { padding: 0.9rem 0; }

    /* Values grid 1 col on mobile (already in main rule), reinforce */
    .values-grid { grid-template-columns: 1fr !important; gap: 1rem !important; }
    .value-card { padding: 1.5rem 1.4rem !important; }

    /* CTA banner */
    .cta-banner {
        padding: 2rem 1.4rem !important;
        margin: 2rem 1rem !important;
    }
    .cta-banner h3 { font-size: 1.25rem !important; }
    .cta-banner p { font-size: .92rem !important; }

    /* Reels */
    .reels-section { margin: 2.5rem 0 !important; padding: 2.5rem 1rem !important; }

    /* About section (index) */
    .about-section { padding: 3.5rem 1.25rem !important; }
    .about-section .about-image { height: 240px !important; }

    /* Hero index */
    .hero-eyebrow {
        font-size: .68rem !important;
        padding: .35rem .75rem !important;
    }

    /* Community CTA on index */
    .community-cta { margin: 2.5rem 1rem !important; }
    .community-cta-content { padding: 2rem 1.4rem !important; }
    .community-cta-content h2 { font-size: 1.4rem !important; }

    /* FAQ items */
    .faq-item summary { font-size: .95rem !important; padding: 1rem 1.2rem !important; }
    .faq-answer { padding: 0 1.2rem 1rem !important; font-size: .92rem !important; }
    .faq-group-title { margin: 2rem 0 1rem !important; }

    /* Privacy doc */
    .policy-main { padding: 2rem 1rem !important; }

    /* Profile page */
    .profile-hero { padding: 1.5rem 1rem !important; }
    .profile-avatar-lg { width: 70px !important; height: 70px !important; font-size: 1.6rem !important; }

    /* Footer container padding */
    .footer-container { padding: 0 1.25rem !important; }
    .footer-col h3 { font-size: 1rem !important; }

    /* Modal generic */
    .ev-modal-overlay { padding: 0.75rem !important; }
}

/* ----- Phone (≤600px) ----- */
@media (max-width: 600px) {
    /* Header tighter */
    header { padding: .75rem 1rem !important; }
    .logo { font-size: 1.4rem !important; }

    /* Lang selector compact in mobile slide-out */
    .nav-links .lang-selector-wrap {
        width: 100%;
        margin: 0 0 .5rem 0;
        padding-bottom: .75rem;
        border-bottom: 1px solid var(--line);
    }
    .lang-toggle { padding: .5rem .8rem; }

    /* Hero index */
    .hero { min-height: 70vh; padding: 0 1.25rem !important; }
    .hero h1 { font-size: clamp(2rem, 9vw, 2.8rem) !important; }
    .hero p { font-size: 1rem !important; }
    .hero-cta-row {
        flex-direction: column !important;
        gap: .75rem !important;
        width: 100%;
        max-width: 320px;
    }
    .hero-cta-row > a { width: 100%; justify-content: center; }

    /* Feature grid 1 col */
    .feature-grid { grid-template-columns: 1fr !important; }

    /* Team grid 1 col */
    .team-grid { grid-template-columns: 1fr !important; }

    /* Page hero */
    .page-hero { padding: 5rem 1rem 3rem !important; }
    .page-hero h1 { font-size: clamp(1.6rem, 7vw, 2.1rem) !important; }

    /* Section paddings */
    .page-section { padding: 3rem 1rem !important; }
    .values-section { padding: 3rem 1rem !important; }
    .timeline-section { padding: 3rem 1rem !important; }

    /* Footer */
    .footer-container { padding: 0 1rem !important; }
    .footer-bottom-container {
        padding: 1rem !important;
        gap: .75rem !important;
    }
    .footer-legal { gap: .75rem !important; flex-wrap: wrap; justify-content: center; }
    .contact-form-footer button { width: 100%; }

    /* About community CTA */
    .community-cta-content h2 { font-size: 1.2rem !important; }
    .community-cta-content p { font-size: .92rem !important; }

    /* Modal full screen-ish */
    .ev-modal { max-height: 95vh !important; border-radius: 16px !important; }
    .ev-modal-img-wrap { height: 160px !important; }
    .ev-modal-body { padding: 1.1rem 1.2rem 1.4rem !important; }
    .ev-modal-title { font-size: 1.15rem !important; }

    /* Stats single col */
    .stats-grid { gap: 1rem !important; }
    .stats-section .stats-inline { padding: 1rem !important; }

    /* Make all clickable elements have a comfortable touch target */
    .chip, .filter-reset, .lang-option, .nav-links a, .ev-btn, .auth-btn { min-height: 38px; }
}

/* ----- Very small phones (≤380px) ----- */
@media (max-width: 380px) {
    .hero h1 { font-size: 1.85rem !important; }
    .page-hero h1 { font-size: 1.5rem !important; }
    .section-head h2 { font-size: 1.45rem !important; }
    .footer-logo { font-size: 1.4rem !important; }
}

/* ----- Touch-friendly + scroll behavior on mobile ----- */
@media (hover: none) and (pointer: coarse) {
    /* Disable hover transforms that look stuck on touch devices */
    .feature-card:hover,
    .team-card:hover,
    .reel-card:hover,
    .ev-card:hover,
    .value-card:hover,
    .timeline-item:hover .timeline-body,
    .card:hover {
        transform: none !important;
    }
    /* Smaller tap highlight */
    a, button { -webkit-tap-highlight-color: rgba(35,65,137,0.08); }
}

/* ----- Prevent horizontal overflow on all pages ----- */
html, body { overflow-x: hidden; max-width: 100vw; }

/* ============================================================
   BLU VITA — Brand layer (typography + section alternation +
   about justify + WhatsApp FAB). Loaded LAST.
   ============================================================ */
:root {
    --font-brand: 'Helvetica Now', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --brand-blue: #004AAD;
}

/* MODIFICA 2 — Helvetica Now globally, except FAQ titles */
body, p, span, a, li, td, th, label, small, strong, em,
input, textarea, select, button, blockquote,
.nav-links a, .logo, .lang-toggle,
.hero-eyebrow, .eventi-eyebrow, .accent, .hero-scroll,
.hero-btn, .hero-btn-secondary, .pulsing-btn, .about-btn,
.community-cta-content a, .contact-form-card button,
.search-submit, .auth-btn,
.section-title, .gallery-title, .gm-cap, .gm-num,
.reel-title, .reel-location,
.si-num, .si-label, .stat-num, .stat-label,
.feature-num, .feature-card h3, .value-card h3,
.timeline-year, .timeline-body h3, .team-avatar, .team-card h4,
.section-eyebrow,
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-brand) !important;
}
h1, h2 { font-weight: 700 !important; }
h3, h4, h5, h6 { font-weight: 400 !important; }

/* FAQ exception: keep original font for FAQ titles */
.faq-group-title,
.faq-item summary,
.faq-item summary * {
    font-family: 'Plus Jakarta Sans', 'Montserrat', sans-serif !important;
}

/* Stats: same family/weight pattern as text above (number bold, label regular) */
.stats-inline .si-num,
.stats-strip .stat-num {
    font-family: var(--font-brand) !important;
    font-weight: 700 !important;
    background: none !important;
    -webkit-text-fill-color: var(--brand-blue) !important;
    color: var(--brand-blue) !important;
}
.stats-inline .si-label,
.stats-strip .stat-label {
    font-family: var(--font-brand) !important;
    font-weight: 400 !important;
    color: #5a6478;
}

/* MODIFICA 4 — Homepage section alternation.
   Sections marked via .bv-bg-white / .bv-bg-blue in HTML. */
.bv-bg-white {
    background: #ffffff !important;
    color: #1a202c !important;
}
.bv-bg-blue {
    background: var(--brand-blue) !important;
    color: #ffffff !important;
}

/* White-bg titles → brand blue */
.bv-bg-white .section-title,
.bv-bg-white .gallery-title,
.bv-bg-white h2,
.bv-bg-white .about-content h2 {
    color: var(--brand-blue) !important;
    -webkit-text-fill-color: var(--brand-blue) !important;
    background: none !important;
}

/* Stats numbers stay blue regardless (blue on white bg) */
.bv-bg-white .si-num,
.bv-bg-white .stat-num {
    color: var(--brand-blue) !important;
    -webkit-text-fill-color: var(--brand-blue) !important;
    background: none !important;
}

/* Blue-bg titles → white, body/lists also white */
.bv-bg-blue .section-title,
.bv-bg-blue .gallery-title,
.bv-bg-blue h1,
.bv-bg-blue h2,
.bv-bg-blue h3,
.bv-bg-blue p,
.bv-bg-blue li,
.bv-bg-blue .about-content h2,
.bv-bg-blue .about-content p,
.bv-bg-blue .about-content li,
.bv-bg-blue .reel-title,
.bv-bg-blue .reel-location,
.bv-bg-blue .gm-cap,
.bv-bg-blue .gm-num,
.bv-bg-blue .si-num,
.bv-bg-blue .si-label {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
}

/* Buttons inside blue sections invert: white fill, blue text */
.bv-bg-blue .about-btn,
.bv-bg-blue .hero-btn,
.bv-bg-blue .pulsing-btn {
    background: #ffffff !important;
    color: var(--brand-blue) !important;
}
.bv-bg-blue .about-btn:hover,
.bv-bg-blue .hero-btn:hover,
.bv-bg-blue .pulsing-btn:hover {
    background: #e6efff !important;
    color: var(--brand-blue) !important;
}

/* Force backgrounds even when previous layers set gradients */
section.bv-bg-white { background: #ffffff !important; }
section.bv-bg-blue  { background: var(--brand-blue) !important; }

/* MODIFICA 5 — About / Chi Siamo: justified, fixed-width descriptive paragraph */
.about-section .about-content p,
.about-hero p,
.page-section .section-head p {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 720px) {
    .about-section .about-content p,
    .about-hero p,
    .page-section .section-head p {
        max-width: 100%;
        padding: 0 1rem;
    }
}

/* MODIFICA 6 — WhatsApp floating action button */
.bv-whatsapp-fab {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #25D366;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 0.85;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18), 0 2px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.25s ease, opacity 0.25s ease, box-shadow 0.25s ease;
    text-decoration: none;
}
.bv-whatsapp-fab:hover {
    transform: scale(1.1);
    opacity: 1;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22), 0 4px 8px rgba(0, 0, 0, 0.12);
}
.bv-whatsapp-fab svg {
    width: 26px;
    height: 26px;
    fill: #ffffff;
    display: block;
}
@media (max-width: 720px) {
    .bv-whatsapp-fab {
        width: 40px;
        height: 40px;
    }
    .bv-whatsapp-fab svg {
        width: 22px;
        height: 22px;
    }
}

/* MODIFICA — Stats floating card (overlaps hero ↔ next section) */
.stats-floating {
    position: relative;
    z-index: 10;
    max-width: 1100px;
    margin: -70px auto 0;
    padding: 1.5rem 2rem;
    background: #ffffff;
    border-radius: 22px;
    box-shadow: 0 18px 48px rgba(12, 19, 48, 0.14),
                0 4px 12px rgba(12, 19, 48, 0.06);
    width: calc(100% - 3rem);
}
.stats-floating .stats-inline {
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    text-align: center;
    max-width: none;
}
.stats-floating .si-num {
    color: var(--brand-blue) !important;
    -webkit-text-fill-color: var(--brand-blue) !important;
    background: none !important;
}
.stats-floating .si-label {
    color: #5a6478 !important;
    -webkit-text-fill-color: #5a6478 !important;
}

/* Section right after the floating stats: extra top padding so the card
   doesn't visually crash into the content. */
.stats-floating + section.bv-bg-white,
.stats-floating + section.bv-bg-blue,
.stats-floating + section {
    padding-top: 6rem !important;
}

@media (max-width: 720px) {
    .stats-floating {
        margin: -30px 1rem 0;
        width: auto;
        padding: 1rem 0.75rem;
        border-radius: 18px;
    }
    .stats-floating .stats-inline {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
    .stats-floating + section.bv-bg-white,
    .stats-floating + section.bv-bg-blue,
    .stats-floating + section {
        padding-top: 3.5rem !important;
    }
}

/* MODIFICA — Login link as user icon */
.nav-links a.nav-auth-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 10px;
    border-radius: 50%;
    color: #ffffff;
    transition: color 0.25s ease, background 0.25s ease, transform 0.25s ease;
    box-sizing: border-box;
}
.nav-links a.nav-auth-icon svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
    display: block;
    pointer-events: none;
}
/* Hide the underline pseudo-element used by other nav links */
.nav-links a.nav-auth-icon::after {
    display: none !important;
}
/* When header is scrolled, navbar turns light → use brand blue for the icon */
header.scrolled .nav-links a.nav-auth-icon {
    color: var(--brand-blue);
}
.nav-links a.nav-auth-icon:hover {
    background: rgba(255, 255, 255, 0.12);
    transform: translateY(-1px);
    opacity: 1;
}
header.scrolled .nav-links a.nav-auth-icon:hover {
    background: rgba(0, 74, 173, 0.08);
    color: var(--brand-blue);
}
@media (max-width: 720px) {
    .nav-links a.nav-auth-icon {
        width: 44px;
        height: 44px;
    }
}

/* ============================================================
   CORRECTIONS — Stats pill + section gaps + community-cta blue
   ============================================================ */

/* CORRECTION 1 — Compact pill statistics card, vertically centered
   on the boundary between hero and next section (margin-top = -height/2) */
.stats-floating {
    padding: 26px 40px;
    margin-top: -52px;
    margin-bottom: 0;
    min-height: 0;
    background: #ffffff !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12),
                0 -2px 14px rgba(0, 0, 0, 0.05);
    overflow: visible !important;
}
.stats-floating .si-num {
    font-size: clamp(1.5rem, 2.8vw, 2rem) !important;
    line-height: 1.05 !important;
}
.stats-floating .si-label {
    font-size: 0.85rem !important;
    line-height: 1.2 !important;
    margin-top: 4px !important;
}
.stats-floating .stats-inline {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    gap: 1.5rem;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    max-width: none !important;
    grid-template-columns: none !important;
}
.stats-floating .stats-inline > div + div::before {
    display: none !important;
}
.stats-floating .stats-inline > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    min-width: 0;
}
.stats-floating .si-num {
    line-height: 1.05;
    margin: 0;
}
.stats-floating .si-label {
    margin-top: 2px;
}
@media (max-width: 720px) {
    .stats-floating {
        padding: 18px 16px;
        margin-top: -42px;
        border-radius: 16px;
    }
    .stats-floating .stats-inline {
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 0.5rem;
    }
    .stats-floating .stats-inline > div {
        flex: 1 1 0;
        min-width: 0;
    }
    .stats-floating .si-num {
        font-size: clamp(1.05rem, 4.5vw, 1.5rem) !important;
    }
    .stats-floating .si-label {
        font-size: clamp(0.65rem, 2.5vw, 0.78rem) !important;
        line-height: 1.15;
    }
}

/* CORRECTIONS 2/3/4 — Make homepage sections full-width so their
   background fills edge-to-edge and removes body-bg gaps. Constrain
   only the inner content via max-width. Also kill the legacy
   margin: 4rem 0 on .reels-section and the centered-card layout
   on .scelti-per-te / .reels-section / .gallery-section. */
.scelti-per-te,
.reels-section,
.gallery-section,
.about-section {
    max-width: none !important;
    margin: 0 !important;
    width: 100% !important;
}
.scelti-per-te,
.reels-section,
.gallery-section {
    padding: 4.5rem 1.5rem !important;
}
.scelti-per-te > .cards-grid,
.reels-section > .reels-container,
.gallery-section > .gallery-mosaic,
.gallery-section > .gallery-head {
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
}

/* Section just after the floating stats: pull up to close the gap
   and add internal top padding so content doesn't hide behind card. */
.stats-floating + section.bv-bg-white,
.stats-floating + section.bv-bg-blue,
.stats-floating + section {
    margin-top: -52px !important;
    padding-top: 6rem !important;
}
@media (max-width: 720px) {
    .stats-floating + section.bv-bg-white,
    .stats-floating + section.bv-bg-blue,
    .stats-floating + section {
        margin-top: -42px !important;
        padding-top: 4rem !important;
    }
}

/* Hero must end with no extra padding-bottom that exposes body bg */
.hero { margin-bottom: 0 !important; }

/* CORRECTION 3 — Force pure white below the hero so no off-white shows
   through behind the floating stats card or to the sides of sections. */
body { background: #ffffff !important; }
section.scelti-per-te.bv-bg-white {
    background: #ffffff !important;
    background-image: none !important;
}

/* CORRECTION — Community CTA: keep original card layout (image bg + overlay,
   max-width, margin, border-radius, shadow), only change overlay tint. */
.community-cta-inner::after {
    background: rgba(0, 74, 173, 0.75) !important;
}
.community-cta-content,
.community-cta-content h2,
.community-cta-content p {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
/* Bottone CTA: testo blu su sfondo bianco (l'eredità di -webkit-text-fill-color
   dal parent rendeva il testo bianco su bianco) */
.community-cta-content a {
    color: var(--brand-blue) !important;
    -webkit-text-fill-color: var(--brand-blue) !important;
    background: #ffffff !important;
}
.community-cta-content a:hover {
    color: var(--brand-blue) !important;
    -webkit-text-fill-color: var(--brand-blue) !important;
}

/* About-section images: portrait sources (1536×2048) in landscape boxes →
   originally cropped heavily. Bump container height so less is cut, and
   bias the visible window upward to show more of the subjects. */
.about-section .about-image {
    height: 520px !important;
}
.about-section .about-image img {
    object-fit: cover !important;
    object-position: center 55% !important;
}
@media (max-width: 720px) {
    .about-section .about-image { height: 360px !important; }
}

/* =========================================================
   RESTYLING 2026 — Logo immagine + Footer blu
   ========================================================= */

/* --- Logo immagine in header --- */
.logo { background: none !important; -webkit-text-fill-color: initial !important; }
.logo img {
    height: 42px;
    width: auto;
    display: block;
}
/* Logo bianco -> blu brand su header chiaro (scrolled / pagine solid) */
header.scrolled .logo img,
.profile-body .logo img,
.policy-body .logo img,
.iscrizione-body .logo img {
    filter: brightness(0) saturate(100%) invert(17%) sepia(96%)
            saturate(2589%) hue-rotate(208deg) brightness(94%) contrast(101%);
}
@media (max-width: 768px) { .logo img { height: 34px; } }

/* --- Footer logo immagine --- */
.footer-logo {
    display: inline-block;
    background: none !important;
    -webkit-text-fill-color: initial !important;
    margin-bottom: 1.25rem !important;
}
.footer-logo img { height: 52px; width: auto; display: block; }

/* --- Footer sfondo blu + linea bianca separatrice --- */
.site-footer {
    background: #003a87 !important;
    border-top: 2px solid rgba(255,255,255,0.55) !important;
}
.site-footer::before { display: none !important; }
.footer-top { background: var(--brand-blue) !important; }
.footer-bottom {
    background: #00316f !important;
    border-top: 1px solid rgba(255,255,255,0.20) !important;
}

/* Icone social: visibili su sfondo blu + WhatsApp incluso */
.social-icon {
    background: rgba(255,255,255,0.14) !important;
    border: 1px solid rgba(255,255,255,0.32) !important;
    color: #fff !important;
}
.social-icon:hover {
    background: #fff !important;
    border-color: #fff !important;
    color: var(--brand-blue) !important;
    transform: translateY(-2px);
}

/* "Get in Touch" — font heading invece del mono */
.footer-col.contact-col h3 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1.3rem !important;
    text-transform: none !important;
    letter-spacing: -0.01em !important;
    font-weight: 800 !important;
}

/* Bottone invio footer: bianco/blu coerente */
.contact-submit-footer {
    background: #fff !important;
    color: var(--brand-blue) !important;
}
.contact-submit-footer:hover {
    background: var(--brand-blue) !important;
    color: #fff !important;
    box-shadow: 0 0 0 1px #fff inset;
}

/* --- Gallery: niente punto finale, sfondo blu --- */
.gallery-title::after { content: '' !important; }

/* --- Home: sezione CTA finale solo bottone --- */
.community-cta-btn-section {
    text-align: center;
    padding: 5rem 1.5rem 6rem;
}
.community-cta-btn-section .hero-btn {
    display: inline-block;
}

/* --- Home: spazio tra le 3 griglie eventi --- */
.scelti-per-te .section-title:not(:first-child) { margin-top: 3.5rem; }
.scelti-per-te .cards-grid:empty { display: none; }

/* --- Contatti: sfondo "Let's talk" blu brand --- */
.page-hero.contact-hero {
    background: linear-gradient(135deg, #004AAD 0%, #0a2e6b 100%) !important;
}

/* --- About: foto team quadrate (non rotonde) --- */
.team-avatar {
    border-radius: 18px !important;
}
.team-card:hover .team-avatar { transform: scale(1.05) !important; }

/* --- About: sezione recensioni --- */
.reviews-section { padding-top: 4.5rem; padding-bottom: 5rem; }
.reviews-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    max-width: 1100px;
    margin: 2.5rem auto 0;
}
.review-card {
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: var(--r-lg, 18px);
    padding: 1.75rem;
    margin: 0;
    backdrop-filter: blur(6px);
}
.review-card blockquote {
    margin: 0 0 1rem;
    font-size: 1.02rem;
    line-height: 1.6;
    color: #fff;
}
.review-card figcaption {
    font-family: 'JetBrains Mono', monospace;
    font-size: .8rem;
    letter-spacing: .04em;
    color: rgba(255,255,255,0.75);
}
.reviews-cta { text-align: center; margin-top: 3rem; }
@media (max-width: 600px) {
    .reviews-grid { grid-template-columns: 1fr; }
}

/* =========================================================
   CTA buttons — solo Blu o Bianco (testo Blu o Bianco)
   ========================================================= */
.hero-btn, .pulsing-btn {
    background: #ffffff !important;
    color: var(--brand-blue) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18) !important;
}
.hero-btn:hover, .pulsing-btn:hover {
    background: var(--brand-blue) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 36px rgba(0,74,173,0.32) !important;
}
.about-btn {
    background: var(--brand-blue) !important;
    color: #ffffff !important;
    border-radius: var(--r-pill) !important;
}
.about-btn:hover {
    background: #ffffff !important;
    color: var(--brand-blue) !important;
    box-shadow: 0 0 0 1px var(--brand-blue) inset !important;
}
/* su sezioni a sfondo blu il bottone resta bianco con testo blu */
.bv-bg-blue .about-btn,
.bv-bg-blue .hero-btn {
    background: #ffffff !important;
    color: var(--brand-blue) !important;
}
.bv-bg-blue .about-btn:hover,
.bv-bg-blue .hero-btn:hover {
    background: var(--brand-blue) !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 1px #ffffff inset !important;
}

/* --- Mobile polish restyling 2026 --- */
@media (max-width: 768px) {
    .footer-logo img { height: 42px; }
    .community-cta-btn-section { padding: 3.5rem 1.25rem 4.5rem; }
    .scelti-per-te .section-title:not(:first-child) { margin-top: 2.5rem; }
    .reviews-section { padding-left: 1rem; padding-right: 1rem; }
}

/* =========================================================
   ROUND 2 — ritocchi post-review
   ========================================================= */

/* 1. Home hero: il logo è già nella foto (hero-bg.jpg).
   Frase piccola + bottone posizionati in BASSO, sotto il logo della foto. */
.hero {
    min-height: 78vh !important;
    align-items: flex-end !important;
}
.hero-content {
    padding-bottom: 7vh !important;
}
.hero-content h1.hero-tagline {
    font-size: clamp(.95rem, 1.6vw, 1.15rem) !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    max-width: 640px;
    margin: 0 auto 1.75rem !important;
    opacity: .92;
}
/* foto hero più visibile (solo home, non .page-hero/.eventi-hero) */
.hero::after { opacity: .45 !important; }

/* 2. Home: titoli categoria senza trattino iniziale */
.scelti-per-te .section-title::before { content: '' !important; }

/* 4. Eventi hero: blu più chiaro */
.eventi-hero {
    background: linear-gradient(135deg, #1366c4 0%, #2f8fd6 100%) !important;
}
.eventi-hero::before { opacity: .5 !important; }
.eventi-hero::after  { opacity: .35 !important; }

/* 5. FAQ + Chi siamo hero: blu più chiaro (come Eventi) */
.page-hero.faq-hero,
.page-hero.about-hero {
    background: linear-gradient(135deg, #1366c4 0%, #2f8fd6 100%) !important;
}
.page-hero.faq-hero::before,
.page-hero.about-hero::before { opacity: .5 !important; }
.page-hero.faq-hero::after,
.page-hero.about-hero::after  { opacity: .35 !important; }

/* 5+6. Box finale FAQ/Contatti: testo bianco (bottone invariato) */
.cta-banner h3,
.cta-banner p {
    color: #fff !important;
}

/* 7. About: sezione recensioni a tutta larghezza, contenuto centrato */
.reviews-section {
    max-width: none !important;
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
.reviews-section .section-head {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

/* Mobile round 2 */
@media (max-width: 768px) {
    .hero { min-height: 70vh !important; }
    .hero-content { padding-bottom: 5vh !important; }
    .hero-content h1.hero-tagline { font-size: .98rem !important; margin-bottom: 1.4rem !important; }
}

/* =========================================================
   2026-05 round — Hero colore footer, recensioni con stelle
   ========================================================= */

/* Tutte le hero usano lo stesso blu/gradient della hero "Let's talk" (contatti) */
.page-hero,
.page-hero.faq-hero,
.page-hero.about-hero,
.eventi-hero {
    background: linear-gradient(135deg, #004AAD 0%, #0a2e6b 100%) !important;
}
.eventi-hero .eventi-hero-bg {
    background: linear-gradient(135deg, #004AAD 0%, #0a2e6b 100%) !important;
    animation: none !important;
}
/* Rimuove gli overlay (glow ciano + grain) che alteravano la tinta blu
   facendola sembrare diversa dal footer */
.page-hero::before,
.page-hero::after,
.eventi-hero::before,
.eventi-hero::after {
    background: none !important;
    mix-blend-mode: normal !important;
    content: none !important;
}

/* Sottotitoli hero leggermente più grandi */
.eventi-hero-content p {
    font-size: 1.55rem !important;
    opacity: 0.95 !important;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}
.hero-content .hero-tagline { font-size: clamp(1.05rem, 1.6vw, 1.35rem); }

/* Logo bianco centrato in home hero, sopra il tagline */
.hero {
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: center !important;
    text-align: center !important;
}
.hero-content {
    width: 100% !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}
.hero .hero-logo {
    display: block;
    margin: 0 auto 1.5rem;
    width: clamp(260px, 42vw, 520px);
    height: auto;
    filter: brightness(0) invert(1);
    position: relative;
    z-index: 3;
    opacity: .98;
    transform: translateX(70px);
}
@media (max-width: 768px) {
    .hero .hero-logo { transform: translateX(32px); }
}
.hero-content h1.hero-tagline {
    font-size: clamp(1.1rem, 1.8vw, 1.5rem) !important;
    opacity: 1 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}
.hero-content .hero-cta-row {
    justify-content: center !important;
    width: 100%;
}
@media (max-width: 768px) {
    .hero .hero-logo { width: clamp(220px, 70vw, 340px); margin-bottom: 1rem; }
    .hero-content h1.hero-tagline { font-size: 1.05rem !important; }
}

/* Stelle sotto ogni recensione */
.review-card .review-stars {
    display: block !important;
    margin-top: 1rem !important;
    color: #ffd54a !important;
    letter-spacing: 4px;
    font-size: 1.35rem !important;
    line-height: 1;
    text-shadow: 0 1px 2px rgba(0,0,0,0.25);
    opacity: 1 !important;
    visibility: visible !important;
}
.review-card .review-stars .half {
    display: inline-block;
    width: 0.55em;
    overflow: hidden;
    margin-left: -0.05em;
    color: #ffd54a;
    vertical-align: top;
}

/* Sezione recensioni: piccolo respiro prima del footer (stesso sfondo blu) */
.reviews-section { padding-bottom: 2.5rem !important; margin-bottom: 0 !important; }
.reviews-section + .site-footer { margin-top: 0 !important; }