/* ========================= */
/* СБРОС */
/* ========================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    background:#ffffff;
    font-family:'Cormorant Garamond', serif;
    font-size:18px;
    line-height:1.7;
    color:#444;
    display:flex;
    justify-content:center;
}

.site{
    width:100%;
    max-width:430px;
    background:#ffffff;
     width:100%;
    max-width:430px;
    margin:0 auto;
}

/* ========================= */
/* HERO */
/* ========================= */

.hero{
    position:relative;
    width:100%;
    height:100vh;
    overflow:hidden;
}

.hero-image{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:1s;
}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.25);
    transition:1s;
}

.content{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    color:white;
    text-align:center;
    padding:25px;
}

.date{
    font-size:18px;
    margin-bottom:20px;
}

h1{
    font-size:58px;
    font-weight:300;
    line-height:1;
}

h1 span{
    display:block;
    font-size:30px;
    margin:12px 0;
}

.subtitle{
    margin-top:30px;
    line-height:1.6;
    font-size:19px;
    max-width:320px;
}

#open{
    margin-top:45px;
    border:none;
    border-radius:50px;
    padding:18px 36px;
    font-size:18px;
    cursor:pointer;
    background:white;
    color:#444;
    transition:.35s;
}

#open:hover{
    transform:translateY(-3px);
}

/* ========================= */
/* ПРИГЛАШЕНИЕ */
/* ========================= */

#invitation{
    background:#ffffff;
    padding:60px 25px 80px;
}

/* Кирилл + Влада (PNG) */

.kids-title{
    display:block;
    width:88%;
    margin:0 auto 15px;
}

/* Фото + подпись (одна картинка) */

.child-photo{
    display:block;
    width:100%;
    margin:0 auto 35px;
}

/* Текст */

.invite-text{
    text-align:center;
    font-size:22px;
    line-height:1.8;
    color:#444;
    margin-bottom:40px;
}

/* Календарь */

.calendar{
    display:block;
    width:90%;
    margin:0 auto 60px;
}

/* ========================= */
/* ТАЙМЕР */
/* ========================= */

.countdown{
    display:flex;
    justify-content:center;
    gap:18px;
    margin-bottom:50px;
}

.count-item{
    text-align:center;
}

.count-item span{
    display:block;
    font-size:30px;
    font-weight:bold;
    color:#e57373;
    transition:.3s;
}

.count-item p{
    font-size:13px;
    margin-top:5px;
    color:#777;
}
/* ========================= */
/* АНИМАЦИЯ КАЛЕНДАРЯ */
/* ========================= */

.calendar{
    display:block;
    width:90%;
    margin:0 auto 60px;
    opacity:0;
    transform:translateY(60px) scale(.95);
    transition:1s ease;
}

.calendar.show{
    opacity:1;
    transform:translateY(0) scale(1);
}

/* ========================= */
/* АНИМАЦИЯ ЦИФР ТАЙМЕРА */
/* ========================= */

@keyframes tick {
    0%   { transform:scale(1); }
    50%  { transform:scale(1.15); }
    100% { transform:scale(1); }
}

.count-item span.animate {
    animation:tick .25s ease;
}
/* ========================= */
/* ЛОКАЦИЯ */
/* ========================= */

.location-title{
    display:block;
    width:75%;
    margin:0 auto 30px;
}

.location-text{
    text-align:center;
    font-size:20px;
    line-height:1.8;
    color:#7c6fb0; /* мягкий фиолетовый как в макете */
    margin-bottom:40px;
}

.bus{
    display:block;
    width:85%;
    margin:0 auto 45px;
}
/* ========================= */
/* ДРЕСС-КОД */
/* ========================= */

.dress-title{
    display:block;
    width:70%;
    margin:0 auto 30px;
}

.dress-text{
    text-align:center;
    font-family:'Comfortaa', cursive;
    font-size:19px;
    line-height:1.9;
    color:#4fa7db;
    max-width:340px;
    margin:0 auto 35px;
}

.hearts{
    display:block;
    width:85%;
    margin:0 auto 25px;
}

.plus-icon{
    display:block;
    width:45px;
    margin:20px auto;
}

.men-title{
    display:block;
    width:75%;
    margin:25px auto 25px;
}

.no-black{
    display:block;
    width:70%;
    margin:15px auto 90px;
}
.fade-up{
    opacity:0;
    transform:translateY(40px);
    transition:1s ease;
}

.fade-up.show{
    opacity:1;
    transform:translateY(0);
}
/* ========================= */
/* ДЕТАЛИ */
/* ========================= */
.details-image{
    display:block;
    width:90%;
    margin:0 auto 35px;
    transition:transform .4s ease;
}
.details-title{
    display:block;
    width:60%;
    margin:0 auto 40px;
}

.details-image{
    display:block;
    width:90%;
    margin:0 auto 35px;
}
/* ========================= */
/* АНКЕТА */
/* ========================= */

/* ========================= */
/* АНКЕТА */
/* ========================= */

.form-section{
    padding:100px 20px;
    background:#fff8f2;
    text-align:center;
}

.form-heading{
    font-size:34px;
    margin-bottom:50px;
    font-weight:600;
    font-family:'Nunito', sans-serif;
}

.wedding-form{
    max-width:380px;
    margin:0 auto;
    padding:40px 30px;
    background:white;
    border-radius:30px;
    box-shadow:0 20px 60px rgba(0,0,0,0.08);
    display:flex;
    flex-direction:column;
    gap:30px;
}

