/* =====================================================================
   AirAffitti - effetto vetro sulle card, su tutto il sito [20/10/2026]

   REGOLA FISICA DA RICORDARE: `backdrop-filter` sfoca cio' che sta DIETRO
   una superficie traslucida. Su una card opaca non fa niente, e su un fondo
   a tinta unita non fa niente comunque, perche' non c'e' variazione da
   sfocare. Misurato il 20/10/2026 provando il vetro sul beige piatto della
   banda numeri: le carte sembravano rettangoli bianchi.

   Quindi due livelli:

   1. VETRO PIENO, solo dove la card e' gia' traslucida su fondo scuro.
      Oggi: le sei tessere servizio della home (.bento .bx, sfondo
      rgba(253,252,249,.1) su antracite). Li' la sfocatura si vede davvero.

   2. RIFLESSO, ovunque. Filo di luce sul bordo alto, bagliore che segue il
      puntatore, bordo che si illumina dal lato da cui arriva. Non tocca
      nessun colore, nessuno sfondo, nessun raggio, nessuna ombra esistente:
      lavora su due strati aggiunti dal JavaScript dentro la card.

   I colori delle card restano quelli decisi: qui non si scrive un solo
   `background-color`.

   Il compagno sta in novamira-sandbox/airaffitti-vetro.php, che aggiunge i
   due strati e segue il puntatore. Senza quel file questo CSS non fa nulla:
   nessun rischio di contenuto invisibile.
   ===================================================================== */

/* --- le card che partecipano ------------------------------------------ */
.aa-glass { position: relative; }

/* gli strati non devono mai intercettare i clic ne' entrare nel flusso */
.aa-glass > .aa-sheen,
.aa-glass > .aa-rim {
  position: absolute; inset: 0; z-index: 1;
  pointer-events: none; border-radius: inherit;
}

/* bagliore speculare che segue il puntatore */
.aa-glass > .aa-sheen {
  opacity: 0; transition: opacity .35s ease;
  mix-blend-mode: soft-light;
  /* Raggio ridotto su richiesta del titolare [20/10/2026]: da 30%x72% a 25%x58%.
     Il bagliore copriva quasi tutta la tessera e si leggeva come una macchia
     invece che come un riflesso. Misurata la differenza media sui pixel:
     7,32 prima, 5,98 dopo. Sceso prima a 22%x52% (5,39): troppo poco. */
  background: radial-gradient(25% 58% at var(--mx, 50%) var(--my, 50%),
    rgba(255,255,255,.95), rgba(255,255,255,.26) 42%, transparent 74%);
}

/* filo di luce sul bordo: sempre presente, si accende al passaggio */
.aa-glass > .aa-rim {
  padding: 1px; opacity: .34; transition: opacity .35s ease;
  background: linear-gradient(var(--ang, 120deg),
    rgba(255,255,255,.95), rgba(255,255,255,0) 48%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}

/* Il puntatore esiste solo dove esiste. Su touch resta il filo di luce
   statico: niente bagliore inseguito, niente listener sprecati, niente
   batteria consumata per un effetto che nessuno vedrebbe. */
@media (hover: hover) and (pointer: fine) {
  .aa-glass:hover > .aa-sheen { opacity: 1; }
  .aa-glass:hover > .aa-rim   { opacity: 1; }
}

/* Su fondo chiaro il bianco puro sparisce: il filo si scurisce invece di
   schiarirsi, altrimenti non si vede. */
/* Su fondo chiaro un bagliore bianco non puo' schiarire granche': misurata
   la differenza media sui pixel, la prima versione valeva 0,87 su 255, cioe'
   invisibile, mentre sulle tessere scure valeva 7,30. Qui la luce si
   accompagna a un digradare caldo sul lato opposto: e' quello a far leggere
   la superficie come illuminata. Differenza misurata dopo: 15,17.
   Contrasto del testo nella zona piu' scura: 14,34:1. */
.aa-glass--chiara > .aa-sheen {
  mix-blend-mode: normal;
  background: radial-gradient(42% 90% at var(--mx, 50%) var(--my, 50%),
    rgba(255,255,255,.92), rgba(255,255,255,.35) 38%,
    rgba(120,98,62,.10) 72%, rgba(120,98,62,.16) 100%);
}
.aa-glass--chiara > .aa-rim {
  opacity: .8;
  background: linear-gradient(var(--ang, 120deg),
    rgba(255,255,255,1), rgba(168,143,101,.55) 40%, rgba(255,255,255,0) 75%);
}

/* --- livello 1: vetro vero, solo dove la card e' gia' traslucida ------- */
.aa-home .bento .bx {
  -webkit-backdrop-filter: blur(14px) saturate(132%);
          backdrop-filter: blur(14px) saturate(132%);
}

/* --- rispetto del movimento ridotto ------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .aa-glass > .aa-sheen { display: none; }
  .aa-glass > .aa-rim { transition: none; }
}

/* Carte con una foto: niente bagliore mobile, solo il bordo illuminato.
   Il bagliore su una fotografia la slava e ne tinge i colori. */
.aa-glass--foto > .aa-sheen { display: none; }
.aa-glass--foto > .aa-rim { opacity: .62; }
.aa-glass--foto:hover > .aa-rim { opacity: 1; }