/* ===== Глобальные стили / Этап 0 ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }

:root{
  --bg:#f9f9f9;
  --text:#2b2b2b;
  --muted:#6b7280;
  --brand:#1d3557;      /* глубокий синий */
  --accent:#457b9d;     /* холодный бирюзовый */
  --soft:#a8dadc;       /* мягкий акцент */
  --card:#ffffff;
  --shadow:0 10px 30px rgba(0,0,0,.06);
  --radius:16px;
  --radius-lg:22px;
}

html{ scroll-behavior:smooth; }
body{
  font-family:'Inter',sans-serif;
  background-color:var(--bg);
  color:var(--text);
  font-size:16px; line-height:1.6;
}

/* Утилиты */
.container{ width:90%; max-width:1200px; margin:0 auto; }
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.85rem 1.1rem; border-radius:var(--radius);
  text-decoration:none; font-weight:600; transition:transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  border:1px solid transparent; will-change:transform;
}
.btn i{ width:18px; height:18px; }
.btn--primary{ background:var(--brand); color:#fff; box-shadow:var(--shadow); }
.btn--primary:hover{ transform:translateY(-2px); background:var(--accent); }
.btn--ghost{ background:transparent; color:var(--brand); border-color:var(--brand); }
.btn--ghost:hover{ color:#fff; background:var(--brand); }

/* ===== Хедер / Этап 1 ===== */
.header{ background:#ffffff; border-bottom:1px solid #e0e0e0; position:sticky; top:0; z-index:1000; }
.header__container{ display:flex; justify-content:space-between; align-items:center; padding:1rem 0; }
.header__logo{ font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:600; color:var(--brand); }
.header__menu{ list-style:none; display:flex; gap:1.2rem; }
.header__menu a{ text-decoration:none; color:var(--text); font-weight:500; transition:color .25s ease; }
.header__menu a:hover{ color:var(--accent); }

/* ===== HERO / Этап 3 ===== */
.hero{
  position:relative; overflow:hidden; padding:5.5rem 0 4rem; background:
    radial-gradient(1200px 500px at 80% -10%, rgba(69,123,157,.12), transparent 60%),
    radial-gradient(700px 400px at 0% 0%, rgba(168,218,220,.18), transparent 60%);
}
.hero__container{ display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:center; }
@media (max-width:900px){ .hero__container{ grid-template-columns:1fr; padding-top:1rem; } }

.hero__bg-shape{
  position:absolute; filter:blur(40px); opacity:.25; z-index:0; animation:float 12s ease-in-out infinite;
}
.hero__bg-shape--one{
  width:420px; height:420px; background:conic-gradient(from 30deg,var(--soft),#d7f0f1,#eaf6f7);
  left:-120px; top:-120px; border-radius:50%;
}
.hero__bg-shape--two{
  width:540px; height:540px; background:conic-gradient(from -30deg,#e7eef9,#cfe9ff,#e6f7ff);
  right:-180px; bottom:-180px; border-radius:44%;
  animation-direction:reverse;
}
@keyframes float{
  0%{ transform:translateY(0) rotate(0); }
  50%{ transform:translateY(-14px) rotate(6deg); }
  100%{ transform:translateY(0) rotate(0); }
}

.hero__content{ position:relative; z-index:1; }
.hero__title{
  font-family:'Playfair Display',serif; font-size:2.2rem; line-height:1.25; color:var(--brand); letter-spacing:.2px;
}
@media (min-width:1000px){ .hero__title{ font-size:3rem; } }

.hero__subtitle{
  margin-top:1rem; color:var(--muted); max-width:46ch; font-size:1.05rem;
}

.hero__cta{ margin-top:1.5rem; display:flex; gap:.8rem; flex-wrap:wrap; }

.hero__bullets{ margin-top:1.6rem; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.8rem; list-style:none; }
.hero__bullet{
  display:flex; gap:.6rem; align-items:flex-start; background:var(--card); border:1px solid #eef2f7;
  border-radius:var(--radius); padding:.8rem .9rem; box-shadow:var(--shadow);
}
.hero__bullet i{ flex:0 0 auto; width:18px; height:18px; color:var(--accent); margin-top:.2rem; }

.hero__media{ position:relative; z-index:1; justify-self:center; }
.hero__image{
  width:100%; max-width:520px; border-radius:var(--radius-lg); box-shadow:var(--shadow); background:#eaeff3; object-fit:cover;
}
.hero__card{
  position:absolute; right:-10px; bottom:-14px; display:flex; gap:.65rem; align-items:center;
  background:#fff; border:1px solid #e9eef5; padding:.7rem .9rem; border-radius:14px; box-shadow:var(--shadow);
}
.hero__card i{ width:18px; height:18px; color:var(--brand); }
.hero__card-title{ font-weight:700; font-size:.95rem; }
.hero__card-text{ font-size:.85rem; color:var(--muted); }

/* ===== Футер / Этап 2 ===== */
.footer{ background:var(--brand); color:#ffffff; padding:3rem 0; margin-top:4rem; }
.footer__container{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:2rem; }
.footer__logo{ font-family:'Playfair Display',serif; font-size:1.3rem; font-weight:600; margin-bottom:1rem; }
.footer__col h4{ margin-bottom:1rem; font-size:1rem; font-weight:600; }
.footer__col ul{ list-style:none; }
.footer__col ul li{ margin-bottom:.5rem; }
.footer__col ul li a{ color:#f1faee; text-decoration:none; transition:color .3s; }
.footer__col ul li a:hover{ color:var(--soft); }
.footer__col p{ margin-bottom:.5rem; font-size:.95rem; }

/* ===== Стили для текстовых страниц (Этап 5: политики) ===== */
.pages{ padding:3rem 0; }
.pages .container{ max-width:900px; }
.pages h1{ font-family:'Playfair Display',serif; color:var(--brand); margin-bottom:1rem; }
.pages h2{ margin-top:2rem; margin-bottom:.75rem; color:var(--text); }
.pages p{ margin:.8rem 0; color:var(--text); }
.pages ul{ margin:1rem 0 1rem 1.2rem; }
.pages li{ margin:.4rem 0; }
.pages a{ color:var(--accent); text-decoration:underline; }

/* Мелкие улучшения AOS */
[data-aos]{ will-change:transform, opacity; }

/* ===== Секция Стратегии ===== */
.strategy{ padding:4rem 0 3rem; }
.strategy__header{ text-align:center; max-width:760px; margin:0 auto 1.5rem; }
.strategy__title{ font-family:'Playfair Display',serif; color:var(--brand); font-size:2rem; }
.strategy__subtitle{ color:var(--muted); margin-top:.6rem; }

.strategy__tabs{
  margin:1.2rem auto 1rem; display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center;
}
.strategy__tab{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.6rem .9rem; border:1px solid #e3e7ee; background:#fff; color:var(--text);
  border-radius:999px; cursor:pointer; transition:background .2s ease, color .2s ease, border-color .2s ease, transform .15s;
}
.strategy__tab i{ width:18px; height:18px; }
.strategy__tab:hover{ transform:translateY(-1px); border-color:#d5dbe6; }
.strategy__tab--active{ background:var(--brand); color:#fff; border-color:var(--brand); }

.strategy__panes{ margin-top:1rem; }
.strategy__pane{ display:none; }
.strategy__pane--active{ display:block; }

.strategy__grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:1.6rem; align-items:center; background:var(--card);
  border:1px solid #eef2f7; border-radius:var(--radius-lg); padding:1.2rem; box-shadow:var(--shadow);
}
@media (max-width:900px){ .strategy__grid{ grid-template-columns:1fr; } }

.strategy__pane-title{ font-weight:700; color:var(--text); margin-bottom:.6rem; }
.strategy__list{ list-style:none; display:grid; gap:.5rem; margin: .6rem 0 1rem; }
.strategy__list li{ display:flex; gap:.5rem; align-items:flex-start; }
.strategy__list i{ width:18px; height:18px; color:var(--accent); margin-top:.15rem; }

.strategy__media{ position:relative; }
.strategy__image{
  width:100%; border-radius:var(--radius); background:#eaeff3; box-shadow:var(--shadow); object-fit:cover;
}
.strategy__note{
  margin-top:.6rem; display:inline-flex; gap:.4rem; align-items:center; font-size:.9rem; color:var(--muted);
  background:#fff; border:1px dashed #dfe6f2; padding:.45rem .6rem; border-radius:10px;
}
.strategy__note i{ width:16px; height:16px; }

/* ===== Секция Кейсы ===== */
.cases{ padding:4rem 0 3rem; }
.cases__header{ text-align:center; max-width:760px; margin:0 auto 1.5rem; }
.cases__title{ font-family:'Playfair Display',serif; color:var(--brand); font-size:2rem; }
.cases__subtitle{ color:var(--muted); margin-top:.6rem; }

.cases__grid{
  margin-top:1rem;
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:1.2rem;
}
.case-card{
  grid-column:span 6;
  display:flex; flex-direction:column;
  background:#fff; border:1px solid #eef2f7; border-radius:var(--radius-lg);
  box-shadow:var(--shadow); overflow:hidden; transition:transform .25s ease, box-shadow .25s ease;
}
.case-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(0,0,0,.08); }
@media (max-width:900px){ .case-card{ grid-column:span 12; } }

.case-card__media{ position:relative; }
.case-card__image{ width:100%; height:220px; object-fit:cover; background:#eaeff3; }
.case-card__badge{
  position:absolute; left:12px; top:12px;
  background:rgba(29,53,87,.92); color:#fff; font-size:.8rem; padding:.35rem .6rem; border-radius:999px;
  border:1px solid rgba(255,255,255,.2); backdrop-filter:blur(4px);
}

.case-card__body{ padding:1rem 1rem 1.1rem; display:grid; gap:.75rem; }
.case-card__title{ font-weight:700; color:var(--text); }
.case-card__text{ color:var(--muted); }

.case-card__metrics{
  display:grid; grid-template-columns:1fr 1fr; gap:.6rem; list-style:none;
  padding:.6rem; border:1px dashed #dfe6f2; border-radius:12px; background:#fafcff;
}
.case-card__metrics li{ display:flex; align-items:center; gap:.45rem; }
.case-card__metrics i{ width:18px; height:18px; color:var(--accent); }
.case-card .btn{ justify-self:start; }

/* ===== Секция Аналитика ===== */
.analytics{ padding:4rem 0 3.5rem; }
.analytics__header{ text-align:center; max-width:760px; margin:0 auto 1.5rem; }
.analytics__title{ font-family:'Playfair Display',serif; color:var(--brand); font-size:2rem; }
.analytics__subtitle{ color:var(--muted); margin-top:.6rem; }

/* KPI */
.analytics__kpis{
  margin:1.2rem 0 1.5rem; list-style:none; display:grid;
  grid-template-columns:repeat(12,1fr); gap:1rem;
}
.kpi{ grid-column:span 4; background:#fff; border:1px solid #eef2f7; border-radius:var(--radius-lg); padding:1rem; box-shadow:var(--shadow); }
@media (max-width:900px){ .kpi{ grid-column:span 12; } }
.kpi__top{ display:flex; justify-content:space-between; align-items:center; }
.kpi__name{ font-weight:600; color:var(--text); }
.kpi__val{ font-weight:700; color:var(--brand); }
.kpi__bar{ margin:.6rem 0 .4rem; height:8px; background:#f1f5fb; border-radius:999px; overflow:hidden; }
.kpi__bar > span{ display:block; height:100%; width:0; background:linear-gradient(90deg, var(--accent), var(--soft)); transition:width .8s ease; }
.kpi__note{ color:var(--muted); font-size:.9rem; }

/* Аккордеон */
.analytics__accordion{ display:grid; gap:.8rem; }
.acc{ background:#fff; border:1px solid #e8eef6; border-radius:var(--radius-lg); box-shadow:var(--shadow); overflow:hidden; }
.acc__heading{ margin:0; }
.acc__btn{
  width:100%; text-align:left; display:flex; align-items:center; gap:.6rem;
  padding:1rem 1rem; background:#fff; border:0; cursor:pointer; font-weight:700; color:var(--text);
}
.acc__btn i{ width:18px; height:18px; color:var(--accent); }
.acc__btn[aria-expanded="true"]{ background:#f8fbff; }

.acc__panel{ border-top:1px solid #edf2f8; padding:1rem; }
.acc__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:1.2rem; align-items:center; }
@media (max-width:900px){ .acc__grid{ grid-template-columns:1fr; } }

.acc__text p{ color:var(--text); }
.acc__list{ list-style:none; display:grid; gap:.45rem; margin:.6rem 0 1rem; }
.acc__list li{ display:flex; gap:.5rem; }
.acc__list i{ width:18px; height:18px; color:var(--accent); margin-top:.15rem; }

.acc__media{ position:relative; }
.acc__image{ width:100%; border-radius:var(--radius); background:#eaeff3; box-shadow:var(--shadow); }
.acc__hint{
  margin-top:.5rem; display:inline-flex; align-items:center; gap:.4rem;
  font-size:.9rem; color:var(--muted); background:#fff; border:1px dashed #dfe6f2; padding:.45rem .6rem; border-radius:10px;
}
.acc__hint i{ width:16px; height:16px; }

/* Мелкие улучшения */
.acc__btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }

/* ===== Секция Инсайты ===== */
.insights{ padding:4rem 0 3.5rem; }
.insights__header{ text-align:center; max-width:760px; margin:0 auto 1.5rem; }
.insights__title{ font-family:'Playfair Display',serif; color:var(--brand); font-size:2rem; }
.insights__subtitle{ color:var(--muted); margin-top:.6rem; }

.insights__grid{
  margin-top:1rem;
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:1.1rem;
}

.insight-card{
  grid-column:span 6;
  display:grid; gap:.7rem;
  background:#fff; border:1px solid #eef2f7; border-radius:var(--radius-lg);
  box-shadow:var(--shadow); padding:1rem 1rem 1.1rem;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
@media (max-width:900px){ .insight-card{ grid-column:span 12; } }
.insight-card:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(0,0,0,.07); border-color:#e1e8f2; }

.insight-card__head{ display:grid; gap:.35rem; }
.insight-card__tag{
  justify-self:start; font-size:.78rem; letter-spacing:.2px; color:#fff;
  background:linear-gradient(90deg, var(--accent), var(--soft));
  padding:.25rem .55rem; border-radius:999px; border:1px solid rgba(255,255,255,.35);
}
.insight-card__title{ font-weight:700; color:var(--text); }

.insight-card__text{ color:var(--muted); }

.insight-card__bullets{ list-style:none; display:grid; gap:.4rem; }
.insight-card__bullets li{ display:flex; gap:.45rem; align-items:flex-start; }
.insight-card__bullets i{ width:18px; height:18px; color:var(--accent); margin-top:.1rem; }

/* ===== Секция Контакты ===== */
.contact{ padding:4rem 0 4rem; }
.contact__header{ text-align:center; max-width:760px; margin:0 auto 1.5rem; }
.contact__title{ font-family:'Playfair Display',serif; color:var(--brand); font-size:2rem; }
.contact__subtitle{ color:var(--muted); margin-top:.6rem; }

.contact__form{
  background:#fff; border:1px solid #e9eef6; border-radius:var(--radius-lg);
  box-shadow:var(--shadow); padding:1.2rem; max-width:920px; margin:1rem auto 0;
}
.contact__grid{
  display:grid; grid-template-columns:repeat(12,1fr); gap:1rem;
}
.contact__field{ grid-column:span 6; display:grid; gap:.4rem; }
.contact__field--captcha{ grid-column:span 6; }
@media (max-width:900px){
  .contact__field, .contact__field--captcha{ grid-column:span 12; }
}
.contact__label{ font-weight:600; color:var(--text); }
.contact__input{
  width:100%; padding:.75rem .9rem; border:1px solid #dfe6f2; border-radius:12px;
  background:#fbfdff; outline:none; transition:border-color .2s ease, box-shadow .2s ease;
}
.contact__input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(69,123,157,.14); }

.contact__captcha{
  display:flex; gap:.6rem; align-items:center;
}
.contact__captcha-text{
  display:inline-flex; align-items:center; gap:.35rem; padding:.55rem .7rem;
  background:#f6faff; border:1px dashed #dfe6f2; border-radius:10px; color:var(--text);
}
.contact__captcha-text i{ width:18px; height:18px; color:var(--accent); }

.contact__agree{ grid-column:span 12; margin-top:.2rem; }
.contact__checkbox{
  display:inline-flex; align-items:center; gap:.5rem; cursor:pointer; user-select:none;
}
.contact__checkbox input{ display:none; }
.contact__checkmark{
  width:18px; height:18px; border:1px solid #cfd7e6; border-radius:4px; background:#fff; display:inline-block; position:relative;
}
.contact__checkbox input:checked + .contact__checkmark{
  border-color:var(--brand); background:linear-gradient(90deg,var(--accent),var(--soft));
}
.contact__checkbox input:checked + .contact__checkmark::after{
  content:''; position:absolute; left:5px; top:1px; width:5px; height:10px; border:2px solid #fff; border-top:0; border-left:0; transform:rotate(45deg);
}

.contact__error{
  color:#b91c1c; font-size:.9rem; min-height:1.1em;
}
.contact__actions{
  display:flex; align-items:center; gap:.9rem; margin-top:1rem;
}
.contact__status{
  font-size:.95rem; color:var(--muted);
}

.contact__honeypot{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Блок контактной информации */
.contact__info{
  display:grid; grid-template-columns:repeat(12,1fr); gap:1rem; margin:1.2rem auto 0; max-width:920px;
}
.contact__card{
  grid-column:span 4; display:flex; align-items:center; gap:.5rem; background:#fff;
  border:1px solid #e9eef6; border-radius:12px; padding:.8rem .9rem; box-shadow:var(--shadow);
}
.contact__card i{ width:18px; height:18px; color:var(--accent); }
@media (max-width:900px){ .contact__card{ grid-column:span 12; } }

/* Состояния ошибок и успеха для input */
.contact__input--invalid{ border-color:#b91c1c; background:#fff7f7; }
.contact__input--valid{ border-color:#10b981; background:#f6fffb; }

/* ===== Cookie Pop-up ===== */
.cookie{
  position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%) translateY(20px);
  width: min(960px, 92%); z-index: 9999;
  opacity: 0; pointer-events: none; transition: transform .3s ease, opacity .3s ease;
}
.cookie--visible{ opacity: 1; transform: translateX(-50%) translateY(0); pointer-events: auto; }

.cookie__inner{
  display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center;
  background: #fff; border: 1px solid #e9eef6; border-radius: var(--radius-lg);
  box-shadow: var(--shadow); padding: .9rem;
}
@media (max-width: 700px){
  .cookie__inner{ grid-template-columns: 1fr; gap: .7rem; }
  .cookie__btn{ justify-self: start; }
}

.cookie__icon i{ width: 20px; height: 20px; color: var(--accent); }
.cookie__text{ color: var(--text); }
.cookie__text a{ color: var(--accent); text-decoration: underline; }
