/* =====================================================================
   v2: мега-меню, каталог, CTA, cookie-окно, подвал, мазок, модалка
   (подключается после style.css и переопределяет его)
   ===================================================================== */
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

/* ---------- mega menu ---------- */
.nav{gap:clamp(16px,1.9vw,32px)}
.nav__item{position:static}
.nav__item--rel{position:relative}
.nav__link .chev{transition:transform .2s}
.has-mega:hover>.nav__link .chev,.has-mega.is-open>.nav__link .chev,.has-mega:focus-within>.nav__link .chev{transform:rotate(225deg) translateY(2px)}
.mega{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:clamp(20px,2.4vw,44px);padding:30px clamp(20px,2.4vw,40px) 34px;background:#fff;color:var(--ink);border-radius:20px;box-shadow:0 24px 60px rgba(15,27,54,.18);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .22s,transform .22s,visibility .22s}
.mega::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.has-mega:hover>.mega,.has-mega:focus-within>.mega,.has-mega.is-open>.mega{opacity:1;visibility:visible;transform:none}
.mega--sm{left:-22px;right:auto;width:300px;padding:22px 24px 24px}
.mcol{min-width:0}
.mcol__h{display:inline-block;margin-bottom:12px;font:700 13px/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--blue);transition:color .2s}
a.mcol__h:hover{color:var(--red)}
.mcol__h--muted{color:var(--muted);letter-spacing:0;text-transform:none;font-weight:500;font-size:14px}
.mcol ul{display:grid;gap:2px}
.mcol li>a{display:block;padding:6px 0;font:500 15px/1.35 var(--body);color:var(--ink);transition:color .2s,transform .2s}
.mcol li>a:hover{color:var(--blue);transform:translateX(3px)}
.mcol li>a.is-current{color:var(--red);font-weight:700}
.msub{margin:0 0 6px 14px;padding-left:12px;border-left:1px solid #e1e4ea}
.msub li>a{font-size:13.5px;color:var(--grey);padding:4px 0}
.mcol--tiles{display:grid;gap:14px;align-content:start}
.mtile{position:relative;display:block;border-radius:16px;overflow:hidden;aspect-ratio:16/9;color:#fff;isolation:isolate}
.mtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s}
.mtile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(10,20,45,.78),rgba(10,20,45,0) 62%)}
.mtile:hover img{transform:scale(1.06)}
.mtile__t{position:absolute;left:14px;right:14px;bottom:30px;font:700 16px/1.2 var(--body)}
.mtile__s{position:absolute;left:14px;right:14px;bottom:11px;font-size:12px;opacity:.85}
.mcol--tiles .mtile:only-child{aspect-ratio:4/3}

/* ---------- info cards are not links ---------- */
.card{cursor:default}

