@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=DM+Sans:wght@400;500;600&display=swap');
:root{--cream:#f5f0e6;--ink:#263d35;--gold:#a88a53}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}header{height:85px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid #263d3525}.brand{font-family:'Cormorant Garamond',serif;font-size:28px;letter-spacing:3px}.brand span{color:var(--gold);font-size:20px}nav{display:flex;gap:28px}nav button,footer,.eyebrow{font-size:10px;letter-spacing:2px;text-transform:uppercase}nav button{padding:12px 0}#menu{font-size:20px}main{min-height:calc(100svh - 150px)}footer{min-height:65px;padding:14px 5vw;display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #263d3525}footer button{font-size:10px;letter-spacing:1px}#controls{display:flex;align-items:center;gap:25px}#controls button{font-size:22px}#progress{height:3px;background:var(--gold);position:fixed;bottom:0;left:0;z-index:5;transition:width .3s}.eyebrow{color:var(--gold);margin-bottom:22px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400}h1{font-size:clamp(45px,6vw,90px);line-height:.97}h2{font-size:clamp(38px,4vw,65px);line-height:1.05}p.text{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(24px,2.15vw,32px);line-height:1.36}.home{min-height:calc(100svh - 150px);display:grid;grid-template-columns:55% 45%}.invitation{padding:0;display:block;position:relative;overflow:hidden}.envelope{width:100%;height:100%;min-height:580px;padding:0;display:block;position:relative}.envelope img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transition:transform .8s}.envelope:hover img{transform:scale(1.025)}.envelope span{position:absolute;bottom:35px;left:35px;color:#fff;font-size:11px;letter-spacing:2px;text-transform:uppercase;border-bottom:1px solid #fff;padding-bottom:8px;text-shadow:0 1px 5px #000}.intro{padding:7vh 5vw;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:30px}.intro h1 em{font-weight:400}.cta{border-bottom:1px solid var(--gold);padding:12px 0;font-size:12px;letter-spacing:1px;align-self:flex-start;text-align:left;line-height:1.5}.cta.narrative{font-family:'Cormorant Garamond',serif;font-size:clamp(24px,2vw,30px);font-style:italic;letter-spacing:0}.spread{display:grid;grid-template-columns:43% 57%;min-height:calc(100svh - 150px)}.photo{position:relative;overflow:hidden;background:#253c33;min-height:500px}.photo img{width:100%;height:100%;position:absolute;object-fit:cover}.photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#142d2b66,transparent 50%)}.photo .caption{position:absolute;z-index:1;bottom:35px;left:35px;color:var(--cream);font-size:10px;letter-spacing:3px;text-transform:uppercase}.copy{padding:5vh 5vw;display:flex;flex-direction:column;justify-content:center;gap:23px}.copy .eyebrow{margin:0}.copy .links{display:flex;gap:25px;flex-wrap:wrap}.copy .links button{font-size:11px;border-bottom:1px solid #b7a37a;padding-bottom:6px}.dense .copy{padding:4vh 5vw;gap:18px}.dense p.text{font-size:clamp(21px,1.75vw,27px);line-height:1.36}.text p+p{margin-top:16px}.break{background:var(--ink);color:var(--cream);padding:9vh 13vw;min-height:calc(100svh - 150px);display:flex;flex-direction:column;justify-content:center;gap:30px}.break p.text{font-size:clamp(28px,3vw,44px);max-width:1000px}.hub{padding:5vh 7vw 6vh}.hubtop{display:flex;justify-content:space-between;align-items:end;margin-bottom:4vh}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.card{text-align:left;padding:0;transition:transform .3s}.card:hover{transform:translateY(-5px)}.card figure{height:29vh;min-height:180px;margin:0 0 20px;position:relative;overflow:hidden;background:#dcd3c2}.card img{width:100%;height:100%;object-fit:cover;transition:transform .6s}.card:hover img{transform:scale(1.04)}.card .eyebrow{margin:12px 0;font-size:9px}.card h3{font-size:30px}.cards.people{grid-template-columns:repeat(4,1fr)}.people .card figure{height:38vh}.portrait img{object-position:center 25%}.people .card:first-child img{object-position:center 15%}.people .card:last-child img{object-position:58% center}.agent p.text{font-size:clamp(19px,1.5vw,23px);line-height:1.6}.agent .copy h2{margin-bottom:0}.agent .photo{background:#e7dfd0}.hub .cta{margin-top:30px}dialog{border:1px solid #a88a53;background:var(--cream);color:var(--ink);padding:50px;width:min(820px,92vw);max-height:85vh}dialog::backdrop{background:#14251ed9;backdrop-filter:blur(5px)}#close{position:absolute;top:12px;right:16px;font-size:28px}#dialogbody h2{margin-bottom:25px}#dialogbody p{font-size:18px;line-height:1.6;margin:20px 0}#dialogbody a{color:inherit;display:block;padding:12px 0;overflow-wrap:anywhere}.indexitem{display:block;text-align:left;padding:15px 0;border-bottom:1px solid #ccc;width:100%}@media(max-width:760px){header{height:auto;min-height:75px;padding:15px 5vw;gap:16px;flex-wrap:wrap}nav{order:3;width:100%;justify-content:space-between;gap:12px}nav button{font-size:8px;letter-spacing:1px;padding:0}.brand{font-size:22px}.home,.spread{grid-template-columns:1fr}.envelope{min-height:42vh}.intro{padding:35px 8vw 45px;gap:22px}.intro h1{font-size:52px}.photo{min-height:32vh}.copy,.dense .copy{padding:30px 8vw 40px}.dense p.text,p.text{font-size:24px}.cards,.cards.people{grid-template-columns:1fr 1fr;gap:25px 18px}.card h3{font-size:24px}.card figure,.people .card figure{height:25vh;min-height:170px}.hub{padding:35px 7vw}.hubtop{display:block}.hubtop .eyebrow{margin-top:15px}.break{padding:50px 9vw;min-height:70vh}footer{font-size:8px;letter-spacing:1px;padding:15px 5vw}#controls{gap:15px}dialog{padding:45px 25px}.agent .photo{min-height:50vh}.agent .photo img{object-position:center 25%}.agent p.text{font-size:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.zodiac{font-family:Georgia,serif;font-size:.48em;color:var(--gold);vertical-align:middle;margin-left:8px;font-weight:400}

.cast-0 img{object-position:40% center}.cast-1 img{object-position:center 12%}.cast-2 img{object-position:center 30%}.cast-3 img{object-position:center 20%}.people .card:first-child img{object-position:40% center}.people .card:last-child img{object-position:center 20%}

.people .card:nth-child(2) img,.cast-1 img{object-position:center top}

.cards:not(.people) .card{align-self:start}.cards:not(.people) .card img{object-position:center 22%}

/* Gentle spread changes keep the navigation frame stable. */
#app{view-transition-name:pitch-page}
::view-transition-old(root),::view-transition-new(root){animation:none}
::view-transition-old(pitch-page){animation:page-out 220ms ease both}
::view-transition-new(pitch-page){animation:page-in 440ms cubic-bezier(.22,.61,.36,1) both}
@keyframes page-out{to{opacity:0}}
@keyframes page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.copy>.eyebrow,.copy>h2,.copy>.text,.copy>.cta,.intro>*,.hubtop{animation:content-in 500ms ease both}
.copy>.text{animation-delay:60ms}.copy>.cta{animation-delay:100ms}
@keyframes content-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
dialog[open]{animation:content-in 220ms ease both}
.cta,.links button{transition:color .2s,border-color .2s}
.cta:hover,.links button:hover{color:var(--gold)}
.people .card:nth-child(2) img,.cast-1 img{object-position:50% center}
.break:has(.eyebrow:first-child) p.text{font-size:clamp(26px,2.4vw,36px)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}::view-transition-old(pitch-page),::view-transition-new(pitch-page){animation:none!important}}
.cards:not(.people) .card:nth-child(2) img{object-position:center 70%}

