*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family: Arial, sans-serif;
}

#countdown-page{
    height:100vh;
    background:url('images/fond-coucher-soleil.jpg') center center/cover;
    display:flex;
    justify-content:center;
    align-items:center;
}

.overlay{
    text-align:center;
    color:white;
}

h1{
    font-size:4rem;
    margin-bottom:30px;
}

.date-reveal{
    margin-bottom:30px;
}

#countdown{
    display:flex;
    gap:20px;
    justify-content:center;
}

#countdown div{
    background:rgba(255,255,255,.15);
    border:1px solid rgba(255,255,255,.4);
    backdrop-filter:blur(8px);
    padding:20px;
    border-radius:15px;
    min-width:120px;
}

#countdown span{
    display:block;
    font-size:3rem;
    font-weight:bold;
}

#reveal-page{
    display:none;
    min-height:100vh;
    background:#faf5f5;
    padding:40px;
}

.card{
    max-width:1000px;
    margin:auto;
    border-radius:20px;
    padding:40px;
    box-shadow:0 10px 40px rgba(0,0,0,.1);
}

.destination-box{
    background:#fff3f6;
    border:1px solid #ffd6df;
    padding:20px;
    margin:25px 0;
    border-radius:15px;
}

.infos{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:20px;
    margin:30px 0;
}

.infos div{
    text-align:center;
    padding:20px;
    background:#fafafa;
    border-radius:15px;
}

.final-text{
    margin-top:30px;
    font-size:1.5rem;
    font-style:italic;
}

.bonus{
    text-align:center;
    color:#e04b77;
    margin-top:40px;
    font-size:1.2rem;
}