/* ============================================================
   Argento Genova — IMPACT layer (dark theme wow)
   Sopra styles.css. Solo override di background, glow, texture,
   per dare profondità e "cinema" al tema scuro.
   Nessuna modifica a layout, tipografia, breakpoint o JS.
   ============================================================ */

/* ---- 1. Global ambient ---------------------------------- */
/* Sfondo pagina: due sorgenti calde radiali (top-left, bottom-right)
   + una centrale scura, su base bruno-nera. Fixed = effetto parallasse. */
:root:not([data-theme="light"]) body {
  background:
    radial-gradient(ellipse 1100px 700px at 12% -8%,  rgba(201,160,99,.16), transparent 60%),
    radial-gradient(ellipse 1000px 700px at 88% 108%, rgba(201,160,99,.12), transparent 55%),
    radial-gradient(ellipse 1400px 900px at 50% 45%, rgba(84,52,16,.20),   transparent 65%),
    #050403;
  background-attachment: fixed, fixed, fixed, scroll;
}

/* Noise texture sottile per rompere le sfumature piatte.
   Fixed + soft-light: dà "grana" senza scurire il contenuto. */
:root:not([data-theme="light"]) body::before {
  content: "";
  position: fixed; inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='9' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.85 0 0 0 0 0.7 0 0 0 0 0.5 0 0 0 0.85 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.55'/></svg>");
  background-size: 240px 240px;
  opacity: .22;
  mix-blend-mode: soft-light;
}

/* Content sopra il noise */
:root:not([data-theme="light"]) body > * { position: relative; z-index: 1; }
:root:not([data-theme="light"]) .site-header { z-index: 50; }

/* ---- 2. Header: vetro più leggibile --------------------- */
:root:not([data-theme="light"]) .site-header {
  background: rgba(6, 5, 4, .68);
  backdrop-filter: blur(22px) saturate(140%);
  border-bottom: 1px solid rgba(201, 160, 99, .18);
  box-shadow: 0 20px 40px -30px rgba(0, 0, 0, .6);
}

/* ---- 3. Hero: spotlight dorato dietro il titolo --------- */
:root:not([data-theme="light"]) .hero { overflow: visible; position: relative; }
:root:not([data-theme="light"]) .hero__glow {
  width: 1100px; height: 1100px;
  top: -320px; left: -320px;
  background: radial-gradient(circle,
              rgba(201,160,99,.35) 0%,
              rgba(201,160,99,.12) 35%,
              transparent 62%);
  filter: blur(8px);
  animation: heroPulse 12s ease-in-out infinite;
}
@keyframes heroPulse {
  0%, 100% { transform: scale(1);   opacity: 1; }
  50%      { transform: scale(1.05); opacity: .85; }
}
/* Un secondo faro caldo dall'altra parte, statico */
:root:not([data-theme="light"]) .hero::after {
  content: "";
  position: absolute;
  top: -100px; right: -240px;
  width: 700px; height: 700px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(160,110,60,.14), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
:root:not([data-theme="light"]) .hero__grid { position: relative; z-index: 1; }

:root:not([data-theme="light"]) .hero__title {
  text-shadow: 0 4px 40px rgba(201, 160, 99, .12);
}

/* Card foto hero con vignettatura interna + ombra "gold" */
:root:not([data-theme="light"]) .photo--hero,
:root:not([data-theme="light"]) .quote-card {
  box-shadow:
    0 40px 80px -30px rgba(0, 0, 0, .8),
    0 0 40px rgba(201, 160, 99, .07),
    0 0 0 1px rgba(201, 160, 99, .06) inset;
}
:root:not([data-theme="light"]) .photo--hero::after,
:root:not([data-theme="light"]) .quote-card::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, transparent 45%, rgba(0,0,0,.35) 100%);
  pointer-events: none;
  border-radius: inherit;
}

/* ---- 4. Ritmo di sezione: warm/cool alternato ---------- */