/* Title and author credits follow the original invitation typography. */
.intro h1{font-size:clamp(34px,3.3vw,60px);letter-spacing:.08em;line-height:1.25;white-space:nowrap}
.intro h1 span{font-size:.7em;color:var(--gold)}
.creator-link{font-size:11px;line-height:1.7;letter-spacing:.3px;text-align:left;padding:0;border-bottom:1px solid #a88a5360;margin-top:-16px}
.pitch-note{padding:6px 5vw 10px;text-align:center;font-size:9px;line-height:1.5;color:#536058;border-top:1px solid #263d3514}
.pitch-note span{white-space:nowrap;margin-left:12px}
.creators{padding:5vh 6vw}.creators>.eyebrow{margin-bottom:14px}.creators>h2{margin-bottom:35px}
.creator-grid{display:grid;grid-template-columns:1fr 1fr;gap:5vw}.creator{display:grid;grid-template-columns:36% 1fr;gap:24px;align-items:start}
.creator img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 22%}.creator:last-child img{object-position:48% center}
.creator h3{font-size:30px;margin:0 0 18px}.creator p{font-family:'Cormorant Garamond',Georgia,serif;font-size:21px;line-height:1.5}.creators>.cta{margin-top:35px}
@media(max-width:1050px){.creator{grid-template-columns:1fr}.creator img{max-width:240px;height:260px}.intro h1{font-size:3.1vw}}
@media(max-width:760px){.intro h1{font-size:clamp(25px,7vw,48px)}.creator-grid{grid-template-columns:1fr;gap:40px}.creator{grid-template-columns:120px 1fr;gap:20px}.creator img{height:170px}.creator h3{font-size:27px}.creator p{font-size:20px}.pitch-note span{display:block;margin-left:0}}
@media(max-width:420px){.creator{grid-template-columns:1fr}.creator img{width:160px;height:200px}}

@media(min-width:761px){main,.home,.spread,.break{min-height:calc(100svh - 180px)}}

/* Final title refinement. */
.intro h1{font-style:italic;font-size:clamp(34px,3.9vw,70px);letter-spacing:.025em}
@media(min-width:761px) and (max-width:1050px){.intro h1{font-size:3.7vw}}
@media(max-width:760px){.intro h1{font-size:clamp(28px,8vw,55px)}}
