/* Digital identity final layer — editorial flow, restrained motion, mobile-first navigation. */
:root { --header-glass: rgba(247,246,242,.88); }

.site-header {
  background: var(--header-glass);
  -webkit-backdrop-filter: blur(14px) saturate(1.08);
  backdrop-filter: blur(14px) saturate(1.08);
}

.desktop-nav { align-items: center; gap: clamp(18px,2.2vw,34px); }
.desktop-nav > a:not(.nav-connect) { letter-spacing: .11em; }
.desktop-nav .nav-connect { border-bottom: 1px solid currentColor; }
.mobile-connect { display: none; }

#the-wall,
#media,
#profilo { scroll-margin-top: 96px; }

#media {
  border-top: 1px solid rgba(37,37,34,.14);
  border-bottom: 1px solid rgba(37,37,34,.14);
}

#media .section-head { max-width: 920px; }
#media .section-intro { max-width: 720px; }
#media .cgi-tv { margin-top: clamp(32px,5vw,68px); }

#collaborazioni,
#profilo,
#progetti,
#libro,
#manifesto,
#connect {
  content-visibility: auto;
  contain-intrinsic-size: auto 900px;
}

@media (hover:hover) and (pointer:fine) {
  .desktop-nav a,
  .mobile-connect {
    transition: opacity .22s ease, transform .22s ease;
  }
  .desktop-nav a:hover,
  .mobile-connect:hover {
    opacity: .62;
    transform: translateY(-1px);
    text-decoration: none;
  }
}

@media (max-width:900px) {
  .header-inner { gap: 8px; }
  .brand { min-width: 0; }
  .mobile-connect {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    border-bottom: 1px solid currentColor;
    color: inherit;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .08em;
    text-decoration: none;
  }
  .menu-toggle { margin-left: 4px; }
  dialog nav { gap: clamp(8px,2.2vh,15px); }
  #media .section-head { margin-bottom: 28px; }
  #media .section-intro { font-size: 14px; line-height: 1.65; }
}

@media (max-width:430px) {
  .brand-copy { font-size: 14px; }
  .brand-copy small { display: none; }
  .mobile-connect { font-size: 8px; letter-spacing: .055em; }
  .menu-toggle { padding-inline: 4px 0; }
}

@media (max-width:370px) {
  .mobile-connect { padding-inline: 0; }
  .brand-copy small { display: none; }
}

.nav-connect::before { background: currentColor !important; }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .desktop-nav a,
  .mobile-connect { transition: none; }
}

/* Digital identity 2027 — reduction, rhythm and motion without a new visual language. */
html { scroll-padding-top: 88px; }
body { overflow-x: clip; }
.brand-intro { pointer-events: none; transition: opacity .42s ease, visibility .42s ease; }
.brand-intro-enter { display: none !important; }
.brand-intro.is-auto-leaving { opacity: 0; visibility: hidden; }

