/* V04.2 — a continuous passage beyond the entrance. */
.connected-page{--chapter-ink:var(--espresso);z-index:auto}
.has-connected{overflow-anchor:none}
.connected-page .scene-section{position:relative;min-height:108svh;padding:calc(var(--header) + 65px) var(--gutter) 120px;scroll-margin-top:0;display:flex;align-items:center}
.connected-page .scene-section:focus{outline:none}
.connected-page .scene-section[data-tone="dark"]{color:var(--porcelain)}
.connected-page .arrival-copy{width:48%;max-width:650px;position:relative;z-index:2}
.arrival-copy>.eyebrow:first-child{display:block;margin-bottom:30px}
.connected-page h1{font-size:clamp(64px,7.1vw,110px);line-height:1.02;margin-bottom:28px}
.connected-page.product-page h1{font-size:clamp(58px,7vw,108px);white-space:nowrap}
.arrival-copy .arrival-lead{font:var(--display-weight) clamp(28px,2.5vw,40px)/1.13 var(--display-face),Georgia,serif;letter-spacing:-.025em;margin:24px 0}
.arrival-description{max-width:360px;font-size:16px;line-height:1.65;margin:0 0 23px}
.arrival-copy .descriptor{font-size:10px;margin-top:-7px}
.story-down{display:flex;gap:30px;align-items:center;width:fit-content;min-height:44px;margin-top:33px;font-size:9px}
.story-down>span{font-size:21px;transition:transform .4s}
.story-down:hover>span{transform:translateY(5px)}
.image-caption{position:absolute;right:var(--gutter);bottom:130px;text-align:right;font-size:9px;line-height:1.9;max-width:230px}
.story-nav{position:fixed;bottom:15px;left:50%;transform:translateX(-50%);z-index:26;display:flex;gap:28px;align-items:center;color:var(--chapter-ink);white-space:nowrap}
.story-nav a{font-size:9px;letter-spacing:.12em;text-transform:uppercase;min-height:44px;display:flex;align-items:center;gap:9px;opacity:.7}
.story-nav a[aria-current]{opacity:1}
.story-dot{display:block;width:3px;height:3px;background:currentColor;border-radius:100%;transition:transform .4s}
.story-nav a[aria-current] .story-dot{transform:scale(1.9)}
.has-connected .world-shade{background:linear-gradient(90deg,rgba(244,238,230,.96),rgba(244,238,230,.83) 29%,rgba(244,238,230,.15) 60%,transparent 80%)!important}
.has-connected .site-header{color:var(--ink);background:linear-gradient(rgba(244,238,230,.94),rgba(244,238,230,0))!important;backdrop-filter:blur(8px)}
.has-connected .world-controls{height:72px;mix-blend-mode:normal;--ink:var(--espresso);background:linear-gradient(transparent,rgba(244,238,230,.9) 65%)}
.has-connected .motion-control{font-size:8px}
.has-connected[data-tone=skin] .world-shade{background:linear-gradient(270deg,rgba(244,238,230,.98),rgba(244,238,230,.91) 32%,rgba(244,238,230,.4) 53%,transparent 72%)!important}
.has-connected[data-tone=dark]{--ink:var(--porcelain)}
.has-connected[data-tone=dark] .connected-page{--chapter-ink:var(--porcelain)}
.has-connected[data-tone=dark] .world-shade{background:rgba(31,18,12,.66)!important}
.has-connected[data-tone=dark] .site-header{background:linear-gradient(rgba(31,18,12,.82),rgba(31,18,12,0))!important}
.has-connected[data-tone=dark] .world-controls{--ink:var(--porcelain);background:linear-gradient(transparent,rgba(31,18,12,.92) 65%)}
.has-connected .world-shade{transition:background .7s}
.explorer-content{width:49%;max-width:600px;position:relative}
.formula-selector{display:flex;gap:32px;margin:33px 0 35px;border-bottom:1px solid rgba(47,30,24,.3)}
.formula-selector button{font:var(--display-weight) clamp(24px,2.6vw,39px)/1.2 var(--display-face);letter-spacing:-.015em;padding:0 0 21px;min-height:56px;position:relative;opacity:.5}
.formula-selector button[aria-selected=true]{opacity:1}
.formula-selector button[aria-selected=true]:after{content:'';height:2px;background:var(--copper);position:absolute;bottom:-1px;left:0;width:100%}
.formula-selector small{font:9px House Sans;vertical-align:top;letter-spacing:.1em;margin-left:6px;line-height:2}
.formula-panel{position:relative;min-height:350px;max-width:460px;animation:story-panel .65s both;overflow-anchor:none}
.formula-panel h3{font-size:clamp(37px,4vw,62px);margin:22px 0}
.formula-panel>p:not(.eyebrow){font-size:16px;max-width:340px;margin-bottom:18px}
.formula-descriptor{font-size:10px}
.formula-edition{position:absolute;right:-20vw;top:34%;font:var(--display-weight) clamp(100px,13vw,210px)/1 var(--display-face);letter-spacing:-.04em;color:var(--porcelain);text-shadow:0 1px 20px rgba(47,30,24,.1);pointer-events:none;opacity:.7}
.composition-note{position:absolute;right:var(--gutter);bottom:145px;display:flex;align-items:center;gap:18px}
.composition-note p{font-size:9px;line-height:1.8}
.short-rule{display:block;width:45px;height:1px;background:currentColor;opacity:.4}
.portrait-copy{margin-left:auto;width:43%;max-width:590px}
.portrait-copy>.eyebrow{margin-bottom:26px;font-size:10px}
.portrait-copy h2{font-size:clamp(52px,5.5vw,86px);margin-bottom:30px}
.portrait-copy>p:not(.eyebrow){max-width:390px;font-size:18px}
.portrait-links{display:flex;gap:34px;margin-top:29px}
.portrait-copy .standard-line{max-width:370px;margin-top:45px;font-size:9px;line-height:1.8}
.benefit-selector{display:flex;gap:27px;border-bottom:1px solid rgba(47,30,24,.3);margin:32px 0 26px}
.benefit-selector button{min-height:46px;position:relative;font-size:10px;letter-spacing:.14em;text-transform:uppercase;opacity:.65}
.benefit-selector button[aria-selected=true]{opacity:1}
.benefit-selector button[aria-selected=true]:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--copper)}
.benefit-panel{min-height:160px;animation:story-panel .5s both}
.benefit-panel h3{font-size:32px;line-height:1.16;max-width:400px;margin-bottom:18px}
.benefit-panel p{font-size:16px;max-width:380px}
.connected-page .formula-ritual{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:start;padding-top:calc(var(--header) + 90px);padding-bottom:160px;background:linear-gradient(90deg,rgba(244,238,230,.28),rgba(244,238,230,.86) 65%)}
.ritual-heading h2{font-size:clamp(49px,5.1vw,80px);margin:25px 0 32px}
.ritual-heading>p:not(.eyebrow){font-size:17px;max-width:390px}
.ritual-details details{border-top:1px solid rgba(47,30,24,.3);padding:14px 0 16px}
.ritual-details summary{list-style:none;cursor:pointer;font-size:10px;letter-spacing:.13em;text-transform:uppercase;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.ritual-details summary::-webkit-details-marker{display:none}
.ritual-details summary>span{font:24px var(--display-face);transition:transform .3s}
.ritual-details details[open] summary>span{transform:rotate(45deg)}
.ritual-details details>p{font-size:15px;max-width:390px;margin:12px 0 16px}
.companion-link{display:grid;grid-template-columns:1fr auto;align-items:center;gap:13px 20px;border-top:1px solid rgba(47,30,24,.3);padding-top:30px;margin-top:30px}
.companion-link>.eyebrow{grid-column:1/-1;font-size:9px}
.companion-name{font:var(--display-weight) clamp(32px,3.1vw,49px)/1.1 var(--display-face);letter-spacing:-.02em}
.companion-name small{font-size:.45em;vertical-align:top;margin-left:7px;line-height:1.4}
.companion-link>span:last-child{font-size:24px;transition:transform .4s}
.companion-link:hover>span:last-child{transform:translate(5px,-5px)}
.connected-page .story-invitation{min-height:100svh;text-align:center;justify-content:center;color:var(--porcelain);padding-bottom:180px}
.invitation-copy{width:100%;max-width:700px}
.invitation-copy>.eyebrow{margin-bottom:25px}
.invitation-copy h2{font-size:clamp(62px,7vw,110px);margin-bottom:30px}
.invitation-copy>p:not(.eyebrow){font-size:17px;max-width:460px;margin:0 auto 20px}
.journey-footer{position:absolute;bottom:100px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;gap:25px;font-size:10px;color:var(--porcelain);line-height:1.7}
.journey-footer a:hover{text-decoration:underline;text-underline-offset:5px}
.connected-page .invitation-room{min-height:100svh;display:grid;grid-template-columns:.85fr 1.15fr;gap:7vw;color:var(--porcelain);align-items:center;padding-top:calc(var(--header) + 50px);padding-bottom:140px}
.invitation-intro{align-self:center}
.invitation-intro>.eyebrow{font-size:10px;max-width:300px;margin-bottom:25px}
.invitation-intro h1{font-size:clamp(64px,7vw,106px);line-height:1.06;margin-bottom:30px}
.invitation-intro>p:last-child{font-size:13px}
.invitation-object{width:100%;max-width:560px;justify-self:end;perspective:1200px;position:relative}
.envelope-trigger{display:block;position:relative;width:100%;height:280px;margin:50px 0 55px;color:var(--espresso);isolation:isolate;transition:height .7s,margin .7s}
.envelope-back{position:absolute;inset:0;background:var(--linen);box-shadow:0 25px 70px rgba(0,0,0,.22);border:1px solid rgba(244,238,230,.25)}
.envelope-paper{position:absolute;inset:15px 22px;background:var(--porcelain);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;transition:transform .8s cubic-bezier(.22,1,.36,1);box-shadow:0 -4px 12px rgba(47,30,24,.08)}
.envelope-paper .wordmark{font-size:27px}
.envelope-paper .eyebrow{font-size:7px}
.envelope-front{position:absolute;inset:0;background:linear-gradient(25deg,#e2d0bc,#f4eee6 70%);clip-path:polygon(0 0,50% 49%,100% 0,100% 100%,0 100%);z-index:3}
.envelope-flap{position:absolute;inset:0;background:linear-gradient(0deg,#dac4ae,#ede0d1);clip-path:polygon(0 0,100% 0,50% 58%);transform-origin:top;z-index:4;transition:transform .65s cubic-bezier(.22,1,.36,1),opacity .5s}
.envelope-seal{position:absolute;z-index:5;left:50%;top:45%;transform:translate(-50%,-50%);display:grid;place-items:center;height:48px;width:48px;border-radius:50%;background:linear-gradient(135deg,#b58668,#79503d);border:1px solid #bc957b;color:#edddc9;font:300 25px var(--display-face);box-shadow:0 2px 5px rgba(47,30,24,.2);transition:opacity .3s}
.envelope-seal svg{width:26px;height:20px;fill:none;stroke:currentColor;stroke-width:1.2}
.envelope-label{position:absolute;bottom:-47px;left:0;right:0;color:var(--porcelain);font-size:9px;display:flex;justify-content:center;align-items:center;gap:20px;min-height:44px}
.envelope-label>span{font-size:18px}
.envelope-trigger:hover .envelope-paper{transform:translateY(-13px)}
.invitation-object.is-open .envelope-flap{transform:rotateX(175deg);opacity:0}
.invitation-object.is-open .envelope-seal{opacity:0}
.invitation-object.is-open .envelope-paper{transform:translateY(-75px)}
.invitation-object.is-open .envelope-trigger{height:150px;margin-top:75px;margin-bottom:45px}
.invitation-object.is-open .envelope-paper .wordmark{font-size:22px}
.invitation-letter{position:relative;padding:34px 40px 30px;background:var(--porcelain);color:var(--espresso);box-shadow:0 20px 80px rgba(0,0,0,.16);animation:letter-in .8s cubic-bezier(.22,1,.36,1) both}
.invitation-letter>.eyebrow{font-size:9px;margin-bottom:15px}
.invitation-letter h2{font-size:clamp(42px,4vw,62px);margin-bottom:20px}
.invitation-letter p:not(.eyebrow){font-size:14px;line-height:1.7;margin-bottom:13px}
.invitation-letter .text-link{margin-bottom:8px}
.quiz-link{font-size:8px;display:block;min-height:44px;padding-top:15px}
.quiz-link:hover{text-decoration:underline;text-underline-offset:6px}
.invitation-noscript{background:var(--porcelain);color:var(--espresso);padding:30px}
.route-veil{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:0;backdrop-filter:blur(0);background:rgba(244,238,230,.08);transition:opacity .4s,backdrop-filter .6s}
.route-changing .route-veil{opacity:1;backdrop-filter:blur(18px)}
.has-connected [data-enter]{transition:opacity .8s,transform 1.1s cubic-bezier(.22,1,.36,1)}
.js .has-connected [data-enter].awaiting-entry{opacity:0;transform:translateY(24px)}
.motion-paused .has-connected [data-enter],.motion-paused .has-connected [data-enter].awaiting-entry{opacity:1;transform:none}
.motion-paused .has-connected .formula-panel,.motion-paused .has-connected .benefit-panel,.motion-paused .has-connected .invitation-letter{animation:none}
.motion-paused .has-connected .envelope-trigger,.motion-paused .has-connected .envelope-paper,.motion-paused .has-connected .envelope-flap,.motion-paused .has-connected [data-enter]{transition:none}
@keyframes story-panel{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes letter-in{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@media(min-width:1600px){.connected-page .arrival-copy{max-width:700px}.arrival-description{max-width:430px;font-size:18px}.formula-panel>p:not(.eyebrow){max-width:420px;font-size:18px}}
@media(max-width:1100px){.story-nav{gap:18px}.story-nav a{font-size:8px}.connected-page .arrival-copy{width:52%}.explorer-content{width:54%}.formula-selector{gap:24px}.portrait-copy{width:48%}.portrait-copy h2{font-size:6.7vw}.formula-edition{right:-26vw}.connected-page .invitation-room{gap:5vw}.envelope-trigger{height:230px}.invitation-letter{padding:28px}}
@media(max-width:760px){
 .connected-page .scene-section{min-height:105svh;padding:140px var(--gutter) 140px;align-items:center}
 .connected-page .arrival-copy{width:100%;max-width:460px}
 .connected-page h1{font-size:clamp(44px,15vw,100px);margin-bottom:22px}
 .connected-page.product-page h1{font-size:14.5vw}
 .arrival-copy>.eyebrow:first-child{font-size:9px;margin-bottom:24px}
 .arrival-copy .arrival-lead{font-size:clamp(27px,7.5vw,38px);margin:24px 0 20px}
 .arrival-description{max-width:290px;font-size:14px}
 .arrival-copy .descriptor{font-size:8px}
 .story-down{margin-top:23px;font-size:8px}
 .image-caption{right:var(--gutter);bottom:100px;font-size:8px;max-width:160px}
 .has-connected .world-shade{background:linear-gradient(90deg,rgba(244,238,230,.96),rgba(244,238,230,.86) 55%,rgba(244,238,230,.35))!important}
 .has-connected[data-tone=skin] .world-shade{background:linear-gradient(0deg,rgba(244,238,230,.98),rgba(244,238,230,.86) 55%,rgba(244,238,230,.3))!important}
 .has-connected .site-header{background:linear-gradient(rgba(244,238,230,.98),rgba(244,238,230,.4) 70%,transparent)!important}
 .has-connected .world-controls{height:69px}
 .has-connected .motion-control{font-size:6px;bottom:15px;right:var(--gutter)}
 .story-nav{left:var(--gutter);transform:none;gap:14px;max-width:72vw;bottom:15px}
 .story-nav a{font-size:7px;letter-spacing:.07em;gap:5px}
 .story-nav a:not([aria-current]){font-size:0;gap:0;min-width:20px;justify-content:center}
 .story-dot{width:4px;height:4px}
 .explorer-content{width:100%;max-width:none}
 .explorer-content>.eyebrow{font-size:9px}
 .formula-selector{gap:28px;margin:26px 0 29px;justify-content:space-between}
 .formula-selector button{font-size:7.1vw;padding-bottom:17px}
 .formula-selector small{font-size:8px;margin-left:3px}
 .formula-panel{min-height:310px;max-width:100%}
 .formula-panel h3{font-size:clamp(35px,10.4vw,57px);margin:25px 0 22px}
 .formula-panel>p:not(.eyebrow){font-size:14px;max-width:290px}
 .formula-descriptor{font-size:8px}
 .formula-edition{right:0;top:auto;bottom:-35px;font-size:80px;color:var(--cocoa);opacity:.3;text-shadow:none}
 .composition-note{bottom:100px;right:auto;left:var(--gutter);gap:13px}
 .composition-note p{font-size:8px}
 .composition-note .short-rule{width:25px}
 .portrait-copy{width:100%;margin-left:0;padding-top:70px}
 .portrait-copy h2{font-size:14vw;margin-bottom:27px}
 .portrait-copy>.eyebrow{font-size:9px}
 .portrait-copy>p:not(.eyebrow){font-size:16px;max-width:310px}
 .portrait-copy .standard-line{font-size:8px;margin-top:35px}
 .portrait-links{gap:28px}
 .benefit-selector{gap:24px;margin:25px 0 23px}
 .benefit-selector button{font-size:8px}
 .benefit-panel h3{font-size:28px;max-width:300px}
 .benefit-panel p{font-size:14px;max-width:300px}
 .connected-page .formula-ritual{display:block;padding-top:145px;padding-bottom:130px;background:rgba(244,238,230,.7)}
 .ritual-heading h2{font-size:13vw;margin:23px 0 28px}
 .ritual-heading>p:not(.eyebrow){font-size:15px}
 .ritual-heading>.eyebrow{font-size:9px}
 .ritual-details{margin-top:45px}
 .ritual-details summary{font-size:9px}
 .ritual-details details>p{font-size:14px}
 .companion-name{font-size:37px}
 .companion-link>.eyebrow{font-size:8px}
 .connected-page .story-invitation{padding-bottom:180px;min-height:100svh}
 .invitation-copy h2{font-size:15vw}
 .invitation-copy>.eyebrow{font-size:9px}
 .invitation-copy>p:not(.eyebrow){font-size:14px;max-width:290px}
 .journey-footer{bottom:90px;gap:12px;flex-wrap:wrap;font-size:8px}
 .journey-footer>a:last-child{margin-left:auto}
 .connected-page .invitation-room{display:block;padding-top:145px;padding-bottom:165px;min-height:120svh}
 .invitation-intro h1{font-size:15vw;margin-bottom:24px}
 .invitation-intro>.eyebrow{font-size:9px;max-width:230px}
 .invitation-intro>p:last-child{font-size:12px}
 .invitation-object{margin-top:60px;max-width:420px}
 .envelope-trigger{height:190px;margin-top:40px}
 .envelope-paper .wordmark{font-size:22px}
 .envelope-paper .eyebrow{font-size:6px}
 .envelope-seal{height:40px;width:40px;font-size:22px}
 .invitation-object.is-open .envelope-trigger{margin-top:90px;height:130px}
 .invitation-letter{padding:29px 25px}
 .invitation-letter h2{font-size:42px}
 .invitation-letter p:not(.eyebrow){font-size:13px}
 .invitation-object.is-open .envelope-paper .wordmark{font-size:20px}
}
@media(max-height:690px) and (max-width:760px){.connected-page .scene-section{padding-top:120px}.image-caption{display:none}.connected-page .invitation-room{padding-top:125px}.connected-page .arrival-copy .story-down{margin-top:15px}}
@media(prefers-reduced-motion:reduce){.has-connected [data-enter].awaiting-entry{opacity:1;transform:none}.route-veil{display:none}}
@media print{.story-nav,.route-veil{display:none}.connected-page .scene-section{min-height:0;padding:35px;display:block;background:white!important;color:#2f1e18}.arrival-copy,.explorer-content,.portrait-copy{width:100%!important}.formula-panel[hidden],.benefit-panel[hidden],.invitation-letter[hidden]{display:block!important}.image-caption,.composition-note,.envelope-trigger{display:none}.journey-footer{position:static;color:#2f1e18}.connected-page .story-invitation{color:#2f1e18}}