:root {
    /* Brand teal */
    --teal: #4FB3C4;
    --teal-deep: #2E8F9E;
    --teal-light: #B8E0E6;
    --teal-soft: #EAF5F7;

    /* Accent saturated (фигуры/иконки в карточках) */
    --yellow: #FFD93D;
    --pink: #F8B4C4;

    /* Pastel-фоны карточек (используются в блоках «Для кого» и «Как мы работаем») */
    --bg-teal-pastel: #EEF7F8;
    --bg-yellow-pastel: #FFF9E0;
    --bg-pink-pastel: #FDEFF2;

    /* Нейтрали */
    --ink: #0F1416;
    --text: #1F2428;
    --muted: #525C63;
    --muted-soft: #9CA3A8;
    --line: #EDEBE6;
    --white: #FFFFFF;
    --warm: #FAF8F3; /* hover-плашка в dropdown и close-кнопке модалки */
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }
  img { pointer-events: none; }


  html { scroll-behavior: smooth; scroll-padding-top: 100px; overflow-x: hidden; }

  body {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 400;
    color: var(--text);
    background: var(--white);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    width: 100%;
  }

  .container {
    width: 100%;
    max-width: 1360px;
    margin: 0 auto;
    padding: 0 48px;
    box-sizing: border-box;
  }
  .nowrap { white-space: nowrap; }

  /* ───────── ADAPTIVE SECTION SPACING (глобально для всех секций) ─────────
     На мобиле — единый padding-bottom между секциями (top наследуется от bottom предыдущей).
     .for-whom — единственная имеет padding-top, чтобы отделиться от ticker.
  */
  @media (max-width: 960px) {
    .how, .dirs, .about, .promo, .team, .why, .results, .reviews, .orginfo, .faq, .contacts {
      padding-top: 0 !important;
      padding-bottom: 110px !important;
    }
    .for-whom {
      padding-top: 110px !important;
      padding-bottom: 110px !important;
    }
    .section-head { margin-bottom: 28px; }
    .section-h2 { font-size: clamp(28px, 5vw, 40px); letter-spacing: -0.035em; }
    .section-label { margin-bottom: 16px; font-size: 11px; }
  }
  @media (max-width: 600px) {
    .how, .dirs, .about, .promo, .team, .why, .results, .reviews, .orginfo, .faq, .contacts {
      padding-bottom: 100px !important;
    }
    .for-whom {
      padding-top: 100px !important;
      padding-bottom: 100px !important;
    }
    .section-head { margin-bottom: 24px; }
    .section-h2 { font-size: clamp(24px, 7vw, 32px); }
  }
  @media (max-width: 960px) {
    .container { padding: 0 28px; }
  }
  @media (max-width: 600px) {
    .container { padding: 0 18px; }
  }

  /* ───────── HEADER ───────── */
  .header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--line);
  }

  .header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 40px;
    width: 1360px;
    max-width: 100%;
    margin: 0 auto;
  }

  .logo {
    display: flex;
    align-items: center;
    height: 48px;
    flex-shrink: 0;
  }

  .logo img {
    height: 48px;
    width: auto;
    display: block;
  }

  .nav {
    display: flex;
    align-items: center;
    gap: 24px;
  }

  .nav a {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    color: var(--text);
    text-decoration: none;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: -0.005em;
    transition: color 0.2s;
    white-space: nowrap;
  }

  .nav a:hover { color: var(--teal-deep); }

  .header-right {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-shrink: 0;
  }

  .phone-block {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1;
    gap: 4px;
  }

  .city {
    font-size: 11px;
    color: var(--muted);
    font-weight: 400;
    letter-spacing: 0.01em;
  }

  .phone-btn {
    padding: 0;
    border: none;
    background: transparent;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 15px;
    letter-spacing: -0.02em;
    color: var(--ink);
    cursor: pointer;
    transition: color 0.2s;
    font-variant-numeric: tabular-nums;
  }

  .phone-btn:hover {
    color: var(--teal-deep);
  }

  .cta-btn {
    padding: 10px 16px;
    background: var(--teal-deep);
    color: var(--white);
    border: none;
    border-radius: 6px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
  }

  .cta-btn:hover { background: var(--teal-light); color: var(--ink); }

  /* ───────── BURGER + MOBILE MENU ───────── */
  .burger {
    display: none;
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 10px;
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex-shrink: 0;
    transition: border-color 0.2s;
  }
  .burger:hover { border-color: var(--ink); }
  .burger-line {
    width: 20px;
    height: 2px;
    background: var(--ink);
    border-radius: 2px;
    transition: transform 0.25s ease, opacity 0.25s ease;
  }
  .burger[aria-expanded="true"] .burger-line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .burger[aria-expanded="true"] .burger-line:nth-child(2) {
    opacity: 0;
  }
  .burger[aria-expanded="true"] .burger-line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .mobile-menu {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 200;
  }
  .mobile-menu[hidden] { display: none; }
  .mobile-menu-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(15, 20, 22, 0.45);
    animation: mm-fade 0.2s ease;
  }
  @keyframes mm-fade {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  .mobile-menu-panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(86vw, 380px);
    background: var(--white);
    padding: 24px 24px 32px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
    box-sizing: border-box;
  }
  .mobile-menu-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
  }
  .mobile-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 32px;
  }
  .mobile-nav > a {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--ink);
    text-decoration: none;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
  }
  .mobile-nav > a:last-child { border-bottom: none; }
  .mobile-nav-group {
    display: flex;
    flex-direction: column;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
  }
  .mobile-nav-group-label {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--muted);
    padding: 8px 0;
  }
  .mobile-nav-group a {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    text-decoration: none;
    padding: 8px 0 8px 12px;
    line-height: 1.4;
  }
  .mobile-menu-foot {
    margin-top: auto;
    padding-top: 24px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .mobile-menu-phone {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--ink);
    text-decoration: none;
  }
  .mobile-menu-city {
    font-size: 12px;
    color: var(--muted);
  }
  .mobile-menu-cta {
    margin-top: 12px;
    padding: 14px 20px;
    font-size: 14px;
    width: 100%;
  }

  @media (max-width: 960px) {
    .header-inner { padding: 12px 20px; gap: 12px; }
    .nav, .header-right { display: none; }
    .burger { display: inline-flex; }
    .logo { height: 40px; }
    .logo img { height: 40px; }
  }
  @media (max-width: 480px) {
    .header-inner { padding: 10px 16px; }
    .logo, .logo img { height: 36px; }
  }

  /* ───────── HERO ───────── */
  .hero {
    padding: 72px 0 0;
    position: relative;
  }

  .hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: stretch;
    min-height: 620px;
  }

  .hero-text {
    display: flex;
    flex-direction: column;
    padding-bottom: 72px;
  }

  .eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--muted);
    margin-bottom: 40px;
  }

  .eyebrow-dot {
    width: 6px;
    height: 6px;
    background: var(--teal);
    border-radius: 50%;
    animation: pulse 2.5s ease-in-out infinite;
  }

  @keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
  }

  .hero-h1 {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 800;
    font-size: clamp(36px, 4.4vw, 56px);
    line-height: 1.05;
    letter-spacing: -0.045em;
    color: var(--ink);
    margin-bottom: 32px;
  }

  .hero-h1 .accent-block {
    color: var(--teal-deep);
    display: inline;
  }

  .hero-h1 .hero-h1-sub {
    font-size: 0.5em;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.3;
    display: block;
    margin-top: 18px;
  }

  /* Lead-параграф (между body и заголовком карточки) */
  .hero-sub {
    font-size: 16px;
    line-height: 1.55;
    color: var(--muted);
    max-width: 520px;
    margin-bottom: 20px;
    font-weight: 400;
  }

  .chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
  }

  .chip {
    padding: 10px 16px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 999px;
    font-weight: 400;
    font-size: 14px;
    color: var(--text);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
  }

  .chip:hover { border-color: var(--ink); }

  .chip-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
  }

  .chip:nth-child(1) .chip-dot { background: var(--teal); }
  .chip:nth-child(2) .chip-dot { background: var(--yellow); }
  .chip:nth-child(3) .chip-dot { background: var(--pink); }

  .chip-plus {
    color: var(--muted-soft);
    margin-left: 4px;
    font-weight: 700;
    display: inline-block;
    transition: transform 0.2s ease;
  }

  .chip-license {
    position: relative;
    cursor: pointer;
    font-family: inherit;
    padding: 12px 20px;
    font-size: 15px;
  }

  .chip-license .chip-dot { background: var(--teal); }

  .chip-license.is-open {
    background: var(--ink);
    color: var(--white);
    border-color: var(--ink);
  }

  .chip-license.is-open .chip-plus {
    transform: rotate(45deg);
    color: var(--white);
  }

  .license-popup {
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    min-width: 280px;
    max-width: 340px;
    padding: 16px 18px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(24px) saturate(140%);
    -webkit-backdrop-filter: blur(24px) saturate(140%);
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: var(--text);
    letter-spacing: -0.005em;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
    text-align: left;
  }

  .license-popup::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 24px;
    width: 11px;
    height: 11px;
    background: rgba(255, 255, 255, 0.92);
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    border-left: 1px solid rgba(0, 0, 0, 0.06);
    transform: rotate(45deg);
  }

  .chip-license.is-open .license-popup {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  .hero-ctas {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
  }

  .btn-primary {
    padding: 17px 28px;
    background: var(--teal-light);
    color: var(--ink);
    border: 1px solid var(--teal-light);
    border-radius: 8px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.2;
    letter-spacing: -0.005em;
    cursor: pointer;
    transition: background 0.25s, color 0.25s;
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }

  .btn-primary:hover {
    background: var(--teal-deep);
    color: var(--white);
  }

  .btn-primary-arrow { transition: transform 0.25s; }
  .btn-primary:hover .btn-primary-arrow { transform: translateX(4px); }

  .btn-secondary {
    padding: 17px 28px;
    background: var(--teal-deep);
    color: var(--white);
    border: 1px solid var(--teal-deep);
    border-radius: 8px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.2;
    letter-spacing: -0.005em;
    cursor: pointer;
    transition: background 0.25s, color 0.25s, border-color 0.25s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .btn-secondary:hover {
    background: var(--teal-light);
    color: var(--ink);
    border-color: var(--teal-light);
  }

  /* HERO VISUAL — крупное фото + наложение статы */
  .hero-visual {
    position: relative;
    display: flex;
    flex-direction: column;
  }

  .hero-photo {
    flex: 1;
    position: relative;
    background: linear-gradient(180deg, #D6D3CC 0%, #B8B5AE 100%);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 520px;
  }

  .hero-photo-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
    z-index: 0;
  }

  .photo-tag {
    position: absolute;
    top: 20px;
    left: 20px;
    padding: 8px 14px;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 999px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    font-size: 12px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.005em;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    z-index: 2;
  }

  .photo-tag-dot {
    width: 6px;
    height: 6px;
    background: var(--teal);
    border-radius: 50%;
  }

  /* Две отдельные плашки поверх фото снизу */
  .hero-overlays {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 20px;
    display: flex;
    gap: 12px;
    z-index: 2;
  }

  .overlay-card {
    flex: 1;
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }

  /* HERO RESPONSIVE */
  @media (max-width: 960px) {
    .hero { padding: 50px 0 0; }
    .hero-grid {
      grid-template-columns: 1fr;
      gap: 32px;
      min-height: 0;
    }
    .hero-text { padding-bottom: 0; }
    .eyebrow { margin-bottom: 20px; }
    .hero-h1 { font-size: clamp(30px, 6vw, 44px); margin-bottom: 20px; }
    .hero-sub { margin-bottom: 18px; max-width: 100%; }
    .chips { margin-bottom: 22px; }
    .hero-photo { min-height: 400px; }
    .overlay-num { font-size: 18px !important; }
    .overlay-label { font-size: 12px !important; }
  }
  @media (max-width: 600px) {
    .hero { padding: 42px 0 0; }
    .hero-grid { gap: 24px; }
    .eyebrow { font-size: 11px; margin-bottom: 16px; }
    .hero-h1 { font-size: clamp(26px, 8vw, 36px); margin-bottom: 16px; }
    .hero-h1 .hero-h1-sub { font-size: 0.55em; display: block; margin-top: 8px; }
    .hero-sub { font-size: 14px; }
    .hero-ctas { flex-direction: column; align-items: stretch; gap: 8px; }
    .hero-ctas .btn-primary, .hero-ctas .btn-secondary { width: 100%; justify-content: center; }
    .hero-photo { min-height: 300px; border-radius: 14px; }
    .hero-overlays { left: 12px; right: 12px; bottom: 12px; gap: 8px; }
    .overlay-card { padding: 10px 12px; }
    .overlay-num { font-size: 14px !important; margin-bottom: 4px !important; }
    .overlay-stars { margin-bottom: 4px !important; }
    .overlay-label { font-size: 10px !important; line-height: 1.3 !important; }
  }

  .overlay-num {
    font-weight: 800;
    font-size: 22px;
    color: var(--ink);
    margin-bottom: 10px;
    letter-spacing: -0.035em;
    font-variant-numeric: tabular-nums;
    line-height: 1;
  }

  .overlay-stars {
    font-size: 14px;
    color: #E8B70A;
    margin-bottom: 10px;
    letter-spacing: 2px;
    line-height: 1;
  }

  .overlay-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--text);
  }

  /* ───────── TICKER — живая строка под hero ───────── */
  .ticker {
    margin-top: 80px;
    padding: 28px 0;
    background: var(--teal-deep);
    overflow: hidden;
    position: relative;
  }

  .ticker-track {
    display: flex;
    animation: tickerScroll 40s linear infinite;
    width: max-content;
  }

  .ticker-set {
    display: flex;
    align-items: center;
    gap: 48px;
    padding-right: 48px;
    white-space: nowrap;
    flex-shrink: 0;
  }

  @keyframes tickerScroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }

  .ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 20px;
    color: var(--white);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
  }

  .ticker-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
  }

  .ticker-icon--teal { color: var(--white); }
  .ticker-icon--yellow { color: var(--yellow); }
  .ticker-icon--pink { color: var(--pink); }

  @media (max-width: 960px) {
    .ticker { margin-top: 56px; padding: 20px 0; }
    .ticker-set { gap: 32px; padding-right: 32px; }
    .ticker-item { font-size: 15px; gap: 14px; }
    .ticker-icon { width: 18px; height: 18px; }
  }
  @media (max-width: 600px) {
    .ticker { margin-top: 40px; padding: 16px 0; }
    .ticker-set { gap: 24px; padding-right: 24px; }
    .ticker-item { font-size: 13px; gap: 10px; }
    .ticker-icon { width: 16px; height: 16px; }
  }

  /* ───────── FOR WHOM ───────── */
  .for-whom {
    padding: 120px 0;
    background: var(--white);
  }

  .section-head {
    margin-bottom: 40px;
    max-width: 900px;
  }

  .section-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--muted);
    margin-bottom: 24px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }

  .section-label-dot {
    width: 6px;
    height: 6px;
    background: var(--pink);
    border-radius: 50%;
  }

  .section-h2 {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 800;
    font-size: clamp(36px, 4.4vw, 56px);
    letter-spacing: -0.045em;
    line-height: 1.05;
    color: var(--ink);
  }

  .section-h2 .accent-teal { color: var(--teal-deep); }

  .section-note {
    font-size: 14px;
    color: var(--muted);
    line-height: 1.55;
    padding-bottom: 8px;
    max-width: 380px;
  }

  /* ───────── BENTO-сетка карточек ───────── */
  .cards-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: minmax(220px, auto);
    gap: 16px;
  }

  /* Все карточки — одинаковые прямоугольные блоки, по 3 в ряд */
  .card-1,
  .card-2,
  .card-3,
  .card-4,
  .card-5,
  .card-6 { grid-column: span 4; }

  @media (max-width: 960px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .card-1, .card-2, .card-3, .card-4, .card-5, .card-6 { grid-column: span 1; }
    .card { padding: 22px 22px 20px; }
    .card-top { margin-bottom: 32px; }
  }
  @media (max-width: 520px) {
    .cards-grid { grid-template-columns: 1fr; }
  }

  .card {
    background: #F5F3ED;
    border-radius: 16px;
    padding: 28px 28px 24px;
    transition: all 0.35s;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    cursor: default;
  }

  .card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 48px;
    position: relative;
    z-index: 2;
  }

  .card-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Цветные полупрозрачные плашки иконок — в тон акцента карточки, иконка всегда чёрная */
  .card-icon { color: var(--ink); }
  .card-1 .card-icon { background: rgba(79, 179, 196, 0.22); }
  .card-2 .card-icon { background: rgba(255, 217, 61, 0.35); }
  .card-3 .card-icon { background: rgba(248, 180, 196, 0.35); }
  .card-4 .card-icon { background: rgba(248, 180, 196, 0.35); }
  .card-5 .card-icon { background: rgba(79, 179, 196, 0.22); }
  .card-6 .card-icon { background: rgba(255, 217, 61, 0.35); }

  .card-icon svg {
    width: 22px;
    height: 22px;
  }

  .card-num {
    font-size: 12px;
    font-weight: 700;
    color: var(--muted-soft);
    letter-spacing: 0.14em;
    font-variant-numeric: tabular-nums;
    padding-top: 14px;
  }

  /* Геометрические фигуры-акценты, разные для каждой карточки */
  .card-shape {
    position: absolute;
    pointer-events: none;
    transition: transform 0.5s ease;
    z-index: 1;
  }

  .card:hover .card-shape {
    transform: scale(1.08) rotate(4deg);
  }

  /* Карточка 1 — большая, teal круг */
  .card-1 {
    background: var(--bg-teal-pastel);
  }
  .card-1 .card-shape {
    right: -60px;
    bottom: -80px;
    width: 260px;
    height: 260px;
    background: var(--teal);
    opacity: 0.35;
    border-radius: 50%;
  }

  /* Карточка 2 — жёлтая арка (полукруг сверху) */
  .card-2 {
    background: var(--bg-yellow-pastel);
  }
  .card-2 .card-shape {
    right: -40px;
    top: -80px;
    width: 180px;
    height: 180px;
    background: var(--yellow);
    opacity: 0.55;
    border-radius: 50%;
  }

  /* Карточка 3 — большая, розовый квадрат со скругл. углами повёрнутый */
  .card-3 {
    background: var(--bg-pink-pastel);
  }
  .card-3 .card-shape {
    right: 20px;
    bottom: -60px;
    width: 200px;
    height: 200px;
    background: var(--pink);
    opacity: 0.5;
    border-radius: 40px;
    transform: rotate(18deg);
  }
  .card-3:hover .card-shape {
    transform: rotate(26deg) scale(1.05);
  }

  /* Карточка 4 — розовый круг в углу */
  .card-4 {
    background: var(--bg-pink-pastel);
  }
  .card-4 .card-shape {
    left: -50px;
    top: -50px;
    width: 160px;
    height: 160px;
    background: var(--pink);
    opacity: 0.5;
    border-radius: 50%;
  }

  /* Карточка 5 — teal полукруг снизу */
  .card-5 {
    background: var(--bg-teal-pastel);
  }
  .card-5 .card-shape {
    left: 50%;
    bottom: -100px;
    transform: translateX(-50%);
    width: 220px;
    height: 220px;
    background: var(--teal);
    opacity: 0.28;
    border-radius: 50%;
  }
  .card-5:hover .card-shape {
    transform: translateX(-50%) scale(1.1);
  }

  /* Карточка 6 — жёлтый квадрат повёрнутый */
  .card-6 {
    background: var(--bg-yellow-pastel);
  }
  .card-6 .card-shape {
    right: -30px;
    bottom: -30px;
    width: 160px;
    height: 160px;
    background: var(--yellow);
    opacity: 0.6;
    border-radius: 36px;
    transform: rotate(-12deg);
  }

  .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.08);
  }

  .card-content {
    position: relative;
    z-index: 2;
  }

  .card-title {
    font-weight: 800;
    font-size: 18px;
    line-height: 1.3;
    color: var(--ink);
    margin-bottom: 12px;
    letter-spacing: -0.025em;
  }

  .card-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
  }

  /* ───────── HOW WE WORK ───────── */
  /* padding-top: 0, потому что .for-whom выше уже даёт 120px снизу (одинаковый белый фон) */
  .how {
    padding: 0 0 120px;
    background: var(--white);
  }

  /* margin-bottom наследуется из .section-head = 40px (canonical) */
  .how .section-label-dot.how-dot { background: var(--teal); }

  .diag-block {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    background: var(--bg-teal-pastel);
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 16px;
  }

  .diag-photo {
    position: relative;
    min-height: 320px;
    overflow: hidden;
  }
  .diag-photo-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    inset: 0;
  }

  .diag-content {
    padding: 28px 28px 28px;
    display: flex;
    flex-direction: column;
  }

  /* Унифицированный «бейдж» с цифрой шага — как .photo-tag в hero */
  .step-num {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 14px;
    background: var(--white);
    border-radius: 999px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: var(--ink);
    margin-bottom: 16px;
    font-variant-numeric: tabular-nums;
  }
  .step-num-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
  }
  /* Цвет точки = тон карточки */
  .diag-block .step-num-dot { background: var(--teal); }
  .step-card .step-num-dot   { background: var(--pink); }

  .step-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 18px;
    color: var(--ink);
    letter-spacing: -0.025em;
    line-height: 1.3;
    margin: 0 0 12px;
  }
  /* Большая карточка диага (01) — крупнее заголовок */
  .diag-content .step-title {
    font-size: 22px;
    letter-spacing: -0.02em;
  }

  .step-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
    margin: 0;
  }

  .diag-content .step-desc {
    margin-bottom: 20px;
    max-width: 480px;
  }

  .diag-cta {
    align-self: flex-start;
    margin-top: auto;
  }

  .steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }

  .step-card {
    background: var(--bg-pink-pastel);
    border-radius: 20px;
    padding: 32px 28px 36px;
    display: flex;
    flex-direction: column;
  }

  @media (max-width: 900px) {
    .diag-block { grid-template-columns: 1fr; }
    .diag-photo { min-height: 220px; }
    .diag-content { padding: 32px 24px 28px; }
    .steps-grid { grid-template-columns: 1fr; gap: 12px; }
  }
  @media (max-width: 600px) {
    .diag-photo { min-height: 180px; }
    .diag-content { padding: 24px 20px 22px; }
    .diag-content .step-title { font-size: 18px; }
    .step-card { padding: 24px 20px 28px; }
    .step-title { font-size: 16px; }
  }

  /* ───────── DIRECTIONS adaptive ───────── */

  /* ───────── DIRECTIONS («Наши направления») ───────── */
  .dirs {
    padding: 0 0 120px;
    background: var(--white);
  }
  /* margin-bottom наследуется из .section-head = 40px (canonical) */
  .dirs .section-label-dot.dirs-dot { background: var(--pink); }

  /* Featured «Диагностика» */
  .dirs-featured {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    background: var(--teal-deep);
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 32px;
  }
  .dirs-featured-photo {
    position: relative;
    min-height: 320px;
    overflow: hidden;
  }
  .dirs-featured-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
  }
  .dirs-featured-body {
    padding: 36px 36px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    overflow: hidden;
  }
  .dirs-featured-body > *:not(.dirs-featured-shape) { position: relative; z-index: 1; }

  /* Декоративная фигура — как .card-1 .card-shape в блоке 2 */
  .dirs-featured-shape {
    position: absolute;
    pointer-events: none;
    right: -80px;
    bottom: -100px;
    width: 280px;
    height: 280px;
    background: var(--teal-light);
    opacity: 0.22;
    border-radius: 50%;
    z-index: 0;
  }
  .dirs-featured-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: var(--white);
    margin: 0 0 12px;
  }
  .dirs-featured-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--teal-light);
    margin: 0 0 24px;
    max-width: 520px;
  }
  .dirs-featured-cta {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
  }

  /* Возраст-плашки на фото (.photo-tag) — единый стекло-стиль с hero.
     Уменьшаем отступы только для direction-карточек, чтобы плашка не казалась огромной. */
  .dir-card-photo .photo-tag,
  .dirs-featured-photo .photo-tag {
    top: 14px;
    left: 14px;
    padding: 6px 12px;
  }

  /* Inline-параграф между featured и фильтрами */
  /* Lead-параграф (тот же размер, что .hero-sub) */
  .dirs-intro {
    font-size: 16px;
    line-height: 1.55;
    color: var(--muted);
    font-weight: 400;
    margin: 0 0 24px;
    max-width: 720px;
  }

  /* Фильтры */
  .dirs-filters {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 32px;
  }
  .dirs-filter-row { display: flex; }
  .dirs-filter-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .dirs-tag {
    padding: 9px 16px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 999px;
    font-family: inherit;
    font-weight: 700;
    font-size: 14px;
    color: var(--text);
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
  }
  .dirs-tag:hover { border-color: var(--ink); }
  .dirs-tag.is-active {
    background: var(--ink);
    color: var(--white);
    border-color: var(--ink);
  }

  /* Сетка карточек */
  .dirs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  .dir-card {
    background: var(--bg-teal-pastel);
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  .dir-card[hidden] { display: none; }

  .dir-card-photo {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--bg-teal-pastel);
  }
  .dir-card-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
  }

  .dir-card-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  .dir-card-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.025em;
    color: var(--ink);
    margin: 0 0 12px;
  }
  .dir-card-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
    margin: 0 0 20px;
    flex: 1;
  }
  .dir-card-cta {
    margin-top: auto;
  }

  /* Featured-карточка (тёмно-синий фон): кнопки в стиле hero, но с локальными hover'ами */
  /* Светло-голубая «Записаться» — на hover становится белой с тёмным текстом */
  .dirs-featured .btn-primary:hover {
    background: var(--white);
    color: var(--ink);
  }

  @media (max-width: 960px) {
    .dirs-featured { grid-template-columns: 1fr; }
    .dirs-featured-photo { min-height: 220px; aspect-ratio: 16/10; }
    .dirs-featured-body { padding: 28px 24px; }
    .dirs-featured-title { font-size: 20px; }
    .dirs-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .dirs-intro { font-size: 14px; }
  }
  @media (max-width: 600px) {
    .dirs-featured-body { padding: 24px 20px; }
    .dirs-featured-title { font-size: 18px; }
    .dirs-featured-cta { flex-direction: column; align-items: stretch; }
    .dirs-featured-cta .btn-primary, .dirs-featured-cta .btn-secondary { width: 100%; justify-content: center; }
    .dirs-grid { grid-template-columns: 1fr; }
    .dir-card-body { padding: 20px; }
    .dirs-tag { font-size: 13px; padding: 8px 14px; }
  }

  /* Белая «Подробнее» — текст ink, hover остаётся как у обычной btn-primary (teal-light + ink) */
  .dirs-featured .dirs-featured-more {
    background: var(--white);
    color: var(--ink);
    border-color: var(--white);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .dirs-featured .dirs-featured-more:hover {
    background: var(--teal-light);
    color: var(--ink);
    border-color: var(--teal-light);
  }

  /* «Подробнее» в маленькой карточке — full-width btn-secondary, чуть меньше высотой */
  .dir-card-btn {
    display: flex;
    width: 100%;
    padding: 12px 16px;
    font-size: 14px;
    text-decoration: none;
    justify-content: center;
  }

  .dirs-empty {
    padding: 60px 20px;
    text-align: center;
    color: var(--muted);
    border: 1px dashed var(--line);
    border-radius: 16px;
    font-size: 14px;
    line-height: 1.6;
  }

  @media (max-width: 1100px) {
    .dirs-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 900px) {
    .dirs-featured { grid-template-columns: 1fr; }
    .dirs-featured-photo { min-height: 220px; }
    .dirs-featured-body { padding: 28px 24px; }
  }
  @media (max-width: 600px) {
    .dirs-grid { grid-template-columns: 1fr; }
  }

  /* ───────── ABOUT («О центре») ───────── */
  .about {
    padding: 0 0 120px;
    background: var(--white);
  }
  .about-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: stretch;
  }
  .about-photo {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    min-height: 480px;
  }
  .about-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
  }
  /* Стекло — единый стиль плашек на фото (как .overlay-card / .photo-tag) */
  .about-mission {
    position: absolute;
    left: 16px; right: 16px; bottom: 16px;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    color: var(--ink);
    padding: 16px 20px;
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 700;
    z-index: 2;
  }
  .about-content {
    display: flex;
    flex-direction: column;
  }
  .about-content .section-label { margin-top: 8px; }
  .about-content .section-label-dot.about-dot { background: var(--teal-deep); }
  .about-content .section-h2 { margin-bottom: 16px; }
  .about-lead {
    font-size: 18px;
    line-height: 1.3;
    color: var(--ink);
    font-weight: 800;
    letter-spacing: -0.025em;
    max-width: 540px;
    margin-bottom: 36px;
  }
  .about-values {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .about-value-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
  }
  /* Иконки — паттерн как .card-icon в блоке 2: цветной пастельный фон + ink-обводка */
  .about-value-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
    flex-shrink: 0;
  }
  .about-value-icon svg {
    width: 22px; height: 22px;
  }
  .about-value-icon-teal { background: var(--bg-teal-pastel); }
  .about-value-icon-yellow { background: var(--bg-yellow-pastel); }
  .about-value-icon-pink { background: var(--bg-pink-pastel); }

  .about-value-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.025em;
    color: var(--ink);
    margin: 0;
  }
  .about-value-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
  }

  /* ───────── PROMO («Акции и спецпредложения») ───────── */
  .promo {
    padding: 0 0 120px;
    background: var(--white);
  }
  .promo .section-label-dot.promo-dot { background: var(--yellow); }

  /* 3-колоночная сетка: card-stack | photo (full height) | card-stack */
  .promo-grid {
    display: grid;
    grid-template-columns: 1fr 1.1fr 1fr;
    gap: 16px;
    align-items: stretch;
  }
  .promo-col {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .promo-photo {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    min-height: 100%;
  }
  .promo-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
  }

  .promo-card {
    background: var(--bg-yellow-pastel);
    border-radius: 20px;
    padding: 28px 28px 28px;
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  .promo-card > *:not(.promo-shape) { position: relative; z-index: 2; }
  .promo-card-license { background: var(--bg-pink-pastel); }

  /* Фигуры в углах — паттерн как .card-shape в блоке 2 */
  .promo-shape {
    position: absolute;
    pointer-events: none;
    z-index: 1;
  }
  /* Card 1 (yellow): жёлтый круг справа снизу */
  .promo-card-1 .promo-shape {
    right: -50px; bottom: -60px;
    width: 180px; height: 180px;
    background: var(--yellow);
    opacity: 0.5;
    border-radius: 50%;
  }
  /* Card 2 (yellow): повёрнутый квадрат сверху-справа */
  .promo-card-2 .promo-shape {
    right: -30px; top: -30px;
    width: 140px; height: 140px;
    background: var(--yellow);
    opacity: 0.55;
    border-radius: 36px;
    transform: rotate(-15deg);
  }
  /* Card 3 (pink): розовая арка/полукруг снизу */
  .promo-card-3 .promo-shape {
    left: 50%; bottom: -90px;
    transform: translateX(-50%);
    width: 200px; height: 200px;
    background: var(--pink);
    opacity: 0.5;
    border-radius: 50%;
  }
  /* Card 4 (pink): розовый квадрат повёрнутый */
  .promo-card-4 .promo-shape {
    right: -20px; bottom: -30px;
    width: 150px; height: 150px;
    background: var(--pink);
    opacity: 0.55;
    border-radius: 40px;
    transform: rotate(20deg);
  }

  /* Все CTA в promo — единая mini-кнопка как .cta-btn в хедере */
  .promo-mini-btn {
    align-self: flex-start;
    margin-top: auto;
  }
  .promo-card-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.025em;
    color: var(--ink);
    margin-bottom: 8px;
  }
  .promo-card-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--muted);
    margin-bottom: 18px;
    flex: 1;
  }
  .promo-card-desc:last-child { margin-bottom: 0; }
  .promo-btn {
    align-self: flex-start;
  }


  @media (max-width: 1100px) {
    .promo-grid { grid-template-columns: 1fr 1fr; }
    .promo-photo { grid-column: 1 / -1; min-height: 240px; order: -1; }
  }
  @media (max-width: 960px) {
    .about-grid {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    /* Перетасовка порядка: eyebrow → h2 → миссия → фото → ценности */
    .about-content { display: contents; }
    .about-content .section-label { order: 1; margin: 0; }
    .about-content .section-h2   { order: 2; margin: 0; }
    .about-lead                  { order: 3; margin: 0; }
    .about-photo                 { order: 4; min-height: 320px; margin: 8px 0 0; }
    .about-values                { order: 5; margin: 8px 0 0; }
    .promo-grid { grid-template-columns: 1fr; gap: 12px; }
    .promo-card { padding: 22px 20px 26px; flex: 0 0 auto; }
    .promo-mini-btn { margin-top: 12px; align-self: flex-start; }
  }
  @media (max-width: 600px) {
    .about-photo { min-height: 260px; }
    .about-mission { font-size: 12px; padding: 12px 16px; }
    .about-values { gap: 18px; }
    .about-value-title { font-size: 16px; }
  }

  /* ───────── TEAM («Дипломированные специалисты») ───────── */
  .team {
    padding: 0 0 120px;
    background: var(--white);
  }
  .team-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 40px;
  }
  .team-head .section-label-dot.team-dot { background: var(--pink); }
  .team-head .section-h2 { margin-bottom: 12px; }
  .team-lead {
    font-size: 16px;
    line-height: 1.55;
    color: var(--muted);
    max-width: 760px;
    margin: 0;
  }
  .team-nav {
    display: flex;
    gap: 10px;
  }
  .team-arrow {
    width: 44px; height: 44px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
  }
  .team-arrow:hover {
    background: var(--ink);
    color: var(--white);
    border-color: var(--ink);
  }

  .team-viewport {
    overflow: hidden;
  }
  .team-track {
    display: flex;
    gap: 20px;
    transition: transform 0.45s ease;
    will-change: transform;
  }
  .team-card {
    flex: 0 0 calc((100% - 60px) / 4); /* 4 в ряд на десктопе, gap 20 */
    min-width: 0;
    display: flex;
    flex-direction: column;
  }
  .team-photo {
    aspect-ratio: 3 / 4;
    overflow: hidden;
    border-radius: 16px;
    margin-bottom: 16px;
    background: var(--bg-teal-pastel);
    position: relative;
  }
  .team-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
  }
  .team-name {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.025em;
    color: var(--ink);
    margin: 0 0 10px;
    min-height: calc(1.25em * 2);
  }
  .team-name span { display: block; }
  /* Плашка стажа на фото — стекло (как .photo-tag в hero) */
  .team-tag {
    position: absolute;
    bottom: 14px;
    left: 14px;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.005em;
    z-index: 2;
  }
  .team-role {
    font-size: 14px;
    line-height: 1.5;
    color: var(--muted);
    margin: 0 0 16px;
    flex: 1;
  }
  .team-btn {
    align-self: stretch;
    text-align: center;
    width: 100%;
  }

  @media (max-width: 1100px) {
    .team-card { flex-basis: calc((100% - 40px) / 3); }
  }
  @media (max-width: 800px) {
    .team-card { flex-basis: calc((100% - 20px) / 2); }
    .team-photo { aspect-ratio: 1 / 1; }
  }
  @media (max-width: 500px) {
    .team-card { flex-basis: 100%; }
    .team-photo { aspect-ratio: 4 / 3; }
  }

  /* ───────── WHY («Почему родители выбирают») ───────── */
  .why {
    padding: 0 0 120px;
    background: var(--white);
  }
  .why .section-label-dot.why-dot { background: var(--teal-deep); }
  .why-lead {
    font-size: 16px;
    line-height: 1.55;
    color: var(--muted);
    max-width: 720px;
    margin: 12px 0 0;
    font-weight: 400;
  }
  .why-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }
  .why-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
    min-height: 200px;
    padding: 28px 24px;
    border: none;
    border-radius: 20px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: transform 0.25s ease;
    position: relative;
    overflow: hidden;
  }
  .why-card > *:not(.why-shape) { position: relative; z-index: 2; }
  .why-card:hover { transform: translateY(-4px); }

  /* Декор-фигуры — разные позиции/формы для каждой, разные hover-движения */
  .why-shape {
    position: absolute;
    pointer-events: none;
    z-index: 1;
    transition: transform 0.5s ease;
  }
  /* 1 (teal): круг сверху-справа */
  .why-card-1 .why-shape {
    top: -50px; right: -40px;
    width: 160px; height: 160px;
    background: var(--teal);
    opacity: 0.32;
    border-radius: 50%;
  }
  .why-card-1:hover .why-shape { transform: translateY(10px) scale(1.1); }

  /* 2 (yellow): квадрат повёрнутый снизу-слева */
  .why-card-2 .why-shape {
    bottom: -30px; left: -30px;
    width: 130px; height: 130px;
    background: var(--yellow);
    opacity: 0.55;
    border-radius: 32px;
    transform: rotate(20deg);
  }
  .why-card-2:hover .why-shape { transform: rotate(35deg) scale(1.08); }

  /* 3 (pink): большой круг по центру справа */
  .why-card-3 .why-shape {
    top: 40%; right: -80px;
    transform: translateY(-50%);
    width: 180px; height: 180px;
    background: var(--pink);
    opacity: 0.5;
    border-radius: 50%;
  }
  .why-card-3:hover .why-shape { transform: translateY(-50%) translateX(-10px) scale(1.1); }

  /* 4 (pink): маленький круг сверху-слева */
  .why-card-4 .why-shape {
    top: -40px; left: -40px;
    width: 120px; height: 120px;
    background: var(--pink);
    opacity: 0.55;
    border-radius: 50%;
  }
  .why-card-4:hover .why-shape { transform: translateX(15px) translateY(15px) scale(1.15); }

  /* 5 (teal): полоса-капля справа сверху, повёрнутая */
  .why-card-5 .why-shape {
    top: -20px; right: -40px;
    width: 140px; height: 140px;
    background: var(--teal);
    opacity: 0.3;
    border-radius: 60% 40% 50% 50%;
    transform: rotate(-15deg);
  }
  .why-card-5:hover .why-shape { transform: rotate(15deg) scale(1.1); }

  /* 6 (yellow): два маленьких круга в углу снизу-справа */
  .why-card-6 .why-shape {
    bottom: -20px; right: -20px;
    width: 100px; height: 100px;
    background: var(--yellow);
    opacity: 0.55;
    border-radius: 50%;
  }
  .why-card-6 .why-shape::after {
    content: '';
    position: absolute;
    bottom: 70px; right: -30px;
    width: 50px; height: 50px;
    background: var(--yellow);
    opacity: 0.7;
    border-radius: 50%;
  }
  .why-card-6:hover .why-shape { transform: scale(1.15) translate(-8px, -8px); }
  /* Цвета карточек — паттерн как в блоке «Для кого» (teal/yellow/pink) */
  .why-card-1, .why-card-5 { background: var(--bg-teal-pastel); }
  .why-card-2, .why-card-6 { background: var(--bg-yellow-pastel); }
  .why-card-3, .why-card-4 { background: var(--bg-pink-pastel); }

  .why-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--white);
    border: 1px solid var(--line);
    color: var(--muted-soft);
    flex-shrink: 0;
  }
  .why-avatar svg {
    width: 28px;
    height: 28px;
  }
  .why-avatar--photo {
    overflow: hidden;
    padding: 0;
    background: var(--bg-teal-pastel);
    border-color: var(--white);
  }
  .why-avatar--photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  @media (min-width: 961px) {
    .why-avatar { width: 50px; height: 50px; }
  }

  .why-card-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.45;
    letter-spacing: -0.015em;
    flex: 1;
  }

  /* Кнопка «Читать» — мини, как .cta-btn в шапке/promo */
  .why-card-cta {
    display: inline-flex;
    align-items: center;
    padding: 10px 16px;
    background: var(--teal-deep);
    color: var(--white);
    border-radius: 6px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.005em;
    transition: background 0.2s, color 0.2s;
    margin-top: auto;
  }
  .why-card:hover .why-card-cta {
    background: var(--teal-light);
    color: var(--ink);
  }

  @media (max-width: 900px) {
    .why-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 520px) {
    .why-grid { grid-template-columns: 1fr; }
  }

  /* ───── WHY MODAL (отзыв) ───── */
  .v2-modal-box-why {
    max-width: 640px;
    padding: 36px 36px 36px;
  }
  .why-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
  }
  .why-nav-arrow {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
  }
  .why-nav-arrow:hover {
    background: var(--ink);
    color: var(--white);
    border-color: var(--ink);
  }
  .why-nav-counter {
    font-size: 12px;
    font-weight: 700;
    color: var(--muted);
    letter-spacing: 0.05em;
  }
  .why-modal-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0 0 14px;
  }
  .why-quote-mark {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 56px;
    line-height: 0.5;
    color: var(--teal-light);
    font-weight: 800;
    margin-bottom: 4px;
  }
  .why-modal-text {
    font-size: 15px;
    line-height: 1.65;
    color: var(--text);
    margin: 0;
  }

  /* ───────── RESULTS («Радуемся результатам») ───────── */
  .results {
    padding: 0 0 120px;
    background: var(--white);
  }
  .results-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 40px;
  }
  .results-head .section-label-dot.results-dot { background: var(--pink); }
  .results-viewport { overflow: hidden; }
  .results-track {
    display: flex;
    gap: 16px;
    transition: transform 0.45s ease;
    will-change: transform;
  }
  .results-card {
    flex: 0 0 calc((100% - 48px) / 4);
    min-width: 0;
  }
  .results-video,
  .results-iframe {
    aspect-ratio: 9 / 16;
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--bg-teal-pastel) 0%, var(--teal-light) 100%);
    position: relative;
    border: none;
    display: block;
  }
  .results-iframe { background: var(--ink); }

  /* Превью-фасад: лёгкая заглушка вместо тяжёлого VK-iframe.
     По клику JS подменяет на iframe, чтобы не грузить плеер сразу.
     Градиент и кружки задаются классом-вариантом (v1…v10). */
  .results-facade {
    aspect-ratio: 9 / 16;
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    border: none;
    display: block;
    cursor: pointer;
    padding: 0;
    transition: transform 0.25s ease;
  }
  .results-facade:hover { transform: translateY(-2px); }
  .results-facade:hover .results-play { transform: translate(-50%, -50%) scale(1.06); }
  .results-facade-shape {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
  }
  .results-facade .results-play { transition: transform 0.25s ease; }

  /* Заголовок-подпись внизу превью — мягкая белая плашка с blur */
  .results-facade-title {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 10px 12px 11px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    color: var(--ink);
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: -0.015em;
    text-align: left;
    z-index: 2;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* v1 — прохладный teal, розовый сверху-справа, жёлтый снизу-слева */
  .results-facade--v1 { background: linear-gradient(135deg, var(--bg-teal-pastel) 0%, var(--teal-light) 100%); }
  .results-facade--v1 .results-facade-shape-1 { top: -28px; right: -28px; width: 110px; height: 110px; background: var(--pink); opacity: 0.55; }
  .results-facade--v1 .results-facade-shape-2 { bottom: -34px; left: -22px; width: 90px; height: 90px; background: var(--yellow); opacity: 0.5; }

  /* v2 — тёплый жёлтый, teal сверху-слева, розовый снизу-справа */
  .results-facade--v2 { background: linear-gradient(135deg, var(--bg-yellow-pastel) 0%, var(--yellow) 100%); }
  .results-facade--v2 .results-facade-shape-1 { top: -32px; left: -32px; width: 105px; height: 105px; background: var(--teal-light); opacity: 0.6; }
  .results-facade--v2 .results-facade-shape-2 { bottom: -28px; right: -22px; width: 95px; height: 95px; background: var(--pink); opacity: 0.55; }

  /* v3 — мягкий розовый, жёлтый сверху-справа, teal снизу-слева */
  .results-facade--v3 { background: linear-gradient(215deg, var(--bg-pink-pastel) 0%, var(--pink) 100%); }
  .results-facade--v3 .results-facade-shape-1 { top: -22px; right: -32px; width: 95px; height: 95px; background: var(--yellow); opacity: 0.55; }
  .results-facade--v3 .results-facade-shape-2 { bottom: -36px; left: -28px; width: 110px; height: 110px; background: var(--teal-light); opacity: 0.6; }

  /* v4 — нежный teal-soft, большой жёлтый снизу-справа, маленький розовый сверху-слева */
  .results-facade--v4 { background: linear-gradient(45deg, var(--teal-soft) 0%, var(--bg-teal-pastel) 100%); }
  .results-facade--v4 .results-facade-shape-1 { bottom: -34px; right: -34px; width: 125px; height: 125px; background: var(--yellow); opacity: 0.5; }
  .results-facade--v4 .results-facade-shape-2 { top: -22px; left: -18px; width: 75px; height: 75px; background: var(--pink); opacity: 0.6; }

  /* v5 — пастельный микс жёлтый→розовый по диагонали */
  .results-facade--v5 { background: linear-gradient(135deg, var(--bg-yellow-pastel) 0%, var(--bg-pink-pastel) 100%); }
  .results-facade--v5 .results-facade-shape-1 { top: -28px; right: -22px; width: 90px; height: 90px; background: var(--teal-light); opacity: 0.65; }
  .results-facade--v5 .results-facade-shape-2 { bottom: -22px; left: -22px; width: 70px; height: 70px; background: var(--pink); opacity: 0.6; }

  /* v6 — розовый→teal микс, жёлтый сверху-слева, teal снизу-справа */
  .results-facade--v6 { background: linear-gradient(60deg, var(--bg-pink-pastel) 0%, var(--bg-teal-pastel) 100%); }
  .results-facade--v6 .results-facade-shape-1 { top: -28px; left: -28px; width: 100px; height: 100px; background: var(--yellow); opacity: 0.55; }
  .results-facade--v6 .results-facade-shape-2 { bottom: -28px; right: -28px; width: 95px; height: 95px; background: var(--teal-light); opacity: 0.6; }

  /* v7 — teal-light→teal-pastel (обратный), маленький розовый сверху-справа, большой жёлтый снизу-слева */
  .results-facade--v7 { background: linear-gradient(315deg, var(--teal-light) 0%, var(--bg-teal-pastel) 100%); }
  .results-facade--v7 .results-facade-shape-1 { top: -20px; right: -20px; width: 75px; height: 75px; background: var(--pink); opacity: 0.6; }
  .results-facade--v7 .results-facade-shape-2 { bottom: -38px; left: -34px; width: 120px; height: 120px; background: var(--yellow); opacity: 0.5; }

  /* v8 — розовый→teal-soft, жёлтый сверху-справа, teal-light снизу-слева */
  .results-facade--v8 { background: linear-gradient(200deg, var(--bg-pink-pastel) 0%, var(--teal-soft) 100%); }
  .results-facade--v8 .results-facade-shape-1 { top: -30px; right: -28px; width: 105px; height: 105px; background: var(--yellow); opacity: 0.55; }
  .results-facade--v8 .results-facade-shape-2 { bottom: -26px; left: -22px; width: 85px; height: 85px; background: var(--teal-light); opacity: 0.65; }

  /* v9 — teal-pastel→жёлтый-pastel, розовый сверху-слева, teal-light снизу-справа */
  .results-facade--v9 { background: linear-gradient(100deg, var(--bg-teal-pastel) 0%, var(--bg-yellow-pastel) 100%); }
  .results-facade--v9 .results-facade-shape-1 { top: -28px; left: -22px; width: 90px; height: 90px; background: var(--pink); opacity: 0.6; }
  .results-facade--v9 .results-facade-shape-2 { bottom: -30px; right: -28px; width: 100px; height: 100px; background: var(--teal-light); opacity: 0.55; }

  /* v10 — teal-soft→pink-pastel, большой жёлтый сверху-справа, маленький розовый снизу-слева */
  .results-facade--v10 { background: linear-gradient(165deg, var(--teal-soft) 0%, var(--bg-pink-pastel) 100%); }
  .results-facade--v10 .results-facade-shape-1 { top: -36px; right: -30px; width: 120px; height: 120px; background: var(--yellow); opacity: 0.5; }
  .results-facade--v10 .results-facade-shape-2 { bottom: -22px; left: -22px; width: 70px; height: 70px; background: var(--pink); opacity: 0.6; }

  .results-play {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 56px; height: 56px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }
  .results-play svg { margin-left: 3px; }
  .results-label {
    position: absolute;
    bottom: 12px; left: 12px;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    color: var(--ink);
    border-radius: 999px;
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 700;
    z-index: 2;
  }

  @media (max-width: 1100px) {
    .results-card { flex-basis: calc((100% - 32px) / 3); }
  }
  @media (max-width: 800px) {
    .results-card { flex-basis: calc((100% - 16px) / 2); }
  }
  @media (max-width: 500px) {
    .results-card { flex-basis: 80%; }
  }

  /* ───────── REVIEWS («Что говорят родители») ───────── */
  .reviews {
    padding: 0 0 120px;
    background: var(--white);
  }
  .reviews .section-label-dot.reviews-dot { background: var(--yellow); }
  /* Сетка: левая колонка = яндекс + кнопки (2 ряда), правая = фото на 2 ряда */
  .reviews-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 16px;
    align-items: stretch;
  }
  .reviews-yandex {
    grid-column: 1; grid-row: 1;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 5 / 4;
    position: relative;
    background: var(--bg-teal-pastel);
  }
  .reviews-photo {
    grid-column: 2; grid-row: 1 / 3;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    background: var(--bg-teal-pastel);
    min-height: 100%;
  }
  .reviews-iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    position: absolute; inset: 0;
  }
  .reviews-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    object-position: center top;
    position: absolute; inset: 0;
  }

  /* Соц-кнопки «Больше отзывов» — снизу слева под яндекс-виджетом */
  .reviews-links {
    grid-column: 1; grid-row: 2;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
  }
  .reviews-links-label {
    font-size: 14px;
    font-weight: 700;
    color: var(--muted);
    margin-right: 4px;
  }
  .reviews-social {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: var(--bg-teal-pastel);
    color: var(--ink);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.005em;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
  }
  .reviews-social svg,
  .reviews-social .reviews-social-img {
    width: 18px; height: 18px;
    flex-shrink: 0;
  }
  .reviews-social .reviews-social-img {
    object-fit: contain;
    pointer-events: none;
  }
  .reviews-social:hover {
    background: var(--teal-deep);
    color: var(--white);
  }

  @media (max-width: 780px) {
    .reviews-layout {
      grid-template-columns: 1fr;
      grid-template-rows: auto auto;
    }
    .reviews-yandex {
      grid-column: 1; grid-row: 1;
      aspect-ratio: auto;
      height: 450px;
    }
    .reviews-photo { display: none; }
    .reviews-links {
      grid-column: 1; grid-row: 2;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }
    .reviews-links-label {
      flex: 0 0 100%;
      margin-right: 0;
      margin-bottom: 4px;
    }
  }

  /* ───────── ORGINFO («Сведения об образовательной организации») ───────── */
  .orginfo {
    padding: 0 0 120px;
    background: var(--white);
  }
  .orginfo-card {
    position: relative;
    overflow: hidden;
    background: var(--bg-teal-pastel);
    color: var(--ink);
    border-radius: 24px;
    padding: 56px 56px 56px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .orginfo-card > *:not(.orginfo-shape) { position: relative; z-index: 2; }
  .orginfo-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0;
  }
  .orginfo-desc {
    font-size: 16px;
    line-height: 1.55;
    color: var(--muted);
    margin: 0;
    max-width: 1000px;
  }
  .orginfo-cta { margin-top: 16px; }

  /* Декор-фигуры — насыщенный teal, ярче чем в блоке 2 */
  .orginfo-shape { position: absolute; pointer-events: none; z-index: 1; }
  .orginfo-shape-1 {
    right: -60px; top: -80px;
    width: 240px; height: 240px;
    background: var(--teal);
    opacity: 0.45;
    border-radius: 50%;
  }
  .orginfo-shape-2 {
    right: 22%; bottom: -90px;
    width: 160px; height: 160px;
    background: var(--teal);
    opacity: 0.5;
    border-radius: 40px;
    transform: rotate(20deg);
  }

  @media (max-width: 760px) {
    .orginfo-card { padding: 36px 28px; gap: 28px; }
    .orginfo-title { font-size: 22px; }
  }

  /* ───── ORGINFO MODAL ───── */
  .v2-modal-box-orginfo {
    max-width: 640px;
    padding: 36px 36px 28px;
  }
  .oi-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0 0 20px;
    padding-right: 32px;
  }
  .oi-list {
    list-style: none;
    padding: 0; margin: 0;
  }
  .oi-list li:not(:last-child) { border-bottom: 1px solid var(--line); }
  .oi-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--text);
    text-decoration: none;
    transition: color 0.15s;
  }
  .oi-item:hover { color: var(--teal-deep); }
  .oi-arrow {
    flex-shrink: 0;
    color: var(--muted-soft);
    display: flex;
    align-items: center;
  }
  .oi-item:hover .oi-arrow { color: var(--teal-deep); }

  /* ───────── FAQ («Ответы на популярные вопросы») ───────── */
  .faq {
    padding: 0 0 120px;
    background: var(--white);
  }
  .faq .section-label-dot.faq-dot { background: var(--teal-deep); }
  .faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .faq-card {
    background: var(--bg-teal-pastel);
    border-radius: 16px;
    padding: 0 24px;
    transition: background 0.2s;
  }
  .faq-card[open] { background: var(--teal-light); }
  .faq-card summary { list-style: none; }
  .faq-card summary::-webkit-details-marker { display: none; }
  .faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 0;
    cursor: pointer;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1.3;
    letter-spacing: -0.025em;
  }
  .faq-plus {
    flex-shrink: 0;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--white);
    color: var(--ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    transition: transform 0.25s ease, background 0.2s, color 0.2s;
  }
  .faq-card:hover .faq-plus {
    background: var(--ink);
    color: var(--white);
  }
  .faq-card[open] .faq-plus {
    transform: rotate(45deg);
    background: var(--ink);
    color: var(--white);
  }
  .faq-card[open]:hover .faq-plus {
    background: var(--teal-deep);
  }
  .faq-a {
    font-size: 14px;
    line-height: 1.65;
    color: var(--muted);
    margin: 0;
    padding: 0 0 22px;
    max-width: 720px;
  }
  .faq-cta {
    margin-top: 32px;
  }

  @media (max-width: 800px) {
    .faq-grid { grid-template-columns: 1fr; }
  }

  /* Textarea в форме модалки «Задать вопрос» */
  .v2-form-textarea {
    font-family: inherit; font-size: 15px;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: white;
    color: var(--ink);
    transition: border-color 0.2s ease;
    resize: vertical;
    min-height: 100px;
    width: 100%;
  }
  .v2-form-textarea:focus {
    outline: none;
    border-color: var(--teal-deep);
  }

  /* ───────── CONTACTS («Где нас найти») ───────── */
  .contacts {
    padding: 0 0 120px;
    background: var(--white);
  }
  .contacts .section-label-dot.contacts-dot { background: var(--teal); }

  .contacts-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
  }
  .contacts-card {
    border-radius: 20px;
    padding: 28px 28px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
    overflow: hidden;
  }
  .contacts-card > *:not(.contacts-shape) { position: relative; z-index: 2; }
  .contacts-card-1 { background: var(--bg-teal-pastel); }
  .contacts-card-2 { background: var(--bg-yellow-pastel); }
  .contacts-card-3 { background: var(--bg-pink-pastel); }

  /* Фигуры в углах — каждая своя */
  .contacts-shape {
    position: absolute;
    pointer-events: none;
    z-index: 1;
  }
  .contacts-card-1 .contacts-shape {
    right: -50px; bottom: -60px;
    width: 160px; height: 160px;
    background: var(--teal);
    opacity: 0.32;
    border-radius: 50%;
  }
  .contacts-card-2 .contacts-shape {
    right: -30px; top: -30px;
    width: 130px; height: 130px;
    background: var(--yellow);
    opacity: 0.55;
    border-radius: 36px;
    transform: rotate(18deg);
  }
  .contacts-card-3 .contacts-shape {
    left: -40px; bottom: -50px;
    width: 150px; height: 150px;
    background: var(--pink);
    opacity: 0.45;
    border-radius: 50%;
  }
  .contacts-card-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--muted);
    margin-bottom: 8px;
  }
  .contacts-link {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    text-decoration: none;
    letter-spacing: -0.02em;
    transition: color 0.2s;
  }
  .contacts-link:hover { color: var(--teal-deep); }

  .contacts-link-email {
    font-size: 15px;
    font-weight: 700;
    margin-top: 4px;
  }
  .contacts-text {
    font-size: 15px;
    line-height: 1.55;
    color: var(--ink);
    margin: 0;
    font-weight: 700;
    letter-spacing: -0.005em;
  }
  .contacts-note {
    font-size: 13px;
    color: var(--muted);
    margin: 0;
  }
  .contacts-map-links {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 14px;
  }
  /* Иконки Я.Карт и 2ГИС лежат в белых пилюлях (как .reviews-social) */
  .contacts-map-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    background: var(--white);
    border-radius: 999px;
  }
  .contacts-map-icon img {
    height: 20px;
    width: auto;
    display: block;
  }
  .contacts-map-icon--brand { background: var(--teal-deep); }
  .contacts-map-icon--brand img { height: 26px; }

  /* VK promo strip — фирменный teal-deep */
  .contacts-vk {
    background: var(--teal-deep);
    color: var(--white);
    border-radius: 20px;
    padding: 24px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 16px;
  }
  .contacts-vk-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--white);
    margin: 0 0 4px;
    letter-spacing: -0.025em;
  }
  .contacts-vk-desc {
    font-size: 14px;
    color: var(--teal-light);
    margin: 0;
  }
  /* На тёмном teal-deep фоне primary-кнопка хорошо видна (teal-light + ink) */
  .contacts-vk-btn { text-decoration: none; flex-shrink: 0; }
  .contacts-vk .btn-primary:hover { background: var(--white); color: var(--ink); }

  /* Map */
  .contacts-map {
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 16 / 4;
    background: var(--bg-teal-pastel);
  }
  .contacts-map-iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
  }

  @media (max-width: 900px) {
    .contacts-grid { grid-template-columns: 1fr 1fr; }
    .contacts-vk { padding: 20px 24px; }
    .contacts-map { aspect-ratio: 16 / 9; }
  }
  @media (max-width: 600px) {
    .contacts-grid { grid-template-columns: 1fr; }
    .contacts-card { padding: 22px; }
  }

  /* ───────── FOOTER ───────── */
  .footer {
    background: var(--bg-teal-pastel);
    color: var(--ink);
    padding: 64px 0 32px;
  }
  .footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1.2fr;
    gap: 48px;
    margin-bottom: 48px;
  }
  .footer-logo {
    display: inline-flex;
    align-items: center;
    margin-bottom: 16px;
  }
  .footer-logo img {
    height: 48px;
    width: auto;
    display: block;
  }
  .footer-brand-desc {
    font-size: 12px;
    line-height: 1.5;
    color: var(--muted);
    max-width: 280px;
    margin: 0;
  }
  .footer-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 14px;
  }
  .footer-list {
    list-style: none;
    padding: 0; margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .footer-link {
    color: var(--ink);
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    transition: color 0.2s;
  }
  .footer-link:hover {
    color: var(--teal-deep);
  }
  .footer-text {
    color: var(--muted);
    font-size: 14px;
  }
  .footer-bottom {
    border-top: 1px solid rgba(15, 20, 22, 0.12);
    padding-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
  }
  .footer-copyright {
    font-size: 12px;
    color: var(--muted);
  }
  .footer-copyright-brand {
    margin-top: 14px;
  }
  .footer-moybiznes {
    display: inline-flex;
    align-items: center;
    line-height: 0;
    flex-shrink: 0;
    transition: opacity 0.2s;
  }
  .footer-moybiznes img {
    height: 55px;
    width: auto;
    display: block;
  }
  .footer-moybiznes:hover { opacity: 0.7; }
  .footer-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 12px;
  }
  .footer-meta .footer-link {
    font-size: 12px;
    font-weight: 400;
    color: var(--muted);
  }
  .footer-meta .footer-link:hover {
    color: var(--teal-deep);
  }

  @media (max-width: 960px) {
    .footer { padding: 56px 0 28px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; margin-bottom: 32px; }
  }
  @media (max-width: 600px) {
    .footer { padding: 48px 0 24px; }
    .footer-grid { grid-template-columns: 1fr; gap: 28px; margin-bottom: 28px; }
    .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
    .footer-meta { gap: 14px; }
  }

  @media (max-width: 800px) {
    .footer-grid { grid-template-columns: 1fr; gap: 32px; }
    .footer-bottom { justify-content: flex-start; }
  }

  /* Reveal */
  .reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.7s ease, transform 0.7s ease;
  }

  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* ——— Dropdown «О центре» ——— */
  .v2-dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
    line-height: 1;
  }
  .v2-dropdown-trigger {
    display: inline-flex; align-items: center; gap: 4px;
    line-height: 1;
    color: var(--text);
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 14px; font-weight: 700;
    letter-spacing: -0.005em;
    background: none; border: none; padding: 0;
    cursor: pointer;
    white-space: nowrap;
  }
  .v2-dropdown-trigger:hover { color: var(--teal-deep); }
  .v2-dropdown-caret { transition: transform 0.2s ease; }
  .v2-dropdown.is-open .v2-dropdown-caret { transform: rotate(180deg); }
  .v2-dropdown.is-open .v2-dropdown-trigger { color: var(--teal-deep); }

  .v2-dropdown-menu {
    position: absolute;
    top: calc(100% + 16px);
    left: -14px;
    min-width: 280px;
    background: white;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 8px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
    z-index: 200;
  }
  .v2-dropdown.is-open .v2-dropdown-menu {
    opacity: 1; visibility: visible; transform: translateY(0);
  }
  .v2-dropdown-menu a {
    display: block;
    padding: 10px 18px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 14px; font-weight: 400;
    color: var(--text); text-decoration: none;
    line-height: 1.35;
  }
  .v2-dropdown-menu a:hover { background: var(--warm); color: var(--teal-deep); }

  /* ——— Booking modal ——— */
  .v2-modal {
    position: fixed; inset: 0; z-index: 1000;
    display: flex; align-items: center; justify-content: center;
    padding: 24px 20px;
    overflow-y: auto;
  }
  .v2-modal[hidden] { display: none; }
  .v2-modal-backdrop {
    position: fixed; inset: 0;
    background: rgba(15, 20, 22, 0.55);
    backdrop-filter: blur(4px);
  }
  .v2-modal-box {
    position: relative;
    background: white;
    border-radius: 16px;
    padding: 44px 44px 40px;
    width: 100%; max-width: 540px;
    margin: auto;
  }
  .v2-modal-close {
    position: absolute; top: 14px; right: 14px;
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    border: none;
    background: var(--teal-deep);
    color: var(--white);
    cursor: pointer;
    z-index: 100;
    transition: background 0.18s;
  }
  .v2-modal-close:hover { background: var(--ink); color: var(--white); }

  .v2-modal-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px; font-weight: 800; line-height: 1.2;
    letter-spacing: -0.025em;
    color: var(--ink);
    margin: 0 40px 12px 0;
  }
  .v2-modal-title .v2-modal-accent { color: var(--teal-deep); }
  .v2-modal-sub {
    font-size: 14px; line-height: 1.6; color: var(--muted);
    margin: 0 0 24px;
  }
  .v2-modal-phone {
    color: var(--teal-deep); font-weight: 700; text-decoration: none;
    border-bottom: 1px solid var(--teal-light);
  }
  .v2-modal-phone:hover { color: var(--ink); border-bottom-color: var(--ink); }

  .v2-form { display: flex; flex-direction: column; gap: 14px; }
  .v2-form-field { display: flex; flex-direction: column; gap: 6px; }
  .v2-form-field > span {
    font-size: 14px; font-weight: 700; color: var(--text);
  }
  .v2-form-field input {
    font-family: inherit; font-size: 14px;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: white;
    color: var(--ink);
    transition: border-color 0.2s ease;
  }
  .v2-form-field input:focus {
    outline: none;
    border-color: var(--teal-deep);
  }

  .v2-form-check {
    display: flex; align-items: flex-start; gap: 10px;
    font-size: 14px; line-height: 1.45;
    color: var(--muted);
    cursor: pointer;
    margin-top: 4px;
  }
  .v2-form-check input {
    margin-top: 2px;
    accent-color: var(--teal-deep);
    cursor: pointer;
  }
  .v2-form-check a {
    color: var(--teal-deep);
    text-decoration: underline;
    text-underline-offset: 2px;
  }
  .v2-form-check a:hover { color: var(--ink); }

  .v2-form-submit {
    margin-top: 8px;
    background: var(--teal-deep); color: white;
    padding: 15px 24px; border: 1px solid var(--teal-deep); border-radius: 8px;
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 14px; font-weight: 700;
    letter-spacing: -0.005em;
    cursor: pointer;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
  }
  .v2-form-submit:hover {
    background: var(--teal-light);
    color: var(--ink);
    border-color: var(--teal-light);
  }

  .v2-modal-thanks {
    text-align: center;
    padding: 20px 0 10px;
  }
  .v2-modal-thanks-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px; font-weight: 800;
    color: var(--ink);
    margin-bottom: 10px;
  }
  .v2-modal-thanks p {
    font-size: 14px; line-height: 1.55;
    color: var(--muted);
    margin: 0;
  }

  /* ───────── TEAM MODAL (Подробнее у педагога) ───────── */
  .v2-modal-box-team {
    max-width: 820px;
    padding: 36px 36px 36px;
    display: grid;
    grid-template-columns: 1fr 240px;
    gap: 28px;
    align-items: stretch;
  }
  .tm-text {
    display: flex;
    flex-direction: column;
  }
  .tm-photo {
    overflow: hidden;
    border-radius: 14px;
    background: var(--bg-teal-pastel);
    position: relative;
    min-height: 100%;
  }
  .tm-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
  }
  .tm-name {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0 0 12px;
  }
  .tm-name span { display: block; }
  /* Плашка стажа в модалке — стекло на фото */
  .tm-tag {
    position: absolute;
    bottom: 12px;
    left: 12px;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(28px) saturate(140%);
    -webkit-backdrop-filter: blur(28px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    color: var(--ink);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.005em;
    z-index: 2;
  }
  .tm-role {
    font-size: 14px;
    line-height: 1.55;
    color: var(--muted);
    margin: 0 0 20px;
  }
  .tm-edu {
    border-top: 1px solid var(--line);
    padding-top: 20px;
  }
  .tm-edu-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--muted);
    margin-bottom: 14px;
  }
  .tm-list {
    list-style: none;
    padding: 0; margin: 0;
  }
  .tm-list li {
    font-size: 14px;
    line-height: 1.55;
    color: var(--text);
    padding-left: 18px;
    position: relative;
    margin-bottom: 10px;
  }
  .tm-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 6px; height: 6px;
    background: var(--teal);
    border-radius: 50%;
  }
  @media (max-width: 700px) {
    .v2-modal-box-team { grid-template-columns: 1fr; gap: 20px; }
    .tm-photo { aspect-ratio: 3 / 4; max-height: 360px; min-height: auto; }
  }

  /* ───────── INFO MODAL (Маткапитал и т.п. — без формы) ───────── */
  .v2-modal-box-info {
    max-width: 560px;
    padding: 44px 40px 36px;
  }
  .v2-modal-info-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0 0 14px;
  }
  .v2-modal-info-desc {
    font-size: 14px;
    line-height: 1.65;
    color: var(--muted);
    margin: 0 0 20px;
  }
  .v2-modal-info-box {
    background: var(--bg-teal-pastel);
    border-radius: 16px;
    padding: 24px 24px 20px;
    margin-bottom: 20px;
  }
  .v2-modal-info-box-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--muted);
    margin-bottom: 14px;
  }
  .v2-modal-info-list {
    list-style: none;
    padding: 0; margin: 0;
  }
  .v2-modal-info-list li {
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid rgba(15, 20, 22, 0.08);
  }
  .v2-modal-info-list li:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none;
  }
  .v2-modal-info-li-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
  }
  .v2-modal-info-li-dot {
    width: 6px; height: 6px;
    background: var(--teal-deep);
    border-radius: 50%;
    flex-shrink: 0;
  }
  .v2-modal-info-li-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1;
  }
  .v2-modal-info-li-desc {
    font-size: 14px;
    line-height: 1.55;
    color: var(--muted);
    padding-left: 14px;
  }
  .v2-modal-info-note {
    font-size: 13px;
    line-height: 1.6;
    color: var(--muted);
    font-style: italic;
    margin: 0 0 24px;
  }
  .v2-modal-info-cta {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
  }
  .v2-modal-info-phone {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 14px;
    font-weight: 800;
    color: var(--ink);
    text-decoration: none;
    letter-spacing: -0.02em;
  }
  .v2-modal-info-phone:hover { color: var(--teal-deep); }

  /* ───────── SERVICE MODAL (Подробнее у направлений) ───────── */
  .v2-modal-box-wide {
    max-width: 720px;
    padding: 0;
  }

  .ms-photo {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--bg-teal-pastel);
    border-radius: 16px 16px 0 0;
  }
  .ms-photo-img {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    position: absolute; inset: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: 1;
  }
  .ms-photo-img.is-active { opacity: 1; z-index: 2; }

  .ms-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px; height: 40px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    color: var(--ink);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    transition: background 0.2s, transform 0.2s;
  }
  .ms-arrow:hover { background: var(--white); transform: translateY(-50%) scale(1.05); }
  .ms-arrow-prev { left: 12px; }
  .ms-arrow-next { right: 12px; }

  .ms-dots {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    z-index: 3;
  }
  .ms-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid var(--white);
    cursor: pointer;
    transition: background 0.2s;
  }
  .ms-dot.is-active { background: var(--white); }

  .v2-modal-box-wide > .ms-pills,
  .v2-modal-box-wide > .ms-title,
  .v2-modal-box-wide > .ms-desc,
  .v2-modal-box-wide > .ms-cols,
  .v2-modal-box-wide > .ms-foot {
    padding-left: 36px;
    padding-right: 36px;
  }

  .ms-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding-top: 24px;
    margin-bottom: 14px;
  }
  .ms-pill {
    background: var(--bg-teal-pastel);
    color: var(--ink);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.005em;
  }

  .ms-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--ink);
    margin: 0 0 14px;
  }
  .ms-desc {
    font-size: 14px;
    line-height: 1.65;
    color: var(--muted);
    margin: 0 0 24px;
  }

  .ms-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    margin-bottom: 28px;
  }
  .ms-cols-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--muted);
    margin-bottom: 12px;
  }
  .ms-list {
    list-style: none;
    padding: 0; margin: 0;
  }
  .ms-list li {
    font-size: 14px;
    line-height: 1.55;
    color: var(--text);
    padding-left: 18px;
    position: relative;
    margin-bottom: 8px;
  }
  .ms-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 6px;
    height: 6px;
    background: var(--teal);
    border-radius: 50%;
  }

  .ms-foot {
    border-top: 1px solid var(--line);
    padding-top: 24px;
    padding-bottom: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .ms-price-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--muted);
    margin-bottom: 4px;
  }
  .ms-price-value {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.02em;
  }
  .ms-price-value-sm {
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.4;
  }
  .ms-price-note {
    font-size: 12px;
    font-weight: 400;
    color: var(--muted);
    letter-spacing: 0;
    margin-left: 6px;
  }
  .ms-cta {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: stretch;
  }
  /* Primary шире (длинный текст), secondary уже — оба в один ряд */
  .ms-cta .btn-primary {
    flex: 1.6 1 0;
    min-width: 0;
    justify-content: center;
  }
  .ms-cta .btn-secondary {
    flex: 1 1 0;
    min-width: 0;
    justify-content: center;
  }
  @media (max-width: 600px) {
    .ms-cta .btn-primary, .ms-cta .btn-secondary { flex: 1 1 100%; min-width: 0; }
  }

  /* Diagnostics-specific phones row */
  .ms-diag-contacts { padding-top: 4px; }
  .ms-phones {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 4px;
  }
  .ms-phone {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 16px;
    font-weight: 800;
    color: var(--ink);
    text-decoration: none;
    letter-spacing: -0.02em;
  }
  .ms-phone:hover { color: var(--teal-deep); }

  @media (max-width: 720px) {
    .ms-cols { grid-template-columns: 1fr; gap: 20px; }
    .v2-modal-box-wide > .ms-pills,
    .v2-modal-box-wide > .ms-title,
    .v2-modal-box-wide > .ms-desc,
    .v2-modal-box-wide > .ms-cols,
    .v2-modal-box-wide > .ms-foot,
    .v2-modal-box-wide > .ms-diag-types,
    .v2-modal-box-wide > .md-diag-nav,
    .v2-modal-box-wide > .md-diag-panel {
      padding-left: 24px;
      padding-right: 24px;
    }
  }

  /* ───────── Diagnostic types (3 кнопки-строки в общей модалке) ───────── */
  .v2-modal-box-wide > .ms-diag-types {
    padding-left: 36px;
    padding-right: 36px;
    margin-bottom: 28px;
  }
  .ms-diag-types {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .ms-diag-type {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
    background: var(--bg-teal-pastel);
    border: 1px solid transparent;
    border-radius: 14px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background 0.18s, border-color 0.18s, transform 0.18s;
  }
  .ms-diag-type:hover {
    background: var(--teal-light);
    border-color: var(--teal-deep);
    transform: translateY(-1px);
  }
  .ms-diag-type-title {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 16px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.015em;
    line-height: 1.3;
  }
  .ms-diag-type-arrow {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--teal-deep);
    color: var(--white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.18s;
  }
  .ms-diag-type:hover .ms-diag-type-arrow {
    background: var(--ink);
  }

  /* ───────── Detail-модалка диагностики: навигация prev/next ───────── */
  .v2-modal-box-wide > .md-diag-nav {
    padding: 24px 36px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
  }
  .md-diag-nav-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--white);
    border: 1px solid var(--line);
    color: var(--ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.18s, border-color 0.18s, color 0.18s;
  }
  .md-diag-nav-btn:hover {
    background: var(--teal-deep);
    border-color: var(--teal-deep);
    color: var(--white);
  }
  .md-diag-counter {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--muted);
    text-transform: uppercase;
    min-width: 48px;
    text-align: center;
  }
  .md-diag-panel { display: none; }
  .md-diag-panel.is-active { display: block; }
  .md-diag-panel > .ms-pills,
  .md-diag-panel > .ms-title,
  .md-diag-panel > .ms-desc,
  .md-diag-panel > .ms-cols,
  .md-diag-panel > .ms-foot {
    padding-left: 36px;
    padding-right: 36px;
  }
  @media (max-width: 720px) {
    .md-diag-panel > .ms-pills,
    .md-diag-panel > .ms-title,
    .md-diag-panel > .ms-desc,
    .md-diag-panel > .ms-cols,
    .md-diag-panel > .ms-foot {
      padding-left: 24px;
      padding-right: 24px;
    }
    .v2-modal-box-wide > .md-diag-nav { padding-left: 24px; padding-right: 24px; }
  }

  /* ───────── LEGAL PAGES (политика, согласие) ───────── */
  .legal {
    padding: 96px 0 120px;
    background: var(--white);
    min-height: 70vh;
  }
  .legal .container { max-width: 820px; }
  .legal-back {
    display: inline-block;
    margin-bottom: 28px;
    font-size: 14px;
    font-weight: 700;
    color: var(--teal-deep);
    text-decoration: none;
    letter-spacing: -0.005em;
    transition: color 0.2s;
  }
  .legal-back:hover { color: var(--ink); }
  .legal-h1 {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.035em;
    line-height: 1.2;
    margin: 0 0 36px;
  }
  .legal-h2 {
    font-family: 'LINE Seed JP', 'Manrope', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 36px 0 14px;
  }
  .legal-body p {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text);
    margin: 0 0 12px;
  }
  .legal-list {
    margin: 0 0 14px;
    padding-left: 22px;
  }
  .legal-list li {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text);
    margin-bottom: 4px;
  }
  .legal-italic {
    margin-top: 24px;
    font-style: italic;
    color: var(--muted);
  }
  @media (max-width: 600px) {
    .legal { padding: 64px 0 80px; }
    .legal-h1 { margin-bottom: 28px; }
    .legal-h2 { margin: 28px 0 12px; font-size: 16px; }
  }