.hero-copy { max-width: 54ch; }
.hero-copy .hero-positioning { margin: 0 0 14px; font: 400 clamp(25px,2.8vw,42px)/1.08 Italiana,Georgia,serif; letter-spacing: -.025em; }
.hero-copy .hero-intro { max-width: 48ch; margin: 0; color: #625f58; font-size: clamp(15px,1.25vw,18px); line-height: 1.6; }
.hero-actions { display: flex; margin-top: 28px; }
.hero-cta { min-height: 48px; align-items: center; }

.wall-home-canvas { cursor: pointer; }
.wall-home-track { will-change: transform; }
@media (hover:hover) and (pointer:fine) {
  .wall-home-canvas:hover .wall-home-track { animation-play-state: paused; }
}

#media { padding-block: clamp(72px,8vw,104px); }
#media .section-head { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(280px,.72fr); column-gap: clamp(44px,8vw,132px); align-items: end; }
#media .section-head .kicker { grid-column: 1/-1; }
#media .section-head h2 { margin: 0; font-size: clamp(54px,8.5vw,132px); line-height: .88; letter-spacing: -.055em; }
#media .section-intro { align-self: end; margin: 0 0 .4em; }

.di-about { display: grid !important; grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr); gap: clamp(54px,9vw,150px); padding-block: clamp(92px,12vw,172px) !important; }
.di-about-head h2 { margin: 14px 0 24px; font-size: clamp(48px,7vw,104px); line-height: .94; letter-spacing: -.045em; }
.di-about-head > p:last-child { max-width: 40ch; font-size: clamp(16px,1.45vw,20px); line-height: 1.6; }
.di-proof-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: end; border-top: 1px solid rgba(17,17,17,.22); }
.di-proof-grid article { min-height: 150px; padding: 26px 20px 24px 0; border-bottom: 1px solid rgba(17,17,17,.18); }
.di-proof-grid article:nth-child(odd) { border-right: 1px solid rgba(17,17,17,.18); }
.di-proof-grid article:nth-child(even) { padding-left: 20px; }
.di-proof-grid span { display: block; margin-bottom: 26px; color: #77736a; font-size: 10px; letter-spacing: .16em; }
.di-proof-grid p { margin: 0; font: 400 clamp(23px,2.3vw,34px)/1.1 Italiana,Georgia,serif; }
.di-about-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: end; border-top: 1px solid rgba(17,17,17,.22); }
.di-about-grid article { min-height: 160px; padding: 22px 20px 26px 0; border-bottom: 1px solid rgba(17,17,17,.18); }
.di-about-grid article:nth-child(odd) { border-right: 1px solid rgba(17,17,17,.18); }
.di-about-grid article:nth-child(even) { padding-left: 20px; }
.di-about-grid span { display: block; margin-bottom: 18px; color: #77736a; font-size: 9px; letter-spacing: .16em; }
.di-about-grid p { max-width: 29ch; margin: 0; font-size: clamp(14px,1.15vw,17px); line-height: 1.55; }

#progetti { padding-block: clamp(82px,11vw,158px) !important; }
#progetti .section-head { max-width: 1040px; }
#progetti .section-head h2 { max-width: 15ch; font-size: clamp(46px,6.8vw,100px); line-height: .94; letter-spacing: -.045em; }
#progetti .work-grid { gap: clamp(44px,6vw,88px) clamp(20px,3vw,42px); }
#progetti .work { min-width: 0; }
#progetti .work img { aspect-ratio: 4/3; object-fit: cover; }
#progetti .work h3 { font-size: clamp(28px,3.3vw,48px); line-height: 1; }
#progetti .work .card-copy > p:not(.eyebrow) { max-width: 38ch; }
#progetti .work .text-link { font-size: 10px; letter-spacing: .08em; }

.di-selected { padding-block: clamp(88px,11vw,166px); border-top: 1px solid rgba(37,37,34,.14); background: #f1f0eb; }
.di-selected-head { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(280px,.72fr); gap: 24px clamp(48px,8vw,130px); align-items: end; }
.di-selected-head .kicker { grid-column: 1/-1; }
.di-selected-head h2 { margin: 0; font-size: clamp(58px,8vw,122px); line-height: .86; letter-spacing: -.05em; }
.di-selected-head > p:last-child { max-width: 38ch; margin: 0 0 .45em; color: #625f58; font-size: clamp(15px,1.3vw,19px); line-height: 1.65; }
.di-selected-feature { display: grid; grid-template-columns: minmax(280px,.72fr) minmax(0,1.28fr); gap: clamp(36px,8vw,138px); align-items: center; margin-top: clamp(48px,7vw,100px); }
.di-selected-visual { display: block; max-width: 520px; background: #171717; overflow: hidden; }
.di-selected-visual img { display: block; width: 100%; height: auto; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.di-selected-copy h3 { max-width: 15ch; margin: 18px 0 34px; font-size: clamp(38px,5.6vw,82px); line-height: .98; letter-spacing: -.035em; font-weight: 400; }
.di-selected-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: clamp(58px,8vw,118px); border-top: 1px solid rgba(37,37,34,.25); }
.di-selected-list a { display: flex; min-height: 122px; flex-direction: column; justify-content: space-between; gap: 22px; padding: 24px 24px 20px 0; border-bottom: 1px solid rgba(37,37,34,.2); color: inherit; text-decoration: none; }
.di-selected-list a:not(:last-child) { border-right: 1px solid rgba(37,37,34,.2); }
.di-selected-list a:nth-child(n+2) { padding-left: 24px; }
.di-selected-list span { font: 400 clamp(24px,2.4vw,34px)/1.05 Italiana,Georgia,serif; }
.di-selected-list small { color: #6b6861; font-size: 10px; letter-spacing: .11em; text-transform: uppercase; }
@media (hover:hover) and (pointer:fine) {
  .di-selected-visual:hover img { transform: scale(1.015); }
  .di-selected-list a { transition: opacity .24s ease; }
  .di-selected-list a:hover { opacity: .58; }
}

.di-manifesto { min-height: min(100svh,940px); display: grid; align-items: center; padding-block: clamp(96px,14vw,190px); background: #f1f0eb; color: #111; }
.di-manifesto-inner { width: min(1280px,100%); }
.di-manifesto h2 { display: grid; gap: .18em; max-width: 17ch; margin: clamp(38px,6vw,74px) 0 0; font-size: clamp(38px,5.8vw,84px); line-height: 1.03; letter-spacing: -.038em; font-weight: 400; }
.di-manifesto h2 span { display: block; }
.di-manifesto-quote { max-width: 48ch; margin: clamp(62px,9vw,116px) 0 0 auto; color: #68655e; font: 400 clamp(15px,1.35vw,19px)/1.55 DM,Arial,sans-serif; }

body.homepage-reduction-v1 .di-connect { min-height: min(72svh,720px); display: grid; place-items: center; padding-block: 0; background: #0b0b0b; color: #f7f6f2; }
.di-connect-grid { box-sizing: border-box; width: 100%; display: grid; grid-template-columns: minmax(0,1.3fr) minmax(280px,.7fr); gap: clamp(38px,8vw,120px); align-items: end; padding-block: clamp(92px,12vw,168px); }
.di-connect-grid > * { grid-area: auto; min-width: 0; }
.di-connect .di-connect-grid > .eyebrow,
.di-connect .di-connect-grid > h2,
.di-connect .di-connect-grid > div { grid-area: auto; }
.di-connect-grid > .eyebrow { grid-column: 1/-1; color: rgba(255,255,255,.58); }
.di-connect-grid h2 { max-width: 14ch; margin: 0; font-size: clamp(48px,6.8vw,100px); line-height: .96; letter-spacing: -.045em; font-weight: 400; }
.di-connect-grid h2::after { content: none; display: none; }
.di-connect-grid > div { max-width: 36ch; padding-bottom: .65em; }
.di-connect .connect-closing-cta { color: #fff; border-color: rgba(255,255,255,.75); }

.di-progress { position: fixed; z-index: 35; right: 14px; top: 50%; display: grid; gap: 8px; transform: translateY(-50%); mix-blend-mode: difference; }
.di-progress a { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-height: 28px; color: #fff; font-size: 8px; letter-spacing: .14em; text-decoration: none; opacity: .48; transition: opacity .25s ease, transform .25s ease; }
.di-progress a span { font-variant-numeric: tabular-nums; }
.di-progress a[aria-current],.di-progress a:hover { opacity: 1; transform: translateX(-3px); }

footer { padding-block: 28px 34px; }
footer .footer-brand { line-height: 1.45; }
footer .footer-brand small { color: #77736a; font-size: 9px; font-weight: 400; letter-spacing: .1em; }

@media (max-width:900px) {
  #media .section-head { grid-template-columns: 1fr; gap: 24px; }
  #media .section-head .kicker { grid-column: auto; }
  #media .section-head h2 { font-size: clamp(52px,14vw,88px); }
  body.homepage-reduction-v1 .di-about { grid-template-columns: minmax(0,1fr) !important; gap: 54px; }
  .di-about > *,.di-about-grid { width: 100%; min-width: 0; }
  .di-about-head h2 { font-size: clamp(50px,13vw,78px); }
  .di-selected-head,.di-selected-feature { grid-template-columns: 1fr; }
  .di-selected-head { gap: 24px; }
  .di-selected-head h2 { font-size: clamp(56px,14vw,88px); }
  .di-selected-feature { gap: 42px; }
  .di-selected-visual { width: min(78vw,480px); }
  .di-connect-grid { grid-template-columns: 1fr; gap: 34px; }
  .di-connect-grid > .eyebrow { grid-column: auto; }
  .di-connect-grid h2 { font-size: clamp(48px,12vw,78px); }
  .di-progress { display: none; }
  footer { padding-bottom: calc(34px + env(safe-area-inset-bottom)); }
}

@media (max-width:520px) {
  .hero-copy .hero-positioning { max-width: 18ch; font-size: clamp(27px,8.2vw,38px); }
  .hero-copy .hero-intro { max-width: 34ch; font-size: 15px; }
  .hero-actions { margin-top: 24px; }
  .di-about-grid { grid-template-columns: 1fr; }
  .di-about-grid article,.di-about-grid article:nth-child(odd),.di-about-grid article:nth-child(even) { min-height: 0; padding: 20px 0 24px; border-right: 0; }
  .di-proof-grid { grid-template-columns: 1fr; }
  .di-proof-grid article,.di-proof-grid article:nth-child(odd),.di-proof-grid article:nth-child(even) { min-height: 0; padding: 20px 0 22px; border-right: 0; }
  .di-proof-grid span { margin-bottom: 10px; }
  .di-selected { padding-block: 80px; }
  .di-selected-visual { width: 100%; }
  .di-selected-copy h3 { font-size: clamp(36px,11.5vw,54px); }
  .di-selected-list { grid-template-columns: 1fr; }
  .di-selected-list a,.di-selected-list a:nth-child(n+2) { min-height: 104px; padding: 22px 0 18px; border-right: 0; }
  #progetti .work-grid { display: grid; grid-template-columns: 1fr; }
  #progetti .work { width: 100%; }
  .di-manifesto { min-height: auto; padding-block: 92px; }
  .di-manifesto h2 { gap: .38em; font-size: clamp(35px,10.2vw,47px); line-height: 1.04; }
  .di-manifesto-quote { margin-top: 64px; }
  body.homepage-reduction-v1 .di-connect { min-height: auto; display: grid; padding-block: 0; background: #0b0b0b; }
  .di-connect-grid { padding-block: 92px; }
  .di-connect-grid h2 { font-size: clamp(44px,12.5vw,58px); }
}

@media (prefers-reduced-motion:reduce) {
  .brand-intro { transition: none; }
  .wall-home-track { animation: none !important; }
  .di-progress a { transition: none; }
}

/* Restore the existing photographic intro; only its timing is shortened. */
.brand-intro-name { animation-duration: .48s; animation-delay: .08s; }
.brand-intro-fields { animation-duration: .4s; animation-delay: .14s; }
.brand-intro-payoff { animation-duration: .4s; animation-delay: .28s; }
.brand-intro-media img { animation-duration: .6s; }
html.intro-seen .brand-intro { display: none !important; }

/* Four authentic editorial experiences inside ABOUT, not another section. */
body.homepage-reduction-v1 .di-about { grid-template-columns: minmax(0,1fr) !important; gap: 48px; }
.di-about-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.85fr); column-gap: clamp(40px,7vw,110px); align-items: end; }
.di-about-head .kicker { grid-column: 1/-1; }
.di-about-head h2 { margin-bottom: 0; }
.di-about-head > p:last-child { margin-bottom: .35em; }
@media (min-width: 901px) {
  .di-about-head > p:last-child { max-width: 34ch; padding-right: 50px; }
}

/* v24: compact editorial selection; audiovisual material belongs only to In Motion. */
body.homepage-reduction-v1 .di-about { padding-block: clamp(72px,8vw,104px) !important; gap: 36px; }
.di-beesness-compact { display:grid; grid-template-columns:1fr auto; gap:28px; align-items:center; padding-block:24px; border-block:1px solid rgba(17,17,17,.16); }
.di-beesness-compact h3 { margin:0 0 10px; font-size:clamp(30px,3.3vw,46px); line-height:1.05; }
.di-beesness-compact p { margin:0; color:var(--muted); font-size:14px; }
.di-cover-pair { display:flex; gap:16px; }
.di-cover-pair a { display:block; }
.di-cover-pair img { display:block; width:auto; height:180px; max-width:100%; object-fit:contain; }
.di-compact-projects { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.di-compact-projects .di-experience { grid-column:auto; }
.di-compact-projects img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; background:#f1f0eb; }
.di-compact-projects h3 { margin:18px 0 10px; font-size:clamp(25px,2.6vw,36px); }
.di-compact-projects p { margin:0; font-size:13px; line-height:1.5; }
@media (max-width:700px) {
  .di-beesness-compact { gap:18px; grid-template-columns:1fr; padding-block:22px; }
  .di-cover-pair { gap:14px; }
  .di-cover-pair img { height:144px; }
  .di-compact-projects { display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x proximity; padding-bottom:12px; }
  .di-compact-projects .di-experience { flex:0 0 87%; min-width:0; scroll-snap-align:start; }
  .di-compact-projects h3 { font-size:29px; }
}
.di-experiences { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: clamp(40px,5vw,68px) clamp(24px,4vw,56px); align-items: end; }
.di-experience { min-width: 0; grid-column: span 5; }
.di-experience--beesness,.di-experience--iulm { grid-column: span 7; }
.di-experience-visual { display: block; overflow: hidden; }
.di-experience-visual img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; object-position: center 25%; }
.di-experience--tv img { aspect-ratio: 1280/1005; object-fit: contain; }
.di-experience--radio img,.di-experience--iulm img { aspect-ratio: 16/9; object-position: center; }
.di-experience h3 { margin: 22px 0 8px; font-size: clamp(30px,3.1vw,46px); line-height: 1.05; }
.di-experience > p { color: var(--muted); font-size: 14px; line-height: 1.5; }
.di-experience-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 7px; font-size: 11px; letter-spacing: .04em; }
.di-experience-link span { font-size: 16px; }
.di-experience a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
@media (max-width:700px) {
  .di-about-head { grid-template-columns: minmax(0,1fr); gap: 0; }
  .di-about-head .kicker { grid-column: auto; }
  .di-about-head h2 { margin-bottom: 24px; }
  body.homepage-reduction-v1 .di-about { padding-block: 80px !important; gap: 36px; }
  .di-experiences { grid-template-columns: minmax(0,1fr); gap: 34px; }
  .di-experience,.di-experience--beesness,.di-experience--iulm { grid-column: auto; }
  .di-experience h3 { margin-top: 18px; }
}
