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

html, body {
    width: 100%;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    overflow-x: hidden; 
    font-family: 'Comfortaa', cursive;
    background-color: #000;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Контейнер на весь экран с Flexbox */
.main-container {
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    min-height: 100vh;
    width: 100%;
    position: relative;
    z-index: 2;
    padding: 3vw 15px 40px 15px;
}

/* Слайдер на фоне */
.simpleslide100 { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; }
.simpleslide100-item { width: 100%; height: 100%; background-position: center; background-size: cover; position: absolute; }
.tp-dottedoverlay { position: absolute; width: 100%; height: 100%; z-index: 1; }
.tp-dottedoverlay.twoxtwo { background: url(/assets/gridtile.png); }

/* Затемнение */
.overlay1::after {
    content: ""; position: absolute; width: 100%; height: 100%;
    top: 0; left: 0; background: rgba(0, 0, 0, 0.7); z-index: -1;
}

/* Логотип */
.header-logo {
    width: 100%;
    text-align: center;
    margin-top: 60px;
}
.header-logo img {
    width: 100%;
    max-width: clamp(200px, 20vw, 300px); 
    height: auto;
    display: inline-block; 
}

/* Центр (Заголовок + Таймер) */
.content-center {
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
    width: 100%;
    padding: 20px 0;
}

.main-title {
    font-size: clamp(22px, 4vw, 50px); 
    letter-spacing: clamp(5px, 1vw, 12px);
    color: rgba(255,255,255,0.6);
    font-weight: 300;
    text-transform: uppercase;
    text-align: center;
    margin-top: auto; 
    margin-bottom: auto;
}

.timer-flex {
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    gap: clamp(15px, 3vw, 40px);
    margin-bottom: auto;
    -ms-flex-wrap: wrap; flex-wrap: wrap;
}
.timer-item { 
    display: -webkit-box; display: -ms-flexbox; display: flex; 
    -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; 
    -webkit-box-align: center; -ms-flex-align: center; align-items: center; 
    min-width: clamp(60px, 10vw, 120px); 
}
.timer-num { 
    font-size: clamp(40px, 7vw, 90px); 
    font-weight: 700; color: #fff; line-height: 1; 
}
.timer-label { 
    font-size: clamp(9px, 1.2vw, 12px); 
    letter-spacing: 2px; color: #fff; margin-top: 5px; 
}

/* Блок контактов */
.footer-top { width: 100%; text-align: center; margin-bottom: 20px; }

.contacts-row {
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    gap: clamp(20px, 5vw, 80px);
    margin-bottom: clamp(15px, 2vw, 25px);
}
.contact-box i { font-size: 18px; color: #424242; margin-bottom: 8px; display: block; }
.contact-box h3 { font-size: clamp(12px, 1.5vw, 14px); letter-spacing: 2px; color: #fff; margin-bottom: 4px; }
.contact-box p { font-size: clamp(12px, 1.5vw, 13px); color: #424242; }

.digital-tech {
    font-size: clamp(10px, 1.5vw, 13px);
    letter-spacing: clamp(3px, 0.5vw, 5px);
    color: #666;
    margin-bottom: 15px;
}

/* Соцсети */
.social-row { 
    display: -webkit-box; display: -ms-flexbox; display: flex; 
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; 
    gap: 15px; 
}
.social-row a {
    width: clamp(34px, 4vw, 36px); 
    height: clamp(34px, 4vw, 36px);
    border: 1px solid #fff;
    border-radius: 50%;
    display: -webkit-box; display: -ms-flexbox; display: flex; 
    -webkit-box-align: center; -ms-flex-align: center; align-items: center; 
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    color: #fff; text-decoration: none; 
    -webkit-transition: 0.3s; transition: 0.3s;
}
.social-row a:hover { background: #fff; color: #ff0081; }


/* =================================================================
   ФУТЕР (ВЕРНУЛ ВАШ ИСХОДНЫЙ КОД 1 В 1)
   ================================================================= */
#footer-bar {
    font-family: system-ui;
    position: fixed;
    text-align: center; 
    bottom: 0;
    padding: 0px;
    background: #222222;
    color: #fff;
    font-size: small;
    width: 100%;
    z-index: 10;
}
#footer-bar p {
    color: #fff;
    font-size: 11px;
    margin: 0;
    letter-spacing: 1px;
    font-family: sans-serif;
}


/* =================================================================
   МЕДИА-ЗАПРОСЫ ДЛЯ ПЛАНШЕТОВ И МОБИЛЬНЫХ УСТРОЙСТВ
   ================================================================= */
   
/* Планшеты (Portrait) и крупные телефоны */
@media (max-width: 768px) {
    .contacts-row {
        -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
        -webkit-box-align: center; -ms-flex-align: center; align-items: center;
        gap: 15px;
    }
    .contact-box i { margin-bottom: 4px; }
    .main-container { padding-bottom: 20px; height: auto; min-height: 100vh; }

    /* ВАШ ИСХОДНЫЙ МОБИЛЬНЫЙ ФУТЕР (1 В 1) */
    #footer-bar {
        height: auto !important;
        padding: 5px !important;
    }
    #footer-bar p {
        font-size: 9px !important;
        line-height: 1.4 !important;
    }
}

/* Для очень маленьких телефонов и горизонтальной ориентации (Landscape) */
@media (max-height: 600px) {
    .header-logo img { max-width: 150px; }
    .timer-flex { margin-top: 10px; margin-bottom: 10px; }
    .digital-tech { display: none; } 
    .main-container { padding-top: 15px; padding-bottom: 25px; }
}

/* =================================================================
   КНОПКА "НА ГЛАВНУЮ"
   ================================================================= */
.action-btn-wrap {
    margin-top: clamp(25px, 4vw, 45px); /* Отступ от таймера вниз */
    text-align: center;
    width: 100%;
}

.btn-main {
    display: inline-block;
    
    /* УМЕНЬШИЛИ ОТСТУПЫ: 
       первое значение (8px - 12px) - это отступы сверху и снизу (высота кнопки)
       второе значение (20px - 30px) - это отступы слева и справа (ширина кнопки) */
    padding: clamp(5px, 1.2vw, 9px) clamp(18px, 2vw, 28px);
    
    border: 1px solid #fff;
    border-radius: 30px; 
    color: #fff;
    
    /* УМЕНЬШИЛИ ШРИФТ: теперь текст от 10px до 12px максимум */
    font-size: clamp(10px, 1.2vw, 12px);
    
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-decoration: none;
    -webkit-transition: all 0.3s ease; 
    transition: all 0.3s ease;
}

.btn-main:hover {
    background-color: #fff;
    color: #ff0081; /* Розовый цвет текста как у соцсетей при наведении */
}