.anniversary-celebration { background: radial-gradient(circle at 50% 40%, #fffefa 0, #fbf2f7 43%, #e9d6e8 100%); isolation: isolate; overflow: hidden; padding: clamp(4rem, 8vw, 7rem) max(6vw, 1.4rem); position: relative; text-align: center; }
.anniversary-content { margin: 0 auto; max-width: 860px; position: relative; z-index: 1; }.anniversary-celebration .eyebrow { margin-bottom: 1rem; }.anniversary-celebration h2 { color: var(--ink); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.4rem, 5.5vw, 5.25rem); font-weight: 500; letter-spacing: -.055em; line-height: .98; margin: 0 auto; max-width: 780px; }.anniversary-with { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 1.15rem; margin: 1.6rem 0 .35rem; }
.anniversary-logo-crop { aspect-ratio: 5.1 / .72; margin: 0 auto; max-width: min(550px, 83vw); overflow: hidden; }.anniversary-logo-crop img { display: block; height: auto; width: 100%; }.anniversary-date { color: var(--muted); font-size: .82rem; font-weight: 750; letter-spacing: .08em; margin: .7rem 0 0; text-transform: uppercase; }
.anniversary-firework { background: repeating-conic-gradient(from 0deg, rgba(114, 59, 104, .74) 0deg 3deg, transparent 3deg 15deg); border-radius: 50%; height: 240px; mask: radial-gradient(circle, transparent 0 17%, #000 19% 50%, transparent 52%); opacity: .46; pointer-events: none; position: absolute; width: 240px; z-index: 0; }.anniversary-firework::after { background: radial-gradient(circle, #f6bcd7 0 11%, transparent 13%); content: ''; inset: 0; position: absolute; }.anniversary-firework-one { left: -28px; top: 13%; transform: rotate(13deg); }.anniversary-firework-two { background: repeating-conic-gradient(from 0deg, rgba(191, 134, 56, .72) 0deg 3deg, transparent 3deg 15deg); height: 300px; right: -65px; top: -33px; width: 300px; }.anniversary-firework-three { background: repeating-conic-gradient(from 0deg, rgba(132, 85, 152, .6) 0deg 3deg, transparent 3deg 14deg); bottom: -115px; height: 230px; left: 46%; width: 230px; }
@media (max-width: 600px) { .anniversary-celebration { padding-bottom: 4.5rem; padding-top: 4.5rem; }.anniversary-firework { transform: scale(.72); }.anniversary-firework-one { left: -72px; top: 0; }.anniversary-firework-two { right: -100px; top: -76px; }.anniversary-firework-three { left: 25%; }.anniversary-date { font-size: .68rem; line-height: 1.6; } }