/* ============================================================
   FOLLIE D'ORO — TEMA STAGIONALE AUTUNNO / HALLOWEEN
   Caricato DOPO style.css: sovrascrive solo palette e decorazioni.
   Per tornare al tema standard basta rimuovere il <link> nelle pagine.
   ============================================================ */

:root {
    --ink: #241a22;           /* nero melanzana */
    --ink-soft: #5b4a4f;
    --ink-faint: #8f7b77;
    --paper: #fdf7f0;          /* crema caldo */
    --paper-alt: #f8eadb;      /* pesca chiaro */
    --surface: #ffffff;
    --line: #eedccb;
    --line-soft: #f5e8db;
    --gold: #e8772e;           /* zucca (stesso arancio delle locandine) */
    --gold-deep: #b4501a;      /* arancio bruciato, leggibile su bianco */
    --gold-light: #f6b26b;
    --gold-bg: #fdebd8;
    --ink-inverse: #fff6ec;
    --plum: #5e3270;           /* viola Halloween, solo accenti */

    --shadow-gold: 0 14px 30px rgba(232, 119, 46, 0.3);
}

body {
    background:
        radial-gradient(1200px 600px at 100% 0%, rgba(246, 178, 107, 0.10), transparent 60%),
        radial-gradient(900px 500px at 0% 40%, rgba(94, 50, 112, 0.05), transparent 60%),
        var(--paper);
}

::selection { background: var(--gold-light); color: var(--ink); }

/* --- Titoli: filetto zucca → viola --- */
h2::after {
    background: linear-gradient(90deg, var(--gold-light), var(--gold), var(--plum));
}

/* --- Header --- */
header { background: rgba(253, 247, 240, 0.88); }
header.is-scrolled { background: rgba(253, 247, 240, 0.97); }

/* --- Hero: locandina promo a tutta larghezza, senza ritagli né velature --- */
.hero.hero-promo {
    padding: 0;
    height: auto;
    display: block;
    background: #f4f3f1;
    background-attachment: scroll;
}
.hero.hero-promo::before,
.hero.hero-promo::after { display: none; }
.hero-promo-img {
    display: block;
    width: 100%;
    height: auto;
}