/* Press strip: bruno molto scuro con luce laterale */
:root:not([data-theme="light"]) .press {
  background:
    linear-gradient(90deg, rgba(30, 20, 8, .0), rgba(30, 20, 8, .5) 50%, rgba(30, 20, 8, .0)),
    #090705;
}

/* Services: leggerissimo alone dorato in alto-sinistra */
:root:not([data-theme="light"]) .services {
  position: relative;
  isolation: isolate;
}
:root:not([data-theme="light"]) .services::before {
  content: "";
  position: absolute; top: 40px; left: -100px;
  width: 700px; height: 500px;
  background: radial-gradient(ellipse at center, rgba(201,160,99,.08), transparent 65%);
  pointer-events: none;
  z-index: -1;
}

/* Card servizio: bordo che si accende in hover */
:root:not([data-theme="light"]) .service-card {
  transition: border-color .25s ease, background .25s ease,
              box-shadow .3s ease, transform .3s ease;
}
:root:not([data-theme="light"]) .service-card:hover {
  box-shadow:
    0 30px 60px -30px rgba(0, 0, 0, .6),
    0 0 40px rgba(201, 160, 99, .1),
    0 0 0 1px rgba(201, 160, 99, .18) inset;
  transform: translateY(-2px);
}
:root:not([data-theme="light"]) .service-card--hero:hover {
  transform: translateY(-3px);
}

/* ---- 5. Pannello quotazioni: dramma + glass ------------ */
:root:not([data-theme="light"]) .quotes__panel {
  background:
    radial-gradient(ellipse 500px 400px at 100% 0%, rgba(201, 160, 99, .12), transparent 60%),
    linear-gradient(160deg, #17110a, #060403);
  border: 1px solid rgba(201, 160, 99, .28);
  box-shadow:
    0 0 0 1px rgba(201, 160, 99, .08) inset,
    0 -30px 80px -20px rgba(201, 160, 99, .06) inset;
  position: relative;
  overflow: hidden;
}
/* Riflesso lineare in alto */
:root:not([data-theme="light"]) .quotes__panel::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(247, 227, 192, .5), transparent);
  z-index: 1;
}
:root:not([data-theme="light"]) .quotes__spot {
  text-shadow: 0 4px 30px rgba(247, 227, 192, .15);
}

/* ---- 6. Story: spotlight caldo laterale ----------------- */
:root:not([data-theme="light"]) .story {
  position: relative;
  isolation: isolate;
}
:root:not([data-theme="light"]) .story::before {
  content: "";
  position: absolute; top: 0; right: -200px;
  width: 700px; height: 100%;
  background: radial-gradient(ellipse at center, rgba(201,160,99,.09), transparent 60%);
  pointer-events: none;
  z-index: -1;
}
:root:not([data-theme="light"]) .photo--tall {
  box-shadow:
    0 60px 100px -40px rgba(0, 0, 0, .7),
    0 0 60px rgba(201, 160, 99, .08),
    0 0 0 1px rgba(201, 160, 99, .1) inset;
  position: relative;
}
:root:not([data-theme="light"]) .photo--tall::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 30% 40%, transparent 40%, rgba(0,0,0,.4) 100%);
  pointer-events: none;
  border-radius: inherit;
}

/* Divisori bruno-oro sotto la matrice "chi siamo" */
:root:not([data-theme="light"]) .story__matrix {
  background: linear-gradient(135deg,
              rgba(201, 160, 99, .32),
              rgba(201, 160, 99, .12) 40%,
              rgba(201, 160, 99, .04));
}

