/* Homepage rhythm pass: readable supporting type and proportionate controls. */
.hero>header{padding:30px 0;gap:40px}
.hero>header .brand-art{width:320px}
.hero nav{font-size:1rem;gap:36px}
.hero nav>a{min-height:48px;display:flex;align-items:center}
.hero nav .nav-contact{min-height:52px;padding:0 24px;margin-left:8px;border:1px solid color-mix(in oklch,var(--ivory) 55%,transparent);border-radius:32px;gap:26px}
.hero nav .nav-contact:hover{background:color-mix(in oklch,var(--ivory) 10%,transparent);text-decoration:none}
.hero-content{max-width:940px;padding:56px 0 64px}
.hero .eyebrow{font-size:.8125rem;letter-spacing:.1em;gap:12px;line-height:1.5}
.hero h1{font-size:clamp(5rem,8.4vw,8.5rem);line-height:1.01;margin:24px 0 28px}
.hero .intro{font-size:1.25rem;line-height:1.6}
.hero .actions{margin-top:36px;gap:16px}
.hero .actions a{min-height:62px;padding:0 30px;font-size:1rem;gap:38px}
.hero .actions a>span{font-size:1.5rem}
.services-intro{padding-top:112px;padding-bottom:104px;gap:8vw}
.section-label{font-size:.875rem;line-height:1.5;letter-spacing:.09em;font-weight:500;margin-bottom:18px}
.services-heading h2{font-size:clamp(3.25rem,4.8vw,4.5rem);line-height:1.08}
.services-body{padding-top:39px;max-width:570px}
.services-description{font-size:1.125rem;line-height:1.75;max-width:49ch}
.service-rows{margin-top:30px}.service-rows li{font-size:1.375rem;padding:21px 0}
.services-link{font-size:1rem;margin-top:26px;gap:30px;min-height:48px}
.work-heading{padding-top:48px;margin-bottom:40px}.work-heading .section-label{margin-bottom:18px}
.work-heading h2{font-size:clamp(2.5rem,4vw,3.625rem);line-height:1.12}
.case-location{font-size:.8125rem;letter-spacing:.025em}.case-service{font-size:1rem}.case-open{font-size:.9375rem}.case-number{font-size:.8125rem}
.approach{padding-top:120px;padding-bottom:136px;min-height:1060px}
.approach-heading{grid-template-columns:1.8fr 1fr;gap:6vw;align-items:start}
.approach-heading h2{font-size:clamp(3.25rem,5vw,5rem);line-height:1.08}
.approach-intro{padding-top:8px;max-width:37ch}.approach-intro p{font-size:1.125rem;line-height:1.75}
.approach-link{font-size:1rem;min-height:48px;margin-top:24px}
.approach-explorer{margin-top:112px;gap:8vw}
.approach-tab{font-size:clamp(1.75rem,2.45vw,2.375rem);padding:32px 0}.approach-number{font-size:.875rem}
.approach-count{margin-bottom:30px}.approach-panel h3{font-size:clamp(2rem,3vw,2.875rem);margin-bottom:24px}
.approach-panel>p{font-size:1.125rem;line-height:1.75}.approach-panel ul{gap:14px 20px}.approach-panel li{font-size:.875rem;line-height:1.5}
.contact-close{padding-top:112px;padding-bottom:104px}.contact-close-top{margin-bottom:40px}
.contact-close-top p{font-size:.875rem;letter-spacing:.09em}.contact-close-top>span{font-size:1rem}
.contact-close h2{font-size:clamp(3.75rem,7.3vw,7rem);line-height:1.06}
.contact-close-bottom{margin-top:56px}.contact-close-bottom>p{font-size:1.125rem;line-height:1.75}
.footer-main{gap:6vw;padding:64px 0}.footer-area h2{font-size:1rem;margin-bottom:18px}.footer-area p,.footer-identity>p,.footer-nav a{font-size:1rem;line-height:1.7}.footer-nav a:first-child{margin-top:-9px}
.footer-bottom{font-size:.8125rem;padding:20px 0}.footer-bottom>span{font-size:.8125rem}
@media(max-width:1100px){.hero>header .brand-art{width:270px}.hero nav{gap:24px}.hero nav .nav-contact{padding:0 20px;gap:18px}.hero-content{max-width:800px}.hero h1{font-size:clamp(4.5rem,9vw,6.875rem)}.approach-heading{grid-template-columns:1fr;gap:32px}.approach-intro{padding:0;max-width:48ch}}
@media(max-width:900px){.hero>header{padding:24px 0;gap:24px}.hero .menu-toggle{display:flex;align-items:center;gap:16px;min-height:48px;padding:0;background:transparent;border:0;color:var(--ivory);font-size:1rem}.hero .menu-toggle>span{font-size:1.625rem}.hero nav{display:none;position:absolute;left:var(--gutter);right:var(--gutter);top:100px;z-index:5;background:var(--graphite);border:1px solid color-mix(in oklch,var(--ivory) 25%,transparent);padding:16px 24px;flex-direction:column;align-items:stretch;gap:0}.hero nav.open{display:flex}.hero nav>a{padding:16px 0}.hero nav .nav-contact{margin:8px 0;padding:0 20px;justify-content:space-between}.services-intro{gap:6vw}.services-body{padding-top:39px}.services-description{font-size:1.0625rem}.approach-explorer{gap:48px}}
@media(max-width:760px){.hero{min-height:860px}.hero>header .brand-art{width:230px}.hero-content{margin-top:auto;margin-bottom:auto;padding:64px 0 48px}.hero h1{font-size:clamp(3.5rem,12.8vw,5.75rem);margin:22px 0 26px;line-height:1.03}.hero .eyebrow{font-size:.75rem}.hero .intro{font-size:1.125rem}.hero .actions{gap:12px;margin-top:28px;align-items:stretch}.hero .actions a{min-height:56px;font-size:.9375rem;padding:0 23px;gap:26px}.services-intro{grid-template-columns:1fr;padding-top:76px;padding-bottom:76px;gap:32px}.section-label{font-size:.8125rem;margin-bottom:16px}.services-heading h2{font-size:clamp(2.875rem,9vw,3.75rem)}.services-body{padding:0;max-width:none}.services-description{font-size:1.0625rem}.service-rows li{font-size:1.1875rem;padding:21px 0}.work-heading{padding-top:36px;margin-bottom:30px}.work-heading .section-label{margin-bottom:16px}.work-heading h2{font-size:clamp(2.25rem,7vw,3rem)}.featured-work{padding-bottom:76px}.case-caption .case-location{font-size:.8125rem}.approach{padding-top:80px;padding-bottom:96px;min-height:0}.approach-heading h2{font-size:clamp(2.75rem,8vw,3.75rem)}.approach-intro p,.approach-panel>p{font-size:1.0625rem}.approach-explorer{margin-top:64px;gap:44px;grid-template-columns:1fr}.approach-tab{font-size:1.75rem;padding:26px 0}.approach-panel h3{font-size:2.125rem}.contact-close{padding-top:80px;padding-bottom:76px}.contact-close-top{margin-bottom:30px}.contact-close-top p{font-size:.8125rem}.contact-close h2{font-size:clamp(3rem,9vw,4.25rem)}.contact-close-bottom{margin-top:32px;gap:32px}.contact-close-bottom>p{font-size:1.0625rem}.contact-close-bottom>p br{display:none}.contact-invitation{font-size:1.625rem}.footer-main{gap:40px 28px;padding:48px 0}.footer-area p,.footer-identity>p,.footer-nav a{font-size:.9375rem}.footer-area h2{font-size:.9375rem}.footer-bottom,.footer-bottom>span{font-size:.75rem}}
@media(max-width:400px){.hero>header .brand-art{width:200px}.hero .menu-toggle{gap:12px;font-size:.9375rem}.hero .actions{flex-direction:column;max-width:300px}.hero .actions a{width:100%;min-height:56px}.hero h1{font-size:clamp(3.1rem,12.8vw,3.5rem)}.hero .eyebrow{font-size:.6875rem}.footer-main{grid-template-columns:1fr;gap:36px}.footer-nav{justify-self:start;grid-template-columns:1fr 1fr;gap:0 45px}.footer-nav a:first-child{margin-top:0}.footer-area p{max-width:32ch}}

