/* Promo landing (template "Акция"). Linked only by that template.
   Approved mockups: /root/tomoko/akciya-shkolnik-maket-2026-10-20/ (20.10.2026). */

/* Header: green while the hero is under it, regular white below (lending.js toggles body.lp-green). */
.lp-page .tk-header--solid { transition: background-color .2s ease, border-color .2s ease, color .2s ease; }
.lp-page .tk-header--solid .tk-btn--primary { transition: background-color .2s ease, color .2s ease; }
.lp-page .tk-header__spacer { background: #268034; }

body.lp-green:not(.bvi-active) .tk-header--solid {
  background: #268034;
  color: var(--c-paper);
  border-bottom-color: transparent;
}
body.lp-green:not(.bvi-active) .tk-header--solid .tk-hero__logo {
  background: url(/assets/theme/img/logo-tomoko-white.svg) no-repeat 50% 50% / contain;
}
body.lp-green:not(.bvi-active) .tk-header--solid .tk-hero__logo img { visibility: hidden; }
body.lp-green:not(.bvi-active) .tk-header--solid .tk-nav__link,
body.lp-green:not(.bvi-active) .tk-header--solid .tk-hero__phone,
body.lp-green:not(.bvi-active) .tk-header--solid .tk-phones__toggle,
body.lp-green:not(.bvi-active) .tk-header--solid .tk-bvi-btn,
body.lp-green:not(.bvi-active) .tk-header--solid .tk-burger { color: var(--c-paper); }
body.lp-green:not(.bvi-active) .tk-header--solid .tk-nav__link:focus-visible { color: var(--c-orange); }
body.lp-green:not(.bvi-active) .tk-header--solid .tk-btn--primary { background: var(--c-paper); color: var(--c-ink-green); }
body.lp-green:not(.bvi-active) .tk-header--solid .tk-phones__drop { color: var(--c-ink-green); }
@media (hover: hover) and (pointer: fine), (min-width: 1101px) {
  body.lp-green:not(.bvi-active) .tk-header--solid .tk-nav__link:hover,
  body.lp-green:not(.bvi-active) .tk-header--solid .tk-hero__phone:hover { color: var(--c-orange); }
  body.lp-green:not(.bvi-active) .tk-header--solid .tk-btn--primary:hover { background: var(--c-paper-85); }
}

/* An open mega-menu panel inherits the header colour: fall back to the white header, as on the home page. */
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) {
  background: var(--c-paper);
  color: var(--c-ink-green);
  border-bottom-color: var(--c-hairline);
}
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-hero__logo { background: none; }
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-hero__logo img { visibility: visible; }
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-nav__link,
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-hero__phone,
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-phones__toggle,
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-bvi-btn { color: var(--c-ink-green); }
body.lp-green:not(.bvi-active) .tk-header--solid:has(.tk-nav__link[aria-expanded="true"]) .tk-btn--primary { background: var(--c-brand-green); color: var(--c-paper); }

/* No closing call-to-action above the footer on a landing; the booking dialog stays. */
.lp-page .tk-final__cta,
.lp-page .tk-final__cta + .tk-final__seam { display: none; }

