
/* Concept "From concrete to masterpiece": the page sells transformation. One pinned opening film (raw shell -> drawn design -> finished room),
   then editorial chapters where the visitor wipes "before" into "after" themselves. Intentionally single-theme: warm paper + ink. */
:root{
  color-scheme:light;
  --paper:#f2ede5;
  --paper-2:#e9e2d7;
  --ink:#16130f;
  --ink-2:#4a443c;
  --mute:#655f55;
  --line:rgba(22,19,15,.14);
  --gold:#85632b;
  --night:#0e0d0b;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Inter Tight",system-ui,sans-serif;
  --gut:clamp(16px,4vw,56px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper)}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.lenis.lenis-smooth{scroll-behavior:auto}
.label{font-family:var(--sans);font-size:11px;letter-spacing:.32em;text-transform:uppercase;font-weight:400}
.serif{font-family:var(--serif);font-weight:300}

/* ---------- preloader ---------- */
#pre{position:fixed;inset:0;z-index:100;background:var(--night);color:var(--paper);display:none;flex-direction:column;justify-content:space-between;padding:var(--gut);transition:transform 1.2s cubic-bezier(.77,0,.18,1)}
#pre.out{transform:translateY(-100%)}
#pre .mark{font-family:var(--serif);font-size:clamp(64px,14vw,200px);line-height:.9;letter-spacing:-.02em;overflow:hidden}
#pre .mark span{display:inline-block;transform:translateY(105%);animation:up 1s cubic-bezier(.2,.8,.2,1) forwards}
#pre .mark span:nth-child(2){animation-delay:.08s}#pre .mark span:nth-child(3){animation-delay:.16s}#pre .mark span:nth-child(4){animation-delay:.24s}
#pre .row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
#pre .count{font-family:var(--serif);font-size:clamp(28px,4vw,48px);font-style:italic}
@keyframes up{to{transform:none}}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:22px var(--gut);color:var(--paper);pointer-events:none;transition:background .4s,padding .4s,backdrop-filter .4s}.nav.solid{background:rgba(14,13,11,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);padding-top:14px;padding-bottom:14px}
.nav>*{pointer-events:auto}
.logo{font-family:var(--serif);font-size:26px;letter-spacing:.02em;font-weight:400}
.logo sup{font-family:var(--sans);font-size:9px;letter-spacing:.3em;margin-left:6px;vertical-align:super}
.nav ul{display:flex;gap:36px;list-style:none}
.nav ul a,.nav .cta{position:relative}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.nav ul a:hover::after{transform:scaleX(1);transform-origin:left}
.nav .cta{border:1px solid currentColor;border-radius:999px;padding:10px 20px}
@media (max-width:820px){.nav ul{display:none}}
.nav .cta{white-space:nowrap}
@media (max-width:600px){.logo sup{display:none}.nav .cta{font-size:10px;letter-spacing:.2em;padding:9px 14px}}

