
/* Koudkèr: a short editorial opening, followed by a local project sequence. */
.home-opening { min-height:calc(88svh - 76px); display:flex; flex-direction:column; padding-block:2rem 2.25rem; }
.home-opening-grid { flex:1; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(18rem,.55fr); gap:clamp(3rem,8vw,8rem); align-items:center; }
.home-location { margin:0 0 1.6rem; font:.68rem/1.4 var(--mono); letter-spacing:.13em; text-transform:uppercase; color:var(--ink); }
.home-headline { max-width:14ch; margin:0; font:400 clamp(4.8rem,7.3vw,8rem)/.88 var(--display); letter-spacing:-.04em; text-wrap:balance; }
.home-opening .home-headline[data-ink-entry] { animation:none; }
.home-intro { max-width:35ch; justify-self:end; }
.home-intro > p { font-size:1.1rem; margin:0; color:var(--ink-soft); }
.home-actions { display:flex; flex-wrap:wrap; gap:1.5rem; margin-top:1.4rem; }
.home-actions a { display:inline-flex; align-items:center; justify-content:space-between; gap:.75rem; min-height:44px; font-size:.9rem; text-decoration:none; }
.home-actions .home-primary-action { min-height:50px; padding:.15rem 1.1rem; border:1px solid var(--ink); font:.68rem/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.home-actions .home-text-action { font:.68rem/1 var(--mono); letter-spacing:.08em; text-decoration:underline; text-underline-offset:5px; text-transform:uppercase; }
.home-scroll-hint { margin:0; font:.62rem/1 var(--mono); letter-spacing:.09em; text-transform:uppercase; }
.home-scroll-hint span { margin-left:.7rem; }
.home-selection { background:var(--carbon); color:var(--paper); }
.selection-bar { display:flex; gap:1.5rem; align-items:center; flex-wrap:wrap; padding:1rem clamp(1rem,4vw,4rem); border-bottom:1px solid var(--line-light); min-height:80px; }
.selection-bar h2 { margin:0 auto 0 0; font:400 1.1rem var(--text); }
.selection-bar a { min-height:44px; display:inline-flex; align-items:center; color:var(--paper); font-size:.78rem; text-underline-offset:5px; }
.selection-bar a:hover { color:var(--brass); }
.selection-bar :focus-visible { outline-color:var(--brass); }
.selection-count { display:none; font:.65rem var(--mono); color:var(--brass); }
.selection-index { display:flex; gap:1rem; }
.selection-skip { position:absolute; transform:translateY(-200%); opacity:0; pointer-events:none; }
.selection-skip:focus { position:static; transform:none; opacity:1; pointer-events:auto; }
.selection-track { display:block; }
.selected-project { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,6rem); align-items:center; padding:clamp(3rem,6vw,6rem) clamp(2rem,6vw,7rem); min-width:0; }
.selected-project--faham { background:var(--paper); color:var(--ink); }
.selected-project--ocha { background:var(--paper-2); color:var(--ink); }
.selected-copy { max-width:30rem; }
.selected-status { margin:0 0 1.5rem; font:.68rem/1.5 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.selected-copy h3 { font:400 clamp(3.4rem,7.5vw,8rem)/.92 var(--display); letter-spacing:-.04em; margin:0 0 2rem; }
.selected-copy > p:not(.selected-status) { max-width:34ch; font-size:1.05rem; line-height:1.6; opacity:.82; }
.selected-copy .button-line { color:inherit; }
.selected-project--astra .button-line::after { color:var(--brass); }
.selected-project--astra a:focus-visible { outline-color:var(--brass); }
.selected-discipline { display:block; margin-top:2rem; font:.65rem/1.5 var(--mono); opacity:.72; }
.selected-media { min-width:0; width:100%; margin:0; display:grid; place-items:center; }
.selected-media img { display:block; width:auto; height:auto; max-width:100%; max-height:36rem; object-fit:contain; }
:is(.ocha-preview,.astra-preview) img:not(:first-child) { display:none; }
.is-home-horizontal :is(.ocha-preview,.astra-preview) img { display:block; grid-area:1 / 1; opacity:0; transition:opacity 240ms ease-out; }
.is-home-horizontal :is(.ocha-preview,.astra-preview) img.is-active { opacity:1; }
.selected-project--astra .selected-media img { max-width:min(100%,27rem); }
.selected-project--ocha .selected-media img { max-width:45rem; width:100%; }
.home-services { padding-block:clamp(4rem,8vw,8rem); }
.home-section-head { display:grid; grid-template-columns:1fr .7fr; gap:4rem; align-items:end; margin-bottom:3rem; }
.home-section-head h2,.studio-copy h2 { font:400 clamp(2.8rem,5.2vw,5.5rem)/1 var(--display); letter-spacing:-.035em; margin:0; }
.home-section-head h2 em,.studio-copy h2 em { color:var(--accent); }
.home-section-head > p { max-width:37ch; margin:0; color:var(--ink-soft); }
.home-service-list { list-style:none; padding:0; margin:0; }
.home-service-list a { display:grid; grid-template-columns:3rem 1fr auto; gap:1rem; align-items:center; padding:1.35rem 0; border-top:1px solid var(--line); text-decoration:none; }
.home-service-list li:last-child a { border-bottom:1px solid var(--line); }
.home-service-list strong { font:400 clamp(1.6rem,2.9vw,2.8rem)/1.15 var(--display); }
.home-service-list span { font:.7rem var(--mono); color:var(--accent); }
.home-studio { padding-block:clamp(4rem,8vw,7rem); }
.studio-layout { display:grid; grid-template-columns:.68fr 1fr; gap:clamp(3rem,8vw,8rem); align-items:start; }
.studio-portrait { margin:0; }
.studio-portrait img { width:100%; height:auto; object-fit:contain; }
.studio-portrait figcaption { margin-top:1rem; font:.7rem/1.5 var(--mono); color:var(--ink-soft); }
.studio-copy > p { max-width:55ch; color:var(--ink-soft); }
.studio-copy h2 { margin-bottom:2rem; }
.studio-copy blockquote { margin:2.5rem 0 0; border-top:1px solid var(--line); padding-top:1.6rem; }
.studio-copy blockquote p { font:italic 400 clamp(1.5rem,2.5vw,2.4rem)/1.25 var(--display); max-width:35ch; }
.studio-copy blockquote footer { font:.7rem/1.5 var(--mono); color:var(--ink-soft); }
.home-contact { padding-block:clamp(4rem,8vw,8rem); }
.home-contact h2 { font:400 clamp(4rem,8.8vw,9rem)/.93 var(--display); letter-spacing:-.04em; margin:1.8rem 0 2.5rem; }
.home-contact h2 em { color:var(--accent); }
.home-contact > div { display:flex; flex-wrap:wrap; align-items:center; gap:2rem; }
.home-contact-cta { font-size:clamp(1.1rem,2vw,1.5rem); }
.home-contact a { min-height:44px; display:inline-flex; align-items:center; }
.home-contact > p:last-child { margin-top:2rem; font-size:.85rem; color:var(--ink-soft); }
@media(max-width:760px) {
 .home-opening { min-height:calc(100svh - 66px); padding-block:2.5rem 2rem; }
 .home-opening-grid { grid-template-columns:1fr; gap:2.5rem; align-content:center; }
 .home-location { font-size:.73rem; max-width:32ch; }
 .home-headline { font-size:clamp(3.6rem,14.5vw,5.5rem); max-width:11ch; }
 .home-intro { justify-self:start; }
 .home-intro > p { font-size:1rem; }
 .home-actions { gap:1rem; }
 .home-scroll-hint { display:none; }
 .selection-bar { gap:.4rem 1rem; padding:.8rem 1rem; }
 .selection-bar h2 { flex-basis:100%; }
 .selection-index { display:none; }
 .selected-project { grid-template-columns:1fr; gap:2rem; padding:2.5rem 1rem 3rem; }
 .selected-copy h3 { font-size:3.5rem; margin-bottom:1.2rem; }
 .selected-status { margin-bottom:1rem; }
 .selected-discipline { margin-top:1rem; }
 .selected-copy .button-line { margin-top:.75rem; }
 .selected-media img { max-height:32rem; }
 .selected-project--astra .selected-media img { max-width:min(100%,22rem); }
 .selected-project--ocha .selected-media img { max-width:100%; }
 .home-section-head,.studio-layout { grid-template-columns:1fr; gap:2rem; }
 .home-section-head h2,.studio-copy h2 { font-size:3rem; }
 .studio-portrait { width:min(100%,22rem); }
 .home-service-list a { grid-template-columns:1.5rem 1fr 1rem; gap:.5rem; }
 .home-service-list strong { font-size:1.8rem; }
 .home-contact h2 { font-size:4.5rem; }
 .home-contact > div { gap:.5rem; flex-direction:column; align-items:start; }
}

.home-service-routes{display:flex;gap:1.5rem;flex-wrap:wrap;align-items:center}

/* Four standing leaves. Markup is fully readable before enhancement. */
.service-shutters { --shutter-rail:88px; position:relative; margin:2rem 0; }
.service-shutter { border-top:1px solid var(--line); background:var(--paper); color:var(--ink); }
.shutter-heading { margin:0; font:500 1.65rem/1.2 var(--text); }
.shutter-toggle { border:0; border-radius:0; background:transparent; color:inherit; display:flex; width:100%; align-items:center; justify-content:center; padding:1.2rem; text-align:center; cursor:pointer; }
.shutter-number,.shutter-symbol { display:none; }
.shutter-body { padding:1rem 2rem 2rem; }
.shutter-body h4 { font:400 clamp(2rem,3.3vw,3.5rem)/1.05 var(--display); letter-spacing:-.025em; margin:0 0 1.3rem; max-width:18ch; }
.shutter-body p { max-width:49ch; margin:0 0 1rem; }
.shutter-body .button-line { color:inherit; margin-top:1rem; }
.shutter-body .button-line::after { color:inherit; }
.shutter-kicker { font:.68rem/1.5 var(--mono); text-transform:uppercase; letter-spacing:.05em; }
.shutter-toggle:focus-visible { outline-offset:-6px; }
.shutter-toggle:active .shutter-label { opacity:.8; }
.is-enhanced:not(.is-lateral) .service-shutter:not(.is-open) .shutter-body { display:none; }
.is-lateral.service-shutters { height:clamp(21rem,47svh,30rem); overflow:hidden; }
.home-journey:not(.is-home-horizontal) .is-lateral.service-shutters { min-height:var(--shutter-content-height,21rem); }
.is-lateral .shutter-body > * { flex-shrink:0; }
.is-lateral .service-shutter { position:absolute; inset:0 auto 0 0; height:100%; border:0; border-left:1px solid var(--line); transition:transform 280ms cubic-bezier(.23,1,.32,1),clip-path 280ms cubic-bezier(.23,1,.32,1); }
.is-lateral .service-shutter:first-child { border-left:0; }
.is-home-horizontal .is-lateral.is-first-reveal .service-shutter { transition-duration:560ms; }
.is-lateral .shutter-heading { position:absolute; inset:0 auto 0 0; width:var(--shutter-heading-width,var(--shutter-rail)); container-type:size; }
.is-lateral .shutter-toggle { height:100%; padding:1.2rem .75rem; flex-direction:column; gap:1rem; align-items:center; }
.is-lateral .shutter-label { writing-mode:vertical-rl; transform:rotate(180deg); font:500 clamp(1.5rem,5.5cqh,1.875rem)/1.15 var(--text); letter-spacing:0; white-space:nowrap; margin:auto 0; }
.is-lateral .is-open .shutter-label { font-size:clamp(1.75rem,6.5cqh,2.125rem); }
.is-enhanced:not(.is-lateral) .is-open .shutter-label { font-weight:600; }
.is-lateral .shutter-symbol { margin:0; }
.is-lateral .shutter-body { width:min(calc(100% - var(--shutter-rail)),44rem); margin-inline:auto; transform:translateX(calc(var(--shutter-rail) / 2)); height:100%; padding:clamp(1.5rem,3vw,3rem); display:flex; flex-direction:column; justify-content:center; text-align:left; transition:opacity 160ms ease-out; }
.is-lateral .service-shutter:not(.is-open) .shutter-body { opacity:0; visibility:hidden; pointer-events:none; }
.is-lateral .shutter-body .button-line { align-self:start; }
/* The whole homepage has one continuous lateral course. */
html.has-horizontal-home { scroll-behavior:auto; }
.home-journey { overflow-anchor:none; }
.is-home-horizontal .home-viewport { position:sticky; top:var(--home-top); height:calc(100svh - var(--home-top)); overflow:hidden; }
.is-home-horizontal .home-track { position:relative; display:flex; height:100%; width:100%; will-change:transform; }
.is-home-horizontal .home-track > section { flex:0 0 100%; width:100%; max-width:none; height:100%; min-height:0; margin:0; box-sizing:border-box; padding:clamp(1.4rem,3vh,3rem) clamp(2rem,5vw,6rem); }
.is-home-horizontal .home-track > .home-selection { flex-basis:300%; width:300%; padding:0; position:relative; }
.is-home-horizontal .selection-stage { height:100%; }
.is-home-horizontal .selection-bar { position:absolute; z-index:1; inset:0 auto auto 0; width:calc(100% / 3); height:64px; min-height:64px; flex-wrap:nowrap; background:var(--carbon); color:var(--paper); }
.is-home-horizontal .selection-count { display:inline; }
.is-home-horizontal .selection-window { height:100%; padding-top:64px; }
.is-home-horizontal .selection-track { height:100%; display:flex; position:relative; }
.is-home-horizontal .selected-project { flex:0 0 calc(100% / 3); width:calc(100% / 3); height:100%; padding:2rem clamp(2rem,5vw,6rem); min-height:0; }
.is-home-horizontal .selected-copy h3 { font-size:clamp(3.5rem,6vw,6rem); }
.is-home-horizontal .selected-media { height:100%; min-height:0; }
.is-home-horizontal .selected-media img { width:auto; height:auto; max-height:calc(100svh - 240px); max-width:100%; }
.is-home-horizontal .selected-project--astra .selected-media img { max-width:min(100%,27rem); }
.is-home-horizontal .astra-preview img { height:min(calc(100svh - 240px),36rem); width:auto; }
.is-home-horizontal .selected-project--ocha .selected-media img,.is-home-horizontal .selected-project--faham .selected-media img { width:100%; max-width:48rem; }
.is-home-horizontal .selected-project--ocha .selected-media img { max-width:45rem; }
.selected-project--faham .selected-media img { width:100%; height:auto; }
.is-home-horizontal .home-opening { padding-block:clamp(1.5rem,3vh,2.5rem); }
.is-home-horizontal .home-opening-grid { width:100%; }
.is-home-horizontal .home-headline { font-size:clamp(4.8rem,7.3vw,8rem); }
.is-home-horizontal .home-section-head { margin-bottom:1rem; gap:2rem; }
.is-home-horizontal .home-section-head h2 { font-size:clamp(2.5rem,4vw,4rem); }
.is-home-horizontal .home-section-head > p { font-size:.95rem; }
.is-home-horizontal .service-shutters { height:calc(100% - 180px); min-height:300px; margin:1rem 0 0; }
.is-home-horizontal .home-service-routes { gap:1.5rem; }
.is-home-horizontal .home-service-routes .button-line { margin-top:1rem; font-size:.78rem; }
.is-home-horizontal .studio-layout { height:100%; width:100%; max-width:none; padding:0; grid-template-columns:.8fr 1fr; align-items:center; gap:5vw; }
.is-home-horizontal .studio-copy h2 { font-size:clamp(2.7rem,4.3vw,4.5rem); margin-bottom:1.3rem; }
.is-home-horizontal .studio-copy > p { font-size:1rem; margin:.8rem 0; }
.is-home-horizontal .studio-copy blockquote { margin:1.3rem 0 0; padding-top:1rem; }
.is-home-horizontal .studio-copy blockquote p { font-size:clamp(1.5rem,2vw,2rem); margin:0 0 .8rem; }
.is-home-horizontal .studio-portrait img { max-height:calc(100svh - 240px); }
.is-home-horizontal .home-contact { display:flex; flex-direction:column; justify-content:center; }
.is-home-horizontal .home-contact h2 { font-size:clamp(4rem,7vw,7.5rem); margin:1rem 0 2rem; }
.is-home-horizontal .home-contact .site-foot { margin-top:auto; border-top:1px solid var(--line); padding:1rem 0 0; }
.is-home-horizontal .home-contact .site-foot__inner { width:100%; padding:0; max-width:none; gap:1rem; font-size:.7rem; }
.selection-index [aria-current] { color:var(--brass); text-decoration-thickness:2px; }
@media(hover:hover) and (pointer:fine) { .shutter-toggle:hover .shutter-label { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.15em; } }
@media(max-width:899px) { .shutter-heading { font-size:1.6rem; } .shutter-body { padding:1rem 1.2rem 2rem; } }
@media(prefers-reduced-motion:reduce) { .service-shutter,.shutter-body { transition:none!important; } }
