:root{--navy:#123b80;--sky:#c9edff;--gold:#b77b13}*{box-sizing:border-box}html,body{margin:0;background-color:var(--sky)}body{color:var(--navy);font-family:Fredoka,Arial,sans-serif;background-image:radial-gradient(circle,#73b9df38 0 7px,transparent 8px),linear-gradient(35deg,transparent 46%,#f5ad3630 47% 54%,transparent 55%);background-size:112px 112px,92px 92px}.invitation-page{width:min(100%,620px);min-height:100svh;margin:0 auto;padding:0 10px 32px}.hero-section{position:relative;width:100%;aspect-ratio:.78;isolation:isolate}.hero-section:before{content:"";position:absolute;z-index:2;top:0;bottom:0;left:50%;width:auto;aspect-ratio:2/3;transform:translateX(-50%);background:url("assets/ornamental-frame.png") center/contain no-repeat;pointer-events:none}.balloons{position:absolute;z-index:1;top:4%;width:auto;height:92%;object-fit:contain}.balloons-left{left:0}.balloons-right{right:0}.invited,.characters,.ribbon,.hero-section h1{position:absolute;z-index:3}.invited{top:12%;left:23%;display:flex;width:54%;justify-content:center;color:#98651b;font-family:Georgia,serif;font-size:clamp(22px,5.5vw,36px);font-weight:700;text-shadow:0 1px #fff,0 3px 3px #8b621f44}.invited span,.ribbon-copy span{display:inline-block;transform:translateY(var(--curve-y)) rotate(var(--curve-r));transform-origin:center bottom}.characters{top:22%;left:24%;width:52%;height:auto;object-fit:contain;filter:drop-shadow(0 4px 3px #183d6226)}.ribbon{margin:0}.ribbon img{display:block;width:100%;height:auto;object-fit:contain}.ribbon-blue{top:58%;left:25%;width:50%}.ribbon-gold{top:78%;left:24%;width:52%}.ribbon-copy{position:absolute;display:flex;align-items:center;justify-content:center;overflow:hidden;white-space:nowrap;line-height:1}.ribbon-copy-blue{inset:20% 18% 31%;color:#fff;font-family:Georgia,serif;font-size:clamp(13px,3.2vw,20px);font-weight:700;text-shadow:0 1px #b8ddff,0 2px 2px #0c3a76}.ribbon-copy-gold{inset:21% 14% 25%;color:#85560e;font-family:Georgia,serif;font-size:clamp(11px,2.7vw,17px);font-weight:700;font-style:italic;text-shadow:0 1px #fff,0 2px 2px #9b6b1c44}.hero-section h1{top:68%;left:22%;width:56%;margin:0;text-align:center;color:#173f78;font-size:clamp(40px,10vw,62px);line-height:1;letter-spacing:-.04em;text-shadow:0 2px #fff,0 4px #e0bb58,0 6px 5px #173f7833}.hero-section h1 small{font-size:.3em;vertical-align:middle;filter:sepia(1) saturate(1.5)}.details-section{display:grid;grid-template-columns:1fr 3px 1.45fr;align-items:center;min-height:148px;margin-top:16px;padding:18px 17px;background:#fffffff0;box-shadow:0 8px 20px #123b801a}.details-section hr{width:3px;height:110px;margin:0;border:0;background:var(--navy)}.date,.event{display:flex;margin:0;flex-direction:column;align-items:center}.date span{font-size:16px}.date strong{font-family:Georgia,serif;font-size:60px;line-height:.88;font-weight:500}.event strong{font-size:18px}.event span{margin-top:12px;font-size:16px;font-weight:700}.event small{margin-top:3px;font-size:14px;line-height:1.15}.rsvp-section{text-align:center}.rsvp-section button{width:100%;margin-top:18px;padding:15px 22px;border:0;border-radius:999px;color:#fff;background:var(--navy);font:700 18px Fredoka;cursor:pointer;box-shadow:0 8px #0a285d;transition:.2s}.rsvp-section button:hover{transform:translateY(-2px);box-shadow:0 10px #0a285d}.rsvp-section button:focus-visible{outline:4px solid var(--gold);outline-offset:3px}.rsvp-section p{margin:18px 0 0;font-size:14px;font-weight:600}@media(max-width:480px){.invitation-page{padding-inline:4px}.details-section{padding-inline:9px}.event strong{font-size:16px}}