/* ============================================================
   Landing "Gestione strutture Bergamo"
   Si appoggia a style.css: font, colori, hero, manifesto,
   compare, stats, pillars, closer, banner cookie e .btn
   arrivano tutti da li'. Qui solo i blocchi che altrove
   non esistono: barra ridotta, striscia prova, passi,
   modulo, FAQ, footer ridotto, pagina di ringraziamento.
   ============================================================ */

/* La landing carica main.js, quindi il cursore personalizzato c'e'.
   Restano fuori solo i campi di testo, dove serve il caret di sistema. */
@media (hover:hover) and (pointer:fine){
  .campo input,.campo select,.campo textarea{cursor:text;}
}

/* ---------- barra superiore ridotta (nessun menu: meno vie di fuga) ---------- */
.barra{
  border-bottom:1px solid var(--line);
  background:rgba(10,11,12,.92);
  position:sticky;top:0;z-index:60;backdrop-filter:blur(8px);
}
.barra .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;}
.barra img{height:54px;width:auto;display:block;}
.barra .torna{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mist-dim);text-decoration:none;white-space:nowrap;
}
.barra .torna:hover{color:var(--amber2);}

/* L'hero del sito e' alto 92vh: qui il pulsante deve restare
   sopra la piega anche a 375 px, quindi comprimo le spaziature. */
.hero{min-height:auto;}
.hero-inner{padding:32px 0 44px;}
@media (max-width:760px){.hero-inner{padding:44px 0 48px;}}
.hero-copy .lede{margin-bottom:32px;}

/* ---------- striscia prova ---------- */
.prova{border-bottom:1px solid var(--line);background:var(--stone);padding:20px 0;}
.prova .wrap{
  display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mist-dim);
}
.prova strong{color:var(--amber2);font-weight:400;}
.prova .sep{color:var(--line-strong);}

/* ---------- come si comincia ---------- */
.passi{display:grid;gap:36px;margin-top:48px;counter-reset:passo;}
.passo{position:relative;padding-left:62px;}
.passo::before{
  counter-increment:passo;content:counter(passo);
  position:absolute;left:0;top:-2px;width:42px;height:42px;
  border:1px solid var(--amber);border-radius:50%;
  display:grid;place-items:center;color:var(--amber);
  font-family:var(--display);font-size:.95rem;
}
.passo h3{font-size:.95rem;margin-bottom:10px;}
.passo p{font-size:.95rem;color:var(--mist-dim);line-height:1.65;}
@media (min-width:760px){.passi{grid-template-columns:repeat(3,1fr);}}

/* ---------- modulo ---------- */
.blocco-modulo{border:1px solid var(--line-strong);background:var(--void);padding:44px 40px;margin-top:44px;}
@media (max-width:760px){.blocco-modulo{padding:30px 22px;}}
.campi{display:grid;gap:26px;}
@media (min-width:760px){.campi{grid-template-columns:1fr 1fr;}.campo.intero{grid-column:1/-1;}}
.campo{display:flex;flex-direction:column;gap:9px;min-width:0;}
.campo label{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mist-dim);
}
.campo .obb{color:var(--amber);}
.campo input,.campo select{
  width:100%;min-width:0;background:transparent;border:none;
  border-bottom:1px solid var(--line-strong);
  color:var(--white);font-family:var(--sans);font-size:1.05rem;
  padding:10px 2px;min-height:46px;
}
.campo select{
  appearance:none;-webkit-appearance:none;border-radius:0;
  background-image:linear-gradient(45deg,transparent 50%,var(--amber) 50%),
                   linear-gradient(135deg,var(--amber) 50%,transparent 50%);
  background-position:calc(100% - 14px) 50%,calc(100% - 8px) 50%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:28px;
}
.campo select option{background:var(--stone);color:var(--white);}
.campo input:focus,.campo select:focus{outline:none;border-bottom-color:var(--amber);}

