@font-face{font-family:Archivo;font-weight:400 700;font-display:swap;src:url(archivo-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:Archivo;font-weight:400 700;font-display:swap;src:url(archivo-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113}
@font-face{font-family:"Big Shoulders Display";font-weight:600 800;font-display:swap;src:url(bigshoulders-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:"Big Shoulders Display";font-weight:600 800;font-display:swap;src:url(bigshoulders-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113}

:root{--bg:#0a0a0b;--ink:#C4C2BF;--accent:#ff5200;--deep:#c43c00;--paper:#f0eeec;--dark:#111111;--panel:#0f0f10;--card:#141415;--logof:none;--sans:Archivo,Helvetica,Arial,sans-serif;--disp:"Big Shoulders Display",Archivo,sans-serif;--pad:clamp(16px,3vw,40px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--accent)}
img{max-width:100%;height:auto}
h1,h2,h3,p,dl,dd,ul,figure{margin:0}
ul{padding:0;list-style:none}
button{font:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--bg)}
.hs::-webkit-scrollbar{height:0}
.hs{scrollbar-width:none}

/* header */
.site-header{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:14px var(--pad);border-bottom:1px solid color-mix(in srgb,var(--ink) 16%,transparent)}
.logo{height:52px;width:auto;display:block;filter:var(--logof)}
.site-header nav{display:flex;gap:8px 24px;flex-wrap:wrap;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}

/* testata */
.intro{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding:clamp(14px,2vw,24px) var(--pad) 4px}
.intro h1{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:color-mix(in srgb,var(--ink) 60%,transparent)}

/* striscia scorrevole */
.work{padding-bottom:20px}
.strip{display:flex;gap:18px;overflow-x:auto;padding:20px var(--pad)}
.strip.static{flex-wrap:wrap;overflow:visible}
.strip-tile{flex:0 0 min(330px,78vw);display:flex;flex-direction:column;gap:12px;opacity:.55;transition:opacity .3s,transform .35s cubic-bezier(.2,.7,.2,1);transform-origin:center;position:relative}
.strip.static .strip-tile,.strip-tile.on{opacity:1}
.strip-tile:hover{transform:scale(1.1);z-index:5;opacity:1;color:var(--ink)}
.st-img{position:relative;display:block;height:clamp(460px,66vh,680px);overflow:hidden;background-color:var(--card);background-image:repeating-linear-gradient(115deg,#191919 0 14px,var(--card) 14px 28px)}
.st-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.strip-tile:hover .st-img img{transform:scale(1.04)}
.st-num{position:absolute;left:14px;top:8px;font-size:48px;font-weight:800;font-family:var(--disp);line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--ink);z-index:2}
.st-row{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.st-title{font-size:20px;font-weight:700;font-family:var(--disp);letter-spacing:-.01em;line-height:1.05}
.st-year{font-size:11px;letter-spacing:.14em;color:color-mix(in srgb,var(--ink) 60%,transparent)}
.st-kind{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:500}
.ph{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:16px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:color-mix(in srgb,var(--ink) 40%,transparent);text-align:center}
.ph small{display:block;margin-left:8px;color:var(--accent)}
.timeline{margin:16px var(--pad) 0;position:relative;height:34px;border-top:1px solid color-mix(in srgb,var(--ink) 33%,transparent);background-image:repeating-linear-gradient(90deg,color-mix(in srgb,var(--ink) 40%,transparent) 0 1px,transparent 1px 22px);background-size:100% 10px;background-repeat:no-repeat}
.playhead{position:absolute;top:-1px;height:34px;width:2px;background:var(--accent);transition:left .4s}
.tl-left,.tl-right{position:absolute;top:16px;font-size:10px;letter-spacing:.14em;color:color-mix(in srgb,var(--ink) 53%,transparent)}
.tl-left{left:10px}.tl-right{right:0}

/* deep dive */
.dive{--dark:var(--ink);--deep:var(--accent);background:var(--card);color:var(--ink);padding:clamp(18px,2.4vw,32px) var(--pad);border-top:2px solid var(--accent);border-bottom:2px solid var(--accent)}
.dive-in{max-width:1480px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(14px,1.8vw,22px)}
.js .dive:not(.open){display:none}
.dive-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.dive-kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--deep)}
.dive-nav{display:flex;gap:8px}
.pillbtn{display:inline-block;font:inherit;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding:10px 18px;border:1.5px solid var(--ink);border-radius:999px;cursor:pointer;background:var(--ink);color:var(--bg)}
.pillbtn:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.pillbtn.ghost{background:none;color:var(--ink)}
.pillbtn.ghost:hover{background:none;border-color:var(--accent);color:var(--accent)}
.dive-links .pillbtn{padding:12px 20px}
.dive-panel{display:flex;flex-direction:column;gap:clamp(16px,2vw,24px)}
.dive-title{font-size:clamp(28px,3.4vw,44px);line-height:.92;font-family:var(--disp);font-weight:700;letter-spacing:-.025em;text-wrap:balance}
.dive-cover{border-radius:8px;position:relative;background-color:#d4d0c9;background-image:repeating-linear-gradient(115deg,#d4d0c9 0 14px,#cbc7bf 14px 28px);overflow:hidden}
.dive-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.dive-cover .ph{color:color-mix(in srgb,var(--bg) 55%,transparent);align-items:center;padding:0}
.dive-extra{display:flex;flex-wrap:wrap;gap:8px}
.dive-extra div{width:clamp(110px,14vw,170px);aspect-ratio:3/2;overflow:hidden;border-radius:6px;background:var(--bg)}
.dive-extra img{width:100%;height:100%;object-fit:cover;display:block}
.dive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(16px,3vw,40px);align-items:start}
.dive-specs{border-top:2px solid var(--ink)}
.spec{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 13%,transparent);margin:10px 0}
.spec .k,.awards .k{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding-top:5px;color:color-mix(in srgb,var(--ink) 60%,transparent)}
.spec .v{font-size:20px;font-weight:700;font-family:var(--disp);line-height:1.2;text-wrap:pretty}
.dive-side{display:flex;flex-direction:column;gap:32px}
.awards{border-top:2px solid var(--ink);display:flex;flex-direction:column}
.awards .k{padding:12px 0 6px;color:var(--deep)}
.awards .a{padding:6px 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 13%,transparent);font-size:17px;font-weight:700;font-family:var(--disp);line-height:1.25}
.dive-links{display:flex;flex-wrap:wrap;gap:10px}
.work-text{font-size:16px;line-height:1.65;color:color-mix(in srgb,var(--ink) 75%,transparent);max-width:62ch}
.work-text p{margin-bottom:1em}
.work-text a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.video{position:relative;aspect-ratio:16/9;background:#000}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* sezioni */
.display{font-size:clamp(32px,3.4vw,44px);line-height:.95;font-family:var(--disp);font-weight:700;letter-spacing:-.02em}
.display.big{font-size:clamp(32px,4vw,56px)}
.services-sec,.about{padding:clamp(32px,4vw,56px) var(--pad)}
.about{background:var(--panel);border-top:1px solid color-mix(in srgb,var(--ink) 14%,transparent)}
.grid2{max-width:1480px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:clamp(28px,4vw,60px);align-items:start}
.grid2.center{align-items:center;gap:clamp(28px,4vw,64px)}
.stack{display:flex;flex-direction:column;gap:clamp(16px,2vw,24px)}
.photo-43{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.services{display:flex;flex-direction:column}
.service{display:grid;grid-template-columns:34px minmax(0,1fr);gap:clamp(14px,2vw,26px);padding:16px 0;border-top:1px solid color-mix(in srgb,var(--ink) 16%,transparent)}
.snum{font-size:11px;letter-spacing:.14em;font-weight:500;color:var(--accent);padding-top:8px}
.service h3{font-size:clamp(26px,2.6vw,38px);font-family:var(--disp);font-weight:700;letter-spacing:-.01em;margin-bottom:10px}
.service p,.body{font-size:16px;line-height:1.65;color:color-mix(in srgb,var(--ink) 69%,transparent);max-width:56ch;text-wrap:pretty}
.kick{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--accent)}
.statement{font-size:clamp(32px,3.4vw,44px);line-height:1;font-family:var(--disp);font-weight:700;letter-spacing:-.02em;text-wrap:balance}
.contact-sec{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;padding:clamp(28px,4vw,48px) var(--pad)}
.contact-lines{display:flex;flex-direction:column;gap:6px;font-size:18px;font-weight:700;font-family:var(--disp)}

/* pagina Gear */
.gear-head{padding:clamp(32px,4vw,56px) var(--pad)}
.gear-head .stack{gap:16px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{padding:8px 14px;border:1px solid color-mix(in srgb,var(--ink) 25%,transparent);font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:500;color:color-mix(in srgb,var(--ink) 72%,transparent)}
.gear-head .body{max-width:52ch}
.gear-list{padding:0 var(--pad) clamp(32px,4vw,56px)}
.gear-list .block-in{max-width:1180px;margin:0 auto}
.gear-head .grid2{max-width:1180px;align-items:end}
.gear-tools{display:flex;justify-content:flex-end;padding-bottom:12px}
.gear-group{border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent)}
.gear-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 2px;background:none;border:0;text-align:left;cursor:pointer;color:var(--ink)}
.gear-btn:hover{color:var(--accent)}
.gear-btn span:first-child{display:flex;align-items:baseline;gap:12px;min-width:0}
.gear-btn b{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.gear-btn small{font-size:10px;letter-spacing:.14em;color:color-mix(in srgb,var(--ink) 45%,transparent)}
.gear-btn .sign{font-size:15px;color:var(--accent);flex-shrink:0}
.gear-group ul{padding:0 0 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:7px 30px}
.gear-group li{font-size:14px;line-height:1.45;color:color-mix(in srgb,var(--ink) 78%,transparent)}
.gear-end{border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent)}
.gear-contact{display:flex;flex-direction:column;gap:clamp(20px,3vw,32px);width:100%}
.gear-contact h2{max-width:24ch}
.contacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:1px;background:color-mix(in srgb,var(--ink) 18%,transparent)}
.contacts a{display:flex;flex-direction:column;gap:9px;padding:24px 22px;min-width:0;background:var(--bg)}
.contacts a:hover{background:var(--panel)}
.contacts .label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;color:color-mix(in srgb,var(--ink) 50%,transparent)}
.contacts .val{font-family:var(--disp);font-weight:700;font-size:18px;overflow-wrap:anywhere;line-height:1.3}
.prose{max-width:760px;padding:clamp(32px,4vw,56px) var(--pad)}
.site-footer{display:flex;align-items:center;justify-content:center;gap:10px 20px;flex-wrap:wrap;padding:24px var(--pad);text-align:center;font-size:10px;line-height:1.8;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 50%,transparent);border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.site-footer a{color:color-mix(in srgb,var(--ink) 65%,transparent)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.strip-tile,.st-img img,.playhead{transition:none}}
