@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/CormorantGaramond-500i.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/CormorantGaramond-500.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/CormorantGaramond-600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Great Vibes';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/GreatVibes-400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/Jost-var.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root{
  --paper:#fffaf2; --butter:#fff3cf; --butter-2:#ffe592; --gold:#f2c14e; --gold-d:#9a6a12;
  --blush:#ffe6ee; --pink:#f7a9c2; --rose:#e3769d; --berry:#a32c63; --berry-d:#6f1d47;
  --ink:#4b2338; --muted:#85546b; --silver:#bcc2cc;
  --serif:"Cormorant Garamond", "Times New Roman", serif;
  --script:"Great Vibes", "Snell Roundhand", cursive;
  --sans:"Jost", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --ease:cubic-bezier(.22,.8,.24,1);
  --spring:cubic-bezier(.34,1.4,.5,1);
  --flower:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='%23f49ab8'%3E%3Cellipse cx='20' cy='10' rx='6' ry='9'/%3E%3Cellipse cx='20' cy='10' rx='6' ry='9' transform='rotate(72 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='6' ry='9' transform='rotate(144 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='6' ry='9' transform='rotate(216 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='6' ry='9' transform='rotate(288 20 20)'/%3E%3C/g%3E%3Ccircle cx='20' cy='20' r='5' fill='%23f5c341'/%3E%3C/svg%3E");
  --spark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23b9bfca' d='M12 0c.8 6.4 4.8 10.6 12 12-7.2 1.4-11.2 5.6-12 12-.8-6.4-4.8-10.6-12-12C7.2 10.6 11.2 6.4 12 0z'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--paper)}
body{margin:0;font-family:var(--sans);color:var(--ink);font-size:17px;line-height:1.6;overflow-x:hidden;
  background:linear-gradient(180deg,#fff7e3 0%,#fffaf2 22%,#fff0f4 48%,#fff8e6 72%,#ffeef3 100%);-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
button{font:inherit;color:inherit}
a{color:var(--berry)}
:focus-visible{outline:2.5px solid var(--rose);outline-offset:3px;border-radius:8px}
.intro-on body{overflow:hidden;height:100svh}
main,.footer{position:relative;z-index:1}
main{overflow-x:hidden;overflow-x:clip}

/* ================= intro: a custom kawaii envelope; a pink envelope with a red bow, two little kitties (Ash and Lou) holding a heart ================= */
.intro{position:fixed;inset:0;z-index:60;overflow:hidden;color:#6f1d47;transition:opacity .75s ease .05s;
  background:radial-gradient(60% 42% at 50% 47%,rgba(255,255,255,.85),rgba(255,255,255,0) 70%),radial-gradient(rgba(255,255,255,.6) 2.2px,transparent 2.8px) 0 0/28px 28px,radial-gradient(rgba(255,255,255,.6) 2.2px,transparent 2.8px) 14px 14px/28px 28px,linear-gradient(180deg,#ffe4ec 0%,#ffd2df 55%,#ffc4d5 100%)}
.js .intro{display:block}
html:not(.js) .intro{display:none}
.intro[hidden]{display:none}
.intro-skip{position:absolute;top:calc(14px + env(safe-area-inset-top));right:16px;z-index:6;border:0;background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  color:#a32c63;font:500 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:9px 14px;border-radius:999px;cursor:pointer;box-shadow:0 2px 10px rgba(163,44,99,.12),inset 0 0 0 .5px rgba(163,44,99,.18)}
/* soft little hearts and gold sparkles drifting up */
.hk-float{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hk-float i{position:absolute;bottom:-40px;display:block;width:var(--z,14px);height:var(--z,14px);opacity:0;animation:hkRise var(--d,9s) linear var(--w,0s) infinite;will-change:transform,opacity}
.hk-float i.h{background:var(--c,#fff);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-17 -22 34 31'%3E%3Cpath d='M0,8 C-3,4 -16,-3 -16,-11 C-16,-17 -11,-21 -6,-21 C-3,-21 -1,-19 0,-17 C1,-19 3,-21 6,-21 C11,-21 16,-17 16,-11 C16,-3 3,4 0,8 Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-17 -22 34 31'%3E%3Cpath d='M0,8 C-3,4 -16,-3 -16,-11 C-16,-17 -11,-21 -6,-21 C-3,-21 -1,-19 0,-17 C1,-19 3,-21 6,-21 C11,-21 16,-17 16,-11 C16,-3 3,4 0,8 Z'/%3E%3C/svg%3E") center/contain no-repeat}
.hk-float i.s{bottom:auto;top:var(--t,30%);background:#f2c14e;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 20 20'%3E%3Cpath d='M0,-10 C1,-2 2,-1 10,0 C2,1 1,2 0,10 C-1,2 -2,1 -10,0 C-2,-1 -1,-2 0,-10 Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 20 20'%3E%3Cpath d='M0,-10 C1,-2 2,-1 10,0 C2,1 1,2 0,10 C-1,2 -2,1 -10,0 C-2,-1 -1,-2 0,-10 Z'/%3E%3C/svg%3E") center/contain no-repeat;animation:hkTwinkle var(--d,2.6s) ease-in-out var(--w,0s) infinite;filter:drop-shadow(0 0 4px rgba(242,193,78,.8))}
@keyframes hkRise{0%{transform:translate(0,0) rotate(-8deg);opacity:0}12%{opacity:var(--o,.8)}50%{transform:translate(var(--x,18px),-55vh) rotate(8deg)}88%{opacity:var(--o,.8)}100%{transform:translate(0,-112vh) rotate(-6deg);opacity:0}}
@keyframes hkTwinkle{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:1;transform:scale(1) rotate(45deg)}}
/* the stage: the whole screen is the tap target */
.hk-stage{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:calc(40px + env(safe-area-inset-top)) 20px calc(40px + env(safe-area-inset-bottom));
  border:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hk-title{display:block;font-family:var(--script);font-size:46px;word-spacing:.12em;line-height:1.1;color:#a32c63;text-shadow:0 2px 0 #fff,0 0 24px rgba(255,255,255,.9);margin-bottom:34px;opacity:0;transform:translateY(8px);animation:hkIn .7s cubic-bezier(.22,1,.36,1) .15s forwards;transition:opacity .35s ease,transform .5s ease}
.hk-tap{display:block;margin-top:176px;font:500 11px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:#a32c63;opacity:0;animation:hkIn .6s ease .9s forwards,hkPulse 2.2s ease-in-out 1.6s infinite;transition:opacity .3s ease}
@keyframes hkIn{to{opacity:1;transform:none}}
@keyframes hkPulse{0%,100%{opacity:1}50%{opacity:.45}}
/* the envelope */
.hk-env{position:relative;display:block;width:300px;height:200px;-webkit-perspective:900px;perspective:900px;opacity:0;transform:translateY(18px) scale(.96);animation:hkEnvIn .8s cubic-bezier(.22,1,.36,1) .05s forwards;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.hk-env::before{content:"";position:absolute;left:4%;right:4%;bottom:-16px;height:26px;border-radius:50%;background:rgba(163,44,99,.18);filter:blur(10px)}
@keyframes hkEnvIn{to{opacity:1;transform:none}}
.hk-env>svg{position:absolute;display:block;overflow:visible}
.hk-back{inset:0;width:100%;height:100%;z-index:0;filter:drop-shadow(0 16px 26px rgba(163,44,99,.3))}
.hk-front{inset:0;width:100%;height:100%;z-index:3}
.hk-flap{left:0;top:0;width:300px;height:132px;z-index:4;transform-origin:50% 0;transition:transform .6s cubic-bezier(.45,.05,.3,1),filter .6s ease;filter:drop-shadow(0 3px 3px rgba(163,44,99,.18))}
.hk-bow{left:101px;top:91px;width:98px;height:75px;z-index:5;filter:drop-shadow(0 3px 4px rgba(120,10,40,.3));transform-origin:50% 43%;animation:hkWiggle 3.2s ease-in-out 1.4s infinite}
@keyframes hkWiggle{0%,86%,100%{transform:rotate(0)}90%{transform:rotate(-6deg) scale(1.04)}95%{transform:rotate(5deg)}}
.hk-bow .hk-loop,.hk-bow .hk-tail,.hk-bow .hk-knot{transform-box:fill-box;transition:transform .45s cubic-bezier(.5,0,.75,0),opacity .4s ease}
.hk-bow .hk-ll{transform-origin:100% 50%}.hk-bow .hk-lr{transform-origin:0 50%}.hk-bow .hk-tl{transform-origin:100% 0}.hk-bow .hk-tr{transform-origin:0 0}.hk-bow .hk-knot{transform-origin:50% 50%}
/* the card inside */
.hk-card{position:absolute;left:24px;top:26px;width:252px;height:160px;z-index:2;display:block;border-radius:8px;background:linear-gradient(180deg,#fff,#fffaf2);box-shadow:0 6px 18px rgba(163,44,99,.18);transition:transform .75s cubic-bezier(.22,1,.36,1)}
.hk-card-in{position:absolute;inset:7px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:20px;border:1px solid rgba(227,183,90,.75);border-radius:5px}
.hk-card-text{display:block;font-family:var(--script);font-size:31px;line-height:1.1;color:#a32c63;white-space:nowrap}
.hk-card-heart{width:18px;height:17px;margin-top:8px;filter:drop-shadow(0 0 5px rgba(242,193,78,.7))}
/* the two of them, sitting in front of it */
.hk-pair{position:absolute;left:-14px;top:148px;width:328px;z-index:6;display:block;pointer-events:none}
.hk-kits{position:relative;display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 6px 8px rgba(163,44,99,.16))}
.hk-kit .hk-bob{animation:hkBob 2.6s ease-in-out infinite}
.hk-lou .hk-bob{animation-delay:-1.3s}
@keyframes hkBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.hk-heart .hk-beat{transform-box:fill-box;transform-origin:50% 60%;animation:hkBeat 1.3s ease-in-out infinite}
@keyframes hkBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.12)}30%{transform:scale(.98)}45%{transform:scale(1.08)}}
.hk-names{display:flex;justify-content:space-between;width:220px;margin:-12px auto 0;font-family:var(--script);font-size:24px;line-height:1;color:#a32c63}
.hk-names span{width:80px;text-align:center}
/* opening: the bow unties, the flap lifts, the card slides out */
.intro.open .hk-title,.intro.open .hk-tap{opacity:0!important;animation:none}
.intro.open .hk-env{transform:translateY(42px)}
.intro.open .hk-bow{animation:none}
.intro.open .hk-ll{transform:translate(-14px,10px) rotate(-55deg) scale(.5);opacity:0}
.intro.open .hk-lr{transform:translate(14px,10px) rotate(55deg) scale(.5);opacity:0}
.intro.open .hk-tl{transform:translate(-10px,26px) rotate(28deg);opacity:0}
.intro.open .hk-tr{transform:translate(10px,26px) rotate(-28deg);opacity:0}
.intro.open .hk-knot{transform:scale(1.35);opacity:0}
.intro.flap .hk-flap{transform:rotateX(180deg);filter:brightness(.93) drop-shadow(0 -2px 3px rgba(163,44,99,.12))}
.intro.flap-back .hk-flap{z-index:1}
.intro.card .hk-card{transform:translateY(-112px)}
.intro.card .hk-kit .hk-bob{animation:hkHop .5s cubic-bezier(.3,1.6,.5,1) 1}
.intro.card .hk-lou .hk-bob{animation-delay:.08s}
@keyframes hkHop{0%,100%{transform:translateY(0)}45%{transform:translateY(-9px)}}
.hk-pop{position:absolute;z-index:7;left:50%;top:60%;width:14px;height:14px;margin:-7px;pointer-events:none;background:var(--c,#e3304d);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-17 -22 34 31'%3E%3Cpath d='M0,8 C-3,4 -16,-3 -16,-11 C-16,-17 -11,-21 -6,-21 C-3,-21 -1,-19 0,-17 C1,-19 3,-21 6,-21 C11,-21 16,-17 16,-11 C16,-3 3,4 0,8 Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-17 -22 34 31'%3E%3Cpath d='M0,8 C-3,4 -16,-3 -16,-11 C-16,-17 -11,-21 -6,-21 C-3,-21 -1,-19 0,-17 C1,-19 3,-21 6,-21 C11,-21 16,-17 16,-11 C16,-3 3,4 0,8 Z'/%3E%3C/svg%3E") center/contain no-repeat;animation:hkPop 1.1s cubic-bezier(.2,.8,.3,1) forwards}
@keyframes hkPop{0%{transform:translate(0,0) scale(.3);opacity:0}20%{opacity:1}100%{transform:translate(var(--x),var(--y)) scale(var(--s,1)) rotate(var(--r,0deg));opacity:0}}
.intro.out{opacity:0;pointer-events:none}
@media (prefers-reduced-motion: reduce){.hk-float,.hk-pop{display:none}.hk-title,.hk-tap,.hk-env,.hk-bow,.hk-kit .hk-bob,.hk-heart .hk-beat{animation:none!important;opacity:1;transform:none}.hk-env,.hk-flap,.hk-card,.hk-bow *{transition:none!important}}
@media (max-width:350px){.hk-stage{transform:scale(.88)}}
@media (max-height:700px){.hk-title{font-size:40px;margin-bottom:24px}.hk-tap{margin-top:166px}.hk-stage{padding-top:calc(24px + env(safe-area-inset-top))}}

/* ================= hero ================= */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:calc(16px + env(safe-area-inset-top)) 18px 22px;text-align:center;overflow:hidden}
.hero::before{content:"";position:absolute;left:50%;top:8%;width:150vw;height:80%;margin-left:-75vw;pointer-events:none;background:radial-gradient(50% 45% at 30% 40%,rgba(255,229,146,.55),transparent 70%),radial-gradient(45% 40% at 72% 55%,rgba(247,169,194,.45),transparent 70%)}
.hero-ph{position:relative;width:100%;max-width:440px;height:min(56svh,calc((100vw - 36px) * 1.333));border-radius:999px 999px 26px 26px;overflow:hidden;
  box-shadow:0 30px 60px -30px rgba(163,44,99,.55),0 0 0 6px #fff,0 0 0 7px rgba(242,193,78,.45);background:#f3dfe3;transform:translateZ(0)}
.hero-photo{width:100%;height:100%;object-fit:cover;object-position:50% 30%;transform-origin:50% 35%;animation:kenburns 22s ease-in-out infinite alternate;will-change:transform}
@keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.14) translate(-1.5%,1%)}}
.hero-inner{position:relative;width:100%;max-width:440px;display:flex;flex-direction:column;align-items:center;margin-top:10px}
.eyebrow{margin:6px 0 0;font-size:11.5px;letter-spacing:.38em;text-transform:uppercase;color:var(--rose);font-weight:500}
.names{margin:-6px 0 0;width:100%;line-height:0}
.names-svg{width:100%;max-width:360px;height:auto;overflow:visible;margin:0 auto}
.hand{font-family:var(--script);font-size:66px;fill:var(--berry);stroke:var(--berry);stroke-width:1;paint-order:stroke}
.hand.amp{font-size:40px;fill:var(--gold);stroke:var(--gold)}
.js .hand{fill-opacity:0;stroke-dasharray:420;stroke-dashoffset:420}
.writing .hand{animation:write 2.1s cubic-bezier(.55,.1,.35,1) forwards,ink .9s ease forwards}
.writing .hand.n1{animation-delay:0s,1.4s}
.writing .hand.amp{animation-delay:.9s,1.9s}
.writing .hand.n2{animation-delay:1.25s,2.5s}
@keyframes write{to{stroke-dashoffset:0}}
@keyframes ink{to{fill-opacity:1;stroke-width:.4}}
.hero-line{font-family:var(--script);font-size:30px;color:var(--rose);margin:4px 0 0;line-height:1.1}
.hero-sub{margin:4px 0 0;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--muted)}
.js .hero-inner>.eyebrow,.js .hero-line,.js .hero-sub,.js .cue,.js .np-line{opacity:0;transform:translateY(12px)}
.writing .hero-inner>.eyebrow{animation:up .8s var(--ease) .1s forwards}
.writing .hero-line{animation:up .9s var(--ease) 2.6s forwards}
.writing .hero-sub{animation:up .9s var(--ease) 2.9s forwards}
.writing .np-line{animation:up .9s var(--ease) 3.2s forwards}
.writing .cue{animation:up .9s var(--ease) 3.5s forwards}
@keyframes up{to{opacity:1;transform:none}}
.np-line{display:inline-flex;align-items:center;gap:8px;margin:12px 0 0;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid rgba(242,193,78,.45);font-size:12px;letter-spacing:.04em;color:var(--muted)}
.np-line[hidden]{display:none}
.eq{display:inline-flex;gap:2px;align-items:flex-end;height:11px}
.eq i{width:2.5px;height:100%;background:var(--rose);border-radius:2px;transform-origin:bottom;transform:scaleY(.3)}
.playing .eq i{animation:eq .9s ease-in-out infinite}
.playing .eq i:nth-child(2){animation-delay:.2s}.playing .eq i:nth-child(3){animation-delay:.45s}
@keyframes eq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.cue{margin-top:14px;display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.cue i{width:1.5px;height:26px;background:linear-gradient(var(--rose),transparent);transform-origin:top;animation:cue 2s ease-in-out infinite}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.since{margin-top:10px;font-family:var(--serif);font-size:18px;color:var(--muted)}
.since p{margin:0}.since .days{font-size:15px}

/* ================= floating hearts (react to scroll) ================= */
.floaters{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .6s ease}
.floaters.on{opacity:1}
.fh{position:absolute;top:0;left:0;will-change:transform}
.fh svg{display:block;width:100%;height:100%;animation:bob var(--d,6s) ease-in-out infinite alternate}
@keyframes bob{from{transform:translateY(-6px) rotate(-10deg)}to{transform:translateY(6px) rotate(10deg)}}

/* ================= sections ================= */
.section{position:relative;max-width:600px;margin:0 auto;padding:64px 20px 20px}
h2{font-family:var(--serif);font-weight:600;font-size:clamp(36px,10vw,48px);line-height:1.05;color:var(--berry);margin:0 0 18px;text-align:center;letter-spacing:-.01em}
.kicker{margin:0 0 6px;text-align:center;font-size:11.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--rose);font-weight:500}
.section::before{content:"";display:block;width:64px;height:20px;margin:0 auto 18px;background:var(--flower) center/18px no-repeat,linear-gradient(90deg,transparent,var(--gold) 30%,transparent 30%,transparent 70%,var(--gold) 70%,transparent) center/100% 1.5px no-repeat}
/* titles: each word lifts out of a mask */
.title-in .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .04em .08em}
.title-in .w>span{display:inline-block;transform:translateY(105%) rotate(4deg);transition:transform .9s var(--ease)}
.title-in.in .w>span{transform:none}
.fade-up{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s var(--ease)}
.fade-up.in{opacity:1;transform:none}
html:not(.js) .fade-up{opacity:1;transform:none}
.us-text{max-width:30em;margin:0 auto;text-align:center;font-family:var(--serif);font-size:21px;line-height:1.45;color:var(--ink)}
.us-text p{margin:0 0 12px}
.places{margin-top:26px}
.place-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.place{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid rgba(242,193,78,.55);text-decoration:none;color:var(--berry);font-size:14px;font-weight:500;
  box-shadow:0 6px 14px -10px rgba(163,44,99,.5);transition:transform .2s ease}
.place:active{transform:scale(.95)}
.place svg{width:14px;height:14px;fill:var(--rose)}

/* pet-name ribbon */
.ribbon{position:relative;z-index:1;overflow:hidden;margin:44px 0 0;padding:12px 0;background:linear-gradient(90deg,var(--butter-2),var(--pink));transform:rotate(-2deg);box-shadow:0 10px 30px -18px rgba(163,44,99,.6)}
.ribbon-track{display:flex;width:max-content;animation:marquee 28s linear infinite}
.ribbon span{font-family:var(--script);font-size:26px;color:var(--berry-d);padding:0 18px;white-space:nowrap;line-height:1.2}
.ribbon span::after{content:"♥";font-family:var(--sans);font-size:12px;color:#fff;margin-left:36px;vertical-align:middle}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ================= timeline ================= */
.tl-wrap{position:relative;margin-top:14px}
.tl-rail{position:absolute;left:15px;top:6px;bottom:30px;width:3px;border-radius:3px;background:repeating-linear-gradient(180deg,rgba(227,118,157,.28) 0 6px,transparent 6px 12px)}
.tl-fill{position:absolute;inset:0;border-radius:3px;background:linear-gradient(180deg,var(--gold),var(--pink) 50%,var(--rose));transform-origin:50% 0;transform:scaleY(0);will-change:transform}
.tl-heart{position:absolute;left:50%;top:0;width:26px;height:26px;margin:-13px 0 0 -13px;will-change:transform;filter:drop-shadow(0 3px 6px rgba(163,44,99,.45))}
.tl-heart svg{width:100%;height:100%;fill:var(--rose);animation:beat 1.3s ease-in-out infinite}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.22)}30%{transform:scale(.95)}45%{transform:scale(1.12)}}
.timeline{list-style:none;margin:0;padding:0}
.memory{position:relative;padding:0 0 46px 42px;perspective:1000px}
.memory:last-child{padding-bottom:10px}
.memory .dot{position:absolute;left:9px;top:6px;width:15px;height:15px;border-radius:50%;background:#fff;border:3px solid var(--pink);transform:scale(0);transition:transform .5s var(--spring) .1s}
.memory.in .dot{transform:scale(1)}
.memory.lit .dot{border-color:var(--rose);background:var(--butter-2)}
.mcard{transform-origin:50% 0;transform:rotateX(18deg) translateY(40px) scale(.97);opacity:0;transition:transform 1.1s var(--ease),opacity .8s ease}
.memory.in .mcard{transform:none;opacity:1}
html:not(.js) .mcard{transform:none;opacity:1}
.pills{margin:0 0 6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pill{display:inline-block;padding:3px 11px;border-radius:999px;background:linear-gradient(90deg,var(--butter-2),var(--pink));color:var(--berry-d);font-size:12.5px;font-weight:600;letter-spacing:.04em}
.where{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--muted)}
.where svg{width:13px;height:13px;fill:var(--rose)}
.memory h3{font-family:var(--serif);font-weight:600;font-size:29px;line-height:1.1;margin:2px 0 6px;color:var(--berry)}
.mtext{margin:0 0 16px;font-size:16.5px;line-height:1.55;color:var(--ink)}

/* ================= photo deck (swipe the top card) ================= */
.deck{position:relative;width:100%;height:min(118vw,470px);container-type:size;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
.deck.single{height:min(100vw,400px)}
.card{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transition:transform .55s var(--ease),opacity .4s ease;will-change:transform;pointer-events:none}
.card.top{pointer-events:auto;cursor:grab}
.card.drag{transition:none}
.card.gone{transition:transform .45s cubic-bezier(.4,.1,.6,1),opacity .45s ease}
.ph{position:relative;background:#fff;padding:8px 8px 8px;border-radius:14px;box-shadow:0 18px 40px -22px rgba(111,29,71,.55),0 2px 8px -4px rgba(111,29,71,.25);overflow:hidden}
.ph img,.ph video{max-width:calc(100cqw - 34px);max-height:calc(100cqh - 34px);width:auto;height:auto;border-radius:8px;-webkit-user-drag:none;pointer-events:none}
.ph.wait{width:78cqw;height:78cqh}
.ph.wait img,.ph.wait video{position:absolute;opacity:0}
.ph::after{content:"";position:absolute;inset:8px;border-radius:8px;background:#fffdf8;opacity:0;pointer-events:none}
.ph .play{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:rgba(255,255,255,.85);box-shadow:0 4px 14px rgba(0,0,0,.25)}
.ph .play::after{content:"";position:absolute;left:19px;top:15px;border-left:14px solid var(--berry);border-top:9px solid transparent;border-bottom:9px solid transparent}
.ph.playing .play{opacity:0;transition:opacity .4s}
/* developing polaroid */
.dev-wait .card.top .ph img,.dev-wait .card.top .ph video{filter:grayscale(1) brightness(1.35) blur(5px)}
.dev-wait .card.top .ph::after{opacity:.92}
.dev-go .card.top .ph img,.dev-go .card.top .ph video{filter:none;transition:filter 2.2s ease}
.dev-go .card.top .ph::after{opacity:0;transition:opacity 1.8s ease}
.deck-ui{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font-size:12.5px;color:var(--muted);letter-spacing:.06em}
.deck-count b{color:var(--berry);font-weight:600}
.deck-hint{display:inline-flex;align-items:center;gap:6px}
.deck-hint i{display:inline-block;width:18px;height:18px;border-radius:50%;background:var(--pink);animation:swipeHint 1.8s ease-in-out infinite}
@keyframes swipeHint{0%,100%{transform:translateX(-5px);opacity:.5}50%{transform:translateX(7px);opacity:1}}
.deck-btns{display:flex;gap:8px}
.deck-btns button{width:34px;height:34px;border-radius:50%;border:1px solid rgba(242,193,78,.6);background:#fff;color:var(--berry);font-size:18px;line-height:1;cursor:pointer;box-shadow:0 6px 12px -8px rgba(163,44,99,.5)}
.deck-btns button:active{transform:scale(.92)}

/* ================= letter: unfolds like paper ================= */
.letter{position:relative;margin:8px 0 0;perspective:1400px}
.paper{position:relative;padding:34px 34px 38px;border-radius:6px;background:
  linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,0) 20%),
  repeating-linear-gradient(180deg,transparent 0 33px,rgba(227,118,157,.13) 33px 34px),#fffdf6;
  box-shadow:0 30px 60px -32px rgba(111,29,71,.55),0 2px 10px -4px rgba(111,29,71,.2);color:#43202f}
.paper::before{content:"";position:absolute;top:-10px;left:50%;width:90px;height:22px;margin-left:-45px;background:rgba(255,229,146,.75);transform:rotate(-2deg);border-radius:2px}
.l-greet{font-family:var(--script);font-size:44px;line-height:1;color:var(--berry);margin:4px 0 16px}
.l-body p{font-family:var(--serif);font-size:20.5px;line-height:1.5;margin:0 0 14px}
.l-sign{font-family:var(--script);font-size:36px;color:var(--berry);margin:20px 0 0;text-align:right;line-height:1.1}
.letter.folded .paper{visibility:hidden}
.fold{position:absolute;inset:0;pointer-events:none}
.fpanel{position:absolute;left:0;right:0;transform-style:preserve-3d;transition:transform 1.1s cubic-bezier(.45,.05,.25,1)}
.fpanel .paper{visibility:visible!important;position:absolute;left:0;right:0;box-shadow:none;border-radius:0}
.fpanel .face{position:absolute;inset:0;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.fpanel .back{transform:rotateX(180deg);background:linear-gradient(180deg,#fbf2e2,#f6e7cf)}
.fpanel.p0{transform-origin:50% 100%;transform:perspective(1400px) rotateX(-178deg)}
.fpanel.p2{transform-origin:50% 0;transform:perspective(1400px) rotateX(178deg)}
.fpanel.p1 .face.front::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(111,29,71,.12),transparent 20%,transparent 80%,rgba(111,29,71,.12))}
.letter.unfold .fpanel.p0{transform:perspective(1400px) rotateX(0deg)}
.letter.unfold .fpanel.p2{transform:perspective(1400px) rotateX(0deg);transition-delay:.6s}
.fold-shadow{position:absolute;left:4%;right:4%;bottom:-6px;height:30px;border-radius:50%;background:rgba(111,29,71,.25);filter:blur(12px);z-index:-1}
.l-body p,.l-sign{opacity:1}

/* ================= more of us ================= */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:16px 14px;align-items:start;padding:6px 4px}
.photo{margin:0;opacity:0;transform:translateY(40px) rotate(var(--r,0deg)) scale(.92);transition:transform 1s var(--spring),opacity .7s ease}
.photo.in{opacity:1;transform:rotate(var(--r,0deg))}
html:not(.js) .photo{opacity:1}
.photo:nth-child(1){--r:-3deg}
.photo:nth-child(2){--r:3deg;margin-top:18px}
.photo:nth-child(3){--r:-2deg;margin-top:-4px}
.photo:nth-child(4){--r:2.5deg;margin-top:14px}
.photo:nth-child(4) .media::before{background:rgba(255,229,146,.85);transform:rotate(-4deg)}
.media{display:block;width:100%;padding:8px 8px 26px;border:0;background:#fff;border-radius:6px;cursor:zoom-in;box-shadow:0 18px 34px -20px rgba(111,29,71,.55);position:relative}
.media img,.media video{width:100%;height:auto;border-radius:3px}
.media.vid .play{position:absolute;left:50%;top:45%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:rgba(255,255,255,.85)}
.media.vid .play::after{content:"";position:absolute;left:17px;top:13px;border-left:13px solid var(--berry);border-top:9px solid transparent;border-bottom:9px solid transparent}
.media.vid.playing .play{opacity:0}
.media::before{content:"";position:absolute;top:-8px;left:50%;width:56px;height:16px;margin-left:-28px;background:rgba(247,169,194,.7);transform:rotate(-3deg);z-index:1}
.photo:nth-child(2) .media::before{background:rgba(255,229,146,.85);transform:rotate(4deg)}

/* ================= a pinky promise: she signs it ================= */
.pinky-sec{padding-bottom:10px}
.pk-card{position:relative;margin:18px auto 0;max-width:360px;padding:22px 20px 18px;border-radius:18px;text-align:center;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .3 0 0 0 0 .16 0 0 0 .24 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),linear-gradient(170deg,#fffdf8 0%,#fff6ea 55%,#fdeee8 100%);background-size:180px 180px,cover;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -18px rgba(111,29,71,.35),0 3px 10px -4px rgba(111,29,71,.18);transform:rotate(-.6deg)}
.pk-card::before{content:"";position:absolute;inset:8px;border:1px solid rgba(160,114,32,.45);border-radius:12px;box-shadow:inset 0 0 0 3px rgba(255,250,240,.9),inset 0 0 0 4px rgba(160,114,32,.22);pointer-events:none}
.pk-art{display:block;width:168px;height:auto;margin:2px auto 4px;overflow:visible}
.pk-text{margin:6px 4px 0;padding:0;font:italic 500 21px/1.42 var(--serif);color:var(--ink);text-wrap:pretty}
.pk-text p{margin:0}
.pk-text .pk-from{margin-top:8px;font:400 30px/1 var(--script);color:var(--berry-d)}
.pk-sign{position:relative;margin:16px 6px 0}
.pk-pad{position:relative;height:118px;border-radius:12px;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px rgba(160,114,32,.18);touch-action:none;-webkit-user-select:none;user-select:none;overflow:hidden}
.pk-pad canvas,.pk-pad img{position:absolute;inset:0;width:100%;height:100%;display:block}
.pk-pad canvas{touch-action:none;cursor:crosshair;-webkit-tap-highlight-color:transparent}
.pk-pad img[hidden],.pk-pad canvas[hidden]{display:none}
.pk-ph{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);font:italic 500 16px/1 var(--serif);color:rgba(133,84,107,.55);pointer-events:none;transition:opacity .3s}
.pk-inked .pk-ph{opacity:0}
.pk-line{position:relative;margin:0;padding-top:7px;border-top:1.5px solid rgba(111,29,71,.55);text-align:left;font:500 10.5px/1 var(--sans);letter-spacing:.36em;text-transform:uppercase;color:var(--gold-d)}
.pk-line::before{content:"✕";position:absolute;left:2px;top:-26px;font:400 15px/1 var(--sans);letter-spacing:0;color:rgba(111,29,71,.45)}
.pk-wax{position:absolute;right:-6px;bottom:-14px;width:74px;height:74px;opacity:0;transform:scale(1.8) rotate(-24deg);pointer-events:none;filter:drop-shadow(0 4px 5px rgba(90,58,8,.35))}
.pk-wax svg{display:block;width:100%;height:100%}
.pk-sealed .pk-wax{opacity:1;transform:rotate(-12deg)}
.pk-pressing .pk-wax{animation:pkPress .75s cubic-bezier(.3,1.35,.5,1) both}
@keyframes pkPress{0%{opacity:0;transform:scale(1.9) rotate(-26deg)}45%{opacity:1;transform:scale(.9) rotate(-12deg)}70%{transform:scale(1.05) rotate(-12deg)}100%{opacity:1;transform:rotate(-12deg)}}
.pk-pressing .pk-pad{animation:pkThud .75s ease-out both}
@keyframes pkThud{0%,40%{transform:none}52%{transform:translateY(2px) scale(.995)}100%{transform:none}}
.pk-glint{position:absolute;z-index:3;width:14px;height:14px;pointer-events:none;background:var(--spark) center/contain no-repeat;filter:sepia(1) saturate(4) hue-rotate(-12deg) brightness(1.15)}
.pk-btns{display:flex;justify-content:center;gap:12px;margin-top:22px}
.pk-btn{appearance:none;border:0;margin:0;cursor:pointer;font:500 15px/1 var(--sans);letter-spacing:.06em;padding:12px 20px;border-radius:999px;transition:transform .2s var(--spring),opacity .3s,box-shadow .3s}
.pk-btn:active{transform:scale(.96)}
.pk-btn:focus-visible,.pk-again:focus-visible{outline:2px solid var(--rose);outline-offset:3px}
.pk-clear{background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px rgba(133,84,107,.35)}
.pk-go{color:#fff;background:linear-gradient(135deg,#c2457a,#8f1d45);box-shadow:0 8px 18px -8px rgba(143,29,69,.7),inset 0 1px 0 rgba(255,255,255,.25)}
.pk-go:disabled{opacity:.42;cursor:default;box-shadow:none}
.pk-done{margin:0;text-align:center;font:italic 500 23px/1.3 var(--serif);color:var(--berry);height:0;opacity:0;overflow:hidden;transform:translateY(6px);transition:opacity .6s .45s,transform .6s .45s}
.pk-again{display:none;margin:6px auto 0;padding:4px 8px;border:0;background:none;cursor:pointer;font:500 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);text-decoration:underline;text-underline-offset:3px;opacity:.75}
.pk-sealed .pk-btns{display:none}
.pk-sealed .pk-done{height:auto;margin-top:26px;opacity:1;transform:none}
.pk-sealed .pk-again{display:block}
.pk-sealed .pk-pad{box-shadow:none;background:transparent}
@media (prefers-reduced-motion: reduce){.pk-pressing .pk-wax,.pk-pressing .pk-pad{animation:none!important}.pk-done,.pk-ph,.pk-btn{transition:none}}

/* ================= reasons ================= */
.reasons{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.reason{position:relative;display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:18px;background:linear-gradient(120deg,#fff 40%,var(--blush));box-shadow:0 14px 28px -22px rgba(111,29,71,.6);
  opacity:0;transform:perspective(700px) rotateY(-24deg) translateX(-20px);transform-origin:0 50%;transition:opacity .7s ease,transform .9s var(--ease)}
.reason:nth-child(even){background:linear-gradient(120deg,#fff 40%,var(--butter))}
.reason.in{opacity:1;transform:none}
.reason .num{font-family:var(--serif);font-size:30px;font-weight:600;color:var(--rose);line-height:1;min-width:34px}
.reason:nth-child(even) .num{color:var(--gold-d)}
.reason p{margin:0;font-size:17px;line-height:1.45}

/* ================= closing shot ================= */
.closing{position:relative;z-index:1;padding:70px 20px 30px;text-align:center;overflow:hidden}
.closing-shot{position:relative;width:min(86vw,420px);margin:0 auto;border-radius:200px 200px 18px 18px;overflow:hidden;box-shadow:0 0 0 6px #fff,0 0 0 7px rgba(242,193,78,.45),0 40px 60px -30px rgba(111,29,71,.6);
  clip-path:inset(50% 0 50% 0 round 200px 200px 18px 18px);transition:clip-path 1.6s cubic-bezier(.6,0,.2,1)}
.closing-shot img{width:100%;height:auto;transform:scale(1.25);transition:transform 4s cubic-bezier(.2,.6,.2,1)}
.closing.in .closing-shot{clip-path:inset(0 0 0 0 round 200px 200px 18px 18px)}
.closing.in .closing-shot img{transform:scale(1)}
html:not(.js) .closing-shot{clip-path:none}
.closing-line{font-family:var(--script);font-size:44px;line-height:1.1;color:var(--berry);margin:26px 0 6px;opacity:0;transform:translateY(16px);transition:opacity 1s ease 1.2s,transform 1s var(--ease) 1.2s}
.closing.in .closing-line{opacity:1;transform:none}
.closing-heart svg{width:30px;height:30px;fill:var(--rose);animation:beat 1.4s ease-in-out infinite}
.footer{text-align:center;padding:10px 20px calc(92px + env(safe-area-inset-bottom));color:var(--muted);font-size:14px}
.footer p{margin:0}
.script{font-family:var(--script)}
.script.small{font-size:28px;color:var(--rose);line-height:1.2}

/* heart confetti (last memory) */
.hconfetti{position:fixed;inset:0;z-index:40;pointer-events:none;overflow:hidden}
.hc{position:absolute;top:0;left:0;width:16px;height:16px;will-change:transform,opacity}
.hc svg{width:100%;height:100%}

/* little leftover decorations her test expects */
.scales{height:10px;background:radial-gradient(circle at 10px 0,transparent 9px,var(--pink) 9.5px,transparent 10px) 0 0/20px 10px repeat-x;opacity:.6}
.petal{position:absolute;width:12px;height:12px;background:var(--flower) center/contain no-repeat}

/* ================= music button ================= */
.music{position:fixed;right:calc(6px + env(safe-area-inset-right));bottom:calc(10px + env(safe-area-inset-bottom));z-index:45;width:40px;height:40px;padding:0;border-radius:50%;border:0;background:none;cursor:pointer;
  box-shadow:0 8px 18px -8px rgba(111,29,71,.7);transition:opacity .3s ease,transform .3s var(--ease)}
.music[hidden]{display:none}
.vinyl{position:absolute;inset:0;border-radius:50%;overflow:hidden}
.vinyl svg{width:100%;height:100%}
.music.on .vinyl{animation:spin 4s linear infinite}
.mpause{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:3px;border-radius:50%;background:rgba(59,26,44,.55);opacity:1;transition:opacity .25s}
.mpause i{width:0;height:0;border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.mpause i+i{display:none}
.music.on .mpause{opacity:0}
.music:active{transform:scale(.92)}
@keyframes spin{to{transform:rotate(360deg)}}
.intro-on .music,.lb-open .music{opacity:0;pointer-events:none}

/* ================= lightbox ================= */
.lb-open,html.lb-open body{overflow:hidden}
.lb{position:fixed;inset:0;z-index:50;background:radial-gradient(120% 80% at 50% 0%,#3a1630,#170810 70%);display:flex;flex-direction:column;opacity:0;transition:opacity .3s ease;overscroll-behavior:contain;touch-action:pan-x}
.lb[hidden]{display:none}
.lb.show{opacity:1}
.lb-top{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:calc(12px + env(safe-area-inset-top)) 14px 12px 20px;color:#fff;background:linear-gradient(180deg,rgba(23,8,16,.6),transparent)}
.lb-count{font-size:12px;letter-spacing:.24em;font-weight:500;color:var(--butter-2)}
.lb-close{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,198,215,.35);background:rgba(247,169,194,.16);color:#fff;font-size:17px;cursor:pointer}
.lb-track{flex:1;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.lb-track::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:center;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;padding:calc(64px + env(safe-area-inset-top)) 0 calc(74px + env(safe-area-inset-bottom))}
.slide img,.slide video{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px;-webkit-user-select:none;user-select:none;box-shadow:0 20px 60px -20px rgba(0,0,0,.6)}
.lb.show .slide img{animation:lbIn .45s var(--ease) both}
@keyframes lbIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.lb-cap{position:absolute;left:0;right:0;bottom:0;margin:0;padding:16px 26px calc(20px + env(safe-area-inset-bottom));text-align:center;color:#ffe3ec;font-family:var(--serif);font-style:italic;font-size:18px;line-height:1.3;pointer-events:none;background:linear-gradient(0deg,rgba(23,8,16,.6),transparent)}
.lb-nav{display:none}
@media (hover:hover) and (pointer:fine){
  .lb-nav{display:block;position:absolute;top:50%;margin-top:-26px;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,198,215,.3);background:rgba(247,169,194,.14);color:#fff;font-size:30px;line-height:1;cursor:pointer;z-index:2}
  .lb-nav.prev{left:18px}.lb-nav.next{right:18px}.lb-nav:disabled{opacity:.25;cursor:default}
}

@media (min-width:760px){
  .hero-ph{height:min(62svh,560px)}
  .memory{padding-left:56px}
  .tl-rail{left:20px}.memory .dot{left:14px}
}

/* ================= reduced motion: everything just shows ================= */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .hero-photo{animation:none}
  .js .hand{stroke-dasharray:none;stroke-dashoffset:0;fill-opacity:1}
  .js .hero-inner>.eyebrow,.js .hero-line,.js .hero-sub,.js .cue,.js .np-line{opacity:1;transform:none}
  .ribbon-track{animation:none}
  .floaters,.hconfetti{display:none}
}