.privacy{
  display:flex;gap:14px;align-items:flex-start;
  font-family:var(--sans);font-size:.88rem;letter-spacing:0;
  text-transform:none;color:var(--mist-dim);line-height:1.55;
}
.privacy input{width:20px;height:20px;min-width:20px;margin-top:2px;accent-color:var(--amber);border:none;}
.privacy a{color:var(--amber2);}
.azioni{margin-top:30px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;}
.nota-modulo{margin-top:18px;font-size:.8rem;color:var(--mist-dim);}
.lead-esito{margin-top:16px;font-family:var(--mono);font-size:.78rem;min-height:1.2em;color:var(--amber2);}
.campo.verifica{max-width:320px;}
.esca{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* ---------- faq ---------- */
.faq{margin-top:48px;border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
  cursor:pointer;padding:22px 40px 22px 0;position:relative;list-style:none;
  font-family:var(--mono);font-size:.8rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--white);
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  color:var(--amber);font-size:1.4rem;line-height:1;font-family:var(--sans);
}
.faq details[open] summary::after{content:"–";}
.faq details p{padding:0 0 24px;font-size:.98rem;color:var(--mist-dim);max-width:70ch;line-height:1.7;}

/* ---------- footer ridotto ---------- */
.piede{border-top:1px solid var(--line);padding:32px 0;}
.piede .wrap{
  display:flex;flex-wrap:wrap;gap:12px 26px;justify-content:space-between;
  font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mist-dim);
}
.piede a{color:var(--mist-dim);text-decoration:underline;}
.piede a:hover{color:var(--amber2);}

/* ---------- pagina di ringraziamento ---------- */
.grazie{min-height:64vh;display:grid;place-items:center;text-align:center;padding:100px 0;}
.grazie .eyebrow{justify-content:center;}
/* :not(.eyebrow) o l'occhiello perde l'ambra ereditata da style.css */
.grazie p:not(.eyebrow){margin-top:20px;color:var(--mist-dim);max-width:48ch;line-height:1.7;}
.grazie p a{color:var(--amber2);}

/* ---------- sezioni con fotografia di sfondo ----------
   La foto va sotto una velatura scura: il testo deve restare
   leggibile (contrasto AA) anche sulle zone chiare dello scatto. */
.con-foto{position:relative;isolation:isolate;}
.con-foto::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background-image:var(--foto);background-size:cover;background-position:center;
}
.con-foto::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(90% 70% at 20% 20%,rgba(226,144,63,.10),transparent 60%),
    linear-gradient(180deg,rgba(10,11,12,.95) 0%,rgba(10,11,12,.86) 45%,rgba(10,11,12,.96) 100%);
}
.con-foto.su-pietra::after{
  background:
    radial-gradient(90% 70% at 80% 15%,rgba(226,144,63,.10),transparent 60%),
    linear-gradient(180deg,rgba(20,22,24,.95) 0%,rgba(20,22,24,.88) 45%,rgba(20,22,24,.96) 100%);
}

/* ---------- caso studio ---------- */
.caso{display:grid;gap:40px;margin-top:48px;align-items:start;}
@media (min-width:900px){.caso{grid-template-columns:1fr 1fr;gap:60px;}}

.caso-foto{display:grid;gap:14px;grid-template-columns:1fr;}
.caso-foto img{width:100%;height:auto;border:1px solid var(--line);display:block;}
.caso-foto .dettaglio{display:none;}
@media (min-width:560px){
  .caso-foto{grid-template-columns:2fr 1fr;align-items:start;}
  .caso-foto .principale{grid-column:1/-1;}
  .caso-foto .dettaglio{display:block;}
}

.caso-testo .lede{max-width:none;}
.caso-numeri{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:var(--line);border:1px solid var(--line);margin-top:32px;
}
.caso-numeri > div{background:var(--void);padding:26px 22px;min-width:0;}
.on-stone .caso-numeri > div{background:var(--stone);}
.caso-numeri strong{
  display:block;font-family:var(--display);font-weight:900;
  font-size:1.7rem;color:var(--amber2);line-height:1.1;
}
.caso-numeri span{
  display:block;margin-top:8px;font-family:var(--mono);font-size:.64rem;
  letter-spacing:.08em;text-transform:uppercase;color:var(--mist-dim);line-height:1.5;
}
.caso-nota{
  margin-top:22px;font-size:.82rem;color:var(--mist-dim);
  border-left:2px solid var(--line-strong);padding-left:16px;line-height:1.6;
}