:root{
    --bg:#070f0b;
    --bg2:#0b1f16;

    /* цвета из логотипа */
    --brand-red:#c8161d;     /* красный */
    --brand-green:#0f6b45;   /* тёмно-зелёный */

    /* неоновые акценты в стиле 2000-х */
    --neon:#1cff9a;         /* неоново-зелёный под рамку */
    --neon2:#ff5a5f;        /* неоново-красный под поле лого */

    --text:rgba(255,255,255,.92);
    --muted:rgba(255,255,255,.7);
    --shadow:0 16px 40px rgba(0,0,0,.45);
    --radius:18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    color:var(--text);
    background:
            radial-gradient(1200px 800px at 20% 10%, rgba(102,255,176,.10), transparent 60%),
            radial-gradient(1000px 700px at 80% 0%, rgba(180,255,56,.10), transparent 55%),
            linear-gradient(180deg, var(--bg), var(--bg2));
    font-family: Inter, Arial, Verdana, sans-serif;
    line-height:1.6;
}
.logo{
    display:flex;
    align-items:center;
    gap:12px;
}

.logo__img{
    width: 80px;
    height: 70px;
    object-fit:contain;
    filter: drop-shadow(0 0 12px rgba(102,255,176,.45));
}

.logo__text{
    display:grid;
    gap:2px;
}

.logo__img::after{
    content:'';
    position:absolute;
    inset:0;
    background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.35), transparent 60%);
    transform: translateX(-120%);
}

.logo:hover .logo__img::after{
    animation: shine 1.2s ease forwards;
}

@keyframes shine{
    to{ transform: translateX(120%); }
}

a{color:var(--neon); text-decoration:none}
a:hover{text-decoration:none;}

.container{
    width:min(1120px, calc(100% - 40px));
    margin:0 auto;
}

/* Topbar */
.topbar{
    position:sticky; top:0; z-index:30;
    background:
            radial-gradient(600px 200px at 20% 0%, rgba(28,255,154,.18), transparent 60%),
            radial-gradient(600px 200px at 80% 0%, rgba(255,90,95,.18), transparent 60%),
            linear-gradient(180deg, rgba(5,10,8,.9), rgba(5,10,8,.55));
    backdrop-filter: blur(10px);
    border-bottom:2px solid rgba(28,255,154,.45);
    box-shadow: 0 10px 30px rgba(0,0,0,.6);
}
.topbar__inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 0; gap:16px;
}
.logo{
    display:flex;
    align-items:center;
    gap:12px;
}

.logo__img{
    width:46px;
    height:46px;
    object-fit:contain;
    filter:
            drop-shadow(0 0 10px rgba(28,255,154,.35))
            drop-shadow(0 0 6px rgba(255,90,95,.25));
    transition: transform .25s ease, filter .25s ease;
}

.logo__img:hover{
    transform: translateY(-1px) scale(1.03);
    filter:
            drop-shadow(0 0 14px rgba(28,255,154,.55))
            drop-shadow(0 0 10px rgba(255,90,95,.45));
}

.logo__name{
    font-family: Oxanium, Inter, sans-serif;
    font-weight:800;
    letter-spacing:.12em;
    text-shadow:
            0 0 10px rgba(28,255,154,.25),
            0 0 6px rgba(255,90,95,.25);
}
.nav{display:flex; gap:18px; align-items:center}
.nav a{
    color:rgba(255,255,255,.88); font-weight:600; font-size:14px;
    padding:8px 10px; border-radius:10px;
}
.nav a:hover{background:rgba(255,255,255,.06); text-decoration:none}

.phone{
    padding:8px 12px; border-radius:12px;
    border:1px solid rgba(102,255,176,.35);
    box-shadow:var(--shadow);
}

/* Hero */
.hero{padding:64px 0 48px}
.h1{
    margin:0 0 12px;
    font-family: Oxanium, Inter, sans-serif;
    font-size:40px; letter-spacing:.04em;
    text-shadow:0 0 22px rgba(102,255,176,.35);
}
.lead{max-width:60ch; color:rgba(255,255,255,.9)}

.hero__cta{display:flex; gap:12px; margin-top:16px}

.btn{
    display:inline-flex; align-items:center; justify-content:center;
    gap:8px; padding:12px 16px; border-radius:14px;
    font-weight:700; letter-spacing:.04em; cursor:pointer;
}
.btn--primary{
    color:#150203;
    background: linear-gradient(180deg, var(--neon2), var(--brand-red));
    border:1px solid rgba(255,255,255,.25);
    box-shadow:
            0 10px 25px rgba(255,90,95,.35),
            inset 0 1px 0 rgba(255,255,255,.45);
}

.btn--ghost{
    color:var(--text);
    background: linear-gradient(180deg, rgba(28,255,154,.18), rgba(28,255,154,.06));
    border:1px solid rgba(28,255,154,.45);
    box-shadow: var(--shadow);
}

/* Sections */
.section{padding:56px 0}
.section--alt{
    background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0));
    border-top:1px solid rgba(255,255,255,.06);
    border-bottom:1px solid rgba(255,255,255,.06);
}
.h2{
    font-family: Oxanium, Inter, sans-serif;
    margin:0 0 10px; font-size:28px; letter-spacing:.04em;
    text-shadow:0 0 16px rgba(102,255,176,.25);
}

/* Gallery */
.gallery{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(180px,1fr));
    gap:12px;
}
.gallery img{
    width:100%; height:250px; object-fit:cover;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.14);
    box-shadow:var(--shadow);
    filter:saturate(1.1) contrast(1.05);
}

