/* Shared structure for three distinct grand opening invitations. */
body.celebration-opening { margin:0; }
.celebration-opening #wedding-content { overflow:clip; padding:0; }
.op-intro { display:none; }
.wedding-ready .op-intro {
    position:fixed; z-index:35; inset:0; display:grid; place-items:center;
    overflow:auto; padding:clamp(90px,12vh,130px) 24px 98px;
    background:#152322; color:#fff6df; isolation:isolate;
    transition:opacity .55s ease .52s,visibility .55s ease .52s;
}
.op-intro-image,.op-intro-stage { position:absolute; inset:0; width:100%; height:100%; }
.op-intro-image { object-fit:cover; z-index:-3; }
.op-intro-stage { pointer-events:none; overflow:hidden; z-index:-1; }
.op-intro::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#14232182,#14232140); z-index:-2; }
.op-intro-copy { width:min(640px,100%); align-self:safe center; text-align:center; padding:clamp(28px,5vw,72px); position:relative; }
.op-eyebrow { font:600 .75rem/1.65 Inter,'Noto Sans Tamil',sans-serif; letter-spacing:.17em; text-transform:uppercase; margin:0; }
.op-intro-title { font:500 clamp(3rem,6vw,6.7rem)/1.02 'Cormorant Garamond','Noto Sans Tamil',Georgia,serif; margin:20px auto; overflow-wrap:anywhere; }
.op-intro-caption { max-width:38ch; margin:0 auto 24px; }
.op-open { display:inline-flex; justify-content:center; align-items:center; gap:18px; max-width:100%; min-height:48px; border:0; padding:14px 24px; font:600 .9rem/1.4 Inter,'Noto Sans Tamil',sans-serif; background:var(--design-accent); color:var(--design-button-ink); cursor:pointer; }
.op-open span { font-size:1.2em; }
.opening .op-intro,.opened .op-intro { pointer-events:none; opacity:0; visibility:hidden; }
.op-hero,.op-finale,.op-story,.op-gallery { position:relative; isolation:isolate; }
.op-media { position:relative; overflow:hidden; min-width:0; }
.op-hero-image,.op-framed img,.op-finale-art { display:block; width:100%; height:100%; object-fit:cover; }
.op-hero-image { object-position:center; }
.op-hero-copy,.op-story-copy,.op-finale-copy { position:relative; min-width:0; }
.celebration-opening h1,.celebration-opening h2 { text-wrap:balance; }
.op-hero h1 { margin:24px 0 32px; font-size:clamp(3.2rem,7.9vw,8.4rem); line-height:.96; }
.op-hero-meta { display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; }
.op-hero-meta p { font-size:1rem; margin:0; }
.op-hosts { max-width:55ch; margin:20px 0 0; font-style:italic; }
.op-scroll { width:48px; height:48px; display:inline-grid; place-items:center; border:1px solid currentColor; text-decoration:none; border-radius:50%; font-size:21px; color:inherit; margin-top:30px; }
.op-story { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px,7vw,112px); align-items:center; max-width:1320px; margin:auto; padding:clamp(68px,10vw,150px) clamp(24px,6vw,90px); }
.op-framed { min-width:0; margin:0; position:relative; }
.op-framed img { aspect-ratio:5/6; height:auto; }
.op-story h2,.op-gallery h2,.op-finale h2 { margin:16px 0 22px; }
.op-story-text,.op-finale-copy>p { max-width:47ch; font-size:clamp(1rem,1.6vw,1.32rem); }
.op-gallery { padding:clamp(58px,8vw,112px) clamp(22px,6vw,92px); overflow:clip; }
.op-gallery-heading { max-width:780px; margin:0 auto 40px; text-align:center; }
.op-gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,2vw,32px); max-width:1280px; margin:auto; align-items:center; }
.op-gallery-photo { display:block; overflow:hidden; min-width:0; }
.op-gallery-photo img { width:100%; display:block; aspect-ratio:4/5; object-fit:cover; transition:transform .55s; }
.op-gallery-photo:focus-visible img,.op-gallery-photo:hover img { transform:scale(1.035); }
.op-finale { min-height:min(90svh,820px); display:grid; align-items:center; padding:clamp(100px,12vw,180px) clamp(24px,9vw,130px); overflow:clip; }
.op-finale-art { position:absolute; z-index:-2; inset:0; }
.op-finale-copy { max-width:min(680px,100%); padding:clamp(28px,4vw,66px); }
.op-finale .made-by { display:inline-block; margin-top:20px; }
.op-details .cl-event-number { display:none; }
.op-details .cl-event { display:block; }

