:root{
  --oat:#F9F6F2; --obsidian:#100D0B; --ochre:#C58B43; --sage:#8A9A5B;
  --clay:#E8CFC5; --brown:#4B3E34; --ink:#181310;
  --fg:#181310; --fg-soft:rgba(75,62,52,.8); --hair:rgba(75,62,52,.22);
  --serif:'Cormorant Garamond',Georgia,serif; --sans:'Montserrat',Arial,sans-serif;
  --pad:clamp(1.4rem,5vw,5.5rem);
  --barbg:rgba(249,246,242,.78);
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:var(--sans);font-weight:300;color:var(--fg);background:var(--oat);
  font-size:.9375rem;line-height:1.85;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body[data-theme="echo"]{--fg:#F2ECE2;--fg-soft:rgba(242,236,226,.68);--hair:rgba(242,236,226,.16);--barbg:rgba(16,13,11,.66)}
body[data-theme="whisper"]{--fg:#2C2820;--fg-soft:rgba(70,66,52,.8);--barbg:rgba(244,243,234,.78)}
::selection{background:var(--ochre);color:#F9F6F2}
a{color:inherit;text-decoration:none}
:focus-visible{outline:1.5px solid var(--ochre);outline-offset:5px}
button{font:inherit;background:none;border:none;color:inherit;cursor:pointer}
sup{font-size:.42em;vertical-align:1em;letter-spacing:0}

/* thread field */
#field{position:fixed;top:0;left:0;right:0;bottom:0;inset:0;width:100%;height:100%;z-index:0;display:block}
#page{position:relative;z-index:1}

/* theme colour easing on content */
#page h1,#page h2,#page h3,#page h4,#page p,#page span,#page a,#page li,#page figcaption,#page em,#page b{transition:color 1s ease}
.btn,.frame,.hairbox{transition:border-color 1s ease,color 1s ease}

/* ---------- preloader ---------- */
#loader{position:fixed;top:0;left:0;right:0;bottom:0;inset:0;background:var(--obsidian);z-index:150;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem}
#loader .lthread{width:min(260px,46vw);height:1px;background:rgba(249,246,242,.16);position:relative;overflow:hidden}
#loader .lthread i{position:absolute;inset:0;background:var(--ochre);transform:scaleX(0);transform-origin:left}
#loader .lw{display:flex;overflow:hidden}
#loader .lw span{font-family:var(--serif);font-weight:500;font-size:clamp(2.1rem,7vw,3.8rem);
  letter-spacing:.18em;color:#F6F1E9;display:inline-block;transform:translateY(120%)}
#loader .lw sup{color:var(--ochre);transform:translateY(320%);display:inline-block;margin-top:1em}
#loader .lsub{font-size:.5313rem;letter-spacing:.66em;text-transform:uppercase;color:rgba(249,246,242,.5);opacity:0;padding-left:.66em}

/* ---------- top bar ---------- */
.bar{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;
  justify-content:space-between;color:var(--fg);
  background:var(--barbg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--hair);
  padding:.85rem var(--pad);
  padding-top:calc(.85rem + env(safe-area-inset-top,0px));
  padding-left:calc(var(--pad) + env(safe-area-inset-left,0px));
  padding-right:calc(var(--pad) + env(safe-area-inset-right,0px));
  transition:transform .55s cubic-bezier(.7,0,.2,1),background-color 1s ease,color 1s ease,border-color 1s ease}
.bar.hid{transform:translateY(-112%)}
.bar .brand{font-family:var(--serif);font-size:1.15rem;letter-spacing:.2em;font-weight:500}
.bar nav{display:none;gap:2.4rem}
.bar nav a{font-size:.6rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;
  padding-bottom:.35rem;position:relative}
.bar nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s cubic-bezier(.75,0,.2,1)}
.bar nav a:hover::after{transform:scaleX(1);transform-origin:left}
@media(min-width:960px){.bar nav{display:flex}}
.bar .mbtn{font-size:.6rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;
  display:flex;align-items:center;gap:.8rem}
.bar .mbtn .lines{display:inline-flex;flex-direction:column;gap:5px;width:28px}
.bar .mbtn .lines i{height:1px;background:currentColor;transition:width .45s cubic-bezier(.75,0,.2,1)}
.bar .mbtn:hover .lines i:nth-child(2){width:60%}

/* ---------- overlay menu ---------- */
#menu{position:fixed;top:0;left:0;right:0;bottom:0;inset:0;background:var(--obsidian);color:var(--oat);z-index:100;
  padding:6.5rem var(--pad) 3rem;-webkit-clip-path:inset(0 0 100% 0);clip-path:inset(0 0 100% 0);visibility:hidden;overflow:hidden}
#menu .mgrid{height:100%;display:flex;flex-direction:column;justify-content:space-between;max-width:1280px;margin:0 auto}
#menu ul{list-style:none}
#menu .big li{overflow:hidden}
#menu .big a{font-family:var(--serif);font-size:clamp(2rem,7vw,4.2rem);line-height:1.28;
  display:inline-block;padding:.12rem 0;transition:color .4s,letter-spacing .6s}
#menu .big a:hover{color:var(--ochre);letter-spacing:.02em}
#menu .big .mi{display:inline-block;transform:translateY(118%)}
#menu .mfoot{display:flex;flex-wrap:wrap;gap:1rem 3rem;font-size:.5938rem;letter-spacing:.28em;
  text-transform:uppercase;color:rgba(249,246,242,.5)}