/* ---------- opening film ---------- */
#film{height:420vh;position:relative;background:var(--night)}
#film .stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;color:var(--paper)}
#film .layer{position:absolute;inset:0}
#film .layer img,#film canvas.cv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#film .before{will-change:transform,filter}
#film .after{clip-path:inset(50% 50% 50% 50%);will-change:clip-path}
#film .after img{will-change:transform}
#film .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,13,11,.55) 0%,rgba(14,13,11,0) 30%,rgba(14,13,11,0) 60%,rgba(14,13,11,.7) 100%)}
#film .bp{position:absolute;inset:0;background:#11161b;opacity:0}
#film canvas.cv{opacity:0;mix-blend-mode:screen}
#film svg.dims{position:absolute;inset:0;width:100%;height:100%;opacity:0}
#film svg.dims *{vector-effect:non-scaling-stroke}
.dims line,.dims path{stroke:#d9c49e;stroke-width:1;fill:none}
.dims text{fill:#d9c49e;font:400 11px var(--sans);letter-spacing:.2em}
.caption{position:absolute;left:var(--gut);right:var(--gut);bottom:clamp(28px,7vh,72px);display:grid;grid-template-columns:1fr auto;align-items:end;gap:24px}
.caption .t{font-family:var(--serif);font-weight:300;font-size:clamp(46px,9.5vw,150px);line-height:.92;letter-spacing:-.025em}
.caption .t em{font-style:italic}
.caption .line{display:block;overflow:hidden}
.caption .line>span{display:block;transition:transform 1.1s cubic-bezier(.2,.8,.2,1),opacity 1.1s}
.caption .t{position:absolute;left:0;bottom:0;opacity:0}
.caption .t.on{opacity:1}
.caption .t .line>span{transform:translateY(105%)}
.caption .t.on .line>span{transform:none}
.caption .t.on .line:nth-child(2)>span{transition-delay:.08s}
.heads{position:relative;min-height:2em}
.stages{display:flex;flex-direction:column;gap:10px;text-align:right}
.stages div{display:flex;gap:14px;justify-content:flex-end;align-items:center;opacity:.35;transition:opacity .6s}
.stages div.on{opacity:1}
.stages i{display:block;width:44px;height:1px;background:currentColor;transform-origin:left;transform:scaleX(var(--p,0))}
.scrollcue{position:absolute;top:50%;right:var(--gut);writing-mode:vertical-rl;transform:translateY(-50%);opacity:.7}
@media (max-width:700px){.caption{grid-template-columns:1fr}.stages{flex-direction:row;justify-content:flex-start;text-align:left;gap:18px}.stages i{display:none}.scrollcue{display:none}}

/* ---------- manifesto ---------- */
.manifesto{padding:clamp(120px,22vh,240px) var(--gut);max-width:1400px;margin:0 auto}
.manifesto .label{color:var(--mute);margin-bottom:40px;display:block}
.manifesto p{font-family:var(--serif);font-weight:300;font-size:clamp(30px,4.6vw,72px);line-height:1.08;letter-spacing:-.015em}
.manifesto p .w{opacity:.14;transition:opacity .25s linear}
.manifesto p em{font-style:italic;color:var(--gold)}

/* ---------- chapters ---------- */
.chapter{padding:0 var(--gut) clamp(120px,18vh,200px);max-width:1600px;margin:0 auto}
.ch-head{display:grid;grid-template-columns:120px 1fr auto;gap:24px;align-items:end;border-top:1px solid var(--line);padding-top:28px;margin-bottom:36px}
.ch-head .no{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--gold)}
.ch-head h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,6vw,96px);line-height:.95;letter-spacing:-.02em}
.ch-head .meta{text-align:right;color:var(--ink-2)}
@media (max-width:760px){.ch-head{grid-template-columns:1fr}.ch-head .meta{text-align:left}}
.wipe{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:2px;background:var(--paper-2);cursor:none;touch-action:pan-y;user-select:none}
.wipe img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.wipe .top{clip-path:inset(0 0 0 var(--x,50%))}
.wipe .bar{position:absolute;top:0;bottom:0;left:var(--x,50%);width:1px;background:var(--paper);box-shadow:0 0 0 .5px rgba(0,0,0,.15)}
.wipe .tagL,.wipe .tagR{position:absolute;bottom:20px;color:var(--paper);text-shadow:0 1px 8px rgba(0,0,0,.4)}
.wipe .tagL{left:22px}.wipe .tagR{right:22px}
.wipe .tagL,.wipe .tagR{background:rgba(22,19,15,.42);padding:7px 12px;border-radius:999px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.wipe .knob{position:absolute;top:50%;left:var(--x,50%);width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;border:1px solid var(--paper);display:grid;place-items:center;color:var(--paper);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(22,19,15,.18)}
@media (pointer:coarse){.wipe{cursor:auto}}
.ch-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,120px);margin-top:44px}
.ch-body p{font-size:clamp(17px,1.3vw,20px);color:var(--ink-2);max-width:52ch}
.ch-body dl{display:grid;grid-template-columns:auto 1fr;gap:12px 32px;align-content:start}
.ch-body dt{color:var(--mute)}
.ch-body dd{font-family:var(--serif);font-size:22px;line-height:1.2}
@media (max-width:760px){.ch-body{grid-template-columns:1fr}}
.viz{margin-top:14px;color:var(--mute);font-size:12px}

