/* A restrained extension of the supplied Yohaku visual system. */
:root{--bg:#f1ede5;--ink:#302922;--muted:#72695f;--dim:#9d9284;--accent:#8b6d50;--line:rgb(57 44 31 / .15);--forest:#473b30;--gold:#a38665;--paper:#e5dccf;--section-space:clamp(4.5rem,8.5vw,8rem)}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:2rem}
.brand{font-size:1.125rem;letter-spacing:-.04em;gap:.65rem;min-height:44px}
.brand-mark{width:40px;height:40px;border-radius:0;object-fit:contain}
.brand:hover .brand-mark{transform:none}
.status{font-size:.8125rem}.status::before{display:none}
.nav{padding-block:1.15rem}.nav-end{gap:1.3rem}.links a{font-size:.9375rem;min-height:44px}
.btn-primary .btn-bg{background:var(--forest)}
.eyebrow{font-size:.875rem}.eyebrow::before{display:none}
.intro h1{letter-spacing:-.055em;max-width:16ch}
.aside p{max-width:48ch}
.nav-toggle{display:none;min-height:44px;border:0;background:none;font:500 .9375rem Inter,sans-serif;color:var(--ink);padding:0 .3rem;cursor:pointer}
.mobile-links{position:absolute;top:74px;left:var(--gutter);right:var(--gutter);z-index:20;background:var(--bg);box-shadow:0 16px 35px #17251c16;padding:.75rem 1rem;border-radius:12px;border:1px solid var(--line)}
.mobile-links a{display:flex;align-items:center;min-height:48px;font-size:1rem}
.nav > .mobile-links:not([hidden]){display:block}
.tf-toggle{clip-path:none;opacity:1;top:auto;left:calc(50% - 22px);bottom:5px;background:transparent;color:var(--muted);border:1px solid var(--line)}
.tf-toggle:hover{background:#deded34d}
.stage .tf-root[data-tf-words]{--tf-band-bottom:64px}
.stage .tf-word{font-size:.75rem}
.tf-root[data-canvas-ready] .tf-still{display:none}
.tf-canvas-fallback{display:block;width:100%;height:100%}
.site-section{max-width:1440px;margin:0 auto;padding:var(--section-space) clamp(1.5rem,6vw,7rem)}
.section-label{font-size:.8125rem;color:var(--muted);margin:0 0 1.5rem;font-weight:500}
h2,h3,p{margin-top:0}h2{font:500 clamp(2.3rem,4.5vw,4.8rem)/1.04 'Inter Tight',Inter,sans-serif;letter-spacing:-.045em;text-wrap:balance;margin-bottom:1.75rem}h2 em{font-style:normal;color:var(--muted)}
.section-copy{color:var(--muted);font-size:1.0625rem;line-height:1.65;max-width:40ch;margin-bottom:0}
.services{display:grid;grid-template-columns:1fr 1fr;gap:7vw;border-top:1px solid var(--line)}
.services h2{max-width:11ch}
.service-list{align-self:end}
.service{padding:1.5rem 0 1.6rem;border-top:1px solid var(--line)}
.service h3{font-size:1.25rem;font-weight:500;letter-spacing:-.025em;margin-bottom:.65rem}
.service p{font-size:.9375rem;color:var(--muted);line-height:1.65;max-width:44ch;margin:0}
.selection{padding-top:1rem}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2.5rem}
.section-heading h2{margin:0;max-width:13ch}.section-heading .link-arrow{margin-bottom:.2rem}
.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.project{min-width:0}
.project-button{display:block;border:0;padding:0;background:none;width:100%;text-align:left;color:inherit;cursor:pointer;font:inherit}
.project-meta{display:flex;align-items:start;justify-content:space-between;gap:.8rem;padding:1.2rem 0}
.project-meta h3{font-size:1.125rem;letter-spacing:-.02em;font-weight:500;margin:0 0 .25rem}
.project-meta p,.project-type{font-size:.8125rem;color:var(--muted);margin:0}
.project-arrow{font-size:1.4rem;line-height:1}
.concept{aspect-ratio:1.28;background:#e6e1d6;padding:9%;overflow:hidden;position:relative;transition:background .35s}
.concept-browser{height:100%;background:#f7f4ea;overflow:hidden;box-shadow:0 12px 30px #21281d14;transform:rotate(-3deg) scale(1.05);transition:transform .6s var(--ease-hover);pointer-events:none}
.concept-top{height:19%;display:flex;align-items:center;justify-content:space-between;padding:0 7%;color:#4b4036;font:500 clamp(8px,.9vw,14px) 'Inter Tight',Inter,sans-serif;letter-spacing:-.02em}
.concept-top small{font:400 .6em Inter,sans-serif}
.concept-body{display:grid;grid-template-columns:1fr 1fr;height:81%;gap:3%;padding:0 0 0 7%}
.concept-text{align-self:center;min-width:0}
.concept-text h4{font:400 clamp(22px,3.4vw,52px)/1 Georgia,serif;letter-spacing:-.055em;margin:0 0 8%;color:#4b4036}
.concept-text p{font-size:clamp(6px,.66vw,10px);line-height:1.6;color:#71665b;margin:0 0 12%;max-width:21ch}
.mini-cta{background:#4b4036;color:#fff;padding:6% 9%;font-size:clamp(5px,.55vw,9px);display:inline-block;letter-spacing:.02em}
.concept-image{width:100%;height:100%;object-fit:cover}
.concept-maison{background:#dbb6a1}.concept-maison .concept-browser{transform:rotate(3deg) scale(1.05);background:#fff8ec}
.concept-maison .concept-top,.concept-maison h4{color:#733e2c}.concept-maison .mini-cta{background:#733e2c}
.concept-maison .concept-image{object-fit:cover;filter:sepia(.4)}
.concept-outline{background:#c0c5c5}.concept-outline .concept-browser{background:#e9ebea;transform:rotate(0) scale(1.05)}
.concept-outline .concept-body{padding:0 7% 5%;display:block;position:relative}
.concept-outline .concept-image{height:100%;object-fit:cover}
.concept-outline h4{position:absolute;top:10%;left:12%;font-family:Inter,sans-serif;color:#263533;font-weight:500}
.concept-outline .concept-text p,.concept-outline .mini-cta{display:none}
.work-note{color:var(--muted);font-size:.8125rem;line-height:1.6;margin:1.3rem 0 0;max-width:70ch}
.package-wrap{padding:0 clamp(1rem,2.5vw,2.5rem)}
.package{max-width:1440px;margin:auto;background:var(--paper);padding:clamp(2rem,6vw,6rem);border-radius:4px;display:grid;grid-template-columns:1.12fr 1fr;gap:8vw}
.package h2{max-width:12ch;margin-bottom:1.5rem}
.package-intro{font-size:1.0625rem;line-height:1.5;color:var(--muted);margin:0 0 1.75rem}
.price{font:500 clamp(5.5rem,9vw,9rem)/1 'Inter Tight',Inter,sans-serif;letter-spacing:-.07em;margin:0 0 .5rem}
.price-copy{font-size:.8125rem;color:var(--muted);margin-bottom:2rem}
.package-detail{padding-top:.25rem}
.package-detail>p{font-size:1.0625rem;color:var(--muted);max-width:38ch;line-height:1.65}
.included{list-style:none;margin:2rem 0 2.5rem;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:1rem;row-gap:.9rem}
.included li{font-size:.875rem;line-height:1.5;display:flex;gap:.6rem}
.included li::before{content:'✓';color:var(--forest);flex:none}
.fine-print{font-size:.75rem!important;line-height:1.65!important;color:var(--muted);max-width:48ch!important}
.process{display:grid;grid-template-columns:1fr 1fr;gap:7vw;border-top:1px solid var(--line)}
.process h2{max-width:10ch}
.process-steps{list-style:none;counter-reset:steps;padding:0;margin:0}
.process-steps li{counter-increment:steps;display:grid;grid-template-columns:2rem 1fr;gap:1rem;padding:1.5rem 0;border-top:1px solid var(--line)}
.process-steps li::before{content:counter(steps,decimal-leading-zero);color:var(--muted);font-size:.75rem;padding-top:.3rem}
.process-steps h3{font-size:1.125rem;font-weight:500;margin:0 0 .6rem}.process-steps p{color:var(--muted);font-size:.9375rem;line-height:1.6;max-width:40ch;margin:0}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:7vw}
.faq h2{max-width:10ch}
details{border-top:1px solid var(--line)}
summary{font-size:1rem;line-height:1.5;min-height:64px;padding:1.3rem 2rem 1.3rem 0;cursor:pointer;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}summary::after{content:'+';position:absolute;right:0;top:1rem;font-size:1.5rem;font-weight:400}details[open] summary::after{content:'−'}
details p{color:var(--muted);font-size:.9375rem;line-height:1.7;margin:0 0 1.5rem;max-width:48ch}
.closing{background:var(--forest);color:var(--bg);padding:clamp(3rem,7vw,7rem) clamp(1.5rem,6vw,7rem)}
.closing-inner{max-width:1260px;margin:auto;display:grid;grid-template-columns:1.4fr 1fr;align-items:end;gap:3rem}
.closing h2{max-width:13ch;margin:0;font-size:clamp(2.8rem,5.6vw,6rem)}
.closing p{max-width:30ch;color:#d7cbbc;font-size:1rem;line-height:1.6}
.closing .btn-bg{background:var(--bg)}.closing .btn-primary{color:var(--forest)}
.footer{max-width:1440px;margin:auto;padding:2.25rem var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:2rem}
.footer-brand{font-size:.875rem;font-weight:500}.footer p{font-size:.75rem;color:var(--muted);margin:.35rem 0 0}
.footer-links{display:flex;gap:1.2rem;flex-wrap:wrap}.footer-links a{display:inline-flex;align-items:center;min-height:44px;font-size:.75rem;color:var(--muted)}
.work-intro{padding-top:clamp(3rem,8vw,7rem);padding-bottom:3rem}
.work-intro h1{font-size:clamp(3.3rem,6vw,7rem);letter-spacing:-.055em;max-width:14ch;margin-bottom:1.5rem}
.work-intro .section-copy{max-width:48ch}
.work-collection{padding-top:0}.work-collection .project-grid{gap:2.7rem 2rem}
.work-collection .project:first-child{grid-column:1 / -1}.work-collection .project:first-child .concept{aspect-ratio:2;padding:5% 18%}
.work-collection .project:first-child .concept-text h4{font-size:clamp(30px,5vw,74px)}
.work-collection .project:first-child .concept-top{font-size:clamp(10px,1.2vw,18px)}
.work-coming{border-top:1px solid var(--line);padding-top:2rem;margin-top:2rem;display:flex;justify-content:space-between;align-items:center;gap:2rem;color:var(--muted);font-size:.875rem}
.concept-dialog{border:0;padding:0;max-width:1000px;width:calc(100% - 32px);max-height:90svh;background:var(--bg);color:var(--ink);border-radius:8px;overflow:auto}
.concept-dialog::backdrop{background:#30261de0;backdrop-filter:blur(8px)}
.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem}.dialog-header p{margin:0;font-size:.875rem}
.dialog-close{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:none;color:var(--ink);font-size:1.5rem;cursor:pointer}
.dialog-art .concept{aspect-ratio:1.7;padding:5% 15%}.dialog-art .concept-text h4{font-size:clamp(26px,5vw,72px)}.dialog-art .concept-top{font-size:clamp(10px,1.5vw,18px)}
.dialog-footer{padding:1.5rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}.dialog-footer p{font-size:.875rem;color:var(--muted);margin:0;max-width:36ch}
@media(hover:hover) and (pointer:fine){.project-button:hover .concept-browser{transform:rotate(0) scale(1.1)}.project-button:hover .project-arrow{transform:translate(3px,-3px)}.project-arrow{transition:transform .3s}.footer-links a:hover{color:var(--ink)}}
@media(min-width:1101px){.selection .project-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}.selection .concept-text h4{font-size:clamp(26px,2.5vw,38px)}}
@media(min-width:1000px) and (min-aspect-ratio:3/2),(min-width:1000px) and (max-height:820px){.intro h1{max-width:none;font-size:min(6.2rem,9svh,5.7vw)}.stage .tf-root[data-tf-words]{--tf-band-bottom:52px}.aside p{max-width:56ch}.intro{padding-top:clamp(2rem,1rem + 4svh,4rem)}.stage{margin-top:-2rem}}
@media(max-width:1100px){.nav{grid-template-columns:1fr auto}.nav>nav{display:none}.status{display:none}.nav-toggle{display:inline-flex;align-items:center}.nav-end{gap:1.5rem}.services,.process,.faq{gap:4vw}.footer{align-items:start}}
@media(max-width:760px){.brand{font-size:1.0625rem;letter-spacing:-.04em}.brand-mark{width:36px;height:36px}.nav{padding-top:max(.85rem,env(safe-area-inset-top));padding-bottom:.85rem;position:relative;z-index:10}.nav-toggle{font-size:.875rem}.nav-end{gap:0}.nav-contact{display:none}.intro{padding-top:1.5rem;gap:1.125rem}.intro h1{max-width:none;font-size:clamp(2.125rem,10vw,4.5rem);line-height:1.04}.aside p{font-size:1rem;max-width:33ch}.aside{gap:1.5rem}.stage{margin-top:-1.3rem;min-height:15rem}.tf-toggle{bottom:4px}.stage .tf-word{font-size:.6875rem}.actions{gap:.5rem 1.25rem}.btn,.link-arrow{font-size:.875rem}.btn{padding-inline:1.15rem}.site-section{padding-inline:1.5rem}.services,.process,.faq{grid-template-columns:1fr;gap:2.5rem}.services h2,.process h2,.faq h2{max-width:14ch}.service-list{margin-top:.5rem}.service{padding:1.2rem 0}.service p{max-width:48ch}.section-copy{font-size:1rem}.section-heading{align-items:start;gap:1.5rem;flex-direction:column;margin-bottom:2rem}.section-heading h2{max-width:14ch}.project-grid{grid-template-columns:1fr;gap:1.8rem}.concept{padding:10%;aspect-ratio:1.23}.concept-text h4{font-size:clamp(24px,7vw,45px)}.concept-top{font-size:12px}.concept-text p{font-size:8px}.mini-cta{font-size:7px}.project-meta{padding:1rem 0}.package-wrap{padding:0 1rem}.package{grid-template-columns:1fr;gap:2.8rem;padding:2.5rem 1.5rem}.package h2{max-width:13ch}.package-detail>p{font-size:1rem}.included{margin-top:1.5rem;gap:1rem .9rem}.included li{font-size:.8125rem}.price{font-size:6.5rem}.price-copy{margin-bottom:1.5rem}.closing-inner{grid-template-columns:1fr;gap:2rem}.closing h2{max-width:13ch}.closing p{max-width:35ch}.footer{flex-direction:column;gap:.8rem;padding:2rem 1.5rem}.footer-links{gap:0 1.3rem}.work-intro{padding-top:3.3rem}.work-intro h1{font-size:3.5rem}.work-collection .project:first-child .concept{aspect-ratio:1.23;padding:10%}.work-collection .project:first-child .concept-text h4{font-size:clamp(24px,7vw,45px)}.work-collection .project:first-child .concept-top{font-size:12px}.work-coming{align-items:start;flex-direction:column;gap:1rem}.dialog-art .concept{aspect-ratio:1.05;padding:8%}.dialog-art .concept-text h4{font-size:32px}.dialog-footer{flex-direction:column;align-items:start;gap:1.25rem}}
@media(max-width:380px){.brand{font-size:.9375rem;gap:.5rem}.brand-mark{width:32px;height:32px}.nav-end{gap:0}.intro{padding-top:1rem}.intro h1{font-size:2.125rem}.aside p{font-size:.9375rem}.actions{gap:.25rem 1rem}.btn{padding-inline:1rem}.section-heading h2{font-size:2.4rem}.included{grid-template-columns:1fr}.work-intro h1{font-size:3rem}}
@media(max-width:760px) and (max-height:740px){.intro{gap:.75rem;padding-top:.5rem}.intro h1{font-size:2.25rem}.aside{gap:1rem}.aside p{font-size:.9375rem;line-height:1.5}.stage{margin-top:-1.5rem;min-height:12rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}