/* ---- 7. Reviews: fondo warm-bronze ---------------------- */
:root:not([data-theme="light"]) .reviews {
  background:
    radial-gradient(ellipse 800px 500px at 50% 0%, rgba(201,160,99,.06), transparent 65%),
    linear-gradient(180deg, #0d0906, #0a0705);
}
:root:not([data-theme="light"]) .review-card {
  background: linear-gradient(160deg, #14110d, #0a0806);
  box-shadow:
    0 24px 40px -25px rgba(0, 0, 0, .7),
    0 0 0 1px rgba(201, 160, 99, .05) inset;
}
:root:not([data-theme="light"]) .review-card:hover {
  box-shadow:
    0 30px 50px -25px rgba(0, 0, 0, .8),
    0 0 30px rgba(201, 160, 99, .08),
    0 0 0 1px rgba(201, 160, 99, .18) inset;
}

/* ---- 8. FAQ: highlight quando aperta -------------------- */
:root:not([data-theme="light"]) .faq__item {
  transition: background .35s ease;
  border-radius: 4px;
  padding: 0 12px;
  margin: 0 -12px;
}
:root:not([data-theme="light"]) .faq__item[open] {
  background: linear-gradient(90deg,
              rgba(201, 160, 99, .06),
              rgba(201, 160, 99, .015) 60%,
              transparent);
}

/* ---- 9. Contatti: diagonale drammatica ----------------- */
:root:not([data-theme="light"]) .contact {
  background:
    radial-gradient(ellipse 700px 500px at 100% 0%, rgba(201,160,99,.14), transparent 55%),
    radial-gradient(ellipse 900px 600px at 0%   100%, rgba(90, 60, 20, .22),  transparent 60%),
    linear-gradient(180deg, #0a0705, #050403);
  position: relative;
  overflow: hidden;
}
:root:not([data-theme="light"]) .contact::before {
  content: "";
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(45deg,
      rgba(201, 160, 99, .02) 0 2px,
      transparent 2px 60px);
  pointer-events: none;
}
:root:not([data-theme="light"]) .contact__title {
  text-shadow: 0 4px 60px rgba(201, 160, 99, .18);
}

/* Mappa: incorniciata con bordo oro, no lift */
:root:not([data-theme="light"]) .map {
  border-color: rgba(201, 160, 99, .32);
  box-shadow: 0 0 0 1px rgba(201, 160, 99, .12) inset;
}

/* ---- 10. Footer: fade dorato in alto ------------------- */
:root:not([data-theme="light"]) .site-footer {
  background: linear-gradient(180deg, rgba(201, 160, 99, .04), transparent 60%);
  border-top: 1px solid rgba(201, 160, 99, .12);
  position: relative;
}
:root:not([data-theme="light"]) .site-footer::before {
  content: "";
  position: absolute; top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(400px, 60%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 160, 99, .5), transparent);
}

/* ---- 11. Divisori sezione: linea dorata sottile ------- */
:root:not([data-theme="light"]) .press,
:root:not([data-theme="light"]) .reviews,
:root:not([data-theme="light"]) .contact {
  position: relative;
}
:root:not([data-theme="light"]) .press::before,
:root:not([data-theme="light"]) .reviews::before {
  content: "";
  position: absolute; top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(300px, 50%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 160, 99, .35), transparent);
}

/* ---- 12. Brand icon: subtle glow ------------------------ */
:root:not([data-theme="light"]) .brand__icon {
  filter: drop-shadow(0 0 12px rgba(201, 160, 99, .35));
}

/* ============================================================
   BOOST layer — carica grafica extra
   ============================================================ */

/* ---- 14. Global: gradienti body più carichi ------------- */
:root:not([data-theme="light"]) body {
  background:
    radial-gradient(ellipse 1200px 800px at 12% -8%,  rgba(201,160,99,.26), transparent 60%),
    radial-gradient(ellipse 1100px 800px at 88% 108%, rgba(201,160,99,.20), transparent 55%),
    radial-gradient(ellipse 1400px 900px at 50% 45%, rgba(94,58,20,.30),   transparent 65%),
    radial-gradient(ellipse 800px 500px at 100% 30%, rgba(180,120,50,.14), transparent 60%),
    #050403;
}

/* ---- 15. Polvere dorata (starfield fisso) --------------- */
:root:not([data-theme="light"]) body::after {
  content: "";
  position: fixed; inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 18%, rgba(247,227,192,.55), transparent 60%),
    radial-gradient(1.1px 1.1px at 78% 34%, rgba(247,227,192,.4),  transparent 60%),
    radial-gradient(1.6px 1.6px at 44% 62%, rgba(247,227,192,.45), transparent 60%),
    radial-gradient(1.1px 1.1px at 88% 84%, rgba(247,227,192,.5),  transparent 60%),
    radial-gradient(1.1px 1.1px at 20% 92%, rgba(247,227,192,.3),  transparent 60%),
    radial-gradient(1.8px 1.8px at 62% 12%, rgba(247,227,192,.6),  transparent 60%),
    radial-gradient(1px   1px   at  8% 44%, rgba(247,227,192,.28), transparent 60%),
    radial-gradient(1.5px 1.5px at 96% 56%, rgba(247,227,192,.42), transparent 60%),
    radial-gradient(1.2px 1.2px at 34% 8%,  rgba(247,227,192,.38), transparent 60%),
    radial-gradient(1.1px 1.1px at 68% 72%, rgba(247,227,192,.32), transparent 60%),
    radial-gradient(1.3px 1.3px at 52% 34%, rgba(247,227,192,.3),  transparent 60%);
  background-size: 100% 100%;
  animation: dustShimmer 8s ease-in-out infinite alternate;
}
@keyframes dustShimmer {
  0%   { opacity: .5; }
  100% { opacity: 1;  }
}

