/* ============================================================
   CENTRO EGIZIANO GIGLIOLI — enhance-2026.css
   Layer "wow" 2026: aurora, spotlight, reveal a stadi, tilt,
   scroll progress, shine sui CTA, conteggi animati.
   Additivo: non ridefinisce la palette istituzionale, la estende.
   ============================================================ */

:root{
  --glow-teal: 46 139 110; /* @kind color */
  --glow-cyan: 127 196 220; /* @kind color */
  --glow-azure: 34 111 140; /* @kind color */
  --ease-2026: cubic-bezier(.22,.61,.36,1); /* @kind other */
  --ease-spring: cubic-bezier(.34,1.56,.64,1); /* @kind other */
}

/* ---------------- SCROLL PROGRESS ---------------- */
.gv-progress{
  position:fixed; top:0; left:0; height:3px; width:100%; z-index:120;
  transform:scaleX(0); transform-origin:0 50%;
  background:linear-gradient(90deg, var(--secondary), var(--cta) 55%, rgb(var(--glow-cyan)));
  box-shadow:0 0 14px rgba(var(--glow-cyan),.6);
  will-change:transform;
}

/* ---------------- AURORA (sezioni scure) ---------------- */
/* Applicata a page-hero, prefooter, factstrip, subhero, news, contact, page footer */
.page-hero, .prefooter, .factstrip, .subhero, .news, .site-footer{ isolation:isolate; position:relative; overflow:hidden; }
.page-hero::after,
.prefooter::after,
.factstrip::after,
.subhero::after,
.news::after,
.site-footer::after{
  content:""; position:absolute; inset:-30% -10% -10% -10%; z-index:0; pointer-events:none;
  background:
    radial-gradient(38% 45% at 18% 22%, rgba(var(--glow-teal),.42), transparent 62%),
    radial-gradient(42% 50% at 82% 30%, rgba(var(--glow-cyan),.30), transparent 60%),
    radial-gradient(46% 55% at 60% 88%, rgba(var(--glow-azure),.40), transparent 64%);
  filter:blur(18px) saturate(1.05);
  opacity:.9;
  animation:gvAurora 22s ease-in-out infinite alternate;
  mix-blend-mode:screen;
}
/* mantieni il contenuto sopra l'aurora */
.page-hero > *, .prefooter > *, .factstrip > *, .subhero > *,
.news > *, .site-footer > *{ position:relative; z-index:1; }
/* ...ma i cerchi decorativi restano assoluti: NON devono occupare spazio nel flusso */
.page-hero > .arc-ring, .prefooter > .arc-ring, .factstrip > .arc-ring,
.subhero > .arc-ring, .news > .arc-ring, .site-footer > .arc-ring{ position:absolute; z-index:0; }
.news::after{ inset:-40% -20%; border-radius:inherit; }

@keyframes gvAurora{
  0%   { transform:translate3d(0,0,0) rotate(0deg) scale(1); }
  50%  { transform:translate3d(3%,-2%,0) rotate(6deg) scale(1.08); }
  100% { transform:translate3d(-3%,3%,0) rotate(-5deg) scale(1.05); }
}

/* ---------------- FOTO DI SFONDO SFUMATA (fasce scure piatte) ----------------
   Riempie le fasce scure altrimenti vuote (page-hero di ogni pagina, factstrip,
   subhero, news) con una foto della struttura a bassa opacità: texture, non
   immagine letterale. L'aurora (::after) e il cerchio (.arc-ring) restano sopra. */
