/* Premium presentation only. Existing free cards keep their v2 layout. */
.greet-premium{--section-line:color-mix(in srgb,var(--ink) 22%,transparent);--surface:var(--paper)}
.greet-premium .greet-header{min-height:62px;padding:9px 22px}
.greet-premium .greet-hero{padding:12px 22px 24px}
.greet-premium .greet-final h1{font-size:clamp(36px,10.8vw,46px);line-height:1.05}
.greet-premium .greet-name{font-size:1.2em;margin-bottom:6px}
.greet-premium .greet-age{font:20px/1.4 Outfit,sans-serif;margin-top:14px;letter-spacing:.01em}
.greet-premium .greet-age span{font-size:24px}
.greet-premium .greet-art{height:240px;margin:12px 0 4px}
.greet-premium .greet-subtitle{font-size:15px}
.greet-premium .greet-scroll{padding-top:0;margin-top:12px}
.greet-premium .greet-scroll:after{display:none}
.greet-premium .greet-hero-from{margin:8px 0;font-size:15px}
.greet-premium .greet-note{margin:0 22px;padding:24px 0;border-top:0}
.greet-premium h2{font-size:clamp(28px,7.7vw,38px);margin-bottom:18px;line-height:1.15}
.greet-premium .greet-message{font-size:17px;line-height:1.65}
.greet-premium .greet-signature{margin-top:16px;font-size:34px}
.greet-premium .greet-intro-letter{inset:48px 26px 45px;max-width:370px;max-height:360px}
.greet-premium .greet-letter-paper{top:7%;height:66%;font-size:26px;padding:18px 15px}
.greet-hearts .greet-final h1{font-family:GreetingSerif,Georgia,serif;font-size:40px}
.greet-hearts .greet-name{font-size:1.15em;margin-top:4px}
.greet-hearts .greet-age{font-family:GreetingSerif,Georgia,serif;font-size:20px;color:var(--heading-color);margin-top:10px}
.greet-hearts .greet-age span{font-size:25px}
.greet-hearts .greet-hero-from{font:26px/1.2 Caveat,serif;margin:0 0 12px}
.greet-hearts .greet-art{height:225px;margin-top:10px}
.greet-hearts .greet-heart-envelope{left:1%;width:95%;max-height:195px}
.greet-hearts .greet-heart-balloons{width:41%;height:90%;right:0;top:0}
.greet-hearts .greet-note{padding:26px 22px;border:1px solid var(--section-line);box-shadow:0 8px 20px #0000000c;background:var(--paper);position:relative}
.greet-hearts .greet-note:before{content:'';position:absolute;inset:7px;pointer-events:none;border:1px solid color-mix(in srgb,var(--ink) 9%,transparent)}
.greet-hearts .greet-note h2{font-size:28px}
.greet-hearts .greet-message{font-family:GreetingSerif,Georgia,serif;font-size:18px;line-height:1.6}
.greet-cool .greet-note{padding:24px 20px;border:1px solid var(--section-line);border-radius:14px}
.greet-cool .greet-note h2{font-size:29px}
.greet-cool .greet-intro-letter{max-width:365px}
.greet-cool .greet-letter-paper{height:56%;background-image:url(assets/metal-silver.webp);color:#111820;border:1px solid #a8b2bb}
.greet-cool .greet-letter-label{color:#edf5fa;top:58%}
.greet-cool .greet-envelope{filter:drop-shadow(0 12px 24px #0005)}
/* The optional scenes continue each card's material and typography. */
.greet-premium .greet-memories,.greet-premium .greet-cake,.greet-premium .greet-facts,.greet-premium .greet-surprise,.greet-premium .greet-closing{padding:34px 22px}
.greet-premium .greet-photo-fan.has-controls{scrollbar-width:none;padding-bottom:16px}
.greet-premium .greet-photo-fan.has-controls::-webkit-scrollbar{display:none}
.greet-premium .greet-photo{flex-basis:92%;box-shadow:0 5px 14px #00000012}
.greet-modern .greet-photo{transform:none;border-radius:8px;padding:0;border-bottom:4px solid var(--heading-color);overflow:hidden;background:var(--paper);color:var(--ink)}
.greet-modern .greet-photo figcaption{font:16px/1.45 Outfit,sans-serif;margin:12px 12px 14px}
.greet-hearts .greet-photo{background:#fff9f1;color:#30251f;padding:9px 9px 13px;box-shadow:0 6px 13px #0002}
.greet-hearts .greet-photo figcaption{font-size:25px}
.greet-cool .greet-photo{transform:none;background:var(--paper);color:var(--ink);padding:0;border:1px solid var(--section-line);border-radius:8px;overflow:hidden}
.greet-cool .greet-photo figcaption{font:16px/1.45 Outfit,sans-serif;margin:12px 14px 14px}
.greet-premium .greet-photo-controls{margin-top:5px;gap:18px}
.greet-premium .greet-photo-controls button{border-color:var(--section-line)}
.greet-premium .greet-photo-controls p{min-width:46px;text-align:center}
.greet-premium .greet-cake{border-top:1px solid var(--section-line);border-bottom:1px solid var(--section-line);margin-top:10px}
.greet-premium .greet-cake-stage{width:min(74%,235px);margin:59px auto 8px}
.greet-premium .greet-cake-hint{min-height:46px;display:grid;align-items:center;margin:14px 0 6px}
.greet-cake-actions{min-height:48px;display:grid;justify-items:center;align-items:start}
.greet-premium .greet-cake-actions .greet-button{background:none;color:var(--ink);border:1px solid var(--section-line);font-weight:400}
.greet-hearts .greet-cake-caption{font-family:GreetingSerif,Georgia,serif}
.greet-premium .greet-scratch{min-height:180px;border-color:var(--section-line);border-radius:9px}
.greet-premium .greet-scratch canvas{background-repeat:no-repeat;background-size:cover}
.greet-premium .greet-scratch-cover{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;padding:22px;text-align:center;font-size:18px;font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.greet-modern .greet-scratch-cover{color:#fff}
.greet-hearts .greet-scratch-cover{color:#381722;font:24px/1.4 GreetingSerif,Georgia,serif}
.greet-cool .greet-scratch-cover{color:#111820}
.greet-premium .greet-surprise>.greet-button{width:100%;border-radius:9px}
.greet-hearts .greet-surprise>.greet-button{border-radius:30px}
.greet-premium .greet-fact{padding:22px 20px;margin:14px 0;border:1px solid var(--section-line);border-radius:8px}
.greet-modern .greet-fact{border-width:0 0 0 3px;border-color:var(--heading-color);border-radius:0}
.greet-hearts .greet-fact{border-radius:0;box-shadow:0 4px 12px #0000000a}
.greet-premium .greet-fact-number{font-size:38px}
.greet-premium .greet-closing{padding-top:42px;padding-bottom:54px}
.greet-hearts .greet-letter-label{top:52%;background:var(--paper);border:1px solid var(--section-line);font-size:22px}
@media(min-width:700px){.greet-premium .greet-header{padding:18px 40px}.greet-premium .greet-hero{padding:18px 40px 32px}.greet-premium .greet-note{max-width:680px;margin:0 auto}.greet-premium .greet-message{font-size:19px}.greet-premium .greet-art{height:320px}.greet-hearts .greet-heart-envelope{max-height:260px}}
@media(min-width:1000px){.greet-premium .greet-final{min-height:420px;align-content:center;row-gap:0}.greet-premium .greet-final h1{font-size:50px}.greet-premium .greet-final .greet-art{height:340px;grid-row:1/8}.greet-premium .greet-note{margin:0 auto 18px}.greet-hearts .greet-final h1{font-size:49px}.greet-hearts .greet-heart-envelope{max-height:290px}.greet-premium .greet-intro-letter{max-height:360px;inset:20px 24px}}
@media(prefers-reduced-motion:reduce){.greet-premium .greet-art:before{animation:none!important}.greet-premium .greet-heart-balloons{translate:none!important}}

/* A single entrance scene reveals the card; the document never locks scrolling. */
.greet-premium{--scene:url(assets/scene-paper.webp);isolation:isolate}
.greet-cool{--scene:url(assets/scene-silver.webp)}
.greet-premium .greet-intro-letter{position:fixed;inset:0;max-width:none;max-height:none;width:100%;height:100svh;background:var(--paper);background-image:var(--scene);background-size:cover;background-position:center;z-index:100;overflow:hidden}
.greet-premium .greet-intro-stage{position:relative;width:min(84vw,420px);height:360px;display:grid;place-items:center}
.greet-premium .greet-intro-stage .greet-envelope{position:absolute;bottom:12px;width:100%}
.greet-premium .greet-intro-stage .greet-letter-paper{top:23%;left:15%;width:70%;height:56%;padding:22px 12px;box-shadow:0 10px 25px #0002;font-size:29px}
.greet-premium .greet-intro-stage .greet-letter-label{top:66%;font-size:26px}
.greet-hearts .greet-intro-stage .greet-letter-label{top:65%;font-size:22px}
.greet-cool .greet-intro-stage .greet-letter-label{top:70%}
.greet-premium[data-phase=opening] .greet-intro-letter{display:grid}
.greet-premium[data-phase=opening] .greet-final{opacity:1}
.greeting-intro .greet-premium>:not(.greet-hero),.greet-premium[data-phase=intro]>:not(.greet-hero){visibility:hidden}
.greet-premium .greet-hero:before{content:'';position:absolute;inset:0 -22px;z-index:-1;background:var(--scene) center/100% 100% no-repeat;opacity:.38;pointer-events:none;translate:0 var(--scene-shift,0px)}
.greet-premium .greet-art{height:300px}
.greet-hearts .greet-art{height:270px}
.greet-hearts .greet-note{box-shadow:0 8px 24px #00000016;border:0}
.greet-cool .greet-note{border:0;border-top:1px solid var(--section-line);border-radius:0}
.greet-cool .greet-art:before{height:1px;top:83%;box-shadow:0 0 45px 7px color-mix(in srgb,var(--accent) 18%,transparent)}
.greet-cool .greet-hero:before{inset:220px -22px -5px}
.greet-premium .greet-art-touch{perspective:800px}
.greet-premium .greet-photo{position:relative;transform-origin:center 85%;transition:transform .4s ease,opacity .4s ease}
.greet-premium .greet-photo-open{position:absolute;inset:0;width:100%;height:100%;border:0;background:none;z-index:2;cursor:zoom-in;touch-action:pan-x pan-y}
.greet-premium .greet-photo-open:after{content:'↗';position:absolute;bottom:14px;right:14px;width:32px;height:32px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center}
.greet-premium .greet-photo-open:focus-visible{outline-offset:-5px}
.greet-premium .greet-cake-stage{position:relative}
.greet-premium .greet-cake-touch{position:absolute;inset:-40px 0 0;width:100%;border:0;background:none;z-index:3;cursor:pointer;touch-action:pan-y}
.greet-premium .greet-flames{transition:opacity .45s ease,scale .45s ease}
.greet-premium .greet-flames img{transition:opacity .4s ease,transform .4s ease}
.greet-premium .greet-fact{padding:32px 0;border:0;border-top:1px solid var(--section-line);box-shadow:none;border-radius:0;position:relative;overflow:hidden}
.greet-premium .greet-fact-number{font-size:clamp(66px,20vw,104px);line-height:1.05;font-weight:600;letter-spacing:-.07em;color:var(--heading-color);position:relative}
.greet-premium .greet-fact h3{font-size:26px;line-height:1.2;letter-spacing:-.03em;margin:16px 0;max-width:20ch;position:relative}
.greet-premium .greet-fact>p:not(.greet-fact-number){font-size:15px;max-width:32ch;position:relative}
.greet-premium .greet-fact>a{display:inline-flex;align-items:center;min-height:44px;font-size:12px;position:relative}
.greet-premium .greet-orbit{width:75%;height:auto;display:block;margin:4px auto 22px;object-fit:contain;filter:drop-shadow(0 8px 12px #0001)}
.greet-hearts .greet-fact-number{font-family:GreetingSerif,Georgia,serif;font-weight:400}
.greet-photo-dialog{border:0;background:var(--paper);color:var(--ink);padding:16px;width:min(960px,100%);max-width:100%;max-height:100dvh;border-radius:12px;overflow:auto}
.greet-photo-dialog::backdrop{background:#080b10ed}
.greet-photo-dialog img{display:block;width:100%;height:min(70dvh,650px);object-fit:contain}
.greet-photo-dialog p{margin:16px 0 4px;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere}
.greet-photo-dialog button{display:block;margin:0 0 12px auto;min-width:44px;min-height:44px;border:1px solid var(--ink);border-radius:50%;background:var(--paper);color:var(--ink);font-size:24px}
@media(min-width:700px){.greet-modern .greet-final{min-height:540px;max-width:850px;margin:auto;grid-template-columns:1fr 1fr}.greet-modern .greet-final h1{font-size:60px}.greet-modern .greet-final .greet-art{height:500px;width:120%}.greet-modern .greet-note{margin:0 auto}.greet-premium .greet-art{height:360px}.greet-premium .greet-fact{min-height:300px;padding:42px 0}.greet-premium .greet-orbit{width:42%;float:right;margin:0 0 25px 22px}}
@media(prefers-reduced-motion:reduce){.greet-premium .greet-hero:before{translate:none}.greet-premium .greet-photo,.greet-premium .greet-flames,.greet-premium .greet-flames img{transition:none}}
/* A continuous edge ribbon and optional personal paper notes. */
.greet-premium{position:relative}
.greet-story-ribbon{position:absolute;left:-25px;width:52px;pointer-events:none;z-index:0;opacity:.48;overflow:hidden}
.greet-story-ribbon svg{width:100%;height:100%;stroke:none}
.greet-story-ribbon path{fill:none;stroke:url(#greet-ribbon-color);stroke-width:12;stroke-linecap:round}
.greet-premium>section{position:relative}
.greet-reasons{padding:38px 22px;max-width:700px;margin:auto}
.greet-reasons h2{margin-bottom:24px;font-size:32px;line-height:1.14;letter-spacing:-.04em}
.greet-reason-list{display:grid;gap:12px}
.greet-reason{position:relative;border:1px solid var(--section-line);background:var(--paper);box-shadow:0 5px 15px #00000008;overflow:hidden}
.greet-reason:before{content:'';position:absolute;inset:0;background:url(assets/paper-blue.webp) center/cover;opacity:.07;pointer-events:none}
.greet-hearts .greet-reason:before{background-image:url(assets/paper-rose.webp)}
.greet-cool .greet-reason:before{background-image:url(assets/metal-silver.webp);opacity:.045}
.greet-hearts .greet-reason{border-radius:2px 18px 2px 2px}
.greet-reason summary{position:relative;list-style:none;display:grid;grid-template-columns:42px minmax(0,1fr) 24px;gap:12px;align-items:center;padding:22px 18px;min-height:96px;font-size:20px;font-weight:500;line-height:1.3;cursor:pointer;overflow-wrap:anywhere}
.greet-reason summary::-webkit-details-marker{display:none}
.greet-reason summary:focus-visible{outline:3px solid var(--ink);outline-offset:-5px}
.greet-reason-number{font-size:28px;font-weight:400;color:var(--heading-color)}
.greet-hearts .greet-reason-number{font-family:GreetingSerif,Georgia,serif;font-size:38px}
.greet-reason-mark{font-size:26px;font-weight:300;transition:transform .3s ease}
.greet-reason[open] .greet-reason-mark{transform:rotate(45deg)}
.greet-reason-message{position:relative;padding:0 24px 24px 72px}
.greet-reason-message p{font-size:17px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.greet-memory-track h2{margin-bottom:24px}
.greet-memories.has-scroll-story{height:calc(100svh + 360px);max-width:700px;overflow:visible}
.has-scroll-story .greet-memory-track{position:sticky;top:24px;background:var(--paper);padding:20px 0 6px}
.has-scroll-story .greet-photo-fan{scroll-snap-type:none;gap:18px;padding:14px 8%;scroll-behavior:auto}
.has-scroll-story .greet-photo{flex:0 0 100%;width:100%;max-width:none;padding:10px;box-shadow:0 8px 18px #0002}
.has-scroll-story .greet-photo img{height:clamp(200px,40svh,360px);aspect-ratio:auto;width:100%;object-fit:cover}
.has-scroll-story .greet-photo figcaption{font-size:17px;min-height:54px;padding:14px 4px 4px;white-space:pre-wrap;overflow-wrap:anywhere}
.has-scroll-story .greet-photo-controls{padding-top:16px}
@media(min-width:700px){.greet-reasons{padding-top:55px;padding-bottom:55px}.greet-reasons h2{font-size:40px}.greet-reason summary{min-height:104px}.greet-story-ribbon{left:5px;width:70px}}
@media(prefers-reduced-motion:reduce){.greet-story-ribbon{display:none}.greet-reason-mark{transition:none}}
.greet-reason:before{background-image:url(assets/paper.webp);opacity:.08}
.greet-hearts .greet-reason:before{background-image:url(assets/paper.webp);opacity:.08}
.greet-reason:after{content:'';position:absolute;right:0;top:0;width:30px;height:30px;background:linear-gradient(225deg,var(--paper) 48%,var(--section-line) 49%,var(--paper) 65%);pointer-events:none}
.greet-reason{border-left:3px solid var(--heading-color);box-shadow:0 6px 18px #00000009}
.greet-reason-message p{text-align:left}
.greet-reason[open] .greet-reason-message{animation:greet-paper-note .32s ease-out}
@keyframes greet-paper-note{from{opacity:.3;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.greet-reason[open] .greet-reason-message{animation:none}}
.has-scroll-story .greet-photo-fan{overflow-y:hidden}
/* Keep texture outside the reading area so free color combinations retain contrast. */
.greet-reason:before{inset:0 0 auto;height:7px}