/* ---- 16. Hero: conic slow spin dietro il titolo -------- */
:root:not([data-theme="light"]) .hero::before {
  content: "";
  position: absolute;
  top: -20%; left: 5%;
  width: 900px; height: 900px;
  border-radius: 50%;
  background: conic-gradient(from 20deg,
              transparent 0deg,
              rgba(201,160,99,.10) 60deg,
              transparent 130deg,
              rgba(201,160,99,.08) 200deg,
              transparent 270deg,
              rgba(201,160,99,.10) 330deg,
              transparent 360deg);
  filter: blur(60px);
  animation: conicSpin 80s linear infinite;
  pointer-events: none;
  z-index: 0;
}
@keyframes conicSpin {
  to { transform: rotate(360deg); }
}

/* ---- 17. Bloom multi-layer sui titoli chiave ----------- */
:root:not([data-theme="light"]) .hero__title {
  text-shadow:
    0 0 30px  rgba(247,227,192,.22),
    0 4px 40px rgba(201,160,99,.18),
    0 8px 80px rgba(201,160,99,.10);
}
:root:not([data-theme="light"]) .contact__title {
  text-shadow:
    0 0 30px  rgba(247,227,192,.22),
    0 4px 50px rgba(201,160,99,.20),
    0 8px 100px rgba(201,160,99,.12);
}
:root:not([data-theme="light"]) .quotes__spot {
  text-shadow:
    0 0 25px  rgba(247,227,192,.25),
    0 4px 35px rgba(201,160,99,.20);
}

/* ---- 18. Shimmer sweep sui pulsanti oro ---------------- */
:root:not([data-theme="light"]) .btn--gold {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
:root:not([data-theme="light"]) .btn--gold::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: -80%; width: 60%;
  background: linear-gradient(120deg,
              transparent 15%,
              rgba(255, 250, 235, .55) 50%,
              transparent 85%);
  transform: skewX(-18deg);
  animation: btnShimmer 5.5s ease-in-out infinite;
  animation-delay: 1.6s;
  pointer-events: none;
  z-index: 1;
}
@keyframes btnShimmer {
  0%, 60%  { left: -80%; }
  85%      { left: 140%; }
  100%     { left: 140%; }
}
/* Il contenuto del button deve stare sopra lo shimmer */
:root:not([data-theme="light"]) .btn--gold > * { position: relative; z-index: 2; }