/* Keep client proof inside the photograph, with a deliberately spacious base. */
.hero{min-height:840px}
.hero h1{font-size:clamp(4.75rem,7.1vw,7.25rem)}
.hero-content{padding-top:32px;padding-bottom:32px}
.hero .client-strip{min-height:176px;padding:40px 0;margin-bottom:24px;border-top:1px solid color-mix(in oklch,var(--ivory) 20%,transparent)}
.hero .client-group li{opacity:.78}
@media(max-width:1100px){.hero h1{font-size:clamp(4.25rem,8vw,6rem)}}
@media(max-width:760px){.hero{min-height:860px}.hero-content{padding-top:42px;padding-bottom:38px}.hero h1{font-size:clamp(3.125rem,11.8vw,5rem)}.hero .client-strip{min-height:144px;padding:30px 0;margin-bottom:20px}}
@media(max-width:400px){.hero h1{font-size:clamp(2.875rem,11.8vw,3.25rem)}}

/* One-viewport hero; compact vertical rhythm on short screens. */
.hero{height:100vh;min-height:0;max-height:none}
.hero .client-strip{border-top:0;min-height:0;height:clamp(100px,17vh,176px);padding:20px 0;margin-bottom:2vh}
.hero-content{padding-top:2vh;padding-bottom:2vh;flex-shrink:0}
@media(max-height:850px){.hero>header{padding:20px 0}.hero h1{font-size:clamp(3rem,min(7.1vw,11vh),6.25rem);margin:18px 0 20px}.hero .intro{font-size:1.0625rem}.hero .actions{margin-top:22px}.hero .actions a{min-height:52px}.hero .client-strip{height:110px}.hero-content{padding-top:12px;padding-bottom:12px}}
@media(max-height:650px){.hero>header{padding:12px 0}.hero>header .brand-art{width:210px}.hero h1{font-size:clamp(2rem,9vh,3.5rem);margin:12px 0}.hero .eyebrow{font-size:.625rem}.hero .intro{font-size:.875rem;line-height:1.4}.hero .actions{margin-top:14px;flex-direction:row;max-width:none;gap:10px}.hero .actions a{width:auto;font-size:.75rem;min-height:44px;padding:0 16px;gap:16px}.hero .client-strip{height:76px;padding:12px 0;margin-bottom:0}.hero-content{padding:8px 0}.hero .client-group li{font-size:16px}.hero .client-group .client-mill{font-size:21px}}

