body {
    margin:0;
    font-family:'Montserrat', sans-serif;
    background:#0f0f0f;
    color:#fff;
    overflow-x:hidden;
}

/* HERO */
.hero {
    height:100vh;
    background: url('img/photo1.jpg') center/cover no-repeat;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
}
.hero::after {
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,0.5);
}
.hero-content {
    position:relative;
    z-index:2;
    text-align:center;
    animation:fadeUp 1.5s ease;
}
.names {
    font-family:'Playfair Display', serif;
    font-size:56px;
}
.date {
    margin-top:10px;
    letter-spacing:3px;
}

/* SECTION */
.section {
    padding:100px 20px;
    text-align:center;
    opacity:0;
    transform:translateY(50px);
    transition:1s;
}
.section.visible {
    opacity:1;
    transform:translateY(0);
}
h2 { font-family:'Playfair Display', serif; font-size:34px; }

/* BUTTON */
.button {
    display:inline-block;
    margin-top:20px;
    padding:14px 28px;
    border:1px solid #fff;
    text-decoration:none;
    color:#fff;
    transition:0.3s;
}
.button:hover {
    background:#fff;
    color:#000;
}

/* TIMER */
.flip-timer{
    display:flex;
    justify-content:center;
    align-items:flex-end;
    gap:30px;
    margin-top:60px;
    flex-wrap:wrap;
}
.timer-unit{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:15px;
}
.flip-card{
    width:80px;
    height:100px;
    position:relative;
    perspective:1000px;
    background:linear-gradient(135deg,#2a2a2a 0%,#1a1a1a 100%);
    border:1px solid #444;
    border-radius:8px;
    box-shadow:0 10px 30px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1);
    display:flex;
    align-items:center;
    justify-content:center;
}
.flip-card span{
    font-size:36px;
    font-weight:600;
    letter-spacing:2px;
}
.flip{
    animation:flipAnim 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
}
@keyframes flipAnim{
    0%{transform:rotateX(0deg);}
    50%{transform:rotateX(-90deg);}
    100%{transform:rotateX(0deg);}
}
.timer-label{
    font-size:12px;
    letter-spacing:1px;
    color:#999;
    font-weight:400;
    text-transform:uppercase;
}

/* ANIMATION */
@keyframes fadeUp {
    from {opacity:0; transform:translateY(40px);}
    to {opacity:1; transform:translateY(0);}
}

/* MOBILE */
@media(max-width:768px){
    .hero{height:80vh;}
    .names{font-size:36px;}
    .date{font-size:14px;}
    .section{padding:60px 15px;}
    h2{font-size:26px;}
    .flip-card{width:60px;height:75px;}
    .flip-card span{font-size:26px;}
}
@media(max-width:480px){
    .hero{height:70vh;}
    .names{font-size:28px;}
    .date{font-size:12px;}
    .flip-card{width:50px;height:65px;}
    .flip-card span{font-size:22px;}
}