/* Anniversary Reminder - Premium Theme */

.anniversary-card {
    animation: cardFloat 0.6s ease-out;
}

@keyframes cardFloat {
    from { opacity: 0; transform: translateY(30px) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.anniversary-hero-number {
    font-size: 5rem;
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, #7a1a3b, #d4a926);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.fact-card {
    transition: all 0.3s ease;
}

.fact-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(122, 26, 59, 0.1);
}

.gift-item {
    animation: giftSlide 0.4s ease-out forwards;
    opacity: 0;
}

.gift-item:nth-child(1) { animation-delay: 0.1s; }
.gift-item:nth-child(2) { animation-delay: 0.15s; }
.gift-item:nth-child(3) { animation-delay: 0.2s; }
.gift-item:nth-child(4) { animation-delay: 0.25s; }
.gift-item:nth-child(5) { animation-delay: 0.3s; }

@keyframes giftSlide {
    to { opacity: 1; transform: translateX(0); }
    from { opacity: 0; transform: translateX(-10px); }
}

.countdown-ring {
    position: relative;
    width: 120px;
    height: 120px;
}

.countdown-ring svg {
    transform: rotate(-90deg);
}

.countdown-ring .ring-bg {
    fill: none;
    stroke: #fef3c7;
    stroke-width: 8;
}

.countdown-ring .ring-progress {
    fill: none;
    stroke: url(#ringGradient);
    stroke-width: 8;
    stroke-linecap: round;
    transition: stroke-dashoffset 1s ease-out;
}

.milestone-badge {
    padding: 6px 12px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    background: linear-gradient(135deg, #fdf2f8, #fce7f3);
    color: #9d174d;
    border: 1px solid #fbcfe8;
}

.heart-pulse {
    animation: heartBeat 1.5s ease-in-out infinite;
}

@keyframes heartBeat {
    0%, 100% { transform: scale(1); }
    14% { transform: scale(1.1); }
    28% { transform: scale(1); }
    42% { transform: scale(1.1); }
    70% { transform: scale(1); }
}