:root{--primary:#1e3c72;--primary-2:#2a5298;--bg:#f8fafc;--text:#1f2937}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial;
  background:var(--bg);
  color:var(--text)
}
header{
  background:linear-gradient(90deg,var(--primary),var(--primary-2));
  color:#fff;
  text-align:center;
  padding:1.2rem 1rem;
  position:relative
}

/* Header con loghi ai lati */
.header-row{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center
}
.header-row .logo{
  height:70px;
  width:auto;
  margin:0;
  filter:drop-shadow(0 0 2px rgba(255,255,255,.95))
          drop-shadow(0 2px 6px rgba(0,0,0,.18))
}
.header-row .logo.left{justify-self:start}
.header-row .logo.right{justify-self:end}
.header-row .brand-block{text-align:center;justify-self:center}

@media (max-width:720px){
  .header-row{grid-template-columns:auto 1fr auto}
  .header-row .logo{height:56px}
}

.brand-title{
  margin:.2rem 0 .1rem;
  font-weight:800;
  letter-spacing:.3px;
  font-size:1.9rem
}
.brand-sub{
  margin:.1rem 0 .2rem;
  opacity:.9
}

/* Nav base */
nav{margin-top:.6rem}
nav a{
  color:#fff;
  text-decoration:none;
  font-weight:700;
  margin:0 .6rem;
  position:relative;
  padding:.25rem .5rem;
  border-radius:8px
}
nav a.active::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-3px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#ffd700,#fff2a6,#ffd700);
  box-shadow:0 0 6px rgba(255,215,0,.85)
}

.container{
  max-width:1100px;
  margin:0 auto;
  padding:2rem 1.2rem
}
.hero{
  background:#fff;
  border-radius:14px;
  padding:2rem;
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  border-left:6px solid var(--primary-2)
}
.section{
  background:#fff;
  border-radius:14px;
  padding:1.6rem;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  margin-top:1rem
}
.btn{
  display:inline-block;
  padding:.8rem 1.1rem;
  border-radius:10px;
  background:var(--primary-2);
  color:#fff;
  text-decoration:none;
  font-weight:700
}
.btn.whatsapp{background:#25D366}
.btn.light{background:#1e3c72}

.grid{
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  margin-top:1rem
}
.card{
  background:#fff;
  border-radius:12px;
  padding:1rem;
  box-shadow:0 4px 12px rgba(0,0,0,.06);
  border-top:4px solid var(--primary-2);
  display:flex;
  flex-direction:column
}
.card .spacer{flex:1 1 auto}
.card .cta{margin-top:auto}
.small{opacity:.85}
.badge{
  display:inline-block;
  padding:.25rem .5rem;
  border-radius:999px;
  background:#e8eefc;
  color:#213554;
  font-weight:700;
  font-size:.8rem;
  margin-left:.3rem
}
footer{
  background:var(--primary);
  color:#fff;
  text-align:center;
  padding:1rem;
  margin-top:2rem
}
.timeline{
  list-style:none;
  padding:0;
  margin:1.5rem 0;
  border-left:3px solid var(--primary)
}
.timeline li{
  margin:1rem 0;
  padding-left:1rem;
  position:relative
}
.timeline li::before{
  content:"";
  position:absolute;
  left:-10px;
  top:8px;
  width:12px;
  height:12px;
  background:var(--primary);
  border-radius:50%
}
.timeline .year{
  font-weight:800;
  color:var(--primary-2);
  margin-right:.5rem
}

/* Immagini */
.img-card{
  width:100%;
  height:auto;
  border-radius:10px;
  box-shadow:0 6px 14px rgba(0,0,0,.12);
  margin:.8rem 0;
  transition:transform .35s ease,filter .35s ease
}
.img-card:hover{
  transform:translateY(-4px) scale(1.02);
  filter:brightness(1.05)
}
.aspect-2-1{aspect-ratio:2/1;object-fit:cover}
.img-small{
  max-width:1100px;
  width:100%;
  margin:.8rem auto;
  display:block
}
.parallax{
  background-attachment:fixed;
  background-size:cover;
  background-position:center;
  border-radius:14px;
  box-shadow:0 6px 16px rgba(0,0,0,.08)
}
.fade-in{
  opacity:0;
  transform:translateY(12px);
  transition:opacity .6s ease,transform .6s ease
}
.fade-in.show{
  opacity:1;
  transform:translateY(0)
}

/* Immagini non croppate per loghi/foto strette (MT4 e Calendario) */
.img-contain{
  width:100%;
  height:160px;
  object-fit:contain;
  background:#fff;
  border-radius:10px;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
  padding:.4rem
}
@media (max-width:640px){
  .img-contain{height:140px}
}

/* v17.13 additions */
.badge.badge-gold{
  background:linear-gradient(90deg,#ffd700,#fff2a6,#ffd700);
  color:#213554;
  border:1px solid rgba(0,0,0,.1)
}
.btn.disabled{
  background:#9aa7b6;
  color:#fff;
  opacity:.85;
  cursor:not-allowed;
  pointer-events:none
}

/* v17.15 restore grid */
.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));}

