:root{
  --black:#090909;
  --paper:#f2efe8;
  --ink:#0a0a0a;
  --red:#e84a36;
  --muted:#a7a39b;
  --line:#292929;
  --gap:12px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:#f5f2ec;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:auto}
figure{margin:0}
.eyebrow{margin:0;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.kicker{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}

.site-header{height:82px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;background:var(--paper);color:#111;position:relative;z-index:50;border-bottom:1px solid rgba(0,0,0,.08)}
.brand{display:flex;gap:12px;align-items:center;font-weight:800;letter-spacing:.04em}
.brand img{width:25px;height:34px;object-fit:contain}
.nav{display:flex;gap:31px;font-size:11px;font-weight:800;letter-spacing:.1em}
.nav a{position:relative;padding:8px 0}
.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:1px;height:1px;background:currentColor;transition:right .2s ease}
.nav a:hover:after,.nav a.active:after{right:0}
.menu-toggle{display:none;border:0;background:none;color:inherit;font:inherit;font-size:11px;font-weight:800;letter-spacing:.1em}

/* HOME */
.hero{height:calc(100vh - 82px);min-height:650px;position:relative;overflow:hidden;background:#000}
.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;image-rendering:auto}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.38),rgba(0,0,0,.05) 55%,rgba(0,0,0,.12))}
.hero-copy{position:absolute;left:4.5vw;bottom:12.5vh;max-width:800px}
.hero h1{font-size:clamp(70px,9.2vw,148px);line-height:.78;margin:22px 0 23px;letter-spacing:-.068em}
.hero-role{font-size:clamp(10px,.82vw,13px);font-weight:800;letter-spacing:.19em;margin:0 0 34px}
.text-link{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.14em;border-bottom:1px solid;padding-bottom:7px}
.hero-credit{position:absolute;right:4vw;bottom:4vh;display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right;font-size:9px;letter-spacing:.08em}
.hero-credit strong{font-size:10px}.hero-credit span{font-weight:600;opacity:.82}

.home-intro{padding:13vh 8vw 9vh;display:grid;grid-template-columns:170px minmax(420px,1.55fr) minmax(240px,.65fr);gap:4vw;align-items:start;border-top:1px solid rgba(255,255,255,.14)}
.home-intro h2{font-size:clamp(50px,6.5vw,98px);line-height:.9;letter-spacing:-.055em;margin:0}
.home-intro>p:last-child{font-size:15px;line-height:1.55;border-left:1px solid rgba(255,255,255,.24);padding-left:22px;margin:3px 0 0}

.preview-gallery{padding:0 4vw 7vh}
.preview-gallery .full{width:94%;margin:0 auto var(--gap)}
.preview-gallery .pair{width:94%;margin:0 auto var(--gap);display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start}
.preview-gallery img{width:100%;height:auto;object-fit:contain}
.preview-caption{width:94%;margin:26px auto 0;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:18px;font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}

.project-teaser{background:var(--paper);color:var(--ink);padding:11vh 5vw;display:grid;grid-template-columns:.95fr 1.25fr;gap:6vw;align-items:center}
.project-teaser h2{font-size:clamp(64px,8vw,126px);line-height:.78;letter-spacing:-.067em;margin:4vh 0 2.5vh}
.project-teaser .intro{font-size:16px;line-height:1.5;max-width:480px;margin:0 0 34px}
.project-teaser .media img{width:100%;height:auto;object-fit:contain}
.project-teaser .meta{margin-top:12px;display:flex;justify-content:space-between;font-size:9px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}