/* --- Promozioni: locandina verticale singola --- */
.promo-sezione {
    background: linear-gradient(180deg, var(--paper-alt), #fbe2c6);
    position: relative;
    overflow: hidden;
}
.promo-locandina-verticale {
    flex: 0 1 420px;
    max-width: 420px;
}

/* Pipistrelli decorativi che volteggiano piano nell'angolo della sezione promo */
.promo-sezione::before {
    content: "";
    position: absolute;
    top: 28px;
    right: 4%;
    width: 150px;
    height: 70px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 70'%3E%3Cg fill='%235e3270'%3E%3Cpath d='M30 20c-2 0-3 2-3.5 3.5C24 21 19.5 20 15 22c2.2 1 3.4 3 3.4 5.2-2.7-.9-6.4 0-9 2.6 4.7-.2 9 1.8 12.2 5.3.6-2.2 2.6-3.5 4.6-3.3 1.1 1.3 2.6 2.2 4.2 2.2s3.1-.9 4.2-2.2c2-.2 4 1.1 4.6 3.3 3.2-3.5 7.5-5.5 12.2-5.3-2.6-2.6-6.3-3.5-9-2.6 0-2.2 1.2-4.2 3.4-5.2-4.5-2-9-1-11.5 1.5C33 22 32 20 30 20z' opacity='.55'/%3E%3Cpath transform='translate(80 22) scale(.65)' d='M30 20c-2 0-3 2-3.5 3.5C24 21 19.5 20 15 22c2.2 1 3.4 3 3.4 5.2-2.7-.9-6.4 0-9 2.6 4.7-.2 9 1.8 12.2 5.3.6-2.2 2.6-3.5 4.6-3.3 1.1 1.3 2.6 2.2 4.2 2.2s3.1-.9 4.2-2.2c2-.2 4 1.1 4.6 3.3 3.2-3.5 7.5-5.5 12.2-5.3-2.6-2.6-6.3-3.5-9-2.6 0-2.2 1.2-4.2 3.4-5.2-4.5-2-9-1-11.5 1.5C33 22 32 20 30 20z' opacity='.35'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
    animation: pipistrelli 9s ease-in-out infinite;
    pointer-events: none;
}
@keyframes pipistrelli {
    0%, 100% { transform: translate(0, 0) rotate(-3deg); }
    50% { transform: translate(-18px, 10px) rotate(3deg); }
}
@media (max-width: 600px) {
    .promo-sezione::before { width: 100px; height: 48px; top: 14px; }
}

.promo-golden-text { color: var(--ink); }

/* --- Pulsanti principali: melanzana → zucca --- */
.promo-cta-button { background: var(--ink); }
.promo-cta-button:hover { background: var(--gold-deep); }

/* --- Sezioni: alternanza di toni caldi --- */
#news, #carta-oro, #resi-cambi, #negozi { background: var(--paper-alt); }
#chi-siamo, #klarna, #riparazioni, #quotazioni, #lavora-con-noi { background: var(--surface); }
#contatti { background: linear-gradient(180deg, var(--paper-alt), #f6dcc0); }

/* Card servizio: al passaggio compare un filetto zucca → viola */
.servizio-box::before {
    background: linear-gradient(90deg, var(--gold-light), var(--gold), var(--plum));
}

.news-box { border-left-color: var(--gold); }

/* Filtri regione / tab attivi */
.region-btn.active,
.simulatore-tab.active { background: var(--ink); border-color: var(--ink); }

/* --- Menu a scomparsa: notte di Halloween --- */
@media (max-width: 1339px) {
    header nav {
        background:
            radial-gradient(600px 400px at 50% 110%, rgba(232, 119, 46, 0.22), transparent 70%),
            rgba(36, 26, 34, 0.98);
    }
}

/* --- Footer: notte --- */
footer a { color: var(--gold-light); }

/* --- Cookie: interruttori zucca --- */
.cookie-switch input:checked + .cookie-slider { background: var(--gold); }
.cookie-btn-primary:hover { background: var(--gold-deep); }

/* Rispetta chi preferisce meno animazioni */
@media (prefers-reduced-motion: reduce) {
    .promo-sezione::before { animation: none; }
}


/* ============================================================
   LIVELLO HALLOWEEN — notte, luna, ragnatele, ragno e zucche
   ============================================================ */

/* --- Divisore dei titoli: una zucca intagliata tra due filetti --- */
h2::after {
    width: 150px;
    height: 26px;
    margin-top: 14px;
    border-radius: 0;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 26'%3E%3Cpath d='M14 6c1-3 3-4.5 5-4.5' stroke='%233e6a2c' stroke-width='2.2' fill='none' stroke-linecap='round'/%3E%3Cellipse cx='8' cy='15.5' rx='6.5' ry='9' fill='%23d9661f'/%3E%3Cellipse cx='20' cy='15.5' rx='6.5' ry='9' fill='%23d9661f'/%3E%3Cellipse cx='14' cy='15.5' rx='6.5' ry='9.5' fill='%23ef8a3c'/%3E%3Cpath d='M8.5 12.5l2.5 3h-5zM19.5 12.5l2.5 3h-5zM9 19q5 4 10 0l-1.6 1.2-1.4-1-1.5 1.2-1.5-1.2-1.4 1z' fill='%233a1d10'/%3E%3C/svg%3E") center / 28px 26px no-repeat,
        linear-gradient(90deg, transparent, var(--gold)) left center / 52px 2px no-repeat,
        linear-gradient(90deg, var(--plum), transparent) right center / 52px 2px no-repeat;
}

/* --- Header: filo arancio/viola sul bordo inferiore --- */
header::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, var(--plum), var(--gold), var(--gold-light), var(--gold), var(--plum));
    opacity: .85;
    pointer-events: none;
}

