/* Public pages — the landing page (/) and Мэдээ, зөвлөгөө (/news): teal + 3D.
   This file owns its palette: the tokens below are set on body.lp and override the app tokens from style.css, so
   any shared component (skip link, .btn on the news pages) renders in the teal system. The mode is the same as on
   every other page: static/js/theme.js sets <html data-theme> from the device or the visitor's choice (the moon/sun
   button in the header); the dark palette is the base here, so a page without that script stays dark.
   Decorative 3D images are static renders of static/js/landing3d/models.js (scripts/render_3d_icons.html). */

/* Inter (self-hosted, CSP allows fonts from 'self' only) is declared once in style.css, loaded before this file. */

/* ---------- tokens ---------- */
body.lp {
  /* design names */
  --bg: #0f1412; --surface: #171d1b; --surface2: #1f2624; --border: #2a3431; --border2: #222b28;
  --text: #ecf1ee; --text2: #a9b5af; --text3: #8a978f;
  --accent: #3dd6bc; --accent-text: #5fd9c3; --accent-fill: #157a6b; --accent-fill-h: #1a8b7a; --accent-soft: #143330; --on-accent: #ffffff;
  --ok: #6fd39a; --ok-bg: #143324; --ok-bd: #27633f;
  --ai: #f2c76a; --ai-bg: #33270c; --ai-bd: #6b531c;
  --pt: #c3ced9; --pt-bg: #222c37; --pt-bd: #475563;
  --danger: #ff8f86; --danger-bg: #3a1512; --danger-bd: #6b2a24;
  --glow: radial-gradient(600px 420px at 70% 30%, rgba(61, 214, 188, .12), transparent 70%);
  --obj-shadow: drop-shadow(0 30px 40px rgba(0, 0, 0, .4));
  --card-shadow: 0 30px 60px rgba(0, 0, 0, .45);
  /* the same palette under the app's token names (style.css components, news.css) */
  --surface-2: var(--surface2); --surface-3: #26302d; --text-2: var(--text2); --muted: var(--text3);
  --border-strong: #3a4744;
  --primary: var(--accent-fill); --primary-h: var(--accent-fill-h); --primary-soft: var(--accent-soft); --on-primary: var(--on-accent); --primary-text: var(--accent-text);
  --brand: var(--accent-text); --brand-hover: #8fe8d8; --brand-ink: #03201c; --brand-soft: var(--accent-soft); --brand-ring: rgba(61, 214, 188, .45);
  --focus: 0 0 0 3px rgba(61, 214, 188, .45);
  --ok-soft: var(--ok-bg); --warn: var(--ai); --warn-soft: var(--ai-bg); --warn-border: var(--ai-bd);
  --info: #9cc5f5; --info-soft: #16304f;
  --danger-soft: var(--danger-bg); --danger-border: var(--danger-bd); --danger-hover: #ffb0a9; --danger-solid: #b8322a; --danger-solid-hover: #c9433a;
  --user-bubble: var(--accent-soft); --user-ink: var(--text);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .35); --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35); --shadow-lg: 0 24px 60px rgba(0, 0, 0, .5);
  --lp-font: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
  color-scheme: dark;
  margin: 0; height: auto; background: var(--bg); color: var(--text);
  font: 400 16px/1.55 var(--lp-font); -webkit-font-smoothing: antialiased;
}
html[data-theme="light"] body.lp {
  --bg: #f3f7f5; --surface: #ffffff; --surface2: #e9f0ed; --border: #cfdad5; --border2: #e1e9e5;
  --text: #121a17; --text2: #46524d; --text3: #5b6862;
  --accent: #0f6e60; --accent-text: #0f6e60; --accent-fill: #0f6e60; --accent-fill-h: #0b5a4f; --accent-soft: #ddf3ee; --on-accent: #ffffff;
  --ok: #146c3f; --ok-bg: #e3f5ea; --ok-bd: #9fd8b6;
  --ai: #7a4b00; --ai-bg: #fff1d6; --ai-bd: #e8c77a;
  --pt: #3f4c5c; --pt-bg: #edf1f5; --pt-bd: #b9c4d0;
  --danger: #b42318; --danger-bg: #fee4e2; --danger-bd: #f7b4ae;
  --glow: radial-gradient(600px 420px at 70% 30%, rgba(15, 110, 96, .10), transparent 70%);
  --obj-shadow: drop-shadow(0 24px 30px rgba(18, 26, 23, .18));
  --card-shadow: 0 30px 60px rgba(18, 26, 23, .14);
  --surface-3: #dfe8e4; --border-strong: #b5c4be;
  --brand-hover: #0b5a4f; --brand-ink: #ffffff; --brand-ring: rgba(15, 110, 96, .38);
  --focus: 0 0 0 3px rgba(15, 110, 96, .35);
  --info: #1b5aa6; --info-soft: #e5eefb; --danger-hover: #931a10; --danger-solid: #b42318; --danger-solid-hover: #931a10;
  --shadow-sm: 0 1px 2px rgba(16, 32, 28, .06); --shadow: 0 1px 2px rgba(16, 32, 28, .05), 0 8px 24px rgba(16, 32, 28, .07); --shadow-lg: 0 24px 60px rgba(16, 32, 28, .16);
  color-scheme: light;
}
html:has(> body.lp) { background: #0f1412; }
html[data-theme="light"]:has(> body.lp) { background: #f3f7f5; }

/* ---------- base ---------- */
body.lp a { color: var(--accent-text); text-underline-offset: 2px; }
body.lp a:hover { color: var(--brand-hover); }
body.lp :focus-visible { outline: 3px solid var(--brand-ring); outline-offset: 2px; border-radius: 6px; }
body.lp ::selection { background: var(--accent-soft); color: var(--text); }
body.lp .skip-link { background: var(--accent-fill); color: var(--on-accent); }
/* spacing comes from flex/grid gaps; the news pages (body.nw) keep their own margins in news.css */
body.lp:not(.nw) :is(h1, h2, h3, p, ul, ol, figure), .lp-header :is(p, ul), .lp-footer :is(h2, p, ul) { margin: 0; }
.lp svg { flex: none; }
.lp-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lp-wrap { max-width: 1160px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
.lp-stack { display: flex; flex-direction: column; gap: 40px; }
.lp-stack-28 { gap: 28px; }
.lp-head { display: flex; flex-direction: column; gap: 12px; }
.lp-eyebrow { font: 700 12px/1.3 var(--lp-font); letter-spacing: .1em; text-transform: uppercase; color: var(--accent-text); }
.lp-h2 { font: 800 40px/1.15 var(--lp-font); letter-spacing: -.025em; text-wrap: pretty; max-width: 720px; }
.lp-lead { font: 400 18px/1.6 var(--lp-font); color: var(--text2); text-wrap: pretty; max-width: 560px; }
.lp-card { background: var(--surface); border: 1px solid var(--border2); border-radius: 20px; box-sizing: border-box; }
.lp-obj { position: absolute; pointer-events: none; user-select: none; height: auto; }
/* Live 3D (landing3d/stage.js) laid over each image. Its first frame is the image's own pose, so the two swap in the
   same frame (no fade, which would leave a moment with neither on screen). */
.lp-3d { position: absolute; pointer-events: none; user-select: none; opacity: 0; }
.lp-3d.is-ready { opacity: var(--lp-3d-opacity, 1); }
img.lp-3d-off { visibility: hidden; }
main#main { overflow-x: clip; }

/* ---------- buttons, badges, emergency pill ---------- */
.lp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 0 24px; border-radius: 14px; font: 600 16px/1.2 var(--lp-font); border: 1px solid transparent; cursor: pointer; text-decoration: none; box-sizing: border-box; color: var(--text); white-space: nowrap; transition: background-color .15s, border-color .15s; }
.lp-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.lp-btn:focus-visible { outline: none; box-shadow: var(--focus); }
body.lp a.lp-btn-primary, .lp-btn-primary { background: var(--accent-fill); color: var(--on-accent); }
body.lp a.lp-btn-primary:hover, .lp-btn-primary:hover { background: var(--accent-fill-h); color: var(--on-accent); }
body.lp a.lp-btn-secondary, .lp-btn-secondary { background: transparent; color: var(--text); border-color: var(--border); }
body.lp a.lp-btn-secondary:hover, .lp-btn-secondary:hover { background: var(--surface2); color: var(--text); }
.lp-btn-sm { min-height: 44px; padding: 0 16px; font-size: 15px; border-radius: 10px; }

.lp-badge { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 999px; font: 600 13px/1 var(--lp-font); border: 1px solid; white-space: nowrap; box-sizing: border-box; }
.lp-badge svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; }
.lp-badge-ok { background: var(--ok-bg); color: var(--ok); border-color: var(--ok-bg); }
.lp-badge-ai { background: var(--ai-bg); color: var(--ai); border-color: var(--ai-bd); border-style: dashed; }
.lp-badge-pt { background: transparent; color: var(--pt); border-color: var(--pt-bd); }
.lp-badge-acc { background: var(--accent-soft); color: var(--accent-text); border-color: var(--accent-soft); }

body.lp a.lp-emg, .lp-emg { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px; border-radius: 999px; background: var(--danger-bg); color: var(--danger); border: 1px solid var(--danger-bd); font: 700 14px/1 var(--lp-font); text-decoration: none; white-space: nowrap; box-sizing: border-box; }
body.lp a.lp-emg:hover { color: var(--danger); border-color: var(--danger); }
.lp-emg svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

/* style.css buttons used on the news pages (pager, article call to action) follow the teal system too */
.lp .btn { min-height: 44px; border-radius: 10px; font-family: var(--lp-font); }
.lp .btn.primary { background: var(--accent-fill); border-color: var(--accent-fill); color: var(--on-accent); }
.lp .btn.primary:hover { background: var(--accent-fill-h); color: var(--on-accent); }
.lp .btn.ghost { background: transparent; border: 1px solid var(--border); color: var(--text); }
.lp .btn.ghost:hover { background: var(--surface2); color: var(--text); }

/* ---------- header ---------- */
.lp-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--border2); background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: saturate(1.3) blur(10px); -webkit-backdrop-filter: saturate(1.3) blur(10px); }
.lp-header-inner { display: flex; align-items: center; gap: 12px; min-height: 72px; max-width: 1360px; }
body.lp a.lp-logo, .lp-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--text); font: 700 18px/1.2 var(--lp-font); margin-right: 12px; white-space: nowrap; }
.lp-logo img { width: 36px; height: 36px; object-fit: contain; }
.lp-logo-sm { font-size: 16px; gap: 8px; margin: 0; }
.lp-logo-sm img { width: 28px; height: 28px; }
.lp-links { display: flex; gap: 2px; flex-wrap: wrap; }
body.lp .lp-links a { font: 500 15px/1.2 var(--lp-font); color: var(--text2); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; padding: 0 8px; border-radius: 10px; white-space: nowrap; }
body.lp .lp-links a:hover { color: var(--text); background: var(--surface2); }
body.lp .lp-links a.lp-links-login, body.lp .lp-links a.lp-links-start { display: none; }
.lp-header-cta { margin-left: auto; display: flex; gap: 10px; align-items: center; }
.lp-theme { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--border); border-radius: 10px; background: transparent; color: var(--text2); cursor: pointer; flex: none; }
.lp-theme:hover { color: var(--text); background: var(--surface2); }
.lp-theme:focus-visible { outline: none; box-shadow: var(--focus); }
.lp-menu { display: none; width: 44px; height: 44px; border: 1px solid var(--border); border-radius: 10px; background: transparent; color: var(--text); cursor: pointer; align-items: center; justify-content: center; padding: 0; }
.lp-menu svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }

/* ---------- hero ---------- */
.lp-hero { position: relative; background: var(--glow); padding: 88px 0 96px; overflow: hidden; overflow: clip; }
.lp-hero-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(480px, 100%), 1fr)); gap: 48px; align-items: center; }
.lp-hero-copy { display: flex; flex-direction: column; gap: 28px; align-items: flex-start; }
.lp-hero h1 { font: 800 60px/1.08 var(--lp-font); letter-spacing: -.03em; text-wrap: pretty; }
.lp-cta-row { display: flex; gap: 12px; flex-wrap: wrap; }
.lp-note { font: 400 14px/1.5 var(--lp-font); color: var(--text3); }
.lp-note a { font-weight: 700; }

.lp-stage { position: relative; min-height: 520px; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 620px; justify-self: center; }
.lp-o-tile { width: 118px; left: 2%; top: 0; }
.lp-o-cross { width: 54px; left: 40%; top: 36px; }
.lp-o-heart { width: 190px; right: 0; top: 10px; }
.lp-o-shield { width: 108px; right: 2%; top: 290px; }
.lp-o-steth { width: 112px; right: 6%; bottom: -10px; }
.lp-o-tablet { width: 44px; left: 4%; bottom: 40px; }
.lp-demo { position: relative; width: min(440px, 100%); margin: 70px 60px 0 0; overflow: hidden; box-shadow: var(--card-shadow); }
.lp-demo-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; padding: 14px 18px; border-bottom: 1px solid var(--border2); font: 600 15px/1.2 var(--lp-font); }
.lp-demo-head > span:first-child { white-space: nowrap; }
.lp-demo-head .lp-badge { margin-left: auto; }
.lp-demo-body { padding: 18px; display: flex; flex-direction: column; gap: 12px; font: 400 15px/1.5 var(--lp-font); }
.lp-demo-user { align-self: flex-end; max-width: 85%; background: var(--accent-soft); color: var(--text); border-radius: 14px 14px 4px 14px; padding: 10px 14px; }
.lp-demo-ai { color: var(--text2); }
.lp-demo-ai strong { color: var(--text); }
.lp-demo-warn { background: var(--danger-bg); color: var(--danger); border-radius: 10px; padding: 10px 12px; font-weight: 500; }
.lp-demo-rec { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--border2); padding-top: 12px; font-weight: 500; }