#menuClose{position:fixed;top:1.35rem;right:var(--pad);z-index:101;color:var(--oat);
  font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;font-weight:500;opacity:0;visibility:hidden}

/* ---------- type system ---------- */
.eyebrow{font-size:.5938rem;font-weight:500;letter-spacing:.46em;text-transform:uppercase;
  color:var(--fg-soft);display:flex;align-items:center;gap:1.1rem}
.eyebrow::before{content:"";width:2.8rem;height:1px;background:var(--ochre);flex:none}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.03;letter-spacing:-.01em;color:var(--fg)}
.accent{font-style:italic;color:var(--ochre)}
.lede{max-width:56ch;color:var(--fg-soft)}
.wrap{max-width:1280px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
section{scroll-margin-top:5rem}
.rl-line{display:block;overflow:hidden}
.rl-line>span{display:block;transform:translateY(114%)}

/* ---------- hero ---------- */
.hero{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  padding:0 var(--pad) clamp(2.6rem,7vh,4.8rem)}
.hero h1{font-size:clamp(3.3rem,11.5vw,10rem);max-width:12ch;margin-top:1.7rem}
.hero .lede{margin-top:1.9rem;font-size:.9688rem}
.hero .cta-row{margin-top:2.8rem}
.hero .hint{position:absolute;right:var(--pad);bottom:2.8rem;display:none;
  align-items:center;gap:1rem;font-size:.5313rem;letter-spacing:.46em;text-transform:uppercase;color:var(--fg-soft)}
.hero .hint i{width:1px;height:56px;background:var(--hair);position:relative;overflow:hidden}
.hero .hint i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;
  background:var(--ochre);animation:drip 2.4s cubic-bezier(.75,0,.2,1) infinite}
@keyframes drip{to{top:100%}}
@media(min-width:960px){.hero .hint{display:flex}}

.cta-row{display:flex;flex-wrap:wrap;gap:1rem}
.btn{display:inline-flex;align-items:center;font-size:.6rem;font-weight:500;
  letter-spacing:.32em;text-transform:uppercase;padding:1.2rem 2rem;border:1px solid var(--fg);
  color:var(--fg);position:relative;overflow:hidden;isolation:isolate;
  transition:color .55s,letter-spacing .55s,border-color 1s}
.btn::before{content:"";position:absolute;inset:-1px;background:var(--ink);z-index:-1;
  clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%);transition:clip-path .6s cubic-bezier(.8,0,.15,1)}
.btn:hover{color:var(--oat);letter-spacing:.38em}
.btn:hover::before{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.btn.solid{background:var(--ink);color:var(--oat);border-color:var(--ink)}
.btn.solid::before{background:var(--ochre)}
.btn.solid:hover{border-color:var(--ochre)}
body[data-theme="echo"] .btn{border-color:var(--fg);color:var(--fg)}
body[data-theme="echo"] .btn::before{background:var(--ochre)}
.tlink{font-size:.6rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:.9rem;padding-bottom:.55rem;position:relative;color:var(--fg)}
.tlink::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--ochre);
  transform-origin:left;transition:transform .5s cubic-bezier(.75,0,.2,1)}
