/* Shared interaction and responsive layer. */
:root{--ease-ui:cubic-bezier(.22,1,.36,1);--nav-h:100px}
html{scroll-padding-top:110px}
body{overflow-x:clip}
a,button,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--yellow);outline-offset:6px}
nav:focus-within{transform:none!important}
.n-links a{display:flex;align-items:center;min-height:44px}
.n-links a[aria-current]{text-decoration:underline;text-underline-offset:7px}
.n-logo{flex-shrink:0}
.text-link{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding:12px 0;white-space:nowrap}
.selected-work{padding:var(--sec-y-sm) var(--pad-x)!important;height:auto!important;min-height:0!important;overflow:visible!important}
.selected-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:48px}
.selected-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 28px}
.selected-card{display:block;color:var(--fg);text-decoration:none;min-width:0}
.selected-media{position:relative;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:var(--card-tone);color:var(--ink);display:grid;place-items:center}
.selected-media img{width:100%;height:100%;object-fit:cover;transition:transform .65s var(--ease-ui)}
.project-monogram{font-family:'New Title',sans-serif;font-weight:700;font-size:clamp(48px,7vw,108px);line-height:.95;padding:24px;text-align:center;overflow-wrap:anywhere}
.project-open{position:absolute;right:20px;bottom:20px;width:46px;height:46px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;font:26px sans-serif;transition:transform .3s var(--ease-ui)}
.selected-meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:18px}
.selected-meta h3{font-family:'New Title',sans-serif;font-size:clamp(28px,3vw,44px);line-height:1}
.selected-meta>span{font-size:12px;text-align:right}
@media(hover:hover){.selected-card:hover img{transform:scale(1.035)}.selected-card:hover .project-open{transform:rotate(45deg)}.contact-tile:hover{transform:translateY(-4px);background:var(--paper);color:var(--ink)}}
.motion-ready .selected-card{opacity:0;transform:translateY(24px);transition:opacity .65s var(--ease-ui),transform .65s var(--ease-ui)}
.motion-ready .selected-card.is-visible{opacity:1;transform:none}
.accessible-process{width:100%;max-width:1100px;margin:auto}
.accessible-process details{border-top:1px solid var(--sep)}
.accessible-process details:last-child{border-bottom:1px solid var(--sep)}
.accessible-process summary{list-style:none;display:flex;gap:32px;align-items:center;padding:28px 0;cursor:pointer;font:700 clamp(32px,5vw,64px)/1 'New Title',sans-serif}
.accessible-process summary::-webkit-details-marker{display:none}
.step-number{font:500 14px/1 'DM Sans',sans-serif;opacity:.75}
.step-plus{margin-left:auto;transition:transform .25s var(--ease-ui)}
[open] .step-plus{transform:rotate(45deg)}
.accessible-process p{max-width:680px;margin:0 40px 32px 54px;font-size:clamp(17px,2vw,21px);line-height:1.65}
#t1Stage.quote-rail{position:relative;display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;height:auto;min-height:0;width:100%;padding:8px 4px 24px;scrollbar-width:thin}
.quote-rail .t1-card{position:relative;inset:auto;flex:0 0 min(480px,86%);width:auto;height:auto;min-height:320px;transform:none!important;scroll-snap-align:start;cursor:auto;touch-action:pan-x pan-y;will-change:auto;padding:28px}
.contact-intro{font-size:clamp(18px,2vw,24px);line-height:1.6;margin-bottom:32px}
.contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.contact-tile{color:inherit;display:grid;grid-template-columns:1fr auto;gap:22px 10px;padding:28px;border:1px solid var(--sep);border-radius:16px;text-decoration:none;transition:transform .3s var(--ease-ui),background .3s,color .3s;min-width:0}
.contact-tile>span:first-child{grid-column:1/-1;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.contact-tile strong{font:700 clamp(24px,2.6vw,38px)/1.1 'New Title',sans-serif;overflow-wrap:anywhere}
.contact-tile>span:last-child{align-self:end;font-size:24px}
footer a{display:inline-flex;align-items:center;min-height:44px}
.pj-title,.sec-title{overflow-wrap:normal}
img,video{max-width:100%}
@media(max-width:900px){
 :root{--nav-h:80px;--pad-x:24px;--sec-y:88px;--sec-y-sm:64px;--gap:24px}
 nav#nav{padding:12px var(--pad-x);height:80px;background:var(--bg);color:var(--fg);opacity:1!important;transform:none!important;mix-blend-mode:normal}
 #nav .n-links{display:flex;gap:18px;margin-left:auto}
 #nav .n-links a{font-size:13px;color:var(--fg);letter-spacing:0}
 #nav .n-dot,#nav .mag{display:none}
 #nav .n-logo{width:46px;height:46px}
 #cur-dot,#cur-ring,#cursor-trail{display:none!important}
 body{cursor:auto!important}a,button,summary{cursor:pointer!important}
 #hero{height:auto;min-height:100svh;overflow:hidden;padding-bottom:28px}
 #heroStage{position:relative;inset:auto;min-height:calc(100svh - 28px);grid-template-rows:auto 1fr auto;padding-top:100px}
 .hero-row{gap:18px;padding-top:28px;padding-bottom:28px}
 .hero-figure{height:clamp(210px,31svh,340px)}
 #me{max-height:100%!important;height:100%}
 .hero-side{font-size:clamp(24px,7vw,38px)!important;line-height:1}
 .h-bot{padding:0 var(--pad-x)!important;opacity:1!important}
 #chip-field{justify-content:center;gap:8px}
 .chip{font-size:12px;padding:8px 12px;border-width:2px;cursor:grab}
 .h-scr-inline{display:none}
 .selected-heading{align-items:start;flex-direction:column;margin-bottom:30px}
 .selected-grid{gap:36px 20px}
 .selected-meta{align-items:start;flex-direction:column;gap:8px}
 .contact-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .section-sep{margin:-20px 0}
 .sec-title{font-size:clamp(48px,11vw,90px)}
 .about-r{transform:none!important}
 .contact-value{overflow-wrap:anywhere}
}
@media(max-width:600px){
 :root{--pad-x:20px}
 #nav .n-links{gap:16px}
 .selected-grid,.contact-cards{grid-template-columns:1fr}
 .selected-media{border-radius:12px}
 .selected-meta{flex-direction:row;align-items:baseline}
 .selected-meta h3{font-size:32px}
 .project-monogram{font-size:64px}
 .accessible-process summary{gap:18px;padding:24px 0}
 .accessible-process p{margin-left:34px;margin-right:0}
 .contact-tile{padding:22px}
 .contact-tile strong{font-size:34px}
   .work-group-hd{gap:12px;flex-wrap:wrap}
 .work-card-ov{padding:20px}
 .page-hero{padding-left:20px;padding-right:20px}
}
@media(prefers-reduced-motion:reduce){
 .motion-ready .selected-card,.reveal,.reveal-stagger>*,.ct-letter,.h-bot{opacity:1!important;transform:none!important}
 #cursor-trail{display:none!important}
}
#pt.pt-closing .pt-half{transition-duration:.8s}
/* Contacts stay in document flow at every text size and viewport height. */
@media(max-width:900px){
 .h-bot,#chip-field{min-width:0}
 #statement{padding-top:64px;padding-bottom:64px}
 .ab-p,.fest-p{font-size:18px;line-height:1.65}
 #testem-1 .t1-hd{margin-bottom:32px}
}
.mq-wrap{margin-left:0;margin-right:0;padding-left:0;padding-right:0;max-width:100%}
html{overflow-x:clip}
.content-error{padding:48px var(--pad-x);font-size:18px;line-height:1.6}
.hero-work-link{display:none}
@media(max-width:900px){
 .hero-work-link{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:48px;width:100%;max-width:380px;margin:0 auto 24px;padding:12px 18px;color:var(--bg);background:var(--fg);border-radius:100px;text-decoration:none;font-size:14px;font-weight:700}
 #nav.on-light .n-logo{background-color:var(--fg)}
}
.contact-tile strong{font-family:'DM Sans',sans-serif;font-size:clamp(18px,1.6vw,24px);font-weight:600;letter-spacing:-.025em;line-height:1.35}
@media(max-width:900px){#chip-field .chip:nth-child(n+6){display:none}.hero-work-link{margin-bottom:18px}}
@media(max-width:600px){.contact-tile strong{font-size:21px}}
@media(prefers-reduced-motion:reduce){.kin-line.out .kin-inner{opacity:1!important;transform:none!important}}
@media(max-width:900px){
 .hero-side{font-family:'New Title','New Title Static',sans-serif;font-weight:700;letter-spacing:-.01em}
 .hero-side.r{font-size:inherit;letter-spacing:-.01em;text-transform:none}
}

/* Enlarge the resting portrait without altering the full-screen eye zoom. */
.hero-figure #me:not(.dive){scale:1.4;transform-origin:50% 85%}
@media(max-width:900px){.hero-figure #me:not(.dive){scale:1.12}}

/* Hero labels retain space around the portrait on narrow screens. */
@media(max-width:900px){
 .hero-row{row-gap:26px;padding-top:32px;padding-bottom:32px}
 .hero-side{font-size:clamp(30px,9vw,52px)!important;line-height:.98;position:relative;z-index:5}
 /* "Freelance" nel markup viene dopo il ritratto: a colonna singola
    finiva in fondo, appiccicato ai chip, e li' si perdeva. Sta sotto al
    ruolo, come terza riga dello stesso blocco. */
 .hero-side.l{order:1}
 .hero-side.r{order:2;margin-top:-14px}
 .hero-figure{order:3}
 .hero-figure{margin-top:10px;margin-bottom:10px}
 .hero-figure #me:not(.dive){transform-origin:50% 50%}
}