/* ===== ПДСЧ landing ===== */
:root{
    --purple:#210B3E;
    --purple-dark:#16052C;
    --orange:#EB925E;
    --magenta:#A83E68;
    --nav:#7C007D;
    --peach:#FFD0B4;
    --lilac:#ECB4FF;
    --lilac-2:#DA9DEF;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
    font-family:'Inter',-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    background:var(--purple);
    color:#fff;
    -webkit-font-smoothing:antialiased;
    line-height:1.45;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}

.container{
    max-width:1000px;
    margin:0 auto;
    padding:0 32px;
}

.section{padding:64px 0;}
.section__title{
    font-weight:900;
    font-size:24px;
    text-align:center;
    margin:0 0 36px;
}

/* ===== Hero ===== */
/* Размеры в cqw — блок масштабируется целиком, пропорции макета (1079x450).
   На узких экранах размеры фиксированные, иначе текст нечитаем. */
.hero{background:#000;}
.hero__inner{
    position:relative;
    max-width:1280px;
    margin:0 auto;
    aspect-ratio:1079 / 450;
    container-type:inline-size;
    background:#000 url(../img/hero-bg.jpg) no-repeat center / 100% auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    overflow:hidden;
    padding-top:.371cqw;
}
/* Свечение из макета: эллипс 500x225 по центру. */
.hero__inner::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(ellipse 46.34% 50% at 50% 50%,
        #210B3E 22.78%, rgba(33,11,62,0) 100%);
}
/* Края гасим в чёрный, иначе картинка обрывается ступенькой. */
.hero__inner::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg,
        #000 0%, rgba(0,0,0,.55) 4%, rgba(0,0,0,0) 14%,
        rgba(0,0,0,0) 86%, rgba(0,0,0,.55) 96%, #000 100%);
}
.hero__logo,
.hero__title,
.hero__sub{position:relative;z-index:1;}
/* Первое значение — запасное для браузеров без cqw. */
.hero__logo{
    width:57px;
    width:5.283cqw;
    height:auto;
    margin:0 0 33px;
    margin:0 0 3.096cqw;
}
.hero__title{
    font-size:35px;
    font-size:3.253cqw;
    font-weight:900;
    line-height:1.253;
    color:#fff;
    margin:0;
}
.hero__sub{
    font-family:'Roboto',-apple-system,Segoe UI,Arial,sans-serif;
    font-size:18.5px;
    font-size:1.722cqw;
    font-weight:400;
    line-height:1.184;
    color:#EA736D;
    margin:33px 0 0;
    margin:3.068cqw 0 0;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}

/* ===== Nav ===== */
.nav{
    background:var(--nav);
    position:sticky;
    top:0;
    z-index:20;
}
.nav__inner{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:34px;
    min-height:49px;
    align-items:center;
}
.nav a{
    font-size:14px;
    font-weight:600;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#fff;
    padding:8px 0;
    white-space:nowrap;
    transition:opacity .15s;
}
.nav a:hover{opacity:.7;}

/* ===== About ===== */
.about{background:var(--purple);}
.about__lead{
    color:var(--lilac);
    font-weight:300;
    font-size:16px;
    max-width:936px;
    margin:0 auto;
}
.about__lead p{margin:0 0 14px;}
.features{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
    margin:48px 0 40px;
}
.feature{text-align:center;padding:0 8px;}
.feature__ico{height:70px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.feature__ico img{height:40px;width:auto;}
.feature p{font-weight:700;font-size:14px;margin:0;}
.os-list{font-size:14px;font-weight:400;line-height:1.7;}
.os-list b{display:block;margin-bottom:8px;font-weight:700;}
.os-list ul{margin:0;padding-left:20px;}

/* ===== Functions ===== */
.functions{background:var(--purple-dark);}
.func-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:26px 38px;
}
.func{display:flex;gap:14px;align-items:flex-start;}
.func__num{
    font-weight:900;
    font-size:24px;
    color:#fff;
    line-height:1;
    min-width:18px;
}
.func__txt{font-weight:700;font-size:14px;color:var(--orange);margin:0;padding-top:2px;}

