
:root{
  --logo:url("logo-header.png");
  --ink:#050505;
  --ink2:#0c0b0a;
  --paper:#f3efe8;
  --paper2:#e8e0d6;
  --rust:#9e4322;
  --rust-deep:#5b2b20;
  --sage:#99b2ac;
  --sage-deep:#607d77;
  --brown:#381c15;
  --sage-ink:#708c84;
  --line:rgba(243,239,232,.18);
  --muted:rgba(243,239,232,.68);
  --max:1480px;
}
*{box-sizing:border-box}
html{background:var(--ink)}
body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;overflow-x:clip}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
::selection{background:var(--sage);color:var(--ink)}
:focus-visible{outline:2px solid var(--sage);outline-offset:3px}

.scroll-progress{position:fixed;z-index:1000;left:0;top:0;height:3px;width:0;background:linear-gradient(90deg,var(--rust),var(--sage));transform-origin:left}

.nav{position:fixed;z-index:900;left:0;right:0;top:0;padding:18px 28px;display:flex;align-items:center;justify-content:space-between;mix-blend-mode:normal;transition:.35s ease}
.nav.scrolled{background:rgba(5,5,5,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px}
.logo-mark{display:block;background:var(--logo) center/contain no-repeat;aspect-ratio:830/167}
.brand .logo-mark{width:168px}
.navlinks{display:flex;align-items:center;gap:20px;font-size:11px;white-space:nowrap;letter-spacing:.09em;text-transform:uppercase}
.navlinks a{opacity:.74;transition:.2s}.navlinks a:hover{opacity:1;color:var(--sage)}
.nav-item{position:relative;display:flex;align-items:center}
.nav-drop{background:none;border:0;padding:0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;opacity:.74;transition:.2s;display:inline-flex;align-items:center;gap:7px}
.nav-drop:hover,.nav-item.open .nav-drop,.nav-item.current .nav-drop{opacity:1;color:var(--sage)}
.nav-drop:after{content:"";width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.nav-sub{position:absolute;top:calc(100% + 16px);left:-18px;min-width:200px;padding:8px 0;background:rgba(5,5,5,.97);border:1px solid var(--line);display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .2s,transform .2s,visibility 0s linear .2s}
.nav-sub:before{content:"";position:absolute;left:0;right:0;top:-17px;height:17px}
.nav-item:hover .nav-sub,.nav-item:focus-within .nav-sub,.nav-item.open .nav-sub{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .2s}
.nav-sub a{padding:11px 18px}.nav-sub a[aria-current="page"]{opacity:1;color:var(--sage)}
.nav-cta{border:1px solid rgba(153,178,172,.7);padding:12px 16px!important;opacity:1!important}
.menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--paper);padding:10px 12px}

.hero{min-height:100svh;position:relative;display:grid;align-items:end;padding:150px 28px 54px;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(8,1fr);opacity:.95;pointer-events:none}
.hero-grid span{border-right:1px solid rgba(255,255,255,.045);border-bottom:1px solid rgba(255,255,255,.045)}
.hero-ambient{position:absolute;inset:0;background:radial-gradient(circle at 78% 25%,rgba(153,178,172,.17),transparent 30%),radial-gradient(circle at 20% 72%,rgba(158,67,34,.20),transparent 34%)}
.module{position:absolute;border:1px solid rgba(243,239,232,.16);background:rgba(255,255,255,.02);backdrop-filter:blur(3px);will-change:transform;overflow:hidden;z-index:1}
.module img{width:100%;height:100%;object-fit:cover;display:block;opacity:.82;filter:saturate(.92) contrast(1.03)}
.module:after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(190deg,rgba(5,5,5,.06),rgba(5,5,5,.34))}
.m1{width:21vw;height:16vw;min-width:230px;min-height:176px;right:4vw;top:13vh;border-color:rgba(153,178,172,.55)}
.m2{width:12vw;height:24vh;min-width:140px;right:24vw;top:12vh;border-color:rgba(158,67,34,.55)}
.m3{width:25vw;height:17vh;min-width:250px;left:7vw;top:16vh;border-color:rgba(158,67,34,.35)}
.m4{width:11vw;height:14vw;min-width:120px;right:38vw;top:9vh;border-color:rgba(243,239,232,.22)}
.hero-inner{position:relative;z-index:3;width:min(var(--max),100%);margin:auto;display:grid;grid-template-columns:1.4fr .6fr;gap:40px;align-items:end}
.eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-bottom:26px;display:flex;align-items:center;gap:12px}.eyebrow:before{content:"";width:46px;height:1px;background:var(--sage)}
.hero h1{font-size:clamp(56px,7.8vw,142px);line-height:.84;letter-spacing:-.065em;margin:0;max-width:1150px;font-weight:600}
.hero h1 .outline{-webkit-text-stroke:1px var(--paper);color:transparent}
.hero h1 .rust{color:var(--rust)}
.hero-side{padding-bottom:10px;border-left:1px solid var(--line);padding-left:28px;max-width:420px}
.hero-side p{color:var(--muted);font-size:16px;line-height:1.65;margin:0 0 28px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:15px 18px;border:1px solid var(--line);font-size:12px;text-transform:uppercase;letter-spacing:.12em;transition:.25s;background:transparent;color:var(--paper)}
.btn:hover{background:var(--paper);color:var(--ink)}
.btn.primary{background:var(--rust);border-color:var(--rust);color:#fff}.btn.primary:hover{background:var(--sage);border-color:var(--sage);color:var(--ink)}
.scroll-cue{position:absolute;z-index:4;right:28px;bottom:28px;display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);writing-mode:vertical-rl}.scroll-cue:after{content:"";height:74px;width:1px;background:linear-gradient(var(--sage),transparent)}

.section{position:relative;padding:130px 28px;border-bottom:1px solid var(--line)}
.wrap{width:min(var(--max),100%);margin:0 auto;padding-inline:clamp(16px,4vw,28px);box-sizing:border-box}
.section-head{display:grid;grid-template-columns:.42fr 1.58fr;gap:34px;margin-bottom:70px;align-items:start}
.index{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--sage);letter-spacing:.12em}
.kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-bottom:16px}
.section h2{font-size:clamp(42px,6vw,96px);line-height:.93;letter-spacing:-.045em;font-weight:520;margin:0;max-width:1050px}
.section h3{font-weight:520}
.lead{font-size:clamp(18px,2vw,28px);line-height:1.45;color:rgba(243,239,232,.86);max-width:900px}
.muted{color:var(--muted);line-height:1.75}

/* Philosophy / build form curate */
.philosophy{background:var(--paper);color:var(--ink);overflow:hidden}
.philosophy .kicker,.philosophy .index{color:var(--rust)}
.philosophy .muted{color:rgba(5,5,5,.64)}
.bfc{display:grid;grid-template-columns:repeat(3,1fr);margin-top:44px;border:1px solid rgba(5,5,5,.14)}
.bfc-card{min-height:390px;padding:36px;position:relative;border-right:1px solid rgba(5,5,5,.14);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}
.bfc-card:last-child{border-right:none}
.bfc-card .big{font-size:clamp(64px,7vw,132px);letter-spacing:-.07em;line-height:.8;font-weight:600;
  color:var(--bfc,var(--rust));-webkit-text-stroke:0;transition:transform .35s ease,opacity .35s ease}
.bfc-card{--bfc:var(--rust)}
.bfc-card:nth-child(2){--bfc:var(--sage-ink)}
.bfc-card:nth-child(3){--bfc:var(--brown)}
.bfc-card:before{content:"";position:absolute;inset:0;background:var(--bfc);opacity:0;transition:opacity .35s ease;pointer-events:none}
.bfc-card:hover:before{opacity:.055}
.bfc-card:hover .big{transform:translateX(5px)}
.bfc-card:hover .bfc-chip{border-color:var(--bfc);color:var(--bfc)}
.bfc-card>*{position:relative;z-index:1}
.bfc-card p{max-width:340px;color:rgba(5,5,5,.68);line-height:1.65}
.bfc-chip{width:72px;height:72px;border:1px solid rgba(5,5,5,.2);display:grid;place-items:center;font-family:ui-monospace,monospace;transition:border-color .35s ease,color .35s ease}

