/* Original scenery openings. Native hidden always wins over the presentation. */
.ci-opening{--ci-style-ready:1;--ci-gold:#cfb477;--ci-ink:#fff8e7;position:fixed;inset:0;z-index:10000;isolation:isolate;overflow:hidden;background:#30281f;color:var(--ci-ink);font-family:Georgia,'Times New Roman',serif;opacity:1;transition:opacity 900ms ease;min-height:100svh}
.ci-opening[hidden]{display:none!important}
.ci-opening *{box-sizing:border-box}
.ci-opening-active,.ci-opening-active body{overflow:hidden!important;overscroll-behavior:none}
.ci-opening .ci-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;filter:brightness(.78);transform:scale(1.04);transition:filter 3s ease,transform 5s cubic-bezier(.2,.6,.2,1)}
.ci-opening .ci-atmosphere{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#15171082,transparent 46%,#17150f80);pointer-events:none;transition:opacity 3s ease}
.ci-opening .ci-intro{position:absolute;z-index:4;top:max(12%,84px);left:8%;right:8%;text-align:center;pointer-events:none;text-shadow:0 2px 20px #160e0980;transition:opacity 650ms ease,transform 1s ease}
.ci-opening .ci-eyebrow{font:500 10px/1.5 Arial,sans-serif;text-transform:uppercase;letter-spacing:.28em;margin:0 0 15px}
.ci-opening h2{font:italic 400 clamp(18px,3.4vw,27px)/1.4 Georgia,serif;letter-spacing:0;margin:0 auto 15px;max-width:26ch;color:inherit}
.ci-opening .ci-couple{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:.28em;font:400 clamp(29px,7vw,54px)/1.13 Georgia,serif;margin:0 auto 14px;max-width:25ch;overflow-wrap:anywhere}
.ci-opening .ci-couple i{font-size:.68em;font-weight:400}
.ci-opening .ci-date{font:400 10px/1.5 Arial,sans-serif;letter-spacing:.17em;text-transform:uppercase;margin:0}
.ci-opening .ci-open{appearance:none;position:absolute;inset:0;display:block;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;z-index:2;touch-action:manipulation;font:inherit}
.ci-opening .ci-open:focus-visible{outline:2px solid var(--ci-gold);outline-offset:-16px}
.ci-opening .ci-open[aria-disabled=true]{cursor:default}
.ci-opening .ci-set{position:absolute;inset:0;display:block;perspective:1600px;pointer-events:none;overflow:hidden}
.ci-opening .ci-cue{position:absolute;bottom:max(13%,92px);left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:18px;max-width:86%;min-height:52px;padding:14px 23px;border:1px solid #fff6d66b;border-radius:99px;background:#21191254;backdrop-filter:blur(9px);white-space:nowrap;font:400 12px/1.4 Arial,sans-serif;letter-spacing:.035em;box-shadow:0 6px 30px #120e0b1a;transition:opacity 500ms ease,transform 700ms ease}
.ci-opening .ci-cue svg{flex-shrink:0}
.ci-opening .ci-skip{position:absolute;z-index:10;top:max(14px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:center;gap:8px;min-width:44px;min-height:44px;padding:8px 13px;border:1px solid #ffffff40;border-radius:99px;color:inherit;background:#24190e4d;backdrop-filter:blur(10px);font:400 11px/1.5 Arial,sans-serif;cursor:pointer}
.ci-opening .ci-skip:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.ci-opening .ci-brand{position:absolute;bottom:max(25px,env(safe-area-inset-bottom));left:0;right:0;z-index:4;text-align:center;margin:0;font:400 17px/1.4 Georgia,serif;opacity:.8;pointer-events:none}
.ci-opening .ci-brand i{font-weight:400}
.ci-opening:is([data-state=opening],[data-state=leaving]) .ci-intro{opacity:0;transform:translateY(-10px)}
.ci-opening:is([data-state=opening],[data-state=leaving]) .ci-cue{opacity:0;transform:translate(-50%,12px);pointer-events:none}
.ci-opening:is([data-state=opening],[data-state=leaving]) .ci-backdrop{filter:brightness(1);transform:scale(1)}
.ci-opening:is([data-state=opening],[data-state=leaving]) .ci-atmosphere{opacity:.25}
.ci-opening[data-state=leaving]{opacity:0}
.ci-opening .ci-script{display:block;font:italic 400 clamp(24px,8vw,45px)/1.3 Georgia,serif;letter-spacing:.025em}
.ci-opening .ci-letter-date{display:block;font:400 9px/1.5 Arial,sans-serif;letter-spacing:.15em;text-transform:uppercase}
/* Golden Seal: an embossed seal, hinged flap, and a rising ivory note. */
.ci-opening[data-opening=golden-seal]{--ci-ink:#fff5dc;background:#5c452b}
.ci-opening .ci-envelope{position:absolute;display:block;left:50%;top:57%;width:min(78vw,420px);aspect-ratio:1.45;transform:translate(-50%,-50%) rotate(-3deg);background:#ae8b4f;border:1px solid #ead6a7;box-shadow:0 25px 60px #2817095c,inset 0 0 0 4px #e5cd92;perspective:1200px}
.ci-opening .ci-letter{position:absolute;z-index:2;inset:5% 6%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;background:linear-gradient(120deg,#fffdf6,#f1e7d3);color:#826337;border:1px solid #ddcaa2;box-shadow:0 0 15px #3721111a;transition:transform 1700ms cubic-bezier(.24,.6,.22,1) 1650ms}
.ci-opening .ci-letter-rule{position:absolute;inset:10px;border:1px solid #ccb585;pointer-events:none}
.ci-opening .ci-envelope-pocket{position:absolute;inset:35% 0 0;z-index:5;background:linear-gradient(125deg,#ead6a7,#c4a568);clip-path:polygon(0 0,50% 44%,100% 0,100% 100%,0 100%)}
.ci-opening .ci-envelope-fold{position:absolute;inset:0;z-index:4;background:linear-gradient(150deg,#ddc18a,#ae894d);clip-path:polygon(0 0,52% 50%,0 100%)}
.ci-opening .ci-envelope-fold-right{transform:scaleX(-1);background:linear-gradient(160deg,#ebd8aa,#c3a168)}
.ci-opening .ci-envelope-flap{position:absolute;inset:-1px -1px 28%;z-index:6;background:linear-gradient(170deg,#f2dfb1,#c5a268);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;transition:transform 1500ms cubic-bezier(.35,.08,.2,1) 650ms,z-index 0s 1400ms}
.ci-opening .ci-seal{position:absolute;z-index:8;left:50%;top:52%;transform:translate(-50%,-50%) rotate(3deg);display:grid;place-items:center;width:23%;aspect-ratio:1;border-radius:48% 52% 46% 54%;color:#77511c;background:radial-gradient(ellipse at 30% 25%,#f5de91,#cba44d 58%,#9c7332);box-shadow:0 7px 8px #38200a54,inset 2px 3px 3px #ffecc1,inset -2px -3px 3px #835b27;font:italic 400 clamp(14px,4vw,23px)/1 Georgia,serif;text-shadow:0 1px #ffebad;transition:transform 850ms cubic-bezier(.25,.6,.3,1),opacity 500ms ease 300ms}
.ci-opening .ci-seal-ring{position:absolute;inset:12%;border:1px solid #8d682f;border-radius:50%;box-shadow:0 1px #f6dfa3,inset 0 1px #f6dfa3}
.ci-opening[data-opening=golden-seal]:is([data-state=opening],[data-state=leaving]) .ci-seal{transform:translate(-35%,-105%) rotate(22deg) scale(1.14);opacity:0}
.ci-opening[data-opening=golden-seal]:is([data-state=opening],[data-state=leaving]) .ci-envelope-flap{transform:rotateX(172deg);z-index:1}
.ci-opening[data-opening=golden-seal]:is([data-state=opening],[data-state=leaving]) .ci-letter{transform:translateY(-57%)}
/* Velvet Theatre: full-height, pleated curtains and a gilded pelmet. */
.ci-opening[data-opening=velvet-theatre]{--ci-ink:#fff0cf;background:#370c19}
.ci-opening .ci-curtain{position:absolute;top:-2%;bottom:-3%;width:53%;background:repeating-linear-gradient(90deg,#260812 0,#6e1e36 10%,#8a2c45 18%,#3e1020 27%,#681a33 36%);box-shadow:inset -15px 0 30px #16030d9c,10px 0 28px #19091470;transition:transform 3400ms cubic-bezier(.4,.03,.18,1) 450ms;border-bottom:8px solid #a88140;border-radius:0 0 9% 3%}
.ci-opening .ci-curtain-left{left:0;transform-origin:0 20%}
.ci-opening .ci-curtain-right{right:0;transform-origin:100% 20%}
.ci-opening .ci-tie{position:absolute;left:6%;right:3%;top:62%;height:6px;transform:rotate(-10deg);background:linear-gradient(#e6c579,#957030);box-shadow:0 3px 4px #21070870;border-radius:50%}
.ci-opening .ci-valance{position:absolute;top:-7%;left:-2%;right:-2%;height:26%;z-index:4;background:repeating-linear-gradient(90deg,#3a0b1b,#7c263e 12%,#441023 22%);border-radius:0 0 50% 50%;border-bottom:5px solid #b89a59;box-shadow:0 12px 35px #14071073;transition:transform 2700ms cubic-bezier(.3,.05,.22,1) 650ms}
.ci-opening .ci-footlights{position:absolute;bottom:0;left:0;right:0;height:10%;background:radial-gradient(ellipse at center bottom,#f6d09152,transparent 65%);transition:opacity 2s ease 1s}
.ci-opening[data-opening=velvet-theatre]:is([data-state=opening],[data-state=leaving]) .ci-curtain-left{transform:translateX(-103%) scaleX(.82)}
.ci-opening[data-opening=velvet-theatre]:is([data-state=opening],[data-state=leaving]) .ci-curtain-right{transform:translateX(103%) scaleX(.82)}
.ci-opening[data-opening=velvet-theatre]:is([data-state=opening],[data-state=leaving]) .ci-valance{transform:translateY(-86%)}
/* Secret Garden: two fine ironwork gates swing out to the original garden. */
.ci-opening[data-opening=secret-garden]{--ci-ink:#fffde9;--ci-gold:#d8c39a;background:#2a4536}
.ci-opening .ci-garden-haze{position:absolute;inset:0;background:linear-gradient(90deg,#10271be0,transparent 30%,transparent 70%,#10271be0);transition:opacity 4s ease .4s}
.ci-opening .ci-gate{position:absolute;top:19%;bottom:8%;width:50%;color:#bca775;filter:drop-shadow(3px 5px 5px #102116b3);transition:transform 3300ms cubic-bezier(.37,.04,.17,1) 650ms,opacity 1200ms ease 2850ms;backface-visibility:visible}
.ci-opening .ci-gate svg{width:100%;height:100%;display:block}
.ci-opening .ci-gate-left{left:0;transform-origin:0 50%}
.ci-opening .ci-gate-right{right:0;transform-origin:100% 50%}
.ci-opening .ci-gate-right svg{transform:scaleX(-1)}
.ci-opening .ci-gate-lock{position:absolute;left:50%;top:55%;width:30px;height:65px;transform:translate(-50%,-50%);color:#e7cf8f;filter:drop-shadow(0 2px 4px #132013);transition:opacity 500ms ease,transform 650ms ease}
.ci-opening .ci-gate-lock svg{width:100%;height:100%}
.ci-opening[data-opening=secret-garden]:is([data-state=opening],[data-state=leaving]) .ci-gate-left{transform:rotateY(-108deg);opacity:0}
.ci-opening[data-opening=secret-garden]:is([data-state=opening],[data-state=leaving]) .ci-gate-right{transform:rotateY(108deg);opacity:0}
.ci-opening[data-opening=secret-garden]:is([data-state=opening],[data-state=leaving]) .ci-gate-lock{opacity:0;transform:translate(-50%,-25%) rotate(15deg)}
.ci-opening[data-opening=secret-garden]:is([data-state=opening],[data-state=leaving]) .ci-garden-haze{opacity:0}
/* Aegean Promise: cobalt louvred shutters in a whitewashed window. */
.ci-opening[data-opening=aegean-promise]{--ci-ink:#fffaf0;background:#eae7da}
.ci-opening[data-opening=aegean-promise] .ci-brand{color:#253c51;opacity:1;text-shadow:none}
.ci-opening .ci-window-arch{position:absolute;inset:6% 6% 4%;border:14px solid #f4eee1;border-radius:48% 48% 0 0/23% 23% 0 0;box-shadow:0 0 0 8px #d9d5c7,inset 0 0 40px #26354045;z-index:4;pointer-events:none;transition:opacity 1500ms ease 2200ms}
.ci-opening .ci-shutter{position:absolute;top:0;bottom:0;width:50%;background:repeating-linear-gradient(0deg,#1b4168 0,#1b4168 2px,#4a82a6 3px,#366787 15px,#183d60 20px);border:9px solid #335f7b;box-shadow:inset 0 0 0 2px #6893a9,inset 0 0 18px #132e4c70,3px 0 6px #07233880;transition:transform 3000ms cubic-bezier(.33,.04,.17,1) 400ms,opacity 700ms ease 2850ms;backface-visibility:visible}
.ci-opening .ci-shutter-left{left:0;transform-origin:0 50%}
.ci-opening .ci-shutter-right{right:0;transform-origin:100% 50%}
.ci-opening .ci-shutter-handle{position:absolute;top:58%;right:8%;width:6px;height:33px;border-radius:5px;background:linear-gradient(90deg,#695536,#e0cc9b,#977a4b);box-shadow:0 2px 4px #102944}
.ci-opening .ci-shutter-right .ci-shutter-handle{right:auto;left:8%}
.ci-opening .ci-window-sill{position:absolute;z-index:5;bottom:3%;left:3%;right:3%;height:3%;background:#ece9dd;box-shadow:0 7px 16px #21384b45;transition:opacity 1500ms ease 2200ms}
.ci-opening[data-opening=aegean-promise]:is([data-state=opening],[data-state=leaving]) .ci-shutter-left{transform:rotateY(-110deg);opacity:0}
.ci-opening[data-opening=aegean-promise]:is([data-state=opening],[data-state=leaving]) .ci-shutter-right{transform:rotateY(110deg);opacity:0}
.ci-opening[data-opening=aegean-promise]:is([data-state=opening],[data-state=leaving]) :is(.ci-window-arch,.ci-window-sill){opacity:0}
/* Our Storybook: a cloth-bound volume opens onto its first illustrated page. */
.ci-opening[data-opening=our-storybook]{--ci-ink:#fff9e9;background:#394433}
.ci-opening .ci-book{position:absolute;left:50%;top:58%;width:min(67vw,340px);aspect-ratio:.76;max-height:46vh;transform:translate(-50%,-50%) rotate(-5deg);perspective:1400px;box-shadow:10px 19px 38px #13201866;transition:transform 3600ms cubic-bezier(.3,.1,.2,1) .3s}
.ci-opening .ci-book-pages{position:absolute;inset:1% -1% 1% 3%;padding:13%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;border-radius:3px 10px 10px 3px;background:repeating-linear-gradient(90deg,#fff9eb 0,#fff9eb 98%,#cfc4a2 99%,#fff9eb 100%);color:#4c644c;box-shadow:inset 8px 0 15px #8b795b33,3px 0 0 #d7c9aa,5px 0 0 #f5ecd6;border:1px solid #d8caaa}
.ci-opening .ci-page-kicker{font:italic 400 13px/1.4 Georgia,serif;text-align:center}
.ci-opening .ci-page-sprig{width:68%;height:50px;color:#8c9b70}
.ci-opening .ci-book-leaf{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:17px;background:linear-gradient(110deg,#2e493e,#58745b);border:1px solid #bca87a;border-radius:3px 8px 8px 3px;color:#edddad;box-shadow:inset 7px 0 10px #0b241954,inset 0 0 0 7px #3e5c48;transform-origin:0 50%;transition:transform 2900ms cubic-bezier(.35,.02,.17,1) 600ms,opacity 900ms ease 1950ms}
.ci-opening .ci-book-border{position:absolute;inset:16px;border:1px solid #c8b789;box-shadow:inset 0 0 0 4px #4c6752,inset 0 0 0 5px #b5a97c}
.ci-opening .ci-book-ornament{font:400 28px/1 Georgia,serif}
.ci-opening .ci-book-title{font:400 clamp(26px,7vw,41px)/1.15 Georgia,serif;text-align:center;letter-spacing:.015em}
.ci-opening .ci-book-monogram{font:italic 400 16px/1.4 Georgia,serif}
.ci-opening .ci-book-spine{position:absolute;left:4%;top:0;bottom:0;width:4px;background:#243e3070}
.ci-opening .ci-book-ribbon{position:absolute;z-index:-1;left:64%;top:95%;width:8%;height:13%;background:#b49c6c;clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%)}
.ci-opening[data-opening=our-storybook]:is([data-state=opening],[data-state=leaving]) .ci-book-leaf{transform:rotateY(-155deg);opacity:0}
.ci-opening[data-opening=our-storybook]:is([data-state=opening],[data-state=leaving]) .ci-book{transform:translate(-42%,-50%) rotate(0deg) scale(1.04)}
/* Candlelit Promise: four staggered flames gently illuminate the room. */
.ci-opening[data-opening=candlelit-promise]{--ci-ink:#ffeecb;background:#21130c}
.ci-opening[data-opening=candlelit-promise] .ci-backdrop{filter:brightness(.38)}
.ci-opening .ci-candle-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,#f0ac4066,transparent 65%);opacity:0;transition:opacity 3400ms ease .4s}
.ci-opening .ci-vow-card{position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;flex-direction:column;gap:20px;color:#e8cc90;opacity:.3;transition:opacity 2500ms ease 900ms,text-shadow 2s ease}
.ci-opening .ci-vow-card svg{width:45px;height:58px}
.ci-opening .ci-vow-card .ci-script{font-size:42px}
.ci-opening .ci-candle{position:absolute;bottom:12%;width:21px;height:29%;display:block;filter:drop-shadow(0 5px 5px #14090180)}
.ci-opening .ci-candle-1{left:13%;height:30%;--ci-light-delay:300ms}
.ci-opening .ci-candle-2{left:24%;height:21%;--ci-light-delay:1050ms}
.ci-opening .ci-candle-3{right:23%;height:22%;--ci-light-delay:1750ms}
.ci-opening .ci-candle-4{right:12%;height:34%;--ci-light-delay:2400ms}
.ci-opening .ci-wax{position:absolute;inset:0 13% 25%;background:linear-gradient(90deg,#ac9470,#f7e4bb 37%,#dfc598 69%,#a48a65);border-radius:40% 40% 3px 3px/5px 5px 2px 2px;box-shadow:inset 0 3px 4px #886744}
.ci-opening .ci-wick{position:absolute;top:-5px;left:48%;height:9px;width:2px;background:#251a12;z-index:2}
.ci-opening .ci-candlestick{position:absolute;bottom:0;left:0;right:0;height:28%;background:linear-gradient(90deg,#66502d,#d7b773 48%,#826132);clip-path:polygon(8% 0,92% 0,75% 22%,59% 28%,59% 70%,100% 88%,100% 100%,0 100%,0 88%,41% 70%,41% 28%,25% 22%)}
.ci-opening .ci-flame{position:absolute;z-index:4;bottom:calc(100% - 2px);left:50%;width:14px;height:33px;border-radius:55% 45% 45% 55%/72% 72% 28% 28%;background:radial-gradient(ellipse at 50% 80%,#fff8c7 3%,#ffe092 35%,#f6b044 70%,#cc671900 100%);box-shadow:0 0 14px #ffd269ba,0 0 42px 14px #f2b74e52;opacity:0;transform:translateX(-50%) scale(.3);transform-origin:50% 100%;transition:opacity 800ms ease var(--ci-light-delay),transform 1100ms cubic-bezier(.22,.7,.3,1) var(--ci-light-delay)}
.ci-opening[data-opening=candlelit-promise]:is([data-state=opening],[data-state=leaving]) .ci-flame{opacity:1;transform:translateX(-50%) scale(1)}
.ci-opening[data-opening=candlelit-promise]:is([data-state=opening],[data-state=leaving]) .ci-candle-glow{opacity:1}
.ci-opening[data-opening=candlelit-promise]:is([data-state=opening],[data-state=leaving]) .ci-vow-card{opacity:1;text-shadow:0 0 25px #ffca7680}
@media(min-width:700px){
.ci-opening .ci-intro{top:12%}
.ci-opening .ci-backdrop{object-position:center 45%}
.ci-opening .ci-envelope{top:59%}
.ci-opening .ci-candle{width:30px}
.ci-opening .ci-candle-1{left:24%}
.ci-opening .ci-candle-2{left:34%}
.ci-opening .ci-candle-3{right:33%}
.ci-opening .ci-candle-4{right:22%}
.ci-opening .ci-gate{width:40%}
.ci-opening .ci-gate-left{left:10%;transform-origin:0 50%}
.ci-opening .ci-gate-right{right:10%;transform-origin:100% 50%}
.ci-opening .ci-cue{bottom:11%}}
@media(max-height:650px){
.ci-opening .ci-intro{top:70px}
.ci-opening .ci-eyebrow{margin-bottom:7px;font-size:9px}
.ci-opening h2{font-size:17px;margin-bottom:8px}
.ci-opening .ci-couple{font-size:28px;margin-bottom:8px}
.ci-opening .ci-date{font-size:9px}
.ci-opening .ci-envelope{width:min(66vw,320px);top:59%}
.ci-opening .ci-book{width:min(54vw,260px);max-height:42vh;top:59%}
.ci-opening .ci-cue{bottom:63px;min-height:46px;padding:11px 18px;font-size:11px}
.ci-opening .ci-brand{bottom:17px;font-size:14px}
.ci-opening .ci-vow-card{top:54%;gap:8px}
.ci-opening .ci-vow-card .ci-script{font-size:31px}
.ci-opening .ci-vow-card svg{width:28px;height:40px}}
@media(max-width:350px){
.ci-opening .ci-intro{left:6%;right:6%}
.ci-opening h2{font-size:18px}
.ci-opening .ci-couple{font-size:29px}
.ci-opening .ci-cue{gap:10px;padding-inline:17px;font-size:11px}
.ci-opening .ci-seal{font-size:14px}
.ci-opening .ci-letter{gap:8px}
.ci-opening .ci-letter-date{font-size:8px}
.ci-opening .ci-book-title{font-size:27px}
.ci-opening .ci-book-pages{gap:12px}
.ci-opening .ci-page-kicker{font-size:11px}}
@media(prefers-reduced-motion:reduce){
.ci-opening,.ci-opening *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}