/* MNStudio shared stylesheet. Generated from the v5 baseline and project pages. */

:root{
  --paper:#f8f8f6;
  --surround:#ececeb;
  --ink:#0a0a0a;
  --muted:rgba(10,10,10,.58);
  --line:rgba(10,10,10,.36);
  --gutter:clamp(18px,2.5vw,36px);
  --frame:min(1440px,calc(100vw - 48px));
  --display:clamp(4.3rem,5.2vw,6.35rem);
  --section-gap:clamp(7rem,12vw,13rem);
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--surround);color:var(--ink);font-family:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;line-height:1.2;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit}
.site-shell{width:var(--frame);margin:0 auto;box-shadow:0 16px 45px rgba(0,0,0,.08)}
.page-panel{background:var(--paper)}
.header{min-height:7.2rem;padding:1.55rem var(--gutter);display:flex;align-items:flex-start;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:.45rem;font-size:16px;line-height:1.15;letter-spacing:-.02em;white-space:nowrap}
.brand__header-logo{width:clamp(4.2rem,6.5vw,6.5rem);height:auto;object-fit:contain}
.brand__floating-logo{width:6.9rem;max-height:1.55rem;object-fit:contain;filter:invert(1) brightness(2.4) contrast(1.05)}
.header__nav{display:flex;gap:2rem;font-size:16px;line-height:1.15;letter-spacing:-.02em}
.header__nav a,.floating-nav a,.footer a{transition:opacity 180ms ease}.header__nav a:hover,.floating-nav a:hover,.footer a:hover{opacity:.58}
.page-hero{padding:clamp(4rem,9vw,8rem) var(--gutter) var(--gutter)}
.page-hero__copy{display:grid;grid-template-columns:1.5fr .5fr;align-items:end;gap:3rem;margin-bottom:1.4rem}
.page-hero h1{margin:0;font-size:var(--display);font-weight:400;letter-spacing:-.048em;line-height:1.15}
.page-hero__intro{max-width:23rem;margin:0 0 .45rem auto;font-size:clamp(1.05rem,1.28vw,1.28rem);line-height:1.15;letter-spacing:-.025em}
.page-hero__media{margin:0;overflow:hidden;aspect-ratio:2.18/1;background:#ddd}.page-hero__media img{height:100%;object-fit:cover}
.statement-note{padding:clamp(5rem,8vw,8rem) var(--gutter) clamp(4rem,8vw,7rem)}
.statement-note__lead{width:min(48rem,72%);margin:0 auto;text-align:center;font-size:clamp(1.25rem,1.8vw,2rem);line-height:1.18;letter-spacing:-.025em}
.section-kicker{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end;margin-bottom:clamp(4rem,7vw,7rem)}
.section-kicker__eyebrow{font-size:.72rem}.section-kicker h2{margin:0;font-weight:400;font-size:clamp(2rem,3.6vw,4.2rem);line-height:1.02;letter-spacing:-.05em}.section-kicker p{max-width:27rem;margin:0;color:var(--muted);font-size:.86rem;line-height:1.38}
.category-panel{padding:0 var(--gutter) 2.2rem}.category-line{border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-height:4.2rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}.category-tabs{display:flex;gap:1.4rem;flex-wrap:wrap}.filter-btn{border:0;background:transparent;padding:0;cursor:pointer;font-size:clamp(.9rem,1.2vw,1.08rem);letter-spacing:-.02em;color:rgba(10,10,10,.48);transition:color .18s}.filter-btn.is-active,.filter-btn:hover{color:#050505}.category-count{font-size:.72rem;color:var(--muted)}
.projects-panel{padding:clamp(3rem,5vw,5rem) var(--gutter) clamp(8rem,11vw,12rem)}
.projects-mosaic{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,3.6vw,4.4rem);row-gap:clamp(5rem,8vw,8.5rem);align-items:start}
.work-card{grid-column:span 4;min-width:0}.work-card:nth-child(7n+1){grid-column:1/span 5}.work-card:nth-child(7n+2){grid-column:7/span 6;margin-top:6rem}.work-card:nth-child(7n+3){grid-column:2/span 4}.work-card:nth-child(7n+4){grid-column:6/span 7}.work-card:nth-child(7n+5){grid-column:1/span 7}.work-card:nth-child(7n+6){grid-column:8/span 4;margin-top:5rem}.work-card:nth-child(7n){grid-column:3/span 8}.work-card.is-hidden{display:none}
.work-card__image{display:block;overflow:hidden;background:#ddd}.work-card__image img{height:100%;object-fit:cover;transition:transform 850ms cubic-bezier(.2,.8,.2,1),filter 400ms ease}.work-card__image:hover img{transform:scale(1.025);filter:saturate(.88)}
.work-card__meta,.image-caption{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;margin-top:.75rem;font-size:.72rem;color:#0a0a0a}.work-card__meta span:nth-child(2),.image-caption span:nth-child(2){color:rgba(10,10,10,.72)}.work-card__meta time,.image-caption time{text-align:right;color:rgba(10,10,10,.72)}
.detail-hero{padding:clamp(4rem,9vw,8rem) var(--gutter) 1.6rem}.detail-hero__copy{display:grid;grid-template-columns:1.35fr .65fr;align-items:end;gap:3rem}.detail-hero h1{margin:0;font-size:var(--display);font-weight:400;letter-spacing:-.052em;line-height:1.04}.detail-meta{max-width:25rem;margin:0 0 .3rem auto;font-size:clamp(.95rem,1.14vw,1.14rem);line-height:1.2;letter-spacing:-.025em}.detail-meta dl{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1.4rem;margin:1.3rem 0 0;font-size:.74rem;line-height:1.35;letter-spacing:0}.detail-meta dt{color:var(--muted)}.detail-back{display:inline-block;margin-top:1.4rem;border-bottom:1px solid currentColor;padding-bottom:.15rem;font-size:.76rem;letter-spacing:0}
.detail-cover{padding:0 var(--gutter) 4rem}.detail-cover figure{margin:0;overflow:hidden;aspect-ratio:2.18/1;background:#ddd}.detail-cover img{height:100%;object-fit:cover}
.gallery-panel{padding:clamp(4rem,7vw,7rem) var(--gutter) clamp(8rem,11vw,12rem)}.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,3.6vw,4.4rem);row-gap:clamp(4rem,7vw,7rem);align-items:start}.gallery-item{margin:0;overflow:visible}.gallery-item:nth-child(6n+1){grid-column:2/span 10}.gallery-item:nth-child(6n+2){grid-column:1/span 5}.gallery-item:nth-child(6n+3){grid-column:7/span 6;margin-top:2rem}.gallery-item:nth-child(6n+4){grid-column:1/span 4}.gallery-item:nth-child(6n+5){grid-column:6/span 7}.gallery-item:nth-child(6n){grid-column:3/span 8}.gallery-frame{overflow:hidden;background:#ddd}.gallery-frame img{height:100%;object-fit:cover}
.next-strip{padding:0 var(--gutter) 8rem}.next-strip__inner{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.2rem 0;display:flex;align-items:center;justify-content:space-between;gap:2rem}.next-strip__inner span{font-size:clamp(1.8rem,3vw,3.8rem);line-height:1.05;letter-spacing:-.05em}.next-strip small{font-size:.76rem;color:var(--muted)}
.footer{background:#050505;color:#fff;padding:1.3rem 1.4rem 1.1rem;min-height:28rem}.footer__top{display:grid;grid-template-columns:1.3fr .9fr .9fr 1.2fr;gap:2rem;align-items:start}.footer__links,.footer__social{display:grid;gap:.2rem;font-size:.74rem}.footer__email{justify-self:end;font-size:.74rem;border-bottom:1px solid #fff}.footer__bottom{margin-top:10rem;display:grid;grid-template-columns:1fr 2.2fr;align-items:end;gap:3rem}.footer__about{max-width:20rem}.footer__about span,.footer__about p,.footer__about small{display:block;font-size:.7rem}.footer__about p{color:rgba(255,255,255,.72);line-height:1.35}.footer__about small{margin-top:3rem;color:rgba(255,255,255,.55)}.footer__gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;height:8rem;overflow:hidden}.footer__gallery img{height:100%;object-fit:cover;filter:grayscale(1)}
.floating-nav{position:fixed;z-index:20;left:50%;bottom:1.2rem;transform:translate(-50%,160%);width:min(660px,calc(100vw - 2rem));min-height:3.25rem;padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:2rem;background:#050505;color:#fff;border:1px solid rgba(255,255,255,.28);transition:transform 500ms cubic-bezier(.2,.8,.2,1)}.floating-nav.is-visible{transform:translate(-50%,0)}.floating-nav__links{display:flex;gap:1.65rem;font-size:16px;line-height:1.15;letter-spacing:-.02em}
.reveal{opacity:0;transform:translateY(2rem);transition:opacity 900ms ease,transform 900ms cubic-bezier(.2,.8,.2,1)}.reveal.is-visible{opacity:1;transform:translateY(0)}.reveal-mask{clip-path:inset(0 0 100% 0);transform:scale(1.035);transition:clip-path 1100ms cubic-bezier(.76,0,.24,1),transform 1100ms cubic-bezier(.2,.8,.2,1)}.reveal-mask.is-visible{clip-path:inset(0);transform:scale(1)}.delay-1{transition-delay:130ms}.delay-2{transition-delay:260ms}
@media(max-width:900px){.page-hero{padding-top:4.5rem}.page-hero__copy,.section-kicker,.detail-hero__copy,.footer__top,.footer__bottom{grid-template-columns:1fr}.page-hero__intro,.detail-meta{margin:1.5rem 0 0;max-width:28rem}.page-hero__media,.detail-cover figure{aspect-ratio:1.38/1}.projects-mosaic,.gallery-grid{display:block}.work-card,.gallery-item{margin:0 0 4rem!important}.category-line{align-items:flex-start;flex-direction:column;padding:1.2rem 0}.floating-nav{width:calc(100vw - 1rem)}.floating-nav .brand span{display:none}.floating-nav__links{gap:.9rem}.statement-note__lead{width:100%}}
@media(max-width:640px){:root{--frame:calc(100vw - 24px)}.header{min-height:auto;gap:2rem;flex-direction:column}.header__nav{width:100%;justify-content:space-between;gap:.8rem;font-size:.9rem}.page-hero h1,.detail-hero h1{font-size:clamp(3rem,16vw,5rem);line-height:1.08}.page-hero__intro{font-size:1rem;line-height:1.22}.page-hero__media,.detail-cover figure{aspect-ratio:.95/1}.footer__gallery{grid-template-columns:repeat(2,1fr);height:auto}.footer__gallery img{height:8rem}.floating-nav{display:none}}


/* Homepage v5 baseline overrides */

:root {
  --paper: #f8f8f6;
  --surround: #ececeb;
  --ink: #0a0a0a;
  --muted: #777;
  --line: rgba(10, 10, 10, 0.45);
  --gutter: clamp(18px, 2.5vw, 36px);
  --frame: min(1440px, calc(100vw - 48px));
  /* Matched to the supplied reference image: smaller editorial hero type, wider line spacing. */
  --display: clamp(4rem, 4.55vw, 5.4rem);
  --section-gap: clamp(8rem, 15vw, 15rem);
}

* { box-sizing: border-box; }
html { scroll-behavior: auto; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--surround);
  font-family: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
button { font: inherit; }

.site-shell { width: var(--frame); margin: 0 auto; }
.page-panel { background: var(--paper); }

.brand { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 16px; line-height: 1.15; letter-spacing: -0.02em; white-space: nowrap; }
.brand__mark { width: 1.45rem; height: auto; }
.brand__header-logo { width: clamp(4.2rem, 6.5vw, 6.5rem); height: auto; object-fit: contain; }
.brand__floating-logo { width: 6.9rem; max-height: 1.55rem; object-fit: contain; filter: invert(1) brightness(2.4) contrast(1.05); }
.brand--floating { gap: 0; }
.brand--light { color: #fff; }

.header {
  min-height: 7.2rem;
  padding: 1.55rem var(--gutter);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.header__nav { display: flex; gap: 2rem; font-size: 16px; line-height: 1.15; letter-spacing: -0.02em; }
.header__nav a, .floating-nav a, .footer a { transition: opacity 180ms ease; }
.header__nav a:hover, .floating-nav a:hover, .footer a:hover { opacity: 0.58; }

.hero { padding: clamp(4rem, 9vw, 8rem) var(--gutter) var(--gutter); }
.hero__copy { display: grid; grid-template-columns: 1.5fr 0.5fr; align-items: end; gap: 3rem; margin-bottom: 1.4rem; }
.hero h1 { margin: 0; font-size: var(--display); font-weight: 400; letter-spacing: -0.048em; line-height: 1.15; }
.hero__intro { max-width: 22rem; margin: 0 0 0.45rem auto; font-size: clamp(1.05rem, 1.28vw, 1.28rem); line-height: 1.15; letter-spacing: -0.025em; }
.hero__media { margin: 0; overflow: hidden; aspect-ratio: 2.18 / 1; }
.hero__media img { height: 100%; object-fit: cover; }

.statement { padding: var(--section-gap) var(--gutter) 8rem; }
.statement__lead { width: min(48rem, 72%); margin: 0 auto 8rem; text-align: center; font-size: clamp(1.25rem, 1.8vw, 2rem); line-height: 1.18; letter-spacing: -0.025em; }
.statement__notes { display: grid; grid-template-columns: 1fr 1fr; max-width: 55rem; gap: 12vw; }
.statement__notes p { margin: 0; max-width: 19rem; font-size: 0.72rem; line-height: 1.35; }

.works { padding: 3rem var(--gutter) 9rem; }
.section-kicker { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 6rem; }
.section-kicker span { font-size: 0.72rem; }
.section-kicker h2 { margin: 0; font-size: clamp(1.7rem, 3vw, 3.2rem); font-weight: 400; letter-spacing: -0.04em; line-height: 1.05; }
.project-grid { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: clamp(1rem, 4vw, 4.5rem); row-gap: clamp(5rem, 10vw, 10rem); align-items: start; }
.project { min-width: 0; }
.project--01 { grid-column: 1 / span 6; }
.project--02 { grid-column: 8 / span 5; margin-top: 2rem; }
.project--03 { grid-column: 2 / span 10; }
.project--04 { grid-column: 1 / span 4; }
.project--05 { grid-column: 7 / span 6; }
.project__image-link { display: block; overflow: hidden; background: #ddd; }
.project__image-link img { width: 100%; height: auto; object-fit: contain; transition: transform 750ms cubic-bezier(.2,.8,.2,1), filter 400ms ease; }
.project__image-link.is-ratio-ready { aspect-ratio: var(--project-ratio); }
.project__image-link.is-ratio-ready img { height: 100%; object-fit: contain; }
.project__image-link:hover img { transform: scale(1.025); filter: saturate(0.9); }
.project__image-link--drawing { border: 1px solid rgba(0,0,0,.12); background: #fff; }
.project__meta { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; margin-top: 0.75rem; font-size: 0.72rem; }
.works__link { display: block; width: fit-content; margin: 6rem 0 0 auto; }
.text-link { font-size: 0.76rem; border-bottom: 1px solid currentColor; padding-bottom: 0.15rem; }

.process { position: relative; padding: 8rem var(--gutter) 11rem; }
.process__intro { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; min-height: 19rem; }
.process__eyebrow { font-size: 0.72rem; }
.process__intro h2 { margin: 0; font-size: clamp(2rem, 3.6vw, 4.2rem); line-height: 1.02; letter-spacing: -0.05em; font-weight: 400; }
.process__list { position: relative; border-top: 1px solid var(--line); }
.process-row { width: 100%; min-height: 4.2rem; display: grid; grid-template-columns: 2.35rem 2.35rem 1fr; align-items: center; gap: 0.45rem; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: inherit; text-align: left; cursor: pointer; }
.process-row__number, .process-row__arrow { width: 2.1rem; height: 2.1rem; border: 1px solid #111; border-radius: 50%; display: inline-grid; place-items: center; font-size: 0.72rem; transition: background 200ms ease, color 200ms ease, transform 200ms ease; }
.process-row__text { font-size: clamp(0.85rem, 1.25vw, 1.2rem); }
.process-row__content { display: grid; gap: 0.24rem; padding: 0.72rem 0; }
.process-row__title { font-size: clamp(0.95rem, 1.35vw, 1.26rem); font-weight: 400; letter-spacing: -0.025em; }
.process-row__desc { max-width: 48rem; color: rgba(10,10,10,.64); font-size: clamp(0.72rem, 0.95vw, 0.9rem); line-height: 1.38; }
.process-row:hover .process-row__arrow, .process-row:focus-visible .process-row__arrow { background: #111; color: white; transform: rotate(-18deg); }
.process-preview { position: absolute; z-index: 3; width: clamp(10rem, 17vw, 16rem); aspect-ratio: 0.74; overflow: hidden; opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.92); transition: opacity 180ms ease, transform 180ms ease; box-shadow: 0 18px 35px rgba(0,0,0,.15); }
.process-preview.is-visible { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.process-preview img { height: 100%; object-fit: cover; filter: grayscale(1); }

.contact { padding: 0 var(--gutter) var(--gutter); }
.contact__media { position: relative; min-height: clamp(34rem, 56vw, 50rem); overflow: hidden; }
.contact__media > img { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.contact__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.48) 0%, rgba(0,0,0,.08) 55%, rgba(0,0,0,.26) 100%); }
.contact__title { position: absolute; left: 1.4rem; bottom: 1.4rem; margin: 0; color: white; font-weight: 400; font-size: clamp(3rem, 5.6vw, 6.5rem); letter-spacing: -0.055em; line-height: .98; }
.contact__aside { position: absolute; right: 2rem; top: 3rem; width: min(18rem, 30vw); color: white; font-size: 0.8rem; }
.contact__aside p { margin: 0 0 2rem; }
.text-link--light { color: #fff; }

.footer { background: #050505; color: #fff; padding: 1.3rem 1.4rem 1.1rem; min-height: 32rem; }
.footer__top { display: grid; grid-template-columns: 1.3fr .9fr .9fr 1.2fr; gap: 2rem; align-items: start; }
.footer__links, .footer__social { display: grid; gap: 0.2rem; font-size: 0.74rem; }
.footer__email { justify-self: end; font-size: 0.74rem; border-bottom: 1px solid #fff; }
.footer__bottom { margin-top: 13rem; display: grid; grid-template-columns: 1fr 2.2fr; align-items: end; gap: 3rem; }
.footer__about { max-width: 20rem; }
.footer__about span, .footer__about p, .footer__about small { display: block; font-size: 0.7rem; }
.footer__about p { color: rgba(255,255,255,.72); line-height: 1.35; }
.footer__about small { margin-top: 3rem; color: rgba(255,255,255,.55); }
.footer__gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.8rem; height: 8rem; overflow: hidden; }
.footer__gallery img { height: 100%; object-fit: cover; filter: grayscale(1); }
.footer__gallery img:nth-child(2) { clip-path: polygon(0 0, 82% 0, 100% 100%, 0 100%); }
.footer__gallery img:nth-child(3) { clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%); }

.floating-nav { position: fixed; z-index: 20; left: 50%; bottom: 1.2rem; transform: translate(-50%, 160%); width: min(660px, calc(100vw - 2rem)); min-height: 3.25rem; padding: 0.75rem 1rem; display: flex; justify-content: space-between; align-items: center; gap: 2rem; background: #050505; color: #fff; border: 1px solid rgba(255,255,255,.28); transition: transform 500ms cubic-bezier(.2,.8,.2,1); }
.floating-nav.is-visible { transform: translate(-50%, 0); }
.floating-nav__links { display: flex; gap: 1.65rem; font-size: 16px; line-height: 1.15; letter-spacing: -0.02em; }

.loader { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: #000; color: white; clip-path: inset(0 0 0 0); transition: clip-path 1s cubic-bezier(.76,0,.24,1); }
.loader.is-leaving { clip-path: inset(0 0 100% 0); }
.loader.is-gone { display: none; }
.loader__inner { position: relative; width: 18rem; height: 3rem; display: grid; place-items: center; }
.loader__hello, .loader__brand { position: absolute; margin: 0; opacity: 0; transform: translateY(.7rem); transition: opacity 450ms ease, transform 450ms ease; }
.loader__hello.is-visible, .loader__brand.is-visible { opacity: 1; transform: translateY(0); }
.loader__hello { font-size: 0.82rem; }

.reveal { opacity: 0; }
.reveal-up { transform: translateY(2rem); transition: opacity 850ms ease, transform 850ms cubic-bezier(.2,.8,.2,1); }
.reveal-mask { clip-path: inset(0 0 100% 0); transform: scale(1.035); transition: opacity 0ms, clip-path 1200ms cubic-bezier(.2,.8,.2,1), transform 1200ms cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal-mask.is-visible { clip-path: inset(0); transform: scale(1); }
.delay-1 { transition-delay: 120ms; }
.delay-2 { transition-delay: 240ms; }

@media (max-width: 900px) {
  :root { --frame: calc(100vw - 20px); --section-gap: 7rem; }
  .header { min-height: 5.2rem; }
  .header__nav { gap: 1.1rem; }
  .hero { padding-top: 4.5rem; }
  .hero__copy, .section-kicker, .process__intro { grid-template-columns: 1fr; }
  .hero__intro { margin: 1.5rem 0 0; max-width: 24rem; }
  .hero__media { aspect-ratio: 1.38 / 1; }
  .statement__lead { width: 100%; }
  .statement__notes { gap: 3rem; }
  .project-grid { column-gap: 1.5rem; row-gap: 5rem; }
  .project--01 { grid-column: 1 / span 7; }
  .project--02 { grid-column: 8 / span 5; }
  .project--03 { grid-column: 1 / span 12; }
  .project--04 { grid-column: 1 / span 5; }
  .project--05 { grid-column: 6 / span 7; }
  .process__intro { min-height: 16rem; }
  .process-preview { display: none; }
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__email { justify-self: start; }
  .footer__bottom { grid-template-columns: 1fr; margin-top: 8rem; }
}

@media (max-width: 640px) {
  :root { --gutter: 14px; --frame: calc(100vw - 12px); --display: clamp(3rem, 13vw, 4.4rem); }
  body { font-size: 15px; }
  .header { align-items: center; }
  .header__nav a:nth-child(2), .header__nav a:nth-child(3) { display: none; }
  .hero { padding-top: 3.5rem; }
  .hero h1 { line-height: 1.08; }
  .hero__intro { font-size: 1rem; line-height: 1.22; }
  .hero__media { aspect-ratio: .95 / 1; }
  .hero__media img { object-position: 42% center; }
  .statement { padding-bottom: 5rem; }
  .statement__lead { margin-bottom: 4rem; }
  .statement__notes { grid-template-columns: 1fr; gap: 1.5rem; }
  .project-grid { display: block; }
  .project { margin-bottom: 4rem; }
  .project--02, .project--04 { width: 72%; }
  .project--05 { width: 84%; margin-left: auto; }
  .works__link { margin-top: 1rem; }
  .process { padding-top: 5rem; padding-bottom: 7rem; }
  .process-row { grid-template-columns: 1.95rem 1.95rem 1fr; min-height: 4.7rem; }
  .process-row__number, .process-row__arrow { width: 1.75rem; height: 1.75rem; }
  .contact__media { min-height: 38rem; }
  .contact__title { left: 1rem; bottom: 1rem; }
  .contact__aside { left: 1rem; right: auto; top: 1.2rem; width: 70%; }
  .footer { min-height: auto; }
  .footer__top { grid-template-columns: 1fr 1fr; row-gap: 2rem; }
  .footer__email { grid-column: 1 / -1; }
  .footer__gallery { grid-template-columns: 1fr 1fr; height: 13rem; }
  .floating-nav { width: calc(100vw - 1rem); }
  .floating-nav .brand span { display: none; }
  .brand__floating-logo { width: 4.8rem; max-height: 1.2rem; }
  .floating-nav__links { gap: .9rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  .loader { display: none !important; }
  .reveal { opacity: 1 !important; transform: none !important; clip-path: none !important; }
}

/* Automatic tour controls */
.floating-nav {
  width: min(820px, calc(100vw - 2rem));
}
.tour-status {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding-left: 0.9rem;
  border-left: 1px solid rgba(255,255,255,.22);
  white-space: nowrap;
}
.tour-status__progress {
  min-width: 2.7rem;
  color: rgba(255,255,255,.62);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}
.tour-control {
  min-width: 5rem;
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
  padding: 0.35rem 0.65rem;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 999px;
  background: transparent;
  color: #fff;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
}
.tour-control:hover,
.tour-control:focus-visible {
  background: #fff;
  color: #050505;
  border-color: #fff;
  outline: none;
}
.tour-control__icon {
  min-width: 0.8rem;
  font-size: 0.82rem;
  line-height: 1;
}
.tour-control__label {
  font-size: 0.82rem;
}
[data-scroll-scene] {
  scroll-margin-top: 1.5rem;
}

@media (max-width: 900px) {
  .floating-nav { width: min(660px, calc(100vw - 2rem)); }
}

@media (max-width: 640px) {
  .tour-status { display: none; }
}

/* Shared external-file fixes */
[data-preserve-ratio].is-ratio-ready,
.project__image-link.is-ratio-ready,
.gallery-frame.is-ratio-ready {
  aspect-ratio: var(--image-ratio);
}
[data-preserve-ratio].is-ratio-ready > img,
.project__image-link.is-ratio-ready > img,
.gallery-frame.is-ratio-ready > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Reveal-mask elements may appear without the .reveal class on project pages. */
.reveal-mask.is-visible {
  clip-path: inset(0);
  transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 1ms !important;
  }
  .reveal, .reveal-mask {
    opacity: 1 !important;
    transform: none !important;
    clip-path: inset(0) !important;
  }
}

/* v7 robustness fixes -------------------------------------------------
   External JS may be loaded late by previews/builders. The homepage hero image
   is marked critical so it is forced visible by site.js if the reveal observer
   misses the first viewport pass. The process preview also needs to sit above
   all service rows after the stylesheet split. */
.hero__media[data-critical].is-visible {
  opacity: 1;
  clip-path: inset(0);
  transform: scale(1);
}
.process__list {
  position: relative;
}
.process-preview {
  z-index: 30;
}
.process-preview.is-visible {
  opacity: 1;
  visibility: visible;
}
html:not(.js-booted) .hero__media[data-critical] {
  opacity: 1;
  clip-path: inset(0);
  transform: none;
}

/* v8 requested updates -------------------------------------------------
   Project list page now opens directly with the archive content: no page-hero
   block and no section-kicker. Project thumbnails are default-visible, not
   dependent on lazy loading or reveal masks. */
.projects-panel {
  padding-top: clamp(4rem, 7vw, 7rem);
}
.projects-mosaic .work-card {
  opacity: 1;
  transform: none;
}
.projects-mosaic .work-card__image {
  opacity: 1;
  clip-path: inset(0);
  transform: none;
  background: #ddd;
}
.projects-mosaic .work-card__image img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.projects-mosaic .work-card__image.is-ratio-ready img {
  height: 100%;
  object-fit: cover;
}
.project-pagination {
  margin-top: clamp(5rem, 8vw, 8rem);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  min-height: 4.2rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.35rem;
  font-size: 16px;
  letter-spacing: -0.02em;
}
.project-pagination__item,
.project-pagination__next,
.project-pagination__dots {
  color: rgba(10,10,10,.46);
}
.project-pagination__item.is-active,
.project-pagination__item:hover,
.project-pagination__next:hover {
  color: #050505;
}
.project-pagination__next {
  margin-left: 1rem;
  padding-left: 1rem;
  border-left: 1px solid var(--line);
}
@media (max-width: 640px) {
  .project-pagination {
    justify-content: flex-start;
  }
}


/* v9 fixes -------------------------------------------------------------
   1) Keep the homepage critical hero image visible even if the reveal observer
      is delayed by a web preview or by the external JS split.
   2) Keep project-detail images visible by default; the gallery no longer
      depends on lazy loading or an IntersectionObserver to unmask images.
   3) Restore process-row mouseover previews on desktop/narrow preview panels.
*/
.hero__media[data-critical] {
  opacity: 1;
  clip-path: inset(0);
  transform: none;
}
.detail-cover figure,
.gallery-panel .gallery-frame {
  opacity: 1;
  clip-path: inset(0);
  transform: none;
  background: #ddd;
}
.gallery-panel .gallery-frame img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.gallery-panel .gallery-frame.is-ratio-ready img {
  height: 100%;
  object-fit: cover;
}
@media (hover: hover) and (pointer: fine) {
  .process-preview {
    display: block !important;
  }
}
@media (pointer: coarse) {
  .process-preview {
    display: none !important;
  }
}
