.floating-rsvp {

position: fixed;
bottom: 20px;
right: 20px;

background: var(--color-gold);
color: white;

padding: 14px 22px;

border-radius: 30px;

font-size: 16px;

text-decoration: none;

box-shadow: 0 8px 20px rgba(0,0,0,0.2);

z-index: 999;

display: none;

}

@media (max-width: 768px) {

.floating-rsvp {
display: block;
}

}

.section-divider {

    width: 120px;
    height: 100px;
    margin: 60px auto;
    opacity: 0.8;
    background-image: var(--divider);
    background-size: cover;
    background-position: center;

}

.btn-primary {

border: 1px solid var(--color-gold);
padding: 14px 30px;
text-decoration: none;
color: var(--color-gold);
transition: all 0.3s ease;
display: inline-block;
margin: 0.5rem 0;

}

.btn-primary:hover {

background: var(--color-gold);
color: white;

}



.btn-secondary {

background: var(--color-gold);
color: white;

border: 1px solid var(--color-gold);
padding: 14px 30px;
text-decoration: none;
transition: all 0.3s ease;
display: inline-block;
margin: 0.5rem 0;

}

.btn-secondary:hover {

background: transparent;
color: var(--color-gold);

}

.timeline {

position: relative;
margin-top: 60px;

}

.timeline::before {

content: "";
position: absolute;
left: 50%;
top: 0;
width: 2px;
height: 100%;
background: var(--color-gold);

}

.timeline-item {

display: flex;
justify-content: space-between;

margin-bottom: 40px;

}

.timeline-time {

width: 45%;
text-align: right;

font-weight: bold;

}

.timeline-content {

width: 45%;
text-align: left;

}

.faq-answer {

max-height: 0;
overflow: hidden;

transition: max-height 0.4s ease;

}

.faq-answer.open {

max-height: 200px;

}

form {

display: flex;
flex-direction: column;
gap: 20px;

max-width: 500px;

margin: auto;

}

input,
select,
textarea {

padding: 14px;

border: 1px solid #ddd;

font-size: 16px;

}

textarea {

min-height: 120px;

}

#password-overlay {

position: fixed;

top: 0;
left: 0;

width: 100%;
height: 100%;

background: #ffffff;

display: flex;

justify-content: center;
align-items: center;

z-index: 2000;

}

.password-box {

background: white;

padding: 40px;

border: 1px solid #ddd;

text-align: center;

width: 300px;

}

.password-box input {

width: 100%;

padding: 10px;

margin-top: 10px;
margin-bottom: 20px;

border: 1px solid #ccc;

}

.password-box button {

padding: 10px 20px;

background: #c6a663;

border: none;

color: white;

cursor: pointer;

}

.countdown {
    color: var(--color-gold);
    background: antiquewhite;
    max-width: 300px;
    margin: 0 auto 8px auto;
    padding: 12px 18px;
    border-radius: 25px;
    font-size: 30px;
    letter-spacing: 1px;
    line-height: 35px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

@media (max-width: 600px) {
    .countdown {
        font-size: 25px;
        line-height: 28px;
    }
}

hr{
    margin: 20px 40px;
}