.tlink:hover::after{transform:scaleX(.4)}
.tlink .arr{transition:transform .45s}
.tlink:hover .arr{transform:translateX(8px)}

/* ---------- marquee ---------- */
.marquee{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);
  overflow:hidden;padding:1.1rem 0}
.mq-track{display:flex;width:max-content;will-change:transform}
.mq-track span{font-family:var(--serif);font-style:italic;font-size:1.08rem;color:var(--fg-soft);
  padding:0 1.7rem;white-space:nowrap;display:inline-flex;align-items:center;gap:3.4rem}
.mq-track span::after{content:"·";color:var(--ochre);font-style:normal}

/* ---------- manifesto ---------- */
.manifesto{padding:clamp(9rem,24vh,16rem) 0}
.manifesto p{font-family:var(--serif);font-size:clamp(1.65rem,4.6vw,3.4rem);line-height:1.36;
  max-width:27ch;color:var(--fg)}
.manifesto .w{opacity:.12;display:inline}
.manifesto .sig{margin-top:3rem}

/* ---------- the gathering ---------- */
.gather{height:100vh;height:100svh;display:flex;align-items:flex-end;padding:0 var(--pad) clamp(3rem,9vh,5.5rem)}
.gather .gtxt{max-width:640px}
.gather h2{font-size:clamp(2.1rem,5.6vw,4.2rem);margin-top:1.5rem}
.gather .gsub{margin-top:1.4rem;font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--fg-soft);opacity:0;transform:translateY(14px)}

/* ---------- worlds ---------- */
.world{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:clamp(5rem,12vh,8rem) var(--pad)}
.world-in{display:grid;gap:3rem;max-width:1180px;margin:0 auto;width:100%}
@media(min-width:960px){.world-in{grid-template-columns:1.05fr .95fr;gap:6rem;align-items:center}}
.world .wtag{font-size:.5313rem;font-weight:500;letter-spacing:.55em;text-transform:uppercase;color:var(--ochre)}
.world.whisper .wtag{color:var(--sage)}
.world h3{font-size:clamp(2.6rem,7vw,5.8rem);margin:1.3rem 0 1.5rem;line-height:.98}
.world .names{margin-top:2.1rem;font-family:var(--serif);font-style:italic;font-size:1.02rem;color:var(--fg-soft);line-height:2.1}
.world .names b{font-weight:500;color:var(--fg);font-style:normal}
.world .cta-row{margin-top:2.5rem}

.frame{position:relative;border:1px solid var(--hair);min-height:300px;aspect-ratio:4/5;overflow:hidden;
  display:flex;align-items:flex-end}
.frame figcaption{padding:1.1rem 1.25rem;font-size:.5625rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--fg-soft);line-height:2}
.frame .corner{position:absolute;width:16px;height:16px;border:1px solid var(--ochre);transition:width .5s,height .5s}
.frame .c1{top:-1px;left:-1px;border-right:none;border-bottom:none}
.frame .c2{bottom:-1px;right:-1px;border-left:none;border-top:none}
.frame:hover .corner{width:34px;height:34px}
.frame.wide{aspect-ratio:16/10}

/* ---------- journey ---------- */
.journey{padding:clamp(8rem,18vh,12rem) 0}
.journey-grid{display:grid;gap:3.6rem;margin-top:clamp(2.6rem,7vh,4.4rem)}
@media(min-width:960px){.journey-grid{grid-template-columns:.9fr 1.1fr;gap:6.5rem}}
.jhead h2{font-size:clamp(2.3rem,6vw,4.6rem)}
.jhead .lede{margin-top:1.7rem}
.calc{margin-top:2.3rem;border-left:1.5px solid var(--ochre);padding:.35rem 0 .35rem 1.25rem;font-size:.875rem;color:var(--fg-soft)}
.calc strong{font-family:var(--serif);font-weight:500;font-size:1.15rem;color:var(--fg);letter-spacing:.01em}
.stages{position:relative;list-style:none}
.stages::before{content:"";position:absolute;left:11px;top:8px;bottom:8px;width:1px;background:var(--hair)}
.stages .thread{position:absolute;left:11px;top:8px;width:1px;height:calc(100% - 16px);
  background:var(--ochre);transform:scaleY(0);transform-origin:top}
.stage{position:relative;padding:0 0 2.4rem 3.3rem}
.stage:last-child{padding-bottom:0}
.stage::before{content:"";position:absolute;left:7.5px;top:9px;width:8px;height:8px;border-radius:50%;
  border:1px solid var(--ochre);background:transparent;transition:background .5s}