/* ---- 19. Corner accents dorati (quotes + map) ---------- */
:root:not([data-theme="light"]) .quotes__panel,
:root:not([data-theme="light"]) .map {
  isolation: isolate;
}
/* Uso un pseudo separato per non collidere con altri ::after gia' presenti */
:root:not([data-theme="light"]) .quotes__panel > .quotes__head::before,
:root:not([data-theme="light"]) .map .map__pin::before {
  /* niente qui - solo hook */
}
/* Le 4 corner brackets sono realizzate con SVG data-uri per non rompere gli ::before/::after esistenti */
:root:not([data-theme="light"]) .quotes__panel {
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M0 0 H24 M0 0 V24' stroke='%23f0d6ac' stroke-width='1.5' fill='none' opacity='.55'/></svg>") top    left  no-repeat,
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M28 0 H4  M28 0 V24' stroke='%23f0d6ac' stroke-width='1.5' fill='none' opacity='.55'/></svg>") top    right no-repeat,
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M0 28 H24 M0 28 V4' stroke='%23f0d6ac' stroke-width='1.5' fill='none' opacity='.55'/></svg>") bottom left  no-repeat,
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M28 28 H4  M28 28 V4' stroke='%23f0d6ac' stroke-width='1.5' fill='none' opacity='.55'/></svg>") bottom right no-repeat,
    radial-gradient(ellipse 500px 400px at 100% 0%, rgba(201, 160, 99, .12), transparent 60%),
    linear-gradient(160deg, #17110a, #060403);
  background-origin: padding-box, padding-box, padding-box, padding-box, padding-box, padding-box;
  background-clip:   padding-box, padding-box, padding-box, padding-box, padding-box, padding-box;
}

/* ---- 20. Section rhythm accento: linea centrale spot -- */
:root:not([data-theme="light"]) .story::after {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(500px, 70%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201,160,99,.4), transparent);
  z-index: 0;
}
:root:not([data-theme="light"]) .faq {
  position: relative;
}
:root:not([data-theme="light"]) .faq::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(500px, 70%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201,160,99,.35), transparent);
}

/* ---- 21. Micro-adjustments per non peggiorare mobile --- */
@media (max-width: 900px) {
  :root:not([data-theme="light"]) .hero__glow {
    width: 700px; height: 700px;
    top: -180px; left: -180px;
  }
  :root:not([data-theme="light"]) .hero::after {
    width: 500px; height: 500px;
    top: -80px; right: -180px;
  }
  :root:not([data-theme="light"]) .hero::before {
    width: 600px; height: 600px;
  }
  :root:not([data-theme="light"]) body::before { opacity: .18; }
  :root:not([data-theme="light"]) body::after { opacity: .6; }
}

/* ---- 22b. Badge "LIVE" prima del label quotazioni ----- */
.live-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #7fd39b;
  box-shadow: 0 0 0 3px rgba(127, 211, 155, .22);
  margin-right: 10px;
  vertical-align: 1px;
  animation: liveBlink 1.6s ease-in-out infinite;
}
@keyframes liveBlink {
  0%, 100% { opacity: 1;   box-shadow: 0 0 0 3px rgba(127, 211, 155, .22); }
  50%      { opacity: .55; box-shadow: 0 0 0 6px rgba(127, 211, 155, .05); }
}

/* ============================================================
   LIGHT theme — impact layer parallelo (cream/bronzo)
   ============================================================ */

/* ---- L1. Global ambient warm cream ---------------------- */
:root[data-theme="light"] body {
  background:
    radial-gradient(ellipse 1200px 800px at 12% -8%,  rgba(201,160,99,.20), transparent 60%),
    radial-gradient(ellipse 1100px 800px at 88% 108%, rgba(160,110, 40,.16), transparent 55%),
    radial-gradient(ellipse 1400px 900px at 50% 45%, rgba(230,210,170,.32), transparent 65%),
    radial-gradient(ellipse 800px 500px at 100% 30%, rgba(180,140, 70,.14), transparent 60%),
    #fbf5e8;
  background-attachment: fixed, fixed, fixed, fixed, scroll;
}

/* Noise finissimo per rompere il piatto del cream */
:root[data-theme="light"] body::before {
  content: "";
  position: fixed; inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='11' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.4 0 0 0 0 0.3 0 0 0 0 0.15 0 0 0 0.5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.4'/></svg>");
  background-size: 240px 240px;
  opacity: .10;
  mix-blend-mode: multiply;
}

/* Content sopra il noise */
:root[data-theme="light"] body > * { position: relative; z-index: 1; }
:root[data-theme="light"] .site-header { z-index: 50; }

