/* ================= кнопки ================= */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 44px; padding: 1rem 1.75rem;
  font-family: var(--f-body); font-weight: 600; font-size: var(--t-body);
  border-radius: var(--r-pill); text-decoration: none; text-align: center;
  transition: background-color var(--tr-fast), transform var(--tr-fast), box-shadow var(--tr-fast), color var(--tr-fast);
}
.btn--primary { background: var(--c-orange-btn); color: var(--c-white); box-shadow: var(--sh-orange); }
.btn--primary:hover { background: var(--c-orange-btn-deep); transform: translateY(-1px); box-shadow: 0 16px 32px -10px rgba(218,106,14,.55); }
.btn--blue { background: var(--g-blue); color: var(--c-white); box-shadow: var(--sh-md); }
.btn--blue:hover { transform: translateY(-1px); }
.btn--ghost { background: transparent; color: var(--c-ink); border: 1px solid var(--c-line); }
.btn--ghost:hover { border-color: var(--c-blue-400); background: var(--c-blue-050); }
.on-blue .btn--ghost { color: var(--c-white); border-color: rgba(255,255,255,.45); }
.on-blue .btn--ghost:hover { background: rgba(255,255,255,.12); }
.btn--sm { padding: .625rem 1.125rem; font-size: var(--t-small); }
.btn[disabled] { opacity: .6; cursor: not-allowed; transform: none; }

.link-arrow {
  display: inline-flex; align-items: center; gap: .35em; min-height: 44px;
  color: var(--c-link); font-weight: 600; text-decoration: underline;
}
.link-arrow span { transition: transform var(--tr-fast); }
.link-arrow:hover span { transform: translate(2px, -2px); }
.on-blue .link-arrow { color: var(--c-white); }

/* ================= бейджи, кикеры ================= */
.badge {
  display: inline-block; padding: .375rem .875rem;
  background: var(--g-orange); color: var(--c-white);
  font-size: var(--t-micro); font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  border-radius: var(--r-pill);
}
.kicker {
  display: inline-flex; align-items: center; gap: .5em; margin-bottom: var(--s-3);
  font-size: var(--t-micro); font-weight: 600; text-transform: uppercase; letter-spacing: .12em;
  color: var(--c-link);
}
.kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c-orange); }
.on-blue .kicker { color: var(--c-blue-200); }

/* ================= карточки ================= */
.card {
  position: relative; background: var(--c-white); border-radius: var(--r-lg);
  padding: var(--s-5); box-shadow: var(--sh-sm);
  transition: transform var(--tr-fast), box-shadow var(--tr-fast);
}
.card:hover { transform: translateY(-5px); box-shadow: var(--sh-md); }
.card--featured { border: 2px solid var(--c-orange); box-shadow: var(--sh-lg); }
.card--flat:hover { transform: none; box-shadow: var(--sh-sm); }
.card__num {
  font-family: var(--f-head); font-weight: 800; font-size: 2rem; color: var(--c-blue-400);
  line-height: 1; margin-bottom: var(--s-2);
}
.card h3 { margin-bottom: var(--s-2); }

.stat b { display: block; font-family: var(--f-head); font-weight: 800; font-size: var(--t-h2); color: var(--c-blue-600); line-height: 1; }
.stat span { font-size: var(--t-small); color: var(--c-ink-faint); }
.on-blue .stat b { color: var(--c-white); }
.on-blue .stat span { color: rgba(255,255,255,.8); }

.circle-badge {
  display: grid; place-items: center; width: 84px; height: 84px; flex: 0 0 84px;
  background: var(--c-white); border: 2px solid var(--c-blue-200); border-radius: 50%;
  font-family: var(--f-kr); font-weight: 700; font-size: 1.5rem; color: var(--c-blue-600);
  box-shadow: var(--sh-sm);
}
.circle-badge svg { width: 34px; height: 34px; }