/* ===== Certified ===== */
.certified{background:var(--orange);color:var(--purple);}
.certified .section__title{color:#000;}
.certified__wrap{display:flex;gap:40px;align-items:flex-start;}
.certified__body{flex:1;font-size:16px;font-weight:300;}
.certified__body p{margin:0 0 12px;font-weight:600;}
.certified__body ul{margin:0;padding-left:20px;}
.certified__body li{margin-bottom:8px;}
.certified__img{width:119px;flex:none;}
.certified__img img{width:100%;border:1px solid rgba(0,0,0,.15);background:#fff;}

/* ===== Docs ===== */
.docs{background:var(--magenta);}
.docs__links{display:flex;justify-content:center;gap:48px;flex-wrap:wrap;}
.doc-link{display:flex;align-items:center;gap:12px;font-weight:700;font-size:16px;color:var(--lilac);}
.doc-link img{height:28px;width:auto;}
.doc-link:hover{color:#fff;}

/* ===== Partners ===== */
.partners{background:var(--purple-dark);}
.partners__card{display:flex;flex-direction:column;align-items:center;gap:16px;}
.partners__card img{background:#fff;border-radius:6px;padding:14px 18px;width:auto;height:77px;object-fit:contain;}
.partners__card span{font-weight:700;font-size:14px;}

/* ===== Request form ===== */
.request{background:var(--orange);color:#000;}
.request .section__title{color:#000;}
.request__intro{
    font-weight:300;font-size:16px;color:#000;
    max-width:936px;margin:0 auto 32px;
}
.request__form{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.request__col{display:flex;flex-direction:column;gap:16px;}
.request__form input:not([type="hidden"]),
.request__form textarea{
    font-family:inherit;
    background:var(--peach);
    border:none;
    border-radius:4px;
    padding:9px 14px;
    font-size:14px;
    color:#3a2a1c;
    width:100%;
}
.request__form input:not([type="hidden"])::placeholder,
.request__form textarea::placeholder{color:#7a5c44;}
.request__form textarea{height:100%;min-height:196px;resize:vertical;}
.request__btn{
    background:var(--purple);
    color:#fff;
    border:none;
    border-radius:4px;
    padding:10px 14px;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    transition:background .15s;
}
.request__btn:hover{background:#321758;}

/* Ботоловка: не display:none — иначе боты её игнорируют. */
.request__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.request__ok{
    background:var(--purple);color:#fff;
    border-radius:4px;padding:16px 20px;
    font-size:16px;font-weight:600;text-align:center;
    max-width:936px;margin:0 auto;
}
.request__errors{
    background:#fff;color:#A20000;
    border-left:4px solid #A20000;border-radius:4px;
    margin:0 0 24px;padding:12px 20px 12px 36px;
    font-size:14px;
}
.request__errors li{margin:2px 0;}

/* Оформление виджета — на стороне скрипта капчи (класс smart-captcha).
   От нас только резерв высоты, чтобы вёрстка не прыгала при загрузке. */
.smart-captcha{min-height:100px;}

/* ===== Модалка (результат отправки + форма обратного звонка) ===== */
body.is-modal-open{overflow:hidden;}
.modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px;}
.modal[hidden]{display:none;}
.modal__overlay{position:absolute;inset:0;background:rgba(11,3,22,.72);}
.modal__box{
    position:relative;z-index:1;
    width:100%;max-width:460px;max-height:calc(100vh - 48px);overflow:auto;
    background:var(--orange);color:#000;
    border-radius:12px;padding:28px 28px 26px;
    box-shadow:0 24px 60px rgba(0,0,0,.45);
    animation:modal-in .18s ease-out;
}
@keyframes modal-in{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.modal__box{animation:none;}}
/* Полоска сверху — только у уведомлений. */
.modal__box--ok{border-top:6px solid #2E7D32;padding-top:22px;}
.modal__box--error{border-top:6px solid #A20000;padding-top:22px;}
.modal__close{
    position:absolute;top:10px;right:14px;
    background:none;border:none;cursor:pointer;
    font-size:30px;line-height:1;font-weight:700;
    color:var(--purple);padding:4px 8px;opacity:.85;
}
.modal__close:hover{opacity:1;}
.modal__title{font-size:26px;font-weight:900;margin:0 0 18px;padding-right:32px;color:#000;}
.modal__msg{font-size:15px;font-weight:400;margin:0 0 20px;}
.modal__errors{
    background:#fff;color:#A20000;border-left:4px solid #A20000;border-radius:8px;
    margin:0 0 16px;padding:12px 16px 12px 32px;font-size:14px;
}
.modal__errors li{margin:2px 0;}
.modal__form{display:flex;flex-direction:column;gap:12px;}
.modal__form input:not([type="hidden"]),
.modal__form textarea{
    font-family:inherit;font-size:15px;
    background:var(--peach);border:none;border-radius:8px;
    padding:13px 16px;color:#000;
}
.modal__form input:not([type="hidden"])::placeholder,
.modal__form textarea::placeholder{color:#7a5c44;}
.modal__form textarea{resize:vertical;min-height:120px;}
.modal__btn{
    background:var(--purple);color:#fff;border:none;border-radius:4px;
    padding:11px 22px;font-family:inherit;font-size:14px;font-weight:600;
    cursor:pointer;transition:background .15s;align-self:flex-start;
}
.modal__btn:hover{background:#321758;}
.modal__form .modal__btn{align-self:stretch;padding:14px 22px;font-size:16px;border-radius:8px;margin-top:4px;}
.modal__btn[disabled]{opacity:.6;cursor:default;}
@media (max-width:560px){
    .modal{padding:12px;}
    .modal__box{padding:28px 20px 22px;}
    .modal__btn{align-self:stretch;text-align:center;}
}

/* ===== Страница ошибки (404/500) ===== */
.site-error{max-width:1000px;margin:0 auto;padding:80px 32px;text-align:center;}
.site-error h1{font-size:32px;font-weight:900;margin:0 0 16px;}
.site-error .alert{
    background:rgba(255,255,255,.08);border-left:4px solid var(--orange);
    border-radius:4px;padding:14px 20px;margin:0 0 20px;
    display:inline-block;text-align:left;font-size:15px;
}
.site-error p{font-weight:300;}
.site-error__home{
    display:inline-block;margin-top:20px;background:var(--orange);color:#000;
    border-radius:4px;padding:10px 22px;font-weight:600;
}

/* ===== Footer brand ===== */
.foot-brand{background:var(--purple);padding:40px 0;}
.foot-brand__wrap{display:flex;justify-content:space-between;gap:40px;align-items:center;flex-wrap:wrap;}
.foot-brand__logo{display:flex;align-items:center;gap:14px;margin-bottom:12px;}
.foot-brand__logo img{height:48px;width:auto;}
.foot-brand__logo span{font-weight:900;font-size:22px;color:var(--orange);}
.foot-brand__addr{color:var(--lilac-2);font-weight:300;font-size:14px;line-height:1.7;}
.foot-brand__addr a{text-decoration:underline;color:var(--lilac-2);}
.foot-brand__map{width:452px;max-width:100%;flex:none;height:200px;}
.foot-brand__map #footer-ymap,
.foot-brand__map img{width:100%;height:100%;border-radius:4px;overflow:hidden;display:block;}

/* ===== Footer links ===== */
.foot-links{background:#000;padding:36px 0;}
.foot-links__title{color:#747474;font-size:18px;margin:0 0 16px;}
.foot-links__cps{display:flex;align-items:center;gap:10px;font-size:14px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.3);margin-bottom:18px;}
.foot-links__cps img{height:18px;width:auto;}
.foot-links__grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px 10px;
}
.foot-links__grid a{display:flex;align-items:center;gap:10px;font-size:14px;}
.foot-links__grid a:hover{text-decoration:underline;}
.foot-links__grid img{height:20px;width:20px;object-fit:contain;flex:none;}

/* ===== Responsive ===== */
/* Ниже 700px пропорции макета дают нечитаемый кегль. */
@media (max-width:700px){
    .hero__inner{
        aspect-ratio:auto;
        min-height:64vw;
        padding:44px 20px 40px;
        background-size:cover;
    }
    /* Переносы из макета мешают на узком экране — пусть текст течёт сам. */
    .hero__nl{display:none;}
    .hero__logo{width:44px;margin:0 0 20px;}
    .hero__title{font-size:clamp(21px,5.6vw,30px);line-height:1.25;max-width:15ch;}
    .hero__sub{font-size:clamp(13px,3.1vw,16px);line-height:1.4;margin:18px 0 0;max-width:34ch;}
}

@media (max-width:860px){
    .features,.func-grid,.foot-links__grid{grid-template-columns:1fr 1fr;}
    .request__form{grid-template-columns:1fr;}
    .certified__wrap{flex-direction:column;}
    .certified__img{align-self:center;}
}
@media (max-width:560px){
    .features,.func-grid,.foot-links__grid{grid-template-columns:1fr;}
    .nav__inner{gap:18px;}
    .section{padding:44px 0;}
}
