:root {
  --paper: #fafaf7;
  --ink: #20221f;
  --soft: #5b615a;
  --rule: #d0d4cb;
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --gutter: clamp(24px, 4.7vw, 75px);
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--paper); scroll-behavior: smooth; overflow-x: hidden; }
body { min-width: 0; min-height: 100svh; margin: 0; display: flex; flex-direction: column; overflow-x: clip; background: var(--paper); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
main { flex: 1; }
img { display: block; max-width: 100%; }
figure { margin: 0; }
a { color: inherit; text-decoration: none; }
a:hover { color: #667367; }
a:focus-visible, button:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
::selection { background: #dde5da; color: var(--ink); }
.sr-only, .visually-hidden { position: absolute!important; width: 1px!important; height: 1px!important; padding: 0!important; overflow: hidden!important; clip: rect(0,0,0,0)!important; white-space: nowrap!important; border: 0!important; }
.skip-link { position: fixed; z-index: 20; left: 18px; top: -100px; background: var(--ink); color: var(--paper); padding: 11px 16px; }
.skip-link:focus { top: 12px; color: var(--paper); }

/* The navigation is close to the work: quiet, visible, and always in the same place. */
.site-header { position: relative; z-index: 5; }
.header-inner { width: min(100%, 1520px); min-height: 86px; margin: auto; padding: 0 var(--gutter); display: grid; grid-template-columns: minmax(205px,1fr) auto minmax(85px,1fr); align-items: center; gap: clamp(23px,4vw,65px); }
.brand { justify-self: start; font-weight: 500; font-size: clamp(16px,1.3vw,18px); white-space: nowrap; }
.site-nav { display: flex; align-items: center; gap: clamp(19px,2.35vw,36px); }
.site-nav a, .language-switch { font-weight: 500; line-height: 1.3; white-space: nowrap; }
.site-nav a { padding: 12px 0; position: relative; font-size: 14px; }
.site-nav a::after { content: ''; position: absolute; bottom: 7px; left: 0; right: 100%; height: 1px; background: currentColor; transition: right .32s ease; }
.site-nav a:hover::after, .site-nav a[aria-current="page"]::after { right: 0; }
.language-switch { justify-self: end; display: flex; gap: 8px; align-items: center; font-size: 13px; }
.language-switch a { color: var(--soft); }
.language-switch [aria-hidden="true"] { color: #9da39b; }

.site-footer { position: relative; z-index: 1; }
.footer-inner { width: min(100%,1520px); min-height: 93px; margin: auto; padding: 25px var(--gutter); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; color: var(--soft); font-size: 12px; }
.footer-inner a { color: var(--ink); border-bottom: 1px solid currentColor; padding-bottom: 3px; }
.footer-vat { justify-self: end; white-space: nowrap; font-size: 11px; }

/* One image, kept whole. The field is an original irregular vector drawing. */
.home-main { width: 100%; overflow: hidden; }
.home-composition { position: relative; width: min(100%,1440px); height: clamp(650px, calc(66.95vw + 115px), 1070px); margin: 0 auto; isolation: isolate; }
.resonance { position: absolute; z-index: -1; inset: -110px -80px -35px -160px; background: url('resonance-field.svg') center center / 100% 100% no-repeat; pointer-events: none; transform: translate3d(var(--field-x,0),var(--field-y,0),0); transition: transform .85s cubic-bezier(.22,1,.36,1); }
.home-image { position: absolute; top: 22px; right: 9%; width: 43%; max-width: 660px; }
.home-image img { width: 100%; height: auto; }

/* Shared inner-page typography and rhythms. */
main:not(.home-main) { width: min(100%,1420px); margin: 0 auto; padding: clamp(52px,6.2vw,96px) var(--gutter) clamp(94px,10vw,160px); }
main h1 { margin: 0 0 34px; font: 500 clamp(53px,6.4vw,91px)/.96 var(--serif); letter-spacing: -.025em; }
main h2 { font-weight: 500; }
main p { margin: 0 0 1.25em; font-size: 16px; line-height: 1.72; color: var(--ink); text-align: left; hyphens: none; }
main em { font-style: italic; }
main p a:not(.quiet-link), main li a:not(.catalogo-item) { text-decoration: underline; text-decoration-color: #b8afa4; text-underline-offset: 4px; }
.container-about, .studio-container, .dono-container, .lab-container { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.9fr); gap: clamp(54px,8.5vw,132px); align-items: start; }
.bio-content, .studio-text, .dono-text, .lab-text { min-width: 0; }
.page--cartridge-grain .bio-content > p:first-of-type, .page--cartridge-grain-en .bio-content > p:first-of-type, .studio-text > p:first-of-type, .dono-text > p:first-of-type, .lab-text > p:first-of-type { font: 400 clamp(22px,2.1vw,29px)/1.34 var(--serif); margin-bottom: 43px; }
.side-visual, .studio-visual, .dono-visual, .lab-visual { width: 100%; min-width: 0; }
.side-visual > img, .studio-visual > img, .dono-visual > img, .lab-visual > img { width: 100%; height: auto; }
.page--info .side-visual img, .page--info-en .side-visual img { object-fit: contain; }
.info-contact, .contact-minimal, .dono-cta, .sidebar-section, .press-section { margin-top: 50px; padding-top: 20px; border-top: 1px solid var(--rule); }
.info-contact p, .contact-minimal p, .sidebar-info p, .dono-cta p { margin: 10px 0 18px; }
.info-contact a, .contact-minimal a, .dono-cta a, .sidebar-info a { display: inline-block; border-bottom: 1px solid var(--ink); padding: 1px 0 5px; font-size: 13px; font-weight: 600; }
.contact-minimal > .contact-label:not(:first-child) { margin-top: 20px; }
.contact-minimal > a { margin-top: 11px; }
.studio-sections, .dono-sections, .lab-sections { margin-top: 58px; }
.studio-section, .dono-section, .lab-section { border-top: 1px solid var(--rule); padding: 22px 0 15px; }
.studio-section-title, .dono-section-title, .lab-section-title { margin: 0 0 14px; font-size: 11px; line-height: 1.4; letter-spacing: .15em; font-weight: 650!important; text-transform: uppercase; }
.studio-section p, .dono-section p, .lab-section p { font-size: 15px; }
.dono-cta .whatsapp-btn { font-size: 13px; margin: 20px 0 23px; }
.cta-alt-contacts { display: block; }
.lab-location { margin: 14px 0 0; color: var(--soft); font-size: 12px; line-height: 1.5; }
.step-line { display: flex; gap: 10px; }
.step-number { color: var(--soft); }

/* Works are treated as large photographic entries, followed by the archive. */
.works-page { max-width: 1340px; }
.works-page .page-title { position: static!important; width: auto!important; height: auto!important; overflow: visible!important; clip: auto!important; white-space: normal!important; margin-bottom: 49px; }
.works-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(26px,4.5vw,70px); }
.work-item { display: block; min-width: 0; }
.img-wrap { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #eae7e2; }
.img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.work-item:hover .img-wrap img { transform: scale(1.035); }
.caption { display: flex; align-items: baseline; justify-content: space-between; gap: 15px; margin-top: 16px; font-size: 12px; font-weight: 600; letter-spacing: .085em; text-transform: uppercase; }
.caption::after { content: '↗'; font-size: 15px; font-weight: 400; }
.works-divider { border-top: 1px solid var(--rule); margin: clamp(55px,7vw,100px) 0; }
.works-note, .work-subsection, .screen-section { max-width: 850px; margin-left: auto; }
.works-note-label { margin-bottom: 25px; }
.works-note p, .work-subsection p { max-width: 710px; }
.quiet-link { display: inline-block; margin-top: 9px; }
.screen-list { margin-top: 30px; }
.screen-row { display: grid; grid-template-columns: minmax(0,1fr) 135px; gap: 35px; align-items: start; border-top: 1px solid var(--rule); padding: 24px 0; }
.screen-title { font: 500 clamp(25px,3vw,39px)/1.12 var(--serif); margin: 0 0 15px; }
.screen-title a { text-decoration: none!important; }
.screen-role, .screen-type { color: var(--soft); font-size: 11px; letter-spacing: .1em; line-height: 1.6; text-transform: uppercase; }
.screen-cover img { width: 100%; height: auto; max-height: 160px; object-fit: contain; object-position: top right; }

/* Release sheet. */
.project-page { max-width: 1360px; }
.release-layout { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.85fr); gap: clamp(50px,8vw,120px); align-items: center; }
.cover-link { display: block; }
.cover-link img { width: 100%; height: auto; }
.release-copy h1 { margin: 16px 0 30px; }
.release-text { max-width: 440px; font-size: 16px; line-height: 1.7; text-align: left; text-wrap: pretty; }
.tracklist { list-style: none; padding: 0; margin: 42px 0 35px; }
.track-item { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; padding: 13px 0; border-top: 1px solid var(--rule); font-size: 12px; letter-spacing: .065em; text-transform: uppercase; }
.track-item:last-child { border-bottom: 1px solid var(--rule); }
.track-number, .track-duration { color: var(--soft); }
.release-details p { margin: 2px 0; color: var(--soft); font-size: 11px; line-height: 1.6; letter-spacing: .09em; text-transform: uppercase; }
.release-links { display: flex; flex-wrap: wrap; gap: 23px; margin-top: 37px; }

/* Cartridge Grain: archive, credits and external listening routes. */
.page--cartridge-grain .container-about, .page--cartridge-grain-en .container-about { grid-template-columns: minmax(0,1fr) minmax(0,.95fr); }
.credits { margin: 36px 0; font-size: 13px; line-height: 1.8; }
.credits span { font-size: 11px; letter-spacing: .1em; font-weight: 600; }
.press-section { max-width: 640px; }
.press-item { margin-top: 25px; }
.press-pub, .press-author { display: block; margin-bottom: 9px; color: var(--soft); font-size: 11px; }
.airplay-list { padding: 0; margin: 16px 0 0; list-style: none; }
.airplay-list li { display: flex; gap: 10px; padding: 7px 0; font-size: 13px; line-height: 1.5; }
.sidebar-info { margin-top: 0; }
.sidebar-section:first-child { margin-top: 0; }
.sidebar-section p { display: inline-block; margin: 14px 23px 2px 0; }
.catalogo-section { margin-top: 55px; padding-top: 23px; border-top: 1px solid var(--rule); }
.catalogo-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; margin-top: 25px; }
.catalogo-item { display: block; }
.catalogo-item img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #eae7e2; }

/* Live archive: a precise table, with no fabricated future dates. */
.perf-container { max-width: 1200px; }
.live-header h1 { margin-bottom: 54px; }
.archive-label { margin-bottom: 15px; }
.perf-row { display: grid; grid-template-columns: 70px 1fr; gap: 20px; padding: 20px 0; border-top: 1px solid var(--rule); }
.perf-row:last-child { border-bottom: 1px solid var(--rule); }
.perf-row .year { padding-top: 5px; color: var(--soft); font-size: 11px; font-weight: 600; letter-spacing: .1em; }
.perf-row p { margin: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 20px; font-size: 15px; line-height: 1.45; }
.perf-row .project-link { color: var(--soft); flex: 0 0 auto; font-size: 11px; letter-spacing: .08em; font-weight: 600; text-transform: uppercase; text-decoration: none!important; }

/* Internal pages use the same material, without turning the words into a magazine layout. */
main:not(.home-main) { position: relative; isolation: isolate; width: min(100%,1380px); padding-top: clamp(58px,7vw,112px); padding-bottom: clamp(100px,12vw,165px); }
main:not(.home-main)::before { content: ''; position: absolute; z-index: -1; width: min(86vw,940px); height: 600px; top: -230px; right: -330px; background: url('resonance-field.svg') center / contain no-repeat; opacity: .29; pointer-events: none; }
main h1 { font: 500 clamp(43px,4.4vw,62px)/1.04 var(--sans); letter-spacing: -.05em; margin-bottom: 48px; }
main p { font-size: 16px; line-height: 1.72; text-wrap: pretty; }
.page--cartridge-grain .bio-content > p:first-of-type, .page--cartridge-grain-en .bio-content > p:first-of-type, .studio-text > p:first-of-type, .dono-text > p:first-of-type, .lab-text > p:first-of-type { font: 400 clamp(20px,2vw,26px)/1.48 var(--sans); letter-spacing: -.015em; margin-bottom: 37px; }
.container-about, .studio-container, .dono-container, .lab-container { gap: clamp(50px,8vw,135px); }
.page--info .side-visual img, .page--info-en .side-visual img { width: 100%; max-width: 490px; height: auto; object-fit: contain; }
.project-name, .works-note-label, .section-label, .label, .press-label, .contact-label { display: block; font-size: 12px; font-weight: 500; line-height: 1.5; letter-spacing: .025em; text-transform: none; color: var(--soft); }
.quiet-link, .release-link { display: inline-block; font-size: 13px; font-weight: 500; line-height: 1.4; border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.works-page .page-title { margin-bottom: 62px; }
.works-grid { gap: clamp(35px,6vw,95px); }
.works-grid .work-item:nth-child(2) { margin-top: 110px; }
.img-wrap { aspect-ratio: auto; overflow: hidden; background: none; }
.img-wrap img { width: 100%; height: auto; object-fit: contain; transition: transform .5s cubic-bezier(.2,.7,.25,1); }
.work-item:hover .img-wrap img, .work-item:focus-visible .img-wrap img { transform: scale(1.018); }
.caption { margin-top: 18px; font-size: clamp(16px,1.2vw,18px); line-height: 1.28; font-weight: 500; letter-spacing: -.015em; text-transform: none; }
.works-divider { margin: clamp(56px,5vw,78px) 0; }
.works-grid + .works-divider { margin-top: clamp(68px,7vw,96px); }
.works-note, .work-subsection, .screen-section { width: min(100%,760px); max-width: none; margin-left: auto; margin-right: auto; }
.works-note-label { margin-bottom: 19px; color: var(--ink); font-size: clamp(19px,1.65vw,22px); line-height: 1.3; font-weight: 500; letter-spacing: -.025em; }
.works-note p, .work-subsection p { max-width: none; }
.screen-title { font: 500 clamp(19px,1.8vw,25px)/1.25 var(--sans); letter-spacing: -.025em; }
.screen-role, .screen-type { letter-spacing: 0; text-transform: none; font-size: 12px; }
.release-copy h1 { margin: 12px 0 25px; }
.track-item { font-size: 13px; letter-spacing: 0; text-transform: none; }
.release-details p { letter-spacing: 0; text-transform: none; font-size: 12px; }
.press-quote { max-width: 55ch; color: #374038; font: 400 16px/1.68 var(--sans); letter-spacing: 0; text-wrap: pretty; }
.press-pub { margin-bottom: 14px; font-size: 12px; font-weight: 500; }
.press-author { margin-top: 15px; font-size: 12px; }
.perf-row { grid-template-columns: 62px 1fr; }
.perf-row .year, .perf-row .project-link { letter-spacing: 0; text-transform: none; font-size: 12px; }
.studio-section-title, .dono-section-title, .lab-section-title { font-size: 15px; letter-spacing: -.015em; text-transform: none; }
.info-contact, .contact-minimal, .dono-cta, .sidebar-section, .press-section, .studio-section, .dono-section, .lab-section, .screen-row, .perf-row, .works-divider { border-color: var(--rule); }

/* The opening statement is the Info heading; the portrait fills its column. */
.page--info .container-about, .page--info-en .container-about { grid-template-rows: auto; }
.page--info .bio-content, .page--info-en .bio-content { grid-column: 1; grid-row: 1; }
.page--info .bio-opening, .page--info-en .bio-opening { margin: 0 0 34px; font: 400 clamp(20px,1.7vw,23px)/1.46 var(--sans); letter-spacing: -.015em; text-wrap: pretty; }
.page--info .side-visual, .page--info-en .side-visual { grid-column: 2; grid-row: 1; width: 100%; max-width: 500px; aspect-ratio: auto; overflow: visible; }
.page--info .side-visual img, .page--info-en .side-visual img { display: block; width: 100%; max-width: none; height: auto; max-height: none; object-fit: contain; margin: 0; }
.page--studio .studio-title, .page--studio-en .studio-title,
.page--regala .dono-title, .page--regala-en .dono-title { max-width: 18ch; font-size: clamp(38px,3.5vw,50px); line-height: 1.12; letter-spacing: -.042em; margin-bottom: 34px; }

/* Keep the project page legible without adding a second underline to links. */
.page--cartridge-grain .bio-content > p:first-of-type, .page--cartridge-grain-en .bio-content > p:first-of-type { font-size: clamp(18px,1.55vw,21px); line-height: 1.5; margin-bottom: 30px; }
.page--cartridge-grain .bio-content > p:not(:first-of-type), .page--cartridge-grain-en .bio-content > p:not(:first-of-type) { font-size: 15.5px; line-height: 1.7; }
.page--cartridge-grain .credits, .page--cartridge-grain-en .credits { margin: 32px 0 39px; font-size: 14px; line-height: 1.7; }
.page--cartridge-grain .credits span, .page--cartridge-grain-en .credits span { font-size: 11px; letter-spacing: .055em; }
.page--cartridge-grain .sidebar-section a, .page--cartridge-grain-en .sidebar-section a { font-size: 14px; font-weight: 500; text-decoration: none; }
.page--cartridge-grain .sidebar-section p, .page--cartridge-grain-en .sidebar-section p { margin-right: 25px; }
.page--cartridge-grain .sidebar-section:first-child, .page--cartridge-grain-en .sidebar-section:first-child { border-top: 0; padding-top: 0; }
.page--cartridge-grain .catalogo-item, .page--cartridge-grain-en .catalogo-item { display: block; border: 0; padding: 0; }
main .sidebar-info a, main .info-contact a, main .contact-minimal a, main .dono-cta a { text-decoration: none!important; }

/* Justification needs enough measure to avoid stretched words on phones. */
@media (min-width: 760px) {
  .page--info .bio-content > p, .page--info-en .bio-content > p,
  .bio-content > p:not(:first-of-type), .studio-text > p:not(:first-of-type),
  .dono-text > p:not(:first-of-type), .lab-text > p:not(:first-of-type),
  .studio-section p, .dono-section p, .lab-section p,
  .works-note p, .work-subsection p {
    text-align: justify;
    text-justify: inter-word;
    text-align-last: left;
    hyphens: auto;
    hyphenate-limit-chars: 6 3 3;
    word-spacing: normal;
    text-wrap: wrap;
  }
}
@media (min-width: 1195px) and (hover: hover) {
  .page--info .side-visual, .page--info-en .side-visual,
  .page--studio .studio-visual, .page--studio-en .studio-visual,
  .page--regala .dono-visual, .page--regala-en .dono-visual,
  .page--laboratori .lab-visual, .page--workshops .lab-visual {
    position: sticky; top: clamp(28px,7vh,90px); align-self: start;
  }
  .page--studio .studio-visual img, .page--studio-en .studio-visual img,
  .page--laboratori .lab-visual img, .page--workshops .lab-visual img {
    width: auto; max-width: 100%; max-height: calc(100svh - 90px); margin-left: auto;
  }
  .page--laboratori .lab-visual img, .page--workshops .lab-visual img {
    width: 100%; height: auto; max-height: none; margin-left: 0;
  }
  .page--laboratori .lab-visual, .page--workshops .lab-visual { position: static; top: auto; }
}

/* The earlier mobile navigation: page name, central plant, and a dropdown. */
.mobile-bar, .mobile-menu-dropdown { display: none; }
@media (max-width: 1194px), (max-width: 1440px) and (hover: none) {
  body { overflow-x: hidden; }
  .header-inner { display: none; }
  .mobile-bar { width: min(100%,1520px); margin: auto; padding: 19px var(--gutter) 20px; display: grid; grid-template-columns: minmax(0,1fr) 50px minmax(0,1fr); align-items: center; }
  .mobile-page-title { justify-self: start; max-width: 18ch; font-size: 12.5px; line-height: 1.25; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
  .mobile-page-title--long { font-size: 12px; letter-spacing: .09em; }
  .mobile-logo { justify-self: center; display: flex; align-items: center; justify-content: center; width: 50px; height: 44px; }
  .mobile-logo img { display: block; width: auto; height: 35px; }
  .mobile-menu-button { position: relative; justify-self: end; display: flex; align-items: center; justify-content: center; width: 40px; height: 44px; padding: 8px 0 8px 8px; border: 0; background: transparent; color: var(--ink); cursor: pointer; }
  .mobile-menu-button svg { display: none; }
  .mobile-menu-button::before, .mobile-menu-button::after { content: ''; position: absolute; right: 0; width: 22px; height: 1px; background: currentColor; transition: transform .2s ease; }
  .mobile-menu-button::before { transform: translateY(-3.5px); }
  .mobile-menu-button::after { transform: translateY(3.5px); }
  .mobile-menu-button[aria-expanded="true"]::before { transform: rotate(45deg); }
  .mobile-menu-button[aria-expanded="true"]::after { transform: rotate(-45deg); }
  .mobile-menu-dropdown { display: flex; flex-direction: column; visibility: hidden; position: absolute; z-index: 10; top: 100%; left: 0; width: 100%; max-height: min(75svh,640px); overflow-y: auto; padding: 16px var(--gutter) 32px; background: var(--paper); opacity: 0; pointer-events: none; transition: opacity .28s ease, visibility 0s linear .28s; }
  .mobile-menu-dropdown.open { visibility: visible; box-shadow: 0 24px 25px -30px rgba(32,34,31,.24); opacity: 1; pointer-events: auto; transition: opacity .28s ease, visibility 0s; }
  .mobile-menu-dropdown > a { display: block; width: fit-content; padding: 9px 0; color: #555b54; font-size: 16px; font-weight: 400; line-height: 1.35; letter-spacing: 0; text-transform: none; }
  .mobile-menu-dropdown > a[aria-current="page"] { color: var(--ink); font-weight: 650; }
  .mobile-menu-dropdown .mobile-language { display: flex; align-items: center; gap: 8px; margin-top: 21px; color: #9aa097; font-size: 12px; line-height: 1.3; }
  .mobile-language a { color: #555b54; padding: 5px 0; text-decoration: none; }
  .mobile-language [aria-current="page"] { color: var(--ink); font-weight: 650; }
  .page--live .live-header h1, .page--live-en .live-header h1 {
    position: absolute!important; width: 1px!important; height: 1px!important; overflow: hidden!important;
    clip: rect(0,0,0,0)!important; white-space: nowrap!important; margin: 0!important; padding: 0!important;
  }
  .page--live main:not(.home-main), .page--live-en main:not(.home-main) { padding-top: clamp(30px,4vw,48px); }
}
@media (max-width: 1194px), (max-width: 1440px) and (hover: none) {
  .home-composition { display: flex; flex-direction: column; height: auto; min-height: 0; padding-bottom: 32px; }
  .resonance { inset: -90px -35% auto -35%; height: 860px; background-position: center; background-size: 100% 100%; opacity: .87; }
  .home-image { position: relative; inset: auto; order: 1; width: min(calc(100% - var(--gutter) - var(--gutter)), 590px); max-width: none; margin: 38px auto 0; }
  main:not(.home-main) { padding-top: 57px; padding-bottom: clamp(72px,9vw,112px); }
  main h1 { font-size: clamp(36px,4.6vw,48px); line-height: 1.1; margin-bottom: 35px; }
  .studio-text > p:first-of-type, .dono-text > p:first-of-type, .lab-text > p:first-of-type {
    font-size: clamp(18px,2vw,20px); line-height: 1.55; margin-bottom: 31px;
  }
  .page--studio .studio-title, .page--studio-en .studio-title,
  .page--regala .dono-title, .page--regala-en .dono-title { font-size: clamp(36px,4vw,44px); }
  .page--laboratori .lab-title, .page--workshops .lab-title { font-size: clamp(34px,4vw,42px); }
  .page--geografie-sottili .release-copy h1, .page--geografie-sottili-en .release-copy h1 { font-size: clamp(38px,4.5vw,46px); }
  main:is(.container-about, .studio-container, .dono-container, .lab-container, .project-page) { width: min(100%,720px); }
  .page--info main:not(.home-main), .page--info-en main:not(.home-main),
  .page--studio main:not(.home-main), .page--studio-en main:not(.home-main),
  .page--regala main:not(.home-main), .page--regala-en main:not(.home-main),
  .page--laboratori main:not(.home-main), .page--workshops main:not(.home-main),
  .page--lavori main:not(.home-main), .page--works main:not(.home-main),
  .page--geografie-sottili main:not(.home-main), .page--geografie-sottili-en main:not(.home-main) { padding-top: 22px; }
  main:not(.home-main)::before { top: -175px; right: -95px; width: min(115vw,580px); height: 480px; }
  .container-about, .studio-container, .dono-container, .lab-container, .release-layout,
  .page--cartridge-grain .container-about, .page--cartridge-grain-en .container-about { grid-template-columns: 1fr; gap: 46px; }
  .side-visual, .studio-visual, .dono-visual, .lab-visual { position: static; top: auto; justify-self: center; max-width: 620px; margin-inline: auto; }
  .page--info .container-about, .page--info-en .container-about { row-gap: 0; }
  .page--info .bio-content, .page--info-en .bio-content { display: contents; }
  .page--info .side-visual, .page--info-en .side-visual { grid-column: 1; grid-row: auto; order: 0; max-width: 620px; margin: 0 auto 38px; }
  .page--info .bio-opening, .page--info-en .bio-opening { order: 1; }
  .page--info .bio-content > p, .page--info-en .bio-content > p,
  .page--info .info-contact, .page--info-en .info-contact { order: 2; }
  .studio-container, .dono-container, .lab-container { row-gap: 0; }
  .studio-text, .dono-text, .lab-text { display: contents; }
  .studio-visual, .dono-visual, .lab-visual { order: 0; margin: 0 auto 42px; }
  .studio-text > h1, .dono-text > h1, .lab-text > h1 { order: 1; }
  .studio-text > p:first-of-type, .dono-text > p:first-of-type, .lab-text > p:first-of-type { order: 2; }
  .studio-text > p:not(:first-of-type), .studio-text > .studio-sections, .studio-text > .contact-minimal,
  .dono-text > p:not(:first-of-type), .dono-text > .dono-sections, .dono-text > .dono-cta,
  .lab-text > p:not(:first-of-type), .lab-text > .lab-sections, .lab-text > .contact-minimal { order: 4; }
  .studio-visual img, .lab-visual img { width: 100%; height: auto; max-height: none; margin: 0; }
  .cover-wrap { max-width: 620px; margin-inline: auto; }
  .release-copy { max-width: 650px; }
  .works-grid .work-item:nth-child(2) { margin-top: clamp(28px,6vw,64px); }
  .works-page .page-title, .page--cartridge-grain .page-headline, .page--cartridge-grain-en .page-headline {
    position: absolute!important; width: 1px!important; height: 1px!important; overflow: hidden!important;
    clip: rect(0,0,0,0)!important; white-space: nowrap!important; margin: 0!important; padding: 0!important;
  }
  .page--cartridge-grain main:not(.home-main), .page--cartridge-grain-en main:not(.home-main) { padding-top: 32px; }
  .perf-row p { display: block; }
  .perf-row .project-link { display: block; width: fit-content; margin-top: 8px; }
}
@media (min-width: 621px) and (max-width: 900px) and (orientation: portrait) {
  .works-grid { grid-template-columns: 1fr; gap: 64px; }
  .works-grid .work-item:nth-child(2) { margin-top: 0; }
}
/* A landscape tablet has room for the original two-column composition. */
@media (min-width: 1024px) and (min-height: 600px) and (max-width: 1194px) and (orientation: landscape),
       (min-width: 1024px) and (min-height: 600px) and (max-width: 1440px) and (orientation: landscape) and (hover: none) {
  main:is(.container-about, .studio-container, .dono-container, .lab-container, .project-page) { width: min(100%,1280px); }
  .container-about, .studio-container, .dono-container, .lab-container, .release-layout,
  .page--cartridge-grain .container-about, .page--cartridge-grain-en .container-about {
    grid-template-columns: minmax(0,1.04fr) minmax(0,.92fr);
    gap: clamp(44px,5vw,84px);
  }
  .page--info .bio-content, .page--info-en .bio-content { display: block; grid-column: 1; grid-row: 1; }
  .page--info .side-visual, .page--info-en .side-visual { grid-column: 2; grid-row: 1; max-width: none; margin: 0; }
  .studio-text, .dono-text, .lab-text { display: block; grid-column: 1; grid-row: 1; }
  .studio-visual, .dono-visual, .lab-visual { grid-column: 2; grid-row: 1; justify-self: stretch; max-width: none; margin: 0; }
  .perf-row p { display: flex; }
  .perf-row .project-link { display: inline-block; width: auto; margin-top: 0; }
}
@media (max-width: 620px) {
  .mobile-bar { padding-top: 19px; padding-bottom: 20px; }
  main h1 { font-size: clamp(32px,8.6vw,38px); line-height: 1.12; margin-bottom: 27px; }
  .page--info main:not(.home-main), .page--info-en main:not(.home-main),
  .page--studio main:not(.home-main), .page--studio-en main:not(.home-main),
  .page--regala main:not(.home-main), .page--regala-en main:not(.home-main),
  .page--laboratori main:not(.home-main), .page--workshops main:not(.home-main),
  .page--lavori main:not(.home-main), .page--works main:not(.home-main),
  .page--geografie-sottili main:not(.home-main), .page--geografie-sottili-en main:not(.home-main) { padding-top: 6px; }
  .home-image { margin-top: 25px; }
  .works-grid { grid-template-columns: 1fr; gap: 60px; }
  .works-grid .work-item:nth-child(2) { margin-top: 0; }
  .caption { font-size: 12px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; }
  .works-grid + .works-divider { margin-top: 52px; }
  .page--info .bio-opening, .page--info-en .bio-opening { font-size: clamp(19px,5.3vw,22px); }
  .page--studio .studio-title, .page--studio-en .studio-title,
  .page--regala .dono-title, .page--regala-en .dono-title { font-size: clamp(32px,8.7vw,37px); margin-bottom: 27px; }
  .page--laboratori .lab-title, .page--workshops .lab-title { font-size: clamp(30px,8vw,35px); }
  .page--geografie-sottili .release-copy h1, .page--geografie-sottili-en .release-copy h1 { font-size: clamp(35px,9vw,39px); }
  .studio-text > p:first-of-type, .dono-text > p:first-of-type, .lab-text > p:first-of-type { font-size: 18px; line-height: 1.58; }
  .page--laboratori .lab-visual, .page--workshops .lab-visual { margin-bottom: 58px; }
  .page--cartridge-grain .bio-content > p:first-of-type, .page--cartridge-grain-en .bio-content > p:first-of-type { font-size: 17px; line-height: 1.58; }
  .archive-label { font-size: 13px; margin-bottom: 18px; }
  .release-text { max-width: 35ch; }
  .screen-row { grid-template-columns: minmax(0,1fr) 84px; gap: 17px; }
  .screen-title { font-size: 20px; }
  .footer-inner { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; column-gap: 18px; row-gap: 19px; min-height: 0; padding: 30px var(--gutter) 30px; text-align: left; }
  .footer-inner::before { content: ''; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); border-top: 1px solid var(--rule); }
  .footer-role { grid-column: 1 / -1; font-size: 12px; line-height: 1.5; }
  .footer-inner a { grid-column: 1; grid-row: 2; justify-self: start; font-size: 14px; line-height: 1.3; }
  .footer-vat { grid-column: 2; grid-row: 2; justify-self: end; margin: 0; font-size: 10.5px; line-height: 1.4; letter-spacing: .035em; }
}
@media (max-width: 390px) {
  .mobile-page-title { font-size: 12px; letter-spacing: .1em; }
  .mobile-page-title--long { font-size: 11px; letter-spacing: .035em; }
  .perf-row { grid-template-columns: 46px 1fr; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .resonance, .site-nav a::after, .mobile-menu-dropdown, .mobile-menu-button::before,
  .mobile-menu-button::after, .img-wrap img { transition: none; }
}
