/* MARKTUN landing page — isolated 2026 redesign. */
body[data-page="landing"] {
  --bg: #030814;
  --bg-elevated: #091321;
  --surface: #0b1525;
  --surface-soft: rgba(9, 19, 33, 0.82);
  --surface-raised: #111d31;
  --text: #f7f9fc;
  --text-soft: #d8deeb;
  --muted: #aab3c5;
  --primary: #536cff;
  --primary-strong: #7167ff;
  --primary-soft: rgba(83, 108, 255, 0.14);
  --success: #57dd8a;
  --border: rgba(255, 255, 255, 0.1);
  --border-strong: rgba(255, 255, 255, 0.17);
  color-scheme: dark;
  color: var(--text);
  background: #030814;
}

body[data-page="landing"] .site-backdrop {
  background: radial-gradient(circle at 72% 10%, rgba(70, 91, 255, 0.12), transparent 28%), radial-gradient(circle at 17% 33%, rgba(24, 80, 210, 0.06), transparent 24%);
}
body[data-page="landing"] .site-header::before { background: rgba(3, 8, 20, 0.88); }
body[data-page="landing"] .page--landing { display: grid; gap: 0; padding-top: 0; }
body[data-page="landing"] .button { border-radius: 12px; font-weight: 700; }
body[data-page="landing"] .button--primary { box-shadow: 0 13px 30px rgba(63, 81, 203, 0.24); }
body[data-page="landing"] .button--secondary { border-color: rgba(216, 222, 235, 0.28); color: var(--text); background: rgba(255, 255, 255, 0.025); }
body[data-page="landing"] .button--secondary:hover { border-color: rgba(145, 161, 255, 0.65); background: rgba(83, 108, 255, 0.09); }