/* ---------- sections ---------- */
.lp-section { padding: 96px 0; scroll-margin-top: 72px; }
.lp-how { padding-top: 40px; }
.lp-ruled { border-top: 1px solid var(--border2); }
.lp-band { border-top: 1px solid var(--border2); border-bottom: 1px solid var(--border2); background: var(--surface); padding: 72px 0; scroll-margin-top: 72px; }
.lp-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 40px; }
.lp-split-center { align-items: center; }
.lp-split-safety { gap: 56px; align-items: center; }

.lp-steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 20px; }
.lp-step { padding: 28px; display: flex; flex-direction: column; gap: 14px; min-height: 240px; }
.lp-step img { width: 84px; height: 76px; object-fit: contain; align-self: flex-end; }
.lp-step-no { font: 700 12px/1.3 var(--lp-font); letter-spacing: .1em; color: var(--text3); }
.lp-step h3 { font: 700 22px/1.25 var(--lp-font); }
.lp-step p { font: 400 16px/1.55 var(--lp-font); color: var(--text2); }

.lp-legend { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.lp-legend li { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font: 400 16px/1.4 var(--lp-font); color: var(--text2); }
.lp-legend .lp-badge { min-width: 220px; }

.lp-safety-art { position: relative; min-height: 360px; display: flex; align-items: center; justify-content: center; }
.lp-shield { width: 260px; height: auto; filter: var(--obj-shadow); }
.lp-o-cross2 { width: 48px; left: 12%; top: 40px; }
.lp-o-tablet2 { width: 40px; right: 14%; bottom: 50px; }
.lp-lines { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.lp-lines li { display: flex; align-items: flex-start; gap: 12px; font: 500 16px/1.5 var(--lp-font); }
.lp-lines svg { width: 20px; height: 20px; margin-top: 3px; fill: none; stroke: var(--accent); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.lp-limit { border: 1px solid var(--ai-bd); border-radius: 16px; padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; color: var(--ai); }
.lp-limit strong { font: 700 15px/1.3 var(--lp-font); }
.lp-limit p { font: 400 15px/1.55 var(--lp-font); }

.lp-prices { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 20px; }
.lp-price h3 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lp-price-tag { font: 700 12px/1 var(--lp-font); padding: 5px 9px; border-radius: 999px; background: var(--accent-fill); color: var(--on-accent); }
.lp-fine { font: 400 14px/1.5 var(--lp-font); color: var(--text3); }
.lp-price { padding: 32px; display: flex; flex-direction: column; gap: 20px; }
.lp-price h3 { font: 600 16px/1.3 var(--lp-font); color: var(--text2); }
.lp-price-featured { border-color: var(--accent); }
.lp-price-featured h3 { color: var(--accent-text); }
.lp-price-value { font: 800 48px/1 var(--lp-font); letter-spacing: -.03em; color: var(--text); }
.lp-price-value small { font: 400 16px/1 var(--lp-font); color: var(--text3); letter-spacing: 0; }
.lp-price p:not(.lp-price-value) { font: 400 16px/1.55 var(--lp-font); color: var(--text2); }
.lp-price .lp-btn { margin-top: auto; align-self: flex-start; }

.lp-doctors-inner { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }
.lp-doctors-inner > img { width: 84px; height: 84px; object-fit: contain; flex: none; }
.lp-doctors-copy { display: flex; flex-direction: column; gap: 8px; flex: 1 1 420px; min-width: 0; }
.lp-doctors-copy h2 { font: 700 26px/1.25 var(--lp-font); letter-spacing: -.02em; text-wrap: pretty; }

.lp-news-more { margin-top: -16px; }

.lp-faq-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 48px; align-items: start; }
.lp-faq { display: flex; flex-direction: column; border-top: 1px solid var(--border2); }
.lp-faq details { border-bottom: 1px solid var(--border2); }
.lp-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; font: 600 17px/1.35 var(--lp-font); cursor: pointer; list-style: none; }
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary svg { width: 20px; height: 20px; fill: none; stroke: var(--text3); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.lp-faq details[open] summary svg { transform: rotate(180deg); }
.lp-faq details > div { padding: 0 0 18px; font: 400 16px/1.55 var(--lp-font); color: var(--text2); max-width: 640px; }

.lp-cta-section { padding: 0 0 96px; }
.lp-cta { position: relative; overflow: hidden; padding: 64px 48px; display: flex; flex-direction: column; gap: 16px; align-items: flex-start; background: var(--accent-fill); border-radius: 20px; }
.lp-o-cta { width: 220px; right: 40px; top: -14px; opacity: .95; }
.lp-cta h2 { position: relative; font: 800 40px/1.1 var(--lp-font); letter-spacing: -.03em; color: #ffffff; max-width: 620px; text-wrap: pretty; }
.lp-cta p { position: relative; font: 400 17px/1.5 var(--lp-font); color: #d7f1eb; max-width: 520px; }
.lp-cta .lp-cta-row { position: relative; margin-top: 8px; }
body.lp a.lp-btn-light, .lp-btn-light { background: #ffffff; color: #0f5347; }
body.lp a.lp-btn-light:hover { background: #eafaf6; color: #0f5347; }
body.lp a.lp-btn-outline, .lp-btn-outline { background: transparent; color: #ffffff; border-color: rgba(255, 255, 255, .55); }
body.lp a.lp-btn-outline:hover { background: rgba(255, 255, 255, .12); color: #ffffff; }
.lp-cta .lp-btn:focus-visible { box-shadow: 0 0 0 3px rgba(255, 255, 255, .7); }

/* ---------- footer ---------- */
.lp-footer { border-top: 1px solid var(--border2); padding: 40px 0 28px; }
.lp-footer-top { display: flex; justify-content: space-between; gap: 24px 48px; flex-wrap: wrap; }
.lp-footer-brand { display: flex; flex-direction: column; gap: 8px; max-width: 320px; }
.lp-footer-brand p { font: 400 14px/1.5 var(--lp-font); color: var(--text3); }
.lp-footer nav { display: flex; flex-direction: column; gap: 4px; }
.lp-footer h2 { font: 700 12px/1.3 var(--lp-font); letter-spacing: .1em; text-transform: uppercase; color: var(--text3); margin-bottom: 4px; }
body.lp .lp-footer nav a { font: 400 15px/1.4 var(--lp-font); color: var(--text2); text-decoration: none; min-height: 36px; display: inline-flex; align-items: center; }
body.lp .lp-footer nav a:hover { color: var(--accent-text); }
.lp-footer-bottom { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 1px solid var(--border2); padding-top: 20px; font: 400 13px/1.4 var(--lp-font); color: var(--text3); }

/* ---------- responsive ---------- */
@media (max-width: 1340px) { /* the full menu needs ~1340px since the header also holds the mode switch */
  .lp-links { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; flex-wrap: nowrap; gap: 0; background: var(--surface); border-bottom: 1px solid var(--border2); padding: 8px 16px 14px; box-shadow: var(--shadow); }
  .lp-links.open { display: flex; }
  body.lp .lp-links a { padding: 0 12px; }
  .lp-menu { display: inline-flex; }
}
@media (max-width: 1100px) {
  .lp-hero h1 { font-size: 52px; }
}
@media (max-width: 760px) {
  .lp-wrap { padding: 0 16px; }
  .lp-header-inner { min-height: 64px; gap: 8px; }
  .lp-logo { margin-right: 0; font-size: 17px; }
  .lp-logo img { width: 32px; height: 32px; }
  .lp-header-cta { gap: 8px; }
  .lp-hide-sm { display: none; }
  body.lp .lp-links a.lp-links-login { display: inline-flex; }
  .lp-hero { padding: 48px 0 56px; }
  .lp-hero-grid { gap: 32px; }
  .lp-hero-copy { gap: 22px; }
  .lp-hero h1 { font-size: 38px; line-height: 1.1; }
  .lp-lead { font-size: 17px; }
  .lp-cta-row .lp-btn { flex: 1 1 100%; }
  .lp-stage { min-height: 0; padding: 64px 0 56px; }
  .lp-o-tile { width: 72px; left: 0; top: 4px; }
  .lp-o-cross { width: 36px; left: 38%; top: 14px; }
  .lp-o-heart { width: 112px; right: -4px; top: 0; }
  .lp-o-shield { display: none; }
  .lp-o-steth { width: 76px; right: 2px; bottom: -6px; }
  .lp-o-tablet { width: 32px; left: 4px; bottom: 18px; }
  .lp-demo { margin: 0; }
  .lp-section { padding: 64px 0; }
  .lp-how { padding-top: 24px; }
  .lp-band { padding: 56px 0; }
  .lp-stack { gap: 28px; }
  .lp-h2 { font-size: 30px; line-height: 1.18; }
  .lp-step { padding: 22px; min-height: 0; }
  .lp-step img { width: 68px; height: 60px; margin-bottom: -8px; }
  .lp-legend .lp-badge { min-width: 0; }
  .lp-legend li { gap: 8px 12px; }
  .lp-safety-art { min-height: 220px; }
  .lp-shield { width: 170px; }
  .lp-price { padding: 24px; }
  .lp-price-value { font-size: 40px; }
  .lp-doctors-inner { gap: 20px; }
  .lp-doctors-inner > img { width: 64px; height: 64px; }
  .lp-doctors-copy { flex-basis: 100%; }
  .lp-doctors-copy h2 { font-size: 21px; }
  .lp-faq-grid { gap: 24px; }
  .lp-faq summary { font-size: 16px; min-height: 60px; }
  .lp-cta-section { padding-bottom: 64px; }
  .lp-cta { padding: 120px 22px 28px; }
  .lp-o-cta { width: 132px; right: 16px; top: -12px; }
  .lp-cta h2 { font-size: 30px; }
}
@media (max-width: 420px) {
  .lp-header-cta .lp-btn-primary { display: none; } /* «Эхлэх» is the first button of the hero right below */
  body.lp .lp-links a.lp-links-start { display: inline-flex; }
}
@media (prefers-reduced-motion: reduce) {
  .lp-btn, .lp-faq summary svg { transition: none; }
}
@media print {
  .lp-header, .lp-cta-section, .lp-obj, .lp-3d, .lp-footer nav { display: none; }
  img.lp-3d-off { visibility: visible; }
}