/* ============================================================
   ORIGO — sistema visivo condiviso
   Luce. Materia. Silenzio. Profondità. Precisione.
   ============================================================ */

/* ---------- Typefaces ---------- */
@font-face{
  font-family:"Archia";
  src:url("../fonts/Archia-Thin.otf") format("opentype");
  font-weight:100; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Archia";
  src:url("../fonts/Archia-Light.otf") format("opentype");
  font-weight:300; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Archia";
  src:url("../fonts/Archia-Regular.otf") format("opentype");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Archia";
  src:url("../fonts/Archia-Medium.otf") format("opentype");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Instrument Serif";
  src:url("../fonts/InstrumentSerif-Regular.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Instrument Serif";
  src:url("../fonts/InstrumentSerif-Italic.woff2") format("woff2");
  font-weight:400; font-style:italic; font-display:swap;
}

/* ---------- Materia ---------- */
:root{
  --nero:#2E2B28;
  --nero-90:rgba(46,43,40,.9);
  --nero-60:rgba(46,43,40,.6);
  --nero-40:rgba(46,43,40,.4);
  --bianco:#FFFDFA;
  --velo:#FAF7F5;
  --pietra:#ECE9E5;
  --sabbia:#DFDAD3;
  --terracotta:#D3A588;
  --sans:"Archia",-apple-system,"Helvetica Neue",sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --gutter:clamp(1.5rem,6vw,6.5rem);
  --misura:66ch;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html:focus-within{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  font-weight:300;
  background:var(--velo);
  color:var(--nero);
  line-height:1.65;
  font-size:1.0625rem;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:var(--terracotta);color:var(--bianco)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
main{display:block}

/* ---------- Grana — materiale permanente ---------- */
.grana{
  position:fixed;inset:-40px;z-index:80;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.78' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  opacity:.3;
  mix-blend-mode:overlay;
}
.scuro .grana,.grana.chiara{mix-blend-mode:screen;opacity:.22}

/* ---------- Luce — atmosfera ---------- */
.atmosfera{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
/* Gradiente transizione Hero → sezione successiva */
.dissolvenza-ingresso{
  position:absolute;left:0;right:0;bottom:0;height:min(40vh,30rem);
  background:linear-gradient(to bottom,
    rgba(46,43,40,0.0) 0.0%,
    rgba(46,43,40,0.0035) 3.45%,
    rgba(46,43,40,0.0136) 6.9%,
    rgba(46,43,40,0.0299) 10.34%,
    rgba(46,43,40,0.0518) 13.79%,
    rgba(46,43,40,0.0789) 17.24%,
    rgba(46,43,40,0.1107) 20.69%,
    rgba(46,43,40,0.1467) 24.14%,
    rgba(46,43,40,0.1863) 27.59%,
    rgba(46,43,40,0.2292) 31.03%,
    rgba(46,43,40,0.2747) 34.48%,
    rgba(46,43,40,0.3225) 37.93%,
    rgba(46,43,40,0.372) 41.38%,
    rgba(46,43,40,0.4227) 44.83%,
    rgba(46,43,40,0.4741) 48.28%,
    rgba(46,43,40,0.5259) 51.72%,
    rgba(46,43,40,0.5773) 55.17%,
    rgba(46,43,40,0.628) 58.62%,
    rgba(46,43,40,0.6775) 62.07%,
    rgba(46,43,40,0.7253) 65.52%,
    rgba(46,43,40,0.7708) 68.97%,
    rgba(46,43,40,0.8137) 72.41%,
    rgba(46,43,40,0.8533) 75.86%,
    rgba(46,43,40,0.8893) 79.31%,
    rgba(46,43,40,0.9211) 82.76%,
    rgba(46,43,40,0.9482) 86.21%,
    rgba(46,43,40,0.9701) 89.66%,
    rgba(46,43,40,0.9864) 93.1%,
    rgba(46,43,40,0.9965) 96.55%,
    rgba(46,43,40,1.0) 100.0%);
  pointer-events:none;z-index:1;
}

/* ---------- Tipografia ---------- */
.etichetta{
  font-size:.6875rem;font-weight:400;
  letter-spacing:.32em;text-transform:uppercase;
  color:var(--nero-60);
}
.scuro .etichetta,.etichetta.chiara{color:rgba(255,253,250,.55)}
/* sezione chiara dentro una pagina scura */
.chiaro-sezione{background:var(--velo);color:var(--nero)}
.chiaro-sezione .etichetta{color:var(--nero-60)}
.chiaro-sezione .sommesso{color:var(--nero-60)}
.chiaro-sezione .campo label{color:var(--nero-60)}
.chiaro-sezione .filo{background:var(--sabbia)}

.display{
  font-weight:100;
  font-size:clamp(2.625rem,7.2vw,7rem);
  line-height:1.04;
  letter-spacing:-.015em;
}
.titolo{
  font-weight:300;
  font-size:clamp(1.9rem,4vw,3.4rem);
  line-height:1.12;
  letter-spacing:-.01em;
}
.titoletto{
  font-weight:400;
  font-size:clamp(1.25rem,2vw,1.6rem);
  line-height:1.3;
}
.corsivo{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.prosa{max-width:var(--misura)}
.prosa p+p{margin-top:1.4em}
.sommesso{color:var(--nero-60)}
.scuro .sommesso{color:rgba(255,253,250,.6)}

/* ---------- Struttura ---------- */
.involucro{
  width:100%;
  max-width:1720px;
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.griglia{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  column-gap:clamp(1rem,2.4vw,2.5rem);
}
.stanza{position:relative;padding-block:clamp(6rem,14vh,11rem)}
/* le stanze che dissolvono verso la successiva si prendono più spazio bianco:
   il contenuto resta sempre sopra la zona di sfumatura, mai dentro */
.stanza:has(> .dissolvenza-giu),
.stanza:has(> .dissolvenza-velo),
.stanza:has(> .dissolvenza-pietra){
  padding-bottom:calc(min(40vh,30rem) + clamp(2rem,5vh,4rem));
}
/* nell'ingresso la dissolvenza resta breve: le azioni non perdono mai contrasto */
.ingresso .dissolvenza-velo{height:min(20vh,13rem)}
.stanza--alta{min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.scuro{background:var(--nero);color:var(--bianco)}

/* dissolvenze tra stanze — mai bordi netti */
/* dissolvenze con curva smoothstep: nessuna linea di inizio o di fine */
.dissolvenza-giu{
  position:absolute;left:0;right:0;bottom:0;height:min(40vh,30rem);
  background:linear-gradient(to bottom,
    rgba(46,43,40,0.0) 0.0%,
    rgba(46,43,40,0.0035) 3.45%,
    rgba(46,43,40,0.0136) 6.9%,
    rgba(46,43,40,0.0299) 10.34%,
    rgba(46,43,40,0.0518) 13.79%,
    rgba(46,43,40,0.0789) 17.24%,
    rgba(46,43,40,0.1107) 20.69%,
    rgba(46,43,40,0.1467) 24.14%,
    rgba(46,43,40,0.1863) 27.59%,
    rgba(46,43,40,0.2292) 31.03%,
    rgba(46,43,40,0.2747) 34.48%,
    rgba(46,43,40,0.3225) 37.93%,
    rgba(46,43,40,0.372) 41.38%,
    rgba(46,43,40,0.4227) 44.83%,
    rgba(46,43,40,0.4741) 48.28%,
    rgba(46,43,40,0.5259) 51.72%,
    rgba(46,43,40,0.5773) 55.17%,
    rgba(46,43,40,0.628) 58.62%,
    rgba(46,43,40,0.6775) 62.07%,
    rgba(46,43,40,0.7253) 65.52%,
    rgba(46,43,40,0.7708) 68.97%,
    rgba(46,43,40,0.8137) 72.41%,
    rgba(46,43,40,0.8533) 75.86%,
    rgba(46,43,40,0.8893) 79.31%,
    rgba(46,43,40,0.9211) 82.76%,
    rgba(46,43,40,0.9482) 86.21%,
    rgba(46,43,40,0.9701) 89.66%,
    rgba(46,43,40,0.9864) 93.1%,
    rgba(46,43,40,0.9965) 96.55%,
    rgba(46,43,40,1.0) 100.0%);
  pointer-events:none;
}
.dissolvenza-velo{
  position:absolute;left:0;right:0;bottom:0;height:min(40vh,30rem);
  background:linear-gradient(to bottom,
    rgba(250,247,245,0.0) 0.0%,
    rgba(250,247,245,0.0035) 3.45%,
    rgba(250,247,245,0.0136) 6.9%,
    rgba(250,247,245,0.0299) 10.34%,
    rgba(250,247,245,0.0518) 13.79%,
    rgba(250,247,245,0.0789) 17.24%,
    rgba(250,247,245,0.1107) 20.69%,
    rgba(250,247,245,0.1467) 24.14%,
    rgba(250,247,245,0.1863) 27.59%,
    rgba(250,247,245,0.2292) 31.03%,
    rgba(250,247,245,0.2747) 34.48%,
    rgba(250,247,245,0.3225) 37.93%,
    rgba(250,247,245,0.372) 41.38%,
    rgba(250,247,245,0.4227) 44.83%,
    rgba(250,247,245,0.4741) 48.28%,
    rgba(250,247,245,0.5259) 51.72%,
    rgba(250,247,245,0.5773) 55.17%,
    rgba(250,247,245,0.628) 58.62%,
    rgba(250,247,245,0.6775) 62.07%,
    rgba(250,247,245,0.7253) 65.52%,
    rgba(250,247,245,0.7708) 68.97%,
    rgba(250,247,245,0.8137) 72.41%,
    rgba(250,247,245,0.8533) 75.86%,
    rgba(250,247,245,0.8893) 79.31%,
    rgba(250,247,245,0.9211) 82.76%,
    rgba(250,247,245,0.9482) 86.21%,
    rgba(250,247,245,0.9701) 89.66%,
    rgba(250,247,245,0.9864) 93.1%,
    rgba(250,247,245,0.9965) 96.55%,
    rgba(250,247,245,1.0) 100.0%);
  pointer-events:none;
}
.dissolvenza-pietra{
  position:absolute;left:0;right:0;bottom:0;height:min(40vh,30rem);
  background:linear-gradient(to bottom,
    rgba(236,233,229,0.0) 0.0%,
    rgba(236,233,229,0.0035) 3.45%,
    rgba(236,233,229,0.0136) 6.9%,
    rgba(236,233,229,0.0299) 10.34%,
    rgba(236,233,229,0.0518) 13.79%,
    rgba(236,233,229,0.0789) 17.24%,
    rgba(236,233,229,0.1107) 20.69%,
    rgba(236,233,229,0.1467) 24.14%,
    rgba(236,233,229,0.1863) 27.59%,
    rgba(236,233,229,0.2292) 31.03%,
    rgba(236,233,229,0.2747) 34.48%,
    rgba(236,233,229,0.3225) 37.93%,
    rgba(236,233,229,0.372) 41.38%,
    rgba(236,233,229,0.4227) 44.83%,
    rgba(236,233,229,0.4741) 48.28%,
    rgba(236,233,229,0.5259) 51.72%,
    rgba(236,233,229,0.5773) 55.17%,
    rgba(236,233,229,0.628) 58.62%,
    rgba(236,233,229,0.6775) 62.07%,
    rgba(236,233,229,0.7253) 65.52%,
    rgba(236,233,229,0.7708) 68.97%,
    rgba(236,233,229,0.8137) 72.41%,
    rgba(236,233,229,0.8533) 75.86%,
    rgba(236,233,229,0.8893) 79.31%,
    rgba(236,233,229,0.9211) 82.76%,
    rgba(236,233,229,0.9482) 86.21%,
    rgba(236,233,229,0.9701) 89.66%,
    rgba(236,233,229,0.9864) 93.1%,
    rgba(236,233,229,0.9965) 96.55%,
    rgba(236,233,229,1.0) 100.0%);
  pointer-events:none;
}

/* ---------- Fotografia che emerge ---------- */
.quadro{position:relative;overflow:hidden}
.quadro img{width:100%;height:100%;object-fit:cover}
/* il video vive sopra la fotografia, nello stesso identico ritaglio:
   non ha una sua taglia — eredita l'inquadratura dell'immagine */
.quadro video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
/* l'obiettivo trova il fuoco: solo dissolvenza e nitidezza, nessun movimento */
.pronta .emerge img{
  opacity:0;
  filter:blur(10px) brightness(1.03);
  transition:opacity .9s ease,filter 1.05s cubic-bezier(.25,.1,.25,1);
  will-change:filter,opacity;
}
.pronta .lcp-pronto img{opacity:1;filter:none}
.pronta .emerge.a-fuoco img,.emerge.a-fuoco img{opacity:1;filter:blur(0) brightness(1)}

/* ---------- Rivelazioni tipografiche (solo se il JS è presente) ---------- */
.pronta .sorge{opacity:0;transform:translateY(18px)}
.pronta .sorge.svelato{opacity:1;transform:none;transition:opacity 1.1s ease,transform 1.2s cubic-bezier(.22,.08,.25,1)}
.pronta .apertura-pronta .sorge{opacity:1;transform:none;transition:none}
/* le figure non si muovono: appaiono soltanto, l'immagine mette a fuoco da sé */
.pronta figure.sorge,.pronta a.sorge{opacity:1;transform:none;transition:none}

/* ---------- Navigazione ---------- */
.testata{
  position:fixed;top:0;left:0;right:0;z-index:90;
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(1.2rem,2.6vw,2rem) var(--gutter);
  transition:padding .6s ease,background .6s ease,backdrop-filter .6s ease;
}
.testata.quieta{
  padding-block:.85rem;
  background:linear-gradient(to bottom,rgba(250,247,245,.82),rgba(250,247,245,.55));
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.testata.quieta.su-scuro{
  background:linear-gradient(to bottom,rgba(46,43,40,.78),rgba(46,43,40,.5));
}
.marchio{display:flex;align-items:center;gap:.75rem;line-height:0}
.marchio svg{height:15px;width:auto;fill:currentColor}
.testata nav{display:flex;gap:clamp(1.2rem,2.6vw,2.6rem);align-items:center}
.testata nav a{
  font-size:.78rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;
  position:relative;opacity:.75;transition:opacity .4s ease;
}
.testata nav a::after{
  content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;
  background:var(--terracotta);transition:right .5s cubic-bezier(.22,.08,.25,1);
}
.testata nav a:hover,.testata nav a:focus-visible{opacity:1}
.testata nav a:hover::after,.testata nav a:focus-visible::after,.testata nav a[aria-current="page"]::after{right:0}
.testata nav a[aria-current="page"]{opacity:1}

/* menu mobile */
.apri-menu{display:none;background:none;border:0;color:inherit;font:inherit;cursor:pointer;
  font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;padding:.4rem 0}
.velo-menu{
  position:fixed;inset:0;z-index:95;display:flex;flex-direction:column;justify-content:center;
  padding:var(--gutter);gap:.4rem;
  background:rgba(46,43,40,.96);color:var(--bianco);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s;
}
.velo-menu.aperto{opacity:1;visibility:visible}
.velo-menu a{font-size:clamp(2rem,8vw,3.2rem);font-weight:100;padding-block:.35rem;letter-spacing:-.01em}
.velo-menu a span{font-family:var(--serif);font-style:italic;font-size:.55em;color:var(--terracotta);margin-right:1rem}
.velo-menu .chiudi{position:absolute;top:1.4rem;right:var(--gutter);font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;background:none;border:0;color:inherit;cursor:pointer;padding:.4rem 0}

/* ---------- Inviti (mai bottoni) ---------- */
.invito{
  display:inline-flex;align-items:baseline;gap:.9rem;
  font-size:.82rem;font-weight:400;letter-spacing:.18em;text-transform:uppercase;
  padding-bottom:.5rem;position:relative;cursor:pointer;
}
.invito::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:currentColor;opacity:.3;transition:opacity .5s ease;
}
.invito::before{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:0;
  background:var(--terracotta);transition:width .7s cubic-bezier(.22,.08,.25,1);
}
.invito:hover::before,.invito:focus-visible::before{width:100%}
.invito:hover::after{opacity:.12}
.invito .freccia{
  display:inline-block;transition:transform .6s cubic-bezier(.22,.08,.25,1);
  font-weight:300;letter-spacing:0;
}
.invito:hover .freccia{transform:translateX(6px)}

/* ---------- Filo (divisore quieto) ---------- */
.filo{border:0;height:1px;background:var(--sabbia);opacity:.7}
.scuro .filo{background:rgba(255,253,250,.14)}

/* ---------- Piè di pagina — l'ultima stanza ---------- */
.congedo{position:relative;overflow:hidden}
.congedo .griglia{row-gap:3rem}
.congedo a:not(.invito){opacity:.7;transition:opacity .4s,color .4s}
.congedo a:not(.invito):hover{opacity:1;color:var(--terracotta)}
.congedo .colofone{
  display:flex;flex-wrap:wrap;gap:1rem 2.5rem;justify-content:space-between;
  font-size:.75rem;letter-spacing:.08em;color:rgba(255,253,250,.4);
  margin-top:clamp(3rem,8vh,6rem);
}

/* ---------- Moduli ---------- */
.campo{position:relative;padding-top:1.6rem}
.campo input,.campo textarea,.campo select{
  width:100%;background:none;border:0;border-bottom:1px solid var(--sabbia);
  font:inherit;color:inherit;padding:.7rem 0;border-radius:0;
  transition:border-color .5s ease;
}
.scuro .campo input,.scuro .campo textarea{border-bottom-color:rgba(255,253,250,.2)}
.campo input:focus,.campo textarea:focus{outline:none;border-bottom-color:var(--terracotta)}
.campo label{
  position:absolute;top:0;left:0;
  font-size:.6875rem;letter-spacing:.28em;text-transform:uppercase;color:var(--nero-60);
}
.scuro .campo label{color:rgba(255,253,250,.5)}
.campo textarea{resize:vertical;min-height:7rem}

/* ---------- Accessibilità ---------- */
:focus-visible{outline:1.5px solid var(--terracotta);outline-offset:4px}
.salta{
  position:absolute;left:-9999px;top:0;z-index:200;background:var(--nero);color:var(--bianco);
  padding:.8rem 1.4rem;font-size:.8rem;letter-spacing:.1em;
}
.salta:focus{left:0}

/* ---------- Transizione di pagina ---------- */
.sipario{
  position:fixed;inset:0;z-index:150;pointer-events:none;
  background:var(--velo);opacity:0;transition:opacity .5s ease;
}
body.esce .sipario{opacity:1;pointer-events:all}
.scuro-sipario .sipario{background:var(--nero)}

/* ---------- Movimento ridotto ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .sorge{opacity:1;transform:none;transition:none}
  .emerge img,.pronta .emerge img{opacity:1;filter:none;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.2s!important}
}

/* ---------- Composizione reattiva ---------- */
@media (min-width:601px) and (max-width:1024px){
  .ingresso{min-height:92svh;justify-content:flex-start;padding-top:clamp(2.5rem,6vh,4rem)}
  .ingresso .involucro{margin-top:clamp(1.5rem,4vh,3rem)}
}
@media (max-width:900px){
  .testata nav{display:none}
  .apri-menu{display:block}
  .griglia{grid-template-columns:repeat(6,1fr)}
}
@media (min-width:601px) and (max-width:900px){
  main .griglia.cap > figure[style*="grid-column"]{grid-column:1/span 6!important}
  main .griglia.cap > figure[style*="grid-column:7"],
  main .griglia.cap > figure[style*="grid-column:8"],
  main .griglia.cap > figure[style*="grid-column:9"]{grid-column:2/span 5!important}
  main .griglia.cap > figure[style*="grid-column:2"],
  main .griglia.cap > figure[style*="grid-column:3"]{grid-column:1/span 5!important}
  .congedo .griglia > *:nth-child(1){grid-column:1/span 4}
  .congedo .griglia > *:nth-child(2){grid-column:5/span 2}
  .congedo .griglia > *:nth-child(3){grid-column:1/span 4}
  .congedo .griglia > *:nth-child(4){grid-column:5/span 2}
}
@media (max-width:600px){
  body{font-size:1rem}
  .pronta .emerge img{
    filter:blur(7px) brightness(1.02);
    transition:opacity .55s ease,filter .65s cubic-bezier(.25,.1,.25,1);
  }
  .pronta .emerge.a-fuoco img{opacity:1;filter:blur(0) brightness(1)}
  .pronta .sorge.svelato{transition:opacity .55s ease,transform .65s cubic-bezier(.22,.08,.25,1)}
  .griglia{grid-template-columns:repeat(4,1fr);column-gap:1rem}
  .stanza{padding-block:clamp(4.5rem,12vh,7rem)}
  .etichetta{letter-spacing:.22em;font-size:.65rem}
  main .griglia.cap > figure[style*="grid-column"]{grid-column:1/span 4!important}
  main .griglia.cap > figure[style*="grid-column:7"],
  main .griglia.cap > figure[style*="grid-column:8"],
  main .griglia.cap > figure[style*="grid-column:9"]{grid-column:2/span 3!important}
  main .griglia.cap > figure[style*="grid-column:2"],
  main .griglia.cap > figure[style*="grid-column:3"]{grid-column:1/span 3!important}
}

/* ============================================================
   PROGETTI — sistema dinamico .project-*
   Le sezioni arrivano dal content model; ogni layout_variant
   ha le sue regole. Mobile-first, nessuna sovrapposizione.
   ============================================================ */

.project-page .stanza{padding-block:clamp(4.5rem,11vh,9rem)}
.project-page .stanza:has(> .dissolvenza-giu),
.project-page .stanza:has(> .dissolvenza-velo),
.project-page .stanza:has(> .dissolvenza-pietra){
  padding-bottom:calc(min(40vh,30rem) + clamp(2rem,5vh,4rem));
}

/* hero */
.project-hero{min-height:92svh;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;background:var(--nero);color:var(--bianco)}
.project-hero__media{position:absolute;inset:0}
.project-hero__media img{width:100%;height:100%;object-fit:cover;opacity:.85}
.project-hero .velame{position:absolute;inset:0;background:linear-gradient(to top,rgba(46,43,40,.92) 0%,rgba(46,43,40,.25) 45%,rgba(46,43,40,.35) 100%)}
.project-hero__content{position:relative;z-index:2;padding-bottom:clamp(3rem,9vh,6rem)}
.project-hero__tagline{margin-top:1rem;font-size:clamp(1.15rem,2.4vw,1.7rem);color:rgba(255,253,250,.78);max-width:26em}
.project-meta{display:flex;gap:clamp(1.6rem,6vw,5rem);flex-wrap:wrap;margin-top:clamp(2rem,5vh,3rem)}
.project-meta dt{font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,253,250,.45);margin-bottom:.4rem}
.project-meta dd{color:rgba(255,253,250,.85);font-size:.9rem;max-width:24em}

/* media base: proporzione naturale, mai crop in altezza, mai oltre una schermata */
.project-media .quadro{aspect-ratio:auto}
.project-media img,.project-media video{
  display:block;width:auto;height:auto;max-width:100%;
  max-height:min(72vh,46rem);
  object-fit:contain;object-position:left center;
}
.project-media__caption{margin-top:1rem;font-size:.6875rem;letter-spacing:.28em;text-transform:uppercase;color:var(--nero-60);max-width:38em}
.scuro .project-media__caption{color:rgba(255,253,250,.5)}

/* text-only: colonna editoriale, nessun vuoto sproporzionato */
.project-section__copy--editorial{max-width:none}
.project-section__copy--editorial .titolo{max-width:18em}
.project-section__copy--editorial .project-section__body{max-width:38em}
@media(min-width:900px){
  .project-section__copy--editorial{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,2.4vw,2.5rem)}
  .project-section__copy--editorial>*{grid-column:2/span 9}
  .project-section__copy--editorial .project-section__body{grid-column:2/span 7}
}

/* text-media / media-text */
.project-section__grid{row-gap:2.5rem;align-items:start}
.project-section__grid .project-section__copy{grid-column:1/span 6}
.project-section__grid .project-section__media{grid-column:1/span 6}
@media(min-width:900px){
  .project-section__grid--text-media .project-section__copy{grid-column:1/span 5}
  .project-section__grid--text-media .project-section__media{grid-column:7/span 6}
  .project-section__grid--media-text .project-section__media{grid-column:1/span 6;order:1}
  .project-section__grid--media-text .project-section__copy{grid-column:8/span 5;order:2}
}
@media(max-width:600px){
  .project-section__grid .project-section__copy,
  .project-section__grid .project-section__media{grid-column:1/span 4}
}

/* coppie: mai stacking casuale, offset solo da 900px in su */
.project-media-pair{display:grid;grid-template-columns:1fr;gap:clamp(1.6rem,4vw,2.5rem);margin-top:clamp(2rem,5vh,3.5rem)}
.project-section--split-media .project-section__copy,
.project-section--paired-portrait .project-section__copy,
.project-section--paired-landscape .project-section__copy{max-width:44em}
@media(min-width:700px){
  .project-media-pair{grid-template-columns:1fr 1fr;align-items:end}
  .project-media-pair--split-media .project-media-pair__item--secondo{margin-top:clamp(2rem,6vh,4rem);align-self:start}
  .project-media-pair--paired-portrait{align-items:end}
  .project-media-pair--paired-landscape{align-items:start}
}

/* gallerie leggere */
.project-media-grid{display:grid;grid-template-columns:1fr;gap:clamp(1.4rem,3.5vw,2.4rem);margin-top:clamp(2rem,5vh,3.5rem)}
@media(min-width:600px){.project-media-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){
  .project-media-grid--leggera{grid-template-columns:1fr 1fr 1fr}
  .project-media-grid--sequenza{grid-template-columns:repeat(4,1fr)}
  .project-media-grid--sequenza .project-media img{max-height:min(40vh,26rem)}
}

/* quote */
.project-quote{color:inherit}
.scuro .project-quote{color:rgba(255,253,250,.8)}
.project-quote__media{max-width:min(100%,880px);margin-inline:auto}
.project-quote__media .project-media img{margin-inline:auto;object-position:center}

/* prossimo progetto */
.prossimo{display:block;position:relative;overflow:hidden;min-height:56svh}
.prossimo img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.4s cubic-bezier(.22,.08,.25,1)}
.prossimo:hover img{transform:scale(1.02)}
.prossimo .velame{position:absolute;inset:0;background:rgba(46,43,40,.55);transition:background .8s ease}
.prossimo:hover .velame{background:rgba(46,43,40,.4)}
.prossimo .dentro{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--bianco);text-align:center;z-index:2;padding-inline:var(--gutter)}

/* archivio — griglia leggera stile indice, thumb contenute, lightbox sobrio */
.project-archive{background:var(--pietra)}
.project-archive__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(.8rem,2vw,1.6rem)}
@media(min-width:700px){.project-archive__grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1100px){.project-archive__grid{grid-template-columns:repeat(4,1fr)}}
.project-archive__item{display:block;overflow:hidden;background:var(--sabbia);border:0;padding:0;width:100%;font:inherit;color:inherit;cursor:pointer;text-align:left}
.project-archive__item img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:opacity .5s ease,transform 1.2s cubic-bezier(.22,.08,.25,1)}
.project-archive__item:hover img{opacity:.88;transform:scale(1.015)}
.project-archive__item img,.visore img{-webkit-user-drag:none;user-select:none}

/* lightbox */
.visore{position:fixed;inset:0;z-index:120;background:rgba(46,43,40,.96);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility .45s}
.visore.aperto{opacity:1;visibility:visible}
.visore img{max-width:min(92vw,1600px);max-height:86vh;width:auto;height:auto;object-fit:contain}
.visore__chiudi,.visore__freccia{position:absolute;background:none;border:0;color:rgba(255,253,250,.75);font:inherit;cursor:pointer;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;padding:1rem;transition:color .3s}
.visore__chiudi:hover,.visore__freccia:hover{color:var(--terracotta)}
.visore__chiudi{top:1.2rem;right:var(--gutter)}
.visore__freccia--prev{left:var(--gutter);top:50%;transform:translateY(-50%);font-size:1.6rem;font-weight:100;letter-spacing:0}
.visore__freccia--next{right:var(--gutter);top:50%;transform:translateY(-50%);font-size:1.6rem;font-weight:100;letter-spacing:0}
.visore__conta{position:absolute;bottom:1.6rem;left:50%;transform:translateX(-50%);font-size:.7rem;letter-spacing:.3em;color:rgba(255,253,250,.45)}

/* video showroom / progetto */
.showroom-video{position:relative;overflow:hidden}
.showroom-video video{display:block;width:100%;height:auto;max-height:min(78vh,50rem);object-fit:cover}
.showroom-video--contenuto video{max-width:880px;margin-inline:auto}
@media (prefers-reduced-motion:reduce){
  .showroom-video video{display:none}
  .showroom-video .poster-fallback{display:block!important}
}

/* ---------- Cookie banner — minimale ---------- */
.cookie-banner{
  position:fixed;right:1.2rem;bottom:1.2rem;z-index:200;
  width:min(calc(100vw - 2.4rem),30rem);
  background:var(--nero);color:var(--bianco);
  padding:1.4rem 1.6rem;border-radius:2px;
  box-shadow:0 1.2rem 3rem rgba(0,0,0,.28);
  display:flex;flex-direction:column;gap:1.1rem;
  opacity:0;transform:translateY(1rem);pointer-events:none;
  transition:opacity .5s cubic-bezier(.22,.08,.25,1),transform .5s cubic-bezier(.22,.08,.25,1);
}
.cookie-banner--visibile{opacity:1;transform:translateY(0);pointer-events:auto}
.cookie-banner__testo{font-size:.85rem;line-height:1.6;color:rgba(255,253,250,.75);margin:0}
.cookie-banner__testo a{color:var(--bianco);text-decoration:underline;text-underline-offset:.2em}
.cookie-banner__azioni{display:flex;gap:1rem;justify-content:flex-end}
.cookie-banner__azioni button{
  font-family:inherit;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  padding:.7rem 1.3rem;border-radius:1px;cursor:pointer;border:1px solid rgba(255,253,250,.3);
  background:none;color:var(--bianco);transition:background .3s,border-color .3s,opacity .3s;
}
.cookie-banner__accetta{background:var(--terracotta);border-color:var(--terracotta);color:var(--nero)}
.cookie-banner__accetta:hover{opacity:.88}
.cookie-banner__rifiuta:hover{border-color:rgba(255,253,250,.7)}
@media(max-width:600px){
  .cookie-banner{left:.8rem;right:.8rem;bottom:.8rem;padding:1.2rem}
  .cookie-banner__azioni{justify-content:stretch}
  .cookie-banner__azioni button{flex:1}
}