/* ============ Tata dei Sogni — stile ============ */
:root {
  --verde: #1E5F58;
  --verde-scuro: #14443F;
  --verde-chiaro: #E7F0EE;
  --crema: #FAF7F2;
  --bianco: #FFFFFF;
  --inchiostro: #26302E;
  --grigio: #66736F;
  --grigio-chiaro: #A3ADA9;
  --linea: #E4E1DA;
  --oro: #C2913B;
  --oro-chiaro: #F7EEDC;
  --rosso: #A03B32;
  --rosso-chiaro: #F6E5E2;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--inchiostro);
  background: var(--crema);
  line-height: 1.6;
  font-size: 16px;
}
h1, h2, h3, .logo { font-family: Charter, Georgia, "Times New Roman", serif; }
h1 { font-size: clamp(1.9rem, 4.5vw, 2.7rem); line-height: 1.15; }
h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); line-height: 1.25; margin-bottom: .75rem; }
h3 { font-size: 1.15rem; margin-bottom: .4rem; }
p { margin-bottom: .9rem; }
a { color: var(--verde); }
img { max-width: 100%; }
.container { max-width: 1080px; margin: 0 auto; padding: 0 1.25rem; }

/* ---- Topbar ---- */
.topbar { background: var(--bianco); border-bottom: 1px solid var(--linea); position: sticky; top: 0; z-index: 50; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: .8rem; padding-bottom: .8rem; flex-wrap: wrap; }
.logo { font-weight: 700; font-size: 1.3rem; color: var(--verde-scuro); text-decoration: none; }
.nav { display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; }
.nav a { text-decoration: none; color: var(--inchiostro); font-size: .95rem; }
.nav a:hover { color: var(--verde); }
.nav-cta {
  background: var(--verde); color: var(--bianco) !important; padding: .5rem 1rem;
  border-radius: 999px; font-weight: 600;
}
.nav-cta:hover { background: var(--verde-scuro); }
.badge {
  background: var(--oro); color: var(--bianco); border-radius: 999px;
  font-size: .75rem; padding: 0 .45rem; margin-left: .2rem;
}

/* ---- Hero ---- */
.hero { background: var(--bianco); border-bottom: 1px solid var(--linea); }
.hero-inner { padding: 4rem 1.25rem 3.5rem; max-width: 780px; margin: 0 auto; text-align: center; }
.hero .occhiello {
  text-transform: uppercase; letter-spacing: .12em; font-size: .75rem;
  color: var(--oro); font-weight: 700; margin-bottom: 1rem;
}
.hero p.sottotitolo { font-size: 1.15rem; color: var(--grigio); max-width: 56ch; margin: 1rem auto 1.8rem; }
.bottoni { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; }
.btn {
  display: inline-block; padding: .8rem 1.6rem; border-radius: 999px; text-decoration: none;
  font-weight: 600; font-size: 1rem; border: none; cursor: pointer; font-family: inherit;
}
.btn-primario { background: var(--verde); color: var(--bianco); }
.btn-primario:hover { background: var(--verde-scuro); }
.btn-secondario { background: var(--bianco); color: var(--verde); border: 1.5px solid var(--verde); }
.btn-secondario:hover { background: var(--verde-chiaro); }
.btn-piccolo { padding: .45rem 1rem; font-size: .9rem; }

/* ---- Sezioni ---- */
.sezione { padding: 3.2rem 0; }
.sezione-alt { background: var(--bianco); border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.sezione-titolo { text-align: center; max-width: 620px; margin: 0 auto 2.2rem; }
.sezione-titolo p { color: var(--grigio); }

.passi { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1.2rem; }
.passo { background: var(--bianco); border: 1px solid var(--linea); border-radius: 12px; padding: 1.4rem; }
.sezione-alt .passo { background: var(--crema); }
.passo .numero {
  width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--verde-chiaro);
  color: var(--verde-scuro); font-weight: 700; display: flex; align-items: center;
  justify-content: center; margin-bottom: .8rem; font-family: Charter, Georgia, serif;
}
.passo p { color: var(--grigio); font-size: .95rem; margin: 0; }

