@font-face{font-family:"Inter Tight";src:url(fonts/intertight.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/plexmono-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(fonts/plexmono-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{--bg:#fff;--ink:#111;--mute:#6f6f6f;--line:#111;--soft:#e4e4e4;--acc:#d8321a;--pad:32px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.5 "Inter Tight",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%}
.mono{font:500 12px/1.45 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.02em;text-transform:uppercase}
.mute{color:var(--mute)}
.acc{color:var(--acc)}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:20}

/* Testata */
.top{padding:18px var(--pad);display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:10}
.top a{text-decoration:none}
.top nav{display:flex;gap:24px;flex-wrap:wrap}
.top nav a:hover,.top nav a[aria-current]{color:var(--acc)}

/* Blocchi a griglia 12 colonne */
.blk{padding:48px var(--pad);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;border-bottom:1px solid var(--line)}
.blk>.lab{grid-column:1/4}
.blk>.body{grid-column:4/-1;min-width:0}
.blk:last-of-type{border-bottom:0}

/* Home */
.hero{padding:96px var(--pad) 72px}
.hero h1{grid-column:1/-1;font-weight:700;font-size:clamp(56px,10vw,160px);line-height:.9;letter-spacing:-.045em;margin:0 0 40px}
.hero .body{font-size:22px;line-height:1.4;grid-column:5/12}
.hero .body p{margin:0 0 16px}
.hero .lab{grid-column:1/5}
.tag{display:inline-block;border:1px solid var(--acc);color:var(--acc);padding:2px 8px;margin:0 6px 6px 0}
.profili{margin-top:20px;display:flex;gap:18px;flex-wrap:wrap}

.idx{list-style:none;margin:0;padding:0}
.idx a{display:grid;grid-template-columns:48px minmax(0,1fr) 230px 80px;gap:16px;align-items:baseline;padding:18px 0;border-top:1px solid var(--soft);text-decoration:none}
.idx li:last-child a{border-bottom:1px solid var(--soft)}
.idx .t{font-size:30px;font-weight:500;letter-spacing:-.02em;line-height:1.1}
.idx .s{display:block;font-size:16px;color:var(--mute);letter-spacing:0;margin-top:6px;font-weight:400}
.idx a:hover .t,.idx a:focus .t{color:var(--acc)}

table{width:100%;border-collapse:collapse}
td{padding:12px 12px 12px 0;border-top:1px solid var(--soft);vertical-align:top}
td:first-child{width:110px}
.arch a{text-decoration:none}.arch tr:hover td{color:var(--acc)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.big{font-size:clamp(28px,4vw,56px);font-weight:500;letter-spacing:-.02em;text-decoration:none;overflow-wrap:anywhere}
.big:hover{color:var(--acc)}

/* Pagina progetto */
.ph{padding:72px var(--pad) 40px;border-bottom:1px solid var(--line)}
.ph h1{font-weight:700;font-size:clamp(44px,7.5vw,120px);line-height:.95;letter-spacing:-.04em;margin:16px 0 0;overflow-wrap:anywhere}
.meta dl{margin:0}
.meta dt{color:var(--mute);margin-top:14px}
.meta dd{margin:2px 0 0}
.testo{font-size:21px;line-height:1.45;max-width:760px}
.testo p{margin:0 0 16px}
.testo .perche{color:var(--acc)}
.links{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:24px}
.links a{text-decoration:none;border-bottom:1px solid currentColor}
.links a:hover{color:var(--acc)}
.video{position:relative;aspect-ratio:16/9;background:#000;margin-bottom:24px;cursor:pointer;overflow:hidden}
.video img{width:100%;height:100%;object-fit:cover;opacity:.75;display:block}
.video button{position:absolute;inset:0;margin:auto;width:max-content;height:max-content;background:var(--acc);color:#fff;border:0;padding:12px 18px;cursor:pointer}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.gal{columns:2;column-gap:16px}
.gal a{display:block;margin:0 0 16px;break-inside:avoid;background:#f3f3f3}
.gal img{width:100%;height:auto;display:block}
.nextprev{display:flex;justify-content:space-between;gap:24px;padding:28px var(--pad);border-top:1px solid var(--line)}
.nextprev a{text-decoration:none}.nextprev a:hover{color:var(--acc)}
.nextprev .n{text-align:right}
.nextprev b{display:block;font:500 24px/1.2 "Inter Tight",sans-serif;text-transform:none;letter-spacing:-.01em;margin-top:6px}

/* Lightbox */
.lb{position:fixed;inset:0;background:rgba(255,255,255,.97);display:none;align-items:center;justify-content:center;z-index:50}
.lb.on{display:flex}
.lb img{max-width:92vw;max-height:86vh}
.lb button{position:absolute;background:none;border:0;font:500 13px "IBM Plex Mono",monospace;text-transform:uppercase;padding:16px;cursor:pointer;color:var(--ink)}
.lb .x{top:8px;right:8px}.lb .p{left:8px;top:50%}.lb .nx{right:8px;top:50%}
.lb button:hover{color:var(--acc)}

footer{padding:24px var(--pad);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

@media (max-width:860px){
  :root{--pad:16px}
  .top{display:block;padding:14px var(--pad)}
  .top nav{gap:6px 16px;margin-top:8px}
  .blk,.hero{display:block;padding:40px var(--pad)}
  .hero{padding-top:48px}
  .hero .body{font-size:19px}
  .blk>.lab{margin-bottom:20px}
  .idx a{grid-template-columns:32px minmax(0,1fr);gap:4px 10px}
  .idx .k,.idx .y{grid-column:2}
  .idx .t{font-size:24px;overflow-wrap:anywhere}
  .g2{grid-template-columns:1fr}
  td:first-child{width:76px}
  .arch td:nth-child(4){display:none}
  .ph{padding:40px var(--pad) 28px}
  .testo{font-size:19px}
  .gal{columns:1}
  .nextprev{flex-direction:column}.nextprev .n{text-align:left}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}