.stage.lit::before{background:var(--ochre)}
.stage .sn{font-size:.5313rem;font-weight:500;letter-spacing:.44em;color:var(--ochre)}
.stage h4{font-family:var(--serif);font-weight:500;font-size:1.4rem;margin:.3rem 0 .3rem;color:var(--fg)}
.stage p{font-size:.8438rem;max-width:52ch;color:var(--fg-soft)}

/* ---------- woman of class ---------- */
.woc{padding:clamp(9rem,22vh,15rem) 0;text-align:center}
.woc .eyebrow{justify-content:center}
.woc .stanza{margin-top:2.6rem}
.woc .sline{display:block;overflow:hidden;font-family:var(--serif);font-size:clamp(1.85rem,5.4vw,3.8rem);line-height:1.32;color:var(--fg)}
.woc .sline>span{display:block;transform:translateY(114%)}
.woc .kicker{margin-top:2.6rem;font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--fg-soft)}

/* ---------- responsibility ---------- */
.resp{padding:0 0 clamp(6rem,15vh,10rem)}
.hairbox{border:1px solid var(--hair);padding:clamp(2.2rem,5vw,3.6rem);display:grid;gap:1.7rem}
@media(min-width:900px){.hairbox{grid-template-columns:1fr auto;align-items:center;gap:3.4rem}}
.hairbox h3{font-size:clamp(1.5rem,3.4vw,2.2rem);max-width:26ch}
.hairbox p{font-size:.8438rem;color:var(--fg-soft);max-width:54ch;margin-top:.7rem}

/* ---------- studio ---------- */
.studio{padding:0 0 clamp(8rem,18vh,12rem)}
.studio-grid{display:grid;gap:3rem}
@media(min-width:960px){.studio-grid{grid-template-columns:1fr 1fr;gap:6.5rem;align-items:center}}
.studio h2{font-size:clamp(2.3rem,6vw,4.4rem);margin-top:1.5rem}
.studio .addr{margin-top:2rem;font-size:.8438rem;color:var(--fg-soft);line-height:2.1}
.studio .addr b{font-weight:500;color:var(--fg)}

/* ---------- footer ---------- */
footer{background:var(--obsidian);color:#F2ECE2;padding:clamp(4.5rem,11vh,7rem) 0 2.4rem;position:relative;z-index:1}
.f-top{display:grid;gap:3.2rem}
@media(min-width:960px){.f-top{grid-template-columns:1.6fr 1fr 1fr}}
.f-brand .word{font-family:var(--serif);font-size:clamp(2.2rem,6vw,3.8rem);letter-spacing:.14em;font-weight:500}
.f-brand .word sup{color:var(--ochre)}
.f-brand .desc{font-size:.5313rem;letter-spacing:.6em;text-transform:uppercase;color:rgba(242,236,226,.5);margin:.8rem 0 1.5rem}
.f-brand p{font-size:.8438rem;color:rgba(242,236,226,.7);max-width:38ch}
.f-col h4{font-size:.5625rem;letter-spacing:.38em;text-transform:uppercase;font-weight:500;color:var(--ochre);margin-bottom:1.3rem}
.f-col ul{list-style:none;display:grid;gap:.6rem;font-size:.8125rem;color:rgba(242,236,226,.78)}
.f-col a{transition:color .3s}
.f-col a:hover{color:var(--ochre)}
.f-legal{margin-top:3.4rem;padding-top:1.6rem;border-top:1px solid rgba(242,236,226,.13);
  display:grid;gap:.55rem;font-size:.6563rem;color:rgba(242,236,226,.48)}
.f-legal .addr{color:rgba(242,236,226,.66)}

@media(max-width:700px){
  .hero h1{font-size:clamp(2.9rem,12.5vw,4.6rem)}
  .manifesto{padding:clamp(5rem,11vh,7.5rem) 0}
  .manifesto p{font-size:clamp(1.5rem,6.4vw,2rem)}
  .gather h2{font-size:clamp(1.9rem,8.2vw,2.8rem)}
  .gather .gsub{font-size:1.02rem}
  .world{padding:clamp(3.5rem,8vh,5rem) var(--pad)}
  .world h3{font-size:clamp(2.1rem,9.5vw,3rem)}
  .world .names{line-height:1.9}
  .journey{padding:clamp(4.5rem,10vh,7rem) 0}
  .journey-grid{gap:2.6rem;margin-top:2rem}
  .jhead h2{font-size:clamp(1.9rem,8.6vw,2.9rem)}
  .woc{padding:clamp(5rem,12vh,8rem) 0}
  .woc .sline{font-size:clamp(1.6rem,7.4vw,2.4rem)}
  .resp{padding-bottom:4.5rem}
  .studio{padding-bottom:5.5rem}
  .studio h2{font-size:clamp(1.9rem,8.6vw,2.9rem)}
  footer{padding-top:3.5rem}
  .btn{padding:1.05rem 1.4rem;letter-spacing:.26em}
  .btn:hover{letter-spacing:.3em}
}
@media(max-height:540px){
  .hero h1{font-size:clamp(2.3rem,13vh,4rem)}
  .hero{padding-bottom:2rem}
  .gather{padding-bottom:2rem}
  .gather h2{font-size:clamp(1.35rem,7vh,2rem)}
  .gather .gsub{font-size:.9rem;margin-top:.8rem}
  .gather .eyebrow{font-size:.5313rem}
  .world{min-height:0;padding:3.5rem var(--pad)}
}
@media(prefers-reduced-motion:reduce){.hero .hint i::after{animation:none}}

/* ===== site components (v2) ===== */
.crumbs{font-size:.625rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-soft);
  padding:1.1rem 0 0}