.mt-home-hero { position: relative; display: grid; min-height: min(720px, calc(100dvh - var(--header-height))); grid-template-columns: minmax(0, 1.03fr) minmax(390px, 0.97fr); align-items: center; gap: clamp(44px, 7vw, 96px); padding: clamp(70px, 8vw, 112px) 0 56px; }
.mt-home-hero__copy { position: relative; z-index: 3; }
.mt-home-hero h1 { max-width: 12.2ch; margin: 0; font-size: clamp(3.2rem, 5.4vw, 5.2rem); font-weight: 730; letter-spacing: -0.062em; line-height: 0.98; }
.mt-home-hero h1 span { color: #aebcff; }
.mt-home-hero__lead { max-width: 590px; margin: 27px 0 0; color: #bdc6d6; font-size: clamp(1rem, 1.35vw, 1.12rem); line-height: 1.68; }
.mt-home-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 32px; }
.mt-home-actions__primary { min-width: 250px; }
.mt-home-actions__secondary { gap: 9px; }
.mt-home-actions__secondary svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.mt-home-notes { display: flex; flex-wrap: wrap; gap: 24px; margin: 25px 0 0; padding: 0; list-style: none; }
.mt-home-notes li { display: flex; align-items: center; gap: 8px; color: #9ba7ba; font-size: 0.84rem; }
.mt-home-notes svg { width: 18px; fill: none; stroke: #8da0ff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.mt-home-hero__visual { position: relative; display: grid; min-height: 540px; place-items: center; }
.mt-home-hero__visual::before { content: ""; position: absolute; width: 470px; height: 470px; border-radius: 50%; background: radial-gradient(circle, rgba(77, 91, 255, 0.22), rgba(42, 66, 201, 0.06) 49%, transparent 70%); filter: blur(15px); }
.mt-home-route { position: absolute; inset: 0; width: 100%; height: 100%; fill: #5d75ff; stroke: rgba(83, 108, 255, 0.28); stroke-width: 1.6; stroke-dasharray: 5 9; }
.mt-home-phone { position: relative; z-index: 2; width: min(318px, 76vw); min-height: 548px; padding: 36px 20px 22px; border: 1px solid rgba(255, 255, 255, 0.19); border-radius: 42px; background: linear-gradient(155deg, #121d31, #050b17 46%, #091321); box-shadow: 0 40px 100px rgba(0, 0, 0, 0.62), inset 0 0 0 5px rgba(255, 255, 255, 0.025); transform: rotate(1.5deg); }
.mt-home-phone__island { position: absolute; top: 11px; left: 50%; width: 88px; height: 20px; border-radius: 20px; background: #02050c; translate: -50% 0; }
.mt-home-phone__bar { display: flex; align-items: center; justify-content: space-between; color: #dde4f1; font-size: 0.75rem; letter-spacing: 0.08em; }
.mt-home-phone__bar span { color: #65738d; letter-spacing: 0.15em; }
.mt-home-phone__status { display: grid; justify-items: center; gap: 5px; margin-top: 39px; text-align: center; }
.mt-home-phone__status span { color: var(--success); font-size: 0.82rem; font-weight: 700; }
.mt-home-phone__status small { max-width: 28ch; color: #8996aa; font-size: 0.65rem; line-height: 1.45; }
.mt-home-power { display: grid; width: 156px; height: 156px; margin: 25px auto 27px; place-items: center; border: 1px solid rgba(120, 136, 255, 0.38); border-radius: 50%; background: rgba(68, 84, 255, 0.07); box-shadow: 0 0 56px rgba(76, 86, 255, 0.27); }
.mt-home-power span { display: grid; width: 116px; height: 116px; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #466aff, #6e61ff); box-shadow: inset 0 1px rgba(255, 255, 255, 0.28), 0 18px 44px rgba(55, 61, 220, 0.42); }
.mt-home-power svg { width: 39px; fill: none; stroke: white; stroke-width: 1.7; stroke-linecap: round; }
.mt-home-location { display: flex; min-height: 60px; align-items: center; gap: 11px; padding: 10px 12px; border: 1px solid rgba(145, 161, 255, 0.35); border-radius: 14px; background: rgba(255, 255, 255, 0.035); }
.mt-home-location__icon { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 10px; background: rgba(83, 108, 255, 0.15); }
.mt-home-location__icon svg { width: 18px; fill: none; stroke: #98a8ff; stroke-width: 1.6; }
.mt-home-location div { display: grid; flex: 1; }
.mt-home-location strong { color: #e9edf6; font-size: 0.75rem; }
.mt-home-location small { color: #8190a8; font-size: 0.63rem; }
.mt-home-location__arrow { width: 16px; fill: none; stroke: #8895a9; stroke-width: 1.7; }
.mt-home-traffic { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.mt-home-traffic div { display: grid; grid-template-columns: auto 1fr; gap: 0 7px; padding: 11px; border-radius: 12px; background: rgba(255, 255, 255, 0.03); }
.mt-home-traffic div > span { grid-row: 1 / 3; font-weight: 800; }
.mt-home-traffic strong { color: #dde4ef; font-size: 0.67rem; }
.mt-home-traffic small { color: #6f7e96; font-size: 0.59rem; }
.mt-home-traffic__down { color: var(--success); }
.mt-home-traffic__up { color: #8395ff; }
.mt-home-float { position: absolute; z-index: 4; display: flex; min-width: 164px; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 15px; background: #101a2c; box-shadow: 0 20px 46px rgba(0, 0, 0, 0.42); }
.mt-home-float div { display: grid; }
.mt-home-float strong { color: #edf1f8; font-size: 0.78rem; }
.mt-home-float small { color: #8290a5; font-size: 0.65rem; }
.mt-home-float__icon { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; background: rgba(83, 108, 255, 0.15); }
.mt-home-float__icon svg { width: 17px; fill: none; stroke: #95a5ff; stroke-width: 1.8; }
.mt-home-float--auto { top: 22%; left: -4%; }
.mt-home-float--online { right: -5%; bottom: 16%; }
.mt-home-float--online > span { width: 9px; height: 9px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 5px rgba(87, 221, 138, 0.11); }

.mt-home-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--border); border-radius: 18px; background: var(--border); }
.mt-home-strip > div { display: flex; min-height: 112px; align-items: center; gap: 13px; padding: 20px; background: rgba(7, 15, 28, 0.97); }
.mt-home-strip svg { flex: 0 0 auto; width: 25px; fill: none; stroke: #738aff; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.mt-home-strip span { display: grid; gap: 2px; }
.mt-home-strip strong { color: #e8edf6; font-size: 0.86rem; }
.mt-home-strip small { color: #8d9aaf; font-size: 0.72rem; }

.mt-home-section { padding: clamp(82px, 9vw, 126px) 0; border-bottom: 1px solid var(--border); }
.mt-home-heading { max-width: 680px; }
.mt-home-heading h2, .mt-home-support h2 { margin: 0; font-size: clamp(2rem, 3.8vw, 3.15rem); font-weight: 680; letter-spacing: -0.052em; }
.mt-home-heading p { margin: 14px 0 0; color: #9da9bb; font-size: 0.97rem; }
.mt-home-heading--center { margin-inline: auto; text-align: center; }
.mt-home-feature-grid { display: grid; grid-template-columns: 1.15fr 0.85fr 0.85fr 1.15fr; gap: 12px; margin-top: 43px; }
.mt-home-feature { display: flex; min-height: 255px; flex-direction: column; padding: 28px; border: 1px solid var(--border); border-radius: 19px; background: linear-gradient(150deg, rgba(17, 29, 49, 0.9), rgba(7, 15, 28, 0.88)); transition: border-color 180ms ease, transform 180ms ease, background 180ms ease; }
.mt-home-feature:hover { border-color: rgba(122, 142, 255, 0.34); transform: translateY(-3px); }
.mt-home-feature--primary { background: radial-gradient(circle at 12% 5%, rgba(83, 108, 255, 0.17), transparent 45%), #0a1526; }
.mt-home-feature--support { background: radial-gradient(circle at 100% 100%, rgba(83, 108, 255, 0.13), transparent 50%), #0a1424; }
.mt-home-feature__icon { display: grid; width: 47px; height: 47px; margin-bottom: auto; place-items: center; border-radius: 14px; color: #9cabff; background: rgba(83, 108, 255, 0.14); }
.mt-home-feature__icon svg { width: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.mt-home-feature h3 { margin: 28px 0 8px; color: #eef2f8; font-size: 1.06rem; }
.mt-home-feature p { margin: 0; color: #929fb3; font-size: 0.87rem; line-height: 1.58; }
.mt-home-feature a { display: inline-flex; gap: 7px; margin-top: 15px; color: #a9b6ff; font-size: 0.82rem; font-weight: 700; text-decoration: none; }
.mt-home-feature a:hover { color: white; }

.mt-home-steps { border-bottom: 0; }
.mt-home-step-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 42px 0 0; padding: 0; list-style: none; }
.mt-home-step-list li { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; min-height: 145px; padding: 28px 32px 28px 0; border-top: 1px solid var(--border-strong); }
.mt-home-step-list li + li { padding-left: 32px; }
.mt-home-step-list li > span { color: #7890ff; font-size: 0.82rem; font-weight: 800; }
.mt-home-step-list h3 { margin: 0 0 8px; color: #eef2f8; font-size: 1rem; }
.mt-home-step-list p { margin: 0; color: #8f9daf; font-size: 0.84rem; line-height: 1.55; }
.mt-home-step-list svg { align-self: center; width: 20px; fill: none; stroke: #53627a; stroke-width: 1.5; }

.mt-home-pricing { padding: clamp(32px, 4vw, 48px); border: 1px solid rgba(111, 131, 255, 0.26); border-radius: 23px; background: radial-gradient(circle at 88% 10%, rgba(83, 108, 255, 0.12), transparent 33%), linear-gradient(145deg, #0b172a, #07101e 62%); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3); }
.mt-home-pricing__head { display: flex; align-items: end; justify-content: space-between; gap: 28px; }
.mt-home-price { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.mt-home-price strong { color: #f7f9fc; font-size: clamp(2.25rem, 4vw, 3.5rem); letter-spacing: -0.055em; }
.mt-home-price span { color: #8592a7; }
.mt-home-plan { margin-top: 30px; padding: 24px; border: 1px solid var(--border); border-radius: 17px; background: rgba(3, 8, 20, 0.44); }
.mt-home-plan__intro { display: grid; gap: 4px; }
.mt-home-plan__intro strong { color: #eef2f8; font-size: 1.05rem; }
.mt-home-plan__intro span { color: #8f9caf; font-size: 0.82rem; }
.mt-home-plan ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 32px; margin: 25px 0; padding: 22px 0; border-block: 1px solid var(--border); list-style: none; }
.mt-home-plan li { color: #bec7d6; font-size: 0.88rem; }
.mt-home-plan li::before { content: "✓"; margin-right: 10px; color: var(--success); font-weight: 800; }
.mt-home-plan__action { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.mt-home-plan__action > div { display: grid; }
.mt-home-plan__action strong { color: #ecf0f7; }
.mt-home-plan__action span { color: #8390a4; font-size: 0.78rem; }

.mt-home-support { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 22px; margin-top: 24px; padding: 31px 34px; border: 1px solid rgba(89, 113, 255, 0.23); border-radius: 20px; background: linear-gradient(105deg, rgba(40, 67, 190, 0.25), rgba(10, 22, 44, 0.88) 50%, rgba(48, 45, 145, 0.18)); }
.mt-home-support__icon { display: grid; width: 54px; height: 54px; place-items: center; border-radius: 16px; color: #b8c5ff; background: rgba(83, 108, 255, 0.16); }
.mt-home-support__icon svg { width: 27px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.mt-home-support h2 { font-size: clamp(1.65rem, 3vw, 2.3rem); }
.mt-home-support p { margin: 7px 0 0; color: #9ba8ba; }

@media (max-width: 1080px) {
  .mt-home-hero { grid-template-columns: minmax(0, 1fr) minmax(330px, 0.75fr); gap: 28px; }
  .mt-home-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mt-home-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .mt-home-hero { min-height: auto; grid-template-columns: 1fr; padding-top: 62px; text-align: center; }
  .mt-home-hero__copy { display: grid; justify-items: center; }
  .mt-home-actions, .mt-home-notes { justify-content: center; }
  .mt-home-hero__visual { min-height: 515px; }
  .mt-home-step-list { grid-template-columns: 1fr; }
  .mt-home-step-list li, .mt-home-step-list li + li { min-height: 0; padding: 24px 0; }
  .mt-home-step-list li svg { display: none; }
}
@media (max-width: 640px) {
  .mt-home-hero { gap: 24px; padding: 44px 0 34px; }
  .mt-home-hero h1 { max-width: 12ch; font-size: clamp(2.55rem, 12.4vw, 3.55rem); }
  .mt-home-hero__lead { margin-top: 19px; font-size: 0.95rem; }
  .mt-home-actions { display: grid; width: 100%; margin-top: 25px; }
  .mt-home-actions .button { width: 100%; }
  .mt-home-notes { display: grid; gap: 10px; margin-top: 20px; }
  .mt-home-hero__visual { min-height: 445px; overflow: clip; }
  .mt-home-phone { width: min(264px, 78vw); min-height: 430px; padding: 31px 15px 16px; border-radius: 34px; transform: none; }
  .mt-home-phone__status { margin-top: 25px; }
  .mt-home-power { width: 116px; height: 116px; margin: 17px auto 18px; }
  .mt-home-power span { width: 86px; height: 86px; }
  .mt-home-power svg { width: 31px; }
  .mt-home-float { display: none; }
  .mt-home-strip { grid-template-columns: 1fr; }
  .mt-home-strip > div { min-height: 86px; padding: 17px 18px; }
  .mt-home-section { padding: 72px 0; }
  .mt-home-heading h2 { font-size: 2.15rem; }
  .mt-home-feature-grid { grid-template-columns: 1fr; margin-top: 31px; }
  .mt-home-feature { min-height: 210px; padding: 23px; }
  .mt-home-pricing { padding: 25px 18px; border-radius: 20px; }
  .mt-home-pricing__head, .mt-home-plan__action { align-items: flex-start; flex-direction: column; }
  .mt-home-plan { padding: 19px 16px; }
  .mt-home-plan ul { grid-template-columns: 1fr; }
  .mt-home-plan__action .button { width: 100%; }
  .mt-home-support { grid-template-columns: auto minmax(0, 1fr); gap: 15px; padding: 22px 18px; }
  .mt-home-support .button { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 390px) {
  .mt-home-hero h1 { font-size: 2.45rem; }
  .mt-home-phone { width: min(248px, 77vw); }
  .mt-home-traffic strong { font-size: 0.62rem; }
  .mt-home-support__icon { width: 48px; height: 48px; }
}
@media (prefers-reduced-motion: reduce) { .mt-home-feature { transition: none; } }