.page-hero::before,
.factstrip::before,
.subhero::before,
.news::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:url("../img/paesaggio-certaldo.jpg") center 30% / cover no-repeat;
  opacity:.16; mix-blend-mode:luminosity;
  -webkit-mask-image:linear-gradient(100deg, transparent 0%, #000 46%, #000 100%);
          mask-image:linear-gradient(100deg, transparent 0%, #000 46%, #000 100%);
}
.factstrip::before{ background-position:center 40%; opacity:.13;
  -webkit-mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.35) 100%);
          mask-image:linear-gradient(180deg, #000 0%, rgba(0,0,0,.35) 100%); }
.news::before{ border-radius:inherit; }

/* fasce leggermente più compatte: gli spazi vuoti erano troppo ampi */
.fact-cell{ padding:34px 30px; }
.factstrip .grid{ position:relative; }
/* page-hero interno: meno altezza, il vuoto sotto al testo era eccessivo */
.page-hero .grid{ padding:52px 0 46px; }

/* ---------------- CURSOR SPOTLIGHT (sezioni scure) ---------------- */
[data-spotlight]{ position:relative; }
[data-spotlight] .gv-spot{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0;
  transition:opacity .5s var(--ease-2026);
  background:radial-gradient(240px 240px at var(--mx,50%) var(--my,50%),
            rgba(var(--glow-cyan),.16), transparent 70%);
}
[data-spotlight]:hover .gv-spot{ opacity:1; }

/* ---------------- ARC RINGS: rotazione lenta ---------------- */
@media (prefers-reduced-motion:no-preference){
  .arc-ring{ animation:gvSpin 60s linear infinite; }
  .prefooter .arc-ring, .page-hero .arc-ring{ animation-duration:90s; }
}
@keyframes gvSpin{ to{ transform:rotate(360deg); } }

/* ---------------- HERO: entrata cinetica ---------------- */
.hero-title .gv-word{ display:inline-block; }
@media (prefers-reduced-motion:no-preference){
  .gv-kinetic .gv-word{
    opacity:0; transform:translateY(.5em) rotate(2deg); filter:blur(6px);
    animation:gvWordIn .82s var(--ease-2026) both;
    animation-delay:calc(var(--i,0) * 90ms + 120ms);
  }
}
@keyframes gvWordIn{
  to{ opacity:1; transform:none; filter:blur(0); }
}
/* shimmer sull'accento del titolo */
.hero-title em{
  background:linear-gradient(100deg, var(--secondary) 0%, var(--teal-400) 30%, var(--secondary) 55%, var(--teal-700) 80%, var(--secondary) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  animation:gvShimmer 6s linear infinite;
}
@keyframes gvShimmer{ to{ background-position:-220% 0; } }

/* hero photo: floaty */
@media (prefers-reduced-motion:no-preference){
  .hero-photo{ animation:gvFloat 7s ease-in-out infinite; }
  .hero-card{ animation:gvFloat 7s ease-in-out infinite; animation-delay:-3.5s; }
}
@keyframes gvFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }

/* ---------------- REVEAL a stadi (bambini in sequenza) ---------------- */
.gv-stagger > *{
  opacity:0; transform:translateY(22px); filter:blur(3px);
  transition:opacity .7s var(--ease-2026), transform .7s var(--ease-2026), filter .7s var(--ease-2026);
}
.gv-stagger.in > *{ opacity:1; transform:none; filter:none; }
.gv-stagger.in > *{ transition-delay:calc(var(--si,0) * 85ms); }

/* reveal singolo (upgrade del [data-reveal] esistente): aggiunge blur */
.js-reveal{ filter:blur(4px); }
.js-reveal.in{ filter:none; }

@media (prefers-reduced-motion:reduce){
  .gv-stagger > *{ opacity:1; transform:none; filter:none; }
  .gv-kinetic .gv-word{ opacity:1; transform:none; filter:none; animation:none; }
  .hero-title em{ animation:none; }
}

/* ---------------- SHINE sweep sui CTA ---------------- */
.btn.cta, .btn.white, .submit, .tb-cta, .news-form button{
  position:relative; overflow:hidden; isolation:isolate;
}
.btn.cta::after, .btn.white::after, .submit::after, .news-form button::after{
  content:""; position:absolute; top:0; left:-140%; width:60%; height:100%; z-index:1;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-18deg); transition:left .6s var(--ease-2026); pointer-events:none;
}
.btn.cta:hover::after, .btn.white:hover::after, .submit:hover::after, .news-form button:hover::after{
  left:150%;
}
.btn.cta, .btn.primary{ transition:all var(--dur) var(--ease), box-shadow .35s var(--ease); }
.btn.cta:hover{ box-shadow:0 10px 30px -6px rgba(var(--glow-azure),.55); transform:translateY(-2px); }