.crumbs a:hover{color:var(--ochre)}
.crumbs span{margin:0 .45rem;color:var(--ochre)}
.phero{padding:clamp(3.2rem,8vh,5.5rem) 0 clamp(2.2rem,5vh,3.4rem);border-bottom:1px solid var(--hair)}
.phero .eyebrow{margin-bottom:1.3rem}
.phero h1{font-size:clamp(2.4rem,7vw,4.8rem)}
.phero .lede{margin-top:1.5rem}
.prose{max-width:72ch}
.prose h2{margin:2.4em 0 .6em;font-size:clamp(1.55rem,3.8vw,2.3rem)}
.prose h2:first-child{margin-top:0}
.prose h3{margin:1.9em 0 .5em;font-size:clamp(1.2rem,2.8vw,1.5rem)}
.prose p{margin:.85em 0;color:var(--fg-soft)}
.prose ul{margin:.85em 0 .85em 1.15em}
.prose li{margin:.3em 0;color:var(--fg-soft)}
.prose strong{font-weight:500;color:var(--fg)}
.prose hr{border:none;border-top:1px solid var(--hair);margin:2.4em 0}
.prose .stanza p{margin:.12em 0;font-family:var(--serif);font-size:1.18rem;line-height:1.55;color:var(--fg)}
.grid2{display:grid;gap:1.6rem}
.grid3{display:grid;gap:1.8rem}
@media(min-width:760px){.grid2{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:repeat(3,1fr)}}
.pcard{display:flex;flex-direction:column;gap:.9rem;border:1px solid var(--hair);padding:1.1rem 1.1rem 1.3rem;background:rgba(255,255,255,.28)}
body[data-theme="echo"] .pcard{background:rgba(244,237,228,.04)}
.pcard .tag{font-size:.5625rem;letter-spacing:.32em;text-transform:uppercase;font-weight:500;color:var(--ochre)}
.pcard h3{font-size:clamp(1.3rem,3vw,1.7rem)}
.pcard p{font-size:.8438rem;color:var(--fg-soft)}
.pcard .status{font-size:.5625rem;letter-spacing:.26em;text-transform:uppercase;color:var(--fg-soft)}
.pcard .tlink{margin-top:auto;align-self:flex-start}
.hscroll{display:grid;grid-auto-flow:column;grid-auto-columns:min(78vw,320px);gap:1.1rem;
  overflow-x:auto;padding:.4rem .2rem 1rem;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.hscroll>*{scroll-snap-align:start}
.hscroll::-webkit-scrollbar{height:4px}
.hscroll::-webkit-scrollbar-thumb{background:var(--hair)}
.facts{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.8438rem}
.facts th,.facts td{text-align:left;padding:.6rem .2rem;border-bottom:1px solid var(--hair);vertical-align:top}
.facts th{font-weight:500;color:var(--fg-soft);width:40%;font-size:.7188rem;text-transform:uppercase;letter-spacing:.12em}
.acc{border-top:1px solid var(--hair);margin-top:1.4rem}
.acc-item{border-bottom:1px solid var(--hair)}
.acc-q{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:1.4rem;
  padding:1.15rem .1rem;font-family:var(--serif);font-size:clamp(1.05rem,2.6vw,1.3rem);color:var(--fg)}
.acc-q .ic{color:var(--ochre);font-size:1.35rem;transition:transform .35s;flex:none}
.acc-item.open .ic{transform:rotate(45deg)}
.acc-a{max-height:0;overflow:hidden;transition:max-height .45s ease}
.acc-a>div{padding:0 .1rem 1.3rem;font-size:.8438rem;max-width:66ch;color:var(--fg-soft)}
.trust{display:grid;gap:.6rem;margin:1.3rem 0;font-size:.7188rem;letter-spacing:.06em;color:var(--fg-soft)}
.trust li{list-style:none;padding-left:1.2rem;position:relative}
.trust li::before{content:"";position:absolute;left:0;top:.55em;width:.55rem;height:1px;background:var(--ochre)}
.plinks{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin:1.2rem 0 0;font-size:.6563rem;
  letter-spacing:.16em;text-transform:uppercase}
.plinks a{border-bottom:1px solid var(--hair);padding-bottom:.3rem}
.plinks a:hover{color:var(--ochre);border-color:var(--ochre)}
.pdp{display:grid;gap:2.4rem;padding:1.6rem 0 0}
@media(min-width:960px){.pdp{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:4rem}
 .pdp-info{position:sticky;top:5.5rem;align-self:start}}
.pdp-gal{display:grid;gap:1.1rem}
.price{font-family:var(--serif);font-size:1.85rem;margin:.5rem 0 .1rem;color:var(--fg)}
.price small{font-family:var(--sans);font-size:.6563rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-soft)}
.statuslabel{display:inline-block;font-size:.5938rem;letter-spacing:.28em;text-transform:uppercase;font-weight:500;
  border:1px solid var(--ochre);color:var(--ochre);padding:.45rem .8rem;margin:.8rem 0 0}
