/* EdilStevi — edilstevi.it */

@font-face { font-family:'Barlow'; src:url('/fonts/barlow-thin.woff2') format('woff2'); font-weight:100; font-display:swap; }
@font-face { font-family:'Barlow'; src:url('/fonts/barlow-light.woff2') format('woff2'); font-weight:300; font-display:swap; }
@font-face { font-family:'Barlow'; src:url('/fonts/barlow-regular.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Barlow'; src:url('/fonts/barlow-bold.woff2') format('woff2'); font-weight:700; font-display:swap; }

:root {
  --nero:#161616;
  --grigio:#5c5a56;
  --bianco:#ffffff;
  --avorio:#f3f0e7;
  --petrolio:#00353b;
  --petrolio-soft:#9dbfb9;
  --linea:#e5e1da;
  --max:1180px;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'Barlow', -apple-system, 'Helvetica Neue', sans-serif;
  font-weight:300;
  color:var(--nero);
  background:var(--bianco);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  font-size:17px;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }

.wrap { max-width:var(--max); margin:0 auto; padding:0 6vw; }

/* ---------- Nav ---------- */
header.nav {
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; justify-content:space-between; align-items:center;
  padding:1.4rem 6vw;
  transition:background .4s, box-shadow .4s, padding .4s;
}
header.nav.solid { background:rgba(255,255,255,.96); backdrop-filter:blur(8px); box-shadow:0 1px 0 var(--linea); padding:.9rem 6vw; }
.logo { font-weight:700; letter-spacing:.28em; font-size:.95rem; text-transform:uppercase; color:var(--bianco); transition:color .4s; }
.logo span { font-weight:100; }
header.nav.solid .logo, header.nav.dark .logo { color:var(--nero); }
nav.menu { display:flex; gap:2.4rem; }
nav.menu a {
  font-size:.78rem; letter-spacing:.22em; text-transform:uppercase; font-weight:400;
  color:var(--bianco); transition:color .3s, opacity .3s; opacity:.92;
}
header.nav.solid nav.menu a, header.nav.dark nav.menu a { color:var(--nero); }
nav.menu a:hover { opacity:.55; }

/* ---------- Hero ---------- */
.hero {
  position:relative; height:100vh; min-height:620px;
  display:flex; align-items:flex-end;
  color:var(--bianco);
  overflow:hidden;
}
.hero .bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
}
.hero .bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(8,10,12,.82) 0%, rgba(8,10,12,.45) 48%, rgba(8,10,12,.22) 100%);
}
.hero .inner { position:relative; z-index:2; padding:0 6vw 9vh; max-width:900px; text-shadow:0 1px 24px rgba(0,0,0,.35); }
.kicker {
  font-size:.75rem; letter-spacing:.34em; text-transform:uppercase; font-weight:400;
  color:var(--petrolio); margin-bottom:1.2rem;
}
.hero .kicker { color:#d9e4e1; }
.hero h1 {
  font-weight:100; font-size:clamp(2.4rem, 5.6vw, 4.6rem);
  line-height:1.12; letter-spacing:.01em;
}
.hero h1 b { font-weight:300; }
.hero p.sub { margin-top:1.4rem; font-size:1.1rem; max-width:34em; font-weight:300; opacity:.94; }
.hero .cta-row { margin-top:2.6rem; display:flex; gap:1.2rem; flex-wrap:wrap; }

.btn {
  display:inline-block; padding:1rem 2.6rem;
  font-size:.78rem; letter-spacing:.24em; text-transform:uppercase; font-weight:400;
  border:1px solid currentColor;
  transition:background .35s, color .35s, border-color .35s;
}
.btn:hover { background:var(--bianco); color:var(--nero); border-color:var(--bianco); }
.btn.solid { background:var(--bianco); color:var(--nero); border-color:var(--bianco); }
.btn.solid:hover { background:transparent; color:var(--bianco); }
.btn.dark { border-color:var(--nero); color:var(--nero); }
.btn.dark:hover { background:var(--nero); color:var(--bianco); border-color:var(--nero); }
.btn.dark.solid { background:var(--nero); color:var(--bianco); }
.btn.dark.solid:hover { background:transparent; color:var(--nero); }

/* ---------- Sections ---------- */
section { padding:8.5rem 0; }
section.tight { padding:6rem 0; }
.avorio { background:var(--avorio); }
.scuro { background:var(--petrolio); color:#f3f0e7; }
.scuro .kicker { color:var(--petrolio-soft); }

h2 {
  font-weight:100; font-size:clamp(1.9rem, 3.6vw, 3rem);
  line-height:1.18; letter-spacing:.01em; margin-bottom:1.6rem;
}
h2 b { font-weight:300; }
.lead { font-size:1.12rem; color:var(--grigio); max-width:38em; }
.scuro .lead { color:#c3d4d0; }

.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:3.5rem; }

/* numbers strip */
.numeri { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; text-align:center; }
.numeri .n { font-weight:100; font-size:clamp(2.2rem,4vw,3.4rem); line-height:1; }
.numeri .n small { font-size:.45em; font-weight:300; }
.numeri .l { margin-top:.8rem; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; color:var(--grigio); }
.scuro .numeri .l { color:#9dbfb9; }

/* feature list */
.feat { border-top:1px solid var(--linea); }
.feat li {
  list-style:none; display:flex; justify-content:space-between; gap:2rem;
  padding:1.15rem 0; border-bottom:1px solid var(--linea);
  font-size:1rem;
}
.feat li span:first-child { font-weight:400; }
.feat li span:last-child { color:var(--grigio); text-align:right; }

/* tipologie */
.tipo-card { border-top:2px solid var(--nero); padding-top:1.6rem; }
.tipo-card .t { font-size:.74rem; letter-spacing:.26em; text-transform:uppercase; color:var(--petrolio); font-weight:400; }
.tipo-card h3 { font-weight:300; font-size:1.5rem; margin:.5rem 0 1rem; }
.tipo-card p { color:var(--grigio); font-size:.98rem; }

/* table */
.tbl-wrap { overflow-x:auto; }
table.dati { width:100%; border-collapse:collapse; font-size:.95rem; }
table.dati th, table.dati td { padding:.9rem 1rem; text-align:right; border-bottom:1px solid var(--linea); white-space:nowrap; }
table.dati th:first-child, table.dati td:first-child { text-align:left; font-weight:400; }
table.dati thead th { font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; font-weight:400; color:var(--grigio); border-bottom:1px solid var(--nero); }
table.dati tbody tr:hover { background:var(--avorio); }
.nota { font-size:.85rem; color:var(--grigio); margin-top:1.2rem; }

/* gallery */
.gallery { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.gallery figure { overflow:hidden; margin:0; }
.gallery img { width:100%; height:100%; object-fit:cover; transition:transform 1.2s cubic-bezier(.2,.6,.2,1); }
.gallery figure:hover img { transform:scale(1.04); }
.gallery figure.full { grid-column:1/-1; }

/* project banner (home) */
.banner {
  position:relative; min-height:78vh; display:flex; align-items:center;
  color:var(--bianco); background-size:cover; background-position:center;
}
.banner::after { content:''; position:absolute; inset:0; background:linear-gradient(100deg, rgba(8,10,12,.82) 25%, rgba(8,10,12,.28) 75%); }
.banner .inner { position:relative; z-index:2; padding:6rem 6vw; max-width:640px; text-shadow:0 1px 24px rgba(0,0,0,.35); }

/* contact */
.scuro .contatti a.big { border-color:var(--petrolio-soft); }
.contatti a.big { font-weight:100; font-size:clamp(1.5rem,3vw,2.4rem); display:inline-block; border-bottom:1px solid var(--petrolio); padding-bottom:.2rem; transition:opacity .3s; }
.contatti a.big:hover { opacity:.55; }
.contatti .voce { margin-bottom:2.4rem; }
.contatti .voce .l { font-size:.74rem; letter-spacing:.24em; text-transform:uppercase; color:var(--grigio); margin-bottom:.6rem; }
.scuro .contatti .voce .l { color:#9dbfb9; }

/* footer */
footer {
  background:var(--nero); color:#8f8a82;
  padding:3.2rem 6vw; font-size:.82rem;
  display:flex; justify-content:space-between; align-items:center; gap:2rem; flex-wrap:wrap;
}
footer .logo { color:var(--bianco); font-size:.8rem; }
footer nav { display:flex; gap:1.8rem; }
footer a:hover { color:var(--bianco); }

/* reveal */
.rv { opacity:0; transform:translateY(26px); transition:opacity .9s ease, transform .9s ease; }
.rv.on { opacity:1; transform:none; }

/* responsive */
@media (max-width:860px){
  section { padding:5.5rem 0; }
  .grid2, .grid3 { grid-template-columns:1fr; gap:2.8rem; }
  .numeri { grid-template-columns:repeat(2,1fr); gap:2.6rem 1rem; }
  nav.menu { display:none; }
  .gallery { grid-template-columns:1fr; }
  .hero { min-height:560px; }
}

/* nav logo image */
.logo img { height:40px; display:block; }
.logo .l-dark { display:none; }
header.nav.solid .l-light { display:none; }
header.nav.solid .l-dark { display:block; }
/* partner logos */
.partner-logo { height:34px; width:auto; margin-top:.4rem; }
.partners { display:flex; justify-content:center; align-items:flex-end; gap:7rem; flex-wrap:wrap; text-align:center; }
.partners .l { font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--grigio); margin-bottom:1.1rem; }
.partners img { height:44px; width:auto; margin:0 auto; }

/* ---------- Hero responsive bg ---------- */
.bg-materdomini { background-image:url('/assets/hero-materdomini.jpg'); }
@media (max-width:900px){ .bg-materdomini { background-image:url('/assets/hero-materdomini-900.jpg'); } }

/* gallery ratios (CLS) */
.gallery figure { aspect-ratio:3/2; }
.gallery figure.full { aspect-ratio:21/9; }

/* ---------- Mobile menu ---------- */
.burger { display:none; background:none; border:0; cursor:pointer; z-index:60; width:44px; height:44px; padding:10px; color:var(--bianco); }
header.nav.solid .burger { color:var(--nero); }
.burger.open { color:#f3f0e7 !important; }
.burger span { display:block; height:2px; background:currentColor; margin:7px 0; transition:transform .3s, opacity .3s; }
.burger.open span:nth-child(1){ transform:translateY(9px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-9px) rotate(-45deg); }
.m-overlay {
  position:fixed; inset:0; background:var(--petrolio); z-index:55;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2.4rem;
  opacity:0; pointer-events:none; transition:opacity .35s;
}
.m-overlay.open { opacity:1; pointer-events:auto; }
.m-overlay a { color:#f3f0e7; font-size:1.05rem; letter-spacing:.26em; text-transform:uppercase; font-weight:300; }
@media (max-width:860px){ .burger { display:block; } }

/* ---------- Accessibility ---------- */
.skip { position:absolute; left:-9999px; top:0; z-index:100; background:var(--bianco); color:var(--nero); padding:.8rem 1.4rem; font-size:.85rem; }
.skip:focus { left:0; }
:focus-visible { outline:2px solid var(--petrolio); outline-offset:3px; }
.scuro :focus-visible, .m-overlay :focus-visible, .hero :focus-visible, header.nav:not(.solid) :focus-visible { outline-color:#f3f0e7; }
@media (prefers-reduced-motion:reduce){
  html { scroll-behavior:auto; }
  .rv { opacity:1; transform:none; transition:none; }
  .gallery img { transition:none; }
}

/* ---------- Planimetria interattiva ---------- */
.pl { display:grid; grid-template-columns:1.12fr .88fr; gap:3rem; align-items:start; margin-top:3rem; }
.pl-map { background:var(--bianco); border:1px solid var(--linea); padding:1.1rem; }
.pl-imgwrap { position:relative; }
.pl-imgwrap img { width:100%; height:auto; }
.pl-dot {
  position:absolute; transform:translate(-50%,-50%);
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:.86rem; font-weight:400; color:#fff; font-family:'Barlow',sans-serif;
  background:rgba(0,53,59,.62); border:1px solid rgba(255,255,255,.85);
  cursor:pointer; transition:width .3s, height .3s, background .3s, box-shadow .3s; z-index:2;
}
.pl-dot:hover { background:var(--petrolio); }
.pl-dot.on { width:44px; height:44px; background:var(--petrolio); border-color:var(--avorio); box-shadow:0 8px 24px rgba(0,53,59,.5); z-index:3; }
.pl-rail { display:flex; flex-wrap:wrap; border-top:1px solid var(--linea); border-bottom:1px solid var(--linea); margin-top:1.4rem; }
.pl-rail button { flex:1; min-width:78px; background:none; border:0; border-right:1px solid var(--linea); padding:1rem .3rem .85rem; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:.25rem; position:relative; }
.pl-rail button:last-child { border-right:0; }
.pl-rail .vv { font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--grigio); }
.pl-rail .nn { font-size:1.7rem; font-weight:100; color:var(--nero); line-height:1; transition:color .3s; }
.pl-rail button.on .nn { color:var(--petrolio); font-weight:300; }
.pl-rail button.on::after { content:''; position:absolute; left:50%; bottom:-1px; transform:translateX(-50%); width:38px; height:2px; background:var(--petrolio); }
.pl-panel { background:var(--petrolio); color:var(--avorio); padding:2.6rem; position:sticky; top:96px; }
.pl-panel .tp { font-size:.72rem; letter-spacing:.24em; text-transform:uppercase; color:var(--petrolio-soft); }
.pl-panel h3 { font-weight:100; font-size:clamp(2.2rem,4vw,3rem); line-height:1; margin:.35rem 0 .3rem; }
.pl-panel .dsc { font-size:.95rem; color:#c3d4d0; margin-bottom:1.7rem; min-height:2.6em; }
.pl-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(243,240,231,.16); border:1px solid rgba(243,240,231,.16); }
.pl-grid > div { background:var(--petrolio); padding:1rem 1.1rem; }
.pl-grid .k { font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:#9dbfb9; }
.pl-grid .v { font-weight:100; font-size:1.5rem; margin-top:.15rem; }
.pl-grid .v small { font-size:.5em; color:var(--petrolio-soft); }
.pl-cta { display:inline-flex; align-items:center; gap:.7rem; margin-top:1.8rem; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--avorio); border-bottom:1px solid var(--petrolio-soft); padding-bottom:.35rem; }
.pl-cta:hover { opacity:.6; }
.pl-hint { font-size:.85rem; color:var(--grigio); margin-top:1.1rem; }
@media (max-width:860px){ .pl { grid-template-columns:1fr; gap:2rem; } .pl-panel { position:static; } }

/* video */
.video-wrap { max-width:960px; margin:3rem auto 0; background:var(--nero); box-shadow:0 24px 60px rgba(0,53,59,.18); }
.video-wrap video { width:100%; display:block; }