@media(max-width:760px) and (max-height:850px){.hero h1{font-size:clamp(2.5rem,min(11.8vw,9vh),5rem)}}

/* Preserve hero layout; move only the strip contents to the measured midpoint. */
.hero .client-strip{overflow:visible}
.hero .client-fade{transform:translateY(var(--client-center-offset,0px))}
.hero .client-pause{transform:translateY(calc(-50% + var(--client-center-offset,0px)))}

/* A lower, more open hero composition, with compact-screen safeguards. */
@media(min-height:701px){
  .hero-content{padding-top:clamp(64px,10vh,104px);padding-bottom:2vh}
  .hero h1{line-height:1.06;margin-top:32px;margin-bottom:36px}
  .hero .actions{margin-top:44px}
}
@media(max-width:760px) and (min-height:701px){
  .hero-content{padding-top:54px;padding-bottom:16px}
  .hero h1{margin-top:26px;margin-bottom:30px}
  .hero .actions{margin-top:32px}
}

/* Match the quiet case-study header framing. */
.hero>header{padding:32px 0;border-bottom:0}
.hero nav .nav-contact{min-height:48px}
@media(max-width:540px){.hero>header{padding:23px 0}}
@media(max-height:650px){.hero>header{padding:12px 0}}

/* Smoked glass keeps navigation legible over the bright hero sky. */
.hero nav{gap:10px}
.hero nav>a,.hero .menu-toggle{background:rgb(255 255 255 / .055);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgb(255 255 255 / .13);border-radius:32px;box-shadow:inset 0 1px 0 rgb(255 255 255 / .025);color:var(--ivory);transition:background 180ms,border-color 180ms}
.hero nav>a{padding:0 20px}
.hero nav .nav-contact{margin-left:4px;border-color:rgb(255 255 255 / .22);background:rgb(255 255 255 / .08)}
.hero nav>a:hover,.hero nav .nav-contact:hover,.hero .menu-toggle:hover{background:rgb(255 255 255 / .12);border-color:rgb(255 255 255 / .28);text-decoration:none}
.hero nav>a:focus-visible,.hero .menu-toggle:focus-visible{outline:2px solid var(--ivory);outline-offset:4px}
@media(max-width:900px){.hero .menu-toggle{padding:0 18px}.hero nav{gap:0;background:rgb(25 29 30 / .94);border-radius:18px}.hero nav>a{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border-color:transparent;border-radius:9px;padding:16px 12px}.hero nav .nav-contact{margin:8px 0;background:rgb(255 255 255 / .08)}}
@supports not (backdrop-filter:blur(1px)){.hero nav>a,.hero .menu-toggle{background:rgb(25 29 30 / .16)}}
@media(prefers-reduced-motion:reduce){.hero nav>a,.hero .menu-toggle{transition:none}}

/* Quiet supporting copy: location, experience, and the work itself. */
.hero-location{display:flex;align-items:center;gap:14px;font-size:14px;font-weight:400;line-height:1.5;letter-spacing:0;color:var(--ivory);margin:0}
.hero-location>span{opacity:.4;font-size:12px}
.hero .intro{font-size:clamp(16px,1.4vw,20px);font-weight:400;letter-spacing:-.015em;line-height:1.5;color:var(--ivory);max-width:36ch}
@media(max-width:540px){.hero-location{font-size:12px;gap:10px}.hero .intro{font-size:16px}}
@media(max-height:650px){.hero-location{font-size:11px;gap:10px}.hero .intro{font-size:14px}}

/* Closely overlapping dissolves keep the composition stationary. */
.hero-line{display:block}
@keyframes home-arrive{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:no-preference){
 .home-page .hero>header>.brand,.home-page .hero>header>.menu-toggle,.home-page .hero>header>nav,.home-page .hero-line,.home-page .hero .intro,.home-page .hero .actions,.home-page .hero .client-strip{
  animation:home-arrive 900ms cubic-bezier(.16,1,.3,1) both;
  animation-delay:330ms
 }
 .home-page .hero-line{animation-delay:430ms}
 .home-page .hero-line:nth-child(2){animation-delay:460ms}
 .home-page .hero .intro{animation-delay:520ms}
 .home-page .hero .actions{animation-delay:580ms}
 .home-page .hero .client-strip{animation-delay:670ms}
 .home-page .home-reveal-pending{opacity:0}
 .home-page .hero :is(.brand,.menu-toggle,nav,.actions,.client-strip):focus-within{animation:none;opacity:1}
 .home-page .home-reveal-pending:focus-within{opacity:1}
}
@media print{.home-page .home-reveal-pending{opacity:1}.home-page *{animation:none!important}}
