/* V3: блоки по SEO-стратегии (отрасли, флагманские кейсы, доп. услуги, плашки у формы).
   Подключается после site.css и v2.css, токены берёт оттуда. */

/* ---------- Шапка: пять пунктов меню ---------- */
@media (max-width: 1360px) and (min-width: 1101px) {
  .v3 .header__inner { gap: 16px; }
  .v3 .nav { gap: 2px; }
  .v3 .nav a { padding: 8px 12px; }
  .v3 .header__social { display: none; }
}

/* ---------- Доп. услуги ---------- */
.more-services { margin-top: 110px; }
.more-services__label { font: 600 24px/1.3 var(--font-head); }
.more-services__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 32px; }
.mini { display: flex; flex-direction: column; gap: 14px; padding: 32px; border: 1px solid rgba(255,255,255,.14); border-radius: 24px; transition: border-color .2s; }
.mini:hover { border-color: var(--blue-2); }
.mini__title { font: 600 18px/1.25 var(--font-head); }
.mini__text { font-size: 15px; line-height: 22px; color: var(--grey-300); }
.mini__link, .industry__link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 10px; font-weight: 600; color: var(--blue-2); transition: gap .2s; }
.mini__link:hover, .industry__link:hover { gap: 12px; }
.mini__link svg, .industry__link svg { width: 18px; height: 18px; }
.mini__link { color: var(--white); }

/* ---------- Отрасли ---------- */
.industry-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.industry { display: flex; flex-direction: column; min-height: 400px; padding: 32px; border-radius: 24px; background: var(--grey-50); transition: background-color .2s, color .2s; }
.industry__icon { width: 44px; height: 44px; padding: 10px; border-radius: 50%; background: var(--blue); color: var(--white); }
.industry__title { margin-top: 40px; font: 600 20px/1.25 var(--font-head); }
.industry__tags { margin-top: 8px; font-size: 14px; font-weight: 500; color: var(--blue-3); }
.industry__text { margin-top: 20px; font-size: 15px; line-height: 22px; color: var(--grey-600); }
.industry:hover { background: var(--graphite); color: var(--white); }
.industry:hover .industry__text { color: var(--grey-300); }
.industry:hover .industry__tags, .industry:hover .industry__link { color: var(--white); }

/* ---------- Флагманские кейсы ---------- */
.flagships { padding-top: var(--section-y); }
.flagship-grid { display: grid; gap: 16px; }
.flagship { display: grid; grid-template-columns: 1fr 1fr; border-radius: 24px; background: var(--white); color: var(--graphite); overflow: hidden; }
.flagship:nth-child(even) .flagship__img { order: 2; }
/* Высоту строки задаёт текст: картинка 380 и тянется только вслед за текстом, иначе квадратный Goodhim раздувает карточку */
.flagship__img { width: 100%; height: 380px; min-height: 100%; object-fit: cover; }
.flagship__img[src*="hualian"] { object-position: 0 50%; }
.flagship__body { display: flex; flex-direction: column; padding: 40px; }
.flagship__meta { font-size: 14px; font-weight: 500; color: var(--blue-3); }
.flagship__title { margin-top: 12px; font: 600 26px/1.2 var(--font-head); letter-spacing: -.01em; }
.flagship__text { margin-top: 20px; font-size: 15px; line-height: 22px; color: var(--grey-600); }
.flagship__facts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 28px; }
.flagship__facts li { padding: 8px 14px; border-radius: 100px; background: var(--grey-60); font-size: 14px; font-weight: 500; }
.flagship__facts li:first-child { background: var(--blue); color: var(--white); }

/* ---------- Плашки у формы ---------- */
.contact__aside { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 728px; margin: 40px auto 0; text-align: left; }
.aside-card { display: flex; flex-direction: column; gap: 12px; padding: 28px; border-radius: 24px; background: var(--grey-50); }
.aside-card__title { font: 600 18px/1.3 var(--font-head); }
.aside-card__text { color: var(--grey-600); font-size: 15px; }
.aside-card__soon { align-self: flex-start; margin-top: auto; padding: 6px 12px; border-radius: 100px; border: 1px dashed var(--grey-300); color: var(--grey-500); font-size: 13px; font-weight: 500; }
.aside-card--dark { background: var(--graphite); color: var(--white); }
.aside-card__btns { display: grid; gap: 8px; margin-top: auto; }
.aside-card__btns .btn { width: 100%; height: 44px; }