/* ================= аккордеон ================= */
.accordion { border-top: 1px solid var(--c-line); }
.accordion details { border-bottom: 1px solid var(--c-line); }
.accordion summary {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-4);
  padding: var(--s-4) 0; cursor: pointer; list-style: none;
  font-family: var(--f-head); font-weight: 700; font-size: var(--t-h3); color: var(--c-ink);
}
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after {
  content: ""; flex: 0 0 28px; height: 28px; border-radius: 50%;
  background: var(--c-blue-050) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B7FE0' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/16px no-repeat;
  transition: transform var(--tr-fast);
}
.accordion details[open] summary::after { transform: rotate(45deg); }
.accordion details > p { padding-bottom: var(--s-4); max-width: 68ch; }

/* ================= форма ================= */
.form { display: grid; gap: var(--s-4); }
.field { display: grid; gap: var(--s-1); }
.field > label, .fieldset__legend { font-weight: 600; color: var(--c-ink); font-size: var(--t-small); }
.field input[type="text"], .field input[type="email"], .field select, .field textarea {
  width: 100%; padding: .875rem 1rem; background: var(--c-white);
  border: 1px solid var(--c-line); border-radius: var(--r-sm); color: var(--c-ink);
  transition: border-color var(--tr-fast), box-shadow var(--tr-fast);
}
.field textarea { resize: vertical; min-height: 5.5rem; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--c-blue-400); }
.field [aria-invalid="true"] { border-color: var(--c-orange-btn); }
.field__error { display: none; color: var(--c-orange-btn); font-size: var(--t-small); }
.field__error.is-shown { display: block; }
.field__hint { color: var(--c-ink-faint); font-size: var(--t-small); }

fieldset { border: 0; padding: 0; }
.choices { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-2); }
.choice { position: relative; }
.choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.choice span {
  display: block; padding: .625rem 1.125rem; border: 1px solid var(--c-line);
  border-radius: var(--r-pill); font-size: var(--t-small); color: var(--c-ink-soft);
  transition: all var(--tr-fast); min-height: 44px; display: flex; align-items: center;
}
.choice input:checked + span { border-color: var(--c-orange); background: var(--c-orange-050); color: var(--c-ink); font-weight: 600; }
.choice input:focus-visible + span { outline: 2px solid var(--c-focus); outline-offset: 3px; }

.consent { display: flex; gap: var(--s-2); align-items: flex-start; }
.consent input { margin-top: .35rem; width: 20px; height: 20px; flex: 0 0 20px; accent-color: var(--c-orange); }
.consent label { font-size: var(--t-small); }
.honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form__status {
  display: none; padding: var(--s-3); border-radius: var(--r-sm);
  background: var(--c-orange-050); color: #8A4104; font-size: var(--t-small);
}
.form__status.is-shown { display: block; }

/* ================= бегущая строка ================= */
.marquee { overflow: hidden; background: var(--g-blue); height: 56px; display: flex; align-items: center; }
.marquee__track { display: flex; gap: 2rem; white-space: nowrap; animation: marquee 40s linear infinite; }
.marquee__track span {
  font-family: var(--f-head); font-weight: 700; font-size: var(--t-small);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-white); padding-right: 2rem;
}
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ================= фирменная графика ================= */
.wave { position: absolute; left: 0; width: 100%; line-height: 0; pointer-events: none; z-index: 1; }
.wave--top { top: -1px; }
.wave--bottom { bottom: -1px; }
.wave svg { width: 100%; height: clamp(48px, 6vw, 96px); display: block; }
.wave--breathe svg { animation: wave-breathe 18s ease-in-out infinite; }
@keyframes wave-breathe { 0%,100% { transform: translateX(-14px); } 50% { transform: translateX(14px); } }

.dots {
  position: absolute; pointer-events: none; z-index: 0; opacity: .45;
  background-image: radial-gradient(var(--c-blue-400) 2px, transparent 2px);
  background-size: 18px 18px;
}
.brush { position: absolute; z-index: 0; pointer-events: none; }
.brush svg { width: 100%; height: auto; }