/* Hero */
.lp-hero { background: var(--g-green); color: var(--c-paper); padding: 32px 0 0; }
.lp-hero__in { display: flex; flex-direction: column; gap: 36px; }
.lp-hero__text { display: flex; flex-direction: column; align-items: flex-start; }
.lp-chip { white-space: nowrap; }
.lp-hero__title {
  margin: 22px 0 14px;
  font-size: 42px; line-height: .98; letter-spacing: -.04em; font-weight: 400;
  color: var(--c-paper); text-wrap: balance;
}
.lp-hero__lead { margin: 0 0 32px; font-size: 17px; line-height: 1.45; letter-spacing: -.02em; color: var(--c-paper-85); }
.lp-price { display: flex; align-items: flex-end; gap: 14px; margin: 0; }
.lp-price__now { font-size: 60px; line-height: .9; letter-spacing: -.045em; font-weight: 500; white-space: nowrap; }
.lp-price__side { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding-bottom: 2px; }
.lp-price__was { font-size: 18px; color: var(--c-paper-66); text-decoration-thickness: 1.5px; white-space: nowrap; }
.lp-price__save { white-space: nowrap; }
.lp-when {
  display: flex; gap: 10px; align-items: flex-start;
  margin: 26px 0 0; padding: 12px 14px;
  border-radius: var(--r-input); background: var(--c-paper-10);
  font-size: 15px; line-height: 1.35; font-weight: 600; color: var(--c-orange);
}
.lp-when svg { flex: none; width: 20px; height: 20px; }
.lp-cta { width: 100%; min-height: 56px; margin-top: 28px; }
.lp-tel {
  display: flex; align-items: center; gap: 8px; margin: 22px auto 0;
  color: var(--c-paper); font-size: 15px; font-weight: 500; text-decoration: none;
}
.lp-tel svg { width: 18px; height: 18px; flex: none; }
.lp-nowrap { white-space: nowrap; }
.lp-fine { margin: 18px 0 0; width: 100%; text-align: center; font-size: 13px; line-height: 1.4; color: var(--c-paper-75); }
.lp-hero__photo {
  position: relative; z-index: 1;
  margin: 0 0 -56px; border-radius: var(--r-image); overflow: hidden;
  aspect-ratio: 335 / 210; background: var(--c-forest);
}
.lp-hero__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 35% 45%; }

/* Sections */
.lp-sec { padding: 40px 0; }
.lp-incl { padding-top: 88px; }
.lp-h2 {
  margin: 0 0 8px;
  font-size: 30px; line-height: 1.05; letter-spacing: -.035em; font-weight: 400;
  color: var(--c-ink-green); text-wrap: balance;
}
.lp-sub { margin: 0 0 22px; font-size: 15px; line-height: 1.4; color: var(--c-fog); }
.lp-sub:empty { display: none; }

.lp-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.lp-check li { display: grid; grid-template-columns: 36px 1fr; gap: 14px; align-items: center; }
.lp-check__ic {
  display: grid; place-items: center; width: 36px; height: 36px;
  border-radius: 50%; background: var(--c-brand-green); color: var(--c-paper);
}
.lp-check__ic svg { width: 18px; height: 18px; }
.lp-check b { display: block; font-weight: 600; font-size: 16px; line-height: 1.3; letter-spacing: -.02em; color: var(--c-ink-green); }
.lp-check__d { display: block; font-size: 14px; line-height: 1.4; color: var(--c-fog); }
.lp-check__d:empty { display: none; }

.lp-terms { background: var(--c-mist); }
.lp-dl { display: grid; margin: 18px 0 14px; padding: 4px 20px; background: var(--c-paper); border-radius: var(--r-card); }
.lp-dl > div { display: grid; grid-template-columns: 1fr; gap: 2px; padding: 14px 0; border-top: 1px solid var(--c-hairline); }
.lp-dl > div:first-child { border-top: 0; }
.lp-dl dt {
  font-size: 12px; line-height: 1.6; letter-spacing: .1em; text-transform: uppercase;
  font-weight: 600; color: var(--c-accent-text);
}
.lp-dl dd { margin: 0; font-size: 15px; line-height: 1.4; color: var(--c-ink-green); }
.lp-dl dd b { font-weight: 600; }
.lp-note { margin: 0; font-size: 14px; line-height: 1.45; color: var(--c-fog); }
.lp-note:empty { display: none; }