/* about sticky */
.about{min-height:160vh;padding-top:0}
.about-sticky{position:sticky;top:0;min-height:100vh;display:grid;align-items:center;padding:110px 28px}
.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;width:min(var(--max),100%);margin:auto}
.about-copy h2{font-size:clamp(50px,6.2vw,104px);line-height:.9;margin:0 0 34px;letter-spacing:-.055em;font-weight:520}
.about-copy p{max-width:700px}
.lab-canvas{height:68vh;min-height:520px;position:relative;border:1px solid var(--line);overflow:hidden;background:linear-gradient(135deg,rgba(153,178,172,.04),rgba(158,67,34,.04))}
.lab-canvas:before,.lab-canvas:after{content:"";position:absolute;background:var(--line)}
.lab-canvas:before{left:50%;top:0;bottom:0;width:1px}.lab-canvas:after{top:50%;left:0;right:0;height:1px}
.lab-piece{position:absolute;transition:.1s linear;border:1px solid rgba(243,239,232,.22);display:flex;align-items:flex-end;padding:15px;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.lp1{width:39%;height:42%;left:8%;top:8%;background:var(--rust)}
.lp2{width:35%;height:20%;right:8%;top:18%;background:var(--sage);color:var(--ink)}
.lp3{width:22%;height:38%;left:27%;bottom:7%;background:rgba(255,255,255,.05)}
.lp4{width:31%;height:31%;right:8%;bottom:8%;background:var(--rust-deep)}

/* promise */
.promise{padding:0;background:var(--ink);position:relative}
.promise-doodles{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.promise-doodles.dd-narrow{display:none}
@media(max-width:1023px){.promise-doodles.dd-wide{display:none}.promise-doodles.dd-narrow{display:block}}
.promise-doodles .dd{fill:none;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;
  vector-effect:non-scaling-stroke}
.promise-doodles .dd-sage{stroke:var(--sage);opacity:.42}
.promise-doodles .dd-rust{stroke:var(--rust);opacity:.52}
.promise-track{position:relative}
.promise-word{position:relative;z-index:1}
.promise-track{display:flex;align-items:center;overflow:hidden}
.promise-word{font-size:clamp(56px,11vw,190px);letter-spacing:-.06em;line-height:.95;font-weight:600;display:flex;flex-wrap:wrap;gap:0 .25em;padding:90px 28px}
.promise.is-animated .promise-track{position:sticky;top:0;height:100vh;height:100svh}
.promise.is-animated .promise-word{font-size:clamp(44px,12vw,250px);letter-spacing:-.08em;flex-wrap:nowrap;white-space:nowrap;flex:none;padding:0 .35em 0 28px;will-change:transform}
.promise-word span:nth-child(1){color:var(--paper)}.promise-word span:nth-child(2){color:var(--rust)}.promise-word span:nth-child(3){color:var(--sage)}

/* services */
.services{background:#0a0908}
.service-stack{display:grid;gap:18px;max-width:1100px;margin-left:auto}
.service-card{display:grid;color:inherit;transition:border-color .25s;position:sticky;top:110px;min-height:260px;border:1px solid var(--line);background:#0c0b0a;padding:30px 34px;display:grid;grid-template-columns:110px 1fr 40px;gap:26px;align-items:start;box-shadow:0 -12px 40px rgba(0,0,0,.36)}
.service-card:nth-child(2){top:126px}.service-card:nth-child(3){top:142px}.service-card:nth-child(4){top:158px}.service-card:nth-child(5){top:174px}.service-card:nth-child(6){top:190px}
.service-no{font-family:ui-monospace,monospace;color:var(--sage);font-size:12px}
.service-card h3{font-size:clamp(27px,3vw,48px);margin:0 0 18px;letter-spacing:-.035em}
.service-card p{margin:0;color:var(--muted);line-height:1.7;max-width:720px}
.service-arrow{font-size:28px;color:var(--rust);transition:transform .25s}
.service-card:hover{border-color:rgba(153,178,172,.55)}.service-card:hover .service-arrow{transform:translate(4px,-4px)}

/* projects */
.projects{background:var(--paper);color:var(--ink)}
.projects .kicker,.projects .index{color:var(--rust)}
.projects .lead{color:rgba(5,5,5,.72)}
.project-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 34px}
.project-filters button{border:1px solid rgba(5,5,5,.2);background:transparent;color:var(--ink);padding:11px 16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.project-filters button:hover{border-color:var(--ink)}
.project-filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.project-card{display:flex;flex-direction:column;border:1px solid rgba(5,5,5,.14);background:rgba(255,255,255,.45)}
.project-card[hidden]{display:none}
.project-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(135deg,var(--paper2),#d6cabb)}
.project-card:nth-child(6n+2) .project-media{background:linear-gradient(135deg,#b9c9c4,var(--sage-deep))}
.project-card:nth-child(6n+3) .project-media{background:linear-gradient(135deg,#a6502a,var(--rust-deep))}
.project-card:nth-child(6n+4) .project-media{background:linear-gradient(135deg,#8d7969,#4a3f38)}
.project-card:nth-child(6n+5) .project-media{background:linear-gradient(135deg,#e8e0d6,#b9ab98)}
.project-card:nth-child(6n) .project-media{background:linear-gradient(135deg,#607d77,#2f3d3a)}
.project-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.65,.2,1)}
.project-card:hover .project-media img{transform:scale(1.04)}
.project-media .ph{position:absolute;left:20px;bottom:10px;font-size:clamp(80px,8vw,130px);line-height:.8;font-weight:600;letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.55)}
.project-body{padding:22px 22px 26px;display:grid;gap:10px}
.project-meta{display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(5,5,5,.55)}
.project-body h3{font-size:clamp(22px,2vw,30px);line-height:1.1;margin:0;letter-spacing:-.03em}
.project-body p{margin:0;color:rgba(5,5,5,.64);line-height:1.6;font-size:14px}
.projects-cta{margin-top:34px;display:flex;justify-content:flex-end}
.projects .btn{border-color:rgba(5,5,5,.25);color:var(--ink)}.projects .btn:hover{background:var(--ink);color:var(--paper)}

/* expertise */
.expertise-grid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}
.expertise-item{min-height:210px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px;display:flex;flex-direction:column;justify-content:space-between;transition:.3s}
.expertise-item:hover{background:var(--sage);color:var(--ink)}
.expertise-item .num{font-size:11px;font-family:ui-monospace,monospace;opacity:.7}.expertise-item strong{font-size:22px;font-weight:500;max-width:220px}

/* GSAP PROCESS — 9-step scroll-built execution system */
.process-gsap{position:relative;background:var(--paper);color:var(--ink);border-top:1px solid rgba(5,5,5,.12);border-bottom:1px solid rgba(5,5,5,.12)}
.process-gsap.process-static{overflow:hidden}
.process-shell{min-height:100svh;position:relative;padding:78px 28px 30px;display:flex;flex-direction:column;background:
 radial-gradient(circle at 86% 10%,rgba(153,178,172,.23),transparent 25%),
 radial-gradient(circle at 10% 90%,rgba(158,67,34,.13),transparent 28%),var(--paper)}
.process-topbar{max-width:var(--max);width:100%;margin:0 auto 22px;display:grid;grid-template-columns:1fr auto;align-items:end;gap:24px;position:relative;z-index:10}
.process-topbar .index{color:var(--rust)}
.process-topbar-copy{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(5,5,5,.52);text-align:right;line-height:1.55}
.process-stage{max-width:var(--max);width:100%;margin:auto;display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.42fr) minmax(0,.44fr);align-items:stretch;gap:20px;min-height:66vh;position:relative;z-index:3}
.process-story{position:relative;border:1px solid rgba(5,5,5,.16);background:rgba(255,255,255,.42);overflow:hidden;min-height:560px}
.process-scene{position:absolute;inset:0;padding:34px 32px;display:flex;flex-direction:column;justify-content:space-between;opacity:0;pointer-events:none;transform:translateY(28px)}
.process-scene.is-active{opacity:1;pointer-events:auto;transform:none}
.process-scene .eyebrow{font:600 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:var(--rust);text-transform:uppercase}
.process-scene .big-num{font-size:clamp(88px,10vw,170px);line-height:.72;letter-spacing:-.08em;font-weight:600;color:rgba(5,5,5,.06);position:absolute;right:14px;top:24px}
.process-scene h3{font-size:clamp(34px,3.3vw,62px);overflow-wrap:break-word;hyphens:auto;line-height:.93;letter-spacing:-.055em;margin:68px 0 20px;font-weight:560;max-width:730px}
.process-scene .leadline{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(19px,1.65vw,28px);line-height:1.25;color:var(--rust-deep);margin:0 0 18px;max-width:660px}
.process-scene p{font-size:15px;line-height:1.75;color:rgba(5,5,5,.68);max-width:650px;margin:0}
.process-tags{display:flex;flex-wrap:wrap;gap:8px;padding-top:24px}
.process-tag{border:1px solid rgba(5,5,5,.18);padding:9px 11px;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.11em;text-transform:uppercase;background:rgba(255,255,255,.35)}

.process-visual{position:relative;min-height:0;align-self:center;aspect-ratio:16/9;border:1px solid rgba(5,5,5,.16);background:#e9e1d7;overflow:hidden;isolation:isolate}
.process-visual:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(5,5,5,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(5,5,5,.055) 1px,transparent 1px);background-size:44px 44px;z-index:-2}
.process-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,transparent 50%,rgba(153,178,172,.20));z-index:-1}
.visual-state{position:absolute;inset:0;opacity:0;visibility:hidden;display:grid;place-items:center;padding:46px;overflow:hidden}
.visual-state.is-active{opacity:1;visibility:visible}
.visual-caption{position:absolute;left:20px;bottom:18px;font:600 10px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(5,5,5,.56)}
.visual-code{position:absolute;right:20px;top:18px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--rust);letter-spacing:.12em}

/* 01 consultation */
.consult-orbit{width:min(380px,70%);aspect-ratio:1;position:relative;border:1px solid rgba(5,5,5,.15);border-radius:50%}
.consult-core{position:absolute;inset:29%;background:var(--rust);display:grid;place-items:center;color:#fff;font:600 11px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}
.consult-node{position:absolute;width:98px;height:74px;border:1px solid rgba(5,5,5,.22);background:rgba(255,255,255,.62);display:grid;place-items:center;text-align:center;font:600 9px/1.35 ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase}
.cn1{left:-18px;top:42%}.cn2{right:-18px;top:42%}.cn3{top:-17px;left:calc(50% - 49px)}.cn4{bottom:-17px;left:calc(50% - 49px)}

/* 02 measurements */
.measure-room{width:min(420px,78%);height:330px;border:2px solid var(--ink);position:relative;background:rgba(255,255,255,.24)}
.measure-room:before,.measure-room:after{content:"";position:absolute;background:var(--rust)}
.measure-room:before{height:1px;left:-45px;right:-45px;top:-28px}.measure-room:after{width:1px;top:-45px;bottom:-45px;right:-28px}
.dim-label{position:absolute;background:var(--paper);padding:5px 8px;font:600 10px ui-monospace,monospace;letter-spacing:.08em}.dim-x{top:-39px;left:42%}.dim-y{right:-52px;top:45%;transform:rotate(90deg)}
.scan-line{position:absolute;left:0;right:0;height:2px;background:var(--sage-deep);box-shadow:0 0 20px rgba(96,125,119,.4);top:10%}
.corner-mark{position:absolute;width:24px;height:24px;border-color:var(--rust);border-style:solid}.cm1{left:-8px;top:-8px;border-width:2px 0 0 2px}.cm2{right:-8px;top:-8px;border-width:2px 2px 0 0}.cm3{left:-8px;bottom:-8px;border-width:0 0 2px 2px}.cm4{right:-8px;bottom:-8px;border-width:0 2px 2px 0}

/* 03 drawing */
.wire-cab{width:min(390px,74%);height:390px;position:relative;border:2px solid var(--ink);background:rgba(255,255,255,.18)}
.wire-cab i{position:absolute;background:rgba(5,5,5,.7);display:block}.wire-cab .v1{width:1px;top:0;bottom:0;left:34%}.wire-cab .v2{width:1px;top:0;bottom:0;left:67%}.wire-cab .h1{height:1px;left:0;right:0;top:31%}.wire-cab .h2{height:1px;left:0;right:0;top:65%}.wire-cab .drawer{position:absolute;border:1px solid rgba(5,5,5,.55);right:7%;left:70%;height:42px}.wire-cab .d1{top:68%}.wire-cab .d2{top:80%}
.wire-overlay{position:absolute;inset:8% 11%;border:1px dashed var(--rust);transform:translate(14px,-12px)}

/* 04 engineering */
.explode{width:min(430px,82%);height:390px;position:relative;perspective:900px}.panel-piece{position:absolute;border:1px solid rgba(5,5,5,.45);background:rgba(153,178,172,.44);box-shadow:0 14px 26px rgba(0,0,0,.07)}
.pp1{width:70%;height:72%;left:15%;top:14%;background:rgba(255,255,255,.4)}.pp2{width:22%;height:66%;left:-2%;top:17%;background:rgba(158,67,34,.78)}.pp3{width:22%;height:66%;right:-2%;top:17%;background:rgba(153,178,172,.88)}.pp4{height:18%;width:65%;left:18%;top:-3%}.pp5{height:18%;width:65%;left:18%;bottom:-3%}
.explode-line{position:absolute;height:1px;background:var(--rust);transform-origin:left center}.el1{width:90px;left:9%;top:40%;transform:rotate(18deg)}.el2{width:90px;right:7%;top:55%;transform:rotate(-18deg)}

/* 05 materials */
.swatch-stack{width:min(430px,85%);height:390px;position:relative}.swatch{position:absolute;width:42%;height:64%;border:1px solid rgba(5,5,5,.16);box-shadow:0 20px 34px rgba(0,0,0,.10);display:flex;align-items:flex-end;padding:16px;font:600 9px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}.sw1{left:2%;top:12%;background:#4e3528;color:#fff;transform:rotate(-7deg)}.sw2{left:28%;top:5%;background:#b9ab98;transform:rotate(3deg)}.sw3{right:2%;top:17%;background:var(--sage);transform:rotate(8deg)}.sw4{left:19%;bottom:-3%;background:linear-gradient(180deg,#a6502a,#4b211b);color:#fff;transform:rotate(-2deg)}

/* 06 proposal */
.proposal-doc{width:min(390px,76%);height:420px;background:#f8f5ef;border:1px solid rgba(5,5,5,.2);box-shadow:0 30px 70px rgba(0,0,0,.11);padding:26px;position:relative}.doc-head{height:22px;width:52%;background:var(--rust);margin-bottom:28px}.doc-line{height:8px;background:rgba(5,5,5,.13);margin:11px 0}.doc-line.w80{width:80%}.doc-line.w55{width:55%}.doc-line.w92{width:92%}.doc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:28px}.doc-box{height:74px;border:1px solid rgba(5,5,5,.15);background:rgba(153,178,172,.16)}.doc-approve{position:absolute;right:22px;bottom:22px;border:2px solid var(--rust);color:var(--rust);padding:12px 16px;font:700 12px ui-monospace,monospace;letter-spacing:.12em;transform:rotate(-5deg)}

/* 07 manufacture */
.build-cab{width:min(430px,80%);height:430px;position:relative;border:1px solid rgba(5,5,5,.16);background:rgba(255,255,255,.16)}.build-panel{position:absolute;background:#705748;border:1px solid rgba(255,255,255,.12)}.bp1{left:0;top:0;width:24%;height:100%}.bp2{left:25%;top:0;width:24%;height:100%;background:#8a7667}.bp3{left:50%;top:0;width:24%;height:100%;background:#6d5c52}.bp4{left:75%;top:0;width:25%;height:100%;background:#4a3f38}.build-shelf{position:absolute;right:4%;width:20%;height:4px;background:var(--sage);box-shadow:0 0 13px rgba(153,178,172,.7)}.bs1{top:26%}.bs2{top:48%}.bs3{top:70%}.factory-mark{position:absolute;left:18px;top:18px;border:1px solid rgba(255,255,255,.45);color:#fff;padding:8px 10px;font:600 9px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}

/* 08 inspection */
.inspect-cab{width:min(430px,80%);height:430px;position:relative;border:2px solid var(--ink);background:rgba(255,255,255,.2)}.inspect-cab:before,.inspect-cab:after{content:"";position:absolute;background:rgba(5,5,5,.55)}.inspect-cab:before{left:50%;top:0;bottom:0;width:1px}.inspect-cab:after{top:50%;left:0;right:0;height:1px}.check{position:absolute;width:108px;padding:10px 12px;background:var(--paper);border:1px solid rgba(5,5,5,.2);font:700 9px ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}.check:before{content:'✓';color:var(--rust);margin-right:7px}.ch1{left:-28px;top:12%}.ch2{right:-28px;top:35%}.ch3{left:-28px;bottom:28%}.ch4{right:-28px;bottom:8%}.target{position:absolute;left:50%;top:50%;width:110px;height:110px;border:1px solid var(--rust);border-radius:50%;transform:translate(-50%,-50%)}.target:before,.target:after{content:"";position:absolute;background:var(--rust)}.target:before{width:140px;height:1px;left:-15px;top:54px}.target:after{height:140px;width:1px;left:54px;top:-15px}

/* 09 delivery */
.delivery-space{width:min(460px,84%);height:430px;position:relative;background:linear-gradient(135deg,#c8b7a2,#8d7969);overflow:hidden;box-shadow:0 28px 60px rgba(0,0,0,.13)}.delivery-space .wardrobe{position:absolute;left:8%;right:8%;top:8%;bottom:10%;display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.delivery-space .wardrobe span{background:linear-gradient(180deg,#756052,#5b4b42);border:1px solid rgba(255,255,255,.08)}.delivery-space .floor{position:absolute;left:0;right:0;bottom:0;height:18%;background:linear-gradient(15deg,#b6aa9a,#d0c4b4)}.delivery-space .glow{position:absolute;width:55%;height:100%;right:-18%;top:-18%;background:radial-gradient(circle,rgba(255,255,255,.48),transparent 62%)}.complete-badge{position:absolute;right:22px;bottom:22px;width:112px;height:112px;border-radius:50%;background:var(--sage);display:grid;place-items:center;text-align:center;font:700 10px/1.4 ui-monospace,monospace;letter-spacing:.10em;text-transform:uppercase}

.process-bottom{max-width:var(--max);width:100%;margin:22px auto 0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px}.process-bottom .promise-line{font-size:12px;letter-spacing:.11em;text-transform:uppercase;color:rgba(5,5,5,.58)}.process-bottom .scroll-hint{font:600 10px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--rust)}

/* static fallback — vertical process for tablets/phones, reduced motion, or if GSAP fails to load */
.process-static .process-shell{padding:110px 28px 70px;min-height:auto}
.process-static .process-topbar{grid-template-columns:1fr}.process-static .process-topbar-copy{text-align:left}
.process-static .process-stage{grid-template-columns:1fr;min-height:auto;max-width:960px}
.process-static .process-story{min-height:auto;border:0;background:transparent;overflow:visible}
.process-static .process-scene{position:relative;opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto;padding:38px 0;border-top:1px solid rgba(5,5,5,.16)}
.process-static .process-scene:first-child{border-top:0}.process-static .process-scene .big-num{top:30px;right:0;font-size:92px}.process-static .process-scene h3{margin-top:46px;font-size:clamp(32px,5vw,56px)}
.process-static .process-bottom{grid-template-columns:1fr}
@media(max-width:620px){.process-static .process-shell{padding:94px 18px 54px}}

/* sustainability */
.sustain{overflow:hidden}
.sustain-layout{display:grid;grid-template-columns:1fr .9fr;gap:70px;align-items:start}
.sustain h2{max-width:900px}
.sustain-copy{font-size:17px;line-height:1.8;color:var(--muted);max-width:780px}
.sustain-modules{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:sticky;top:120px}
.s-box{min-height:190px;border:1px solid var(--line);padding:22px;display:flex;flex-direction:column;justify-content:space-between}
.s-box:nth-child(1){background:var(--sage);color:var(--ink)}.s-box:nth-child(4){background:var(--rust)}
.s-box small{font-family:ui-monospace,monospace;opacity:.7}.s-box strong{font-size:22px;font-weight:500}
.tree{grid-column:1/3;min-height:220px;background:linear-gradient(120deg,var(--rust-deep),#17110e);border:1px solid rgba(158,67,34,.55);padding:28px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.tree strong{font-size:clamp(28px,3vw,48px);max-width:580px;line-height:1.05}.tree .circle{width:82px;height:82px;border-radius:50%;border:1px solid var(--sage);display:grid;place-items:center;color:var(--sage)}

/* design gallery */
.gallery{background:#0a0908}
.subnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.subnav a{border:1px solid var(--line);padding:11px 16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s}
.subnav a:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.gallery-group,.material-row{scroll-margin-top:96px}
.gallery-group{padding-top:56px}
.group-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:22px;border-bottom:1px solid var(--line);padding-bottom:18px}
.group-head h3{font-size:clamp(34px,4vw,64px);letter-spacing:-.045em;line-height:.95;margin:0}
.group-head p{margin:0;max-width:420px;color:var(--muted);line-height:1.6;font-size:15px}
.gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(170px,17vw,260px);gap:12px}
.gallery-tile{position:relative;margin:0;overflow:hidden;border:1px solid var(--line);background:linear-gradient(145deg,#2a211c,#12100e)}
.gallery-tile:nth-child(1){grid-column:span 2;grid-row:span 2}
.gallery-tile:nth-child(5n+2){background:linear-gradient(145deg,#33403d,#141816)}
.gallery-tile:nth-child(5n+3){background:linear-gradient(145deg,#5b2b20,#1a110d)}
.gallery-tile:nth-child(5n+4){background:linear-gradient(145deg,#4a3f38,#171310)}
.gallery-tile:nth-child(5n){background:linear-gradient(145deg,#3d4a47,#101312)}
.gallery-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.65,.2,1)}
.gallery-tile.has-photo{cursor:zoom-in}.gallery-tile.has-photo:hover img{transform:scale(1.04)}
.gallery-tile figcaption{position:absolute;left:0;right:0;bottom:0;padding:34px 16px 14px;font:600 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(243,239,232,.8);background:linear-gradient(transparent,rgba(5,5,5,.7))}
.lightbox{border:0;padding:0;background:transparent;max-width:min(1200px,92vw);max-height:92vh;color:var(--paper)}
.lightbox::backdrop{background:rgba(5,5,5,.9)}
.lightbox img{display:block;max-width:100%;max-height:84vh;object-fit:contain}
.lightbox p{margin:12px 0 0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.lb-close{position:fixed;top:18px;right:22px;background:none;border:1px solid var(--line);color:var(--paper);width:44px;height:44px;font-size:22px;cursor:pointer}

/* material library */
.materials{background:var(--paper);color:var(--ink)}
.materials .kicker,.materials .index{color:var(--rust)}
.materials .lead{color:rgba(5,5,5,.72)}
.materials .subnav a{border-color:rgba(5,5,5,.2)}.materials .subnav a:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.material-list{margin-top:36px;border-bottom:1px solid rgba(5,5,5,.14)}
.material-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;padding:48px 0;border-top:1px solid rgba(5,5,5,.14);align-items:center}
.material-info .n{font-family:ui-monospace,monospace;font-size:12px;color:var(--rust)}
.material-info h3{font-size:clamp(34px,4vw,62px);letter-spacing:-.045em;line-height:.95;margin:14px 0 16px}
.material-info p{margin:0;color:rgba(5,5,5,.66);line-height:1.7;max-width:520px}
.material-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.material-tags span{border:1px solid rgba(5,5,5,.18);padding:8px 10px;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase}
.mat-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.mat-chip{margin:0}
.mat-chip .chip{display:block;aspect-ratio:1;border:1px solid rgba(5,5,5,.12);background:var(--c)}
.mat-chip figcaption{margin-top:10px;font-size:12px;color:rgba(5,5,5,.7)}
.fam-gloss .chip{background:linear-gradient(135deg,rgba(255,255,255,.75),rgba(255,255,255,0) 34%,rgba(255,255,255,0) 64%,rgba(255,255,255,.3)),var(--c);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 14px 26px rgba(0,0,0,.14)}
.fam-matte .chip{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E"),var(--c)}
.fam-af .chip{background:radial-gradient(120% 90% at 25% 15%,rgba(255,255,255,.1),transparent 60%),var(--c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.tx-oak{background:repeating-linear-gradient(91deg,rgba(90,58,28,.2) 0 2px,transparent 2px 9px),repeating-linear-gradient(88deg,rgba(255,255,255,.1) 0 1px,transparent 1px 6px),#c49a6c!important}
.tx-walnut{background:repeating-linear-gradient(92deg,rgba(0,0,0,.22) 0 2px,transparent 2px 8px),repeating-linear-gradient(87deg,rgba(255,255,255,.06) 0 1px,transparent 1px 5px),#5b3d2a!important}
.tx-linen{background:repeating-linear-gradient(0deg,rgba(0,0,0,.07) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 1px,transparent 1px 4px),#d9d0c3!important}
.tx-fluted{background:repeating-linear-gradient(90deg,#76837f 0 3px,#a9b7b2 3px 9px,#8d9a96 9px 14px)!important}
.material-note{margin:20px 0 0;font-size:12px;color:rgba(5,5,5,.55)}

/* categories */
.categories{padding-left:0;padding-right:0}
.categories .section-head{padding:0 28px;max-width:calc(var(--max) + 56px);margin-left:auto;margin-right:auto}
.cat-row{display:grid;grid-template-columns:130px 1fr 90px;align-items:center;padding:34px max(28px,calc((100vw - var(--max))/2 + 28px));border-top:1px solid var(--line);transition:.3s}
.cat-row:last-child{border-bottom:1px solid var(--line)}
.cat-row:hover{background:var(--rust)}.cat-row:nth-child(even):hover{background:var(--sage);color:var(--ink)}
.cat-row .n{font-family:ui-monospace,monospace;font-size:12px}.cat-row .name{font-size:clamp(42px,6vw,94px);letter-spacing:-.055em}.cat-row .plus{font-size:34px;text-align:right;transition:transform .25s}.cat-row:hover .plus{transform:translate(4px,-4px)}

/* reasons */
.reasons{background:var(--rust);color:#fff}
.reasons .kicker,.reasons .index{color:#fff}.reasons-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-left:1px solid rgba(255,255,255,.24);border-top:1px solid rgba(255,255,255,.24)}
.reason{min-height:330px;padding:28px;border-right:1px solid rgba(255,255,255,.24);border-bottom:1px solid rgba(255,255,255,.24);display:flex;flex-direction:column;justify-content:space-between}.reason .n{font-family:ui-monospace,monospace;opacity:.7}.reason strong{font-size:23px;line-height:1.12}.reason p{font-size:14px;line-height:1.6;opacity:.78}

/* contact */
.contact{background:var(--paper);color:var(--ink);padding-bottom:60px}
.contact .kicker,.contact .index{color:var(--rust)}
.contact-lead{margin-bottom:46px;max-width:860px}
.contact-lead h2{font-size:clamp(46px,6vw,96px);line-height:.88;margin:14px 0 18px}
.contact-lead p{color:rgba(5,5,5,.64);line-height:1.7;max-width:620px;margin:0}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch}

/* two matched panels, each under its own header bar */
.panel-head{background:var(--ink);color:var(--paper);text-align:center;padding:17px 18px;
  font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.contact-copy{border:1px solid rgba(5,5,5,.18);background:#fff;display:flex;flex-direction:column}
.info-grid{flex:1;display:grid;grid-template-columns:1fr 1fr}
.info-cell{padding:34px 22px;text-align:center;border-right:1px solid rgba(5,5,5,.13);
  border-bottom:1px solid rgba(5,5,5,.13);display:flex;flex-direction:column;justify-content:center}
.info-cell:nth-child(2n){border-right:0}
.info-cell:nth-child(n+3){border-bottom:0}
.info-ico{width:26px;height:26px;fill:var(--rust);display:block;margin:0 auto 14px}
.info-cell h3{margin:0 0 10px;font-size:19px;letter-spacing:-.02em;font-weight:600;color:var(--ink)}
.info-cell p{margin:0;font-size:14px;line-height:1.75;color:rgba(5,5,5,.66)}
.info-cell a{color:rgba(5,5,5,.66);text-decoration:none;transition:color .2s}
.info-cell a:hover{color:var(--rust)}
.contact-copy h2{font-size:clamp(54px,7vw,110px);line-height:.86}
.contact-copy p{color:rgba(5,5,5,.64);line-height:1.7;max-width:530px}
.contact-lines{margin-top:44px;border-top:1px solid rgba(5,5,5,.15)}
.contact-line{padding:16px 0;border-bottom:1px solid rgba(5,5,5,.15);display:flex;justify-content:space-between;gap:18px;font-size:14px}
.enquiry{border:1px solid rgba(5,5,5,.18);background:#fff;display:flex;flex-direction:column}
.enquiry .form-grid{padding:26px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{display:flex;flex-direction:column;gap:8px}.field.full{grid-column:1/3}.field label{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:rgba(5,5,5,.55)}
.field input,.field select,.field textarea{width:100%;border:1px solid rgba(5,5,5,.16);background:#faf8f4;padding:15px 14px;outline:none;border-radius:0;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--rust)}
.field textarea{min-height:120px;resize:vertical}.consent{grid-column:1/3;font-size:12px;color:rgba(5,5,5,.62);display:flex;gap:10px;align-items:flex-start;line-height:1.45}.consent input{margin-top:2px}
.submit{grid-column:1/3;border:none;background:var(--ink);color:var(--paper);padding:18px;cursor:pointer;text-transform:uppercase;letter-spacing:.12em;font-size:12px;transition:.25s}.submit:hover{background:var(--rust)}
.form-status{grid-column:1/3;font-size:12px;min-height:18px;color:var(--rust)}

.footer{background:var(--ink);padding:42px 28px 28px;border-top:1px solid var(--line)}
.footer-inner{width:min(var(--max),100%);margin:auto}.footer-logo{width:min(440px,70vw);margin-bottom:42px}.footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase}

.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.2,.65,.2,1),transform .8s cubic-bezier(.2,.65,.2,1)}.reveal.on{opacity:1;transform:none}
.mobile-panel{display:none}

@media(max-width:1023px){
 .navlinks{display:none}.menu-btn{display:block}.nav{padding:14px 18px}.brand .logo-mark{width:136px}
 .mobile-panel{position:fixed;z-index:880;inset:0;background:var(--ink);padding:100px 26px 30px;display:flex;flex-direction:column;gap:14px;overflow-y:auto;transform:translateY(-105%);visibility:hidden;transition:transform .35s ease,visibility 0s linear .35s}.mobile-panel.open{transform:none;visibility:visible;transition:transform .35s ease}.mobile-panel a{font-size:clamp(24px,6.5vw,34px);letter-spacing:-.04em}.mobile-panel .mobile-cta{margin-top:10px;color:var(--rust)}.mobile-panel .mp-label{font-size:clamp(24px,6.5vw,34px);letter-spacing:-.04em}.mobile-panel .mp-sub a[aria-current="page"]{color:var(--sage)}.mobile-panel .mp-sub{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:8px}.mobile-panel .mp-sub a{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
}
@media(max-width:1200px){.reason{padding:22px}.reason strong{font-size:20px}}
@media(max-width:1000px){
 .hero{padding:130px 18px 34px}.hero-inner{grid-template-columns:1fr}.hero-side{border-left:none;padding-left:0;border-top:1px solid var(--line);padding-top:24px}.scroll-cue{display:none}.m2{right:8vw}.m1{right:-4vw}
 .section{padding:100px 18px}.section-head{grid-template-columns:1fr;gap:16px}.bfc{grid-template-columns:1fr}.bfc-card{min-height:280px;border-right:none;border-bottom:1px solid rgba(5,5,5,.14)}
 .about-sticky{padding:90px 18px}.about-layout{grid-template-columns:1fr}.lab-canvas{height:48vh;min-height:390px}
 .service-card{grid-template-columns:64px 1fr 30px;top:90px!important}
 .expertise-grid{grid-template-columns:repeat(2,1fr)}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sustain-layout{grid-template-columns:1fr}.sustain-modules{position:relative;top:auto}
 .reasons-grid{grid-template-columns:1fr 1fr}
 .contact-grid{grid-template-columns:1fr}
 .info-cell{padding:28px 16px}.material-row{grid-template-columns:1fr;gap:28px}.group-head{flex-direction:column;align-items:start}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-tile:nth-child(1){grid-row:span 1}.cat-row{grid-template-columns:70px minmax(0,1fr) 40px}
}
@media(max-width:620px){
 .hero h1{font-size:17vw}.eyebrow{font-size:10px}.module{opacity:.7}.m3{left:-10vw;width:65vw}.hero-side p{font-size:14px}
 .section{padding-top:82px;padding-bottom:82px}.section h2{font-size:12vw}.lead{font-size:18px}.bfc-card{padding:24px}
 .about{min-height:auto}.about-sticky{position:relative;min-height:auto}.about-copy h2{font-size:13vw}.lab-canvas{min-height:330px}
 .promise-word{padding:70px 18px}
 .service-card{position:relative;top:auto!important;min-height:auto;grid-template-columns:46px 1fr;padding:24px 18px}.service-arrow{display:none}.service-card h3{font-size:30px}
 .expertise-grid{grid-template-columns:1fr}.project-grid{grid-template-columns:1fr}.projects-cta{justify-content:stretch}.projects-cta .btn{width:100%}.expertise-item{min-height:150px}
 .sustain-modules{grid-template-columns:1fr}.tree{grid-column:auto}.s-box{min-height:150px}.tree{min-height:200px}
 .cat-row{grid-template-columns:52px minmax(0,1fr) 34px;padding-top:24px;padding-bottom:24px}
  .cat-row .name{font-size:12vw}.cat-row .plus{font-size:22px}
 .reasons-grid{grid-template-columns:1fr}.mat-chips{gap:10px}.mat-chip figcaption{font-size:11px}.gallery-grid{grid-auto-rows:150px;gap:8px}.reason{min-height:230px}
 .form-grid{grid-template-columns:1fr}.field.full,.consent,.submit,.form-status{grid-column:auto}
  .enquiry .form-grid{padding:18px}.contact-lead h2{font-size:12vw}
  .info-grid{grid-template-columns:1fr}
  .info-cell{border-right:0;border-bottom:1px solid rgba(5,5,5,.13)}
  .info-cell:last-child{border-bottom:0}
 .footer-logo{width:88vw}.footer{padding-left:18px;padding-right:18px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.module,.promise-word{transform:none!important}}

/* ---------- inner pages (design gallery, material library) ---------- */
.page-hero{padding:170px 28px 64px;border-bottom:1px solid var(--line);position:relative;overflow:hidden;background:radial-gradient(circle at 85% 20%,rgba(153,178,172,.14),transparent 32%),radial-gradient(circle at 10% 90%,rgba(158,67,34,.16),transparent 34%),var(--ink)}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:30px}
.crumbs a:hover{color:var(--sage)}.crumbs [aria-current]{color:var(--sage)}
.page-hero h1{font-size:clamp(64px,10vw,170px);line-height:.85;letter-spacing:-.065em;margin:0 0 28px;font-weight:600}
.page-hero .lead{max-width:760px;margin:0}
.page-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px}
.page-tabs a{border:1px solid var(--line);padding:12px 16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s}
.page-tabs a:hover{border-color:var(--paper)}
.page-tabs a[aria-current="page"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.page-body{padding-top:70px}
.gallery-grid.full{grid-auto-flow:dense}
.gallery-grid.full .gallery-tile:nth-child(1){grid-column:auto;grid-row:auto}
.gallery-grid.full .gallery-tile:nth-child(7n+1){grid-column:span 2;grid-row:span 2}
.gallery-hint{margin:22px 0 0;font-size:12px;color:var(--muted)}
.mat-chips.large{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.mat-chips.large .mat-chip figcaption{font-size:13px}
.mat-info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:64px;padding-top:40px;border-top:1px solid rgba(5,5,5,.14)}
.mat-info-grid h2{font-size:12px!important;letter-spacing:.16em!important;text-transform:uppercase;color:var(--rust);font-weight:600!important;margin:0 0 16px!important;line-height:1.3!important}
.mat-info-grid ul{margin:0;padding-left:18px;color:rgba(5,5,5,.72);line-height:1.8}
.mat-info-grid p{margin:0;color:rgba(5,5,5,.72);line-height:1.7}
.tx-teak{background:repeating-linear-gradient(90deg,rgba(70,35,10,.22) 0 2px,transparent 2px 11px),repeating-linear-gradient(86deg,rgba(255,255,255,.08) 0 1px,transparent 1px 6px),#a8703f!important}
.tx-ash{background:repeating-linear-gradient(92deg,rgba(120,95,60,.18) 0 1px,transparent 1px 7px),repeating-linear-gradient(89deg,rgba(255,255,255,.14) 0 1px,transparent 1px 4px),#d9c8ad!important}
.tx-concrete{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"),#9a9792!important}
.tx-cane{background:repeating-linear-gradient(45deg,rgba(90,60,25,.35) 0 2px,transparent 2px 10px),repeating-linear-gradient(-45deg,rgba(90,60,25,.35) 0 2px,transparent 2px 10px),#d8b98a!important}
.page-cta{background:var(--rust);color:#fff}
.page-cta .wrap{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end}
.page-cta h2{margin:0}.page-cta p{margin:18px 0 0;max-width:560px;line-height:1.7;opacity:.85}
.page-cta .btn{border-color:rgba(255,255,255,.5)}.page-cta .btn.primary{background:var(--ink);border-color:var(--ink)}.page-cta .btn.primary:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.page-cta .hero-actions{justify-content:flex-end}
@media(max-width:1000px){.page-hero{padding:130px 18px 48px}.mat-info-grid{grid-template-columns:1fr;gap:30px}.page-cta .wrap{grid-template-columns:1fr}.page-cta .hero-actions{justify-content:flex-start}}
@media(max-width:620px){.mat-chips.large{grid-template-columns:repeat(2,minmax(0,1fr))}.page-hero h1{font-size:17vw}}

/* ---------- services: white background, each card fills with a brand colour on hover ---------- */
.services{background:#fff;color:var(--ink);border-bottom-color:rgba(5,5,5,.1)}
.services .index,.services .kicker{color:var(--rust)}
.services .lead{color:rgba(5,5,5,.7)}
.service-card{--pop:var(--rust);--pop-ink:#fff;background:#fff;border-color:rgba(5,5,5,.14);box-shadow:0 -10px 30px rgba(5,5,5,.05);transition:background-color .35s ease,border-color .35s ease,color .35s ease,box-shadow .35s ease}
.service-card:nth-child(6n+2),.service-card:nth-child(6n){--pop:var(--sage);--pop-ink:var(--ink)}
.service-card:nth-child(6n+3){--pop:var(--sage-deep)}
.service-card:nth-child(6n+4){--pop:var(--rust-deep)}
.services .service-no{color:var(--rust);transition:color .35s ease}
.services .service-card p{color:rgba(5,5,5,.64);transition:color .35s ease}
.services .service-arrow{transition:color .35s ease,transform .25s}
.service-card:hover,.service-card:focus-visible{background:var(--pop);border-color:var(--pop);color:var(--pop-ink);box-shadow:0 20px 50px rgba(5,5,5,.18)}
.services .service-card:hover .service-no,.services .service-card:focus-visible .service-no,
.services .service-card:hover .service-arrow,.services .service-card:focus-visible .service-arrow{color:var(--pop-ink)}
.services .service-card:hover p,.services .service-card:focus-visible p{color:var(--pop-ink);opacity:.88}
.navlinks>a[aria-current="page"]{opacity:1;color:var(--sage)}.mobile-panel>a[aria-current="page"]{color:var(--sage)}

/* philosophy: heading spans the full width of the Build / Form / Curate row */
.philosophy .section-head{grid-template-columns:1fr;gap:10px;margin-bottom:0}
.philosophy .section-head h2{max-width:none;font-size:clamp(40px,6.6vw,118px);text-wrap:balance}
.philosophy .lead{max-width:none;color:rgba(5,5,5,.72)}
.sustain-tagline{margin:28px 0 30px;font-size:clamp(15px,1.5vw,20px);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--sage)}
.sustain .index{margin-bottom:12px}
.tree .circle{flex:none;text-align:center;font-size:12px;line-height:1.25;letter-spacing:.08em}

/* ---------- range pages (Essentials / Premium / Luxe / Bespoke) ---------- */
.range-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-height:100vh;min-height:100svh;background:var(--ink);border-bottom:1px solid var(--line)}
.range-hero-copy{display:flex;flex-direction:column;justify-content:flex-end;padding:150px 6vw 64px 28px;background:radial-gradient(circle at 10% 90%,rgba(158,67,34,.14),transparent 36%)}
.range-hero h1{margin:0;font-size:clamp(72px,9.5vw,158px);line-height:.84;letter-spacing:-.065em;font-weight:600}
.range-hero h1 .pre{display:block;font-size:.42em;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1px var(--paper);margin-bottom:.12em}
.range-hero h1 .tier{color:var(--tier)}
.range-hero-copy .lead{max-width:540px;margin:14px 0 0;color:var(--muted)}
.level{display:flex;align-items:center;gap:6px;margin-top:34px}
.level i{width:44px;height:6px;background:rgba(243,239,232,.16)}.level i.on{background:var(--tier)}
.level span{margin-left:12px;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.range-hero .page-tabs{margin-top:34px}
.range-hero .page-tabs a[aria-current="page"]{background:var(--tier);border-color:var(--tier);color:var(--ink)}
.photo-slot{position:relative;overflow:hidden;background:linear-gradient(150deg,var(--tier),#0c0b0a 78%)}
.photo-slot:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:56px 56px}
.photo-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.photo-slot .slot-label{position:absolute;left:24px;bottom:20px;z-index:2;font:600 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(243,239,232,.75)}
.range-hero .photo-slot{min-height:60vh}
.range-overview{background:var(--paper);color:var(--ink)}
.range-overview .index{color:var(--rust)}
.overview-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8vw}
.range-overview h2{margin:0}
.range-overview p{font-size:clamp(17px,1.4vw,20px);line-height:1.7;color:rgba(5,5,5,.7);max-width:760px;margin:30px 0 0}
.range-break{height:78vh;min-height:460px;background:linear-gradient(150deg,#d6cabb,#8d7969)}
.range-break:before{background-image:linear-gradient(rgba(5,5,5,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(5,5,5,.05) 1px,transparent 1px)}
.range-why{background:#fff;color:var(--ink)}
.range-why .index{color:var(--rust)}
.range-why h2{margin:24px 0 0}
.why-grid{margin-top:70px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid rgba(5,5,5,.14)}
.benefit{min-height:250px;padding:38px 56px 50px 0;border-bottom:1px solid rgba(5,5,5,.14);transition:background-color .35s ease,color .35s ease}
.benefit:nth-child(odd){border-right:1px solid rgba(5,5,5,.14)}
.benefit:nth-child(even){padding-left:56px}
.benefit .n{font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--rust)}
.benefit h3{font-size:clamp(26px,2.6vw,38px);letter-spacing:-.03em;margin:26px 0 14px}
.benefit p{margin:0;color:rgba(5,5,5,.64);line-height:1.7;max-width:500px}
.range-package{background:var(--ink)}
.package-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:8vw;align-items:start}
.range-package h2{margin:24px 0 0}
.range-package .note{margin:30px 0 0;color:var(--muted);font-size:13px;line-height:1.7;max-width:420px}
.spec-list{border-top:1px solid var(--line)}
.spec-row{display:grid;grid-template-columns:48px minmax(0,.8fr) minmax(0,1.2fr);gap:20px;padding:24px 0;border-bottom:1px solid var(--line);align-items:baseline}
.spec-row .n{font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--tier)}
.spec-row .k{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.spec-row .v{font-size:clamp(17px,1.4vw,20px);line-height:1.4}
.range-gallery{background:var(--paper);color:var(--ink)}
.range-gallery .index{color:var(--rust)}
.rg-grid{margin-top:44px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:18px}
.rg-grid .gallery-tile{min-height:clamp(360px,42vw,620px)}
.rg-stack{display:grid;gap:18px}
.rg-stack .gallery-tile{min-height:0}
.range-compare{background:#fff;color:var(--ink)}
.range-compare .index{color:var(--rust)}
.compare-grid{margin-top:44px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.compare-card{display:flex;flex-direction:column;gap:18px;padding:26px;border:1px solid rgba(5,5,5,.14);min-height:250px;transition:background-color .35s ease,border-color .35s ease,color .35s ease}
.compare-card .level{margin-top:0}.compare-card .level span{color:rgba(5,5,5,.62)}.compare-card .level i{width:28px;background:rgba(5,5,5,.12)}.compare-card .level i.on{background:var(--c)}
.compare-card h3{font-size:clamp(28px,2.6vw,40px);letter-spacing:-.04em;margin:0}
.compare-card p{margin:0;color:rgba(5,5,5,.64);line-height:1.6;font-size:14px;flex:1}
.compare-card .go{font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.compare-card:hover{background:var(--c);border-color:var(--c);color:#fff}.compare-card:hover p{color:rgba(255,255,255,.85)}.compare-card:hover .level i{background:rgba(255,255,255,.3)}.compare-card:hover .level i.on{background:#fff}
.compare-card[aria-current="page"]{border-color:var(--c);box-shadow:inset 0 0 0 1px var(--c)}
@media(max-width:1000px){
 .range-hero{grid-template-columns:minmax(0,1fr);min-height:auto}
 .range-hero .page-tabs{flex-wrap:wrap}.range-hero-copy{padding:130px 18px 48px}
 .overview-grid,.package-layout{grid-template-columns:1fr;gap:28px}
 .why-grid{grid-template-columns:1fr}.benefit,.benefit:nth-child(even){padding:32px 0 40px;border-right:0}
 .rg-grid{grid-template-columns:1fr}.rg-stack{grid-template-columns:1fr 1fr}.rg-stack .gallery-tile{min-height:220px}
 .compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
 .range-hero h1{font-size:18vw}.range-break{height:56vh;min-height:320px}
 .spec-row{grid-template-columns:34px 1fr;gap:6px 14px}.spec-row .v{grid-column:2}
 .rg-stack{grid-template-columns:1fr}
 .compare-grid{grid-template-columns:1fr}.compare-card{min-height:auto}
}
.rg-grid .gallery-tile{grid-column:auto!important;grid-row:auto!important}
.rg-stack{grid-template-rows:1fr 1fr}
@media(max-width:1000px){.rg-stack{grid-template-rows:none}}


/* ---------- hero: FORM. rushes toward the viewer and off screen on scroll ---------- */
.flyout.is-flying{visibility:hidden}
#formStage{position:fixed;inset:0;z-index:6;pointer-events:none;display:none;overflow:hidden}
#formStage.on{display:block}
#formFlyer{position:absolute;margin:0;white-space:nowrap;will-change:transform,opacity}
@media(prefers-reduced-motion:reduce){#formStage{display:none!important}.flyout.is-flying{visibility:visible}}


/* sub-headings inside a dropdown (Design gallery / Finishes) */
.nav-sub{min-width:214px}
.nav-sub-h{display:block;padding:12px 18px 6px;font:600 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.16em;text-transform:uppercase;color:var(--sage);opacity:.75}
.nav-sub-h + a{padding-top:5px}
.nav-sub a + .nav-sub-h{margin-top:6px;border-top:1px solid var(--line);padding-top:14px}
.mobile-panel .mp-sub .nav-sub-h{width:100%;padding:6px 0 0;font-size:10px;letter-spacing:.16em;color:var(--sage);opacity:.8}
.mobile-panel .mp-sub .nav-sub-h:not(:first-child){margin-top:8px}

/* the About lead-in sits on the light contact section, so its text must be dark */
.contact .lead{color:rgba(5,5,5,.78)}
.contact .muted{color:rgba(5,5,5,.62)}
.contact .section-head .lead{margin:24px 0 0;max-width:820px}
.contact .section-head .muted{margin:16px 0 0;max-width:820px;line-height:1.75}

/* ============ THE KITCHEN JOURNEY (9-step process) ============ */
.process-gsap{--jr-bg:#1d221e;--jr-sand:#d9c7a9;--jr-dim:rgba(233,228,218,.52);--jr-line:rgba(233,228,218,.16)}

/* ---- pinned mode ---- */
.process-gsap:not(.process-static){border:0;background:var(--jr-bg);height:var(--jr-len,850vh)}
.process-gsap:not(.process-static) .process-shell{position:sticky;top:0;height:100svh;min-height:100svh;
  padding:0;display:block;background:var(--jr-bg);color:#efece6;overflow:hidden}
/* the photo is inset in the dark frame, as in the reference */
.process-gsap:not(.process-static) .process-stage{position:static;z-index:auto;display:block;margin:0;padding:0;min-height:0}
.process-gsap:not(.process-static) .process-visual{position:absolute;top:0;left:0;right:0;height:100%;
  z-index:0;margin:0;border:0;aspect-ratio:auto;min-height:0;background:var(--jr-bg);overflow:hidden;isolation:isolate}
.process-gsap:not(.process-static) .pshot{position:absolute;inset:0;margin:0;padding:0;display:block;opacity:0;visibility:hidden;will-change:opacity}
.process-gsap:not(.process-static) .process-visual{isolation:isolate}
.process-gsap:not(.process-static) .pshot.is-active{opacity:1;visibility:visible}
.process-gsap:not(.process-static) .pshot img{position:absolute;inset:auto auto auto 0;top:50%;
  width:100%;height:102%;object-fit:cover;display:block;transform:translate3d(0,-50%,0);
  will-change:transform;backface-visibility:hidden}
@media(min-aspect-ratio:2/1){
  .process-gsap:not(.process-static) .pshot img{object-fit:contain;background:var(--jr-bg)}}
.process-gsap:not(.process-static) .pshot:after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(20,24,21,.72) 0%,rgba(20,24,21,.12) 20%,rgba(20,24,21,0) 42%,rgba(20,24,21,.55) 74%,rgba(20,24,21,.92) 100%)}
.process-gsap:not(.process-static) .pshot .visual-caption{display:none}

/* ---- top bar ---- */
.jr-top{position:absolute;z-index:4;top:0;left:0;right:0;padding:96px 34px 0;display:flex;justify-content:space-between;align-items:flex-start}
.jr-brand,.jr-meta{display:flex;flex-direction:column;gap:7px}
.jr-meta{text-align:right}
.jr-mark{font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:rgba(239,236,230,.6)}
.jr-mark b{font-weight:700;color:#efece6}
.jr-sub,.jr-meta span{font:600 9.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.2em;
  text-transform:uppercase;color:var(--jr-dim)}
.jr-range{color:var(--jr-sand)!important;letter-spacing:.3em!important}

/* ---- the stage text ---- */
.process-gsap:not(.process-static) .process-story{position:absolute;z-index:4;left:0;right:34%;
  bottom:210px;padding:0 34px 0 78px;min-height:0;max-width:none;height:auto;background:none;border:0;overflow:visible}
.process-gsap:not(.process-static) .process-scene{position:absolute;left:0;right:0;bottom:0;inset:auto 0 0 0;
  display:block;padding:0 34px 0 78px;background:none;border:0;box-shadow:none;opacity:0;visibility:hidden}
.process-gsap:not(.process-static) .process-scene.is-active{opacity:1;visibility:visible;transform:none}
.jr-eyebrow{display:block;font:600 9.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(239,236,230,.85);margin-bottom:22px}
.jr-head{display:flex;align-items:baseline;gap:26px}
.jr-num{font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;color:var(--jr-sand);flex:0 0 auto;width:26px}
.process-gsap:not(.process-static) .process-scene h3{font-family:"Playfair Display",Georgia,serif;font-weight:400;
  font-size:clamp(52px,5.6vw,104px);line-height:.98;letter-spacing:-.015em;color:#fbf9f5;margin:0;
  text-shadow:0 2px 40px rgba(0,0,0,.45)}
.process-gsap:not(.process-static) .process-scene p{margin:18px 0 0 52px;max-width:520px;font-size:15px;
  line-height:1.6;color:rgba(247,245,240,.88);text-shadow:0 1px 18px rgba(0,0,0,.5)}
.jr-scroll{position:absolute;z-index:4;left:78px;bottom:150px;font:600 9.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.2em;text-transform:uppercase;color:rgba(239,236,230,.8)}

/* ---- right rail: arrows + counter ---- */
.jr-rail{position:absolute;z-index:5;right:34px;top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;align-items:center;gap:14px}
.jr-arrow{width:38px;height:38px;border-radius:50%;border:1px solid var(--jr-line);background:rgba(255,255,255,.05);
  color:#efece6;font-size:14px;cursor:pointer;display:grid;place-items:center;transition:.25s}
.jr-arrow:hover{background:#efece6;color:var(--jr-bg);border-color:#efece6}
.jr-arrow[disabled]{opacity:.28;cursor:default}
.jr-arrow[disabled]:hover{background:rgba(255,255,255,.05);color:#efece6;border-color:var(--jr-line)}
.jr-count{font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:var(--jr-dim)}
.jr-count b{color:#efece6;font-weight:600}

/* ---- play journey ---- */
.jr-play{position:absolute;z-index:5;right:34px;bottom:150px;background:none;border:0;cursor:pointer;
  color:#efece6;font-size:13px;letter-spacing:.02em;display:flex;align-items:center;gap:10px;padding:8px 0;transition:.25s}
.jr-play i{font-style:normal;font-size:11px;color:var(--jr-sand)}
.jr-play:hover{color:var(--jr-sand)}
.jr-play.is-playing i{color:#efece6}

/* ---- bottom stage tabs ---- */
.jr-bar{position:absolute;z-index:6;left:34px;right:34px;bottom:112px;height:2px;
  background:rgba(233,228,218,.14);overflow:hidden}
.jr-bar i{display:block;height:100%;background:var(--jr-sand);transform:scaleX(0);transform-origin:left}
.process-static .jr-bar{display:none}
.jr-tabs{position:absolute;z-index:5;left:34px;right:34px;bottom:0;height:112px;display:grid;
  grid-template-columns:repeat(9,1fr);border-bottom:1px solid var(--jr-line)}
.jr-tab{position:relative;background:none;border:0;border-top:1px solid var(--jr-line);cursor:pointer;
  text-align:left;padding:20px 14px 0 0;display:flex;flex-direction:column;gap:14px;transition:.3s}
.jr-tab:before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--jr-sand);
  transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.65,.2,1)}
.jr-tab.is-on:before{transform:scaleX(1)}
.jr-tab-n{font:600 9.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:rgba(217,199,169,.55)}
.jr-tab-t{font-size:13.5px;line-height:1.2;color:rgba(239,236,230,.5);transition:.3s}
.jr-tab:hover .jr-tab-t{color:rgba(239,236,230,.85)}

.jr-tab.is-on .jr-tab-n{color:var(--jr-sand)}
.jr-tab.is-on .jr-tab-t{color:#fbf9f5}
.jr-tab.is-done .jr-tab-t{color:rgba(239,236,230,.72)}

@media(max-width:1300px){
  .process-gsap:not(.process-static) .process-story,
  .process-gsap:not(.process-static) .process-scene{padding-left:56px}
  .jr-scroll{left:56px}
  .jr-tab-t{font-size:12px}
}

/* ---- the same journey on tablets and phones ---------------------------------
   Nothing here changes the motion — only how much room each part gets. */
@media(max-width:1023px){
  .process-gsap:not(.process-static){--jr-len:760vh}
  .jr-top{padding:84px 20px 0}
  .jr-mark{font-size:13px}
  .jr-sub,.jr-meta span{font-size:11px}
  .process-gsap:not(.process-static) .process-story{right:0;padding-left:0}
  .process-gsap:not(.process-static) .process-scene{padding-left:20px;padding-right:20px;bottom:150px}
  .process-gsap:not(.process-static) .process-scene h3{font-size:clamp(38px,8.6vw,66px)}
  .process-gsap:not(.process-static) .process-scene p{margin-left:0;max-width:34ch;font-size:14px}
  .jr-eyebrow{margin-left:0}
  .jr-rail{display:none}
  .jr-scroll{left:20px}
  .jr-bar{left:20px;right:20px;bottom:86px}
  .jr-tabs{left:20px;right:20px;height:86px;gap:0}
  .jr-tab{padding:12px 6px 0 0;gap:0}
  .jr-tab-t{display:none}            /* numbers only, as on the reference */
  .jr-tab-n{font-size:10px;color:rgba(217,199,169,.5)}
  .jr-play{right:20px}
  /* the copy sits over a much smaller frame on a phone, so it needs a deeper base */
  .process-gsap:not(.process-static) .pshot:after{
    background:linear-gradient(180deg,rgba(20,24,21,.74) 0%,rgba(20,24,21,.22) 16%,
      rgba(20,24,21,.12) 34%,rgba(20,24,21,.62) 62%,rgba(20,24,21,.93) 100%)}
}
@media(max-width:600px){
  .process-gsap:not(.process-static){--jr-len:680vh}
  .jr-top{padding:76px 16px 0}
  .jr-meta{display:none}
  .process-gsap:not(.process-static) .process-scene{padding-left:16px;padding-right:16px;bottom:132px}
  .process-gsap:not(.process-static) .process-scene h3{font-size:clamp(34px,10vw,52px)}
  .process-gsap:not(.process-static) .process-scene p{font-size:13.5px;max-width:30ch}
  .jr-scroll{display:none}
  .jr-bar{left:16px;right:16px;bottom:74px}
  .jr-tabs{left:16px;right:16px;height:74px}
  .jr-tab{padding:10px 4px 0 0}
  .jr-tab-n{font-size:9px}
  .jr-play{right:16px;bottom:88px}
}

/* ---- stacked fallback: reduced motion, or screens too small to pin ---- */
.process-static .process-shell{background:var(--jr-bg);color:#efece6;padding:96px 24px 70px;min-height:auto;display:block}
.process-static .jr-top{position:relative;padding:0 0 46px}
.process-static .jr-rail,.process-static .jr-play,.process-static .jr-scroll,.process-static .jr-tabs{display:none}
.process-static .process-stage{display:block}
.process-static .process-story{position:relative;height:auto;padding:0;inset:auto;right:auto;max-width:760px}
.process-static .process-scene{position:relative;inset:auto;opacity:1!important;visibility:visible!important;
  padding:34px 0;border-top:1px solid var(--jr-line);background:none}
.process-static .process-scene:first-child{border-top:0}
.process-static .process-scene h3{font-family:"Playfair Display",Georgia,serif;font-weight:400;
  font-size:clamp(36px,7vw,58px);line-height:1;color:#fbf9f5;margin:0}
.process-static .process-scene p{margin:14px 0 0 52px;color:rgba(239,236,230,.72);line-height:1.65;font-size:15px}
.process-static .jr-eyebrow{display:none}
.process-static .process-visual{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;
  inset:auto;aspect-ratio:auto;min-height:0;border:0;background:none;overflow:visible;margin-top:44px}
.process-static .pshot{position:relative;inset:auto;margin:0;aspect-ratio:16/9;opacity:1!important;visibility:visible!important;
  transform:none!important;border:1px solid var(--jr-line);overflow:hidden}
.process-static .pshot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.process-static .pshot .visual-caption{position:absolute;left:10px;bottom:9px;font:600 9px/1.25 ui-monospace,monospace;
  letter-spacing:.12em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.9)}
@media(max-width:520px){.process-static .process-visual{grid-template-columns:1fr}}

/* range pages: the "also included" list under the specification */
.range-extras{margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}
.range-extras h3{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);margin:0 0 16px;font-weight:600}
.range-extras ul{margin:0;padding-left:18px;color:var(--muted);line-height:1.85;font-size:15px}
.range-extras li{margin-bottom:6px}
/* three ranges rather than four */
.compare-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1000px){.compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.compare-grid{grid-template-columns:1fr}}

/* ---- range hero tagline ---- */
.range-hero-copy .range-tag{font-family:'Playfair Display',Georgia,serif;font-size:clamp(20px,2.1vw,30px);line-height:1.2;
  letter-spacing:-.01em;color:var(--tier,var(--sage));margin:18px 0 10px;max-width:22ch}

/* ---- tentative estimate ---- */
.range-estimate{background:var(--paper);color:var(--ink)}
.range-estimate h2{font-size:clamp(34px,4.2vw,62px);color:var(--ink)}
.range-estimate .index{color:var(--tier-ink,var(--rust))}
.estimate-layout{display:grid;grid-template-columns:1fr minmax(320px,440px);gap:64px;align-items:start}
.range-estimate h2{margin:22px 0 18px}
.range-estimate p{font-size:15px;line-height:1.75;color:rgba(5,5,5,.68);max-width:52ch;margin:0 0 12px}
.range-estimate .note{font:600 11px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;
  text-transform:uppercase;color:rgba(5,5,5,.5);max-width:46ch}
.est-card{border:1px solid rgba(5,5,5,.16);background:#fff;padding:32px 30px 30px;display:grid;gap:20px;
  box-shadow:0 1px 0 rgba(5,5,5,.05)}
.est-field{display:grid;gap:9px}
.est-field label{font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(5,5,5,.58)}
.est-field select{appearance:none;width:100%;border:1px solid rgba(5,5,5,.22);background:#fff;color:var(--ink);
  font:400 16px/1.2 inherit;padding:14px 42px 14px 14px;border-radius:0;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 20px) calc(50% + 1px),calc(100% - 14px) calc(50% + 1px);
  background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.est-field select:focus-visible{outline:2px solid var(--tier-ink,var(--rust));outline-offset:2px}
.est-result{border-top:1px solid rgba(5,5,5,.16);padding-top:20px;display:grid;gap:7px}
.est-result span{font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(5,5,5,.55)}
.est-result strong{font-family:'Playfair Display',Georgia,serif;font-size:clamp(30px,3.4vw,44px);font-weight:500;
  line-height:1.05;letter-spacing:-.02em;color:var(--tier-ink,var(--rust))}
.est-cta{justify-self:start}
@media(max-width:900px){.estimate-layout{grid-template-columns:1fr;gap:34px}}

/* ---- hero photo modules: narrow screens ---- */
@media(max-width:1023px){
  .module.m2,.module.m3,.module.m4{display:none}
  .hero{padding-top:calc(92px + 22vh + 30px)}
  .module.m1{left:18px;right:18px;top:92px;width:auto;height:22vh;min-width:0;min-height:0}
  .module img{opacity:.88}
}
@media(max-width:600px){
  .hero{padding-top:calc(88px + 20vh + 26px)}
  .module.m1{top:88px;height:20vh}
}


/* Modularlabs: deliberate, responsive hero composition (2026 refresh) */
.hero{padding-top:clamp(390px,47vh,540px);padding-bottom:clamp(52px,7vh,90px)}
.hero-collage{position:absolute;z-index:2;left:max(28px,4.2vw);right:max(28px,4.2vw);top:clamp(86px,10vh,125px);height:clamp(245px,31vh,345px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;pointer-events:none}
.hero-collage .module{position:relative;inset:auto;left:auto;right:auto;top:auto;bottom:auto;width:auto;height:auto;min-width:0;min-height:0;transform:none!important;will-change:auto;opacity:1;overflow:hidden;border:1px solid rgba(243,239,232,.23);backdrop-filter:none}
.hero-collage .module img{opacity:.96;filter:saturate(.94) contrast(1.025)}
.hero-collage .module:after{background:linear-gradient(180deg,transparent 65%,rgba(0,0,0,.12))}
.hero-collage .m3{grid-column:1 / 6;grid-row:1 / 3}
.hero-collage .m4{grid-column:6 / 8;grid-row:1}
.hero-collage .m2{grid-column:6 / 8;grid-row:2;border-color:rgba(158,67,34,.48)}
.hero-collage .m1{grid-column:8 / 13;grid-row:1 / 3;border-color:rgba(153,178,172,.55)}
.hero-inner{align-items:end;gap:clamp(28px,4vw,65px)}
.hero-side p{color:#c0beb9}
@media(max-width:1023px){
  .hero{display:block;min-height:0;padding:92px 18px 62px}
  .hero-collage{position:relative;left:auto;right:auto;top:auto;height:auto;width:100%;margin:0 0 34px;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:10px;pointer-events:auto}
  .hero-collage .module.m1,.hero-collage .module.m2,.hero-collage .module.m3,.hero-collage .module.m4{display:block;position:relative;inset:auto;width:auto;height:auto;min-width:0;min-height:0;opacity:1}
  .hero-collage .m3{grid-column:1 / 3;grid-row:1;aspect-ratio:2.25 / 1}
  .hero-collage .m4{grid-column:1;grid-row:2;aspect-ratio:1 / 1}
  .hero-collage .m2{grid-column:1;grid-row:3;aspect-ratio:1 / 1}
  .hero-collage .m1{grid-column:2;grid-row:2 / 4;aspect-ratio:auto}
  .hero-collage .module img{height:100%;width:100%;object-fit:cover;opacity:1}
  .hero-inner{display:grid;grid-template-columns:1fr;gap:30px}
  .hero-side{border-left:0;border-top:1px solid var(--line);padding:22px 0 0;max-width:none}
  .hero h1{font-size:clamp(70px,14vw,125px)}
  .scroll-cue{display:none}
}
@media(max-width:620px){
  .hero{padding:86px 16px 48px}
  .hero-collage{gap:8px;margin-bottom:28px}
  .hero-collage .m3{aspect-ratio:2.15 / 1}
  .hero-collage .m4,.hero-collage .m2{aspect-ratio:1.17 / 1}
  .hero h1{font-size:clamp(54px,16.5vw,100px)}
  .eyebrow{font-size:9px;letter-spacing:.12em;gap:9px;margin-bottom:20px;white-space:normal}
  .eyebrow:before{width:26px;flex:none}
  .hero-side p{font-size:14px;line-height:1.65}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .hero-actions .btn{width:100%}
}
@media(max-width:360px){.hero h1{font-size:15.8vw}.hero{padding-left:12px;padding-right:12px}}


/* ===== 2026 compact promise + mobile one-image hero slider ===== */
/* Desktop keeps its architectural four-image grid. */
.hero-slider-controls{display:none}

/* A short, low-profile savings strip: horizontal motion finishes in one quick swipe. */
.promise{border-top:1px solid rgba(243,239,232,.12);border-bottom:1px solid rgba(243,239,232,.12)}
.promise.is-animated .promise-track{height:clamp(220px,27vh,290px);top:0;background:radial-gradient(ellipse at 50% 50%,rgba(153,178,172,.045),transparent 73%),#080807}
.promise-word{padding:55px 28px}
.promise.is-animated .promise-word{
  font-size:clamp(46px,7.9vw,128px);letter-spacing:-.075em;
  line-height:1.05;gap:0 .43em;padding:0 9vw 0 7vw;
}
.promise-doodles .dd{opacity:.55}

@media(max-width:620px){
  /* A single full-width hero photo, swipeable through the other three photos. */
  .hero{padding-top:83px}
  .hero-collage{
    display:flex;grid-template-columns:none;grid-template-rows:none;
    gap:0;margin:0;aspect-ratio:1.57 / 1;height:auto;
    overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
    scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;
  }
  .hero-collage::-webkit-scrollbar{display:none}
  .hero-collage .module.m1,.hero-collage .module.m2,.hero-collage .module.m3,.hero-collage .module.m4{
    display:block;flex:0 0 100%;width:100%;height:100%;aspect-ratio:auto;
    grid-column:auto;grid-row:auto;border-color:rgba(243,239,232,.24);
    scroll-snap-align:start;scroll-snap-stop:always;
  }
  .hero-collage .module img{width:100%;height:100%;object-fit:cover}
  .hero-slider-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;margin-bottom:18px}
  .hero-slider-dots{display:flex;gap:7px;align-items:center}
  .hero-slider-dot{width:18px;height:3px;padding:0;border:0;background:rgba(243,239,232,.3);cursor:pointer;transition:background .2s,width .2s}
  .hero-slider-dot.is-current{width:34px;background:var(--rust)}
  .hero-slider-navigation{display:flex;align-items:center;gap:8px}
  .hero-slide-count{margin-right:6px;font:600 11px/1.2 ui-monospace,monospace;letter-spacing:.04em;color:var(--paper)}
  .hero-slide-count span{color:var(--muted)}
  .hero-slide-arrow{display:grid;place-items:center;width:33px;height:33px;padding:0;background:transparent;color:var(--paper);border:1px solid var(--line);cursor:pointer;font-size:18px;line-height:1}
  .hero-slide-arrow:active{border-color:var(--sage);color:var(--sage)}
  .hero-inner{gap:22px}
  .hero .eyebrow{margin-bottom:17px}
  .promise.is-animated .promise-track{height:clamp(160px,22vh,205px)}
  .promise.is-animated .promise-word{font-size:clamp(39px,11.3vw,62px);gap:0 .43em;padding:0 30px 0 20px}
  .promise-word{padding:32px 18px}
}
@media(prefers-reduced-motion:reduce){
  .hero-collage{scroll-behavior:auto!important}
  .promise-word{transform:none!important}
}

/* Keep carousel controls above the decorative ambient layer, and text below the fixed nav. */
@media(max-width:620px){
  .hero-slider-controls{position:relative;z-index:5}
  .promise.is-animated .promise-track{padding-top:56px}
}
@media(min-width:621px){
  .promise.is-animated .promise-track{padding-top:40px}
}

/* Oct 2026: faithful 16:9 process photographs on phones, without tall crop. */
@media (max-width: 767px){
  .process-gsap:not(.process-static) .process-visual{
    top:clamp(110px,17svh,155px);left:14px;right:14px;
    width:calc(100% - 28px);height:auto;aspect-ratio:16 / 9;
    border:1px solid rgba(233,228,218,.22);
    background:#181c19;
  }
  .process-gsap:not(.process-static) .pshot{inset:0;width:100%;height:100%}
  .process-gsap:not(.process-static) .pshot img{
    width:100%;height:100%;top:0;left:0;
    object-fit:contain;object-position:center;
    transform:none!important;
  }
  .process-gsap:not(.process-static) .pshot:after{background:none}
  .process-gsap:not(.process-static) .process-story{
    top:calc(clamp(110px,17svh,155px) + (100vw - 28px) * .5625 + 22px);
    bottom:auto;left:0;right:0;
  }
  .process-gsap:not(.process-static) .process-scene{
    top:0;bottom:auto;padding:0 18px;
  }
  .process-gsap:not(.process-static) .process-scene h3{font-size:clamp(32px,8.5vw,46px);line-height:1.08}
  .process-gsap:not(.process-static) .process-scene p{margin-top:12px;max-width:40ch;line-height:1.45}
  .jr-eyebrow{margin-bottom:12px}
  .jr-top{padding-top:70px}
  .jr-play{bottom:89px}
  .jr-tabs{height:67px}.jr-bar{bottom:67px}
}
@media (max-width:767px) and (max-height:680px){
  .process-gsap:not(.process-static) .process-visual{top:92px;left:12px;right:12px;width:calc(100% - 24px)}
  .process-gsap:not(.process-static) .process-story{top:calc(92px + (100vw - 24px) * .5625 + 12px)}
  .process-gsap:not(.process-static) .process-scene h3{font-size:30px}
  .process-gsap:not(.process-static) .process-scene p{font-size:12px;margin-top:7px}
  .jr-eyebrow{margin-bottom:6px}
  .jr-top{padding-top:60px}.jr-play{bottom:74px}
}
/* Small, low-profile savings strip, completely replaces pinning and horizontal scroll. */
.promise.promise-simple{height:auto!important;padding:0;border-block:1px solid rgba(243,239,232,.12);background:#0b0c0b}
.promise.promise-simple .promise-track{height:auto!important;min-height:0!important;position:relative!important;top:auto!important;display:block;overflow:visible;padding:0!important;background:none!important}
.promise.promise-simple .promise-word{width:min(100% - 64px,1200px);margin:0 auto;padding:30px 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;white-space:normal;transform:none!important;font-size:clamp(18px,2.35vw,35px);font-weight:700;line-height:1.15;letter-spacing:-.045em;text-align:center}
.promise.promise-simple .promise-word span{display:block;white-space:nowrap;border-right:1px solid rgba(243,239,232,.15)}
.promise.promise-simple .promise-word span:last-child{border-right:0}
@media(max-width:620px){
 .promise.promise-simple .promise-word{width:calc(100% - 24px);gap:3px;padding:22px 0;font-size:clamp(11px,3.45vw,18px);letter-spacing:-.03em}
}


/* Mobile navigation beneath logo — no global typography / spacing compression */
.mobile-quick-nav{display:none}
@media(max-width:767px){
 html{scroll-padding-top:125px}
 .nav{height:53px!important;padding:7px 13px!important;background:rgba(5,5,5,.97)!important}
 .nav .brand .logo-mark{width:122px!important}
 .nav .menu-btn{display:inline-flex;align-items:center;justify-content:center;min-width:68px;padding:7px 10px;font-size:10px;letter-spacing:.09em}
 .mobile-quick-nav{position:fixed;z-index:895;left:0;right:0;top:53px!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,auto);min-height:58px;padding:7px 9px 8px!important;gap:0 3px;background:rgba(5,5,5,.97);border-bottom:1px solid var(--line)}
 .mobile-quick-nav a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:22px;padding:4px 2px!important;font:600 clamp(8px,2.13vw,10px)/1.15 Inter,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.015em;color:#e2ded8;white-space:normal}
 .mobile-panel{padding-top:123px!important}
 .hero{padding-top:123px!important;padding-bottom:19px!important;min-height:0!important}
 .hero-collage{margin-bottom:10px!important}
 .hero-slider-controls{min-height:31px!important;margin-bottom:3px!important}
 .hero .eyebrow{font-size:8px!important;margin-bottom:7px!important}
 .hero h1{font-size:clamp(40px,12vw,62px)!important}
 .hero-inner{gap:10px!important}
 .hero-side{padding-top:10px!important}
 .hero-side p{font-size:12px!important;line-height:1.42!important;margin-bottom:10px!important}
 .hero-actions{gap:7px}
 .hero-actions .btn{padding:9px 11px!important}
}
/* Header CTA moved inside the shared navigation menu; desktop header slot is MENU. */
.desktop-menu-btn{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid rgba(153,178,172,.7);padding:12px 16px;background:transparent;color:var(--paper);font:600 11px/1.2 Inter,system-ui,sans-serif;letter-spacing:.09em;transition:background .2s,border-color .2s}
.desktop-menu-btn:hover,.desktop-menu-btn[aria-expanded="true"]{background:rgba(153,178,172,.12);border-color:var(--sage)}
@media(max-width:1023px){.desktop-menu-btn{display:none}}
@media(min-width:1024px){
  .mobile-panel{display:flex;position:fixed;inset:auto 28px auto auto;top:75px;z-index:920;width:min(350px,calc(100vw - 56px));max-height:calc(100dvh - 90px);overflow-y:auto;padding:24px;background:rgba(5,5,5,.98);border:1px solid rgba(153,178,172,.35);flex-direction:column;gap:13px;box-shadow:0 18px 48px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility 0s linear .2s}
  .mobile-panel.open{opacity:1;visibility:visible;transform:none;transition:opacity .2s,transform .2s}
  .mobile-panel>a{font-size:17px;text-transform:uppercase;letter-spacing:.06em}
  .mobile-panel .mp-label{font-size:15px;text-transform:uppercase;letter-spacing:.06em}
  .mobile-panel .mp-sub{display:flex;flex-wrap:wrap;gap:8px 15px;margin-top:10px}
  .mobile-panel .mp-sub a{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
  .mobile-panel .mp-sub .nav-sub-h{width:100%;font-size:10px;color:var(--sage);margin-top:6px}
  .mobile-panel .mobile-cta{margin-top:9px;border-top:1px solid var(--line);padding-top:18px;color:var(--rust)}
}

/* Phone process: preserve pinned nine-stage parallax, compact only its unused scroll. */
@media(max-width:767px){
 .process-gsap:not(.process-static){--jr-len:410vh!important}
 .process-gsap:not(.process-static) .process-scene h3{font-size:clamp(27px,7.4vw,37px)!important}
 .process-gsap:not(.process-static) .process-scene p{font-size:12px!important;line-height:1.37!important;margin-top:6px!important}
 .process-gsap:not(.process-static) .process-visual{top:clamp(85px,12svh,110px)!important}
 .process-gsap:not(.process-static) .process-story{top:calc(clamp(85px,12svh,110px) + (100vw - 28px)*.5625 + 12px)!important}
 .jr-eyebrow{margin-bottom:6px!important;font-size:9px!important}
 .jr-top{padding-top:53px!important}
 .jr-tabs{height:55px!important;bottom:0!important}
 .jr-bar{bottom:55px!important}
 .jr-play{bottom:64px!important}
}
@media(max-width:767px) and (max-height:680px){
 .process-gsap:not(.process-static) .process-visual{top:79px!important}
 .process-gsap:not(.process-static) .process-story{top:calc(79px + (100vw - 24px)*.5625 + 9px)!important}
}
/* Mobile quick navigation: six exact desktop items, two rows */
@media(max-width:767px){.mobile-quick-nav{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:repeat(2,auto)!important;min-height:0!important}.mobile-quick-nav a{min-width:0!important}}
/* Headline color swap: FORM is bold rust, CURATE retains outline */
.hero h1 #heroForm.rust{color:var(--rust);font-weight:700;-webkit-text-stroke:0 transparent}
.hero h1 .outline{font-weight:600}


/* Premium editorial mobile refinement — desktop and hero intentionally untouched */
@media (max-width:767px){
 /* Keep every desktop index visible beneath the logo in two balanced rows */
 .mobile-quick-nav{padding:8px 12px 9px!important;column-gap:6px!important;row-gap:3px!important;min-height:61px!important}
 .mobile-quick-nav a{min-height:24px!important;padding:4px 1px!important;letter-spacing:.025em!important;font-size:clamp(8px,2.22vw,10px)!important;line-height:1.25!important}
 .mobile-quick-nav a:focus-visible{outline-offset:-2px}
 /* One consistent reading rhythm after the existing hero and walkthrough */
 .section{padding:clamp(48px,12vw,64px) 19px!important}
 .section-head{gap:12px!important;margin-bottom:25px!important}
 .section .index{font-size:10px;letter-spacing:.11em}
 .section .kicker{font-size:10px!important;margin-bottom:10px!important;letter-spacing:.125em}
 .section h2{font-size:clamp(28px,7.75vw,35px)!important;line-height:1.08!important;letter-spacing:-.035em!important;max-width:26ch}
 .section .lead{font-size:14px!important;line-height:1.55!important;margin-top:13px!important}
 /* Services: condensed previews with explicit, accessible expandable descriptions */
 .services .section-head{margin-bottom:20px!important}
 .services .section-head .lead{display:none}
 .services .service-stack{display:grid!important;gap:8px!important}
 .services .service-card{position:relative!important;top:auto!important;min-height:0!important;padding:17px 16px!important;gap:11px!important;grid-template-columns:26px minmax(0,1fr) 20px!important;box-shadow:none!important;border-radius:0!important;align-items:start}
 .services .service-card h3{font-size:clamp(18px,4.65vw,21px)!important;line-height:1.18!important;margin:0 0 6px!important;letter-spacing:-.02em}
 .services .service-card p{font-size:12px!important;line-height:1.48!important;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
 .services .service-card.is-expanded p{-webkit-line-clamp:unset;line-clamp:unset;display:block}
 .services .service-card .service-no{font-size:11px!important}
 .services .service-card .service-arrow{font-size:19px!important}
 .services .service-more{display:block;appearance:none;background:none;border:0;border-bottom:1px solid currentColor;padding:5px 0 1px;margin-top:5px;color:inherit;font-size:10px;letter-spacing:.045em;cursor:pointer}
 /* Execution typologies: photo-led without extra vertical bulk */
 .expertise-mobile-photo{display:block;margin:0 0 15px;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--line)}
 .expertise-mobile-photo img{width:100%;height:100%;object-fit:cover;display:block}
 .expertise-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .expertise-item{min-height:92px!important;padding:13px 11px!important;gap:12px!important}
 .expertise-item strong{font-size:13px!important;line-height:1.35!important}
 /* Offering categories: photographic but compact rows */
 .categories .cat-row{padding:0 14px!important;grid-template-columns:27px minmax(0,1fr) 22px!important;min-height:102px!important;position:relative;isolation:isolate;overflow:hidden;gap:8px!important;color:#f3efe8}
 .categories .cat-row::before{content:"";position:absolute;inset:0;z-index:-2;background-position:center;background-size:cover;opacity:.58;filter:saturate(.55)}
 .categories .cat-row:nth-of-type(1)::before{background-image:url('hero/03-wardrobe.jpg')}
 .categories .cat-row:nth-of-type(2)::before{background-image:url('hero/04-living.jpg')}
 .categories .cat-row:nth-of-type(3)::before{background-image:url('hero/01-kitchen.jpg')}
 .categories .cat-row::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,5,5,.88),rgba(5,5,5,.25))}
 .categories .cat-row .name{font-size:clamp(24px,7vw,30px)!important;letter-spacing:-.025em}
 .categories .cat-row .n{font-size:10px!important}.categories .cat-row .plus{font-size:20px!important}
 /* Keep final conversion straightforward; retain form and contact methods */
 .contact .section-head{margin-bottom:18px!important}
 .contact .section-head .muted{display:none!important}
 .contact .section-head .lead{display:none!important}
 .contact .contact-lead{margin-bottom:22px!important}
 .contact .contact-lead .kicker,.contact .contact-lead>p{display:none!important}
 .contact .contact-lead h2{font-size:clamp(29px,7.9vw,36px)!important;line-height:1.08!important;margin:0!important}
 .contact .contact-grid{gap:15px!important}
 .contact .panel-head{font-size:15px!important}
 /* Remove visual breathing room, but keep sticky stage transforms and nine-stage JS intact */
 .process-gsap:not(.process-static) .process-visual{top:clamp(80px,11svh,103px)!important}
 .process-gsap:not(.process-static) .process-story{top:calc(clamp(80px,11svh,103px) + (100vw - 28px)*.5625 + 9px)!important}
 .process-gsap:not(.process-static) .process-scene{padding-left:15px!important;padding-right:15px!important}
 .process-gsap:not(.process-static) .process-scene p{max-width:42ch!important}
}
@media(max-width:767px) and (max-height:680px){
 .process-gsap:not(.process-static) .process-visual{top:76px!important}
 .process-gsap:not(.process-static) .process-story{top:calc(76px + (100vw - 24px)*.5625 + 8px)!important}
}
@media(min-width:768px){.expertise-mobile-photo{display:none}.services .service-more{display:none}}

/* Reference-matched compact editorial journey — mobile ONLY.
   Keeps original 9-stage scroll-driven parallax and JS unchanged. */
@media (max-width:767px) and (min-height:420px){
  .process-gsap:not(.process-static){--jr-bg:#1d221e}
  .process-gsap:not(.process-static) .process-shell{background:var(--jr-bg)}
  .process-gsap:not(.process-static) .jr-top{display:none!important}
  .process-gsap:not(.process-static) .process-story{
    position:absolute!important;inset:0!important;top:0!important;bottom:0!important;
    width:100%!important;max-width:none!important;padding:0!important;pointer-events:none;z-index:3
  }
  .process-gsap:not(.process-static) .process-scene{
    position:absolute!important;inset:0!important;top:0!important;bottom:0!important;
    height:100%!important;padding:0!important;
  }
  .process-gsap:not(.process-static) .jr-eyebrow{display:none!important}
  .process-gsap:not(.process-static) .jr-head{
    position:absolute;left:clamp(18px,6vw,28px);right:12px;top:clamp(17px,3.5svh,29px);
    display:flex;align-items:baseline;gap:clamp(15px,5vw,26px);
  }
  .process-gsap:not(.process-static) .jr-num{width:23px;font-size:12px;letter-spacing:.07em}
  .process-gsap:not(.process-static) .process-scene h3{
    font-size:clamp(28px,8vw,38px)!important;font-weight:400!important;line-height:1.15!important;
    letter-spacing:-.035em!important;white-space:nowrap;
  }
  .process-gsap:not(.process-static) .process-visual{
    position:absolute!important;top:clamp(68px,10.4svh,88px)!important;
    left:clamp(13px,4.5vw,25px)!important;right:clamp(13px,4.5vw,25px)!important;
    width:auto!important;height:auto!important;aspect-ratio:16/9!important;
    border:1px solid rgba(226,217,195,.17)!important;overflow:hidden;
  }
  .process-gsap:not(.process-static) .pshot img{object-fit:cover!important;object-position:center!important}
  .process-gsap:not(.process-static) .process-scene p{
    position:absolute!important;top:calc(clamp(68px,10.4svh,88px) + (100vw - clamp(26px,9vw,50px))* .5625 + 15px)!important;
    left:clamp(18px,6vw,28px)!important;right:122px!important;bottom:auto!important;
    max-width:none!important;margin:0!important;font-size:clamp(11px,2.9vw,13px)!important;
    line-height:1.47!important;color:rgba(239,236,230,.78);text-shadow:none!important;
  }
  .process-gsap:not(.process-static) .jr-play{
    top:calc(clamp(68px,10.4svh,88px) + (100vw - clamp(26px,9vw,50px))* .5625 + 19px)!important;
    right:clamp(18px,6vw,28px)!important;bottom:auto!important;
    font-size:11px!important;white-space:nowrap;gap:6px;padding:5px 0;
  }
  .process-gsap:not(.process-static) .jr-tabs{
    left:clamp(18px,6vw,28px)!important;right:clamp(18px,6vw,28px)!important;
    bottom:clamp(20px,3.7svh,35px)!important;height:20px!important;border:0!important;
  }
  .process-gsap:not(.process-static) .jr-tab{
    padding:9px 0 0 2px!important;border-top:1px solid rgba(233,228,218,.13);
    align-items:flex-start;justify-content:flex-start;
  }
  .process-gsap:not(.process-static) .jr-tab-n{font-size:8px!important;letter-spacing:.04em}
  .process-gsap:not(.process-static) .jr-bar{
    left:clamp(18px,6vw,28px)!important;right:clamp(18px,6vw,28px)!important;
    bottom:calc(clamp(20px,3.7svh,35px) + 20px)!important;height:2px!important;
  }
}
@media (max-width:767px) and (max-height:600px) and (min-height:420px){
  .process-gsap:not(.process-static) .jr-head{top:12px}
  .process-gsap:not(.process-static) .process-visual{top:59px!important}
  .process-gsap:not(.process-static) .process-scene p{top:calc(59px + (100vw - clamp(26px,9vw,50px))*.5625 + 9px)!important}
  .process-gsap:not(.process-static) .jr-play{top:calc(59px + (100vw - clamp(26px,9vw,50px))*.5625 + 13px)!important}
  .process-gsap:not(.process-static) .jr-tabs{bottom:12px!important}
  .process-gsap:not(.process-static) .jr-bar{bottom:32px!important}
}

/* Compact mobile journey: parallax starts at the card; no full-height green slab. */
@media (max-width:767px) and (min-height:420px){
 .process-gsap:not(.process-static){
   --jr-len:315svh!important; background:#090b0a!important;
 }
 .process-gsap:not(.process-static) .process-shell{
   position:sticky!important;top:0!important;
   height:calc(clamp(68px,10.4svh,88px) + (100vw - clamp(26px,9vw,50px)) * .5625 + 104px)!important;
   min-height:0!important;max-height:calc(100svh - 12px)!important;
   border-radius:0 0 7px 7px;overflow:hidden!important;
 }
 .process-gsap:not(.process-static) .jr-tabs{
   top:calc(clamp(68px,10.4svh,88px) + (100vw - clamp(26px,9vw,50px)) * .5625 + 73px)!important;
   bottom:auto!important;
 }
 .process-gsap:not(.process-static) .jr-bar{
   top:calc(clamp(68px,10.4svh,88px) + (100vw - clamp(26px,9vw,50px)) * .5625 + 67px)!important;
   bottom:auto!important;
 }
}
@media (max-width:767px) and (max-height:600px) and (min-height:420px){
 .process-gsap:not(.process-static) .process-shell{
   height:calc(59px + (100vw - clamp(26px,9vw,50px)) * .5625 + 100px)!important;
 }
 .process-gsap:not(.process-static) .jr-tabs{top:calc(59px + (100vw - clamp(26px,9vw,50px))*.5625 + 71px)!important}
 .process-gsap:not(.process-static) .jr-bar{top:calc(59px + (100vw - clamp(26px,9vw,50px))*.5625 + 65px)!important}
}

/* 2026-10: Mobile journey continuity fix. Keep the photo card pinned while
   scrolling, and paint its scroll runway the same colour as the card instead
   of exposing the empty black page background. No desktop changes. */
@media (max-width:767px) and (min-height:420px){
  .process-gsap:not(.process-static){
    --jr-len:285svh!important;
    background:var(--jr-bg,#1d221e)!important;
    margin:0!important;padding:0!important;
    border:0!important;
  }
  .process-gsap:not(.process-static) .process-shell{
    top:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .process-gsap:not(.process-static) + .philosophy{
    margin-top:0!important;
    border-top:0!important;
  }
}

/* Mobile: compact journey owns only its actual card height. Scroll input
   advances the existing nine-stage crossfade instead of reserving a black viewport. */
@media (max-width:767px) and (min-height:420px) {
  .process-gsap:not(.process-static) {
    height:auto!important;min-height:0!important;background:var(--jr-bg)!important;
    margin:0!important;padding:0!important;overflow:visible!important;
  }
  .process-gsap:not(.process-static) .process-shell {
    position:relative!important;top:auto!important;margin:0!important;
    width:100%!important;max-height:none!important;
    border-radius:0!important;
  }
  .process-gsap + .philosophy {margin-top:0!important;}
}

/* MOBILE FINAL POLISH — no desktop styling affected */
@media (max-width:767px) and (min-height:420px){
 /* Consultation panel stays flush below two fixed nav rows while active. */
 .process-gsap:not(.process-static){scroll-margin-top:119px!important;}
 .process-gsap:not(.process-static) .process-shell{scroll-margin-top:119px!important;}
 /* SYSTEM 01: panoramic, horizontal three-part editorial ribbon. */
 .philosophy .bfc{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0!important;margin-top:20px!important;}
 .philosophy .bfc-card{min-height:136px!important;padding:13px 9px!important;display:flex!important;justify-content:space-between!important;gap:12px!important;}
 .philosophy .bfc-chip{height:auto!important;width:auto!important;border:0!important;display:block!important;font-size:10px!important;}
 .philosophy .bfc-card .big{font-size:clamp(18px,5.8vw,27px)!important;letter-spacing:-.05em!important;line-height:1!important;overflow-wrap:normal!important;}
 .philosophy .bfc-card p{font-size:10px!important;line-height:1.38!important;margin:8px 0 0!important;}
 /* Give all four sustainability values intentionally balanced colour. */
 .sustain-modules{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}
 .sustain-modules .s-box{min-height:130px!important;padding:14px!important;color:var(--ink)!important;}
 .sustain-modules .s-box:nth-child(2){background:#c4d1c8!important;}
 .sustain-modules .s-box:nth-child(3){background:#c8a99b!important;}
 .sustain-modules .s-box strong{font-size:clamp(13px,3.7vw,16px)!important;line-height:1.3!important;}
 .sustain-modules .tree{grid-column:1 / -1!important;}
 /* WHY MODULARLABS: remove tall empty cards and excess section whitespace. */
 .reasons{padding-top:44px!important;padding-bottom:44px!important;}
 .reasons .section-head{margin-bottom:22px!important;}
 .reasons-grid{grid-template-columns:1fr!important;}
 .reasons .reason{min-height:0!important;padding:16px 18px!important;gap:8px!important;}
 .reasons .reason strong{font-size:18px!important;}
 .reasons .reason p{font-size:12px!important;line-height:1.45!important;margin:4px 0 0!important;}
}

/* Mobile two-row navigation: dropdown subheadings match the desktop menu */
@media(max-width:767px){
 .mobile-quick-nav{overflow:visible!important}
 .mobile-quick-nav .quick-group{position:relative;min-width:0;display:flex;align-items:stretch;justify-content:stretch}
 .mobile-quick-nav .quick-trigger{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;min-height:24px;padding:4px 1px;border:0;background:none;color:#e2ded8;font:600 clamp(8px,2.22vw,10px)/1.25 Inter,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.025em;text-align:center;cursor:pointer}
 .mobile-quick-nav .quick-trigger span{color:#b09a8e;font-size:13px;line-height:1;transition:transform .18s ease}
 .mobile-quick-nav .quick-trigger[aria-expanded="true"] span{transform:rotate(180deg)}
 .mobile-quick-nav .quick-submenu{display:none;position:absolute;top:calc(100% + 9px);left:0;width:max-content;min-width:185px;max-width:min(85vw,290px);max-height:min(65vh,420px);overflow-y:auto;overscroll-behavior:contain;padding:12px 11px;background:#171a18;border:1px solid #5a5149;box-shadow:0 12px 32px #000b;z-index:1300}
 .mobile-quick-nav .quick-group:nth-child(5) .quick-submenu{left:auto;right:0}
 .mobile-quick-nav .quick-trigger[aria-expanded="true"]+.quick-submenu{display:flex;flex-direction:column;align-items:stretch;gap:1px}
 .mobile-quick-nav .quick-submenu a{justify-content:flex-start!important;text-align:left!important;text-transform:none!important;font-size:12px!important;font-weight:500!important;letter-spacing:.015em!important;min-height:33px!important;padding:8px 10px!important;white-space:nowrap!important}
 .mobile-quick-nav .quick-submenu a:active,.mobile-quick-nav .quick-submenu a:focus-visible{background:#302f2b;color:#fff}
 .mobile-quick-nav .quick-subhead{padding:12px 10px 4px;color:#a9a49c;font:700 9px/1.3 Inter,system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase}
 .mobile-quick-nav .quick-subhead:first-child{padding-top:4px}
}

/* iOS Chrome / Safari: restore TRUE pinned parallax, never stacked cards.
   Native document scroll drives all nine frames; no gesture hijacking. */
@media (max-width:767px) and (min-height:420px) {
  .process-gsap:not(.process-static) {
    height:375svh!important;
    min-height:375svh!important;
    background:#1d221e!important;
    overflow:clip!important;
    position:relative!important;
  }
  .process-gsap:not(.process-static) .process-shell {
    position:-webkit-sticky!important;
    position:sticky!important;
    top:var(--journey-nav-offset,119px)!important;
    height:calc(clamp(68px,10.4svh,88px) + (100vw - clamp(26px,9vw,50px)) * .5625 + 104px)!important;
    min-height:0!important;
    max-height:calc(100svh - var(--journey-nav-offset,119px) - 8px)!important;
    width:100%!important;
    margin:0!important;
    transform:none!important;
    overflow:hidden!important;
    background:var(--jr-bg,#1d221e)!important;
  }
  .process-gsap:not(.process-static) .process-story,
  .process-gsap:not(.process-static) .process-scene {position:absolute!important}
  .process-gsap:not(.process-static) .process-visual {position:absolute!important}
  .process-gsap:not(.process-static) .pshot {position:absolute!important;inset:0!important}
}


/* ---- Oct 2026: Stage 09 handover colour options ---- */
.process-gsap .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.process-gsap .jr-variants{position:absolute;z-index:7;left:50%;bottom:132px;transform:translateX(-50%);display:flex;gap:10px;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(10,12,10,.42);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(239,236,230,.16);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s ease,transform .24s ease,visibility .24s}
.process-gsap[data-active-step="8"] .jr-variants{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.process-gsap .jr-swatch{width:16px;height:16px;border-radius:50%;padding:0;border:1.5px solid rgba(255,255,255,.45);background:var(--sw);box-shadow:0 0 0 0 rgba(217,199,169,.26);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.process-gsap .jr-swatch:hover,.process-gsap .jr-swatch.is-active{transform:scale(1.12);border-color:#efece6;box-shadow:0 0 0 4px rgba(217,199,169,.22)}
.process-gsap .jr-swatch[style*="#efebe2"].is-active,.process-gsap .jr-swatch[style*="#efebe2"]:hover{border-color:#b8aa95}
.handover-gallery{padding:92px 0 34px;background:#0e120f;border-top:1px solid rgba(233,228,218,.08)}
.handover-gallery .section-head{margin-bottom:34px}
.handover-gallery .index{color:var(--rust)}
.handover-gallery .kicker{color:rgba(239,236,230,.62)}
.handover-gallery h2{color:#efece6}
.handover-gallery .lead{color:rgba(239,236,230,.68);max-width:52ch;margin:12px 0 0}
.handover-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.handover-card{background:#161b17;border:1px solid rgba(239,236,230,.1);overflow:hidden}
.handover-card figure{margin:0;aspect-ratio:16/9;position:relative;overflow:hidden;background:#121713}
.handover-card img{width:100%;height:100%;display:block;object-fit:cover}
.handover-copy{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 18px 18px;color:#efece6}
.handover-copy strong{font-size:15px;letter-spacing:.01em}
.handover-copy p{width:100%;margin:2px 0 0;color:rgba(239,236,230,.64);font-size:13px;line-height:1.45}
.tone-dot{width:14px;height:14px;border-radius:50%;background:var(--dot);border:1px solid rgba(255,255,255,.42);display:inline-block;box-shadow:0 0 0 4px rgba(255,255,255,.03)}
.handover-card.is-highlight{border-color:rgba(217,199,169,.42);box-shadow:0 0 0 1px rgba(217,199,169,.16) inset}
@media (max-width: 1024px){
  .handover-grid{grid-template-columns:1fr;gap:18px}
}
@media (max-width: 767px){
  .process-gsap .jr-variants{bottom:90px;padding:7px 10px;gap:8px}
  .process-gsap .jr-swatch{width:14px;height:14px}
  .handover-gallery{padding:58px 0 24px}
  .handover-gallery .section-head{margin-bottom:22px}
  .handover-copy{padding:14px 14px 16px}
  .handover-copy strong{font-size:14px}
  .handover-copy p{font-size:12px}
}

/* Colour outputs are part of the pinned journey, after stage 09. */
.process-gsap.show-final-swatches .jr-variants{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateX(-50%) translateY(0)!important}
.process-gsap:not(.show-final-swatches) .jr-variants{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.process-gsap.show-final-swatches .jr-variants{bottom:136px}
@media(max-width:767px){.process-gsap.show-final-swatches .jr-variants{bottom:88px}}


/* Oct 2026 refinement — process timing + final colour phase */
.process-gsap.after-handover .jr-tabs,
.process-gsap.after-handover .jr-bar{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:opacity .22s ease,visibility .22s ease}
.process-gsap:not(.after-handover) .jr-tabs,
.process-gsap:not(.after-handover) .jr-bar{opacity:1;visibility:visible}
.process-gsap[data-active-step="8"] .jr-variants{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateX(-50%) translateY(6px)!important}
.process-gsap.show-final-swatches .jr-variants{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateX(-50%) translateY(0)!important}

/* Smooth cinematic crossfades in the pinned kitchen journey. */
.process-gsap:not(.process-static) .pshot {backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(0);-webkit-transform:translateZ(0);}
.process-gsap:not(.process-static) .pshot img {backface-visibility:hidden;-webkit-backface-visibility:hidden;}

/* Final navigation and precise editorial grid refinements */
.start-project-nav{display:inline-flex!important;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none;font:600 10px/1.2 Inter,system-ui,sans-serif;letter-spacing:.05em;background:transparent;border:1px solid rgba(153,178,172,.65);padding:11px 13px;color:#efece6}
.start-project-nav:hover{background:rgba(153,178,172,.15)}
.menu-btn.start-project-nav{display:none!important}
@media(max-width:1023px){.menu-btn.start-project-nav{display:inline-flex!important;padding:9px 10px;font-size:9px}.desktop-menu-btn.start-project-nav{display:none!important}}
.bfc{grid-template-columns:repeat(3,minmax(0,1fr))}
.bfc-card{min-width:0}
.bfc-card .big{font-size:clamp(42px,6.5vw,105px);letter-spacing:-.06em;line-height:1;white-space:nowrap}
.bfc-card p{margin:16px 0 0}
@media(max-width:1023px){.bfc-card .big{font-size:clamp(35px,7.5vw,70px)}}
@media(max-width:620px){.bfc{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;margin-top:20px}.bfc-card{padding:13px 8px!important;min-height:155px!important;border-bottom:0!important;border-right:1px solid rgba(5,5,5,.14)!important}.bfc-card:last-child{border-right:0!important}.bfc-card .big{font-size:clamp(20px,6.1vw,31px)!important;letter-spacing:-.055em!important;white-space:nowrap;line-height:1.08}.bfc-chip{width:30px;height:30px;font-size:10px}.bfc-card p{font-size:10px;line-height:1.45;margin-top:10px}}
.section-head>*{min-width:0}.section-head h2{overflow-wrap:break-word;text-wrap:balance}.wrap{min-width:0}
.project-card-link{display:block;color:inherit;text-decoration:none;height:100%}.project-card-link:hover .project-media img{transform:scale(1.035)}
.project-detail-page{background:#eeeae2;color:#171a16}.pd-intro{padding:158px 0 40px}.pd-heading{display:grid;grid-template-columns:1.15fr .85fr;align-items:end;gap:24px;padding-top:22px}.pd-heading h1{font:400 clamp(44px,6vw,88px)/1.05 'Playfair Display',Georgia,serif;letter-spacing:-.04em;margin:15px 0 0}.pd-heading p{font-size:15px;line-height:1.65;max-width:420px;color:#555b55;margin:0}
.pd-cover{margin:0;aspect-ratio:16/9;overflow:hidden;background:#cbc6b9}.pd-cover img,.pd-photo img{width:100%;height:100%;object-fit:cover;display:block}.pd-gallery-label{display:flex;justify-content:space-between;padding:16px 0 26px;font-size:10px;letter-spacing:.17em;color:#6d746a;border-bottom:1px solid #c7c6bc}
.pd-photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:26px 0 76px}.pd-photo{margin:0;min-width:0}.pd-photo img{aspect-ratio:16/9;background:#bcbab0}.pd-photo figcaption{font-size:12px;color:#5b625b;line-height:1.4;padding:12px 0}.pd-contact{background:#101714;color:#eeeae2;padding:54px 0}.pd-contact .wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}.pd-contact h2{font:400 clamp(30px,4vw,55px)/1.13 'Playfair Display',Georgia,serif;margin:12px 0 0}
@media(max-width:767px){.pd-intro{padding:166px 0 24px}.pd-heading{grid-template-columns:1fr;gap:16px}.pd-heading h1{font-size:clamp(35px,9vw,52px)}.pd-heading p{font-size:13px}.pd-photo-grid{grid-template-columns:1fr;gap:14px;padding:18px 0 40px}.pd-gallery-label{padding:12px 0 16px}.pd-contact{padding:32px 0}.pd-contact .wrap{flex-direction:column;align-items:flex-start;gap:18px}}

/* Custom logo, focused enquiry links and simplified finished-project cards */
.logo-mark{aspect-ratio:5.11854!important}
.brand .logo-mark{width:clamp(136px,14vw,190px)!important}
.footer-logo{width:min(250px,70vw)!important}
#enquiry-form{scroll-margin-top:150px}
.project-body{padding:19px 20px 22px}
.project-body .project-meta{margin-bottom:7px}
.project-body h3{margin:0}
@media(max-width:767px){#enquiry-form{scroll-margin-top:125px}}

/* October 2026: compact project display and reliable navigation */
:root{--logo:url("logo-header.png")}
.logo-mark{aspect-ratio:1734/399!important;background-size:contain!important}
.projects.page-body{padding-top:34px!important}
.projects .wrap{max-width:1240px}
.projects .project-grid{gap:26px!important;align-items:stretch}
.projects .project-card{border:1px solid rgba(9,15,13,.12);background:#f4f1eb;overflow:hidden;border-radius:4px;transition:box-shadow .25s ease,transform .25s ease}
.projects .project-card:hover{box-shadow:0 12px 34px rgba(0,0,0,.1);transform:translateY(-3px)}
.projects .project-card-link{padding:13px;display:flex;flex-direction:column;height:100%}
.projects .project-media{aspect-ratio:16/10;border-radius:2px;overflow:hidden}
.projects .project-body{padding:19px 4px 8px!important;display:flex;flex-direction:column;gap:6px!important}
.projects .project-body .project-meta{margin:0!important;font-size:11px;text-transform:uppercase;letter-spacing:.13em}
.projects .project-body h3{font-size:clamp(22px,2.3vw,31px);line-height:1.16}
.projects .page-hero{padding-bottom:28px!important}
.page-hero:has(+ .projects.page-body){padding-bottom:28px!important}
.page-hero:has(+ .projects.page-body) h1{margin-bottom:0!important}
.pd-intro{padding-top:clamp(115px,11vw,155px)!important;padding-bottom:24px!important}
.pd-heading{display:block!important;padding-top:8px!important}
.pd-heading h1{margin-top:8px!important}
.pd-navigation{margin:2px 0 16px}
.pd-back{font-size:12px;text-decoration:none;color:inherit;letter-spacing:.02em;border-bottom:1px solid currentColor;padding-bottom:4px}
.pd-back:hover{opacity:.6}
.pd-gallery .wrap{max-width:1240px}
.pd-photo-grid{gap:18px!important;padding-top:20px!important;padding-bottom:42px!important}
.pd-switcher{padding:52px 0 65px;background:#e3dfd6;color:#182019}
.pd-switch-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:25px}
.pd-switch-head h2{font:400 clamp(26px,3.3vw,42px)/1.12 'Playfair Display',Georgia,serif;margin:0}
.pd-switch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pd-switch-link{display:grid;grid-template-columns:1fr auto;gap:6px 14px;color:inherit;text-decoration:none;padding:18px;background:#f7f4ee;border:1px solid #d4d0c7}
.pd-switch-type{grid-column:1/-1;text-transform:uppercase;letter-spacing:.14em;font-size:10px;color:#6d746a}
.pd-switch-link strong{font-size:16px;font-weight:600}
.pd-switch-link:hover{border-color:#6d746a;background:#fff}
@media(max-width:767px){.projects .project-grid{gap:16px!important}.projects .project-card-link{padding:10px}.projects.page-body{padding-top:18px!important}.pd-intro{padding-bottom:16px!important}.pd-switch-grid{grid-template-columns:1fr}.pd-switcher{padding:35px 0 46px}.pd-switch-head{align-items:flex-start;flex-direction:column}.pd-photo-grid{gap:12px!important}}

/* Global inset refinement so borders and section frames do not touch viewport edges */
.projects .wrap,.pd-gallery .wrap,.pd-contact .wrap{padding-inline:clamp(16px,4vw,28px)}
@media(max-width:767px){.wrap,.projects .wrap,.pd-gallery .wrap,.pd-contact .wrap{padding-inline:16px!important}}

/* The promise statement: SAVE above the three equally-spaced benefits. */
.promise.promise-simple .promise-message{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}
.promise.promise-simple .promise-save{font:700 clamp(13px,1.7vw,21px)/1.2 Inter,system-ui,sans-serif;letter-spacing:.26em;color:var(--paper);text-align:center;padding:20px 0 0}
.promise.promise-simple .promise-word{padding-top:12px!important}
/* Anchor the project CTA at the enquiry form itself, below the fixed navigation. */
#leadForm{position:relative}
#enquiry-form.enquiry-target{display:block;position:absolute;top:0;left:0;height:0;width:0;scroll-margin-top:155px}
@media(max-width:767px){.promise.promise-simple .promise-save{font-size:13px;padding-top:14px}.promise.promise-simple .promise-word{padding-top:9px!important}#enquiry-form.enquiry-target{scroll-margin-top:125px}}

/* Oct 10 refinement: prominent SAVE and precisely aligned three pillars */
.promise.promise-simple .promise-save{
  font-size:clamp(38px,7.6vw,112px)!important;
  font-weight:750!important;
  line-height:1!important;
  letter-spacing:.045em!important;
  padding:12px 0 0!important;
}
.promise.promise-simple .promise-word{padding-top:8px!important}
.philosophy .bfc{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0!important}
.philosophy .bfc-card{min-width:0!important;display:grid!important;grid-template-rows:76px 1fr!important;align-content:stretch!important;justify-content:stretch!important;gap:20px!important}
.philosophy .bfc-card>div:last-child{width:100%!important;min-width:0!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important}
.philosophy .bfc-card .big{display:flex!important;align-items:center!important;justify-content:center!important;min-height:1.3em!important;width:100%!important;text-align:center!important;font-size:clamp(38px,5vw,76px)!important;letter-spacing:-.055em!important;line-height:1.12!important;white-space:nowrap!important}
.philosophy .bfc-card p{margin-top:20px!important}
@media(max-width:1023px){
  .philosophy .bfc-card{grid-template-rows:50px 1fr!important;gap:10px!important}
  .philosophy .bfc-card .big{font-size:clamp(26px,4.8vw,48px)!important}
}
@media(max-width:620px){
  .promise.promise-simple .promise-save{font-size:clamp(37px,11vw,62px)!important;padding-top:10px!important}
  .promise.promise-simple .promise-word{padding-top:6px!important}
  .philosophy .bfc-card{grid-template-rows:30px 1fr!important;gap:7px!important;padding:13px 7px!important;min-height:155px!important}
  .philosophy .bfc-card .big{font-size:clamp(18px,5.1vw,30px)!important;min-height:1.35em!important;letter-spacing:-.055em!important}
  .philosophy .bfc-card p{margin-top:9px!important}
}

/* White visibility backing for the official Modularlabs logo */
.nav .brand{background:#fff!important;border-radius:3px;padding:8px 12px!important;flex-shrink:0;box-shadow:0 2px 12px rgba(0,0,0,.10)}
.footer .footer-logo{background-color:#fff!important;background-size:calc(100% - 24px) auto!important;border-radius:3px;box-shadow:0 2px 12px rgba(0,0,0,.08)}
@media(max-width:767px){.nav .brand{padding:6px 9px!important}.footer .footer-logo{background-size:calc(100% - 18px) auto!important}}

/* Full-bleed white brand bars, consistent on every page and screen size. */
.nav,.nav.scrolled{
  left:0!important;right:0!important;top:0!important;
  width:100%!important;margin:0!important;
  background:#fff!important;color:#28221f!important;
  border-radius:0!important;border-bottom:1px solid #e5e0dc!important;
  box-shadow:0 2px 12px rgba(0,0,0,.07)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.nav .brand{background:transparent!important;border-radius:0!important;padding:0!important;box-shadow:none!important}
.nav .navlinks,.nav .navlinks a,.nav .nav-drop{color:#28221f!important}
.nav .navlinks a:hover,.nav .nav-drop:hover{color:#9e4322!important}
.nav .nav-sub{background:#fff!important;color:#28221f!important;border-color:#e5e0dc!important;box-shadow:0 12px 28px rgba(0,0,0,.13)}
.nav .nav-sub a{color:#28221f!important}
.nav .start-project-nav{color:#28221f!important;border-color:#51453e!important;background:#fff!important}
.nav .start-project-nav:hover{color:#fff!important;background:#381c15!important}
.footer{background:#fff!important;color:#28221f!important;border-top:1px solid #e5e0dc!important;width:100%!important;margin:0!important;border-radius:0!important}
.footer .footer-logo{background-color:transparent!important;background-size:contain!important;border-radius:0!important;box-shadow:none!important}
.footer .footer-bottom,.footer .footer-bottom span{color:#5c544f!important}
@media(max-width:767px){
  .mobile-quick-nav{background:#fff!important;border-bottom:1px solid #e5e0dc!important}
  .mobile-quick-nav>a,.mobile-quick-nav .quick-trigger{color:#28221f!important}
  .mobile-quick-nav .quick-trigger span{color:#7b6253!important}
  .mobile-quick-nav .quick-submenu{background:#171a18!important;color:#eee!important}
  .mobile-quick-nav .quick-submenu a{color:#eee!important}
}

/* Mobile secondary navigation only: restored dark bar. Main header/footer remain white. */
@media(max-width:767px){
  .mobile-quick-nav{background:#101210!important;border-bottom:1px solid #343836!important;color:#f5f2ed!important;}
  .mobile-quick-nav>a,.mobile-quick-nav .quick-trigger{color:#f5f2ed!important;}
  .mobile-quick-nav .quick-trigger span{color:#d1bca6!important;}
}

/* Meta ad enquiry entry overlay */
html.ml-meta-locked,html.ml-meta-locked body{overflow:hidden!important}
.ml-meta-gate{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:12px;box-sizing:border-box;font-family:Inter,Arial,sans-serif}
.ml-meta-shade{position:absolute;inset:0;background:rgba(6,9,7,.79);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.ml-meta-panel{position:relative;z-index:1;width:min(520px,100%);max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box;background:#f7f6f3;color:#17201b;border:1px solid #d6d3c9;box-shadow:0 18px 70px #0008;padding:clamp(19px,4vw,34px)}
.ml-meta-head{margin-bottom:19px}.ml-meta-small{font-size:10px;font-weight:700;letter-spacing:.17em;color:#a04d34}.ml-meta-head h2{font:400 clamp(27px,6vw,40px)/1.1 'Playfair Display',Georgia,serif;margin:9px 0}.ml-meta-head p{font-size:13px;line-height:1.5;color:#515951;margin:0}
.ml-meta-fields{display:grid;gap:12px}.ml-meta-fields label{display:grid;gap:5px;font-size:11px;font-weight:650;letter-spacing:.015em;color:#27312b}.ml-meta-fields input,.ml-meta-fields select{width:100%;min-width:0;box-sizing:border-box;appearance:auto;padding:12px 11px;border:1px solid #c8cdc6;border-radius:2px;background:white;color:#19221b;font:400 14px Inter,Arial,sans-serif;min-height:43px}
.ml-meta-fields input:focus,.ml-meta-fields select:focus{outline:2px solid #9bb0a5;outline-offset:1px}.ml-meta-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-width:0}.ml-meta-submit,.ml-meta-confirm button{background:#1c2922;color:white;border:0;width:100%;padding:14px 18px;font:650 12px Inter,Arial,sans-serif;letter-spacing:.04em;cursor:pointer}.ml-meta-note{font-size:11px;line-height:1.5;color:#58615a;margin:0}
.ml-meta-confirm[hidden],.ml-meta-fields[hidden]{display:none!important}.ml-meta-confirm h3{font:400 25px 'Playfair Display',Georgia,serif;margin:8px 0}.ml-meta-confirm p{font-size:13px;line-height:1.6}.ml-meta-confirm a{display:inline-block;margin:10px 0 18px;color:#a3472c;font-size:13px;text-decoration:underline}.ml-meta-check{display:flex;gap:10px;align-items:center;font-size:13px;margin:3px 0 16px}.ml-meta-confirm button:disabled{opacity:.4;cursor:not-allowed}
@media(max-width:470px){.ml-meta-pair{grid-template-columns:1fr}.ml-meta-panel{padding:18px}.ml-meta-fields{gap:10px}}

/* Material Library landing pages */
.tree{background:linear-gradient(130deg,#174f33,#31764b)!important;border-color:rgba(128,205,144,.55)!important;color:#f8fff7!important}
.tree .circle{border-color:#e1f1d8!important;color:#e1f1d8!important}
.lib-hero{background:#131b17;color:#f4f0e7;padding:clamp(155px,14vw,200px) 0 45px}
.lib-breadcrumb,.lib-label{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:#bbbaa9}
.lib-breadcrumb a{color:inherit;text-decoration:none}.lib-breadcrumb span{margin-right:6px}
.lib-label{display:block;margin-top:40px;color:#c6ab83}.lib-hero h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(46px,7vw,90px);font-weight:400;letter-spacing:-.045em;line-height:1.03;margin:14px 0 18px}
.lib-hero p{font-size:clamp(15px,1.5vw,19px);line-height:1.6;max-width:680px;color:#c9ccc4}.lib-switch{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.lib-switch a{border:1px solid #57635a;padding:12px 18px;font-size:12px;text-decoration:none;color:#f4f0e7}.lib-switch a[aria-current=page]{background:#e6e3d7;color:#182019}
.lib-section{background:#e9e7de;padding:44px 0 90px}.lib-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.lib-card{display:block;color:#151b18;text-decoration:none;background:#fff;border:1px solid #d0d2c9;overflow:hidden}.lib-card-image{aspect-ratio:4/3;overflow:hidden;background:#d4d6ce}.lib-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}.lib-card:hover img{transform:scale(1.03)}.lib-card-caption{padding:20px}.lib-card-caption span{font-size:10px;color:#657267;letter-spacing:.13em}.lib-card-caption h2{font-size:clamp(23px,2.5vw,34px);margin:8px 0;font-weight:500;display:flex;justify-content:space-between;align-items:center}.lib-card-caption h2 b{font-size:22px;font-weight:400}.lib-card-caption p{font-size:13px;color:#586159;line-height:1.55;margin:0}.lib-cta{padding:44px 0;background:#131b17;color:#f4f0e7}.lib-cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}.lib-cta h2{margin:0;font-size:clamp(24px,3vw,42px);font-weight:400}.lib-cta a{padding:15px 20px;background:#d9c7a9;color:#141914;text-decoration:none;white-space:nowrap}
@media(max-width:950px){.lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.lib-hero{padding:155px 0 28px}.lib-grid{grid-template-columns:1fr;gap:16px}.lib-section{padding:24px 0 50px}.lib-cta .wrap{align-items:flex-start;flex-direction:column}.lib-label{margin-top:22px}}

/* Dismissible, delayed Meta Ads enquiry popup */
.ml-meta-panel{padding-top:clamp(34px,5vw,46px)}
.ml-meta-close{position:absolute;right:11px;top:9px;z-index:3;display:grid;place-items:center;width:36px;height:36px;background:#e6e7e0;color:#17201b;border:1px solid #c7cbc3;border-radius:50%;font-size:27px;line-height:1;cursor:pointer;transition:background .2s}
.ml-meta-close:hover,.ml-meta-close:focus-visible{background:#cfd6cd;outline:2px solid #9bb0a5;outline-offset:2px}