/* ---- L2. Header cream vetro ---------------------------- */
:root[data-theme="light"] .site-header {
  background: rgba(251, 245, 232, .72);
  backdrop-filter: blur(22px) saturate(140%);
  border-bottom: 1px solid rgba(166, 125, 56, .22);
  box-shadow: 0 20px 40px -30px rgba(120, 90, 40, .18);
}

/* ---- L3. Hero: aureola bronzo dietro titolo ------------ */
:root[data-theme="light"] .hero { overflow: visible; position: relative; }
:root[data-theme="light"] .hero__glow {
  width: 1100px; height: 1100px;
  top: -320px; left: -320px;
  background: radial-gradient(circle,
              rgba(201,160,99,.32) 0%,
              rgba(201,160,99,.12) 35%,
              transparent 62%);
  filter: blur(8px);
  animation: heroPulse 12s ease-in-out infinite;
}
:root[data-theme="light"] .hero::after {
  content: "";
  position: absolute;
  top: -100px; right: -240px;
  width: 700px; height: 700px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(180,120,50,.18), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
:root[data-theme="light"] .hero::before {
  content: "";
  position: absolute;
  top: -20%; left: 5%;
  width: 900px; height: 900px;
  border-radius: 50%;
  background: conic-gradient(from 20deg,
              transparent 0deg,
              rgba(201,160,99,.10) 60deg,
              transparent 130deg,
              rgba(180,120, 40,.10) 200deg,
              transparent 270deg,
              rgba(201,160,99,.10) 330deg,
              transparent 360deg);
  filter: blur(60px);
  animation: conicSpin 80s linear infinite;
  pointer-events: none;
  z-index: 0;
}
:root[data-theme="light"] .hero__grid { position: relative; z-index: 1; }

:root[data-theme="light"] .hero__title {
  text-shadow:
    0 0 30px  rgba(201,160,99,.18),
    0 4px 40px rgba(166,125, 56,.15),
    0 8px 80px rgba(120, 90, 40,.10);
}

/* Foto e mini-card con ombra warm profonda */
:root[data-theme="light"] .photo--hero,
:root[data-theme="light"] .quote-card {
  box-shadow:
    0 40px 80px -30px rgba(90, 60, 20, .35),
    0 0 40px rgba(201, 160, 99, .08),
    0 0 0 1px rgba(166, 125, 56, .12) inset;
}
:root[data-theme="light"] .photo--hero::after,
:root[data-theme="light"] .quote-card::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, transparent 45%, rgba(20,10,0,.28) 100%);
  pointer-events: none;
  border-radius: inherit;
}

/* ---- L4. Press strip: beige leggermente warm ---------- */
:root[data-theme="light"] .press {
  background:
    linear-gradient(90deg, transparent, rgba(240, 225, 195, .5) 50%, transparent),
    #f4ebd5;
}

/* ---- L5. Services: alone cream top-sx ------------------ */
:root[data-theme="light"] .services { position: relative; isolation: isolate; }
:root[data-theme="light"] .services::before {
  content: "";
  position: absolute; top: 40px; left: -100px;
  width: 700px; height: 500px;
  background: radial-gradient(ellipse at center, rgba(201,160,99,.10), transparent 65%);
  pointer-events: none;
  z-index: -1;
}

:root[data-theme="light"] .service-card {
  transition: border-color .25s ease, background .25s ease,
              box-shadow .3s ease, transform .3s ease;
}
:root[data-theme="light"] .service-card:hover {
  box-shadow:
    0 30px 60px -30px rgba(120, 90, 40, .35),
    0 0 30px rgba(201, 160, 99, .12),
    0 0 0 1px rgba(166, 125, 56, .28) inset;
  transform: translateY(-2px);
}