/* Form */
.form{
    max-width:520px;
    display:grid; gap:12px;
}
.form input, .form textarea{
    width:100%;
    padding:12px 12px;
    border-radius:12px;
    border:1px solid rgba(102,255,176,.35);
    background:rgba(0,0,0,.35);
    color:var(--text);
    outline:none;
}
.form input:focus, .form textarea:focus{
    border-color:var(--neon2);
    box-shadow:0 0 0 3px rgba(180,255,56,.25);
}

/* Footer */
.footer{
    padding:24px 0;
    border-top:1px solid rgba(255,255,255,.08);
    background:rgba(0,0,0,.25);
}
.price-grid{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
    gap:18px;
}

.price-card{
    background: linear-gradient(180deg, rgba(15,107,69,.35), rgba(5,15,10,.6));
    border:1px solid rgba(28,255,154,.45);
    border-radius:18px;
    padding:18px;
    box-shadow: 0 14px 34px rgba(0,0,0,.5);
    position:relative;
    overflow:hidden;
}

.price-card::after{
    content:'';
    position:absolute;
    inset:-40% -20% auto auto;
    width:200px; height:200px;
    background: radial-gradient(circle, rgba(255,90,95,.25), transparent 60%);
    transform: rotate(25deg);
}

.price-title{
    font-family: Oxanium, Inter, sans-serif;
    font-size:22px;
    letter-spacing:.08em;
    margin:0 0 10px;
    text-shadow: 0 0 10px rgba(28,255,154,.35);
}

.price-block{
    border:1px dashed rgba(255,255,255,.25);
    border-radius:12px;
    padding:12px;
    margin:10px 0;
    background: rgba(0,0,0,.25);
}

.price-days{
    font-weight:700;
    color: var(--neon);
    margin-bottom:6px;
}

.price-row{
    display:flex;
    justify-content:space-between;
    gap:10px;
    padding:6px 0;
    border-bottom:1px dotted rgba(255,255,255,.2);
}
.price-row:last-child{border-bottom:none}

.price-row b{
    color:#fff;
    text-shadow: 0 0 8px rgba(255,90,95,.35);
}

.price-note{
    margin-top:18px;
    padding:12px 14px;
    border-radius:14px;
    background: linear-gradient(180deg, rgba(255,90,95,.25), rgba(255,90,95,.1));
    border:1px solid rgba(255,90,95,.45);
    text-align:center;
    font-weight:800;
    letter-spacing:.06em;
}
.popup{
    position:fixed;
    inset:0;
    display:none;
    z-index:100;
}
.popup.is-open{display:block;}

.popup__overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.7);
    backdrop-filter: blur(4px);
}

.popup__content{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    background: linear-gradient(180deg, rgba(15,107,69,.9), rgba(5,15,10,.95));
    border:1px solid rgba(28,255,154,.55);
    border-radius:18px;
    padding:24px 22px;
    text-align:center;
    min-width:280px;
    box-shadow: 0 20px 50px rgba(0,0,0,.6);
}

.popup__title{
    font-family: Oxanium, Inter, sans-serif;
    font-size:22px;
    letter-spacing:.08em;
    margin-bottom:6px;
    text-shadow:0 0 10px rgba(28,255,154,.45);
}

.popup__text{
    color:rgba(255,255,255,.9);
    margin-bottom:14px;
}
.burger{
    display:none;
    width:44px; height:44px;
    border-radius:12px;
    border:1px solid rgba(28,255,154,.45);
    background:linear-gradient(180deg, rgba(28,255,154,.25), rgba(28,255,154,.08));
    box-shadow: var(--shadow);
}
.burger span{
    display:block;
    height:2px;
    margin:6px 10px;
    background:#fff;
    border-radius:10px;
}

.mobile-nav{
    display:none;
    padding:12px 0 16px;
    border-top:1px solid rgba(28,255,154,.35);
    background:rgba(5,10,8,.9);
}
.mobile-nav a{
    display:block;
    padding:10px 20px;
    color:#fff;
    font-weight:700;
}
.mobile-nav__cta{
    margin:10px 20px 0;
    border-radius:14px;
    border:1px solid rgba(255,90,95,.45);
    background: linear-gradient(180deg, rgba(255,90,95,.35), rgba(255,90,95,.12));
    text-align:center;
}

/* Адаптив */
@media (max-width: 900px){
    .nav{display:none;}
    .burger{display:block;}
    .mobile-nav.is-open{display:block;}
}
/* Анимация попапа */
.popup{
    opacity:0;
    pointer-events:none;
    transition: opacity .25s ease;
}

.popup.is-open{
    opacity:1;
    pointer-events:auto;
}

.popup__content{
    transform: translate(-50%, -46%) scale(.96);
    opacity:0;
    animation: popupOut .2s ease forwards;
}

.popup.is-open .popup__content{
    animation: popupIn .35s cubic-bezier(.2,.8,.2,1) forwards;
}

@keyframes popupIn{
    from{
        opacity:0;
        transform: translate(-50%, -40%) scale(.92);
        filter: blur(2px);
    }
    to{
        opacity:1;
        transform: translate(-50%, -50%) scale(1);
        filter: blur(0);
    }
}

@keyframes popupOut{
    from{opacity:1}
    to{opacity:0}
}
.popup.is-open .popup__content{
    box-shadow:
            0 0 0 1px rgba(28,255,154,.45),
            0 0 22px rgba(28,255,154,.25),
            0 0 40px rgba(255,90,95,.2),
            0 20px 60px rgba(0,0,0,.7);
}