/* ===========================================================================
   ru.ads-target.com — дизайн-система лендинга.
   Все размеры заданы в rem от корня, который до 1616px тянется за шириной
   окна: при 1615px 1rem = 16px и страница совпадает с макетом один в один,
   на меньших экранах пропорционально сжимается.
   =========================================================================== */

/* --- шрифты (self-hosted, переменные) ------------------------------------ */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/inter-cyrillic.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/inter-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/intertight-cyrillic.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/intertight-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* --- токены --------------------------------------------------------------- */
:root{
  --blue:#305CFF;
  --blue-dark:#2348D8;
  --navy:#101B39;
  --navy-deep:#131F42;
  --ink:#101B39;
  --gray:#586479;
  --gray-soft:#7C879B;
  --mint:#D8F7EC;
  --line:#E7EAF0;
  --line-soft:#EDF0F6;
  --surface:#F7F9FD;
  --radius-btn:1rem;
  --radius-card:1.5rem;
  --container:89.75rem;       /* 1436px */
  --gutter:2.5rem;
  --display:'Inter Tight','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --text:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* Корень тянется за шириной окна. Исходный макет снят при 1615px и 1rem=16px;
   вся страница уменьшена на 20% по просьбе владельца, поэтому делитель
   100.9375 / 0.8 = 126.171875, то есть при 1615px 1rem = 12.8px.
   clamp не даёт тексту уйти ниже 11px на узких десктопах. */
html{font-size:16px;-webkit-text-size-adjust:100%}
@media (min-width:1100px){html{font-size:clamp(11px, calc(100vw / 126.171875), 12.8px)}}

*,*::before,*::after{box-sizing:border-box}
body{
  margin:0;background:#fff;color:var(--gray);
  font-family:var(--text);font-size:1.0625rem;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-family:var(--display);color:var(--ink);font-weight:800;letter-spacing:-0.03em}
p{margin:0}

.container{width:min(var(--container),calc(100% - 2*var(--gutter)));margin:0 auto;padding:0}

/* --- кнопки ---------------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:5.5rem;padding:0 2.625rem;border:0;border-radius:var(--radius-btn);
  font-family:var(--text);font-size:1.625rem;font-weight:700;letter-spacing:-0.01em;
  cursor:pointer;transition:background-color .18s ease,transform .18s ease;
  white-space:nowrap;
}
.btn--primary{background:var(--blue);color:#fff}
.btn--primary:hover{background:var(--blue-dark)}
.btn--primary:active{transform:translateY(1px)}
.btn--ghost{
  display:inline-flex;align-items:center;gap:.625rem;
  color:var(--blue);font-family:var(--text);font-size:1.625rem;font-weight:700;
  letter-spacing:-0.01em;transition:gap .18s ease;
}
.btn--ghost:hover{gap:1.25rem}

/* --- шапка ----------------------------------------------------------------- */
.header{
  position:sticky;top:0;z-index:50;background:#fff;
}
.header__inner{height:9.5rem;padding-top:.5rem;display:flex;align-items:center;gap:2rem}
.logo{
  display:inline-flex;align-items:center;gap:1.15rem;
  color:var(--blue);                 /* цвет знака */
}
.logo__mark{height:3.75rem;width:auto;flex:0 0 auto}
.logo__word{
  font-family:var(--display);font-size:2.35rem;font-weight:800;
  letter-spacing:-0.035em;line-height:1;color:var(--navy);white-space:nowrap;
}
.logo__word b{font-weight:inherit;color:var(--blue)}
.nav{display:flex;align-items:center;gap:3.78125rem;margin:0 auto}
.nav a{
  font-family:var(--text);font-size:1.5625rem;font-weight:700;
  letter-spacing:-0.015em;color:var(--ink);transition:color .15s ease;
}
.nav a:hover{color:var(--blue)}
.nav-toggle{display:none}

/* --- герой ----------------------------------------------------------------- */
.hero{
  background:linear-gradient(118deg,#FBFDFF 0%,#F6F9FE 42%,#EDF2FB 100%);
  padding:12.9375rem 0 10.125rem;
  overflow:hidden;
}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3rem;align-items:start}
.badge{
  display:inline-flex;align-items:center;height:4.875rem;padding:0 1.5625rem;
  border-radius:999px;background:var(--mint);
  font-family:var(--text);font-size:1.3125rem;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--navy);
}
.hero h1{
  margin:3.3125rem 0 0;max-width:39rem;font-size:4.88rem;line-height:1.05;letter-spacing:-0.063em;
}
.hero__lead{
  margin:2.75rem 0 0;max-width:38.75rem;
  font-size:2.05rem;line-height:1.59;color:var(--gray);letter-spacing:0;
}
.hero__actions{display:flex;align-items:center;gap:3rem;margin-top:3.875rem}

