/* ===========================================================
   home.css — sezioni specifiche della home
   Usa le variabili di palette definite in style.css (:root),
   così un cambio di colore si propaga a tutto il sito.
   =========================================================== */

/* ---------- hero ---------- */
.home-hero-wrap{ background:var(--ink); }
.home-hero{
  max-width:1180px; margin:0 auto;
  padding:96px 32px 84px;
  display:grid; grid-template-columns:1.15fr 0.85fr;
  gap:64px; align-items:end;
}
.home-hero .eyebrow-gold{
  display:block; font-size:0.75rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--gold-light);
  font-weight:600; margin-bottom:26px;
}
.home-hero h1{
  font-family:var(--serif);
  font-size:clamp(2.6rem,5.6vw,4.6rem);
  font-weight:300; line-height:1.03; letter-spacing:-0.025em;
  margin:0; color:var(--paper); text-wrap:pretty;
}
.home-hero h1 em{ font-style:italic; color:var(--gold-light); font-weight:300; }
.home-rule{ width:56px; height:2px; background:var(--gold-light); margin:38px 0 26px; }
.home-hero-lead{
  font-size:1.06rem; line-height:1.62;
  color:var(--stone-light); max-width:52ch; margin:0;
}
.home-hero-actions{ display:flex; gap:14px; margin-top:38px; flex-wrap:wrap; }
.home-btn{
  font-size:0.94rem; font-weight:600; padding:15px 30px;
  white-space:nowrap; text-decoration:none; display:inline-block;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.home-btn-gold{ background:var(--gold); color:var(--ink); }
.home-btn-gold:hover{ background:var(--gold-light); color:var(--ink); }
.home-btn-ghost{ border:1px solid rgba(246,243,236,0.35); color:var(--paper); }
.home-btn-ghost:hover{ border-color:var(--gold-light); color:var(--gold-light); }
.home-btn-dark{ background:var(--ink); color:var(--paper); }
.home-btn-dark:hover{ background:var(--gold); color:var(--ink); }
.home-btn-outline{ border:1px solid rgba(26,25,23,0.25); color:var(--ink); }
.home-btn-outline:hover{ border-color:var(--gold); color:var(--gold); }

.home-hero-figure{
  position:relative; width:100%; aspect-ratio:4/5;
  border:1px solid rgba(246,243,236,0.18);
}

/* ritratto fotografico nell'hero */
.hero-photo{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center 32%;
  display:block;
}

/* ---------- fascia dati ---------- */
.home-stats-wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
.home-stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:rgba(26,25,23,0.09);
  border-top:1px solid rgba(26,25,23,0.09);
  border-bottom:1px solid rgba(26,25,23,0.09);
}
.home-stat{ background:var(--paper); padding:34px 26px; }
.home-stats .home-stat:first-child{ padding-left:0; }
.home-stats .home-stat:last-child{ padding-right:0; }
.home-stat b{
  display:block; font-family:var(--serif); font-size:2rem;
  font-weight:400; color:var(--gold); line-height:1; margin-bottom:10px;
}
.home-stat span{
  font-size:0.88rem; color:var(--charcoal-2); line-height:1.45; display:block;
}

/* ---------- aree di intervento ---------- */
.home-sec{ max-width:1180px; margin:0 auto; padding:96px 32px; }
.home-areas{
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:start;
}
.home-areas-head{ position:sticky; top:110px; }
.home-areas-head .eyebrow-gold{
  display:block; font-size:0.75rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--gold); font-weight:600; margin-bottom:20px;
}
.home-areas-head h2{
  font-family:var(--serif); font-size:clamp(1.7rem,2.8vw,2.35rem);
  font-weight:300; line-height:1.12; letter-spacing:-0.02em;
  margin:0 0 20px; text-wrap:pretty;
}
.home-areas-head p{
  font-size:1rem; line-height:1.6; color:var(--charcoal-2); max-width:38ch; margin:0;
}
.home-area-row{
  display:grid; grid-template-columns:44px 1fr; gap:22px;
  padding:28px 0; border-top:1px solid rgba(26,25,23,0.12);
  color:var(--ink); text-decoration:none;
  transition:background .2s ease;
}
.home-area-row:last-child{ border-bottom:1px solid rgba(26,25,23,0.12); }
.home-area-row:hover{ background:rgba(176,126,63,0.05); }
.home-area-row .num{
  font-family:var(--serif); font-style:italic; font-size:1.05rem;
  color:var(--gold); padding-top:3px;
}
.home-area-row h3{
  font-family:var(--serif); font-size:1.3rem; font-weight:400;
  margin:0 0 8px; letter-spacing:-0.01em;
}
.home-area-row p{
  font-size:0.96rem; line-height:1.58; color:var(--charcoal-2); margin:0; max-width:56ch;
}