/* ---------- Первый экран: чипы-ссылки ---------- */
.v3 .hero__chips a { display: block; }

/* ---------- Футер: пять колонок, сноска про Meta под колонкой «Соцсети» ---------- */
.v3:not(.inner-page) .footer__cols,
.v3:not(.inner-page) .footer__meta { grid-template-columns: repeat(5, 1fr); gap: 24px; }
.v3:not(.inner-page) .footer__privacy { grid-column: 1 / 4; }
.v3:not(.inner-page) .footer__disclaimer { grid-column: 5; }

/* ======================= Адаптив ======================= */
@media (max-width: 1100px) {
  .more-services { margin-top: 80px; }
  .more-services__grid, .industry-grid { grid-template-columns: 1fr 1fr; }
  .industry:last-child, .mini:last-child { grid-column: 1 / -1; }
  .industry { min-height: 0; }
  .flagships { padding-bottom: var(--section-y); }
  .flagship { grid-template-columns: 1fr; }
  .flagship:nth-child(even) .flagship__img { order: 0; }
  .flagship__img { height: auto; min-height: 0; aspect-ratio: 16 / 9; }
  .v3:not(.inner-page) .footer__cols { grid-template-columns: repeat(2, 1fr); gap: 32px 16px; }
  .v3:not(.inner-page) .footer__meta { grid-template-columns: 1fr; gap: 16px; }
  .v3:not(.inner-page) .footer__privacy, .v3:not(.inner-page) .footer__disclaimer { grid-column: auto; }
}

@media (max-width: 640px) {
  .more-services { margin-top: 64px; }
  .more-services__label { font-size: 20px; }
  .more-services__grid, .industry-grid { grid-template-columns: 1fr; gap: 12px; margin-top: 20px; }
  .industry-grid { margin-top: 0; }
  .mini, .industry { padding: 24px; }
  .industry__title { margin-top: 24px; font-size: 20px; }
  .flagship-grid { gap: 12px; }
  .flagship__body { padding: 24px; }
  .flagship__title { font-size: 21px; }
  .flagship__text { font-size: 15px; }
  .flagship__facts li { font-size: 13px; padding: 6px 12px; }
  .contact__aside { grid-template-columns: 1fr; gap: 12px; margin-top: 28px; }
  .aside-card { padding: 24px; }
}

/* ---------- Иконки мессенджеров (SVG Вадима, 29.10) ---------- */
.v3 .soc, .v3 .header__social .soc { color: var(--white); opacity: .5; transition: opacity .2s; }
.v3 .soc:hover, .v3 .header__social .soc:hover { color: var(--white); opacity: 1; }

/* ---------- Маркеры списков услуг: синий круг со звездой ---------- */
.v3 .service__list li::before { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%230369B7'/%3E%3Cpath fill='white' d='M8 3.2l.54 4.26 4.26.54-4.26.54L8 12.8l-.54-4.26L3.2 8l4.26-.54z'/%3E%3C/svg%3E") center / 16px no-repeat; }

/* ---------- Переключатели в формах: без слипания в Safari ----------
   Safari плохо раскладывает grid на fieldset, поэтому подпись слева float, варианты справа. */
.v3 .seg { display: block; }
.v3 .seg::after { content: ""; display: table; clear: both; }
.v3 .seg__label { float: left; width: 209px; line-height: 40px; }
.v3 .seg__opts:not(.seg__opts--wrap) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; min-width: 0; }
.v3 .seg__opts label { min-width: 0; }
.v3 .seg__opts:not(.seg__opts--wrap) span { min-width: 0; padding: 0 12px; white-space: nowrap; }
.v3 .calc__form .seg__label { width: 200px; }
@media (max-width: 640px) {
  .v3 .seg__label, .v3 .calc__form .seg__label { float: none; display: block; width: auto; line-height: 1.4; margin-bottom: 10px; }
  .v3 .seg__opts:not(.seg__opts--wrap) span { padding: 0 6px; }
}

/* ---------- Мобильное меню: на низких экранах кнопка не сжимается, меню прокручивается ---------- */
.v3 .mobile-menu > * { flex-shrink: 0; }