/* INSEGNE BRESCIA - v66 - GALLERIA: livello aggiuntivo sopra galleria.css (v65, invariato)
   - freccetta accanto all'elenco, come nel sito attuale: indica che a sinistra ci sono le miniature
     della categoria scelta; scivola da una voce all'altra
   - numeri del portfolio nell'introduzione, comparsa morbida delle miniature */

html{ scroll-behavior:auto; } /* lo scorrimento morbido verso le categorie lo gestisce galleria-v66.js */

/* ---------- freccetta ---------- */
.g-side{ position:sticky; }
.g-arrow{
  position:absolute; left:-22px; top:0; width:16px; height:22px; z-index:2; pointer-events:none;
  transform:translate3d(0, var(--ay, 0px), 0); opacity:0;
  transition:transform .55s cubic-bezier(.16,1,.3,1), opacity .3s linear;
}
.g-arrow.is-ready{ opacity:1; }
.g-arrow::before{ /* triangolo che punta a sinistra, verso le miniature */
  content:""; position:absolute; left:0; top:50%; margin-top:-9px;
  border-style:solid; border-width:9px 12px 9px 0; border-color:transparent var(--orange) transparent transparent;
  filter:drop-shadow(0 2px 6px rgba(255,138,0,.45));
  animation:g-spinta 1.6s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes g-spinta{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(-5px); } }
.g-cats a.is-active{ font-weight:800; }

/* ---------- introduzione ---------- */
.g-stats{ display:flex; flex-wrap:wrap; gap:10px 28px; margin:22px 0 0; padding:0; list-style:none; }
.g-stats li{ display:flex; align-items:baseline; gap:8px; color:rgba(255,255,255,.75); font-size:14px; font-weight:600; }
.g-stats strong{ color:#fff; font-size:clamp(24px,2.6vw,34px); font-weight:800; line-height:1; }
.g-stats li:nth-child(2) strong{ color:var(--orange); }

/* ---------- comparsa delle miniature ---------- */
html.g-motion .g-thumb{ opacity:0; transform:translate3d(0,14px,0); }
html.g-motion .g-thumb.is-in{
  opacity:1; transform:none;
  transition:opacity .5s cubic-bezier(.16,1,.3,1) var(--d,0ms), transform .6s cubic-bezier(.16,1,.3,1) var(--d,0ms), box-shadow .32s var(--ease);
}
html.g-motion .g-thumb.is-in:hover{ transform:translateY(-3px); transition-delay:0ms; }

/* ---------- telefono: niente freccetta (l'elenco è una barra in alto), voce attiva ben evidente ---------- */
@media (max-width:900px){
  .g-arrow{ display:none; }
  .g-cats a.is-active{ border-color:var(--navy-2); }
}

/* ---------- selettore chiara / scura (chiara di default) ---------- */
.g-tema{ display:inline-flex; align-items:center; gap:2px; padding:3px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); }
.g-tema button{
  display:inline-flex; align-items:center; gap:6px; border:0; cursor:pointer; font:700 12px/1 'Montserrat', system-ui, sans-serif;
  color:rgba(255,255,255,.72); background:transparent; padding:7px 12px; border-radius:999px; transition:background-color .25s, color .25s;
}
.g-tema button svg{ width:15px; height:15px; }
.g-tema button:hover{ color:#fff; }
.g-tema button[aria-pressed="true"]{ background:#fff; color:#0b1030; }
.g-tema button:focus-visible{ outline:2px solid var(--orange); outline-offset:2px; }
.g-top .g-tema{ margin-left:auto; }
.g-top .g-back{ margin-left:0; }
@media (max-width:760px){ .g-tema button span{ display:none; } .g-tema button{ padding:7px 9px; } }

/* =========================================================
   TEMA SCURO — fondo scuro; miniature della stessa misura del tema chiaro
   ========================================================= */
html[data-g-tema="scura"] body{ background:#05070f; color:#fff; }
html[data-g-tema="scura"] .g-intro{ background:radial-gradient(900px 420px at 85% 0%, rgba(125,44,255,.28), transparent 60%), radial-gradient(700px 380px at 10% 10%, rgba(31,70,255,.3), transparent 60%), #05070f; }
html[data-g-tema="scura"] .g-side-in{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); box-shadow:none; }
html[data-g-tema="scura"] .g-side-title, html[data-g-tema="scura"] .g-cats a small{ color:rgba(255,255,255,.55); }
html[data-g-tema="scura"] .g-cats a{ color:rgba(255,255,255,.86); }
html[data-g-tema="scura"] .g-cats a:hover{ background:rgba(255,255,255,.06); }
html[data-g-tema="scura"] .g-cats a.is-active{ background:linear-gradient(90deg, rgba(31,70,255,.9), rgba(125,44,255,.9)); color:#fff; }
html[data-g-tema="scura"] .g-cat-head{ border-bottom-color:rgba(255,255,255,.1); }
html[data-g-tema="scura"] .g-cat-head span{ color:rgba(255,255,255,.55); }
/* miniature identiche per misura a quelle del tema chiaro (titolare, 2026-10-23): cambia solo il colore */
html[data-g-tema="scura"] .g-thumb{ border-color:#1a2347; background:#0b1030; box-shadow:0 10px 26px rgba(0,0,0,.45); }
html[data-g-tema="scura"] .g-thumb img{ filter:saturate(1.05) contrast(1.03); }
html[data-g-tema="scura"] .g-thumb:hover, html[data-g-tema="scura"] .g-thumb:focus-visible{ box-shadow:0 22px 50px rgba(0,0,0,.6), 0 0 0 1px rgba(255,138,0,.5); }
html[data-g-tema="scura"] .site-footer{ background:#03040a; }
@media (max-width:900px){
  html[data-g-tema="scura"] .g-side-in{ background:rgba(5,7,15,.94); border-width:0 0 1px; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
  html[data-g-tema="scura"] .g-cats a{ border-color:rgba(255,255,255,.14); }
}

@media (prefers-reduced-motion: reduce){
  .g-arrow::before{ animation:none; }
  html.g-motion .g-thumb{ opacity:1; transform:none; }
}