/* Progetti — card più compatte, bottoni in basso senza spazio inutile */
.grid .card{
  display:flex;
  flex-direction:column;
  height:100%;
  padding-top:16px;
  padding-bottom:2px;       /* riduce il “vuoto” sotto */
}

/* Titolo allineato */
.grid .card h3{
  display:flex;
  gap:.5rem;
  align-items:flex-start;
  min-height:2.6em;         /* allinea la riga dei titoli */
  margin:0 0 .25rem 0;
}

/* Descrizione compatta (4 righe visibili) */
.grid .card p{
  line-height:1.5;
  -webkit-box-orient: vertical;
  display:-webkit-box;
  -webkit-line-clamp: 4;     /* ← se vuoi 5 righe, metti 5 */
  min-height: 10em;          /* 4 × 1.5 = 6em (per l’allineamento) */
  overflow: hidden;
  margin:0;                  /* niente margine extra sotto */
}

/* CTA sempre giù e senza margini extra */
.grid .card .cta{
  margin-top:auto;
  padding-top:8px;
}
.grid .card .cta .btn,
.grid .card .cta .btn.disabled{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  margin:0;
}

/* Se hai una scritta 'Trial' sotto al bottone, tienila vicina e senza spazio extra */
.grid .card .cta + small{
  margin-top:6px;
  display:block;
}

/* === v2 fixes: layout, overflow, CTA centering === */
html, body { overflow-x: hidden; }
.section {
  max-width: 1100px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}
.grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: stretch;
}
@media (max-width: 1000px){
  .grid { grid-template-columns: repeat(2,1fr);}
}
@media (max-width: 640px){
  .grid { grid-template-columns: 1fr;}
}
.card {
  display:flex;
  flex-direction: column;
  height:100%;
}
.card .spacer { flex: 1 1 auto; }
.card .cta {
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  margin-top:auto;
}
.card .cta .btn {
  display:inline-block;
  margin:0 auto;
  float:none;
}
.btn { float:none; } /* neutralizza eredità */

/* === v3 global fixes === */
html { scrollbar-gutter: stable both-edges; } /* evita spostamento orizzontale quando cambia la presenza della scrollbar */
body { overflow-x: hidden; }

/* ======== NAV RESPONSIVE (MODIFICA) ======== */
header nav{
  display:flex;
  flex-wrap:wrap;          /* può andare a capo su 2 righe */
  justify-content:center;
  align-items:center;
  gap:0.25rem;
  padding:0.35rem 0.5rem 0.45rem;
  text-align:center;
}

/* Link nav: più compatti su mobile, ma senza toccare colori ecc. */
header nav a{
  padding:0.3rem 0.6rem;
  font-size:0.9rem;
  white-space:normal;      /* consente andare a capo */
}

/* Su schermi più grandi, tieni i link su una sola riga */
@media (min-width: 800px){
  header nav a{
    white-space:nowrap;
    font-size:1rem;
  }
}

/* === Forms === */
.contact-form {
  background:#fff;
  border-radius:14px;
  padding:1rem;
  box-shadow:0 4px 12px rgba(0,0,0,.06);
  border-left:4px solid var(--primary-2);
}
.contact-form .form-row {
  display:flex;
  flex-direction:column;
  margin: .6rem 0;
}
.contact-form label {
  font-weight:700;
  margin-bottom:.3rem;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form textarea {
  border:1px solid rgba(0,0,0,.12);
  border-radius:10px;
  padding:.7rem .8rem;
  font: inherit;
  outline: none;
}
.contact-form input:focus,
.contact-form textarea:focus {
  border-color: var(--primary-2);
  box-shadow: 0 0 0 2px rgba(42,82,152,.12);
}
.contact-form .form-actions { margin-top: .8rem; }
.hidden { display:none !important; }

/* ==== Risorse utili — card più compatte + CTA in basso ==== */
body.resources .grid,
#resources .grid { align-items: stretch; }

/* Card: meno padding e niente altezza forzata */
body.resources .grid .card,
#resources .grid .card {
  padding: 16px 16px 10px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Titolo compatto */
body.resources .grid .card h3,
#resources .grid .card h3 {
  margin: 0 0 .25rem;
}

/* Descrizione: togli min-height e riduci a 3 righe visibili */
body.resources .grid .card p,
#resources .grid .card p {
  margin: .25rem 0 0;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 3;   /* se vuoi 2 o 4 righe, cambia qui */
  min-height: 0;           /* <-- elimina lo spazio “vuoto” */
  overflow: hidden;
}

/* CTA ancorata in basso e più compatta */
body.resources .grid .card .cta,
#resources .grid .card .cta {
  margin-top: auto;
  padding-top: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
body.resources .grid .card .cta .btn,
#resources .grid .card .cta .btn {
  min-height: 36px;
  margin: 0;
}

/* Immagini/loghi nelle card risorse */
body.resources .img-contain,
#resources .img-contain {
  height: 120px;  /* prima era 160px */
}

/* Foto profilo verticale (pagina Gabriele Valore) */
.portrait{
  max-width:420px;
  width:100%;
  margin:1.2rem auto;
  display:block;
}