/* ---------- come funziona (fascia scura) ---------- */
.home-steps-sec{ background:var(--ink); color:var(--paper); padding:96px 0; }
.home-steps-inner{ max-width:1180px; margin:0 auto; padding:0 32px; }
.home-steps-sec .eyebrow-gold{
  display:block; font-size:0.75rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--gold-light); font-weight:600; margin-bottom:20px;
}
.home-steps-sec h2{
  font-family:var(--serif); font-size:clamp(1.7rem,2.8vw,2.35rem);
  font-weight:300; line-height:1.12; letter-spacing:-0.02em;
  margin:0 0 60px; max-width:22ch; color:var(--paper); text-wrap:pretty;
}
.home-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:44px; }
.home-step{ border-top:1px solid rgba(211,168,104,0.4); padding-top:24px; }
.home-step .num{
  display:block; font-family:var(--serif); font-style:italic;
  font-size:1.5rem; color:var(--gold-light); margin-bottom:18px;
}
.home-step h3{
  font-family:var(--serif); font-size:1.22rem; font-weight:400;
  color:var(--paper); margin:0 0 12px;
}
.home-step p{ font-size:0.96rem; line-height:1.62; color:var(--stone-light); margin:0; }

/* ---------- citazione ---------- */
.home-quote-sec{ max-width:1180px; margin:0 auto; padding:104px 32px; }
.home-quote{
  margin:0; font-family:var(--serif); font-style:italic; font-weight:300;
  font-size:clamp(1.6rem,3.4vw,2.6rem); line-height:1.28;
  letter-spacing:-0.02em; color:var(--ink); max-width:34ch;
}
.home-quote cite{
  display:block; font-family:var(--sans); font-style:normal;
  font-size:0.84rem; letter-spacing:0.04em; color:var(--stone);
  margin-top:28px; font-weight:500;
}

/* ---------- fascia finale ---------- */
.home-cta-sec{ background:var(--paper-2); padding:72px 0; }
.home-cta-band{
  max-width:1180px; margin:0 auto; padding:0 32px;
  display:flex; justify-content:space-between; align-items:center;
  gap:40px; flex-wrap:wrap;
}
.home-cta-band h2{
  font-family:var(--serif); font-size:clamp(1.5rem,2.6vw,2.1rem);
  font-weight:300; letter-spacing:-0.02em; margin:0 0 10px;
}
.home-cta-band p{ font-size:1rem; color:var(--charcoal-2); margin:0; }
.home-cta-actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- focus da tastiera ---------- */
.home-btn:focus-visible,
.home-area-row:focus-visible{
  outline:2px solid var(--gold); outline-offset:3px;
}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .home-hero{ grid-template-columns:1fr; gap:40px; padding:56px 22px 60px; }
  .home-hero-figure{ order:-1; max-width:320px; }
  .home-stats{ grid-template-columns:1fr 1fr; }
  .home-stat,
  .home-stats .home-stat:first-child,
  .home-stats .home-stat:last-child{ padding:26px 20px; }
  .home-areas{ grid-template-columns:1fr; gap:40px; }
  .home-areas-head{ position:static; }
  .home-steps{ grid-template-columns:1fr; gap:32px; }
  .home-sec,
  .home-quote-sec{ padding-left:22px; padding-right:22px; padding-top:64px; padding-bottom:64px; }
  .home-stats-wrap,
  .home-steps-inner,
  .home-cta-band{ padding-left:22px; padding-right:22px; }
  .home-steps-sec{ padding:64px 0; }
}
@media (max-width:560px){
  .home-stats{ grid-template-columns:1fr; }
  .home-cta-band{ flex-direction:column; align-items:flex-start; }
}
@media (prefers-reduced-motion: reduce){
  .home-areas-head{ position:static; }
  .home-btn, .home-area-row{ transition:none; }
}

/* wrapper di pagina */
.home-page{ background:var(--paper); }