/* Aether — sistema visivo condiviso del portfolio. */
@font-face{font-family:Inter;src:url('/media/fonts/inter-variable.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
:root{--bg-0:#030303;--bg-1:#0C0C0C;--bg-2:#141414;--bg-3:#191919;--bg-4:#262626;--panel:#0C0C0C;--panel-hi:#191919;--cream:#F4F4F5;--ink:#030303;--text:#F4F4F5;--text-dim:#A1A1AA;--text-mute:#A1A1AA;--text-faint:#8C8C96;--accent:#F59E0B;--accent-strong:#FBBF24;--accent-deep:#D97706;--accent-soft:rgba(245,158,11,.14);--accent-softer:rgba(245,158,11,.07);--accent-border:rgba(245,158,11,.35);--accent-ink:#030303;--line:rgba(250,250,250,.1);--line-strong:rgba(250,250,250,.18);--line-hot:rgba(245,158,11,.55);--font-display:Inter,system-ui,sans-serif;--font-body:Inter,system-ui,sans-serif;--font-editorial:Inter,system-ui,sans-serif;--font-mono:Inter,system-ui,sans-serif;--font-hand:Inter,system-ui,sans-serif;--radius-sm:4px;--radius-md:4px;--radius-lg:4px;--radius-xl:4px;--tracking-tight:-.04em;--strata-1:#030303;--strata-2:#0C0C0C;--strata-3:#191919;--horizon:#F59E0B;--horizon-deep:#FDE68A;--hero-bg:transparent;--hero-overlay:rgba(3,3,3,.6);--hero-glow:rgba(245,158,11,.12);--hero-led:#F59E0B;--hero-led-dim:rgba(245,158,11,.28);--surface-light:none;--glow-accent:0 2px 6px rgba(0,0,0,.6),0 18px 40px -18px rgba(245,158,11,.4);--dur-2:300ms;--dur-3:500ms;--dur-4:850ms}
body{background:#030303;color:var(--text);font-size:16px;line-height:1.74;scrollbar-color:#78452C #030303}
.container{max-width:1600px;padding-inline:clamp(20px,4.4vw,64px)}
.topbar,.topbar.is-stuck{background:rgba(3,3,3,.88);border-color:var(--line);backdrop-filter:blur(16px)}
.brand-mark,.menu-toggle,.language-control select{border-radius:4px;background:#141414;border-color:var(--line-strong)}
.brand{font-size:18px;letter-spacing:-.04em}.brand small{color:var(--text-faint)}
.mobile-nav{background:#0C0C0C}.ambient{background:#030303}.ambient::after{background:linear-gradient(260deg,rgba(3,3,3,.95) 6%,rgba(3,3,3,.64) 36%,rgba(3,3,3,.12) 66%,transparent 86%),linear-gradient(180deg,rgba(3,3,3,.8),transparent 25%,transparent 72%,#030303)}
.hero-stage{background:transparent;z-index:1}.hero-bg{opacity:1}.hero-scrim{background:linear-gradient(90deg,rgba(3,3,3,.35),rgba(3,3,3,.88) 70%),linear-gradient(180deg,transparent 70%,#030303)}
.hero-stage .hero-content{align-items:flex-start;justify-content:center;padding-block:40px;max-width:1600px;opacity:1!important;transform:none}
.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{font-size:clamp(52px,min(10.8vw,11vh),176.28px);font-weight:700;line-height:.88;letter-spacing:-.07em;text-transform:none;max-width:20ch;margin-bottom:28px;text-wrap:balance}
.hero-content .hl-word{color:#F4F4F5}.hero-content .hl-accent{color:#F59E0B}html:not([lang="it"]) .hero-content h1 .hl-word{display:inline;overflow-wrap:anywhere}
.hero-film-active .hero-line-item{opacity:var(--hero-line-progress,0);transform:translateY(calc((1 - var(--hero-line-progress,0)) * 32px));will-change:auto}
.hero-stage .hero-content>.eyebrow{display:block;color:var(--text-dim);font-size:12px;line-height:16px;letter-spacing:2.16px;margin-bottom:28px}
.hero-stage .hero-sub{font-size:16.96px;line-height:29.5104px;max-width:56ch;color:var(--text-dim)}
.hero-actions{gap:12px;flex-wrap:wrap}.hero-stage .hero-actions .btn{font-size:12px;padding:16px 28px;min-height:50px}
.hero-cue{display:none}.hero-skip{border-radius:4px;background:#0C0C0C;color:var(--text-dim);border-color:var(--line)}
h1,h2,h3,.project-body h3,.fragment-title,.legal-hero h1,.project-document h1{text-transform:none;letter-spacing:-.04em}
h2{font-size:clamp(36px,5vw,72px);line-height:1.02;text-wrap:balance}.section-head .eyebrow{display:block;font-size:12px;letter-spacing:2.16px;color:var(--accent)}
main>section:not(.hero-stage){padding-block:64px}.lede{font-size:16.96px;line-height:29.5104px;max-width:66ch}
.btn,.btn-ghost{border-radius:4px}.btn-ghost{background:rgba(12,12,12,.65);border-color:var(--line-strong);color:var(--text-dim);font-size:12px;letter-spacing:2.16px;text-transform:uppercase}.btn-ghost:hover{background:#191919;color:#F4F4F5;border-color:var(--accent)}
#projects-list{gap:20px}#projects-list>.project,#projects-list>.project.is-lead,.player,.about-chip,.fragment,.contact-item,.quote-block,.legal-card,.cta-block{border:1px solid transparent;border-radius:4px;background:linear-gradient(#0C0C0C,#0C0C0C) padding-box,linear-gradient(140deg,rgba(245,158,11,.55),rgba(251,191,36,.18) 45%,rgba(255,255,255,.06)) border-box;box-shadow:0 2px 6px rgba(0,0,0,.6),0 18px 40px -18px rgba(245,158,11,.16);backdrop-filter:none}
#projects-list>.project{padding:28px;gap:24px}#projects-list>.project.is-lead{padding:36px;gap:36px}#projects-list .project-body h3{font-size:clamp(28px,3vw,44px);line-height:1.1}
#projects-list .project-media,#projects-list .project-media-caption{border-radius:4px;background:#141414}.project-summary,.about-text p,.contact-text,.fragment-body{font-size:16px;line-height:1.75}
.project-links a{color:var(--text-dim)}.project-links a:hover{color:var(--accent)}.tech-tag{border-radius:4px;background:rgba(245,158,11,.07);border-color:var(--line);color:var(--text-dim)}
.process-line,.fragment.note-fragment{background:#101010;border-color:var(--line);border-radius:4px}.manifesto-media img,.music-art img,.about-photo img{border-radius:4px}
.contact-label,.footer-title{color:var(--text);font-size:12px;font-weight:600;letter-spacing:2.16px}.cta-block{padding:36px}.cta-email{color:var(--accent-strong)}footer{background:rgba(3,3,3,.96);border-color:var(--line)}
::selection{background:#F59E0B;color:#030303}:focus-visible{outline:2px solid #FDE68A;outline-offset:4px}a{text-underline-offset:.22em}input,textarea{caret-color:#FDE68A}
@media(max-width:759px){body{font-size:16px}.container{padding-inline:20px}.brand{font-size:14px}.hero-stage .hero-content{padding-block:36px}.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{font-size:clamp(38px,9.5vw,68px);line-height:.98;letter-spacing:-.055em;max-width:22ch}.hero-stage .hero-sub{font-size:15px;line-height:1.65}.hero-stage .hero-actions .btn{padding:16px 20px;font-size:11px;letter-spacing:1.4px}#projects-list>.project,#projects-list>.project.is-lead{padding:20px;gap:20px}.cta-block{padding:24px}.hero-skip{font-size:11px}main>section:not(.hero-stage){padding-block:56px}}
@media(orientation:landscape) and (max-height:520px){.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{font-size:clamp(28px,7vh,44px);line-height:1}.hero-stage .hero-content>.eyebrow{margin-bottom:12px}.hero-stage .hero-content{padding-block:16px}.hero-stage .hero-sub{font-size:13px;line-height:1.4}.hero-stage .hero-actions .btn{padding:12px 16px;min-height:44px}.hero-skip{display:none}}
@media(prefers-reduced-motion:reduce){.hero-stage .hero-content{padding-block:56px}.hero-film-active .hero-line-item{transform:none;opacity:1}.ambient::before{transform:rotateX(64deg)}}

/* Aether Ambient Intelligence — onde ambra a pieno schermo. */
.ambient,.fx-lite .ambient{background:#030303;pointer-events:none}
.ambient::before{inset:0;background:url('/media/aether-fluid-fallback.png') center/cover no-repeat;transform:none;animation:none;opacity:1;mix-blend-mode:normal}
.ambient.has-webgl::before{opacity:0}
.ambient::after{background:linear-gradient(180deg,transparent 65%,#030303)}
.ambient__horizon,.ambient__vignette{display:none}
/* Video e immagine sopra il campo ambientale; testo sopra il video. */
.hero-stage .hero-bg{z-index:0;opacity:1}
.hero-stage .hero-scrim{z-index:1}
.hero-stage .hero-bloom{z-index:2}
.hero-stage .hero-content{z-index:6}
.hero-scrim{background:linear-gradient(90deg,rgba(3,3,3,.35),transparent 75%),linear-gradient(180deg,transparent 70%,#030303)}
.hero-content .hl-accent{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;color:#F59E0B;letter-spacing:-.045em}
.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{letter-spacing:-.055em}
.topbar,.topbar.is-stuck{background:rgba(3,3,3,.65)}
#projects-list>.project,#projects-list>.project.is-lead,.player,.about-chip,.fragment,.contact-item,.quote-block,.legal-card,.cta-block{background:linear-gradient(rgba(12,12,12,.88),rgba(6,6,6,.94)) padding-box,linear-gradient(145deg,rgba(255,255,255,.16),rgba(245,158,11,.13),rgba(255,255,255,.04)) border-box;box-shadow:none;backdrop-filter:blur(12px)}
.btn.btn-primary{background:#F59E0B;color:#030303;box-shadow:none}
.btn.btn-primary::after{background:linear-gradient(120deg,#FBBF24,#F59E0B)}
.btn.btn-primary:focus-visible{outline-color:#FDE68A}
@media(hover:hover) and (pointer:fine){.btn.btn-primary:hover{background:#FBBF24;color:#030303}}
@media(prefers-reduced-motion:reduce){.ambient::before{transform:none;animation:none}}

/* Equilibrio condiviso: media in primo piano, campo ambientale discreto. */
:root{--layout-max:1320px;--section-space:clamp(64px,7vw,104px);--panel-balanced:rgba(10,10,10,.94);--text-dim:#B7B7BE;--text-mute:#AAAAB3}
.container{max-width:var(--layout-max);padding-inline:clamp(20px,4vw,56px)}
.ambient .aether-terrain,.ambient::before{opacity:.68}
.ambient.has-webgl::before{opacity:0}
.ambient::after{background:linear-gradient(180deg,rgba(3,3,3,.12),rgba(3,3,3,.4) 70%,#030303)}
.hero-stage{isolation:isolate}
.hero-stage .hero-content{max-width:var(--layout-max);padding-inline:clamp(20px,4vw,56px);padding-block:clamp(28px,5vh,56px)}
.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{font-size:clamp(42px,min(6.4vw,8vh),88px);line-height:1.04;letter-spacing:-.035em;max-width:19ch;margin-bottom:24px}
.hero-content .hl-accent{letter-spacing:-.035em}
.hero-stage .hero-content>.eyebrow,.section-head>.eyebrow{display:none}
.hero-stage .hero-sub{max-width:52ch;color:#E1E1E5;font-size:clamp(15px,1.25vw,18px);line-height:1.7}
.hero-scrim{background:linear-gradient(90deg,rgba(3,3,3,.78),rgba(3,3,3,.48) 48%,rgba(3,3,3,.08) 85%),linear-gradient(180deg,rgba(3,3,3,.12),transparent 55%,#030303)}
.hero-actions{margin-top:28px;gap:12px;max-width:100%}
.hero-stage .hero-actions .btn{min-height:50px;line-height:1.4;letter-spacing:1.5px}
h1,h2,h3,.project-body h3,.fragment-title,.legal-hero h1,.project-document h1{letter-spacing:-.03em}
h2{font-size:clamp(32px,4vw,56px);line-height:1.12;max-width:24ch;margin-bottom:20px}
main>section:not(.hero-stage){padding-block:var(--section-space)}
.section-head{max-width:76ch;margin-bottom:clamp(28px,4vw,48px)}
.lede{max-width:68ch;font-size:clamp(16px,1.25vw,18px);line-height:1.75}
#projects-list{gap:24px;align-items:stretch}
#projects-list>.project,#projects-list>.project.is-lead,.player,.about-chip,.fragment,.contact-item,.quote-block,.legal-card,.cta-block{background:var(--panel-balanced);border:1px solid var(--line);box-shadow:none;backdrop-filter:none}
#projects-list>.project{padding:clamp(22px,2.5vw,32px);gap:24px}
#projects-list>.project.is-lead{padding:clamp(24px,3vw,40px);gap:32px;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
#projects-list .project-body{display:flex;flex-direction:column;flex:1;min-width:0;gap:16px}
#projects-list .project-body h3{font-size:clamp(26px,2.5vw,34px);line-height:1.18;margin:0;max-width:26ch}
#projects-list .project-summary{margin:0;max-width:65ch}
#projects-list .project-links{margin-top:auto;padding-top:8px;gap:12px 20px;font-size:14px}
#projects-list .project-media{min-height:0;overflow:hidden;background:#101010}
#projects-list .project-media img{width:100%;max-height:360px;object-fit:contain}
.project-status{align-self:flex-start;letter-spacing:.035em;line-height:1.5}
.project-details summary{font-size:14px;min-height:44px;display:flex;align-items:center;cursor:pointer}
.tech-tag{background:rgba(255,255,255,.035);border-color:var(--line);letter-spacing:0}
.btn-ghost{background:rgba(3,3,3,.6);color:#E1E1E5;letter-spacing:1.2px;backdrop-filter:none;box-shadow:none}
.btn.btn-primary{letter-spacing:1.5px;transition:background-color 220ms ease-out}
.btn.btn-primary::after{display:none}
.music-grid,.about-grid{gap:clamp(24px,4vw,56px);align-items:start}
.player,.about-chip,.fragment,.contact-item,.legal-card{padding:clamp(22px,2.5vw,32px)}
.fragments-grid,.contact-grid,.about-extra{gap:24px}
.fragment-title{font-size:24px;line-height:1.25}
.fragment-body,.contact-text,.about-text p{font-size:16px;line-height:1.75}
.fragment-date{color:var(--text-mute)}
.process-line,.method-list{border-color:var(--line);background:rgba(10,10,10,.86)}
.method-step{padding:24px 20px;line-height:1.65}
.quote-block{padding:clamp(24px,4vw,48px);font-size:clamp(22px,2.5vw,32px);line-height:1.4;max-width:70ch}
.cta-block{padding:clamp(24px,4vw,48px);margin-top:40px}
.cta-email{overflow-wrap:anywhere;letter-spacing:0}
.project-document h1,.legal-hero h1{font-size:clamp(36px,5vw,64px);line-height:1.12}
.project-document .project-links{display:flex;flex-wrap:wrap;gap:12px;margin-block:24px 32px}
.project-document .project-narrative{padding-block:24px;border-color:var(--line)}
footer{padding-block:48px 24px}.footer-grid{gap:32px}.footer-tag{max-width:44ch;line-height:1.75}
@media(max-width:1000px){#projects-list>.project.is-lead{grid-template-columns:minmax(0,1fr)}}
@media(max-width:759px){
.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{font-size:clamp(34px,min(8.5vw,7vh),54px);line-height:1.08;letter-spacing:-.03em}
.hero-stage .hero-content{padding-block:28px}
.hero-scrim{background:linear-gradient(90deg,rgba(3,3,3,.8),rgba(3,3,3,.38)),linear-gradient(180deg,transparent 60%,#030303)}
.hero-actions{gap:10px;margin-top:24px}
.hero-stage .hero-actions .btn{font-size:11px;padding:14px 18px;min-height:48px;letter-spacing:1px}
#projects-list,.fragments-grid{grid-template-columns:minmax(0,1fr)}
#projects-list>.project,#projects-list>.project.is-lead{padding:22px;gap:22px}
.hero-skip{font-size:11px;padding:10px 12px}
}
@media(orientation:landscape) and (max-height:520px){
.hero-stage .hero-content{padding-block:16px}
.hero-stage .hero-content h1,html:not([lang="it"]) .hero-stage .hero-content h1{font-size:clamp(26px,6.5vh,36px);margin-bottom:12px;max-width:28ch}
.hero-stage .hero-sub{font-size:13px;line-height:1.5;max-width:65ch}
.hero-actions{margin-top:16px}.hero-stage .hero-actions .btn{padding:10px 16px;min-height:44px}
}
html[lang="ar"] .hero-stage .hero-content h1,html[lang="hi"] .hero-stage .hero-content h1,html[lang="bn"] .hero-stage .hero-content h1{letter-spacing:normal;line-height:1.2}
html[dir="rtl"] .hero-scrim{transform:scaleX(-1)}
@media(prefers-reduced-motion:reduce){.btn.btn-primary{transition:none}}

/* Finale hero: ingresso dal basso, senza nascondere i fallback statici. */
@media(prefers-reduced-motion:no-preference){
  .js:not(.hero-film-fallback) .hero-stage:not(.hero-film-active) .hero-content{opacity:0!important;pointer-events:none}
  html:not([lang="it"]) .hero-stage.hero-film-active .hero-content h1 .hl-word{display:inline-block}
}
.language-control select{width:auto;flex:0 0 auto}

/* Galleria aperta: copertine invariate, ritmo verticale più compatto. */
main > section#siti { padding-block: 24px; }
main > section:has(+ #siti) { padding-bottom: 32px; }
main > section#siti + section { padding-top: 32px; }
#siti .section-head { margin-bottom: 16px; }
#siti .record-stage:focus-visible { outline: none; }
