/* =========================================================
   ilombardo.it — foglio di stile unico
   Editoriale notturno: nero caldo, serif ad alto contrasto,
   accento corallo ereditato dal vecchio sito.
   ========================================================= */

:root{
  --ink:        #0b0a09;
  --ink-2:      #131110;
  --ink-3:      #1c1917;
  --cream:      #f5f0e8;
  --muted:      #9c948b;
  --accent:     #ff6b5a;
  --accent-2:   #ff9e59;
  --line:       rgba(245,240,232,.13);
  --line-soft:  rgba(245,240,232,.07);

  --serif: "Fraunces", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --mono:  "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --gutter: clamp(1.25rem, 5vw, 4.5rem);
  --max: 1180px;
  --radius: 14px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*, *::before, *::after{ box-sizing: border-box; }

html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body{
  margin:0;
  background: var(--ink);
  color: var(--cream);
  font-family: var(--sans);
  font-size: clamp(1rem, .96rem + .2vw, 1.075rem);
  line-height: 1.7;
  font-weight: 350;
  letter-spacing: .002em;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* grana fotografica su tutta la pagina */
body::after{
  content:"";
  position: fixed; inset: -50%;
  pointer-events: none; z-index: 9999;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

img{ max-width:100%; display:block; }
a{ color: inherit; }

::selection{ background: var(--accent); color:#150402; }

/* ---------- tipografia ---------- */
h1,h2,h3{
  font-family: var(--serif);
  font-weight: 400;
  font-variation-settings: "opsz" 100, "SOFT" 0, "WONK" 1;
  line-height: 1.02;
  letter-spacing: -.022em;
  margin: 0;
}

.kicker{
  font-family: var(--mono);
  font-size: .72rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 1.4rem;
  display: flex; align-items:center; gap:.9rem;
}
.kicker::before{
  content:""; width: 2.6rem; height:1px;
  background: linear-gradient(90deg, var(--accent), transparent);
}

.lead{
  font-size: clamp(1.06rem, 1rem + .5vw, 1.3rem);
  color: #d9d1c7;
  line-height: 1.65;
  max-width: 46ch;
}

/* ---------- layout ---------- */
.wrap{ width:100%; max-width: var(--max); margin-inline:auto; padding-inline: var(--gutter); }
section{ position: relative; }
.section{ padding-block: clamp(5rem, 11vw, 9.5rem); }
.rule{ height:1px; background: var(--line-soft); border:0; margin:0; }

/* ---------- header ---------- */
.site-header{
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  transition: background .5s var(--ease), backdrop-filter .5s var(--ease), border-color .5s var(--ease);
  border-bottom: 1px solid transparent;
}
.site-header.is-stuck{
  background: rgba(11,10,9,.72);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border-bottom-color: var(--line-soft);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:2rem; height: 92px;
}
.brand{ display:flex; align-items:center; gap:.8rem; text-decoration:none; }
.brand img{
  width: 46px; height:46px;
  /* il logo originale è nero su trasparente: lo ribalto in bianco per il fondo scuro */
  filter: invert(1);
}
.brand span{
  font-family: var(--serif); font-size:1.55rem; letter-spacing:-.015em; line-height:1;
}
.brand span em{ font-style: italic; color: var(--accent); }

.nav{ display:flex; align-items:center; gap: clamp(1.1rem, 2.4vw, 2.2rem); }
.nav a{
  font-size:.82rem; letter-spacing:.09em; text-transform:uppercase;
  text-decoration:none; color:#cdc5bb; position:relative; padding-block:.35rem;
  transition: color .3s var(--ease);
}
.nav a::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background: var(--accent); transform: scaleX(0); transform-origin: right;
  transition: transform .4s var(--ease);
}
.nav a:hover{ color: var(--cream); }
.nav a:hover::after, .nav a[aria-current="page"]::after{ transform: scaleX(1); transform-origin:left; }
.nav a[aria-current="page"]{ color: var(--cream); }

@media (max-width: 700px){
  .brand img{ width: 40px; height:40px; }
  .brand span{ font-size:1.3rem; }
}
@media (max-width: 560px){
  .nav a:not(.nav-cta){ font-size:.74rem; }
  .brand span{ display:none; }
}

/* ---------- hero ---------- */
.hero{
  min-height: 100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding-block: 8rem clamp(2rem, 5vw, 3.5rem);
  overflow:hidden;
}
.hero-media{ position:absolute; inset:0; z-index:-2; }
.hero-media img{
  width:100%; height:100%; object-fit:cover; object-position: 50% 55%;
  filter: saturate(.72) contrast(1.06) brightness(.72);
  transform: scale(1.06);
}
.hero-veil{
  position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(180deg, rgba(11,10,9,.88) 0%, rgba(11,10,9,.5) 30%, rgba(11,10,9,.74) 62%, var(--ink) 100%),
    radial-gradient(120% 80% at 15% 90%, rgba(255,107,90,.16), transparent 60%);
}
.hero .wrap{ text-shadow: 0 1px 24px rgba(0,0,0,.45); }
.hero h1{
  font-size: clamp(3.4rem, 13.5vw, 11rem);
  font-variation-settings: "opsz" 144, "WONK" 1;
  margin: 0 0 1.6rem;
  text-wrap: balance;
}
.hero h1 em{
  font-style: italic;
  font-weight: 300;
  color: var(--accent);
  padding-right: .06em;
}
.hero-motto{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-variation-settings: "opsz" 144;
  font-size: clamp(1.2rem, .95rem + 1.15vw, 2rem);
  line-height: 1.25;
  color: #e3dbd1;
  margin: -.5rem 0 1.5rem;
}

.hero-actions{ display:flex; flex-wrap:wrap; gap:.85rem; margin-top: 2.4rem; }
.hero-foot{
  margin-top: clamp(3rem, 8vw, 5rem);
  display:flex; justify-content:space-between; align-items:flex-end;
  gap:2rem; flex-wrap:wrap;
  font-family: var(--mono); font-size:.7rem; letter-spacing:.2em;
  text-transform:uppercase; color: var(--muted);
}
.scrollcue{ display:flex; align-items:center; gap:.7rem; }
.scrollcue i{
  display:block; width:1px; height:34px;
  background: linear-gradient(180deg, var(--accent), transparent);
  animation: cue 2.4s var(--ease) infinite;
}
@keyframes cue{ 0%,100%{ transform: scaleY(.35); opacity:.4 } 50%{ transform: scaleY(1); opacity:1 } }

/* ---------- bottoni ---------- */
.btn{
  --bg: transparent; --fg: var(--cream); --bd: var(--line);
  display:inline-flex; align-items:center; gap:.7rem;
  padding: .82rem 1.5rem; border-radius: 999px;
  border:1px solid var(--bd); background: var(--bg); color: var(--fg);
  font-size:.82rem; letter-spacing:.1em; text-transform:uppercase;
  text-decoration:none; white-space:nowrap;
  transition: transform .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
}
.btn:hover{ transform: translateY(-2px); border-color: rgba(245,240,232,.4); }
.btn svg{ width:15px; height:15px; transition: transform .35s var(--ease); }
.btn:hover svg{ transform: translateX(4px); }
.btn--solid{
  --bg: var(--accent); --fg:#180402; --bd: var(--accent);
  font-weight: 500;
}
.btn--solid:hover{ --bg: var(--accent-2); --bd: var(--accent-2); }

/* ---------- chi sono ---------- */
.about{
  display:grid; gap: clamp(2.5rem, 6vw, 5.5rem);
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr);
  align-items:start;
}
@media (max-width: 860px){ .about{ grid-template-columns: 1fr; } }

.portrait{ position: sticky; top: 126px; }
@media (max-width: 860px){ .portrait{ position: static; max-width: 380px; } }
.portrait figure{ margin:0; position:relative; }
.portrait img{
  width:100%; aspect-ratio: 4/5; object-fit:cover; object-position: 30% 30%;
  border-radius: var(--radius);
  filter: grayscale(.15) contrast(1.05);
}

.about h2{ font-size: clamp(2.2rem, 5.2vw, 3.6rem); margin-bottom: 1.8rem; }
.about p{ color:#cbc3b9; max-width: 54ch; }
.about p + p{ margin-top: 1.15rem; }
.about strong{ color: var(--cream); font-weight: 500; }

.chips{ display:flex; flex-wrap:wrap; gap:.55rem; margin-top: 2.4rem; padding:0; list-style:none; }
.chips li{
  font-family: var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
  padding:.5rem .9rem; border:1px solid var(--line); border-radius:999px; color:#bdb4aa;
  transition: border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}
.chips li:hover{ border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }

/* ---------- fatti ---------- */
.facts{
  display:grid; grid-template-columns: repeat(3, 1fr);
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
}
@media (max-width: 720px){ .facts{ grid-template-columns:1fr; } }
.fact{ padding: clamp(2rem,4vw,3rem) 0; }
.fact + .fact{ border-left:1px solid var(--line-soft); padding-left: clamp(1.5rem,3vw,2.5rem); }
@media (max-width: 720px){
  .fact + .fact{ border-left:0; border-top:1px solid var(--line-soft); padding-left:0; }
}
.fact b{
  display:block; font-family: var(--serif); font-weight:400;
  font-size: clamp(2.4rem, 6vw, 3.6rem); line-height:1;
  font-variation-settings:"opsz" 144;
  margin-bottom:.55rem;
}
.fact span{
  font-family: var(--mono); font-size:.7rem; letter-spacing:.2em;
  text-transform:uppercase; color: var(--muted);
}

/* ---------- galleria ---------- */
.gallery-head{
  display:flex; justify-content:space-between; align-items:flex-end;
  gap:2rem; flex-wrap:wrap; margin-bottom: clamp(2.5rem,5vw,4rem);
}
.gallery-head h2{ font-size: clamp(2.2rem, 5.2vw, 3.6rem); }
.grid{
  display:grid; gap: clamp(.6rem, 1.4vw, 1.1rem);
  grid-template-columns: repeat(6, 1fr);
}
.grid figure{
  margin:0; position:relative; overflow:hidden;
  background: var(--ink-2); border-radius: var(--radius);
}
.grid img{
  width:100%; height:100%; object-fit:cover;
  transition: transform 1.1s var(--ease), filter .7s var(--ease);
  filter: saturate(.85) brightness(.92);
}
.grid figure:hover img{ transform: scale(1.045); filter:saturate(1) brightness(1); }
.grid figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:1rem 1.1rem;
  font-family: var(--mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  background: linear-gradient(0deg, rgba(11,10,9,.85), transparent);
  opacity:0; transform: translateY(8px);
  transition: opacity .45s var(--ease), transform .45s var(--ease);
}
.grid figure:hover figcaption{ opacity:1; transform:none; }
.g-wide{ grid-column: span 4; aspect-ratio: 16/9; }
.g-tall{ grid-column: span 2; aspect-ratio: 3/4; }
.g-half{ grid-column: span 3; aspect-ratio: 4/3; }
.g-third{ grid-column: span 2; aspect-ratio: 1; }
/* La foto in evidenza non ha proporzione imposta: l'altezza la detta la
   fotografia stessa, quindi si vede per intero senza un pixel tagliato.
   Chi le sta accanto si allunga fino alla stessa altezza. */
.g-mostra{ grid-column: span 4; aspect-ratio: auto; }
.g-mostra img{ height: auto; }
.g-affianco{ grid-column: span 2; }
@media (max-width: 860px){
  .grid{ grid-template-columns: repeat(2, 1fr); }
  .g-wide,.g-half{ grid-column: span 2; aspect-ratio: 4/3; }
  .g-tall,.g-third{ grid-column: span 1; aspect-ratio: 3/4; }
  .g-mostra{ grid-column: span 2; }
  .g-affianco{ grid-column: span 1; aspect-ratio: 3/4; }
}

/* ---------- richiamo diario ---------- */
.promo{ position:relative; overflow:hidden; }
.promo-bg{ position:absolute; inset:0; z-index:-2; }
.promo-bg img{
  width:100%; height:100%; object-fit:cover; object-position:50% 60%;
  filter: saturate(.6) brightness(.5);
}
.promo::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(90deg, rgba(11,10,9,.94) 8%, rgba(11,10,9,.55) 70%, rgba(11,10,9,.75));
}
.promo .wrap{ padding-block: clamp(5rem, 12vw, 9rem); }
.promo h2{ font-size: clamp(2.4rem, 7vw, 5rem); margin-bottom:1.4rem; max-width: 15ch; }
.promo h2 em{ font-style:italic; color: var(--accent); }

/* ---------- pagina diario ---------- */
.page-head{
  padding-block: clamp(9rem, 16vw, 13rem) clamp(3rem,6vw,4.5rem);
  position:relative;
}
.page-head h1{ font-size: clamp(3rem, 10vw, 7.5rem); margin-bottom:1.8rem; }
.page-head h1 em{ font-style:italic; color: var(--accent); }

.route{
  display:flex; flex-wrap:wrap; gap:.5rem .35rem; align-items:center;
  margin-top: 2.6rem; padding-top: 2rem; border-top:1px solid var(--line-soft);
  font-family: var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  color: var(--muted);
}
.route b{ color: var(--cream); font-weight:400; }
.route i{ color: var(--accent); font-style:normal; }

.timeline{ padding-bottom: clamp(4rem,9vw,7rem); }
.entry{
  display:grid; gap: clamp(1.5rem, 4vw, 3.5rem);
  grid-template-columns: 8.5rem minmax(0,1fr) minmax(0,.85fr);
  padding-block: clamp(2.5rem, 5vw, 4rem);
  border-top:1px solid var(--line-soft);
  align-items:start;
}
.entry-date{ grid-column: 1; }
.entry-body{ grid-column: 2; }
.entry-media{ grid-column: 3; }
/* le tappe pari ribaltano testo e foto, ma la colonna della data resta ferma */
.entry:nth-child(even){ grid-template-columns: 8.5rem minmax(0,.85fr) minmax(0,1fr); }
.entry:nth-child(even) .entry-media{ grid-column: 2; }
.entry:nth-child(even) .entry-body{ grid-column: 3; }
@media (max-width: 900px){
  .entry, .entry:nth-child(even){ grid-template-columns: 1fr; gap:1.4rem; }
  .entry-date, .entry-body, .entry-media,
  .entry:nth-child(even) .entry-date,
  .entry:nth-child(even) .entry-body,
  .entry:nth-child(even) .entry-media{ grid-column: 1; }
}
.entry-date{
  font-family: var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  color: var(--muted); padding-top:.55rem;
}
.entry-date b{ display:block; color: var(--accent); font-weight:400; font-size:1.6rem; letter-spacing:0; line-height:1; margin-bottom:.35rem; font-family: var(--serif); }
.entry h2{ font-size: clamp(1.7rem, 3.6vw, 2.5rem); margin-bottom:1.1rem; }
.entry p{ color:#c3bbb1; max-width: 52ch; }
.entry p + p{ margin-top: .95rem; }
.entry h3{
  font-family: var(--mono); font-size:.7rem; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color: var(--accent); margin: 1.7rem 0 .6rem;
}
.entry-media figure{ margin:0; }
.entry-media img{
  width:100%; max-height: 460px; object-fit:cover; border-radius: var(--radius);
  filter: saturate(.85) brightness(.94);
  transition: filter .6s var(--ease);
}
.entry-media:hover img{ filter:none; }
.entry-media img.map{ object-fit:contain; max-height:440px; background:#0f0d0c; border-radius: var(--radius); }
.entry-media figcaption{
  margin-top:.8rem; font-family: var(--mono); font-size:.65rem;
  letter-spacing:.14em; text-transform:uppercase; color: var(--muted);
}

/* ---------- footer ---------- */
.site-footer{
  border-top:1px solid var(--line-soft);
  background: var(--ink-2);
  padding-block: clamp(3.5rem, 8vw, 6rem) 2.5rem;
}
.footer-top{
  display:grid; grid-template-columns: 1.2fr 1fr; gap: clamp(2rem,5vw,4rem);
  align-items:start; margin-bottom: clamp(3rem,6vw,4.5rem);
}
@media (max-width: 760px){ .footer-top{ grid-template-columns:1fr; } }
.footer-top h2{ font-size: clamp(1.9rem, 4.6vw, 3rem); margin-bottom:1.1rem; }
.footer-top h2 em{ font-style:italic; color: var(--accent); }
.footer-top p{ color:#b5aca2; max-width:42ch; }

.socials{ display:flex; flex-direction:column; gap:.15rem; margin-top:.4rem; }
.socials a{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.95rem 0; border-bottom:1px solid var(--line-soft);
  text-decoration:none; color:#cdc5bb;
  font-family: var(--mono); font-size:.75rem; letter-spacing:.14em; text-transform:uppercase;
  transition: color .3s var(--ease), padding-left .3s var(--ease);
}
.socials a:first-child{ border-top:1px solid var(--line-soft); }
.socials a:hover{ color: var(--accent); padding-left:.6rem; }
.socials svg{ width:14px; height:14px; opacity:.6; }

.footer-bottom{
  display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
  padding-top: 2rem; border-top:1px solid var(--line-soft);
  font-family: var(--mono); font-size:.66rem; letter-spacing:.16em;
  text-transform:uppercase; color:#6f675f;
}
.footer-bottom a{ text-decoration:none; }
.footer-bottom a:hover{ color: var(--accent); }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform: translateY(26px); }
.reveal.in{
  opacity:1; transform:none;
  transition: opacity .9s var(--ease), transform .9s var(--ease);
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
  .scrollcue i{ animation:none; }
  *{ transition-duration:.01ms !important; }
}

/* ---------- avviso privacy ---------- */
.notice{
  position: fixed; z-index: 200;
  left: var(--gutter); right: var(--gutter); bottom: clamp(1rem, 3vw, 1.75rem);
  margin-inline: auto; max-width: 44rem;
  display:flex; align-items:center; gap: clamp(1rem, 3vw, 2rem); flex-wrap:wrap;
  padding: 1.1rem clamp(1.1rem, 3vw, 1.6rem);
  background: rgba(20,18,16,.9);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border:1px solid var(--line); border-radius: var(--radius);
  box-shadow: 0 24px 60px rgba(0,0,0,.5);
  opacity:0; transform: translateY(14px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.notice.is-on{ opacity:1; transform:none; }
.notice p{
  margin:0; flex:1 1 18rem;
  font-size:.88rem; line-height:1.6; color:#c8c0b6;
}
.notice a{ color: var(--cream); text-decoration:none; border-bottom:1px solid var(--accent); }
.notice a:hover{ color: var(--accent); }
.notice button{
  flex:0 0 auto; cursor:pointer;
  font-family: var(--sans); font-size:.78rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase;
  padding:.7rem 1.4rem; border-radius:999px;
  border:1px solid var(--accent); background: var(--accent); color:#180402;
  transition: background .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease);
}
.notice button:hover{ background: var(--accent-2); border-color: var(--accent-2); transform: translateY(-2px); }

/* ---------- pagina di testo (privacy) ---------- */
.prose{ max-width: 60ch; padding-bottom: clamp(4rem, 9vw, 7rem); }
.prose h2{
  font-size: clamp(1.5rem, 3vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 1rem;
}
.prose h2:first-child{ margin-top:0; }
.prose p{ color:#c3bbb1; }
.prose p + p{ margin-top: 1rem; }
.prose ul{ margin: 1rem 0 0; padding-left: 1.1rem; color:#c3bbb1; }
.prose li{ margin-bottom:.55rem; }
.prose strong{ color: var(--cream); font-weight:500; }
.prose a{ color: var(--accent); text-decoration:none; border-bottom:1px solid rgba(255,107,90,.4); }
.prose a:hover{ border-bottom-color: var(--accent); }

/* ---------- modulo di contatto ---------- */
.form-wrap{ max-width: 42rem; padding-bottom: clamp(4rem, 9vw, 7rem); }

.campo{ margin-bottom: 1.6rem; }
.campo label{
  display:block; margin-bottom:.6rem;
  font-family: var(--mono); font-size:.7rem; letter-spacing:.18em;
  text-transform:uppercase; color: var(--muted);
}
.campo input, .campo textarea{
  width:100%; display:block;
  font-family: var(--sans); font-size:1rem; line-height:1.6;
  color: var(--cream); background: var(--ink-2);
  border:1px solid var(--line); border-radius: var(--radius);
  padding: .9rem 1.1rem;
  transition: border-color .3s var(--ease), background .3s var(--ease);
}
.campo textarea{ resize: vertical; min-height: 9rem; }
.campo input:focus, .campo textarea:focus{
  outline:none; border-color: var(--accent); background: var(--ink-3);
}
.campo input::placeholder, .campo textarea::placeholder{ color:#6f675f; }
.campo--stretto input{ max-width: 16rem; }

.aiuto{
  margin:.7rem 0 0; font-size:.82rem; line-height:1.6; color: var(--muted);
}
.aiuto--nota{ margin-top: 2.2rem; max-width: 46ch; }
.aiuto a{ color: var(--accent); text-decoration:none; border-bottom:1px solid rgba(255,107,90,.4); }

/* campo esca per i bot: fuori dallo schermo, invisibile a chi legge */
.esca{
  position:absolute !important; left:-9999px !important;
  width:1px; height:1px; overflow:hidden;
}

.form-wrap button[type="submit"]{ margin-top:.6rem; cursor:pointer; font-family: var(--sans); }

.esito{
  padding: 1.4rem 1.6rem; margin-bottom: 2.4rem;
  border:1px solid var(--line); border-radius: var(--radius);
  background: var(--ink-2);
}
.esito h2{ font-size: clamp(1.7rem, 3.4vw, 2.3rem); margin-bottom:.8rem; }
.esito p{ margin:0; color:#c3bbb1; }
.esito ul{ margin:.8rem 0 0; padding-left:1.1rem; color:#c3bbb1; }
.esito li{ margin-bottom:.35rem; }
.esito .btn{ margin-top:1.6rem; }
.esito--ok{ border-color: rgba(255,107,90,.4); }
.esito--ko{ border-left:3px solid var(--accent); }