.home-links{padding:11vh 8vw;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.home-card{border-top:1px solid var(--line);padding:22px 0 5vh;min-height:210px;display:flex;flex-direction:column;justify-content:space-between}
.home-card h3{font-size:clamp(38px,4.8vw,72px);letter-spacing:-.05em;line-height:.9;margin:20px 0}
.home-card p{font-size:14px;line-height:1.5;max-width:430px;color:#d0cdc7}
.home-card .go{font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}

.contact-strip{background:var(--red);color:#090909;padding:8vh 8vw;display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:end}
.contact-strip h2{font-size:clamp(50px,6.8vw,104px);line-height:.86;letter-spacing:-.06em;margin:20px 0 0}
.contact-strip .contacts{display:flex;flex-direction:column;align-items:flex-start;gap:14px;font-weight:800;font-size:16px}
.contact-strip .contacts a{border-bottom:1px solid currentColor;padding-bottom:4px}

/* GENERIC PAGE */
.page-head{padding:13vh 8vw 10vh;border-bottom:1px solid var(--line);display:grid;grid-template-columns:170px minmax(420px,1.55fr) minmax(240px,.65fr);gap:4vw;align-items:start}
.page-head h1{font-size:clamp(70px,9vw,140px);line-height:.78;letter-spacing:-.07em;margin:0}
.page-head .lead{font-size:16px;line-height:1.55;border-left:1px solid rgba(255,255,255,.24);padding-left:22px;margin:3px 0 0}
.page-head.paper{background:var(--paper);color:var(--ink);border-bottom:1px solid rgba(0,0,0,.12)}
.page-head.paper .lead{border-left-color:rgba(0,0,0,.22)}

/* WORK */
.work-gallery{padding:5vh 4vw 10vh}
.work-gallery .full,.project-gallery .full{width:94%;margin:0 auto var(--gap)}
.work-gallery .pair,.project-gallery .pair{width:94%;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start;margin:0 auto var(--gap)}
.work-gallery .portrait-pair{width:78%;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start;margin:0 auto var(--gap)}
.work-gallery img,.project-gallery img{width:100%;height:auto;object-fit:contain}
.gallery-divider{width:94%;margin:8vh auto 5vh;padding-top:18px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr 1fr;gap:3vw;font-size:9px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.gallery-divider span:nth-child(2){text-align:center}.gallery-divider span:last-child{text-align:right}
.next-project{background:var(--paper);color:var(--ink);padding:9vh 8vw;display:grid;grid-template-columns:1fr auto;gap:4vw;align-items:end}
.next-project h2{font-size:clamp(48px,6vw,92px);line-height:.85;letter-spacing:-.06em;margin:20px 0 0}
.next-project .arrow{font-size:40px;line-height:1}

/* PROJECT */
.project-lead{background:var(--paper);color:var(--ink);padding:10vh 5vw;display:grid;grid-template-columns:.9fr 1.2fr;gap:6vw;align-items:center}
.project-lead h1{font-size:clamp(64px,8.5vw,132px);line-height:.77;letter-spacing:-.07em;margin:4vh 0 3vh}
.project-lead .project-desc{font-size:16px;line-height:1.55;max-width:490px}
.project-lead .project-image img{width:100%;height:auto;object-fit:contain}
.project-lead .project-image .meta{display:flex;justify-content:space-between;margin-top:12px;font-size:9px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.project-intro{padding:11vh 8vw 8vh;display:grid;grid-template-columns:170px minmax(420px,1.55fr) minmax(240px,.65fr);gap:4vw;align-items:start}
.project-intro h2{font-size:clamp(48px,6vw,90px);line-height:.89;letter-spacing:-.055em;margin:0}
.project-intro .lead{font-size:15px;line-height:1.6;border-left:1px solid rgba(255,255,255,.24);padding-left:22px;margin:3px 0 0}
.project-gallery{padding:0 4vw 10vh}
.project-gallery .portrait-pair{width:78%;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start;margin:0 auto var(--gap)}
.project-end{padding:6vh 4vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}

/* ABOUT */
.about-hero{background:var(--paper);color:var(--ink);padding:12vh 8vw 10vh}
.about-hero .eyebrow{margin-bottom:38px}
.about-grid{display:grid;grid-template-columns:1fr .86fr;gap:8vw;align-items:start}
.about-grid h1{font-size:clamp(66px,8.8vw,136px);line-height:.79;letter-spacing:-.07em;margin:0}
.about-copy{font-size:20px;line-height:1.5;margin-top:6px}
.about-copy p:first-child{margin-top:0}
.about-photo{padding:0 8vw 12vh;background:var(--paper);color:var(--ink)}
.about-photo figure{width:86%;margin-left:auto}
.about-photo img{width:100%;height:auto;object-fit:contain}
.about-notes{padding:10vh 8vw;display:grid;grid-template-columns:repeat(3,1fr);gap:4vw}
.about-note{border-top:1px solid var(--line);padding-top:18px}
.about-note h3{font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 16px}
.about-note p{font-size:15px;line-height:1.55;color:#d2cec7;margin:0}

/* CONTACT */
.contact-page{min-height:calc(100vh - 82px);background:var(--red);color:#090909;padding:11vh 8vw 8vh;display:grid;grid-template-columns:1.35fr .65fr;gap:7vw;align-items:end}
.contact-page h1{font-size:clamp(76px,11vw,170px);line-height:.73;letter-spacing:-.075em;margin:38px 0}
.contact-page .details{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding-bottom:2vh}
.contact-page .details a{font-size:clamp(18px,2vw,28px);font-weight:800;border-bottom:2px solid currentColor;padding-bottom:5px}
.contact-page .details p{font-size:14px;line-height:1.55;margin:20px 0 0;max-width:420px}

footer{padding:30px 4vw;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
footer.paper{background:var(--paper);color:var(--ink)}

@media(max-width:800px){
  :root{--gap:8px}
  .site-header{height:68px;padding:0 5vw}.nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--paper);color:#111;padding:30px 5vw;flex-direction:column;gap:20px;border-top:1px solid rgba(0,0,0,.08)}.nav.open{display:flex}.menu-toggle{display:block}
  .hero{height:calc(100svh - 68px);min-height:560px}.hero-image{object-position:56% 50%}.hero-shade{background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.1) 45%,rgba(0,0,0,.62))}.hero-copy{left:6vw;right:6vw;bottom:10vh}.hero h1{font-size:19vw}.hero-role{font-size:9px;line-height:1.55}.hero-credit{display:none}
  .home-intro,.page-head,.project-intro{grid-template-columns:1fr;padding:10vh 6vw 8vh}.home-intro h2,.page-head h1,.project-intro h2{margin:18px 0}.home-intro>p:last-child,.page-head .lead,.project-intro .lead{margin-top:5px}
  .preview-gallery,.work-gallery,.project-gallery{padding-left:3vw;padding-right:3vw}.preview-gallery .full,.preview-gallery .pair,.work-gallery .full,.work-gallery .pair,.work-gallery .portrait-pair,.project-gallery .full,.project-gallery .pair,.project-gallery .portrait-pair,.gallery-divider{width:100%}.preview-gallery .pair,.work-gallery .pair,.project-gallery .pair{grid-template-columns:1fr}.work-gallery .portrait-pair,.project-gallery .portrait-pair{width:100%;grid-template-columns:1fr 1fr}.preview-caption{width:100%}
  .project-teaser,.project-lead{grid-template-columns:1fr;padding:9vh 5vw}.project-teaser h2,.project-lead h1{font-size:18vw}.project-teaser .media,.project-lead .project-image{margin-top:3vh}
  .home-links{grid-template-columns:1fr;padding:9vh 6vw}.home-card{min-height:170px}.contact-strip{grid-template-columns:1fr;padding:9vh 6vw}.contact-strip .contacts{margin-top:4vh}
  .gallery-divider{grid-template-columns:1fr 1fr}.gallery-divider span:nth-child(2){text-align:right}.gallery-divider span:last-child{display:none}.next-project{padding:8vh 6vw}
  .about-hero{padding:10vh 6vw 8vh}.about-grid{grid-template-columns:1fr}.about-copy{font-size:17px}.about-photo{padding:0 6vw 10vh}.about-photo figure{width:100%}.about-notes{grid-template-columns:1fr;padding:9vh 6vw;gap:6vh}
  .contact-page{min-height:calc(100svh - 68px);grid-template-columns:1fr;padding:9vh 6vw}.contact-page h1{font-size:20vw}.contact-page .details{padding-top:5vh}
  footer{gap:20px;flex-direction:column}
}


/* V17 — editorial home: clear hierarchy, no clipped typography */
.nav .portfolio-nav{
  font-weight:900;
  position:relative;
}
.nav .portfolio-nav::before{
  content:"";
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--red);
  position:absolute;
  left:-11px;
  top:50%;
  transform:translateY(-50%);
}

/* PORTFOLIO portal */
.home-portfolio{
  background:var(--paper);
  color:var(--ink);
  padding:9vh 4vw 10vh;
}
.home-portfolio-header{
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-areas:
    "eyebrow open"
    "title title";
  gap:1.7vh 3vw;
  align-items:end;
  padding-bottom:4.5vh;
  border-bottom:1px solid rgba(0,0,0,.18);
}
.home-portfolio-header .eyebrow{
  grid-area:eyebrow;
  margin:0;
}
.home-portfolio-header h2{
  grid-area:title;
  margin:0;
  font-size:clamp(76px,12.1vw,188px);
  line-height:.76;
  letter-spacing:-.078em;
  font-weight:800;
  white-space:nowrap;
}
.home-portfolio-open{
  grid-area:open;
  justify-self:end;
  font-size:9px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
  padding-bottom:4px;
  border-bottom:1px solid currentColor;
}
.home-portfolio-open span{display:inline-block;margin-left:12px}

.home-portfolio-body{
  display:grid;
  grid-template-columns:minmax(220px,.42fr) minmax(0,1.58fr);
  gap:5vw;
  align-items:end;
  padding-top:5vh;
}
.home-portfolio-copy{
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding-bottom:2px;
}
.home-portfolio-kicker{
  margin:0 0 12px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.home-portfolio-copy>p:not(.home-portfolio-kicker){
  margin:0;
  max-width:310px;
  font-size:16px;
  line-height:1.48;
}
.home-portfolio-meta{
  margin-top:auto;
  padding-top:9vh;
  display:flex;
  justify-content:space-between;
  gap:18px;
  border-top:1px solid rgba(0,0,0,.18);
  font-size:8px;
  font-weight:800;
  letter-spacing:.14em;
}
.home-portfolio-visual{
  display:block;
  min-width:0;
}
.home-portfolio-visual img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}
.home-image-caption{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-top:10px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}

/* Ongoing project: intentionally simpler than portfolio */
.home-project{
  background:#090909;
  color:var(--paper);
  padding:10vh 4vw;
  display:grid;
  grid-template-columns:minmax(350px,.72fr) minmax(0,1.28fr);
  gap:6vw;
  align-items:center;
  border-top:1px solid var(--line);
}
.home-project-copy{
  max-width:620px;
}
.home-project-copy .eyebrow{margin:0 0 5vh}
.home-project-copy h2{
  margin:0;
  display:flex;
  flex-direction:column;
  font-size:clamp(62px,7.8vw,116px);
  line-height:.76;
  letter-spacing:-.072em;
  font-weight:800;
}
.home-project-copy h2 span{display:block}
.home-project-desc{
  margin:4vh 0 0;
  max-width:430px;
  font-size:15px;
  line-height:1.55;
  color:rgba(247,244,237,.78);
}
.home-project-link{
  display:inline-flex;
  gap:22px;
  align-items:center;
  margin-top:4.5vh;
  padding-bottom:6px;
  border-bottom:1px solid rgba(247,244,237,.55);
  font-size:9px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.home-project-visual{
  display:block;
  min-width:0;
}
.home-project-visual img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}
.home-project-caption{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-top:10px;
  border-top:1px solid rgba(247,244,237,.22);
  font-size:8px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

/* Footer remains the only bottom closing element */
footer{
  min-height:auto;
  padding-top:28px;
  padding-bottom:28px;
}

/* Portfolio page title: powerful but always contained */
.portfolio-head h1{
  font-size:clamp(66px,8.2vw,126px);
  white-space:nowrap;
  letter-spacing:-.072em;
}

@media (max-width:1100px){
  .home-portfolio-header h2{
    font-size:clamp(70px,11.7vw,132px);
  }
  .home-project{
    grid-template-columns:minmax(310px,.8fr) minmax(0,1.2fr);
    gap:4vw;
  }
}

@media (max-width:800px){
  .nav .portfolio-nav::before{display:none}

  .home-portfolio{
    padding:8vh 5vw;
  }
  .home-portfolio-header{
    grid-template-columns:1fr;
    grid-template-areas:
      "eyebrow"
      "title"
      "open";
    gap:2vh;
    padding-bottom:3.5vh;
  }
  .home-portfolio-header h2{
    font-size:17vw;
    line-height:.82;
    white-space:normal;
  }
  .home-portfolio-open{
    justify-self:start;
    margin-top:1vh;
  }
  .home-portfolio-body{
    grid-template-columns:1fr;
    gap:5vh;
    padding-top:4vh;
  }
  .home-portfolio-copy{
    order:2;
  }
  .home-portfolio-meta{
    margin-top:4vh;
    padding-top:2vh;
  }

  .home-project{
    grid-template-columns:1fr;
    gap:5vh;
    padding:8vh 5vw;
  }
  .home-project-copy h2{
    font-size:17vw;
  }
  .home-project-visual{
    order:-1;
  }

  .portfolio-head h1{
    white-space:normal;
    font-size:18vw;
  }
}


/* V18 — CTA più visibili + titoli cliccabili */
.section-title-link{
  color:inherit;
  text-decoration:none;
  position:relative;
  display:inline-flex;
  align-items:flex-start;
  gap:.12em;
}
.section-title-link .title-arrow{
  font-size:.18em;
  line-height:1;
  margin-top:.08em;
  opacity:.5;
  transform:translate(0,0);
  transition:opacity .2s ease, transform .2s ease;
}
.section-title-link:hover .title-arrow{
  opacity:1;
  transform:translate(.18em,-.18em);
}
.section-title-link::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-.08em;
  width:0;
  height:2px;
  background:currentColor;
  transition:width .28s ease;
}
.section-title-link:hover::after{width:100%}

.project-title-link{
  display:inline-flex;
  flex-direction:column;
  gap:0;
}
.project-title-link .title-arrow{
  position:absolute;
  top:.03em;
  right:-.42em;
}

.cta-pill{
  display:inline-flex !important;
  align-items:center;
  justify-content:space-between;
  gap:26px;
  min-width:220px;
  padding:15px 18px !important;
  border:1px solid currentColor !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:.15em !important;
  line-height:1 !important;
  text-transform:uppercase;
  transition:
    background-color .2s ease,
    color .2s ease,
    transform .2s ease,
    border-color .2s ease !important;
}
.cta-pill .cta-arrow{
  font-size:16px;
  line-height:1;
  transition:transform .2s ease;
}
.cta-pill:hover .cta-arrow{
  transform:translate(4px,-4px);
}
.cta-pill:hover{
  transform:translateY(-2px);
}

.cta-dark{
  color:var(--ink);
  background:transparent;
}
.cta-dark:hover{
  background:var(--ink);
  color:var(--paper);
  border-color:var(--ink) !important;
}

.cta-light{
  color:var(--paper);
  background:transparent;
}
.cta-light:hover{
  background:var(--paper);
  color:var(--ink);
  border-color:var(--paper) !important;
}

/* Let the title do more of the navigation work */
.home-portfolio-header h2,
.home-project-copy h2{
  cursor:pointer;
}

@media(max-width:800px){
  .cta-pill{
    width:100%;
    min-width:0;
    padding:16px 18px !important;
  }
  .section-title-link .title-arrow{
    font-size:.22em;
  }
  .project-title-link .title-arrow{
    right:-.34em;
  }
}


/* V19 — Portfolio ampliato: più immagini, ritmo più compatto */
.work-gallery{
  padding-top:4vh;
}
.work-gallery .gallery-divider{
  margin-top:6vh;
  margin-bottom:4vh;
}
@media(max-width:800px){
  .work-gallery .gallery-divider{
    margin-top:5vh;
    margin-bottom:3vh;
  }
}

/* V20 Production */
picture{display:block;max-width:100%}picture img{max-width:100%}
a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:4px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}