/* ---------- approach (horizontal) ---------- */
#approach{height:360vh;position:relative;background:var(--night);color:var(--paper)}
#approach .stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
#approach .top{position:absolute;top:clamp(90px,14vh,140px);left:var(--gut);right:var(--gut);display:flex;justify-content:space-between;align-items:end;gap:24px}
#approach h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,6vw,96px);line-height:.95;letter-spacing:-.02em}
#approach h2 em{font-style:italic;color:var(--gold)}
.track{display:flex;gap:clamp(20px,3vw,48px);padding:0 var(--gut);will-change:transform;margin-top:12vh}
.step{flex:0 0 clamp(280px,34vw,520px);border-top:1px solid rgba(242,237,229,.25);padding-top:26px}
.step .n{font-family:var(--serif);font-style:italic;font-size:clamp(64px,8vw,120px);line-height:1;color:var(--gold)}
.step h3{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.4vw,36px);margin:18px 0 12px}
.step p{color:rgba(242,237,229,.7);max-width:40ch}
.progress{position:absolute;left:var(--gut);right:var(--gut);bottom:clamp(28px,6vh,60px);height:1px;background:rgba(242,237,229,.18)}
.progress i{position:absolute;left:0;top:0;bottom:0;background:var(--paper);transform-origin:left;transform:scaleX(0);width:100%}

/* ---------- promise ---------- */
.promise{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line);margin:0 var(--gut)}
.promise div{padding:clamp(48px,8vh,90px) 0;border-right:1px solid var(--line);padding-right:24px}
.promise div+div{padding-left:clamp(16px,3vw,48px)}
.promise div:last-child{border-right:0}
.promise b{display:block;font-family:var(--serif);font-weight:300;font-size:clamp(48px,6vw,96px);line-height:1;letter-spacing:-.02em}
.promise span{color:var(--ink-2)}
@media (max-width:760px){.promise{grid-template-columns:1fr}.promise div{border-right:0;border-bottom:1px solid var(--line);padding-left:0!important}}

/* ---------- contact ---------- */
.contact{padding:clamp(120px,20vh,220px) var(--gut) 60px;max-width:1600px;margin:0 auto}
.contact h2{font-family:var(--serif);font-weight:300;font-size:clamp(52px,10vw,170px);line-height:.9;letter-spacing:-.03em}
.contact h2 em{font-style:italic;color:var(--gold)}
.contact form{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:70px;align-items:end}
.contact label{display:flex;flex-direction:column;gap:10px;color:var(--mute)}
.contact input,.contact select{font:inherit;font-size:18px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);padding:10px 0;border-radius:0;outline:none}
.contact input:focus,.contact select:focus{border-color:var(--gold)}
.btn{display:inline-flex;align-items:center;gap:14px;background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:18px 30px;font:inherit;font-size:13px;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;transition:background .4s}
.btn:hover{background:var(--gold)}
#msg{grid-column:1/-1;color:var(--ink-2);min-height:1.6em}
@media (max-width:900px){.contact form{grid-template-columns:1fr}}
footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:40px var(--gut);border-top:1px solid var(--line);color:var(--mute);font-size:13px}

