:root { --paper:#f6f1e9; --ink:#292621; --muted:#625b52; --line:#d6ccc0; --olive:#594934; --soft:#e9dfd3; --forest:#30271f; --chalk:#f6eee3; --white:#fff; }
html { scrollbar-color:#8b7966 var(--paper); }
::selection { background:#d9c6ae; color:#211d18; }
body { background:var(--paper); }
.header { color:var(--white); border-color:transparent; background:transparent; margin-bottom:-88px; transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease); }
.header.is-scrolled { background:var(--paper); color:var(--ink); border-color:var(--line); }
.header nav a:after { background:currentColor; }
#menu span { background:currentColor; }
.hero { min-height:760px; height:100svh; position:relative; isolation:isolate; overflow:hidden; color:var(--white); background:var(--forest); }
.hero-video, .hero-shade { position:absolute; inset:0; width:100%; height:100%; }
.hero-video { z-index:-2; object-fit:cover; object-position:center center; filter:sepia(.16) saturate(.83); }
.hero-shade { z-index:-1; background:linear-gradient(0deg,rgba(34,25,19,.91) 0%,rgba(34,25,19,.52) 39%,rgba(34,25,19,.13) 90%),linear-gradient(90deg,rgba(34,25,19,.24),transparent 70%); }
.hero-content { height:100%; display:flex; flex-direction:column; justify-content:flex-end; padding-top:128px; padding-bottom:24px; }
.hero-heading { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(290px,.65fr); gap:clamp(32px,5vw,90px); align-items:end; padding:0 0 70px; }
.hero h1 { max-width:930px; font-size:clamp(52px,6vw,92px); font-weight:500; letter-spacing:-.04em; line-height:1.04; }
.hero h1 em { font-family:Fraunces,Georgia,serif; font-weight:400; letter-spacing:-.035em; }
.hero-intro { border-top:1px solid rgba(255,255,255,.7); padding-top:20px; }
.hero-intro p { color:var(--white); font-size:clamp(15px,1.14vw,18px); line-height:1.68; max-width:41ch; margin-bottom:30px; text-wrap:pretty; }
.hero .action { background:var(--white); color:var(--forest); border-color:var(--white); padding:17px 21px; min-width:235px; }
.hero .action:hover { background:var(--chalk); }
.hero-utility { border-top:1px solid rgba(255,255,255,.50); display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:62px; font-size:12px; }
.hero-utility>div { display:flex; align-items:center; gap:34px; }
.hero-utility button,.hero-utility a { display:inline-flex; align-items:center; gap:11px; min-height:44px; color:var(--white); padding:0; font-size:12px; }
.hero-utility button svg,.hero-utility a svg { width:18px; height:18px; }
.hero-utility a svg { transform:rotate(90deg); transition:transform .3s var(--ease); }
.hero-utility a:hover svg { transform:translateY(4px) rotate(90deg); }
.hero-credit { opacity:.8; font-size:11px; line-height:1.5; }
.hero-foot { padding-block:24px; display:flex; align-items:center; gap:30px; font-size:12px; font-weight:600; letter-spacing:.005em; border-bottom:1px solid var(--line); color:var(--ink); }
.hero-foot-line { height:1px; flex:1; background:var(--line); }
.solutions { padding-top:clamp(96px,10vw,150px); }
.solutions .section-heading { margin-bottom:64px; }
.solutions .section-heading h2 { font-size:clamp(38px,4.15vw,62px); line-height:1.08; max-width:14ch; }
.solutions .section-heading p { border-top:1px solid var(--ink); padding-top:18px; color:var(--ink); font-size:15px; }
.solution-layout { grid-template-columns:minmax(270px,.8fr) minmax(0,1.65fr); gap:clamp(40px,7vw,110px); }
.solution-menu { padding:0; align-self:start; }
.solution-menu button { min-height:89px; font-size:clamp(20px,2vw,30px); font-weight:500; }
.solution-menu-note { margin-top:36px; max-width:33ch; }
.solution-image { aspect-ratio:1.48; }
.solution-image img { transition:filter .5s; }
.solution-spec { border-top:1px solid var(--line); margin-top:22px; padding-top:25px; }
.solution-spec h3 { font-size:clamp(25px,2.3vw,34px); }
.interior { margin-top:88px; padding-top:32px; }
.interior h3 { font-size:25px; }
.bespoke { background:var(--forest); color:var(--chalk); padding-block:clamp(96px,10vw,150px); overflow:hidden; }
.bespoke-grid { grid-template-columns:1.05fr 1fr; gap:clamp(70px,11vw,180px); }
.bespoke-heading h2 { font-size:clamp(48px,5vw,76px); line-height:1.05; max-width:11ch; margin-bottom:36px; }
.bespoke-heading p { font-size:16px; line-height:1.75; color:#e4d8ca; max-width:50ch; margin-bottom:26px; }
.bespoke .text-link { color:var(--chalk); font-size:14px; }
.bespoke-image { position:relative; width:100%; height:clamp(260px,28vw,480px); overflow:hidden; margin-top:64px; }
.bespoke-image img { object-position:center 51%; }
.bespoke-image figcaption { position:absolute; bottom:0; left:0; padding:9px 14px; background:rgba(17,35,27,.86); font-size:11px; }
.specification { padding-top:16px; }
.specification>div { padding:28px 0 38px; border-top:1px solid rgba(255,255,255,.35); }
.specification>div:first-child { border-top:1px solid rgba(255,255,255,.35); padding-top:28px; }
.specification dt { font-size:clamp(21px,2.1vw,31px); font-weight:500; margin-bottom:13px; letter-spacing:-.03em; }
.specification dd { color:#e4d8ca; font-size:14px; line-height:1.7; }
.film { height:clamp(500px,62vw,860px); background:#514030; }
.film:after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(0deg,rgba(19,23,18,.72),transparent 52%); }
.film figcaption { z-index:1; bottom:clamp(40px,5vw,80px); align-items:end; }
.film figcaption>span { font-size:clamp(29px,3.65vw,56px); letter-spacing:-.035em; line-height:1.13; font-weight:500; background:none; padding:0; max-width:17ch; }
.film small { margin-top:19px; font-size:12px; font-weight:400; letter-spacing:0; color:#fff; }
.film button { background:transparent; border:1px solid rgba(255,255,255,.75); min-height:52px; padding:10px 18px; }
.film button:hover { background:rgba(255,255,255,.12); }
.process { padding-block:clamp(96px,10vw,144px); }
.process .section-heading { margin-bottom:76px; }
.process h2 { font-size:clamp(42px,4.3vw,64px); }
.process .section-heading p { border-top:1px solid var(--ink); padding-top:18px; font-size:15px; color:var(--ink); }
.steps { gap:clamp(24px,3vw,48px); }
.steps li { padding-top:22px; }
.step-number { font-size:17px; font-weight:500; margin-bottom:56px; color:var(--ink); }
.steps h3 { font-size:24px; }
.steps p { min-height:100px; }
.step-output { border-top:1px solid var(--line); padding-top:17px; font-size:12px; }
.contact { background:#e9ded0; padding-block:clamp(96px,10vw,140px); }
.contact h2 { font-size:clamp(46px,5vw,74px); line-height:1.04; }
.contact-grid { gap:clamp(75px,11vw,170px); }
.contact-links a { font-size:19px; }
.form-grid label>span { font-size:13px; }
.form-bottom .action { min-width:200px; }
.footer { padding-top:48px; }
@media(max-width:1100px) {
  .hero-heading { grid-template-columns:1.35fr .72fr; gap:32px; }
  .hero h1 { font-size:clamp(50px,6.3vw,72px); }
  .solution-layout { gap:44px; }
}
@media(max-width:850px) {
  .header { margin-bottom:-72px; }
  .header nav { background:var(--forest); color:var(--white); }
  .header.is-scrolled nav { background:var(--paper); color:var(--ink); }
  .hero { min-height:750px; }
  .hero-heading { grid-template-columns:1fr; gap:26px; padding-bottom:56px; }
  .hero h1 { font-size:clamp(48px,7.1vw,68px); max-width:700px; }
  .hero-intro { max-width:550px; }
  .hero-intro p { margin-bottom:22px; }
  .solutions .section-heading h2 { font-size:clamp(37px,5vw,48px); }
  .solution-layout { grid-template-columns:1fr; gap:28px; }
  .solution-menu button { min-height:66px; font-size:18px; }
  .bespoke-grid { gap:52px; }
  .bespoke-image { margin-top:40px; }
  .specification { padding-top:0; }
}
@media(max-width:600px) {
  .hero { height:100svh; min-height:700px; }
  .hero-video { object-position:52% center; }
  .hero-shade { background:linear-gradient(180deg,rgba(25,19,15,.76),rgba(25,19,15,.08) 22%,transparent 36%),linear-gradient(0deg,rgba(34,25,19,.93),rgba(34,25,19,.46) 58%,rgba(34,25,19,.2)); }
  .hero-content { padding-top:105px; padding-bottom:18px; }
  .hero-heading { gap:28px; padding-bottom:33px; }
  .hero h1 { font-size:clamp(41px,10.2vw,54px); line-height:1.08; letter-spacing:-.045em; }
  .hero-intro { padding-top:14px; }
  .hero-intro p { font-size:14px; line-height:1.58; margin-bottom:18px; }
  .hero .action { min-height:48px; padding:10px 15px; }
  .hero-utility { min-height:64px; align-items:center; font-size:12px; }
  .hero-utility>span { max-width:160px; line-height:1.45; }
  .hero-utility>div { gap:15px; }
  .hero-utility button svg { width:21px; height:21px; }
  .hero-control-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .hero-utility a { font-size:12px; max-width:100px; line-height:1.3; gap:6px; }
  .hero-credit { font-size:12px; }
  .hero-foot { padding-block:18px; gap:10px; font-size:12px; align-items:start; }
  .hero-foot-line { display:none; }
  .hero-foot>span { flex:1; }
  .solutions { padding-top:86px; }
  .solutions .section-heading h2 { font-size:37px; }
  .solutions .section-heading p { font-size:14px; }
  .solution-layout { gap:20px; }
  .solution-menu button { min-height:59px; font-size:14px; }
  .solution-menu-note { font-size:13px; }
  .image-label { font-size:12px; }
  .interior { margin-top:54px; }
  .bespoke { padding-block:86px; }
  .bespoke-grid { grid-template-columns:1fr; gap:42px; }
  .bespoke-heading h2 { font-size:48px; max-width:11ch; }
  .bespoke-heading p { font-size:14px; }
  .bespoke-image { margin-top:40px; height:310px; }
  .specification>div { padding:23px 0 28px; }
  .specification dt { font-size:23px; }
  .film { height:600px; }
  .film figcaption { bottom:30px; }
  .film figcaption>span { font-size:37px; }
  .film button { margin-top:23px; }
  .film small { font-size:12px; }
  .process { padding-block:84px; }
  .process h2 { font-size:45px; }
  .process .section-heading { margin-bottom:42px; }
  .steps h3 { font-size:18px; }
  .steps p { font-size:14px; }
  .step-output { font-size:12px; }
  .step-number { margin-bottom:34px; }
  .contact { padding-block:80px; }
  .contact h2 { font-size:48px; }
  .form-bottom p { font-size:12px; }
  .footer-bottom,.footer-top>span { font-size:12px; }
}
@media(max-width:360px) {
  .hero { min-height:680px; }
  .hero h1 { font-size:38px; }
  .hero-credit { max-width:210px; }
  .hero-foot { display:block; }
  .hero-foot>span { display:block; }
  .hero-foot>span+span { margin-top:5px; }
}
@media(prefers-reduced-motion:reduce) {
  .header { transition:none; }
}