/* ---------------- TILT / hover 3D su card ---------------- */
.feature, .altri-cell, .post-card, .mini, .doc-row, .crow, .fact-cell{
  transition:transform .4s var(--ease-2026), box-shadow .4s var(--ease-2026), background .3s var(--ease-2026);
}
[data-tilt]{ transform-style:preserve-3d; will-change:transform; }
[data-tilt] .ic, [data-tilt] h3{ transition:transform .4s var(--ease-2026); }
[data-tilt]:hover .ic{ transform:translateZ(26px) scale(1.04); }
[data-tilt]:hover h3{ transform:translateZ(16px); }

/* icone dei "feature/altri": micro-bounce all'hover */
.feature:hover .ic, .altri-cell:hover .ic, .crow:hover .ic{ animation:gvNudge .5s var(--ease-spring); }
@keyframes gvNudge{ 0%{ transform:translateZ(0) scale(1);} 40%{ transform:scale(1.12) rotate(-4deg);} 100%{ transform:scale(1);} }

/* ---------------- STAT count-up: monospazio tabellare nitido ---------------- */
.statband .n, .hero-card .big, .rsa-stats .n{ font-variant-numeric:tabular-nums; }
.gv-count.counting{ color:var(--secondary); }

/* underline animato sui link del footer / nav drop */
.site-footer .col a{ position:relative; }
.site-footer .col a::after{
  content:""; position:absolute; left:0; bottom:2px; height:1px; width:0;
  background:rgb(var(--glow-cyan)); transition:width .32s var(--ease-2026);
}
.site-footer .col a:hover::after{ width:1.6em; }

/* header: sottolineatura animata dell'item attivo/hover */
.hd-link{ position:relative; }
.hd-link::after{
  content:""; position:absolute; left:11px; right:11px; bottom:2px; height:2px;
  background:var(--cta); border-radius:2px; transform:scaleX(0); transform-origin:left;
  transition:transform .3s var(--ease-2026);
}
.hd-item.active .hd-link::after, .hd-link:hover::after{ transform:scaleX(1); }

/* gallery: sollevamento + zoom fluido (potenzia l'esistente) */
.gallery .g-item{ transition:transform .45s var(--ease-2026), box-shadow .45s var(--ease-2026); }
.gallery .g-item:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }

/* timeline: pallino che pulsa quando entra in vista */
.tl-year{ position:relative; }

/* pill di caricamento pagina in cima (barra) già gestita da .gv-progress */

/* ---------------- BACK-TO-TOP flottante ---------------- */
.gv-top{
  position:fixed; right:24px; bottom:24px; z-index:90; width:52px; height:52px;
  border-radius:50%; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center;
  color:#fff; background:linear-gradient(140deg, var(--primary), var(--secondary));
  box-shadow:0 12px 30px -8px rgba(var(--glow-azure),.6);
  opacity:0; visibility:hidden; transform:translateY(14px) scale(.9);
  transition:all .4s var(--ease-spring);
}
.gv-top.show{ opacity:1; visibility:visible; transform:none; }
.gv-top:hover{ transform:translateY(-3px) scale(1.05); }
.gv-top i,.gv-top svg[class*="lucide"]{ width:22px; height:22px; }
@media (max-width:620px){ .gv-top{ right:16px; bottom:16px; width:46px; height:46px; } }

/* micro-interazione: le voci prose <li> scivolano dentro */
.prose ul.gv-stagger > li{ transform:translateX(-14px); }
.prose ul.gv-stagger.in > li{ transform:none; }