/* ---------- cursor ---------- */
#cur{position:fixed;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--paper);mix-blend-mode:difference;pointer-events:none;z-index:90;transition:width .35s,height .35s,margin .35s;display:grid;place-items:center}
#cur span{font:500 10px var(--sans);letter-spacing:.2em;color:#000;opacity:0;transition:opacity .2s}
#cur.big{width:86px;height:86px;margin:-43px 0 0 -43px}
#cur.big span{opacity:1}
@media (pointer:coarse){#cur{display:none}}

.rv{opacity:1;transform:none;transition:opacity 1.2s cubic-bezier(.2,.8,.2,1),transform 1.2s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}#pre{display:none}}
@media (max-width:600px){.wipe{aspect-ratio:4/5}}
.film-viz{position:absolute;top:84px;right:var(--gut);color:rgba(242,237,229,.75);font:400 10px var(--sans);letter-spacing:.28em;text-transform:uppercase}
footer .legal{flex-basis:100%;font-size:12px;line-height:1.7}
footer a{text-decoration:underline;text-underline-offset:3px}
.formnote{grid-column:1/-1;font-size:13px;color:var(--mute);max-width:80ch}

/* Audit: readable fallbacks, keyboard navigation and compact mobile layouts. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-90px;z-index:150;background:var(--paper);color:var(--ink);padding:12px 18px;border:2px solid var(--ink)}
.skip:focus{top:12px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
.nav-right{display:flex;align-items:center;gap:18px}
.languages{display:flex;gap:10px;font-size:12px;font-weight:500;letter-spacing:.08em}
.languages a{padding:10px 3px}.languages [aria-current]{text-decoration:underline;text-underline-offset:5px}
.hero-summary{padding:30px var(--gut);max-width:1600px;margin:auto;color:var(--ink-2);font-size:clamp(16px,1.5vw,21px)}
.hero-summary strong{font-weight:500}
.wipe{cursor:ew-resize}.wipe-control{display:flex;align-items:center;gap:16px;margin-top:12px;flex-wrap:wrap;font-size:14px;color:var(--ink-2)}
.wipe-control input{accent-color:var(--ink);width:min(100%,320px);min-height:44px;cursor:ew-resize}.wipe-control label{flex:1 1 240px}
.contact textarea{font:inherit;font-size:18px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);padding:10px 0;resize:vertical;min-height:54px;max-width:100%}
.contact input,.contact select{min-width:0;width:100%}.contact input[aria-invalid=true]{border-color:#a12b24}
.formnote{color:var(--ink-2)}.formnote a{text-decoration:underline;text-underline-offset:3px}
.contact-links{margin-top:20px}.contact-links a{text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}
footer{color:var(--ink-2)}footer .legal{overflow-wrap:anywhere}footer .footer-links{display:flex;gap:18px;flex-wrap:wrap}
.scope-note{font-size:14px;color:var(--ink-2);margin-top:20px;max-width:70ch}
#approach h2 em,#approach .step .n{color:#c6a36b}
.noscript-note{padding:28px var(--gut);background:var(--paper-2)}
@media(max-width:600px){.nav{padding-top:14px;padding-bottom:14px}.nav-right{gap:10px}.nav .cta{font-size:9px;letter-spacing:.08em;padding:8px 10px}.logo{font-size:24px}.languages{gap:5px}.ch-body dl{gap:12px 18px}.caption .t{font-size:clamp(39px,9vw,56px)}.film-viz{top:76px}.wipe .tagL,.wipe .tagR{font-size:9px;letter-spacing:.12em;bottom:12px}.wipe .tagL{left:12px}.wipe .tagR{right:12px}}
@media(prefers-reduced-motion:reduce){#film{height:100svh}#film .after{clip-path:none!important}#film .before,#film .bp,#film canvas,#film svg{display:none}#film .t{display:none}#film .t[data-s="2"]{display:block;opacity:1}#film .t .line>span{transform:none}#approach{height:auto}#approach .stage{position:relative;height:auto;overflow:visible;padding:110px var(--gut) 60px}#approach .top{position:static;display:block}#approach .track{display:grid;padding:0;margin-top:40px;transform:none!important;gap:40px}.step{width:auto}.step[aria-hidden=true]{display:none}.progress{display:none}.manifesto p .w{opacity:1!important}#cur{display:none}}

.services{max-width:1600px;padding:80px var(--gut);margin:auto}.services>h2{font:300 clamp(40px,6vw,84px)/1 'Cormorant Garamond',Georgia,serif;margin:18px 0 35px}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.service-card{display:block;border-top:1px solid var(--line);padding:22px 0}.service-card h3{font:400 28px/1.1 'Cormorant Garamond',Georgia,serif;margin-bottom:16px}.service-card p{color:var(--ink-2);font-size:15px}.service-card span{display:inline-block;margin-top:18px;text-decoration:underline;text-underline-offset:5px}.service-card:hover h3{color:var(--gold)}
body.service-page{background:var(--paper)}.service-top{max-width:1400px;margin:auto;padding:22px var(--gut);display:flex;align-items:center;justify-content:space-between;gap:22px}.service-top .logo sup{display:inline}.service-main{max-width:1400px;margin:auto;padding:24px var(--gut) 100px}.breadcrumbs{font-size:13px;color:var(--ink-2);margin:10px 0 44px}.breadcrumbs ol{display:flex;gap:12px;list-style:none;flex-wrap:wrap}.breadcrumbs a{text-decoration:underline}.service-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}.service-hero h1{font:300 clamp(44px,5.5vw,84px)/1 'Cormorant Garamond',Georgia,serif;margin:18px 0 26px;letter-spacing:-.02em;overflow-wrap:anywhere}.service-hero p{font-size:19px;color:var(--ink-2)}.service-hero figure{margin:0}.service-hero img{aspect-ratio:4/3;width:100%;height:auto;object-fit:cover}.service-hero figcaption{font-size:12px;margin-top:10px;color:var(--ink-2)}.service-copy{max-width:850px;margin:72px auto}.service-copy section{margin:44px 0}.service-copy h2{font:400 clamp(30px,4vw,44px)/1.08 'Cormorant Garamond',Georgia,serif;margin-bottom:20px}.service-copy p{font-size:18px;line-height:1.75;color:var(--ink-2)}.service-faq{margin-top:60px}.service-faq details{border-top:1px solid var(--line);padding:20px 0}.service-faq summary{font-size:18px;font-weight:500;cursor:pointer}.service-faq details p{margin-top:18px}.service-consult{padding:32px;background:var(--paper-2);margin-top:55px}.service-consult h2{font-size:36px}.service-consult .btn{margin-top:24px;letter-spacing:.12em}.service-related{padding:50px 0;border-top:1px solid var(--line)}.service-related h2{font:400 36px/1.1 'Cormorant Garamond',Georgia,serif;margin-bottom:22px}.service-related ul{display:flex;gap:18px 30px;flex-wrap:wrap;list-style:none}.service-related a{text-decoration:underline;text-underline-offset:4px}.service-main a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}details:focus-within{outline-offset:4px}
@media(max-width:900px){.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-hero{grid-template-columns:1fr;gap:32px}.service-hero figure{max-width:800px}.service-copy{margin-top:48px}}
@media(max-width:600px){.service-grid{grid-template-columns:1fr}.service-top{gap:14px}.service-top .logo sup{font-size:8px}.service-hero h1{font-size:44px}.service-consult{padding:24px}.service-copy p{font-size:17px}.service-main{padding-top:14px}.breadcrumbs{margin-bottom:28px}}

.form-btns{display:flex;gap:14px;flex-wrap:wrap;grid-column:1/-1}.form-btns .btn{flex:1 1 220px}.btn-wa{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)}.btn-wa:hover{background:var(--ink)!important;color:var(--paper)!important}.promise b{font-variant-numeric:lining-nums}.cbtns{display:flex;gap:14px;flex-wrap:wrap;margin-top:16px}.cbtn{display:inline-flex;align-items:center;gap:12px;padding:16px 28px;border:1px solid currentColor;border-radius:999px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;transition:background .3s,color .3s}.cbtn:hover,.cbtn:focus-visible{background:var(--ink);color:var(--paper)}.ico{width:18px;height:18px;flex:none}.contact-direct{margin-top:40px}.contact-direct p{color:var(--ink-2)}.nav-wa{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid currentColor;border-radius:50%}.nav-wa .ico{width:17px;height:17px}
.options{padding:120px var(--gut);max-width:1400px;margin:auto}.options h2{font:300 clamp(38px,5vw,72px)/1.05 'Cormorant Garamond',Georgia,serif;margin:22px 0 24px}.opt-intro{max-width:760px;font-size:18px;color:var(--ink-2)}.opt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:48px}.opt{border-top:1px solid var(--line);padding-top:22px}.opt h3{font:400 26px/1.15 'Cormorant Garamond',Georgia,serif;margin-bottom:14px}.opt p{color:var(--ink-2);font-size:15px;line-height:1.65}.opt a{display:inline-block;margin-top:16px;text-decoration:underline;text-underline-offset:5px;font-size:14px}.options.compact{padding:60px 0;border-top:1px solid var(--line)}.options.compact .opt-grid{margin-top:24px}.service-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.incl{max-width:1100px;margin:80px auto 0}.incl h2{font:400 clamp(30px,4vw,44px)/1.08 'Cormorant Garamond',Georgia,serif;margin-bottom:28px}.incl ul{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 32px}.incl li{border-top:1px solid var(--line);padding-top:16px}.incl b{display:block;font-weight:500;margin-bottom:8px}.incl span{color:var(--ink-2);font-size:15px;line-height:1.6}.service-copy p+p{margin-top:18px}.sec-fig{margin:32px 0 0}.sec-fig img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.service-main figcaption{font-size:12px;margin-top:10px;color:var(--ink-2)}.ph-box{aspect-ratio:16/9;border:1px dashed var(--line);display:flex;align-items:center;justify-content:center;background:var(--paper-2);color:var(--ink-2);font-size:13px;letter-spacing:.08em}.service-hero .ph-box{aspect-ratio:4/3}.gal-head{max-width:900px;margin:40px 0 56px}.gal-head h1{font:300 clamp(48px,6vw,96px)/1 'Cormorant Garamond',Georgia,serif;margin:18px 0 24px}.gal-head p{font-size:19px;color:var(--ink-2)}.gal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 28px}.g-item{margin:0}.g-item img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.g-item.tall img,.g-item.tall .ph-box{aspect-ratio:4/5}.gal-note{margin:40px 0;color:var(--ink-2);font-size:14px}.sourcing{padding:100px var(--gut);max-width:1400px;margin:auto;border-top:1px solid var(--line)}.sourcing h2{font:300 clamp(38px,5vw,72px)/1.05 'Cormorant Garamond',Georgia,serif;margin:22px 0 32px}.src-body{max-width:820px}.src-body p{font-size:18px;line-height:1.75;color:var(--ink-2)}.src-body p+p{margin-top:16px}.src-body ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px 32px;margin-top:28px}.src-body li{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}.nav-menu{display:none;background:none;border:1px solid currentColor;border-radius:999px;color:inherit;font:inherit;font-size:10px;letter-spacing:.2em;padding:9px 14px;cursor:pointer;pointer-events:auto}.nav-menu:focus-visible,.nav a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}@media(max-width:820px){.nav-menu{display:inline-flex}.nav.open ul{display:flex;position:fixed;inset:0;z-index:-1;flex-direction:column;justify-content:center;gap:26px;padding:0 max(var(--gut),env(safe-area-inset-left,0px));background:rgba(14,13,11,.97);font:300 38px/1.1 'Cormorant Garamond',Georgia,serif}.nav.open{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.nav.open .nav-right .cta{display:none}}.nav{padding-left:max(var(--gut),env(safe-area-inset-left,0px));padding-right:max(var(--gut),env(safe-area-inset-right,0px));padding-top:max(22px,env(safe-area-inset-top,0px))}section[id],[id=contact],[id=work],[id=approach],[id=services]{scroll-margin-top:96px}.film-kicker{grid-column:1/-1;margin:0 0 14px;color:var(--paper);opacity:.86;max-width:46ch}@media(max-height:520px) and (orientation:landscape){#approach{height:auto}#approach .stage{height:auto;position:static;padding:90px var(--gut) 50px}#approach .top{position:static;display:block}#approach .track{display:grid;margin:24px 0 0;transform:none!important;gap:28px;grid-template-columns:repeat(2,minmax(0,1fr))}}.service-card .card-img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;margin:0 0 20px;transition:opacity .4s}.service-card:hover .card-img{opacity:.88}@media(max-width:1000px){.opt-grid,.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.incl ul{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.opt-grid,.service-grid,.incl ul,.gal-grid{grid-template-columns:1fr}.options{padding:80px var(--gut)}}