.calcline{border-left:1.5px solid var(--ochre);padding:.25rem 0 .25rem 1.1rem;margin:1rem 0;font-size:.8438rem;color:var(--fg-soft)}
.calcline strong{font-family:var(--serif);font-weight:500;font-size:1.05rem;color:var(--fg)}
.ph{position:relative;background:
  repeating-linear-gradient(0deg,rgba(75,62,52,.045) 0 1px,transparent 1px 22px),
  repeating-linear-gradient(90deg,rgba(75,62,52,.045) 0 1px,transparent 1px 22px),rgba(244,237,228,.6);
  border:1px dashed rgba(120,100,80,.4);display:flex;align-items:flex-end;overflow:hidden;width:100%}
.ph .ph-in{padding:.95rem 1.05rem;font-size:.6563rem;line-height:1.55;color:var(--fg-soft);width:100%;
  background:linear-gradient(to top,rgba(249,246,242,.92),rgba(249,246,242,0))}
.ph .ph-path{font-weight:500;letter-spacing:.05em;display:block;word-break:break-all;color:var(--brown)}
.ph .ph-desc{margin:.15rem 0 .1rem}
.ph .ph-spec{font-size:.5938rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ochre)}
.ph.filled{border:none;background:none}
.ph.filled .ph-in{display:none}
.ph>img,.ph>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.credit{font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-soft);margin-top:.5rem}
.form{display:grid;gap:1rem;max-width:600px}
.field label{display:block;font-size:.625rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500;color:var(--fg-soft);margin-bottom:.35rem}
.field input,.field select,.field textarea{width:100%;background:transparent;border:1px solid rgba(120,100,80,.45);
  padding:.8rem .85rem;font-family:var(--sans);font-size:.9063rem;font-weight:300;color:var(--fg)}