/* Разделитель */

.form-divider{
    height:1px;
    background:#f0f0f0;
}

/* Поля */

.wedding-form input,
.wedding-form select{
    width:100%;
    padding:16px 18px;
    border-radius:18px;
    border:1px solid #eaeaea;
    font-size:16px;
    background:white;
    transition:.3s ease;
    outline:none;
    box-sizing:border-box;
}

.wedding-form input:focus,
.wedding-form select:focus{
    border-color:#ff7da7;
    box-shadow:0 0 0 3px rgba(255,125,167,0.15);
}

/* Радио кнопки */

.radio-group{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.radio-group label{
    cursor:pointer;
}

.radio-group input{
    display:none;
}

.radio-group span{
    display:block;
    padding:14px 18px;
    border-radius:18px;
    border:1px solid #eee;
    transition:.3s ease;
}

.radio-group input:checked + span{
    background:#ff7da7;
    color:white;
    border-color:#ff7da7;
    box-shadow:0 10px 25px rgba(255,95,143,.3);
}

/* Вопросы */

.question{
    text-align:left;
    font-size:15px;
    font-weight:600;
    margin-bottom:5px;
}

/* Скрытые блоки */

#extra-fields{
    display:none;
    flex-direction:column;
    gap:25px;
}

#plus-name{
    display:none;
    width:100%;
}

/* ========================= */
/* КРАСИВЫЕ ЧЕКБОКСЫ */
/* ========================= */

#alcohol-type{
    display:none;
    width:100%;
    background:#fff0f6;
    padding:18px;
    border-radius:20px;
    box-sizing:border-box;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

#alcohol-type label{
    position:relative;
    cursor:pointer;
}

#alcohol-type input{
    display:none;
}

#alcohol-type span{
    display:block;
    padding:10px 16px;
    border-radius:20px;
    border:1px solid #ffd6e6;
    background:white;
    font-size:14px;
    transition:.25s ease;
}

/* состояние выбранного */

#alcohol-type input:checked + span{
    background:#ff7da7;
    color:white;
    border-color:#ff7da7;
    box-shadow:0 6px 18px rgba(255,125,167,.3);
}

/* Кнопка */

.wedding-form button{
    margin-top:10px;
    padding:18px;
    border:none;
    border-radius:50px;
    background:linear-gradient(135deg,#ff7da7,#ff5f8f);
    color:white;
    font-size:18px;
    font-weight:600;
    cursor:pointer;
    transition:.3s ease;
    box-shadow:0 15px 40px rgba(255,95,143,.35);
}

.wedding-form button:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 50px rgba(255,95,143,.45);
}

.wedding-form button:active{
    transform:scale(.98);
}
/* ========================= */
/* ФИНАЛ */
/* ========================= */

.final-section{
    padding:40px 0 0;
    margin:0;
    background:#ffffff;
    text-align:center;
}

.final-wrapper{
    max-width:430px;
    margin:0 auto;
    padding:0 20px 0;
}

.final-title{
    width:60%;
    margin:0 auto 15px;
    display:block;
}

.final-image{
    width:100%;
    display:block;
    margin:0;
}
.site{
    padding-bottom:0 !important;
}
#wine-options,
#strong-options{
    display:none;
    margin-top:10px;
}

#wine-options select,
#strong-options select{
    margin-top:5px;
}
/* ========================= */
/* ДЕТАЛИ — НОВЫЙ СТИЛЬ */
/* ========================= */

.details-section{
    padding:120px 20px;
    background:#fff;
    text-align:center;
}

.details-heading{
    font-size:34px;
    margin-bottom:70px;
    font-weight:600;
    font-family:'Nunito', sans-serif;
}

.details-cards{
    display:flex;
    flex-direction:column;
    gap:40px;
    max-width:420px;
    margin:0 auto;
}

.detail-card{
    padding:28px 24px;
    border-radius:30px;
    font-size:17px;
    line-height:1.6;
    box-shadow:0 15px 40px rgba(0,0,0,0.05);
    transition:1s ease;
}

/* Пастельные цвета */

.detail-card:nth-child(1){
    background:#ffe9f1;
}

.detail-card:nth-child(2){
    background:#e9f7f3;
}

.detail-card:nth-child(3){
    background:#eef0ff;
}

/* Анимация */

.fade-item{
    opacity:0;
    transform:translateX(-60px);
}

.card-right.fade-item{
    transform:translateX(60px);
}

.fade-item.show{
    opacity:1;
    transform:translateX(0);
}
body.lock-scroll{
    overflow:hidden;
}
/* ========================= */
/* КРАСИВЫЙ ШРИФТ ТОЛЬКО ДЛЯ ТЕКСТОВ БЛОКОВ */
/* ========================= */

/* Узнали + текст приглашения */
.invite-text,
.invite-text p{
    font-family: 'Marck Script', cursive;
    font-size: 24px;
    line-height: 1.6;
}

/* Локация текст */
.location-text{
    font-family: 'Marck Script', cursive;
    font-size: 22px;
    line-height: 1.6;
}

/* Дресс-код текст */
.dress-text{
    font-family: 'Marck Script', cursive;
    font-size: 22px;
    line-height: 1.6;
}

/* Детали карточки текст */
.detail-card p{
    font-family: 'Marck Script', cursive;
    font-size: 22px;
    line-height: 1.6;
}