/* --- Sezioni "notte di Halloween": Promozioni, La Nostra Storia, Contatti --- */
#promozioni, #chi-siamo, #contatti {
    position: relative;
    overflow: hidden;
    color: rgba(255, 246, 236, 0.8);
    background:
        radial-gradient(700px 380px at 50% 115%, rgba(232, 119, 46, 0.22), transparent 70%),
        linear-gradient(180deg, #1c1118 0%, #2a1a2e 55%, #22141f 100%);
}
#promozioni h2, #chi-siamo h2, #contatti h2 { color: var(--ink-inverse); }
#promozioni p, #chi-siamo p, #contatti p,
#promozioni .promo-golden-text { color: rgba(255, 246, 236, 0.82); }
#promozioni a:not(.promo-cta-button), #chi-siamo a, #contatti a { color: var(--gold-light); }
#chi-siamo p:first-of-type::first-letter { color: var(--gold); }
#promozioni > .container, #chi-siamo > .container, #contatti > .container { position: relative; z-index: 2; }

/* Ragnatele negli angoli delle sezioni notturne */
#chi-siamo::before, #contatti::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: clamp(110px, 18vw, 190px);
    aspect-ratio: 1;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150'%3E%3Cpath d='M0 0L150.0 0.0 M0 0L142.7 46.4 M0 0L121.4 88.2 M0 0L88.2 121.4 M0 0L46.4 142.7 M0 0L0.0 150.0 M35.0 0.0Q29.5 4.5 30.6 10.0Q25.5 13.0 26.1 18.9Q20.2 20.2 18.9 26.1Q13.0 25.5 10.0 30.6Q4.5 29.5 0.0 35.0 M70.0 0.0Q59.1 9.0 61.2 19.9Q51.0 26.0 52.1 37.9Q40.5 40.5 37.9 52.1Q26.0 51.0 19.9 61.2Q9.0 59.1 0.0 70.0 M105.0 0.0Q88.6 13.4 91.9 29.9Q76.5 39.0 78.2 56.8Q60.7 60.7 56.8 78.2Q39.0 76.5 29.9 91.9Q13.4 88.6 0.0 105.0 M140.0 0.0Q118.1 17.9 122.5 39.8Q102.0 52.0 104.2 75.7Q81.0 81.0 75.7 104.2Q52.0 102.0 39.8 122.5Q17.9 118.1 0.0 140.0' fill='none' stroke='%23fff6ec' stroke-opacity='.22' stroke-width='1.1'/%3E%3C/svg%3E") no-repeat top left / contain;
    pointer-events: none;
    z-index: 1;
}
#chi-siamo::after {
    content: "";
    position: absolute;
    top: 0; right: 0;
    width: clamp(90px, 14vw, 150px);
    aspect-ratio: 1;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150'%3E%3Cpath d='M0 0L150.0 0.0 M0 0L142.7 46.4 M0 0L121.4 88.2 M0 0L88.2 121.4 M0 0L46.4 142.7 M0 0L0.0 150.0 M35.0 0.0Q29.5 4.5 30.6 10.0Q25.5 13.0 26.1 18.9Q20.2 20.2 18.9 26.1Q13.0 25.5 10.0 30.6Q4.5 29.5 0.0 35.0 M70.0 0.0Q59.1 9.0 61.2 19.9Q51.0 26.0 52.1 37.9Q40.5 40.5 37.9 52.1Q26.0 51.0 19.9 61.2Q9.0 59.1 0.0 70.0 M105.0 0.0Q88.6 13.4 91.9 29.9Q76.5 39.0 78.2 56.8Q60.7 60.7 56.8 78.2Q39.0 76.5 29.9 91.9Q13.4 88.6 0.0 105.0 M140.0 0.0Q118.1 17.9 122.5 39.8Q102.0 52.0 104.2 75.7Q81.0 81.0 75.7 104.2Q52.0 102.0 39.8 122.5Q17.9 118.1 0.0 140.0' fill='none' stroke='%23fff6ec' stroke-opacity='.22' stroke-width='1.1'/%3E%3C/svg%3E") no-repeat top left / contain;
    transform: scaleX(-1);
    pointer-events: none;
    z-index: 1;
}

/* Luna piena dietro ai pipistrelli, nella sezione Promozioni */
#promozioni::after {
    content: "";
    position: absolute;
    top: 18px;
    right: calc(4% + 30px);
    width: clamp(80px, 11vw, 130px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle at 38% 36%, #fff8e6 0%, #fbe3b0 45%, #f0c27a 100%);
    box-shadow: 0 0 40px 12px rgba(251, 227, 176, 0.35), 0 0 120px 40px rgba(246, 178, 107, 0.15);
    opacity: .9;
    pointer-events: none;
    z-index: 0;
}
/* Pipistrelli in silhouette davanti alla luna */
#promozioni::before {
    z-index: 1;
    filter: brightness(0.25);
    opacity: .9;
}