.lp-docs__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lp-doc { display: flex; flex-direction: column; color: var(--c-ink-green); text-decoration: none; }
.lp-doc img {
  width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; object-position: 50% 15%;
  margin-bottom: 12px; border-radius: var(--r-image); background: var(--c-mist);
}
.lp-doc__name { font-size: 15px; line-height: 1.3; font-weight: 600; letter-spacing: -.02em; }
.lp-doc__role { margin-top: 4px; font-size: 13px; line-height: 1.4; color: var(--c-fog); }
.lp-doc__more {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 10px;
  font-size: 12px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; color: var(--c-accent-text);
}
.lp-doc__more svg { width: 14px; height: 14px; }
.lp-doc:focus-visible { outline: 2px solid var(--c-brand-green); outline-offset: 4px; border-radius: var(--r-image); }

.lp-steps { padding: 8px 0 64px; }
.lp-steps__list { list-style: none; margin: 20px 0 0; padding: 0; counter-reset: lp-step; display: grid; }
.lp-steps__list li { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 0 0 22px 52px; counter-increment: lp-step; }
.lp-steps__list li::before {
  content: counter(lp-step);
  position: absolute; left: 0; top: -4px; z-index: 1;
  display: grid; place-items: center; width: 36px; height: 36px;
  border: 1.5px solid var(--c-brand-green); border-radius: 50%;
  background: var(--c-paper); color: var(--c-brand-green); font-weight: 600; font-size: 15px;
}
.lp-steps__list li:not(:last-child)::after {
  content: ""; position: absolute; left: 17px; top: 32px; bottom: 0; width: 1.5px; background: var(--c-hairline);
}
.lp-steps__list b { font-size: 17px; line-height: 1.3; font-weight: 600; letter-spacing: -.02em; color: var(--c-ink-green); }
.lp-steps__list span { font-size: 14px; line-height: 1.45; color: var(--c-fog); }
.lp-steps__list a { color: inherit; white-space: nowrap; }

@media (min-width: 1024px) {
  .lp-hero { padding: 56px 0; }
  .lp-hero__in { flex-direction: row; align-items: center; gap: 64px; }
  .lp-hero__text { flex: 1 1 0; max-width: 520px; }
  .lp-hero__title { margin: 16px 0 8px; font-size: 72px; }
  .lp-hero__lead { margin-bottom: 22px; line-height: 1.4; }
  .lp-price__now { font-size: 80px; }
  .lp-when { margin-top: 18px; }
  .lp-cta { width: auto; min-width: 320px; margin-top: 20px; }
  .lp-tel { margin: 16px 0 0; }
  .lp-fine { margin-top: 14px; text-align: left; }
  .lp-hero__photo { flex: 1 1 0; margin: 0; aspect-ratio: 560 / 460; }
  .lp-incl { padding-top: 72px; }
  .lp-sec { padding: 64px 0; }
  .lp-h2 { font-size: 44px; }
  .lp-check { grid-template-columns: 1fr 1fr; column-gap: 48px; row-gap: 24px; }
  .lp-dl { grid-template-columns: 1fr 1fr; column-gap: 40px; padding: 8px 28px; }
  .lp-dl > div { grid-template-columns: 110px 1fr; gap: 16px; }
  .lp-dl > div:nth-child(2) { border-top: 0; }
  .lp-docs .tk-container { display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; align-items: start; }
  .lp-docs .lp-h2, .lp-docs .lp-sub { grid-column: 1; }
  .lp-docs__row { grid-column: 2; grid-row: 1 / span 3; gap: 24px; }
  .lp-steps { padding-bottom: 96px; }
  .lp-steps__list { grid-template-columns: repeat(3, 1fr); gap: 32px; }
  .lp-steps__list li:not(:last-child)::after { display: none; }
}

@media (hover: hover) and (pointer: fine), (min-width: 1101px) {
  .lp-doc:hover .lp-doc__more { color: var(--c-brand-green); }
  .lp-tel:hover { color: var(--c-paper-85); }
}

@media (prefers-reduced-motion: reduce) {
  .lp-page .tk-header--solid,
  .lp-page .tk-header--solid .tk-btn--primary { transition: none; }
}