/* ---- L6. Pannello quotazioni: champagne + corner ----- */
:root[data-theme="light"] .quotes__panel {
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M0 0 H24 M0 0 V24' stroke='%23a67d38' stroke-width='1.5' fill='none' opacity='.55'/></svg>") top    left  no-repeat,
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M28 0 H4  M28 0 V24' stroke='%23a67d38' stroke-width='1.5' fill='none' opacity='.55'/></svg>") top    right no-repeat,
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M0 28 H24 M0 28 V4' stroke='%23a67d38' stroke-width='1.5' fill='none' opacity='.55'/></svg>") bottom left  no-repeat,
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28'><path d='M28 28 H4  M28 28 V4' stroke='%23a67d38' stroke-width='1.5' fill='none' opacity='.55'/></svg>") bottom right no-repeat,
    radial-gradient(ellipse 500px 400px at 100% 0%, rgba(201, 160, 99, .18), transparent 60%),
    linear-gradient(160deg, #ffffff, #f2e7ce);
  border: 1px solid rgba(166, 125, 56, .32);
  box-shadow:
    0 0 0 1px rgba(255, 250, 240, .5) inset,
    0 -30px 80px -20px rgba(201, 160, 99, .10) inset;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
:root[data-theme="light"] .quotes__panel::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 160, 99, .6), transparent);
  z-index: 1;
}
:root[data-theme="light"] .quotes__spot {
  text-shadow:
    0 0 25px  rgba(166,125, 56,.18),
    0 4px 35px rgba(120, 90, 40,.14);
}

/* ---- L7. Story: warm spotlight + foto con glow --------- */
:root[data-theme="light"] .story {
  position: relative;
  isolation: isolate;
}
:root[data-theme="light"] .story::before {
  content: "";
  position: absolute; top: 0; right: -200px;
  width: 700px; height: 100%;
  background: radial-gradient(ellipse at center, rgba(201,160,99,.14), transparent 60%);
  pointer-events: none;
  z-index: -1;
}
:root[data-theme="light"] .photo--tall {
  box-shadow:
    0 60px 100px -40px rgba(120, 90, 40, .32),
    0 0 60px rgba(201, 160, 99, .10),
    0 0 0 1px rgba(166, 125, 56, .18) inset;
  position: relative;
}
:root[data-theme="light"] .photo--tall::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 30% 40%, transparent 40%, rgba(20,10,0,.3) 100%);
  pointer-events: none;
  border-radius: inherit;
}
:root[data-theme="light"] .story::after {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(500px, 70%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(166,125,56,.5), transparent);
}

/* Matrix: bordi visibili con più contrasto */
:root[data-theme="light"] .story__matrix {
  background: linear-gradient(135deg,
              rgba(166, 125, 56, .38),
              rgba(166, 125, 56, .18) 40%,
              rgba(166, 125, 56, .08));
}