/* Ragno che penzola dal suo filo, a sinistra nella sezione Promozioni */
#promozioni > .container::before {
    content: "";
    position: absolute;
    left: 2%;
    top: calc(-1 * var(--space-xl));
    width: 34px;
    height: 150px;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 34'%3E%3Cg stroke='%233d2442' stroke-width='1.8' fill='none' stroke-linecap='round'%3E%3Cpath d='M14 14L5 8 2 2M14 17L3 15 0 20M15 20L6 24 4 31M16 21l-3 7-1 5'/%3E%3Cpath d='M26 14l9-6 3-6M26 17l11-2 3 5M25 20l9 4 2 7M24 21l3 7 1 5'/%3E%3C/g%3E%3Cellipse cx='20' cy='19' rx='6.5' ry='7.5' fill='%233d2442'/%3E%3Ccircle cx='20' cy='10.5' r='4.2' fill='%233d2442'/%3E%3Ccircle cx='18.4' cy='10' r='1' fill='%23f6b26b'/%3E%3Ccircle cx='21.6' cy='10' r='1' fill='%23f6b26b'/%3E%3C/svg%3E") bottom center / 34px 29px no-repeat,
        linear-gradient(rgba(255, 246, 236, 0.35), rgba(255, 246, 236, 0.35)) top center / 1px calc(100% - 22px) no-repeat;
    transform-origin: top center;
    animation: ragno 6s ease-in-out infinite;
    filter: drop-shadow(0 0 6px rgba(246, 178, 107, 0.55));
    pointer-events: none;
}
@keyframes ragno {
    0%, 100% { transform: translateY(0) rotate(0deg); height: 150px; }
    40% { height: 185px; transform: rotate(2deg); }
    70% { height: 165px; transform: rotate(-2deg); }
}
@media (max-width: 600px) {
    #promozioni > .container::before { left: 0; transform-origin: top center; }
    #promozioni::after { width: 56px; top: 12px; right: 12px; }
    .promo-sezione::before { width: 80px; height: 38px; top: 18px; right: 6px; }
}

/* Pulsante sulle sezioni notturne: zucca luminosa */
#promozioni .promo-cta-button {
    background: linear-gradient(135deg, var(--gold-light), var(--gold));
    color: #2a1406;
    box-shadow: 0 10px 30px rgba(232, 119, 46, 0.35);
}
#promozioni .promo-cta-button:hover {
    background: linear-gradient(135deg, #ffc98c, #f08a3c);
    color: #2a1406;
    box-shadow: 0 0 0 4px rgba(246, 178, 107, 0.2), 0 16px 40px rgba(232, 119, 46, 0.5);
}
#promozioni .promo-locandina-img {
    box-shadow: 0 0 0 1px rgba(246, 178, 107, 0.25), 0 24px 70px rgba(0, 0, 0, 0.55), 0 0 80px rgba(232, 119, 46, 0.18);
}

/* --- Card e componenti chiari: bagliore di zucca al passaggio --- */
.servizio-box:hover,
.bacheca-card:hover,
.simulatore-valore-box:hover {
    box-shadow: 0 18px 45px rgba(36, 26, 34, 0.14), 0 0 0 1px rgba(232, 119, 46, 0.25), 0 0 40px rgba(232, 119, 46, 0.12);
}
.store-location.store-highlight { background: var(--gold-bg); border-color: var(--gold); }

/* --- Footer: si unisce alla notte della sezione Contatti --- */
footer { background: linear-gradient(180deg, #22141f, #140c12); }

@media (prefers-reduced-motion: reduce) {
    #promozioni > .container::before { animation: none; }
}

/* Diamanti del menu color zucca e widget quotazione nei toni autunnali */
@media (min-width: 1340px) {
    header nav { border-top-color: rgba(232, 119, 46, 0.25); }
}
.quotazione-live { background: linear-gradient(135deg, #fdebd8, #fff8f0); border-color: rgba(232, 119, 46, 0.3); }