/* Порождено _tools/build_css.py из _tools/css/home.css.
   Правьте ИСХОДНИК: здесь правка живёт до следующей сборки.
   Комментарии сняты намеренно - они составляют 80% веса. */
.band { padding: clamp(4rem, 8vw, 6rem) 0; }
.band--white + .band--white,
.band--mist + .band--mist,
.band--navy + .band--navy { border-top: 1px solid currentColor; }
.band-in {
  max-width: var(--container); margin: 0 auto;
  padding: 0 clamp(1.25rem, 5vw, 2rem);
}
.band--white { background: var(--bg);        color: var(--ink); }
.band--mist  { background: var(--bg-alt);    color: var(--ink); }
.band--navy  { background: var(--bg-invert); color: var(--ink-on-dark); }
.band--poster { padding-block: clamp(4rem, 9vw, 7rem); }
.band-kicker {
  margin: 0 0 var(--gap-sm);
  font-family: var(--sans-nav); font-size: var(--fs-nav-bar); font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--link);
}
.poster-line {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(1.75rem, 4.2vw, 3.5rem); line-height: 1.06;
  letter-spacing: -.01em; margin: 0 0 var(--gap-lg); max-width: 28ch;
}
.poster-body { max-width: 58rem; }
.poster-body p { margin: 0 0 1em; }
.poster-body p:last-child { margin-bottom: 0; }
@media (min-width: 56rem) {
  .poster-body { columns: 2; column-gap: var(--gap-lg); }
  .poster-body p { break-inside: avoid; }
}
.band--reserved { padding-block: clamp(2.5rem, 5vw, 4rem); }
.reserved-slot {
  display: flex; align-items: center; justify-content: center;
  min-height: 9rem; border: 2px dashed var(--rule);
  font-family: var(--serif); font-size: 2.5rem; color: var(--ink-soft);
}
.band-title {
  font-family: var(--serif); font-weight: 500; font-size: var(--fs-h2);
  line-height: var(--lh-h2); margin: 0 0 var(--gap-md); max-width: 24ch;
}
.band--navy .band-title { color: var(--ink-invert); }
.band-lead { max-width: 46rem; }
.band-lead p { margin: 0 0 1em; }
.band-lead p:first-child { font-size: var(--fs-lead); line-height: 1.5; }
.band-lead p:last-child { margin-bottom: 0; }
.band-more {
  display: inline-flex; align-items: baseline; gap: .5rem;
  margin-top: var(--gap-md); padding-bottom: .55rem;
  border-bottom: 3px solid var(--green);
  font-family: var(--sans-nav); font-size: var(--fs-nav-bar); font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase;
  color: var(--link); text-decoration: none;
  transition: border-color .2s ease;
}
.band-more::after { content: "\2192"; color: var(--green); }
[dir="rtl"] .band-more::after { content: "\2190"; }
.band-more:hover, .band-more:focus-visible { border-bottom-color: var(--link); }
.band--navy .band-more { color: var(--link-on-dark); }
.band--navy .band-more:hover,
.band--navy .band-more:focus-visible { border-bottom-color: var(--ink-invert); }
@media (prefers-reduced-motion: reduce) { .band-more { transition: none; } }
.band-list {
  list-style: none; margin: var(--gap-md) 0 0; padding: 0;
  columns: 22ch; column-gap: var(--gap-lg);
}
.band-list li { break-inside: avoid; margin: 0 0 var(--gap-sm); }
.band-list a {
  display: block; font-family: var(--serif); font-size: var(--fs-menu);
  font-weight: 400; line-height: 1.15; color: currentColor; text-decoration: none;
}
.band-list a:hover, .band-list a:focus-visible {
  color: var(--link); text-decoration: underline;
}
.band--navy .band-list a:hover, .band--navy .band-list a:focus-visible {
  color: var(--link-on-dark);
}
.band-cta {
  display: inline-block; margin-top: var(--gap-md);
  padding: .9rem 2rem; border-radius: var(--radius);
  background: var(--cta-bg); color: var(--ink-invert);
  font-family: var(--sans); font-size: var(--fs-cta); font-weight: 700;
  text-transform: uppercase; letter-spacing: .1rem; text-decoration: none;
}
.band-cta:hover, .band-cta:focus-visible {
  background: var(--cta-bg-hover); color: var(--ink-invert);
}
.band--navy .band-cta { background: var(--ink-invert); color: var(--bg-invert); }
.band--navy .band-cta:hover, .band--navy .band-cta:focus-visible {
  background: var(--bg-alt); color: var(--bg-invert);
}
.timeline {
  list-style: none; margin: var(--gap-lg) 0 0; padding: 0;
  display: grid; gap: var(--gap-md);
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
}
.tl-step {
  position: relative; padding-top: var(--gap-sm);
  border-top: 2px solid currentColor;
}
.tl-step::before {
  content: ""; position: absolute; top: -7px; inset-inline-start: 0;
  width: 12px; height: 12px; background: currentColor;
}
.tl-date {
  display: block; font-family: var(--sans-nav); font-weight: 700;
  font-size: var(--fs-nav-bar); letter-spacing: .06em; text-transform: uppercase;
}
.tl-text { display: block; margin-top: .45rem; }
.tl-step.is-done::before { background: none; box-shadow: inset 0 0 0 2px currentColor; }
.tl-step.is-next { color: var(--green); }
.tl-step.is-next .tl-text { color: var(--ink-on-dark); }
.band--white .tl-step.is-next .tl-text, .band--mist .tl-step.is-next .tl-text {
  color: var(--ink);
}
.ladder { list-style: none; margin: var(--gap-lg) 0 0; padding: 0; }
.ladder-step {
  width: calc(34% + var(--i, 0) * 8.25%);
  min-width: 12rem; max-width: 100%;
  margin-bottom: .4rem; padding: .65rem 1rem;
  background: var(--bg); color: var(--ink);
  font-family: var(--serif); font-size: 1.15rem; line-height: 1.2;
}
.ladder-gap {
  background: none; border: 2px dashed var(--link);
  font-family: var(--sans); font-size: var(--fs-body); font-weight: 600;
  margin-top: var(--gap-sm);
}
.band--navy .ladder-step { background: var(--bg-alt); }
.band--navy .ladder-gap { background: none; color: var(--ink-invert); border-color: var(--ink-invert); }
.band--join .band-in { display: flex; justify-content: center; }
.join-card {
  display: flex; flex-direction: column; align-items: center;
  gap: var(--gap-md);
  max-width: 52rem;
  padding: clamp(2.25rem, 5vw, 3.5rem) clamp(1.5rem, 4vw, 3rem);
  background: var(--bg-alt);
  border-top: 3px solid var(--link);
  text-align: center;
}
.join-line {
  margin: 0;
  font-family: var(--serif); font-weight: 500;
  font-size: var(--fs-h2); line-height: var(--lh-h2); color: var(--ink);
}
.band--join .band-cta { margin-top: 0; }
.platform-acts {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--gap-lg); margin-top: var(--gap-lg);
}
.platform-acts .band-more, .platform-acts .band-cta { margin-top: 0; }
@media print { .langlist a, .step { border-top-color: var(--rule); } }
.reqs {
  list-style: none; margin: var(--gap-md) 0 0; padding: 0;
  display: grid; gap: var(--gap-sm);
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
}
.reqs li {
  padding-top: .7rem; border-top: 3px solid var(--ink);
}
.req-name {
  display: block;
  font-family: var(--sans-nav); font-size: var(--fs-label); font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
}
.req-text { display: block; margin-top: .2rem; color: var(--ink-soft); }
.steps {
  list-style: none; margin: var(--gap-lg) 0 0; padding: 0;
  display: grid; gap: 1.75rem;
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 38rem) {
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 62rem) {
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.step {
  display: grid; gap: .15rem; align-content: start;
  padding: 1.4rem 1.5rem 1.6rem;
  background: var(--bg); color: var(--ink);
  border-top: 3px solid var(--link);
}
.band--navy .step { border-top-color: var(--blue); }
.step-num {
  font-family: var(--serif); font-weight: 500;
  font-size: 2.25rem; line-height: 1; color: var(--link);
  margin-bottom: .35rem;
}
.step-name {
  font-family: var(--sans-nav); font-size: var(--fs-label); font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
}
.step-text { color: var(--ink-soft); }
.band--white .step { background: var(--bg-alt); }
.band--navy .reqs li { border-top-color: var(--ink-on-dark); }
.band--navy .req-text { color: var(--ink-on-dark); }
.band--navy .steps-note { border-inline-start-color: var(--link-on-dark); }
.band--navy .band-lead a, .band--navy .steps-note a, .band--navy .req-text a {
  color: var(--link-on-dark); text-decoration: underline;
}
.steps-note {
  margin: var(--gap-md) 0 0; padding-inline-start: var(--gap-sm);
  border-inline-start: 3px solid var(--link);
  max-width: 46rem;
}
.platform-row { display: grid; gap: var(--gap-lg); }
@media (min-width: 62rem) {
  .platform-row {
    grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
    gap: var(--gap-xl);
    align-items: start;
  }
  .platform-text .band-lead p:first-child { font-size: 1rem; line-height: 1.6; }
}
.platform-text .band-lead { max-width: none; }
.browser {
  border: 1px solid var(--rule);
  background: var(--bg-accent);
  min-width: 0;
}
.platform-screen { min-width: 0; display: flex; }
.platform-screen .browser { flex: 1 1 auto; display: flex; flex-direction: column; }
.platform-screen .browser-screen { flex: 1 1 auto; }
@media (min-width: 60rem) {
  .platform-row { align-items: stretch; }
  .platform-screen .browser-screen { aspect-ratio: auto; min-height: 32rem; }
}
.browser-screen {
  aspect-ratio: 16 / 10; background: var(--bg-accent);
}
.browser-screen iframe { display: block; width: 100%; height: 100%; border: 0; }
.tour-toggle {
  margin-top: .8rem; padding: 0; border: 0; background: none;
  font-family: var(--sans-nav); font-size: var(--fs-label); font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
  color: var(--link); cursor: pointer;
}
.tour-toggle:hover { text-decoration: underline; }
.tour-toggle:focus-visible {
  outline: 2px solid var(--focus); outline-offset: 2px;
}
.platform-tours-label {
  margin: var(--gap-md) 0 0;
  font-family: var(--sans-nav); font-size: var(--fs-label); font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--ink);
}
.tourslider {
  scrollbar-color: var(--navy) var(--bg); scrollbar-width: auto;
  list-style: none; margin: var(--gap-sm) 0 0; padding: 0 0 1rem;
  display: flex; gap: .75rem;
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
}
.tourcard { flex: 0 0 12.5rem; scroll-snap-align: start; }
.tourcard a {
  display: flex; flex-direction: column; gap: .55rem;
  height: 100%; padding: 1rem 1.1rem 1.2rem;
  background: var(--bg-alt); color: var(--ink); text-decoration: none;
  border-top: 3px solid transparent;
  transition: background-color .2s ease, border-color .2s ease;
}
.tourcard a:hover, .tourcard a:focus-visible {
  border-top-color: var(--link); background: var(--bg);
}
.tourcard-title {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.1rem, 1.6vw, 1.3rem); line-height: 1.2;
}
.tourcard a:hover .tourcard-title, .tourcard a:focus-visible .tourcard-title {
  color: var(--link);
}
.band--mist .tourcard a { background: var(--bg); }
.band--mist .tourcard a:hover, .band--mist .tourcard a:focus-visible {
  background: var(--bg-alt);
}
.band--navy .tourcard a { background: var(--bg); }
.band--navy .platform-tours-label { color: var(--ink-on-dark); }
.tourcard.is-on a,
.band--mist .tourcard.is-on a,
.band--navy .tourcard.is-on a {
  border-top-color: var(--link);
  background: var(--bg-accent); color: var(--ink-on-accent);
}
.band--mist .tourcard.is-on a:hover,
.band--mist .tourcard.is-on a:focus-visible { background: var(--bg-accent); }
.tourcard.is-on a:hover .tourcard-title,
.tourcard.is-on a:focus-visible .tourcard-title { color: var(--ink-on-accent); }
@media (prefers-reduced-motion: reduce) { .tourcard a { transition: none; } }
@media print { .platform-tours { display: none; } }
.objections { margin: var(--gap-lg) 0 0; display: grid; row-gap: var(--gap-md); }
@media (min-width: 62rem) {
  .objections {
    grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
    column-gap: var(--gap-lg);
  }
}
.objection-q, .objection-a {
  padding-top: var(--gap-sm); border-top: 1px solid var(--rule); margin: 0;
}
.objection-q {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(1.2rem, 1.9vw, 1.5rem); line-height: 1.2;
}
.objection-a { max-width: 46rem; color: var(--ink-soft); }
.objection-a p { margin: 0 0 .8em; }
.objection-a p:last-child { margin-bottom: 0; }
.band--navy .objection-a { color: var(--ink-on-dark); }
.band--code { overflow: hidden; }
.band--code .band-in { text-align: center; }
.band--code .band-title { max-width: none; margin-bottom: var(--gap-md); }
.code-row { display: block; }
.code-screen {
  position: relative;
  background: var(--bg-invert);
  height: min(78vh, 860px);
  min-height: 26rem;
}
.code-screen iframe {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border: 0; display: block;
}
@media print {
  .code-screen { display: none; }
}
@media print {
  .band { padding: 1.5rem 0; }
  .band--navy, .band--mist { background: var(--white); color: var(--ink); }
  .band--navy .band-title { color: var(--ink); }
  .band-more, .band-cta { display: none; }
}
.tourslider::-webkit-scrollbar { height: 14px; }
.tourslider::-webkit-scrollbar-track {
  background: var(--bg); border: 1px solid var(--rule);
}
.tourslider::-webkit-scrollbar-thumb {
  background: var(--navy); border: 3px solid var(--bg); border-radius: 0;
}
.tourslider::-webkit-scrollbar-thumb:hover { border-width: 2px; }