/* Portrait-led opening. Keep all hero styles scoped to this section. */
.site-header{position:absolute;inset:18px 24px auto;height:70px;padding:0 25px;border:1px solid #221b2526;background:#f7f0e4f0;backdrop-filter:blur(16px);z-index:20}
.header-contact{border:0;background:var(--ink);color:var(--paper);padding:12px 18px}.header-contact:hover{background:#674398;color:#fff}
.vibe-opening{height:260svh;position:relative;background:#ee784b;color:#261c29;--hero-cream:#fff1d9;--hero-lilac:#c5b2ea}
.opening-stage{height:100svh;min-height:420px;position:sticky;top:0;overflow:hidden;isolation:isolate;--progress:0;--turn:0deg}
.opening-stage:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 38% 0%,#ffd49a80,transparent 65%),linear-gradient(115deg,transparent 55%,#e6623c66)}
.opening-meta{position:absolute;top:113px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;gap:20px;z-index:6;font-size:8px;letter-spacing:1.4px;font-weight:600}.opening-meta>span:first-child{display:flex;align-items:center;gap:8px}.opening-meta .status-dot{background:#261c29}
.opening-copy{position:absolute;left:var(--gutter);top:49%;width:44%;transform:translateY(-42%);z-index:5;pointer-events:none}
.opening-eyebrow{font-size:9px;letter-spacing:2.2px;font-weight:600;margin-bottom:19px;display:flex;align-items:center;gap:12px}.opening-eyebrow:before{content:'';width:24px;height:1px;background:currentColor}
.opening-title{font-family:var(--display);font-size:clamp(65px,min(12.8vw,18svh),210px);font-weight:800;line-height:.79;letter-spacing:-.025em}
.opening-title>span{display:block;white-space:nowrap}.opening-title>span+span{margin-top:.06em}.opening-title .title-vibe{font-size:.82em;line-height:.95;color:#48265f;letter-spacing:-.025em;margin-top:.08em}
.opening-description{font-size:12px;line-height:1.6;max-width:240px;margin-top:23px;font-weight:500}
.portrait-world{position:absolute;inset:0;perspective:1500px;perspective-origin:50% 52%;pointer-events:none}
.portrait-halo{position:absolute;left:70%;top:53%;width:min(48vw,76svh);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:var(--hero-lilac);box-shadow:inset -25px -22px 70px #8662ae36;z-index:0}
.halo-line{position:absolute;inset:7%;border:1px solid #fff1d963;border-radius:50%}.halo-line:nth-child(2){inset:16%}.halo-line:nth-child(3){inset:25%}
.orbit-ring{position:absolute;left:70%;top:53%;width:0;height:0;transform-style:preserve-3d;transform:rotateX(-13deg) rotateY(-24deg);z-index:2;will-change:transform}
.orbit-panel{position:absolute;left:0;top:0;width:clamp(76px,min(12vw,20svh),185px);aspect-ratio:4/5;transform-style:preserve-3d;transform:translate(-50%,-50%) rotateY(calc(var(--panel)*36deg)) translateZ(min(18vw,25svh))}
.orbit-face,.orbit-back{position:absolute;inset:0;backface-visibility:hidden;overflow:hidden;background:#261c29;box-shadow:0 8px 18px #381b3333;display:flex;flex-direction:column;border:4px solid var(--hero-cream)}
.orbit-face img{height:100%;object-fit:cover}.orbit-face>span{position:absolute;bottom:0;left:0;right:0;padding:16px 7px 6px;background:linear-gradient(transparent,#000b);color:#fff;font-size:6px;letter-spacing:.6px}
.orbit-type .orbit-face{background:#dce799;color:#261c29;padding:10px;justify-content:space-between;border-color:#dce799}.orbit-type:nth-child(4) .orbit-face{background:#633c92;border-color:#633c92;color:var(--hero-cream)}.orbit-type:nth-child(6) .orbit-face{background:#fff1d9;border-color:#fff1d9}
.orbit-type .orbit-face>span{position:static;padding:0;background:none;color:inherit;font-size:5px;line-height:1.4}.orbit-type strong{font-family:var(--display);font-size:clamp(30px,min(5vw,8.5svh),80px);font-weight:700;line-height:.8;letter-spacing:-.03em}.orbit-type i{font-style:normal;font-size:7px;letter-spacing:1px}
.orbit-back{transform:rotateY(180deg);background:#633c92;border-color:#c5b2ea;color:var(--hero-cream);align-items:center;justify-content:space-around;padding:8px}.orbit-back span{font-size:6px;letter-spacing:.6px}.orbit-back b{font-size:clamp(35px,6vw,90px);font-weight:400;color:#dce799}
.hero-portrait{position:absolute;left:0;top:0;width:min(30vw,47svh);aspect-ratio:3/4;z-index:4;transform-style:preserve-3d;transform:translate(-50%,-50%) translateZ(calc(min(18vw,25svh) + 40px)) rotateZ(-6deg) scale(.94);will-change:transform}
.portrait-face{position:absolute;inset:0;backface-visibility:hidden;background:var(--hero-cream);padding:7px 7px 0;box-shadow:9px 15px 0 #261c291c,0 18px 34px #38203738;display:flex;flex-direction:column}
.portrait-face img{height:calc(100% - 34px);min-height:0;flex:1;object-fit:cover;object-position:46% 29%}
.portrait-caption{height:34px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:7px;font-weight:700;letter-spacing:.6px;padding:0 5px}.portrait-caption b{font-size:18px;font-weight:400}
.portrait-reverse{transform:rotateY(180deg);background:#dce799}.portrait-reverse img{object-position:50% 27%}
.portrait-stamp{position:absolute;left:79%;top:23%;width:92px;height:92px;background:#dce799;color:#261c29;border-radius:50%;display:grid;place-content:center;text-align:center;font-size:9px;font-weight:700;line-height:1.4;letter-spacing:.7px;transform:rotate(13deg);z-index:5;box-shadow:3px 4px 0 #261c2915}.portrait-stamp b{font-size:23px;font-weight:400;line-height:1.1;margin-bottom:3px}
.opening-side{position:absolute;right:var(--gutter);bottom:109px;display:flex;align-items:center;gap:14px;font-size:7px;letter-spacing:1px;z-index:6}.rotation-readout{font-variant-numeric:tabular-nums;min-width:32px}
.opening-bottom{position:absolute;bottom:25px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:22px;z-index:7;padding-top:18px;border-top:1px solid #261c2933}
.opening-actions{display:flex;gap:22px;align-items:center}.opening-cta{display:flex;align-items:center;gap:35px;background:#261c29;color:var(--hero-cream);padding:16px 18px;font-size:9px;font-weight:600;letter-spacing:.5px;transition:background .2s,transform .2s}.opening-cta b{font-size:23px;line-height:1;font-weight:400}.opening-cta:hover{background:#633c92;transform:translateY(-3px)}.opening-records{font-size:9px;border-bottom:1px solid currentColor;padding:12px 0}.opening-records:hover{color:#fff1d9}
.opening-cue{display:flex;gap:10px;align-items:center;font-size:8px;line-height:1.7;letter-spacing:1px}.opening-cue small{font-size:6px;letter-spacing:.8px}.scroll-orbit{font-size:30px;display:block;transform:rotate(var(--turn))}.touch-cue{display:none}.opening-motion{display:flex;align-items:center;gap:5px;font-size:9px;background:none;padding:14px 0 14px 12px;min-height:44px}.opening-motion .motion-indicator{background:#261c29}
.opening-stage a:focus-visible,.opening-stage button:focus-visible{outline-color:#fff1d9}.opening-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:#261c2914}.opening-progress i{display:block;height:100%;background:#633c92;transform-origin:left;transform:scaleX(var(--progress))}
@media(min-width:761px) and (max-height:650px){.opening-meta{top:101px}.opening-eyebrow{margin-bottom:13px;font-size:7px}.opening-copy{top:48%;transform:translateY(-40%)}.opening-title{font-size:min(12.8vw,18svh)}.opening-description{margin-top:16px;font-size:10px;max-width:200px}.portrait-stamp{top:24%;width:70px;height:70px;font-size:7px}.portrait-stamp b{font-size:19px}.opening-bottom{bottom:16px;padding-top:12px}.opening-cta{padding:13px 16px}.opening-side{bottom:88px}.hero-portrait{width:min(30vw,43svh)}.portrait-halo{width:min(48vw,68svh)}}
@media(max-width:1000px) and (min-width:761px){.opening-records{display:none}.opening-cue{font-size:7px}}
@media(max-width:760px){
.site-header{inset:12px 14px auto;height:62px;padding:0 14px}.header-contact{padding:11px 12px;margin-right:16px;font-size:8px}.header-contact span{margin-left:9px}.mobile-nav{top:84px;left:14px;right:14px;border:1px solid var(--line)}
.opening-stage{min-height:420px}.opening-meta{top:92px;font-size:6px;letter-spacing:.7px}.opening-meta>span:last-child{display:none}
.opening-copy{left:var(--gutter);right:var(--gutter);top:119px;transform:none;width:auto}.opening-eyebrow{display:none}.opening-title{font-size:min(18.5vw,9.4svh);line-height:.84;letter-spacing:-.02em}.opening-title>span{display:inline}.opening-title>span+span{margin:0}.opening-title .title-vibe{display:block;font-size:1em;margin-top:.08em;color:#48265f}.opening-description{display:none}
.portrait-world{inset:0;perspective:950px}.portrait-halo{left:50%;top:57%;width:min(83vw,44svh)}.hero-portrait{width:min(53vw,29svh)}.orbit-ring{left:50%;top:57%}.orbit-panel{width:min(23vw,15svh)}.orbit-type strong{font-size:min(10vw,7svh)}.orbit-back b{font-size:12vw}.orbit-back span{font-size:5px}.portrait-face{padding:5px 5px 0}.portrait-caption{height:27px;font-size:5px;padding:0 3px}.portrait-caption b{font-size:16px}.portrait-face img{height:calc(100% - 27px)}.orbit-face,.orbit-back{border-width:3px}.orbit-face>span{font-size:4px}.orbit-type .orbit-face{padding:7px}.orbit-type .orbit-face>span{font-size:4px}
.portrait-stamp{left:72%;top:38%;height:65px;width:65px;font-size:6px}.portrait-stamp b{font-size:18px}.opening-side{bottom:127px;right:var(--gutter);font-size:6px}.opening-side>span:first-child{display:none}
.opening-bottom{bottom:17px;padding-top:13px;gap:8px;flex-wrap:wrap}.opening-actions{width:100%;justify-content:space-between;gap:15px}.opening-cta{padding:14px;font-size:8px;gap:18px;min-height:46px}.opening-records{font-size:8px}.opening-cue{font-size:6px;gap:7px}.opening-cue small{display:none}.scroll-orbit{font-size:22px}.opening-motion{font-size:8px;padding:4px 0 4px 12px;min-height:36px}
}
@media(max-width:760px) and (max-height:650px){
.opening-meta{top:87px;font-size:5px}.opening-copy{top:106px}.opening-title{font-size:min(17.5vw,9.4svh)}.portrait-world{inset:0}.portrait-halo{top:57%;width:43svh}.orbit-ring{top:57%}.hero-portrait{width:26svh}.orbit-panel{width:14svh}.portrait-stamp{top:36%;left:70%;width:51px;height:51px;font-size:5px}.portrait-stamp b{font-size:15px}.opening-side{display:none}.opening-bottom{bottom:9px;padding-top:9px;gap:1px}.opening-cta{min-height:40px;padding:9px 11px;font-size:7px;gap:12px}.opening-cta b{font-size:20px}.opening-records{font-size:7px}.opening-motion{min-height:30px;font-size:7px}.opening-cue{font-size:5px}.scroll-orbit{font-size:19px}
}
@media(pointer:coarse){.mouse-cue{display:none}.touch-cue{display:inline}}
body:not(.js-motion) .vibe-opening,.motion-paused .vibe-opening{height:auto}.motion-paused .opening-stage{position:relative}.motion-paused .opening-cue,body:not(.js-motion) .opening-cue{visibility:hidden}.motion-paused .orbit-ring,.motion-paused .hero-portrait{will-change:auto}
@media(prefers-reduced-motion:reduce){.vibe-opening{height:auto}.opening-stage{position:relative}.opening-cue{visibility:hidden}.orbit-ring,.hero-portrait{will-change:auto}}

/* The opening gathers from a portrait sleeve into a full-viewport carousel. */
.opening-color-shift{position:absolute;inset:0;background:#c5b2ea;opacity:var(--gather,0);z-index:-1}
.opening-stage{--gather:0;user-select:none}
.opening-copy{opacity:calc(1 - var(--gather));translate:calc(var(--gather)*-50px) 0}
.opening-chapter{position:absolute;top:14%;left:var(--gutter);right:var(--gutter);text-align:center;pointer-events:none;z-index:1;opacity:var(--gather,0);transform:translateY(calc((1 - var(--gather,0))*25px))}
.opening-chapter>span{font-size:8px;letter-spacing:2px;font-weight:600}.opening-chapter p{font-family:var(--display);font-weight:800;font-size:min(10vw,12svh);line-height:.9;letter-spacing:-.02em;margin-top:12px}.opening-chapter em{color:#48265f;font-style:normal}
.orbit-ring{z-index:3}.hero-portrait{z-index:auto}.orbit-panel{z-index:auto}
@media(max-width:760px){.opening-copy{translate:0 calc(var(--gather)*-20px)}.opening-chapter{top:20%;left:16px;right:16px}.opening-chapter p{font-size:10.5vw;margin-top:10px}.opening-chapter>span{font-size:6px;letter-spacing:1px}}
@media(max-width:760px) and (max-height:650px){.opening-chapter{top:20%}.opening-chapter p{font-size:10.5vw;margin-top:8px}.opening-chapter>span{font-size:5px}}

/* Keep the rotation annotation in the outer margin, clear of the portrait. */
.opening-side{top:37%;bottom:auto;right:18px;writing-mode:vertical-rl;gap:15px}
@media(max-width:760px){.opening-side{display:none}}