/* ---- Card profili ---- */
.griglia-profili { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; }
.card-profilo {
  background: var(--bianco); border: 1px solid var(--linea); border-radius: 12px;
  padding: 1.3rem; display: flex; flex-direction: column; gap: .6rem;
}
.card-testa { display: flex; align-items: center; gap: .9rem; }
.avatar {
  width: 52px; height: 52px; border-radius: 50%; background: var(--verde-chiaro);
  color: var(--verde-scuro); display: flex; align-items: center; justify-content: center;
  font-family: Charter, Georgia, serif; font-weight: 700; font-size: 1.3rem; flex-shrink: 0;
}
.card-nome { font-weight: 700; font-size: 1.1rem; font-family: Charter, Georgia, serif; }
.card-sotto { color: var(--grigio); font-size: .87rem; }
.stelle { color: var(--oro); font-size: .95rem; letter-spacing: .05em; }
.stelle b { color: var(--inchiostro); font-weight: 600; margin-left: .2rem; }
.stelle-vuote { color: var(--grigio-chiaro); font-size: .85rem; letter-spacing: 0; }
.n-recensioni { color: var(--grigio); font-size: .82rem; }
.chip {
  display: inline-block; background: var(--crema); border: 1px solid var(--linea);
  border-radius: 999px; padding: .1rem .6rem; font-size: .78rem; color: var(--grigio);
  margin: 0 .25rem .3rem 0;
}
.badge-verifica {
  display: inline-flex; align-items: center; gap: .3rem; font-size: .78rem; font-weight: 600;
  color: var(--verde-scuro); background: var(--verde-chiaro); border-radius: 999px;
  padding: .15rem .6rem; margin-right: .3rem;
}
.badge-oro { color: #7A5A1E; background: var(--oro-chiaro); }
.card-descr { color: var(--grigio); font-size: .92rem; flex-grow: 1; }
.card-azioni { display: flex; gap: .6rem; margin-top: .4rem; flex-wrap: wrap; }

/* ---- Filtri ---- */
.filtri {
  display: flex; gap: .8rem; flex-wrap: wrap; align-items: flex-end;
  background: var(--bianco); border: 1px solid var(--linea); border-radius: 12px;
  padding: 1rem 1.2rem; margin-bottom: 1.6rem;
}
.filtri .campo { margin: 0; flex: 1 1 160px; }
.filtri label { font-size: .8rem; }

/* ---- Form ---- */
form.modulo { max-width: 640px; }
.campo { margin-bottom: 1.1rem; }
.campo label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .3rem; }
.campo .aiuto { font-size: .8rem; color: var(--grigio); margin-top: .25rem; }
input[type=text], input[type=tel], input[type=email], input[type=number], input[type=date], select, textarea {
  width: 100%; padding: .65rem .8rem; border: 1px solid var(--linea); border-radius: 8px;
  font-family: inherit; font-size: .95rem; background: var(--bianco); color: var(--inchiostro);
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--verde); outline-offset: 1px; border-color: var(--verde); }
textarea { min-height: 110px; resize: vertical; }
.campi-riga { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 560px) { .campi-riga { grid-template-columns: 1fr; } }
fieldset { border: none; margin-bottom: 1.1rem; }
.opzioni { display: flex; gap: 1rem; flex-wrap: wrap; }
.opzioni label { font-weight: 400; display: flex; align-items: center; gap: .35rem; font-size: .95rem; }

