/* Vancouver Character Events: actual project material, an inspectable booking journey. */
#project-vancouver-character-events { margin-bottom:76px; padding:0 0 50px; border-bottom:1px solid var(--rule); }
#project-vancouver-character-events .showcase__frame { position:relative; padding:0; border:0; border-radius:3px; background:#f2e8d7; }
#project-vancouver-character-events .showcase__frame img { border-radius:3px; aspect-ratio:1.1; object-fit:cover; object-position:74% center; }
#project-vancouver-character-events .showcase__frame::after { content:'VANCOUVER CHARACTER EVENTS'; position:absolute; bottom:20px; left:20px; right:20px; background:#fff7e9e8; padding:16px; font:11px var(--font-mono); letter-spacing:.13em; }
#project-vancouver-character-events .showcase__copy .h2 { max-width:12ch; font-size:clamp(36px,4.3vw,65px); }
#project-vancouver-character-events .showcase__copy .tag { background:var(--ink); color:var(--cream); }
.vce-kicker { font:11px/1.5 var(--font-mono); text-transform:uppercase; letter-spacing:.12em; }
.vce-intro { padding-block:80px 40px; display:grid; grid-template-columns:1.2fr 1fr; gap:50px; align-items:end; }
.vce-intro h1 { font:800 clamp(48px,5.9vw,86px)/.97 var(--font-display); letter-spacing:-.055em; margin-top:24px; max-width:12ch; }
.vce-intro .turn { color:#714d79; font-size:.95em; line-height:.97; letter-spacing:-.03em; }
.vce-chapter h2 .turn { font-size:.95em; line-height:1; }
.vce-intro__copy { padding-bottom:5px; }
.vce-intro__copy p { max-width:43ch; font-size:19px; }
.vce-intro__links { display:flex; flex-wrap:wrap; gap:24px; margin-top:24px; font-size:14px; }
.vce-cover { position:relative; overflow:hidden; background:#d7cabc; }
.vce-cover img { width:100%; aspect-ratio:1.85; object-fit:cover; object-position:65% center; }
.vce-cover figcaption { position:absolute; left:30px; bottom:28px; color:#fff; background:#161328e8; padding:16px 22px; max-width:calc(100% - 60px); }
.vce-cover figcaption b { display:block; font:500 clamp(23px,3vw,40px)/1.1 var(--font-aside); }
.vce-cover figcaption span { font:10px var(--font-mono); text-transform:uppercase; letter-spacing:.08em; }
.vce-scope { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; padding:32px 0 50px; border-bottom:1px solid var(--rule); }
.vce-scope dt { font:11px var(--font-mono); text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.vce-scope dd { margin:10px 0 0; font-size:16px; max-width:35ch; }
.vce-chapter { padding-block:75px; scroll-margin-top:80px; }
.vce-chapter__head { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:end; margin-bottom:30px; }
.vce-chapter h2 { font:800 clamp(36px,4.7vw,68px)/1 var(--font-display); letter-spacing:-.045em; max-width:14ch; margin-top:15px; }
.vce-chapter__head > p { max-width:44ch; color:var(--muted); font-size:18px; }
.vce-world { background:#172535; color:#fff4df; display:grid; grid-template-columns:1.35fr 1fr; }
.vce-world__image { position:relative; min-height:475px; overflow:hidden; }
.vce-world__image img { width:100%; height:100%; position:absolute; object-fit:cover; object-position:68% center; }
.vce-world__copy { padding:clamp(25px,4vw,54px); align-self:center; }
.vce-world__copy h3 { font:500 40px/1 var(--font-aside); margin:25px 0 20px; }
.vce-world__copy p { font-size:16px; color:#d4d4d7; }
.vce-world__switch { display:flex; flex-wrap:wrap; gap:8px; }
.vce-world__switch button { min-height:44px; padding:9px 13px; border:1px solid #ffffff60; border-radius:0; font-size:12px; }
.vce-world__switch button[aria-pressed="true"] { color:#242436; background:#f6e6cb; border-color:#f6e6cb; }
.vce-world__switch button:focus-visible { outline-color:#ffdca1; }
.vce-world__copy a { display:inline-block; color:#fff4df; margin-top:25px; font-size:14px; }
.vce-booking { padding:clamp(24px,4vw,52px); background:#efe6d6; color:#282532; border:1px solid #d5c7af; }
.vce-booking__steps { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; border-bottom:1px solid #b5a587; margin-bottom:34px; }
.vce-booking__steps button { min-height:62px; padding:0 0 18px; text-align:left; border-bottom:3px solid transparent; font-size:15px; }
.vce-booking__steps button[aria-pressed="true"] { border-color:#835773; }
.vce-booking__steps button small { display:block; font:10px var(--font-mono); margin-bottom:7px; color:#705d4b; }
.vce-booking__grid { display:grid; grid-template-columns:1fr .85fr; gap:clamp(28px,6vw,80px); align-items:start; }
.vce-booking__panel h3 { font:600 30px/1.1 var(--font-aside); margin-bottom:14px; }
.vce-booking__panel { scroll-margin-top:80px; }
.vce-booking__panel > p { max-width:43ch; font-size:15px; color:#655952; margin-bottom:24px; }
.vce-cast { display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:390px; }
.vce-cast button { position:relative; text-align:left; background:#fff8ee; border:1px solid #bfae96; padding:8px 8px 13px; }
.vce-cast button[aria-pressed="true"] { border:2px solid #835773; padding:7px 7px 12px; }
.vce-cast button img { width:100%; height:200px; object-fit:cover; object-position:50% 20%; }
.vce-cast button span { display:block; font-size:14px; margin:10px 4px 0; }
.vce-cast button i { position:absolute; top:16px; right:16px; width:25px; height:25px; background:#fff; border-radius:50%; display:grid; place-items:center; font-size:14px; font-style:normal; }
.vce-cast button[aria-pressed="true"] i { color:white; background:#835773; }
.vce-booking__options { display:flex; flex-wrap:wrap; gap:10px; }
.vce-booking__options button { border:1px solid #b5a587; min-height:49px; padding:12px 17px; background:#fff7e9; }
.vce-booking__options button[aria-pressed="true"] { background:#523949; color:white; border-color:#523949; }
.vce-booking__aside { font-size:14px; color:#655952; margin-top:24px; }
.vce-receipt { background:#fffdf6; padding:clamp(22px,3vw,36px); box-shadow:0 12px 30px #69574516; border-top:4px solid #835773; }
.vce-receipt h3 { font:500 32px var(--font-aside); margin:10px 0 26px; }
.vce-receipt dl > div { padding:14px 0; border-bottom:1px dashed #c8bbad; }
.vce-receipt dt { font:10px var(--font-mono); color:#79695a; text-transform:uppercase; letter-spacing:.06em; }
.vce-receipt dd { margin:7px 0 0; font-size:16px; }
.vce-receipt__note { font:italic 20px/1.25 var(--font-aside); margin-top:23px; color:#735270; }
.vce-booking__bottom { margin-top:28px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:15px; align-items:center; }
.vce-booking__next { padding:11px 17px; min-height:46px; color:white; background:#523949; }
.vce-booking__reset { padding:10px 0; min-height:44px; text-decoration:underline; font-size:14px; }
.vce-booking__disclosure { border-top:1px solid #c8bbad; padding-top:22px; margin-top:25px; color:#655952; font-size:13px; max-width:80ch; }
.vce-proof { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; padding-top:35px; }
.vce-proof > div { border-top:2px solid var(--ink); padding-top:20px; }
.vce-proof h3 { font:700 23px/1.1 var(--font-display); letter-spacing:-.02em; margin-bottom:15px; }
.vce-proof p { color:var(--muted); font-size:15px; }
.vce-close { padding:55px 0 90px; border-top:1px solid var(--rule); }
.vce-close h2 { font:800 clamp(36px,4vw,62px)/1 var(--font-display); letter-spacing:-.04em; max-width:17ch; }
.vce-close p { max-width:58ch; margin:22px 0; color:var(--muted); }
[data-vce-panel][hidden] { display:none; }
@media (max-width:900px) {
 .vce-intro,.vce-chapter__head { grid-template-columns:1fr; gap:25px; }
 .vce-intro { padding-top:55px; }
 .vce-intro h1 { max-width:14ch; }
 .vce-world { grid-template-columns:1fr; }
 .vce-world__image { min-height:360px; }
 .vce-booking__grid { grid-template-columns:1fr; }
 .vce-booking__panel { min-height:280px; }
 .vce-scope,.vce-proof { grid-template-columns:1fr; gap:25px; }
 .vce-scope dd { max-width:none; }
 .vce-cover img { aspect-ratio:1.15; object-position:72% center; }
}
@media (max-width:500px) {
 .vce-intro h1 { font-size:49px; }
 .vce-intro__copy p { font-size:17px; }
 .vce-cover figcaption { left:15px; bottom:15px; padding:12px; max-width:calc(100% - 30px); }
 .vce-world__image { min-height:290px; }
 .vce-world__copy { padding:26px; }
 .vce-world__copy h3 { font-size:34px; }
 .vce-chapter { padding-block:50px; }
 .vce-booking { margin-inline:calc(-1 * var(--margin)); padding:24px var(--margin); }
 .vce-booking__steps { gap:10px; }
 .vce-booking__steps button { font-size:12px; }
 .vce-cast button img { height:170px; }
 .vce-booking__panel { min-height:250px; }
}