/* --- макет дашборда --------------------------------------------------------- */
.mock{
  position:relative;width:40.9375rem;margin:-3.25rem 0 0 auto;
  transform:rotate(.89deg) skewX(-0.16deg);
  transform-origin:50% 50%;
}
.mock__card{
  display:flex;height:51.9375rem;border-radius:1.75rem;overflow:hidden;background:#fff;
  box-shadow:0 2.5rem 5rem rgba(16,27,57,.14),0 .5rem 1.5rem rgba(16,27,57,.06);
}
.mock__side{
  flex:0 0 28.7%;background:var(--navy-deep);padding:2.5rem 1.25rem;
  display:flex;flex-direction:column;gap:3.25rem;
}
.mock__logo{display:flex;align-items:center;gap:.5rem;font-family:var(--display);
  font-weight:800;font-size:1.25rem;color:#fff;letter-spacing:-0.03em;white-space:nowrap}
.mock__mark{height:1.9375rem;width:auto;flex:0 0 auto;color:#fff}
.mock__menu{display:flex;flex-direction:column;gap:1.25rem}
.mock__menu span{
  padding:1.125rem 1rem;border-radius:.875rem;font-size:1.125rem;color:#8E99B5;
}
.mock__menu span.is-active{background:var(--blue);color:#fff;font-weight:500}
.mock__main{flex:1;padding:2.5rem 1.75rem 2rem;display:flex;flex-direction:column;gap:1.125rem;min-width:0}
.mock__head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.mock__head b{font-family:var(--display);font-size:2rem;font-weight:800;
  color:var(--ink);line-height:1.3;max-width:9.5rem;display:block;letter-spacing:-0.03em}
.mock__head small{font-size:1.0625rem;color:var(--gray-soft);line-height:1.45;max-width:10rem;display:block}
.mock__tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1.125rem}
.mock__tile{border:1px solid var(--line);border-radius:.875rem;padding:1.125rem 1rem;height:9rem;
  display:flex;flex-direction:column;justify-content:space-between}
.mock__tile em{font-style:normal;font-size:1.0625rem;color:var(--gray-soft)}
.mock__tile i{display:block;width:2rem;height:.1875rem;border-radius:999px;background:var(--navy)}
.mock__panel{border:1px solid var(--line);border-radius:.875rem;padding:1rem;flex:1;
  display:flex;flex-direction:column}

.mock__panel b{font-size:1.125rem;font-weight:700;color:var(--ink);font-family:var(--text)}
.mock__bars{flex:1;display:flex;align-items:flex-end;gap:.5rem;padding:0 .25rem}
.mock__bars i{flex:1;border-radius:.25rem .25rem 0 0;
  background:linear-gradient(180deg,#9CB5FF 0%,var(--blue) 100%)}
.mock__row{display:grid;grid-template-columns:1fr 1fr;gap:1.125rem;height:14.375rem}
.mock__box{border:1px solid var(--line);border-radius:.875rem;padding:1rem;
  display:flex;flex-direction:column;gap:.85rem}

.mock__box b{font-size:1.1875rem;font-weight:700;color:var(--ink);font-family:var(--text)}
.mock__meter{height:.6875rem;border-radius:999px;background:#EEF1F8;overflow:hidden}
.mock__meter i{display:block;height:100%;border-radius:999px}
.mock__list{display:flex;flex-direction:column;gap:1.125rem;font-size:1.0625rem;color:var(--gray)}

/* --- полоса цифр ------------------------------------------------------------ */
.stats{background:#fff;border-bottom:1px solid var(--line)}
.stats__grid{display:grid;grid-template-columns:repeat(3,1fr);height:10.8125rem;align-items:center}
.stats__item{display:flex;align-items:baseline;gap:.75rem;padding-right:2rem}
.stats__item+.stats__item{border-left:1px solid var(--line);padding-left:4.1875rem}
.stats__num{font-family:var(--display);font-size:3.4375rem;font-weight:800;white-space:nowrap;
  color:var(--ink);letter-spacing:-0.045em;line-height:1}
.stats__label{font-size:1.5625rem;color:var(--gray);letter-spacing:-0.01em;white-space:nowrap}

/* --- секции ------------------------------------------------------------------ */
.section{padding:11.875rem 0 9rem}
.section--surface{background:var(--surface)}
.eyebrow{
  font-family:var(--text);font-size:1.375rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--blue);
}
.section h2{margin:2.5625rem 0 0;font-size:3.5rem;line-height:1.12;letter-spacing:-0.04em}
.section__lead{margin:2.1875rem 0 0;max-width:76rem;font-size:1.8375rem;line-height:1.7;color:var(--gray)}

/* карточки возможностей */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.75rem;margin-top:4.5rem}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-card);
  padding:2.75rem;display:flex;flex-direction:column;gap:1.5rem;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.card:hover{border-color:#C9D6FF;box-shadow:0 1.5rem 3rem rgba(16,27,57,.08);transform:translateY(-.25rem)}
.card__icon{
  width:4.5rem;height:4.5rem;border-radius:1.125rem;background:#EEF3FF;
  display:flex;align-items:center;justify-content:center;color:var(--blue);
}
.card__icon svg{width:2.25rem;height:2.25rem}
.card p{font-size:1.4375rem;line-height:1.55;color:var(--ink);font-weight:500;letter-spacing:-0.015em}

/* шаги «что мы умеем» */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:1.75rem;margin-top:4.5rem}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius-card);padding:2.25rem 1.75rem;
  display:flex;flex-direction:column;gap:1rem}
.step span{font-family:var(--display);font-size:2.5rem;font-weight:800;color:var(--blue);line-height:1}
.step p{font-size:1.25rem;line-height:1.45;color:var(--ink);letter-spacing:-0.015em}

/* логотипы партнёров */
.logos{display:grid;grid-template-columns:repeat(5,1fr);gap:1.75rem;margin-top:4.5rem}
.logos div{
  height:9rem;border:1px solid var(--line);border-radius:1.25rem;background:#fff;
  display:flex;align-items:center;justify-content:center;padding:1.75rem;
}
.logos img{max-height:3.25rem;max-width:72%;width:auto;object-fit:contain;filter:grayscale(1);opacity:.75;
  transition:filter .2s ease,opacity .2s ease}
.logos div:hover img{filter:none;opacity:1}

/* цель */
.goal{background:var(--navy-deep);border-radius:2rem;padding:6rem 5rem;text-align:center;color:#fff}
.goal h2{color:#fff;font-size:3rem;line-height:1.15}
.goal p{margin:1.75rem auto 0;max-width:62rem;font-size:1.875rem;line-height:1.6;color:#B9C3DB}

/* о нас */
.about{display:grid;grid-template-columns:1.1fr 1fr;gap:5rem;align-items:center}
.about__list{display:flex;flex-direction:column;gap:1.5rem;margin-top:3rem}
.about__list li{display:flex;gap:1.125rem;font-size:1.5rem;line-height:1.5;color:var(--ink);letter-spacing:-0.012em}
.about__list svg{flex:0 0 auto;width:1.75rem;height:1.75rem;color:var(--blue);margin-top:.35rem}
.about__panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:3rem}
.about__panel dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:1.75rem 2rem;align-items:baseline}
.about__panel dt{font-size:1.3125rem;color:var(--gray-soft)}
.about__panel dd{margin:0;font-family:var(--display);font-size:1.75rem;font-weight:700;color:var(--ink);
  letter-spacing:-0.025em;word-break:break-word}
.about__panel a:hover{color:var(--blue)}

/* контакты и форма */
.contacts{display:grid;grid-template-columns:1fr 1.25fr;gap:5rem;align-items:start}
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.field{position:relative;display:flex;flex-direction:column;gap:.625rem}
.field--wide{grid-column:1 / -1}
.field label{font-size:1.25rem;font-weight:600;color:var(--ink);letter-spacing:-0.01em}
.field input,.field textarea{
  width:100%;font-family:var(--text);font-size:1.4375rem;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:1rem;padding:1.375rem 1.5rem;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.field textarea{min-height:11rem;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--blue);
  box-shadow:0 0 0 .25rem rgba(48,92,255,.12)}
.field.has-error input,.field.has-error textarea{border-color:#E0504D}
.field__error{font-size:1.125rem;color:#E0504D;min-height:1.4em}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form__submit{grid-column:1 / -1;display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
.form__note{font-size:1.1875rem;color:var(--gray-soft);max-width:30rem;line-height:1.5}
.form__status{grid-column:1 / -1;font-size:1.3125rem;font-weight:600;min-height:1.6em}
.form__status.is-ok{color:#1A8F62}
.form__status.is-err{color:#E0504D}

/* подвал */
.footer{background:var(--navy-deep);color:#A9B4CE;padding:4.5rem 0}
.footer__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.footer .logo{color:#fff;gap:.9rem}
.footer .logo__mark{height:2.8rem}
.footer .logo__word{color:#fff;font-size:1.75rem}
.footer .logo__word b{color:#6E90FF}
.footer__links{display:flex;gap:2.5rem;font-size:1.25rem}
.footer__links a:hover{color:#fff}
.footer small{font-size:1.25rem}

/* --- планшет и телефон ------------------------------------------------------- */
@media (max-width:1099.98px){
  :root{--gutter:1.5rem;--container:48rem}
  body{font-size:1rem;line-height:1.6}
  .header__inner{height:4.5rem;gap:1rem}
  .logo{gap:.625rem}
  .logo__mark{height:2.125rem}
  .logo__word{font-size:1.3125rem}
  .mock__logo{font-size:.8125rem;gap:.375rem}
  .mock__mark{height:1.25rem}
  .nav{position:fixed;inset:4.5rem 0 auto;background:#fff;flex-direction:column;
    align-items:stretch;gap:0;padding:.5rem 1.5rem 1.5rem;margin:0;
    border-bottom:1px solid var(--line);display:none}
  .nav.is-open{display:flex}
  .nav a{padding:.875rem 0;font-size:1.0625rem;border-bottom:1px solid var(--line-soft)}
  .header .btn{display:none}
  .nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:.3125rem;
    margin-left:auto;width:2.75rem;height:2.75rem;border:0;background:none;cursor:pointer;padding:0}
  .nav-toggle i{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
  .hero{padding:3rem 0 3.5rem}
  .hero__grid{grid-template-columns:1fr;gap:3rem}
  .badge{height:2.5rem;font-size:.8125rem;padding:0 1rem}
  .hero h1{font-size:2.5rem;line-height:1.08;letter-spacing:-0.04em;margin-top:1.25rem}
  .hero__lead{font-size:1.125rem;line-height:1.6;margin-top:1.25rem;max-width:none}
  .hero__actions{margin-top:2rem;gap:1.5rem;flex-wrap:wrap}
  .btn{height:3.5rem;font-size:1.0625rem;padding:0 1.5rem;border-radius:.875rem}
  .btn--ghost{font-size:1.0625rem}
  .mock{width:100%;transform:none}
  .mock__card{height:30rem;border-radius:1.25rem}
  .mock__side{padding:1rem .75rem;gap:1.25rem}
  .mock__menu span{font-size:.75rem;padding:.5rem .625rem;border-radius:.5rem}
  .mock__main{padding:1rem;gap:.625rem}
  .mock__head b{font-size:1rem;max-width:6rem}
  .mock__head small{font-size:.6875rem;max-width:6rem}
  .mock__tile{height:4.5rem;padding:.5rem}
  .mock__tile em{font-size:.6875rem}
  .mock__row{height:8rem}
  .mock__panel b,.mock__box b{font-size:.8125rem}
  .mock__list{font-size:.75rem;gap:.5rem}
  .stats__grid{grid-template-columns:1fr;height:auto;gap:1.5rem;padding:2.5rem 0}
  .stats__item{padding-right:0}
  .stats__item+.stats__item{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:1.5rem}
  .stats__num{font-size:2.25rem}
  .stats__label{font-size:1.0625rem}
  .section{padding:3.5rem 0}
  .eyebrow{font-size:.8125rem}
  .section h2{font-size:1.875rem;margin-top:1rem;line-height:1.18}
  .section__lead{font-size:1.0625rem;line-height:1.6;margin-top:1rem}
  .cards,.steps,.logos{grid-template-columns:1fr;gap:1rem;margin-top:2rem}
  .card{padding:1.5rem;gap:1rem;border-radius:1.125rem}
  .card__icon{width:3rem;height:3rem;border-radius:.75rem}
  .card__icon svg{width:1.5rem;height:1.5rem}
  .card p,.step p{font-size:1.0625rem}
  .step{padding:1.25rem 1.5rem;border-radius:1.125rem}
  .step span{font-size:1.5rem}
  .logos{grid-template-columns:repeat(2,1fr)}
  .logos div{height:5.5rem;padding:1rem;border-radius:.875rem}
  .logos img{max-height:2.25rem}
  .goal{padding:2.5rem 1.5rem;border-radius:1.25rem}
  .goal h2{font-size:1.625rem}
  .goal p{font-size:1.0625rem;margin-top:1rem}
  .about,.contacts{grid-template-columns:1fr;gap:2rem}
  .about__list{margin-top:1.5rem;gap:1rem}
  .about__list li{font-size:1.0625rem}
  .about__list svg{width:1.25rem;height:1.25rem}
  .about__panel{padding:1.5rem;border-radius:1.125rem}
  .about__panel dl{gap:1rem 1.25rem}
  .about__panel dt{font-size:.9375rem}
  .about__panel dd{font-size:1.0625rem}
  .form{grid-template-columns:1fr;gap:1rem}
  .field label{font-size:.9375rem}
  .field input,.field textarea{font-size:1rem;padding:.875rem 1rem;border-radius:.75rem}
  .field textarea{min-height:8rem}
  .form__note{font-size:.9375rem}
  .form__status{font-size:1rem}
  .footer{padding:2.5rem 0}
  .footer__inner{flex-direction:column;align-items:flex-start;gap:1rem}
  .footer__links{gap:1.25rem;font-size:.9375rem;flex-wrap:wrap}
  .footer small{font-size:.9375rem}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