/* ---- Flash ---- */
.flash { max-width: 1080px; margin: 1rem auto 0; padding: .8rem 1.2rem; border-radius: 8px; font-size: .95rem; }
.flash-ok { background: var(--verde-chiaro); color: var(--verde-scuro); border: 1px solid #BFD8D3; }
.flash-errore { background: var(--rosso-chiaro); color: var(--rosso); border: 1px solid #E5C4BF; }

/* ---- Selezione riepilogo ---- */
.selezione-lista { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.5rem; }
.selezione-riga {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  background: var(--bianco); border: 1px solid var(--linea); border-radius: 10px; padding: .7rem 1rem;
}
.selezione-riga .mini { display: flex; align-items: center; gap: .7rem; }
.selezione-riga .avatar { width: 40px; height: 40px; font-size: 1rem; }
.link-rimuovi { color: var(--rosso); font-size: .85rem; }

/* ---- Profilo dettaglio ---- */
.profilo-testa { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.profilo-testa .avatar { width: 76px; height: 76px; font-size: 1.9rem; }
.recensione {
  background: var(--bianco); border: 1px solid var(--linea); border-radius: 10px;
  padding: 1rem 1.2rem; margin-bottom: .8rem;
}
.recensione .firma { color: var(--grigio); font-size: .83rem; margin-top: .4rem; }
.recensione .verificata { color: var(--verde-scuro); font-size: .78rem; font-weight: 600; }
.nota-riservatezza {
  background: var(--oro-chiaro); border: 1px solid #E8D9B8; border-radius: 10px;
  padding: .9rem 1.1rem; font-size: .88rem; color: #6B5320; margin: 1.2rem 0;
}

/* ---- Footer ---- */
.footer { background: var(--verde-scuro); color: #D8E4E1; margin-top: 3rem; }
.footer a { color: #FFFFFF; }
.footer-inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 2rem; padding: 2.5rem 1.25rem; }
@media (max-width: 640px) { .footer-inner { grid-template-columns: 1fr; } }
.logo-footer { color: #FFFFFF; margin-bottom: .4rem; }
.footer-contatti { font-size: .9rem; }
.footer-note { font-size: .82rem; color: #A9C0BB; }
.footer-note p { margin-bottom: .6rem; }

/* ---- Admin ---- */
.admin body, body.admin { background: #F2F3F2; }
.admin-topbar { background: var(--verde-scuro); color: #fff; }
.admin-topbar .topbar-inner { padding-top: .7rem; padding-bottom: .7rem; }
.admin-topbar a { color: #E3EDEB; text-decoration: none; font-size: .92rem; }
.admin-topbar a:hover { color: #fff; }
.admin-topbar .logo { color: #fff; font-size: 1.1rem; }
.tab-admin { border-collapse: collapse; width: 100%; background: var(--bianco); border: 1px solid var(--linea); border-radius: 10px; overflow: hidden; font-size: .92rem; }
.tab-admin th { text-align: left; background: var(--crema); padding: .6rem .8rem; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--grigio); border-bottom: 2px solid var(--linea); }
.tab-admin td { padding: .6rem .8rem; border-bottom: 1px solid var(--linea); vertical-align: top; }
.tab-admin tr:last-child td { border-bottom: none; }
.tabella-scroll { overflow-x: auto; }
.stato {
  display: inline-block; border-radius: 999px; padding: .1rem .6rem; font-size: .78rem; font-weight: 600;
}
.stato-in_valutazione, .stato-nuova { background: var(--oro-chiaro); color: #7A5A1E; }
.stato-approvata, .stato-chiusa { background: var(--verde-chiaro); color: var(--verde-scuro); }
.stato-archiviata { background: #EDEDEA; color: var(--grigio); }
.stato-in_lavorazione { background: #E3ECF6; color: #2C567F; }
.admin-card { background: var(--bianco); border: 1px solid var(--linea); border-radius: 12px; padding: 1.4rem; margin-bottom: 1.4rem; }
.admin-statgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .9rem; margin-bottom: 1.6rem; }
.admin-stat { background: var(--bianco); border: 1px solid var(--linea); border-radius: 10px; padding: .9rem 1rem; }
.admin-stat .v { font-size: 1.6rem; font-weight: 700; font-family: Charter, Georgia, serif; color: var(--verde); }
.admin-stat .l { font-size: .8rem; color: var(--grigio); }
.azione-inline { display: inline; }
.azione-inline button { background: none; border: none; color: var(--verde); cursor: pointer; font-size: .85rem; text-decoration: underline; padding: 0; font-family: inherit; }
.azione-inline button.rosso { color: var(--rosso); }

@media (max-width: 640px) {
  .topbar-inner { justify-content: center; }
  .hero-inner { padding-top: 2.5rem; padding-bottom: 2.5rem; }
}
