/* =========================================================================
   Night Shift by Gasano — чёрно-белая тема поверх базовых стилей.
   base.css — исходная сетка и компоненты; здесь только цвет, шрифт
   и новые блоки, которых не было в исходном шаблоне.
   ========================================================================= */

:root{
    --font: 'Manrope', 'Helvetica Neue', Helvetica, Arial, 'Segoe UI', sans-serif;
    --accent: #000000;      /* бывший розовый акцент */
    --ink: #111111;         /* основной текст */
    --ink-soft: #6b6b6b;    /* второстепенный текст */
    --line: #e4e4e4;        /* линии на светлом */
    --line-dark: #262626;   /* линии на тёмном */
    --bg: #ffffff;
    --bg-dark: #000000;
    --bg-soft: #f4f4f4;
}

/* --- Базовая типографика ------------------------------------------------ */
html{ -webkit-text-size-adjust:100% }
body{
    color:var(--ink);
    background:var(--bg-dark);
    font-family:var(--font);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-feature-settings:"kern" 1;
}
::selection{ background:#000; color:#fff }
img{ max-width:100% }

a{ color:var(--ink) }
a:hover{ color:#000 }

/* Точка в конце названий — фирменный элемент шаблона. Делаем её белой на
   тёмном и чёрной на светлом, но всегда заметной. */
.dot{ color:currentColor; opacity:.35 }
.rsContent .dot,
.footer .dot{ opacity:.5 }

/* --- Шапка -------------------------------------------------------------- */
#head{ height:150px; line-height:150px }
.logo{
    top:44px; left:110px; width:auto;
    letter-spacing:-.01em;
}
.logo a{ text-decoration:none; color:#000; display:inline-block; line-height:1.15 }
.logo .ns-mark{
    display:inline-block; vertical-align:middle;
    width:34px; height:34px; margin-right:14px;
    background:#000; border-radius:50%;
    position:relative; top:-2px;
}
.logo .ns-mark:after{
    content:''; position:absolute; right:5px; top:5px;
    width:12px; height:12px; border-radius:50%; background:#fff;
}
.logo .ns-name{ display:inline-block; vertical-align:middle }
.logo .ns-name b{ display:block; font-size:20px; font-weight:800; text-transform:uppercase; letter-spacing:.02em }
.logo .ns-name i{ display:block; font-size:11px; font-style:normal; font-weight:500;
    text-transform:uppercase; letter-spacing:.22em; color:var(--ink-soft); margin-top:1px }

/* тёмная шапка на страницах с чёрным первым экраном */
.head-dark .logo a{ color:#fff }
.head-dark .logo .ns-mark{ background:#fff }
.head-dark .logo .ns-mark:after{ background:#000 }
.head-dark .logo .ns-name i{ color:rgba(255,255,255,.55) }
.head-dark #head .menu li a{ color:#fff }
.head-dark #head .menu li a:hover{ color:#fff; border-bottom-color:#fff }
.head-dark #head .menu .burger,
.head-dark #head .menu .burger:before,
.head-dark #head .menu .burger:after{ background-color:#fff }
#head .menu .burger span{ background:none !important }

#head .menu{ font-size:14px; font-weight:700; letter-spacing:.14em }
#head .menu li{ margin-left:34px }
#head .menu li a{
    color:var(--ink); text-decoration:none;
    padding-bottom:4px; border-bottom:2px solid transparent;
    transition:border-color .18s linear, color .18s linear;
}
#head .menu li a:hover,
#head .menu li.active a{ color:#000; border-bottom-color:#000 }
/* на тёмной шапке активный пункт тоже белый (иначе чёрным по чёрному) */
.head-dark #head .menu li.active a,
.head-dark #head .menu li a:hover{ color:#fff; border-bottom-color:#fff }

/* --- Кнопки ------------------------------------------------------------- */
.btn{
    border-radius:0;
    border-width:2px;
    font-size:13px;
    letter-spacing:.14em;
    line-height:44px;
    padding:0 28px;
    font-weight:700;
}
a.btn{ color:#000; border-color:#000; background:transparent }
a.btn:hover{ background:#000; color:#fff }
.on-dark a.btn, .rsContent a.btn, .footer a.btn{ color:#fff; border-color:#fff }
.on-dark a.btn:hover, .rsContent a.btn:hover, .footer a.btn:hover{ background:#fff; color:#000 }

.btn-solid{ background:#000; color:#fff !important; border-color:#000 }
.btn-solid:hover{ background:#fff; color:#000 !important }
.on-dark .btn-solid{ background:#fff; color:#000 !important; border-color:#fff }
.on-dark .btn-solid:hover{ background:transparent; color:#fff !important }

/* --- Блок «мета» виден сразу (в оригинале его показывал внешний скрипт) -- */
.meta{ visibility:visible }

/* --- Слайдер ------------------------------------------------------------ */
/* Шапка лежит поверх слайдера — подтягиваем на её высоту (#head = 150px) */
.promos{ background:#000; margin-top:-150px }
.royalSlider{ height:760px; min-height:760px; background:#000 }
.rsContent .wrap{ padding-top:150px }
.rsContent{ background-color:#000 !important; position:relative; overflow:hidden }

/* Картинка слайда — отдельным слоем на всю ширину экрана.
   В исходном шаблоне фон висел на .center, а он ограничен 1600px и ниже
   999px вообще отключался, поэтому картинка не растягивалась. */
.slide-bg{
    position:absolute; left:0; top:0; right:0; bottom:0;
    background-size:cover;
    background-position:50% 50%;
    background-repeat:no-repeat;
    z-index:0;
}
.slide-bg:after{
    content:''; position:absolute; left:0; top:0; right:0; bottom:0;
    background:linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.72) 45%, rgba(0,0,0,.3) 100%);
}
/* .center больше не держит фон и не ограничен по ширине */
.rsContent .center{
    max-width:none;
    background-image:none;
    position:relative;
    z-index:2;
}
.rsContent .wrap{ z-index:2 }
.rsContent .header{
    font-size:56px; letter-spacing:-.02em; line-height:1.08; margin-bottom:18px;
}
.rsContent .header a,
.rsContent .header a:hover,
.rsContent .l a, .rsContent .l p, .rsContent .l .header,
.rsContent.white .l a, .rsContent.white .l p, .rsContent.white .l .header{ color:#fff }
.rsContent .header-inner{ display:block; font-size:.62em; letter-spacing:.16em;
    font-weight:800; opacity:.5; margin-bottom:10px; text-transform:uppercase }
.rsContent .wrap p{ color:rgba(255,255,255,.72); font-size:17px; max-width:520px }
.rsContent .l{ width:640px }

.rsBullets{ bottom:44px; text-align:left; left:auto; right:110px; width:auto; z-index:23 }
.rsBullets .rsBullet{ position:relative; z-index:23 }
.rsBullets .rsBullet span{ background-color:rgba(255,255,255,.35); width:8px; height:8px; border-radius:0 }
.rsBullets .rsBullet.rsNavSelected span{
    background-color:#fff; border:0; width:26px; height:8px; margin:3px;
}
.slider-count{
    position:absolute; left:110px; bottom:40px; z-index:22;
    color:rgba(255,255,255,.5); font-size:13px; letter-spacing:.18em; font-weight:700;
}
.slider-count b{ color:#fff; font-weight:800 }

.rsArrow{ z-index:21 }
.rsArrowRight{ width:24% !important }
.rsArrowLeft{ width:12% !important }

/* --- Блок «мета» под слайдером ------------------------------------------ */
#right{ background:#fff }
.meta{ border-bottom:1px solid var(--line) }
.meta .row.label a{ color:#000; text-decoration:none; font-weight:800;
    letter-spacing:.12em; text-transform:uppercase; font-size:12px }
.meta .row.gray{ color:var(--ink-soft) }
.meta ul li a{ color:var(--ink); text-decoration:none; border-bottom:1px solid transparent }
.meta ul li a:hover{ border-bottom-color:#000 }

/* --- Сетка проектов ----------------------------------------------------- */
.projects li .wr{ background:#0d0d0d; overflow:hidden }
.projects li .wr img{ transition:transform .5s cubic-bezier(.2,.7,.3,1), opacity .3s linear }
.projects li.hover .wr img{ transform:scale(1.04) }
.projects li .mask{ transition:background-color .25s linear }
.projects li.hover .mask{ background-color:rgba(0,0,0,.72) }
.projects li .wr .h span:not(.dot){ color:#fff }
.projects li .wr .h{ letter-spacing:-.01em }
.projects li .wr .cat{ color:rgba(255,255,255,.6); letter-spacing:.1em;
    text-transform:uppercase; font-size:11px; font-weight:700 }
.projects li .wr .btn{ border-color:#fff; color:#fff }
.projects li .wr .btn:hover{ background:#fff; color:#000 }
.projects li .wr .hidden{ display:block; opacity:0; transition:opacity .25s linear }
.projects li.hover .wr .hidden{ opacity:1 }
.projects li .wr img.lazy{ opacity:0 }
.projects li .wr img.is-loaded{ opacity:1 }
.projects li .wr img{ display:block }
.projects > .header{ border-top-color:var(--line) }
.projects > .header span{ color:var(--ink-soft) }
.projects .txt p a{ color:#000; text-decoration:none }
.projects .txt .cat a{ color:var(--ink-soft); text-decoration:none; font-size:12px;
    letter-spacing:.1em; text-transform:uppercase }
.projects .txt .cat a:hover{ color:#000 }

/* Обложка-заглушка, если картинка не загружена */
.cover-fallback{
    display:block; width:100%; padding-top:75%; position:relative;
    background:#0d0d0d;
}
.cover-fallback span{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    color:#333; font-size:13px; letter-spacing:.3em; font-weight:800; text-transform:uppercase;
}

/* --- Подвал ------------------------------------------------------------- */
.footer{ background:#000; color:#fff; padding:70px 0 40px; font-size:15px }
.footer a{ color:#fff; text-decoration:none }
.footer a:hover{ text-decoration:underline }
.footer__wrap{ align-items:flex-start; flex-wrap:wrap; gap:40px }
.footer__l{ gap:70px; flex-wrap:wrap }
.footer__address{ max-width:280px }
.footer__address--title{
    font-size:12px; letter-spacing:.18em; text-transform:uppercase;
    font-weight:800; margin-bottom:14px; color:#fff;
}
.footer__address--text{ color:rgba(255,255,255,.62); line-height:1.7 }
.footer__address--text .-gray{ color:rgba(255,255,255,.4); margin-top:12px }
.footer__address--text a{ color:#fff; border-bottom:1px solid rgba(255,255,255,.3) }
.footer__address--text a:hover{ text-decoration:none; border-bottom-color:#fff }
.footer__r{ text-align:right; margin-left:auto }
.footer__copy{ margin-top:26px; color:rgba(255,255,255,.4); font-size:13px; line-height:1.9 }
.footer__copy a{ color:rgba(255,255,255,.6) }
.footer__legal{
    margin-top:44px; padding-top:26px; border-top:1px solid var(--line-dark);
    color:rgba(255,255,255,.4); font-size:12.5px; line-height:1.9;
}
.footer__legal b{ color:rgba(255,255,255,.7); font-weight:600 }

/* --- Мобильное меню ----------------------------------------------------- */
.submenu{ background:#000; color:#fff }
.submenu ul{ font-size:38px }
.submenu ul li a{ color:#fff; text-decoration:none }
.submenu .close{ color:#fff }

/* =========================================================================
   НОВЫЕ БЛОКИ (их не было в исходном шаблоне)
   ========================================================================= */

.section{ padding:110px 0 }
.section--dark{ background:#000; color:#fff }
.section--soft{ background:var(--bg-soft) }
.section--tight{ padding:70px 0 }

.h-eyebrow{
    font-size:12px; letter-spacing:.22em; text-transform:uppercase;
    font-weight:800; color:var(--ink-soft); margin-bottom:22px;
}
.section--dark .h-eyebrow{ color:rgba(255,255,255,.45) }

.h-big{
    font-size:64px; line-height:1.06; font-weight:800;
    letter-spacing:-.03em; text-transform:uppercase;
}
.h-mid{ font-size:38px; line-height:1.12; font-weight:800; letter-spacing:-.02em; text-transform:uppercase }
.h-small{ font-size:22px; line-height:1.2; font-weight:800; letter-spacing:-.01em }
.lead{ font-size:20px; line-height:1.6; color:var(--ink-soft); max-width:720px }
.section--dark .lead{ color:rgba(255,255,255,.65) }

/* Шапка внутренней страницы */
.pagehead{ background:#000; color:#fff; padding:70px 0 90px }
.pagehead .h-big{ max-width:16em }
.pagehead .lead{ color:rgba(255,255,255,.6); margin-top:26px }
.pagehead .crumbs{ margin-bottom:34px }
.crumbs{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:700 }
.crumbs a{ color:rgba(255,255,255,.45); text-decoration:none }
.crumbs a:hover{ color:#fff }
.crumbs span{ color:rgba(255,255,255,.3); margin:0 10px }
.pagehead--light{ background:#fff; color:#000; border-bottom:1px solid var(--line) }
.pagehead--light .crumbs a{ color:var(--ink-soft) }
.pagehead--light .crumbs a:hover{ color:#000 }
.pagehead--light .lead{ color:var(--ink-soft) }

/* Фильтр по тегам */
.filters{ margin:0 0 50px; font-size:0 }
.filters a{
    display:inline-block; margin:0 8px 8px 0; padding:0 20px; line-height:38px;
    border:1px solid var(--line); color:var(--ink-soft); text-decoration:none;
    font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:700;
    transition:all .15s linear;
}
.filters a:hover{ border-color:#000; color:#000 }
.filters a.is-active{ background:#000; border-color:#000; color:#fff }
.filters a i{ font-style:normal; opacity:.5; margin-left:7px }

/* Сетка услуг */
.svc-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:1px; background:var(--line) }
.section--dark .svc-grid{ background:var(--line-dark) }
.svc-card{
    background:#fff; padding:48px 44px; position:relative;
    display:flex; flex-direction:column; text-decoration:none; color:inherit;
    transition:background .2s linear, color .2s linear;
    min-height:280px;
}
.section--dark .svc-card{ background:#000 }
.svc-card:hover{ background:#000; color:#fff }
.section--dark .svc-card:hover{ background:#fff; color:#000 }
.svc-card__num{
    font-size:12px; font-weight:800; letter-spacing:.2em;
    color:var(--ink-soft); margin-bottom:26px;
}
.svc-card:hover .svc-card__num{ color:rgba(255,255,255,.5) }
.section--dark .svc-card__num{ color:rgba(255,255,255,.4) }
.section--dark .svc-card:hover .svc-card__num{ color:var(--ink-soft) }
.svc-card__title{
    font-size:30px; font-weight:800; letter-spacing:-.02em;
    text-transform:uppercase; line-height:1.1; margin-bottom:16px;
}
.svc-card__text{ font-size:16px; line-height:1.6; color:var(--ink-soft); flex:1 }
.svc-card:hover .svc-card__text{ color:rgba(255,255,255,.7) }
.section--dark .svc-card__text{ color:rgba(255,255,255,.55) }
.section--dark .svc-card:hover .svc-card__text{ color:var(--ink-soft) }
.svc-card__meta{
    margin-top:30px; padding-top:20px; border-top:1px solid var(--line);
    font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:700;
    display:flex; justify-content:space-between; gap:16px;
}
.svc-card:hover .svc-card__meta{ border-top-color:rgba(255,255,255,.25) }
.section--dark .svc-card__meta{ border-top-color:var(--line-dark) }
.svc-card__arrow{ opacity:0; transform:translateX(-8px); transition:all .2s linear }
.svc-card:hover .svc-card__arrow{ opacity:1; transform:translateX(0) }

/* Страница услуги */
.svc-facts{
    display:flex; gap:1px; background:var(--line-dark);
    border-top:1px solid var(--line-dark); margin-top:60px;
}
.svc-facts div{ background:#000; padding:26px 30px; flex:1 }
.svc-facts dt{ font-size:11px; letter-spacing:.2em; text-transform:uppercase;
    color:rgba(255,255,255,.4); font-weight:800; margin-bottom:10px }
.svc-facts dd{ font-size:22px; font-weight:800; letter-spacing:-.01em; color:#fff }

.content-cols{ display:grid; grid-template-columns:1fr 380px; gap:80px; align-items:start }

.prose{ font-size:18px; line-height:1.72; color:#2a2a2a }
.prose h2{
    font-size:30px; line-height:1.15; font-weight:800; letter-spacing:-.02em;
    text-transform:uppercase; margin:52px 0 20px; color:#000;
}
.prose h2:first-child{ margin-top:0 }
.prose h3{ font-size:21px; font-weight:800; margin:38px 0 14px; color:#000; letter-spacing:-.01em }
.prose p{ margin-bottom:20px }
.prose ul{ margin:0 0 24px; padding:0; list-style:none }
.prose ul li{ position:relative; padding-left:26px; margin-bottom:11px }
.prose ul li:before{
    content:''; position:absolute; left:0; top:.62em;
    width:10px; height:2px; background:#000;
}
.prose a{ color:#000; border-bottom:1px solid var(--line) }
.prose a:hover{ border-bottom-color:#000 }
.prose strong{ font-weight:800; color:#000 }
.prose img{ margin:30px 0; display:block }
.section--dark .prose,
.prose--dark{ color:rgba(255,255,255,.72) }
.prose--dark h2, .prose--dark h3, .prose--dark strong{ color:#fff }
.prose--dark ul li:before{ background:#fff }
.prose--dark a{ color:#fff; border-bottom-color:rgba(255,255,255,.3) }

/* Боковая карточка */
.aside-card{ border:1px solid var(--line); padding:34px 30px; position:sticky; top:30px }
.aside-card + .aside-card{ margin-top:20px }
.aside-card__t{
    font-size:12px; letter-spacing:.18em; text-transform:uppercase;
    font-weight:800; margin-bottom:20px; color:var(--ink-soft);
}
.aside-list{ list-style:none }
.aside-list li{ padding:12px 0; border-bottom:1px solid var(--line); font-size:15px }
.aside-list li:last-child{ border-bottom:0; padding-bottom:0 }
.aside-list a{ color:var(--ink); text-decoration:none; display:block }
.aside-list a:hover{ color:#000; padding-left:6px; transition:padding .15s linear }
.aside-list .is-current{ font-weight:800; color:#000 }

/* Что входит — плитки */
.feature-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line) }
.feature-grid div{ background:#fff; padding:30px 28px; font-size:16px; line-height:1.5 }
.feature-grid div b{ display:block; font-size:12px; letter-spacing:.2em; color:var(--ink-soft);
    font-weight:800; margin-bottom:14px }

/* Этапы работы */
.steps{ counter-reset:step; list-style:none }
.steps li{
    display:grid; grid-template-columns:90px 1fr; gap:30px;
    padding:34px 0; border-top:1px solid var(--line);
}
.steps li:last-child{ border-bottom:1px solid var(--line) }
.steps li:before{
    counter-increment:step; content:'0' counter(step);
    font-size:38px; font-weight:800; color:var(--line); letter-spacing:-.03em; line-height:1;
}
.steps h4{ font-size:20px; font-weight:800; margin-bottom:10px; letter-spacing:-.01em }
.steps p{ color:var(--ink-soft); font-size:16px; line-height:1.65; margin:0 }
.section--dark .steps li{ border-color:var(--line-dark) }
.section--dark .steps li:before{ color:#2e2e2e }
.section--dark .steps p{ color:rgba(255,255,255,.55) }

/* Цифры */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-dark) }
.stats div{ background:#000; padding:36px 30px }
.stats b{ display:block; font-size:46px; font-weight:800; letter-spacing:-.03em; color:#fff; line-height:1 }
.stats span{ display:block; margin-top:12px; font-size:13px; color:rgba(255,255,255,.45); line-height:1.5 }

/* Форма заявки */
.cta{ background:#000; color:#fff }
.cta .h-big{ max-width:11em }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px }
.form-row{ position:relative }
.form-row--full{ grid-column:1 / -1 }
.form-label{
    display:block; font-size:11px; letter-spacing:.18em; text-transform:uppercase;
    font-weight:800; color:rgba(255,255,255,.45); margin-bottom:9px;
}
.form-input, .form-textarea, .form-select{
    width:100%; background:transparent; border:0; border-bottom:1px solid #333;
    color:#fff; font-family:var(--font); font-size:17px; padding:12px 0;
    transition:border-color .15s linear; border-radius:0; -webkit-appearance:none; appearance:none;
}
.form-select{ background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);
    background-position:calc(100% - 12px) calc(50% + 2px), calc(100% - 7px) calc(50% + 2px);
    background-size:5px 5px, 5px 5px; background-repeat:no-repeat; padding-right:28px; cursor:pointer }
.form-select option{ background:#000; color:#fff }
.form-textarea{ min-height:110px; resize:vertical; line-height:1.6 }
.form-input:focus, .form-textarea:focus, .form-select:focus{ border-bottom-color:#fff }
.form-input::placeholder, .form-textarea::placeholder{ color:#4d4d4d }
.form-submit{
    background:#fff; color:#000; border:2px solid #fff; padding:0 40px; line-height:52px;
    font-family:var(--font); font-size:13px; font-weight:800; letter-spacing:.16em;
    text-transform:uppercase; cursor:pointer; transition:all .18s linear;
}
.form-submit:hover{ background:transparent; color:#fff }
.form-submit[disabled]{ opacity:.45; cursor:default }
.form-note{ font-size:12.5px; color:rgba(255,255,255,.35); line-height:1.6; max-width:420px }
.form-note a{ color:rgba(255,255,255,.6) }
.form-foot{ display:flex; align-items:center; gap:30px; margin-top:36px; flex-wrap:wrap }
.form-msg{ margin-top:22px; font-size:15px; display:none; padding:14px 18px; border:1px solid #fff }
.form-msg.is-visible{ display:block }
.form-msg.is-err{ border-color:#fff; background:#fff; color:#000 }

/* Форма на светлом фоне */
.form--light .form-label{ color:var(--ink-soft) }
.form--light .form-input,
.form--light .form-textarea,
.form--light .form-select{ color:#000; border-bottom-color:var(--line) }
.form--light .form-input:focus,
.form--light .form-textarea:focus{ border-bottom-color:#000 }
.form--light .form-submit{ background:#000; color:#fff; border-color:#000 }
.form--light .form-submit:hover{ background:transparent; color:#000 }
.form--light .form-note{ color:var(--ink-soft) }

/* Контакты */
.contact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark) }
.contact-card{ background:#000; padding:40px 36px; text-decoration:none; display:block; color:#fff;
    transition:background .2s linear }
.contact-card:hover{ background:#fff; color:#000 }
.contact-card b{ display:block; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
    color:rgba(255,255,255,.45); font-weight:800; margin-bottom:16px }
.contact-card:hover b{ color:var(--ink-soft) }
.contact-card span{ display:block; font-size:26px; font-weight:800; letter-spacing:-.02em }
.contact-card i{ display:block; font-style:normal; font-size:14px; margin-top:10px;
    color:rgba(255,255,255,.4) }
.contact-card:hover i{ color:var(--ink-soft) }

.requisites{ list-style:none; font-size:16px; line-height:1.7 }
.requisites li{ display:grid; grid-template-columns:230px 1fr; gap:20px;
    padding:16px 0; border-bottom:1px solid var(--line) }
.requisites li:first-child{ border-top:1px solid var(--line) }
.requisites b{ font-weight:500; color:var(--ink-soft); font-size:14px }
.requisites span{ color:#000 }
.requisites .copy{
    margin-left:12px; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
    color:var(--ink-soft); border-bottom:1px dashed var(--line); cursor:pointer; font-weight:700;
}
.requisites .copy:hover{ color:#000; border-bottom-color:#000 }

/* Проект: шапка с обложкой на фоне */
.project-hero{ background:#000; color:#fff; padding:60px 0 40px; position:relative; overflow:hidden }
/* обложка уходит и под шапку сайта — как слайдер на главной */
.project-hero.has-cover{
    margin-top:-150px;
    padding-top:250px; padding-bottom:64px;
    min-height:700px;
    display:flex; flex-direction:column; justify-content:flex-end;
}
.project-hero__bg{
    position:absolute; left:0; top:0; right:0; bottom:0;
    background-size:cover;
    background-position:50% 50%;
    background-repeat:no-repeat;
    z-index:0;
}
.project-hero__bg:after{
    content:''; position:absolute; left:0; top:0; right:0; bottom:0;
    background:linear-gradient(180deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.45) 35%, rgba(0,0,0,.9) 100%);
}
.project-hero > .wrap{ position:relative; z-index:2; width:100% }
.project-hero__meta{ display:flex; gap:60px; flex-wrap:wrap; margin-top:40px;
    padding:30px 0 0; border-top:1px solid rgba(255,255,255,.22) }
.project-hero__meta div b{ display:block; font-size:11px; letter-spacing:.2em;
    text-transform:uppercase; color:rgba(255,255,255,.55); font-weight:800; margin-bottom:8px }
.project-hero__meta div span{ font-size:17px; font-weight:600 }
.gallery-list{ list-style:none }
.gallery-list li{ margin-bottom:30px }
.gallery-list img{ width:100%; display:block; background:#0d0d0d }
.gallery-list figcaption{ margin-top:12px; font-size:14px; color:var(--ink-soft) }

.next-project{
    display:block; background:#000; color:#fff; padding:80px 0; text-decoration:none;
    transition:background .2s linear;
}
.next-project:hover{ background:#0f0f0f; color:#fff }
.next-project .h-eyebrow{ color:rgba(255,255,255,.4) }
.next-project .h-mid{ color:#fff }
.next-project em{ font-style:normal; color:rgba(255,255,255,.5); font-size:18px;
    display:block; margin-top:12px }

/* Логотип-строка и мелочи */
.divider{ height:1px; background:var(--line); border:0; margin:0 }
.section--dark .divider{ background:var(--line-dark) }
.text-right{ text-align:right }
.mt-40{ margin-top:40px } .mt-60{ margin-top:60px } .mb-40{ margin-bottom:40px }
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start }

/* Флеш-сообщение */
.flash{
    position:fixed; left:50%; transform:translateX(-50%); bottom:30px; z-index:60;
    background:#fff; color:#000; padding:16px 26px; font-size:15px; font-weight:600;
    box-shadow:0 10px 40px rgba(0,0,0,.4); max-width:90vw;
}
.flash.is-err{ background:#000; color:#fff; outline:1px solid #fff }

/* 404 */
.err404{ text-align:center; padding:120px 0 }
.err404 .code{ font-size:120px; font-weight:800; letter-spacing:-.05em; line-height:1 }

/* =========================================================================
   Адаптив
   ========================================================================= */
@media (max-width:1400px){
    .wrap{ padding-left:60px; padding-right:60px }
    .logo{ left:60px }
    .rsContent .center{ padding-left:60px; padding-right:60px }
    .rsBullets{ right:60px }
    .slider-count{ left:60px }
    .h-big{ font-size:52px }
    .rsContent .header{ font-size:46px }
}
@media (max-width:1100px){
    #head{ height:110px; line-height:110px }
    .logo{ top:32px }
    .promos{ margin-top:-110px }
    .royalSlider{ height:600px; min-height:600px }
    .rsContent .wrap{ padding-top:110px }
    .rsContent .l{ width:100% }
    .content-cols{ grid-template-columns:1fr; gap:50px }
    .project-hero.has-cover{ margin-top:-110px; min-height:560px; padding-top:190px }
    .aside-card{ position:static }
    .feature-grid{ grid-template-columns:repeat(2,1fr) }
    .stats{ grid-template-columns:repeat(2,1fr) }
    .contact-grid{ grid-template-columns:1fr }
    .grid-2{ grid-template-columns:1fr; gap:40px }
    .section{ padding:80px 0 }
}
@media (max-width:1100px){
    /* исходный шаблон сдвигал логотип — возвращаем его влево */
    .logo{ margin-left:0; left:60px; top:36px; width:auto; font-size:inherit; line-height:1.15 }
    #head .menu .burger{ right:0 }
}
@media (max-width:860px){
    .wrap{ padding-left:24px; padding-right:24px }
    .logo{ left:24px; top:34px }
    .logo .ns-mark{ width:28px; height:28px; margin-right:11px }
    .logo .ns-mark:after{ width:10px; height:10px; right:4px; top:4px }
    .logo .ns-name b{ font-size:16px }
    .logo .ns-name i{ font-size:9px; letter-spacing:.18em }
    .rsContent .center{ padding-left:24px; padding-right:24px }
    .slide-bg:after{ background:linear-gradient(0deg, rgba(0,0,0,.94) 25%, rgba(0,0,0,.5) 100%) }
    .rsBullets{ right:24px; bottom:26px }
    .slider-count{ display:none }
    .royalSlider{ height:520px; min-height:520px }
    .rsContent .header{ font-size:32px }
    .rsContent .wrap{ padding-top:100px }
    .rsContent .wrap p{ font-size:15px }
    .h-big{ font-size:34px }
    .h-mid{ font-size:26px }
    .lead{ font-size:17px }
    .svc-grid{ grid-template-columns:1fr }
    .svc-card{ padding:34px 26px; min-height:0 }
    .svc-card__title{ font-size:24px }
    .feature-grid{ grid-template-columns:1fr }
    .svc-facts{ flex-wrap:wrap }
    .svc-facts div{ min-width:50% }
    .form-grid{ grid-template-columns:1fr }
    .steps li{ grid-template-columns:1fr; gap:12px }
    .steps li:before{ font-size:26px }
    .requisites li{ grid-template-columns:1fr; gap:4px }
    .section{ padding:56px 0 }
    .pagehead{ padding:40px 0 56px }
    .project-hero{ padding:40px 0 30px }
    .project-hero.has-cover{ margin-top:-110px; min-height:440px; padding-top:170px; padding-bottom:40px }
    .project-hero__bg:after{
        background:linear-gradient(180deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.55) 30%, rgba(0,0,0,.94) 100%);
    }
    .project-hero__meta{ gap:26px; margin-top:26px }
    .footer{ padding:50px 0 30px }
    .footer__r{ text-align:left; margin-left:0 }
    .projects li{ width:50% }
    .err404 .code{ font-size:72px }
}
@media (max-width:560px){
    .projects li{ width:100%; padding-right:0 }
    .projects ul{ margin-right:0 }
    .stats{ grid-template-columns:1fr }
    .h-big{ font-size:28px }
}

/* Печать */
@media print{
    #head, .footer, .submenu, .promos, .cta, .next-project{ display:none }
    body{ background:#fff; color:#000 }
}