/* ---- L8. Reviews: cream più caldo + card lift --------- */
:root[data-theme="light"] .reviews {
  background:
    radial-gradient(ellipse 800px 500px at 50% 0%, rgba(201,160,99,.10), transparent 65%),
    linear-gradient(180deg, #f4ebd5, #f0e5c8);
}
:root[data-theme="light"] .review-card {
  background: linear-gradient(160deg, #ffffff, #f7efd8);
  box-shadow:
    0 24px 40px -25px rgba(120, 90, 40, .30),
    0 0 0 1px rgba(166, 125, 56, .10) inset;
}
:root[data-theme="light"] .review-card:hover {
  box-shadow:
    0 30px 50px -25px rgba(120, 90, 40, .40),
    0 0 30px rgba(201, 160, 99, .10),
    0 0 0 1px rgba(166, 125, 56, .32) inset;
}

/* ---- L9. FAQ: highlight cream quando aperta ---------- */
:root[data-theme="light"] .faq__item {
  transition: background .35s ease;
  border-radius: 4px;
  padding: 0 12px;
  margin: 0 -12px;
}
:root[data-theme="light"] .faq__item[open] {
  background: linear-gradient(90deg,
              rgba(201, 160, 99, .10),
              rgba(201, 160, 99, .02) 60%,
              transparent);
}
:root[data-theme="light"] .faq {
  position: relative;
}
:root[data-theme="light"] .faq::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(500px, 70%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(166,125,56,.4), transparent);
}

/* ---- L10. Contact: diagonale cream drammatica ---------- */
:root[data-theme="light"] .contact {
  background:
    radial-gradient(ellipse 700px 500px at 100% 0%,  rgba(201,160,99,.20), transparent 55%),
    radial-gradient(ellipse 900px 600px at 0%   100%, rgba(160,120, 60,.20), transparent 60%),
    linear-gradient(180deg, #f4ebd5, #fbf5e8);
  position: relative;
  overflow: hidden;
}
:root[data-theme="light"] .contact::before {
  content: "";
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(45deg,
      rgba(166, 125, 56, .03) 0 2px,
      transparent 2px 60px);
  pointer-events: none;
}
:root[data-theme="light"] .contact__title {
  text-shadow:
    0 0 30px  rgba(166,125, 56,.20),
    0 4px 50px rgba(120, 90, 40,.16),
    0 8px 100px rgba(120, 90, 40,.10);
}

/* Mappa: cornice bronzo, integrata (no lift) */
:root[data-theme="light"] .map {
  border-color: rgba(166, 125, 56, .40);
  box-shadow: 0 0 0 1px rgba(166, 125, 56, .18) inset;
}

/* ---- L11. Footer: fade warm + divisore ---------------- */
:root[data-theme="light"] .site-footer {
  background: linear-gradient(180deg, rgba(201, 160, 99, .08), transparent 60%);
  border-top: 1px solid rgba(166, 125, 56, .18);
  position: relative;
}
:root[data-theme="light"] .site-footer::before {
  content: "";
  position: absolute; top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(400px, 60%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(166, 125, 56, .5), transparent);
}

/* ---- L12. Divisori sezione (linea bronzo) ------------- */
:root[data-theme="light"] .press::before,
:root[data-theme="light"] .reviews::before {
  content: "";
  position: absolute; top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(300px, 50%); height: 1px;
  background: linear-gradient(90deg, transparent, rgba(166, 125, 56, .45), transparent);
}
:root[data-theme="light"] .press,
:root[data-theme="light"] .reviews {
  position: relative;
}

/* ---- L13. Brand icon: warm drop-shadow --------------- */
:root[data-theme="light"] .brand__icon {
  filter: drop-shadow(0 2px 6px rgba(166, 125, 56, .30));
}

/* ---- L14. Shimmer sui pulsanti oro (light) ------------ */
:root[data-theme="light"] .btn--gold {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
:root[data-theme="light"] .btn--gold::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: -80%; width: 60%;
  background: linear-gradient(120deg,
              transparent 15%,
              rgba(255, 255, 255, .55) 50%,
              transparent 85%);
  transform: skewX(-18deg);
  animation: btnShimmer 5.5s ease-in-out infinite;
  animation-delay: 1.6s;
  pointer-events: none;
  z-index: 1;
}
:root[data-theme="light"] .btn--gold > * { position: relative; z-index: 2; }

/* ---- L15. Mobile adjust (light) ----------------------- */
@media (max-width: 900px) {
  :root[data-theme="light"] .hero__glow {
    width: 700px; height: 700px;
    top: -180px; left: -180px;
  }
  :root[data-theme="light"] .hero::after {
    width: 500px; height: 500px;
    top: -80px; right: -180px;
  }
  :root[data-theme="light"] .hero::before {
    width: 600px; height: 600px;
  }
  :root[data-theme="light"] body::before { opacity: .06; }
}

/* ---- L16. Reduced-motion (light) ---------------------- */
@media (prefers-reduced-motion: reduce) {
  :root[data-theme="light"] .hero__glow,
  :root[data-theme="light"] .hero::before,
  :root[data-theme="light"] .btn--gold::after {
    animation: none !important;
  }
}

/* ---- 23. Rispetta chi ha reduced-motion --------------- */
@media (prefers-reduced-motion: reduce) {
  :root:not([data-theme="light"]) .hero__glow,
  :root:not([data-theme="light"]) .hero::before,
  :root:not([data-theme="light"]) body::after,
  :root:not([data-theme="light"]) .btn--gold::after,
  .live-dot {
    animation: none !important;
  }
}