/* ---------- path card: мазок на синем (как в макете) ---------- */
.path{background:var(--brush,none) center/100% 100% no-repeat,linear-gradient(115deg,#0e2248 0%,#143784 100%);min-height:250px;padding:28px 24px 24px;display:flex;flex-direction:column}
.path__list{margin-top:auto}
.path__title{margin:16px 0 28px}
.path__tag{font-weight:400}

/* ---------- catalog ---------- */
.catalog{margin-top:40px}
.catalog__nav{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.pill{height:44px;padding:0 20px;border:1px solid var(--blue);border-radius:30px;font:500 15px/1 var(--body);color:var(--blue);background:#fff;transition:background .2s,color .2s}
.pill:hover{background:rgba(20,55,132,.08)}
.pill.is-active{background:var(--blue);color:#fff}
.pgroup+.pgroup{margin-top:36px}
.pgroup__h{margin-bottom:18px;padding:12px 18px;background:#f4f6fa;border-radius:10px;font:700 clamp(16px,1.4vw,22px)/1.3 var(--head);color:var(--blue)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:20px}
.pcard{display:flex;flex-direction:column;gap:8px;padding:16px;background:#fff;border:1px solid #e6e8ee;border-radius:20px;text-align:center;transition:box-shadow .25s,transform .25s,border-color .25s}
.pcard:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(15,27,54,.12);border-color:transparent}
.pcard__img{display:grid;place-items:center;aspect-ratio:1;background:#f6f6f4;border-radius:14px;overflow:hidden}
.pcard__img img{width:78%;height:78%;object-fit:contain;mix-blend-mode:multiply}
.pcard__t{font:700 clamp(15px,1.1vw,18px)/1.3 var(--body);color:var(--red);margin-top:6px}
.pcard__p{display:grid;gap:3px;font-size:14px;line-height:1.4;color:var(--grey)}
.pcard__p b{font-weight:600;color:var(--ink)}
.catalog__all{display:inline-block;margin-top:28px;font:600 15px/1.3 var(--body);color:var(--blue);border-bottom:1px solid currentColor}
.catalog__all:hover{color:var(--red)}

/* ---------- CTA over the tasks form ---------- */
.cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,780px);gap:clamp(24px,4vw,80px);align-items:center;margin-top:20px;padding:clamp(24px,3vw,48px);background:#f4f6fa;border-radius:28px}
.cta__h{font:700 clamp(22px,2.4vw,36px)/1.25 var(--head);color:var(--blue)}
.cta__txt p{margin-top:14px;max-width:560px;font-size:clamp(14px,1vw,16px);color:var(--grey)}
.cta .form--row{margin-top:0;max-width:none;grid-template-columns:1fr 1fr}
.cta .form--row .btn{grid-column:1/-1;grid-row:auto}
.cta .form--row .check{grid-column:1/-1;grid-row:auto}
@media (max-width:1100px){.cta{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.footer__in{grid-template-columns:1.25fr .8fr 1.7fr .9fr}
.footer__tel{display:flex;flex-wrap:wrap;column-gap:20px;row-gap:4px}
.footer__tel .tel{white-space:nowrap}
.legal{padding:0;color:#fff}
.legal a{color:inherit}
.legal__links{display:flex;flex-wrap:wrap;gap:8px 28px;padding:18px 0 14px;border-bottom:1px solid rgba(255,255,255,.1)}
.legal__links a,.legal__links button{font-size:13px;color:#cfd3dc;transition:color .2s}
.legal__links a:hover,.legal__links button:hover{color:#fff;text-decoration:underline}
.legal__in{padding-block:14px 18px}
.legal__op{color:#9aa0ad;font-size:12px}
@media (max-width:1180px){.footer__in{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.footer__in{grid-template-columns:1fr}}

/* ---------- cookie popup ---------- */
.cookie{position:fixed;left:50%;bottom:20px;z-index:90;width:min(1180px,calc(100% - 32px));margin:0;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:20px 24px;border-radius:20px;background:var(--navy);color:#fff;box-shadow:0 20px 60px rgba(0,0,0,.35);transform:translate(-50%,24px);opacity:0;transition:transform .45s cubic-bezier(.22,.8,.3,1),opacity .35s}
.cookie.is-in{transform:translate(-50%,0);opacity:1}
.cookie p{max-width:none;margin:0;font-size:13px;line-height:1.5;color:rgba(255,255,255,.88)}
.cookie b{color:#fff}
.cookie a{color:#ff7d80;text-decoration:underline}
.cookie__btns{display:flex;gap:12px;flex:none}
@media (max-width:720px){.cookie{flex-direction:column;align-items:stretch;gap:12px;bottom:10px;padding:14px 16px}.cookie p{font-size:12px;line-height:1.4}.cookie__btns{gap:8px}.cookie__btns .btn{flex:1;height:42px;padding:0 10px;font-size:14px}.pgrid{grid-template-columns:repeat(2,1fr);gap:12px}.pcard{padding:10px;border-radius:16px}.pcard__p{font-size:12px}}

/* ---------- modal (статьи, проекты) ---------- */
.modal__box{display:flex;flex-direction:column;width:min(760px,100%);padding:28px 32px 24px;overflow:hidden}
.modal__x{position:absolute;top:14px;right:14px;float:none;margin:0}
.m-head{display:flex;align-items:center;gap:20px;padding-right:44px;margin-bottom:18px;flex:none}
.modal img.m-img{width:132px;height:132px;max-height:none;margin:0;border-radius:16px;flex:none;object-fit:cover}
.modal .m-head h2{margin:0;padding:0}
.modal .prose{flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:10px;max-height:min(56dvh,560px);outline:0;scrollbar-width:thin;scrollbar-color:#c4c9d4 transparent}
@media (max-width:560px){.m-head{flex-direction:column;align-items:flex-start}.modal img.m-img{width:100%;height:150px}.modal__box{padding:22px 18px 18px}}

/* ---------- mobile menu: accordions ---------- */
@media (max-width:1180px){
  .nav{gap:0;max-height:calc(100dvh - 90px);overflow-y:auto}
  .nav__item{border-bottom:1px solid #eee}
  .nav__item .nav__link{border:0;padding:15px 0;width:100%;justify-content:space-between}
  .mega,.mega--sm{position:static;display:none;width:auto;opacity:1;visibility:visible;transform:none;box-shadow:none;padding:0 0 14px 4px;border-radius:0;grid-template-columns:1fr;gap:6px}
  .has-mega.is-open>.mega{display:grid}
  .has-mega.is-open>.nav__link .chev{transform:rotate(225deg) translateY(2px)}
  .mega::before{display:none}
  .mcol--tiles{display:none}
  .nav__item--rel{position:static}
  .mcol__h{margin:10px 0 4px}
}
@media (hover:none){.has-mega:hover>.mega{opacity:0;visibility:hidden}.has-mega.is-open>.mega{opacity:1;visibility:visible}}

/* ---------- фильтр серий в каталоге ---------- */
.catalog__nav{gap:8px;margin-bottom:22px}
.pill--sm{height:34px;padding:0 14px;font-size:13px;display:inline-flex;align-items:center;gap:7px}
.pill--sm i{font-style:normal;font-size:11px;opacity:.6}
.pill--sm.is-active i{opacity:.85}
.pcard__s{align-self:center;padding:2px 9px;border-radius:20px;background:#eef1f8;color:var(--blue);font:600 11px/1.6 var(--body);letter-spacing:.04em}

/* ---------- hero video (поверх фото, включается плавно) ---------- */
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:0 center;opacity:0;transition:opacity 1s ease;pointer-events:none}
.hero__video.is-on{opacity:1}
@media (max-width:720px){.hero__video{object-position:68% center}}

.hero__toggle{position:absolute;right:var(--gutter);bottom:24px;z-index:3;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.72);backdrop-filter:blur(8px);box-shadow:0 2px 12px rgba(15,27,54,.18);display:grid;place-items:center;transition:background .2s,transform .15s}
.hero__toggle:hover{background:#fff}.hero__toggle:active{transform:scale(.94)}
.hero__toggle i{width:0;height:0;border-left:11px solid var(--blue);border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.hero__toggle.is-playing i{width:12px;height:14px;border:0;margin:0;background:linear-gradient(90deg,var(--blue) 0 4px,transparent 4px 8px,var(--blue) 8px 12px)}
@media (min-width:1696px){.hero__toggle{right:calc((100vw - 1600px)/2)}}

/* =====================================================================
   v3: адаптация (ноутбуки 1181–1599, планшет, телефон)
   ===================================================================== */
/* высота героя подстраивается под ширину: люди на фото не обрезаются */
.hero{min-height:max(620px,min(800px,52vw))}
.hero__bg img,.hero__video{object-position:16% center}
@media (min-width:1600px){.hero__bg img,.hero__video{object-position:0 center}}
.hero__title{font-size:clamp(34px,3.9vw,80px)}

/* планшет и телефон: текст сверху, фото/видео отдельным блоком под ним */
@media (max-width:1180px){
  .hero{min-height:0}
  .hero__bg{position:relative;inset:auto;order:3;z-index:0;aspect-ratio:1920/800;height:auto;background:#f3f1ee}
  .hero__bg::after{background:linear-gradient(180deg,#fff 0,rgba(255,255,255,0) 26%)}
  .hero__bg img,.hero__video{object-position:50% center}
  .hero__body{padding-top:28px;padding-bottom:32px}
  .hero__title{max-width:none;font-size:clamp(34px,6.2vw,60px)}
  .hero__text{max-width:640px}
  .hero__toggle{bottom:14px}
}
@media (max-width:720px){
  .hero__bg{aspect-ratio:auto;height:min(82vw,340px)}
  .hero__bg img,.hero__video{object-position:72% center}
  .hero__title{font-size:clamp(30px,9vw,44px);margin:12px 0 18px}
  .hero__text{font-size:15px;margin-bottom:28px}
  .hero__body{padding-top:20px;padding-bottom:28px}
}

.cta{grid-template-columns:minmax(300px,1fr) minmax(0,640px)}
@media (min-width:1560px){.cta{grid-template-columns:minmax(0,1fr) minmax(0,780px)}}
@media (max-width:1100px){.cta{grid-template-columns:1fr}}

@media (max-width:560px){.tab{flex-direction:column;align-items:stretch;gap:6px;min-width:0}.tab img{width:100%;aspect-ratio:16/8;margin-bottom:8px}.tab b,.tab span{padding:0 4px}.tabs{gap:14px}}

/* планшет: нет «сирот» в сетках из 3 карточек */
@media (min-width:561px) and (max-width:1024px){
  .grid3--plain{grid-template-columns:1fr;gap:28px}
  .grid3--plain .card--plain{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:24px;align-items:start}
  .grid3--plain .card--plain .card__body{padding:0}
  .grid3--plain .card--plain h3{margin-top:4px}
}
@media (min-width:721px) and (max-width:1024px){
  .grid3--articles{grid-template-columns:repeat(3,1fr);gap:16px}
  .acard__b{padding:14px 14px 18px}
}

/* ---------- «оживлённые» фото в блоке «Боитесь ошибиться» ---------- */
.card__media{position:relative;overflow:hidden;border-radius:24px;aspect-ratio:517/300;background:#e9e9e6}
.card--plain .card__media img,.card__media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;aspect-ratio:auto}
.card__video{opacity:0;transition:opacity .8s ease;pointer-events:none}
.card__video.is-on{opacity:1}

/* «живые» фото в карточках «Что вы хотите сделать» и в статьях */
.card:not(.card--plain) .card__media{border-radius:0}
.card:not(.card--plain) .card__media>img{border-radius:0}
.acard__media{position:relative;display:block;aspect-ratio:517/550;overflow:hidden;background:#e9e9e6}
.acard__media>img,.acard__media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.acard__video{opacity:0;transition:opacity .8s ease;pointer-events:none}
.acard__video.is-on{opacity:1}

/* большие мониторы (>1920): герой растёт вместе с шириной, чтобы не срезать людей сверху */
@media (min-width:1921px){.hero{min-height:min(41.7vw,1150px)}.hero__bg img,.hero__video{object-position:0 15%}}

/* мобильный герой: вертикальный кадр с парой (видео 0.9:1), а не растянутый горизонтальный */
.hero__bg picture{display:contents}
@media (max-width:720px){
  .hero__bg{aspect-ratio:864/960;height:auto}
  .hero__bg img,.hero__video{object-position:50% 50%}
}