.field textarea{min-height:6.5rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ochre)}
.consent{display:flex;gap:.65rem;align-items:flex-start;font-size:.7188rem;color:var(--fg-soft)}
.consent input{margin-top:.28rem;accent-color:var(--ochre)}
.form-ok{display:none;border:1px solid var(--sage);padding:1rem 1.1rem;font-size:.8125rem;color:var(--fg-soft)}
.notebox{border:1px solid var(--hair);padding:1.2rem 1.3rem;margin:1.1rem 0;font-size:.8125rem;color:var(--fg-soft)}
.notebox h4{font-family:var(--sans);font-size:.625rem;letter-spacing:.26em;text-transform:uppercase;font-weight:500;color:var(--ochre);margin-bottom:.55rem}
.jcard{border:1px solid var(--hair);padding:1.4rem 1.4rem 1.6rem;display:flex;flex-direction:column;gap:.7rem}
.jcard .jdate{font-size:.5938rem;letter-spacing:.3em;text-transform:uppercase;color:var(--fg-soft)}
.jcard h3{font-size:clamp(1.25rem,3vw,1.6rem)}
.jcard p{font-size:.8438rem;color:var(--fg-soft)}
.news{display:grid;gap:.9rem;max-width:460px}
.news .row{display:flex;gap:.6rem}
.news input[type=email]{flex:1;background:transparent;border:1px solid rgba(242,236,226,.4);
  padding:.85rem .9rem;color:#F2ECE2;font-family:var(--sans);font-weight:300}
.news input[type=email]:focus{outline:none;border-color:var(--ochre)}
.news .btn{border-color:rgba(242,236,226,.7);color:#F2ECE2}
.news .consent{color:rgba(242,236,226,.6)}
.f-news h4{font-size:.5625rem;letter-spacing:.38em;text-transform:uppercase;font-weight:500;color:var(--ochre);margin-bottom:1rem}
.f-news .nlede{font-size:.8125rem;color:rgba(242,236,226,.72);max-width:38ch;margin-bottom:1rem}
section{scroll-margin-top:5rem}

/* site scroll progress — thin top line, theme-aware, above bar */
#scrollbar{position:fixed;top:0;left:0;height:2px;width:0;z-index:70;
  background:linear-gradient(90deg,var(--ochre),var(--ochre));
  transition:width .08s linear;pointer-events:none}
@media(prefers-reduced-motion:reduce){#scrollbar{transition:none}}
/* navbar vertical rhythm: slightly more above, less below (optical balance vs border+blur) */
.bar{padding-top:calc(1rem + env(safe-area-inset-top,0px)) !important;padding-bottom:.72rem !important}

/* ===== width alignment: hero + weave text share the centered 1280 column (canvas stays full-bleed) ===== */
.hero{padding-left:0;padding-right:0}
.hero>.eyebrow,.hero>h1,.hero>.lede,.hero>.cta-row{
  max-width:1280px;margin-left:auto;margin-right:auto;
  padding-left:var(--pad);padding-right:var(--pad);width:100%}
.hero>.hint{right:max(var(--pad),calc((100% - 1280px)/2 + var(--pad)))}
.gather{padding-left:0;padding-right:0}
.gather>.gtxt{
  max-width:1280px;margin-left:auto;margin-right:auto;
  padding-left:var(--pad);padding-right:var(--pad);width:100%;box-sizing:border-box}
.gather>.gtxt>*{max-width:640px}
/* hint fades once hero leaves viewport (JS toggles .hint-hide) */
.hero .hint{transition:opacity .5s ease}
.hero .hint.hint-hide{opacity:0;pointer-events:none}

.hpin{width:100%}
.hprog{display:none;height:2px;background:var(--hair);margin:1.4rem 0 0;position:relative;overflow:hidden}
.hprog>i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--ochre);transition:width .05s linear}
@media(hover:hover) and (pointer:fine){
  .hpin.pinning{cursor:ew-resize;overflow:hidden}
  .hpin.pinning .hscroll{overflow-x:hidden;scroll-snap-type:none}
}

/* footer: 4 columns only on wide screens; core mobile 1-col preserved */
@media(min-width:960px){.f-top{grid-template-columns:1.6fr 1fr 1fr 1fr}}
.f-top>*{min-width:0}
.f-col ul li{overflow-wrap:break-word}

.filled-frame{position:relative;overflow:hidden;background:#15110D}
.filled-frame>img{display:block}
.filled-frame .credit-cap{position:absolute;left:0;right:0;bottom:0;margin:0;
  font-size:.5625rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,236,226,.72);
  padding:.6rem .8rem;background:linear-gradient(to top,rgba(16,13,11,.72),transparent);z-index:2}
.filled-frame .corner{z-index:3}