/* Doorpost's threshold, version 2: the doorway film, the brass line, three doors, and the ask.
   The forest sequence is the one flourish on the page; everything else stays quiet. */
.threshold-site{--maxw:1360px}
.threshold-site .hdr{height:90px;background:linear-gradient(#070c12d9,transparent);border:0}
.threshold-site .hdr .wrap{max-width:none;padding-inline:clamp(24px,4vw,80px)}
.threshold-site .brand img{height:46px}
.threshold-site .nav{gap:clamp(18px,2.2vw,36px)}
.threshold-site .nav__link,.threshold-site .nav__tel{font-size:12px}
.threshold-site .nav__tel{display:none}
.threshold-site .hdr .btn{border-radius:2px;background:transparent;border:1px solid #d7d6c563;color:#f4ecdc;font-size:12px;padding:12px 17px;font-weight:500}
.threshold-site .hdr .btn:hover{background:#f4ecdc;color:#10171a;box-shadow:none;transform:none}
.threshold-site .hdr.is-stuck{background:#070c12e8;backdrop-filter:blur(12px);border-bottom:1px solid #e8dbc21a}

/* ---------- the hero ---------- */
.hero--threshold{--hero-progress:0;background:#070c12;isolation:isolate}
.hero--threshold .hero__stage{height:max(760px,100svh);min-height:0;display:block;padding:0;isolation:isolate;overflow:hidden}
.hero--threshold .hero__media{inset:0;z-index:0;transform-origin:50% 50%;will-change:transform}
.hero--threshold .hero__media picture{animation:none!important;inset:0}
.hero--threshold .hero__media img{object-position:50% 50%;filter:saturate(.92) contrast(1.04) brightness(.9)}
.hero--threshold .hero__canvas{filter:saturate(.92) contrast(1.04) brightness(.9)}
.threshold-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#060b10c4,#060b1052 38%,transparent 62%),linear-gradient(0deg,#070c12 0%,#070c1250 18%,transparent 42%,#070c1245 100%)}
.threshold-site .plumb{background:transparent}
.threshold-copy{position:absolute;z-index:5;left:clamp(24px,5.5vw,104px);top:clamp(150px,29vh,300px);max-width:760px;will-change:transform,opacity}
.threshold-copy h1{font-family:var(--display);font-size:clamp(2.9rem,1.2rem + 4.6vw,5.6rem);line-height:.98;letter-spacing:-.02em;font-weight:500;color:#f2eee2;text-wrap:balance;text-shadow:0 3px 30px #050a0f66}
.threshold-lede{margin-top:clamp(20px,3vh,30px);font-family:var(--body);font-size:clamp(15px,.9rem + .25vw,17px);line-height:1.7;color:#dcdcd4;max-width:33rem}
.threshold-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:clamp(24px,3.5vh,36px)}
.threshold-actions .btn{border-radius:999px}
.threshold-call{font:600 13px/1 var(--body);color:#f3ecdc;padding:14px 0;border-bottom:1px solid #ddd0b767;transition:border-color .2s var(--ease),color .2s var(--ease)}
.threshold-call:hover{border-color:#f3dbab;color:#fff5d8}
.threshold-exit{position:absolute;z-index:6;inset:0;display:grid;place-items:center;text-align:center;opacity:0;visibility:hidden;pointer-events:none;padding:80px 24px}
.threshold-exit p{font:500 clamp(44px,6vw,96px)/1 var(--display);color:#f3ede1;letter-spacing:-.02em;text-wrap:balance;text-shadow:0 3px 50px #080b0c99}
.threshold-wash{position:absolute;inset:0;background:#070c12;opacity:0;z-index:4;pointer-events:none}
.threshold-ready .hero--threshold{height:200svh}
.threshold-ready .hero--threshold .hero__stage{position:sticky;top:0;height:100svh;min-height:0}
@media(min-width:1700px){.threshold-copy{top:30vh}}
@media(max-width:1100px){.threshold-copy{left:5%;max-width:640px}}
@media(max-width:900px){
 .threshold-site .hdr{height:72px}.threshold-site .brand img{height:38px}.threshold-site .hdr .wrap{padding-inline:24px}
 .hero--threshold .hero__media{height:62svh;bottom:auto}
 .hero--threshold .hero__media:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(0deg,#070c12,transparent 24%)}
 .threshold-copy{top:auto;bottom:clamp(40px,8vh,90px);max-width:none;right:24px;left:24px}
 .threshold-shade{background:linear-gradient(0deg,#070c12 0%,#070c12aa 27%,transparent 57%,#070c1240)}
}
@media(max-width:600px){
 .hero--threshold .hero__stage{height:max(780px,100svh)}
 .threshold-ready .hero--threshold{height:185svh}
 .threshold-ready .hero--threshold .hero__stage{height:100svh;min-height:690px}
 .hero--threshold .hero__media img{object-position:50% 50%}
 .threshold-copy h1{font-size:clamp(2.4rem,10.4vw,3.3rem);line-height:1}
 .threshold-lede{font-size:14px;line-height:1.65;margin-top:16px;max-width:none}
 .threshold-actions{margin-top:22px;gap:12px 22px}
 .threshold-actions .btn{font-size:.88rem;padding:.8rem 1.25rem}
 .threshold-call{font-size:12px;padding:10px 0}
 .threshold-exit p{font-size:clamp(40px,10vw,60px)}
}
@media(max-height:740px) and (min-width:601px){.threshold-copy{top:clamp(120px,22vh,200px)}.threshold-copy h1{font-size:clamp(2.6rem,1rem + 4vw,4.6rem)}.threshold-lede{margin-top:16px;font-size:14px}.threshold-actions{margin-top:20px}}
@media(max-height:700px) and (max-width:600px){.threshold-ready .hero--threshold .hero__stage{min-height:0}.threshold-copy{bottom:36px}.threshold-copy h1{font-size:2.2rem}.threshold-lede{font-size:13px;margin-top:12px}}
@media(prefers-reduced-motion:reduce){.threshold-exit{display:none!important}.threshold-ready .hero--threshold{height:auto}.threshold-ready .hero--threshold .hero__stage{position:relative;height:max(760px,100svh)}.threshold-copy{opacity:1!important;transform:none!important;visibility:visible!important}.threshold-wash{opacity:0!important}.threshold-site *{scroll-behavior:auto!important}}
html:not(.js) .threshold-site .hdr{position:relative;background:#070c12;height:auto;padding-block:16px}
html:not(.js) .threshold-site .hero__stage{padding:0}
.hero--threshold .hero__stage{touch-action:pan-y pinch-zoom}

/* ---------- three doors: substantial sheets, each one covering the last ---------- */
.threshold-site .sec{padding-block:clamp(4rem,8vw,7rem)}
.threshold-site .close{min-height:62vh}
.threshold-site .hero+.doors{padding-top:clamp(56px,7vw,100px);border-top:1px solid #d7ccb521}
.doors{padding-bottom:clamp(56px,7vw,100px);background:#080e14}
.doors>.wrap{max-width:1420px}
.doors .sec__head{max-width:960px;margin-bottom:clamp(36px,4.5vw,60px)}
.doors .h2{font-size:clamp(2.6rem,1.4rem + 3.4vw,4.7rem);line-height:1.03;text-wrap:balance}
.service-stack{position:relative;padding-bottom:10px}
.stack-panel{--panel-ink:#1c292b;--panel-sub:#475556;--panel-line:#3544463b;--panel-paper:#e4e2d8;position:relative;background:var(--panel-paper);color:var(--panel-ink);border:1px solid var(--panel-line);border-radius:2px;padding:22px 40px 20px;margin-bottom:28px;min-height:0;transform-origin:50% 0%;box-shadow:0 30px 65px #0002;isolation:isolate;will-change:transform;scroll-margin-top:calc(96px + var(--panel-index,0)*20px + 8px)}
.stack-panel--night{--panel-paper:#172a34;--panel-ink:#eeeadd;--panel-sub:#c1ccc9;--panel-line:#d0d3c332}
.stack-panel--stone{--panel-paper:#393c33;--panel-ink:#f3ecdb;--panel-sub:#d1d3c6;--panel-line:#dbd7bc40}
.stack-panel__label{display:flex;justify-content:space-between;align-items:center;gap:16px;font:600 clamp(1.05rem,.95rem + .45vw,1.35rem)/1.3 var(--body);letter-spacing:-.005em;padding-bottom:16px;border-bottom:1px solid var(--panel-line)}
.stack-panel__corner{font-size:22px;line-height:1;font-weight:400}
.stack-panel__body{display:grid;grid-template-columns:1fr 1.06fr;gap:clamp(30px,4.5vw,80px);align-items:stretch;min-height:0;padding-block:26px 22px}
.stack-panel__copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-block:10px}
.stack-panel__copy h3{font-family:var(--display);font-size:clamp(2.1rem,1.2rem + 2.4vw,3.6rem);font-weight:500;letter-spacing:-.02em;line-height:1;margin-bottom:18px;text-wrap:balance}
.stack-panel__copy>p{font:14px/1.75 var(--body);max-width:420px;color:var(--panel-sub)}
.stack-panel__link{display:flex;gap:26px;justify-content:space-between;align-items:center;min-height:44px;margin-top:20px;border-bottom:1px solid var(--panel-line);font:600 13px var(--body)}
.stack-panel__link span{font-size:23px;transition:transform .25s var(--ease-o)}.stack-panel__link:hover span{transform:translate(3px,-3px)}
.stack-panel__visual{position:relative;overflow:hidden;min-height:clamp(280px,36svh,380px);background:#08121a;isolation:isolate;color:#eee9dd}
.stack-panel__visual picture{position:absolute;inset:-6% 0;z-index:-2;transform:translateY(var(--image-shift,0));will-change:transform}
.stack-panel__visual img{width:100%;height:100%;object-fit:cover;filter:saturate(.7)}
.stack-panel__visual:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#050e18fa,transparent 88%)}
.stack-details{position:absolute;inset:auto 28px 24px}
.stack-details__buttons{display:flex;flex-wrap:wrap;gap:6px 22px;border-bottom:1px solid #fff3;margin-bottom:17px}
.stack-details__buttons[hidden]{display:none}
.stack-details__buttons button{position:relative;appearance:none;border:0;background:none;padding:10px 0 12px;min-height:44px;font:600 13px var(--body);color:#c4c8c5;cursor:pointer;transition:color .2s var(--ease)}
.stack-details__buttons button:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:#e2c690;transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease-o)}
.stack-details__buttons button:hover{color:#f4e8ce}
.stack-details__buttons button[aria-pressed=true]{color:#f4e8ce}.stack-details__buttons button[aria-pressed=true]:after{transform:scaleX(1)}
.stack-details__text{font:13px/1.7 var(--body);min-height:58px;max-width:390px;color:#dde0d7}
.stack-details__link{display:inline-flex;align-items:center;gap:10px;margin-top:10px;padding:6px 0;font:600 13px var(--body);color:#f4e8ce;border-bottom:1px solid #e2c69080;transition:border-color .2s var(--ease)}
.stack-details__link:hover{border-color:#f4e8ce}
.stack-details__link span{font-size:18px;transition:transform .25s var(--ease-o)}.stack-details__link:hover span{transform:translate(3px,-3px)}
.stack-panel__visual--example{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:clamp(18px,3vw,36px);background:#2c2f28;color:#f3ecdb}
.stack-panel__visual--example:after{display:none}
.stack-panel__visual--example .example-window{border:1px solid #dbd7bc40;border-radius:6px;box-shadow:none;background:#1c1f1a}
.stack-panel__visual--example .example-window img{filter:none;height:auto}
.stack-panel__visual--example .window-bar{border-radius:0}
.stack-panel__visual--example .image-caption{margin:0;color:#d1d3c6;font-size:13px}
.stack-panel__visual--example .image-caption .text-link{display:inline;margin:0 0 0 .3rem;font-size:13px;color:#f3ecdb}
.stack-panel__foot{border-top:1px solid var(--panel-line);padding-top:15px;display:flex;justify-content:space-between;gap:16px;font:11px/1.5 var(--body);letter-spacing:.02em;color:var(--panel-sub)}
.stack-ready .stack-panel{position:sticky;top:calc(96px + var(--panel-index)*20px);margin-bottom:16svh;z-index:calc(2 + var(--panel-index))}
.stack-ready .stack-panel:last-child{margin-bottom:0}
@media(max-width:1100px){.stack-panel{padding:20px 30px 18px}.stack-panel__body{gap:28px}.stack-panel__copy h3{font-size:2.6rem}.stack-panel__copy>p{font-size:14px}.stack-panel__visual{min-height:clamp(260px,34svh,340px)}.stack-details{inset:auto 20px 20px}.stack-details__buttons{gap:6px 16px}}
@media(max-width:900px){
 .doors .sec__head{margin-bottom:46px}.doors .h2{font-size:clamp(2.3rem,1.5rem + 3vw,3rem)}
 .stack-panel{padding:18px 20px 15px;min-height:0;margin-bottom:24px}
 .stack-panel__body{display:flex;flex-direction:column;gap:24px;min-height:0;padding-block:24px 21px}
 .stack-panel__copy{padding:0}.stack-panel__copy h3{font-size:2.5rem;margin-bottom:16px}.stack-panel__copy>p{font-size:14px;line-height:1.7}
 .stack-panel__link{font-size:12px;margin-top:13px;min-height:43px}.stack-panel__visual{min-height:250px}
 .stack-panel__label{font-size:12px;padding-bottom:13px}.stack-panel__corner{font-size:17px}
 .stack-details{inset:auto 18px 16px}.stack-details__buttons{margin-bottom:10px;gap:4px 18px}.stack-details__buttons button{font-size:12px;padding-block:7px 10px}.stack-details__text{font-size:12px;min-height:59px}
 .stack-panel__foot{font-size:10px;padding-top:12px;flex-wrap:wrap}
 .stack-panel__visual--example{padding:14px}
 .stack-ready .stack-panel{top:calc(84px + var(--panel-index)*12px);margin-bottom:12svh}
}
@media(max-width:370px){.stack-panel{padding-inline:16px}.stack-panel__copy h3{font-size:2.2rem}.stack-details__buttons{gap:4px 14px}}
@media(prefers-reduced-motion:reduce){.stack-ready .stack-panel{position:relative;top:auto;margin-bottom:30px;transform:none!important}.stack-panel__visual picture{transform:none!important}.stack-panel{will-change:auto}}
@media(min-width:901px) and (max-height:800px){.stack-panel{padding-block:16px 14px}.stack-panel__body{padding-block:18px 16px;gap:36px}.stack-panel__visual{min-height:clamp(240px,40svh,300px)}.stack-panel__copy h3{font-size:2.4rem;margin-bottom:14px}.stack-panel__copy>p{font-size:13px;line-height:1.7}.stack-panel__link{margin-top:14px;min-height:40px}.stack-details__text{min-height:0}}

/* ---------- the ask: bring one task ---------- */
.demo{background:var(--night);border-top:1px solid var(--line)}
.demo__grid{display:grid;gap:clamp(2rem,5vw,5rem);align-items:center}
@media(min-width:900px){.demo__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.demo__copy .h2{text-wrap:balance}
.demo__copy .lede{max-width:36rem}
.demo__actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.2rem}
.demo__fine{margin-top:1.3rem;color:var(--pewter);font-size:.95rem}
.demo__fine a{color:var(--ink);font-weight:700;border-bottom:1px solid var(--gold-ln)}
.demo__card{gap:.9rem}
.demo__card:hover{transform:none;border-color:var(--gold-ln)}
.demo__card h3{font-family:var(--display);font-size:1.7rem;line-height:1.1;color:var(--ink)}
.demo__tasks{display:grid;gap:.7rem;padding-top:1.1rem;border-top:1px solid var(--line)}
.demo__tasks li{position:relative;padding-left:1.4rem;font-size:1rem;line-height:1.5;color:var(--ink)}
.demo__tasks li::before{content:"";position:absolute;left:0;top:.72em;width:.6rem;height:1px;background:var(--gold)}
.demo__card-note{font-size:.9rem;color:var(--muted);padding-top:.4rem}

/* ---------- quieter section heads ---------- */
.threshold-site .habit__title{font-size:clamp(1.9rem,1.3rem + 2.6vw,3.4rem);text-wrap:balance}
.threshold-site .sec__head .h2,.threshold-site .close .h1,.threshold-site .about__copy .h2{text-wrap:balance}
.threshold-site .habit{border-top:1px solid var(--line)}
.threshold-site .pull{border-left:1px solid var(--gold-ln);padding-left:1.6rem}
.threshold-site .about__copy .h2{margin-top:0}
/* The website sheet stays as short as the other two so all three can pin on a laptop screen. */
.stack-panel__visual--example .example-window img{max-height:clamp(200px,30svh,290px);object-fit:cover;object-position:top}
.stack-panel__visual--example{min-height:0}
@media(max-width:900px){.stack-panel__visual--example .example-window img{max-height:none}}