.vertical-kr {
  writing-mode: vertical-rl; text-orientation: upright;
  font-family: var(--f-kr); font-weight: 500;
  letter-spacing: .18em; line-height: 1.35;
  user-select: none; pointer-events: none;
}
.vertical-kr__wrap {
  position: absolute; z-index: 1;
  display: grid; grid-template-columns: auto auto; gap: .5rem;
  grid-template-areas: "text rule" "cap cap";
  justify-items: center;
}
.vertical-kr__wrap .vertical-kr { grid-area: text; }
.vertical-kr__rule { grid-area: rule; width: 1px; align-self: stretch; background: currentColor; opacity: .4; }
/* перевод — всегда горизонтальной строкой: кириллица столбцом не читается */
.vertical-kr__wrap small { grid-area: cap; writing-mode: horizontal-tb; white-space: nowrap; margin-top: .35rem; }

/* ================= слайдер отзывов ================= */
.slider { position: relative; }
.slider__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4); }
.slider__nav { display: flex; align-items: center; gap: var(--s-3); }
.slider__nav button {
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--c-line);
  display: grid; place-items: center; color: var(--c-blue-600); background: var(--c-white);
  transition: all var(--tr-fast);
}
.slider__nav button:hover { border-color: var(--c-blue-400); background: var(--c-blue-050); }
.slider__count { font-variant-numeric: tabular-nums; color: var(--c-ink-faint); font-size: var(--t-small); }
.slider__card { margin-top: var(--s-5); }
.review__quote { font-family: var(--f-head); font-size: 3rem; line-height: 1; color: var(--c-blue-200); }
.review__text { font-size: var(--t-lead); color: var(--c-ink); margin-block: var(--s-3); max-width: 62ch; }
.review__person { display: flex; align-items: center; gap: var(--s-3); }
.review__dot {
  width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
  background: var(--c-blue-050); color: var(--c-blue-600); font-weight: 600;
}
.review__person small { display: block; color: var(--c-ink-faint); font-size: var(--t-small); }

/* ================= лайтбокс ================= */
.lightbox {
  position: fixed; inset: 0; z-index: 90; display: none;
  align-items: center; justify-content: center; padding: var(--gutter);
  background: rgba(12,36,80,.85);
}
.lightbox.is-open { display: flex; }
.lightbox__img { max-height: 85vh; width: auto; border-radius: var(--r-md); box-shadow: var(--sh-lg); }
.lightbox__close {
  position: absolute; top: var(--s-4); right: var(--s-4);
  width: 48px; height: 48px; border-radius: 50%; background: var(--c-white); color: var(--c-ink);
  display: grid; place-items: center; font-size: 1.5rem;
}

/* ================= липкая мобильная панель ================= */
.sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
  padding: var(--s-2) var(--s-3) calc(var(--s-2) + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.94); backdrop-filter: blur(10px);
  border-top: 1px solid var(--c-line);
  transform: translateY(110%); transition: transform var(--tr-fast);
}
.sticky-cta.is-shown { transform: none; }
.sticky-cta .btn { width: 100%; }
@media (min-width: 860px) { .sticky-cta { display: none; } }

/* ================= плашка cookies ================= */
.cookie {
  position: fixed; left: var(--s-3); right: var(--s-3); bottom: var(--s-3); z-index: 80;
  display: none; gap: var(--s-3); align-items: center; flex-wrap: wrap;
  max-width: 560px; margin-inline: auto;
  padding: var(--s-3) var(--s-4); background: var(--c-white);
  border-radius: var(--r-md); box-shadow: var(--sh-lg); font-size: var(--t-small);
}
.cookie.is-shown { display: flex; }
.cookie p { flex: 1 1 260px; margin: 0; }
@media (max-width: 859px) { .cookie.is-shown { bottom: 5rem; } }