/* The brass shopfront introduces a formal ribbon-cutting. */
.design-opening-ribbon .op-intro-copy { background:#19322fee; border:1px solid #e4c990; box-shadow:inset 0 0 0 7px #19322f,inset 0 0 0 8px #998357; }
.op-ribbon-left,.op-ribbon-right { position:absolute; top:52%; height:clamp(28px,6vw,85px); width:53%; background:linear-gradient(180deg,#812235 1%,#b93e4a 35%,#a32c37 66%,#6e171e); transform:skewY(-5deg); transform-origin:center; transition:transform 1s cubic-bezier(.18,.72,.19,1); }
.op-ribbon-left { left:0; clip-path:polygon(0 0,100% 0,96% 100%,0 100%); }
.op-ribbon-right { right:0; clip-path:polygon(4% 0,100% 0,100% 100%,0 100%); }
.opening .op-ribbon-left { transform:translateX(-100%) rotate(-16deg); }
.opening .op-ribbon-right { transform:translateX(100%) rotate(14deg); }
.design-opening-ribbon .op-hero { display:grid; grid-template-columns:1fr minmax(0,1.03fr); min-height:min(890px,100svh); padding:clamp(62px,7vw,104px) clamp(22px,6vw,90px) clamp(55px,6vw,86px); align-items:center; gap:clamp(30px,6vw,94px); }
.design-opening-ribbon .op-hero-copy { grid-column:1; grid-row:1; padding-block:28px 10px; }
.design-opening-ribbon .op-media { grid-column:2; grid-row:1; width:100%; height:clamp(390px,68vw,710px); max-height:calc(100svh - 92px); border-radius:50% 50% 0 0; outline:1px solid color-mix(in srgb,var(--design-accent) 56%,transparent); outline-offset:9px; }
.design-opening-ribbon .op-hero-copy::before { content:""; display:block; width:50px; height:2px; background:var(--design-accent); margin-bottom:28px; }
.design-opening-ribbon .op-hero-meta { padding-block:16px; border-block:1px solid color-mix(in srgb,var(--design-accent) 38%,transparent); }
.op-fold { position:absolute; bottom:0; left:0; width:100%; height:6px; background:linear-gradient(90deg,var(--design-accent),#b78c4a 45%,#6b5542 55%,var(--design-accent)); }
.design-opening-ribbon .op-framed { padding:12px; border:1px solid color-mix(in srgb,var(--design-accent) 50%,transparent); }
.design-opening-ribbon .op-gallery { background:#203a36; color:#fff7e6!important; }
.design-opening-ribbon .op-gallery-photo:nth-child(3n+2) { margin-top:clamp(15px,4vw,58px); }
.design-opening-ribbon .op-gallery-photo img { border-radius:45% 45% 0 0; }
.design-opening-ribbon .op-finale-copy { background:var(--design-paper); border-left:5px solid var(--design-accent); }

/* A glowing theatre ticket opens to the premiere, with a perforated photo strip. */
.design-opening-marquee .op-intro { background:#101225; }
.design-opening-marquee .op-intro-copy { color:#ffe9b2; background:#15172bee; outline:1px solid #e9bf73; outline-offset:6px; border:6px double #ddaa62; }
.design-opening-marquee .op-intro-title,.design-opening-marquee .op-hero h1,.design-opening-marquee .op-gallery h2 { font-family:Inter,'Noto Sans Tamil',sans-serif; font-weight:700; letter-spacing:-.055em; line-height:1.01; }
.design-opening-marquee .op-intro-stage { z-index:0; }
.op-beam { position:absolute; bottom:-10%; width:55%; height:125%; opacity:.6; background:linear-gradient(to top,#fff1af90,transparent); clip-path:polygon(47% 100%,53% 100%,100% 0%,0 0%); transform-origin:center bottom; transition:transform 1.05s ease; }
.op-beam-left { left:0; transform:rotate(-12deg); }.op-beam-right { right:0; transform:rotate(15deg); }
.opening .op-beam-left { transform:rotate(-58deg); }.opening .op-beam-right { transform:rotate(60deg); }
.design-opening-marquee .op-hero { min-height:min(100svh,990px); display:grid; align-items:end; color:#fff9e9!important; background:#131626; padding:clamp(265px,35vh,430px) clamp(26px,8vw,115px) clamp(70px,9vw,125px); }
.design-opening-marquee .op-media { position:absolute; inset:0; z-index:-3; }
.design-opening-marquee .op-media .op-hero-image { object-position:50% 43%; }
.design-opening-marquee .op-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#0a0d18fa 0%,#0d13238c 50%,#10132120 100%); }
.design-opening-marquee .op-hero-copy { max-width:1000px; }
.design-opening-marquee .op-hero h1 { max-width:12ch; text-shadow:0 3px 30px #060812; }
.design-opening-marquee .op-hero-meta p+p { padding-left:18px; border-left:1px solid currentColor; }
.op-bulb-strip { position:absolute; inset:auto 0 0; height:10px; background:radial-gradient(circle,#ffefb5 2px,#ffdb8230 3px,transparent 5px) 0 center / 22px 10px repeat-x, #282030; }
.design-opening-marquee .op-story-copy { grid-column:1; grid-row:1; }
.design-opening-marquee .op-framed { grid-column:2; padding:10px; background:#191a29; border:2px dashed #b59a72; transform:rotate(2deg); }
.design-opening-marquee .op-gallery { border-block:1px solid color-mix(in srgb,var(--design-accent) 40%,transparent); }
.design-opening-marquee .op-gallery-grid { background:#141525; padding:26px 12px; gap:12px; border-block:6px dotted #cbb587; }
.design-opening-marquee .op-gallery-photo img { aspect-ratio:5/4; }
.design-opening-marquee .op-finale { color:#fff3ce!important; justify-items:center; text-align:center; }
.design-opening-marquee .op-finale-copy { background:#141724eb; border:1px solid #c49c68; outline:1px solid #937044; outline-offset:9px; }
.design-opening-marquee .op-finale-copy>p { margin-inline:auto; }

/* An unfolding gallery catalogue and bold split-frame studio layout. */
.design-opening-atelier .op-intro { background:#eae5da; }
.design-opening-atelier .op-intro-copy { margin-left:auto; width:min(520px,100%); background:var(--design-paper); color:var(--design-ink); text-align:left; border-top:9px solid var(--design-accent); }
.design-opening-atelier .op-intro-title,.design-opening-atelier .op-hero h1,.design-opening-atelier .op-story h2,.design-opening-atelier .op-gallery h2 { font-family:Inter,'Noto Sans Tamil',sans-serif; font-weight:700; letter-spacing:-.065em; line-height:.96; }
.design-opening-atelier .op-intro-caption { margin:18px 0 28px; }
.op-shutter { position:absolute; inset:0; transition:transform 1.05s cubic-bezier(.22,.65,.28,1); }
.op-shutter-a { background:#b54025; clip-path:polygon(0 45%,58% 0,23% 0,0 17%); }
.op-shutter-b { background:#284a91; clip-path:polygon(50% 100%,100% 60%,100% 77%,73% 100%); }
.opening .op-shutter-a { transform:translate(-40%,-20%); }.opening .op-shutter-b { transform:translate(40%,20%); }
.design-opening-atelier .op-hero { min-height:min(885px,100svh); display:grid; grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr); align-items:stretch; }
.design-opening-atelier .op-media { grid-column:1; grid-row:1; }
.design-opening-atelier .op-hero-copy { grid-column:2; padding:clamp(90px,11vw,155px) clamp(26px,5vw,82px); align-self:center; }
.design-opening-atelier .op-hero h1 { font-size:clamp(3.2rem,6.8vw,7.5rem); }
.design-opening-atelier .op-hero-meta { border-top:3px solid currentColor; padding-top:17px; }
.design-opening-atelier .op-scroll { border-radius:0; }
.op-cutout { position:absolute; top:0; left:calc(47% - 17px); width:34px; height:42%; background:var(--design-accent); }
.design-opening-atelier .op-framed { border-bottom:16px solid var(--design-accent); }
.design-opening-atelier .op-gallery { border-top:2px solid currentColor; }
.design-opening-atelier .op-gallery-heading { margin-inline:0; text-align:left; }
.design-opening-atelier .op-gallery-grid { grid-template-columns:1.4fr .85fr .85fr; align-items:start; }
.design-opening-atelier .op-gallery-photo:nth-child(3n+2) { padding-top:12%; }
.design-opening-atelier .op-gallery-photo img { aspect-ratio:3/4; }
.design-opening-atelier .op-finale { min-height:640px; }
.design-opening-atelier .op-finale-copy { background:var(--design-paper); border-top:7px solid var(--design-accent); }
.design-opening-atelier .op-details .cl-event { border-top:3px solid var(--design-accent); }

.op-motion [data-op-reveal] { opacity:0; transform:translateY(24px); transition:transform .75s cubic-bezier(.2,.65,.2,1),opacity .7s ease; }
.op-motion [data-op-reveal].op-shown { opacity:1; transform:none; }
.op-motion .op-hero-image,.op-motion .op-finale-art { transform:translate3d(0,var(--op-shift,0px),0) scale(1.065); }
@media (min-width:821px) {
    .design-opening-marquee.op-motion .op-story-copy { position:sticky; top:20vh; }
}
@media (max-width:820px) {
    .op-story { grid-template-columns:1fr; }
    .op-framed { width:min(100%,520px); margin-inline:auto; }
    .design-opening-ribbon .op-hero { min-height:0; grid-template-columns:1fr; padding:80px 26px 42px; gap:36px; }
    .design-opening-ribbon .op-hero-copy { grid-row:1; grid-column:1; padding-top:0; }
    .design-opening-ribbon .op-media { grid-row:2; grid-column:1; width:min(100%,500px); height:min(102vw,480px); justify-self:center; }
    .design-opening-marquee .op-story-copy { grid-column:auto; grid-row:auto; }
    .design-opening-marquee .op-framed { grid-column:auto; order:2; }
    .design-opening-atelier .op-hero { min-height:0; grid-template-columns:1fr; }
    .design-opening-atelier .op-hero-copy { grid-row:1; grid-column:1; padding:90px 24px 32px; }
    .design-opening-atelier .op-media { grid-row:2; grid-column:1; height:min(98vw,540px); }
    .op-cutout { inset:auto 0 0; width:12px; height:min(98vw,540px); }
    .op-finale { min-height:590px; }
}
@media (max-width:600px) {
    .op-hero h1 { font-size:clamp(3.2rem,13vw,5.2rem); }
    .op-gallery-grid,.design-opening-atelier .op-gallery-grid { grid-template-columns:1fr 1fr; }
    .op-gallery-photo:last-child:nth-child(odd) { grid-column:1 / -1; }
    .op-gallery-photo:last-child:nth-child(odd) img { aspect-ratio:16/11; }
    .design-opening-ribbon .op-gallery-photo:nth-child(3n+2),.design-opening-atelier .op-gallery-photo:nth-child(3n+2) { margin:0; padding:0; }
    .design-opening-marquee .op-hero { min-height:100svh; padding:240px 24px 120px; }
    .design-opening-atelier .op-intro-copy { margin:0; }
    .op-gallery { padding-inline:18px; }
    .op-eyebrow { font-size:.67rem; letter-spacing:.12em; }
    .op-finale-copy { padding:28px; }
}
@media (prefers-reduced-motion:reduce) {
    .celebration-opening *, .celebration-opening *::before,.celebration-opening *::after { transition:none!important; animation:none!important; }
    .op-motion [data-op-reveal] { opacity:1; transform:none; }
}
.celebration-opening[data-motion="0"] *, .celebration-opening[data-motion="0"] *::before,.celebration-opening[data-motion="0"] *::after { transition:none!important; animation:none!important; }