:root {
  --ink: #092430;
  --deep: #071b27;
  --navy: #0b3446;
  --cyan: #6ee1da;
  --teal: #008e98;
  --coral: #fa805a;
  --lime: #daf482;
  --paper: #f5f8f7;
  --white: #fff;
  --muted: #597078;
  --line: #d6e0df;
  color: var(--ink);
  background: var(--paper);
  font-family: "Avenir Next", Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
p, h1, h2, h3, figure { margin: 0; }
p { line-height: 1.55; }
h1, h2, h3 { letter-spacing: 0; }
h2 { font-size: 4rem; line-height: 1.07; font-weight: 760; }
h2 em { font-style: normal; color: var(--teal); }
.container { width: min(calc(100% - 56px), 1264px); margin-inline: auto; }
.section { padding: clamp(82px, 8vw, 130px) 0; }
.skip-link { position: fixed; z-index: 80; left: 16px; top: -70px; padding: 12px 16px; background: #fff; border: 2px solid var(--teal); }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 3px solid var(--coral); outline-offset: 4px; }
.kicker { margin-bottom: 21px; color: var(--teal); font-size: .73rem; line-height: 1.35; font-weight: 850; letter-spacing: .12em; }
.kicker-light { color: #9ce9e3; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 26px; min-height: 52px; padding: 13px 19px; border: 1px solid transparent; border-radius: 5px; font-size: .9rem; line-height: 1.15; font-weight: 800; transition: background .22s, color .22s, transform .22s, box-shadow .22s; }
.button:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(4,29,37,.16); }
.button span, .text-action span, .hero-link span { transition: transform .22s; }
.button:hover span, .text-action:hover span { transform: translate(3px,-3px); }
.button-dark { color: #fff; background: var(--ink); }
.button-dark:hover { background: #1a4756; }
.button-cyan { color: var(--deep); background: var(--cyan); }
.button-cyan:hover { background: #a7f5ed; }
.text-action { display: inline-flex; align-items: center; justify-content: space-between; gap: 32px; padding: 8px 0; border: 0; border-bottom: 1px solid currentColor; background: transparent; color: var(--ink); font-size: .88rem; font-weight: 820; text-align: left; }
.text-action:hover { color: var(--teal); }
.text-action-light { color: #a9eee8; }
.text-action-light:hover { color: #fff; }

.site-header { position: sticky; z-index: 50; top: 0; border-bottom: 1px solid #dce7e5; background: rgba(255,255,255,.97); backdrop-filter: blur(15px); }
.header-inner { display: flex; align-items: center; gap: 23px; min-height: 74px; }
.brand { display: flex; align-items: center; flex: none; width: 155px; height: 48px; }
.brand img { width: 100%; height: auto; object-fit: contain; }
.desktop-nav { display: flex; align-items: center; gap: 16px; margin-inline: auto; }
.desktop-nav a { font-size: .82rem; font-weight: 735; white-space: nowrap; }
.desktop-nav a { color: #37545c; }
.desktop-nav a:hover { color: var(--teal); }
.header-actions { display: flex; align-items: center; gap: 8px; }
.access-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 12px; border: 1px solid #cbdcda; border-radius: 5px; background: #fff; color: var(--ink); font-size: .78rem; font-weight: 760; line-height: 1.2; white-space: nowrap; transition: border-color .2s, background-color .2s, color .2s; }
.access-button span { color: var(--teal); font-size: 1.05rem; line-height: 1; }
.access-button:hover { border-color: var(--teal); background: #eaf8f6; color: var(--deep); }
.access-button:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
.header-actions .button { min-height: 42px; padding: 10px 14px; gap: 10px; font-size: .78rem; }
.menu-toggle { display: none; width: 44px; height: 44px; margin-left: auto; padding: 0; place-content: center; gap: 5px; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.menu-toggle span { display: block; width: 19px; height: 2px; background: var(--ink); }
.mobile-menu[hidden] { display: none; }
.mobile-menu { display: none; }

.hero { position: relative; isolation: isolate; width: min(calc(100% - 28px), 1560px); height: clamp(570px, 69svh, 675px); min-height: 570px; margin: 14px auto 0; overflow: hidden; border-radius: 12px; color: #fff; background: var(--deep); }
.hero:before { content: ''; position: absolute; inset: 28px; border: 1px solid rgba(110,225,218,.13); border-radius: 4px; pointer-events: none; }
.hero-content { position: relative; display: flex; align-items: center; height: 100%; }
.hero-copy { position: relative; z-index: 2; width: 100%; min-width: 0; max-width: 650px; padding-bottom: 24px; }
.live-indicator { display: inline-block; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background: var(--coral); vertical-align: 1px; box-shadow: 0 0 0 5px rgba(250,128,90,.18); }
.hero h1 { max-width: 700px; margin-bottom: 25px; font-size: 5.2rem; font-weight: 790; line-height: .99; text-wrap: balance; }
.hero-description { max-width: 535px; color: #d7e8e8; font-size: 1.12rem; }
.hero-actions { display: flex; align-items: center; gap: 27px; margin-top: 31px; flex-wrap: wrap; }
.hero-link { display: inline-flex; gap: 15px; align-items: center; padding: 8px 0; border-bottom: 1px solid #8ec7cb; font-size: .89rem; font-weight: 780; }
.hero-link:hover span { transform: translateY(4px); }
.hero-stage { position: absolute; right: -4%; top: 50%; width: min(58%, 750px); height: 445px; transform: translateY(-50%); }
.hero-stage-line { position: absolute; display: block; border: 1px solid rgba(110,225,218,.22); pointer-events: none; }
.hero-stage-line-top { top: -20px; right: 5%; width: 72%; height: 52%; border-bottom: 0; }
.hero-stage-line-bottom { right: -5%; bottom: -14px; width: 63%; height: 42%; border-top: 0; }
.hero-console { position: absolute; top: 42px; left: 0; width: 91%; transform: rotate(-4deg); }
.hero-console:hover { transform: rotate(-2deg) translateY(-5px); }
.hero-phone { position: absolute !important; z-index: 1; right: 2%; bottom: -2px; width: clamp(164px, 16vw, 215px); transform: rotate(5deg); box-shadow: 0 22px 72px rgba(0,0,0,.45) !important; }
.hero-stage-caption { position: absolute; left: 5%; bottom: 0; display: flex; gap: 9px; color: #b3d3d6; font-size: .6rem; font-weight: 850; letter-spacing: .12em; white-space: nowrap; }
.hero-stage-caption b { color: var(--coral); }
.hero-stage-caption i { color: var(--cyan); font-style: normal; }
.hero-index { position: absolute; right: auto; bottom: 22px; left: 3.5%; display: flex; gap: 28px; color: #9fb9bf; font-size: .65rem; font-weight: 790; letter-spacing: .12em; }
.system-rail { border-bottom: 1px solid #cfdcda; background: #e7f0ee; }
.system-rail > .container { display: flex; justify-content: space-between; gap: 18px; min-height: 64px; align-items: center; color: #39626a; font-size: .67rem; font-weight: 850; letter-spacing: .08em; }
.system-rail span:first-child { color: var(--teal); }

.section-intro { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(270px,.65fr); align-items: end; gap: 50px; margin-bottom: 48px; }
.section-intro h2 { max-width: 820px; }
.section-intro > p { max-width: 360px; margin-bottom: 4px; color: var(--muted); font-size: 1.03rem; }
.product-section { background: var(--paper); }
.product-switch { display: flex; gap: 0; width: fit-content; margin-bottom: 0; border: 1px solid #b9cdcd; border-bottom: 0; border-radius: 7px 7px 0 0; overflow: hidden; }
.product-tab { min-width: 180px; min-height: 46px; padding: 10px 19px; border: 0; background: #e6efee; color: #476269; font-weight: 760; text-align: left; }
.product-tab + .product-tab { border-left: 1px solid #b9cdcd; }
.product-tab.active { background: var(--deep); color: #fff; }
.product-tab span { margin-right: 12px; color: var(--teal); font-size: .72rem; }
.product-tab.active span { color: var(--cyan); }
.product-panel { display: grid; grid-template-columns: minmax(0,1.62fr) minmax(260px,.68fr); min-height: 500px; border: 1px solid #b9cdcd; border-radius: 0 7px 7px 7px; background: #fff; }
.product-panel[hidden] { display: none; }
.product-stage { display: flex; align-items: center; justify-content: center; min-width: 0; overflow: hidden; padding: clamp(25px,4vw,60px); background-color: #092c3b; background-image: linear-gradient(rgba(114,221,213,.075) 1px, transparent 1px), linear-gradient(90deg, rgba(114,221,213,.075) 1px, transparent 1px); background-size: 36px 36px; }
.product-stage-coach .device-browser { width: min(100%, 810px); transform: rotate(-2deg); }
.product-stage-student { gap: 38px; }
.student-showcase-phone { width: min(36%, 215px); transform: rotate(-5deg); }
.student-showcase-phone.second-phone { transform: rotate(5deg) translateY(24px); }
.product-panel-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(30px,4vw,52px); }
.section-number { margin-bottom: 28px; color: var(--teal); font-size: .72rem; font-weight: 840; letter-spacing: .1em; }
.product-panel-copy h3 { max-width: 350px; margin-bottom: 22px; font-size: 2.1rem; line-height: 1.12; }
.product-panel-copy p { max-width: 360px; margin-bottom: 32px; color: var(--muted); }
.device-browser { display: block; padding: 0; overflow: hidden; border: 1px solid #607b87; border-radius: 9px; background: #fff; box-shadow: 0 30px 65px rgba(0,0,0,.3); text-align: left; transition: transform .45s, box-shadow .3s; }
.device-browser:hover { box-shadow: 0 36px 78px rgba(0,0,0,.38); }
.browser-bar { display: flex; align-items: center; gap: 5px; height: 31px; padding-inline: 12px; background: #e8eeee; }
.browser-bar i { width: 6px; height: 6px; border-radius: 50%; background: #a8bdbc; }
.browser-bar i:first-child { background: var(--coral); }
.browser-bar span { margin-left: 12px; color: #4d6b71; font-size: .55rem; font-weight: 800; letter-spacing: .1em; }
.device-browser img { display: block; width: 100%; height: auto; }
.device-phone { display: block; position: relative; overflow: hidden; padding: 6px; border: 4px solid #1d313b; border-radius: 31px; background: #111b21; box-shadow: 0 20px 52px rgba(0,0,0,.26); transition: transform .4s, box-shadow .4s; }
.device-phone:hover { box-shadow: 0 25px 60px rgba(0,0,0,.4); }
.device-phone img { display: block; width: 100%; height: auto; border-radius: 23px; }
.device-phone-top { position: absolute; z-index: 1; top: 6px; left: 50%; width: 27%; height: 12px; border-radius: 0 0 9px 9px; background: #111b21; transform: translateX(-50%); }
.preview-button { cursor: zoom-in; }

.workflow-section { position: relative; isolation: isolate; overflow: hidden; color: #fff; background: var(--navy); }
.workflow-photo, .workflow-overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.workflow-photo { z-index: -2; object-fit: cover; object-position: center 45%; }
.workflow-overlay { z-index: -1; background: linear-gradient(90deg, rgba(5,29,39,.95), rgba(5,29,39,.83) 52%, rgba(5,29,39,.54)); }
.workflow-heading h2 { max-width: 850px; }
.workflow-line { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 38px; margin-top: 67px; border-top: 1px solid #4d7580; }
.workflow-line article { position: relative; padding-top: 30px; }
.workflow-line article:before { content: ''; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--cyan); }
.workflow-line article + article { border-left: 1px solid #4d7580; padding-left: 38px; }
.workflow-line article + article:before { left: 38px; }
.workflow-line span { color: var(--cyan); font-size: .72rem; font-weight: 850; letter-spacing: .1em; }
.workflow-line h3 { margin: 25px 0 8px; font-size: 1.58rem; }
.workflow-line p { max-width: 330px; color: #c1d9dc; }

.feature-section { overflow: hidden; }
.feature-layout { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); align-items: center; gap: 8%; min-height: 520px; }
.feature-layout.reverse .feature-copy { order: 2; }
.feature-layout.reverse .feature-visual { order: 1; }
.feature-copy { max-width: 550px; }
.feature-copy h2 { margin-bottom: 24px; }
.feature-copy > p:not(.kicker) { max-width: 490px; color: var(--muted); font-size: 1.06rem; }
.feature-facts { display: grid; gap: 0; margin: 34px 0 25px; border-top: 1px solid var(--line); }
.feature-facts > div { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: .9rem; }
.feature-facts strong { font-weight: 820; }
.feature-facts span { color: var(--muted); text-align: right; }
.feature-visual { position: relative; display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 480px; }
.coach-feature { background: #fff; }
.coach-visual { padding: 42px 0 54px 45px; }
.coach-visual:before { content: ''; position: absolute; inset: 0 -300px 0 0; background: #e2f0ed; }
.coach-visual .device-browser { position: relative; width: min(100%, 700px); transform: rotate(2deg); }
.coach-visual .device-browser:hover { transform: rotate(0); }
.visual-caption { position: absolute; right: 10px; bottom: 6px; color: #527079; font-size: .62rem; font-weight: 830; letter-spacing: .09em; }
.visual-caption b { color: var(--teal); }
.training-feature { color: #fff; background: #0c2d3b url('training-v2.jpg') center / cover no-repeat; background-image: linear-gradient(90deg, rgba(7,27,39,.97), rgba(7,27,39,.8) 50%, rgba(7,27,39,.36)), url('training-v2.jpg'); }
.training-feature .feature-copy h2 em { color: var(--cyan); }
.training-feature .feature-copy > p:not(.kicker), .training-feature .feature-facts span { color: #b4ced2; }
.training-feature .feature-facts, .training-feature .feature-facts > div { border-color: #416574; }
.training-visual, .nutrition-visual { min-height: 610px; isolation: isolate; }
.training-visual:before, .nutrition-visual:before { content: ''; position: absolute; inset: 15px 16% 16px 8%; z-index: -1; border: 1px solid #3c6573; transform: rotate(-5deg); }
.feature-phone { width: min(45%, 255px); transform: rotate(-4deg); }
.feature-phone:hover { transform: rotate(0) translateY(-5px); }
.visual-number { position: absolute; top: 20px; right: 6%; color: rgba(136,229,218,.14); font-size: 11rem; font-weight: 850; line-height: 1; }
.training-visual .visual-caption { bottom: 15px; color: #a1c7cb; }
.nutrition-feature { background: #eaf3ee; }
.nutrition-visual:before { border-color: #b2d2ce; transform: rotate(5deg); }
.nutrition-visual .visual-number { color: rgba(0,142,152,.1); }

.capabilities-section { background: #fff; }
.capability-list { border-top: 1px solid #bfd0d0; }
.capability-list article { display: grid; grid-template-columns: 76px minmax(0,1fr) 190px; align-items: center; gap: 26px; min-height: 133px; border-bottom: 1px solid #bfd0d0; transition: padding .3s, background .3s; }
.capability-list article:hover { padding-inline: 15px; background: #f3f8f7; }
.capability-index { color: var(--teal); font-size: .8rem; font-weight: 850; }
.capability-list h3 { margin-bottom: 6px; font-size: 1.5rem; }
.capability-list p { color: var(--muted); font-size: .93rem; }
.capability-type { color: #769096; font-size: .7rem; font-weight: 830; text-align: right; letter-spacing: .1em; }

.brand-section { color: #fff; background: #0c3b4c; }
.brand-layout { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); align-items: center; gap: 9%; }
.brand-copy h2 { max-width: 720px; margin-bottom: 23px; }
.brand-copy h2 em { color: var(--cyan); }
.brand-copy > p:not(.kicker) { max-width: 510px; margin-bottom: 28px; color: #c4dcdf; font-size: 1.06rem; }
.brand-visual { display: flex; flex-direction: column; justify-content: space-between; min-height: 335px; padding: 29px; border: 1px solid #4d8190; border-radius: 7px; background: #0a3040; }
.brand-visual-label { color: #9adfdf; font-size: .69rem; font-weight: 850; letter-spacing: .12em; }
.brand-visual img { width: min(85%, 350px); height: auto; }
.brand-bars { display: flex; gap: 9px; }
.brand-bars i { width: 44px; height: 7px; background: var(--cyan); }
.brand-bars i:nth-child(2) { background: var(--coral); }
.brand-bars i:nth-child(3) { background: var(--lime); }
.brand-visual small { color: #a0c4c9; font-size: .78rem; }

.faq-section { background: #f5f8f7; }
.faq-layout { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); gap: 10%; }
.faq-layout h2 { max-width: 430px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { position: relative; display: block; padding: 22px 35px 22px 0; font-size: 1.03rem; font-weight: 780; list-style: none; cursor: pointer; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary:after { content: '+'; position: absolute; top: 16px; right: 2px; color: var(--teal); font-size: 1.6rem; font-weight: 400; }
.faq-list details[open] summary:after { content: '−'; }
.faq-list p { max-width: 640px; margin: -4px 0 24px; color: var(--muted); }

.contact-section { color: #fff; background: var(--deep); }
.contact-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 9%; align-items: center; }
.contact-copy { min-width: 0; }
.contact-photo { width: 100%; height: clamp(220px,20vw,280px); margin-bottom: 37px; object-fit: cover; object-position: 70% 28%; border-radius: 5px; }
.contact-copy h2 { margin-bottom: 24px; font-size: clamp(2.8rem,3.5vw,3.5rem); }
.contact-copy > p:not(.kicker) { max-width: 470px; color: #bfd6d9; font-size: 1.04rem; }
.contact-steps { display: grid; gap: 13px; margin-top: 56px; padding-top: 22px; border-top: 1px solid #4b6570; color: #9adfdd; font-size: .7rem; font-weight: 830; letter-spacing: .1em; }
.lead-form { padding: clamp(25px,3vw,38px); border: 1px solid #adc5c9; border-radius: 7px; background: #fff; color: var(--ink); }
.lead-form h3 { margin-bottom: 26px; font-size: 1.55rem; }
.lead-form label { display: block; margin-bottom: 17px; font-size: .82rem; font-weight: 770; }
.lead-form input, .lead-form select, .lead-form textarea { display: block; width: 100%; min-height: 47px; margin-top: 8px; padding: 11px 12px; border: 1px solid #bfd0d1; border-radius: 4px; outline: none; background: #fff; color: var(--ink); font-size: .9rem; }
.lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px #c8f3ed; }
.lead-form textarea { resize: vertical; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.optional { color: #6c8288; font-weight: 500; }
.form-submit { width: 100%; margin-top: 4px; }
.privacy-note { margin-top: 14px; color: #6a7d83; font-size: .76rem; }
.form-message { margin-top: 18px; padding: 12px; border-radius: 4px; font-size: .85rem; }
.form-message.success { color: #08563a; background: #e4f6eb; }
.form-message.error { color: #913c29; background: #fff1ea; }
.honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.site-footer { color: #d7e8e8; background: #051620; }
.footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; padding-block: 66px 52px; }
.footer-top img { width: 180px; height: auto; margin-bottom: 14px; }
.footer-top p { max-width: 275px; color: #a2bfc4; font-size: .88rem; }
.footer-top h3 { margin-bottom: 15px; color: #81d9d3; font-size: .8rem; }
.footer-top a { display: block; width: fit-content; padding-block: 6px; font-size: .86rem; }
.footer-top a:hover { color: var(--cyan); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-block: 23px 27px; border-top: 1px solid #31515f; color: #9db9be; font-size: .78rem; }

.preview-dialog { width: min(calc(100% - 28px), 1180px); max-width: none; max-height: min(92dvh, 940px); padding: 0; overflow: hidden; border: 1px solid #537280; border-radius: 9px; background: #071b27; color: #fff; box-shadow: 0 40px 90px rgba(0,0,0,.35); }
.preview-dialog::backdrop { background: rgba(3,17,23,.86); backdrop-filter: blur(8px); }
.preview-shell { display: flex; flex-direction: column; max-height: min(92dvh, 940px); }
.preview-header { display: flex; justify-content: space-between; gap: 24px; padding: 20px 24px 16px; border-bottom: 1px solid #34525e; }
.preview-header span { color: var(--cyan); font-size: .63rem; font-weight: 850; letter-spacing: .11em; }
.preview-header h2 { margin-top: 5px; font-size: 1.43rem; }
.preview-header p { margin-top: 4px; color: #adc8cd; font-size: .86rem; }
.preview-close { flex: none; width: 36px; height: 36px; border: 1px solid #668692; border-radius: 4px; background: transparent; color: #fff; font-size: 1.7rem; line-height: 1; }
.preview-image-wrap { display: flex; justify-content: center; align-items: flex-start; min-height: 0; overflow: auto; padding: 18px; background: #0d2b38; }
.preview-image-wrap img { width: auto; max-width: 100%; max-height: calc(92dvh - 190px); object-fit: contain; }
.preview-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 24px; border-top: 1px solid #34525e; }
.preview-controls button { min-height: 34px; border: 0; background: transparent; color: #c0e9e5; font-size: .86rem; font-weight: 750; }
.preview-controls button:hover { color: #fff; }
.preview-controls span { color: #86aeb5; font-size: .77rem; }

@media (max-width: 1230px) {
  .desktop-nav, .header-actions { display: none; }
  .menu-toggle { display: grid; }
  .mobile-menu { display: block; padding: 14px 28px 26px; border-top: 1px solid var(--line); background: #fff; }
  .mobile-menu > a:not(.button) { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--line); font-weight: 750; }
  .mobile-access { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 14px 0 20px; }
  .mobile-access .access-button { justify-content: space-between; min-width: 0; min-height: 46px; padding: 11px 14px; }
  .mobile-menu > .button { width: 100%; }
  .hero-stage { right: -3%; width: 57%; }
  .hero h1 { font-size: 4.3rem; }
  h2 { font-size: 3.5rem; }
}
@media (max-width: 950px) {
  .hero h1 { max-width: 600px; font-size: 3.2rem; }
  .hero-stage { top: 56%; right: -3%; width: 54%; height: 345px; }
  .hero-phone { right: 1%; width: 135px; }
  .hero-copy { max-width: 48%; }
  .section-intro { grid-template-columns: 1fr; gap: 22px; }
  .section-intro > p { max-width: 600px; }
  .product-panel { grid-template-columns: 1fr; }
  .product-stage { min-height: 470px; }
  .product-panel-copy { padding: 30px; }
  .product-panel-copy h3, .product-panel-copy p { max-width: 640px; }
  .feature-layout { gap: 5%; }
  .feature-copy h2 { font-size: 2.5rem; }
  .feature-facts > div { flex-direction: column; gap: 2px; }
  .feature-facts span { text-align: left; }
  .brand-layout { gap: 5%; }
  h2 { font-size: 3rem; }
}
@media (max-width: 700px) {
  .container { width: min(calc(100% - 36px), 1264px); }
  .section { padding: 76px 0; }
  .hero { width: calc(100% - 18px); height: min(79svh, 700px); min-height: 640px; margin-top: 9px; border-radius: 9px; }
  .hero:before { inset: 13px; }
  .hero-content { align-items: flex-start; padding-top: 47px; }
  .hero-copy { max-width: 550px; padding-bottom: 0; }
  .hero h1 { max-width: 560px; margin-bottom: 18px; font-size: 3.1rem; }
  .hero-description { max-width: 450px; font-size: .98rem; }
  .hero-actions { gap: 14px; margin-top: 20px; }
  .hero-stage { top: auto; right: 0; bottom: 54px; width: 94%; height: 245px; transform: none; }
  .hero-console { top: 13px; left: 0; width: 86%; }
  .hero-phone { right: 4%; bottom: -7px; width: 116px; transform: rotate(6deg); }
  .hero-stage-caption { display: none; }
  .hero-index { bottom: 20px; left: 6%; display: block; max-width: 150px; line-height: 1.7; }
  .hero-index span:last-child { display: block; }
  .system-rail > .container { justify-content: flex-start; overflow: auto; gap: 25px; min-height: 55px; white-space: nowrap; scrollbar-width: none; }
  .system-rail > .container::-webkit-scrollbar { display: none; }
  .workflow-line { grid-template-columns: 1fr; gap: 0; margin-top: 42px; }
  .workflow-line article { padding: 20px 0 23px; border-bottom: 1px solid #4d7580; }
  .workflow-line article + article { padding-left: 0; border-left: 0; }
  .workflow-line article + article:before { left: 0; }
  .workflow-line h3 { margin-top: 12px; }
  .feature-layout { grid-template-columns: 1fr; gap: 45px; min-height: 0; }
  .feature-layout.reverse .feature-copy, .feature-layout.reverse .feature-visual { order: initial; }
  .feature-copy { max-width: none; }
  .feature-copy h2 { font-size: 2.6rem; }
  h2 { font-size: 2.6rem; }
  .feature-facts > div { flex-direction: row; }
  .feature-facts span { text-align: right; }
  .coach-visual { min-height: 300px; padding: 25px 8px 35px; }
  .coach-visual:before { inset: 0 -18px; }
  .training-visual, .nutrition-visual { min-height: 540px; }
  .training-feature { background-position: 66% center; background-image: linear-gradient(rgba(7,27,39,.87), rgba(7,27,39,.7)), url('training-v2.jpg'); }
  .contact-photo { height: clamp(205px,53vw,280px); margin-bottom: 31px; }
  .training-visual .feature-phone, .nutrition-visual .feature-phone { width: min(52%, 225px); }
  .capability-list article { grid-template-columns: 38px minmax(0,1fr); gap: 12px; min-height: 128px; }
  .capability-list h3 { font-size: 1.25rem; }
  .capability-type { display: none; }
  .brand-layout, .faq-layout, .contact-layout { grid-template-columns: 1fr; gap: 40px; }
  .brand-visual { min-height: 265px; }
  .contact-steps { margin-top: 35px; }
  .footer-top { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px; }
  .footer-top > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 430px) {
  .mobile-access { grid-template-columns: 1fr; }
  .hero { height: min(80svh, 605px); min-height: 550px; }
  .hero-content { padding-top: 39px; }
  .hero h1 { font-size: 2.3rem; }
  .hero-description { max-width: 320px; font-size: .92rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 5px; }
  .hero-actions .button { min-height: 47px; }
  .hero-stage { right: -1%; bottom: 20px; height: 180px; }
  .hero-console { width: 76%; }
  .hero-phone { right: 2%; width: 95px; }
  .hero-index { display: none; }
  .kicker { font-size: .64rem; }
  .product-tab { min-width: 0; width: 50%; padding-inline: 12px; font-size: .81rem; }
  .product-switch { width: 100%; }
  .product-stage { min-height: 275px; padding: 20px; }
  .product-stage-student { gap: 13px; min-height: 360px; }
  .student-showcase-phone { width: 42%; }
  .product-panel-copy { padding: 26px 22px; }
  .browser-bar { height: 23px; }
  .browser-bar span { font-size: .44rem; }
  .feature-facts > div { flex-direction: column; gap: 1px; }
  .feature-facts span { text-align: left; }
  .training-visual, .nutrition-visual { min-height: 495px; }
  .lead-form { padding: 23px; }
  .form-grid { grid-template-columns: 1fr; gap: 0; }
  .preview-header { padding: 15px; }
  .preview-header h2 { font-size: 1.2rem; }
  .preview-image-wrap { padding: 10px; }
  .preview-controls { padding: 10px 15px; }
}
@media (max-width: 360px) {
  .hero { height: 560px; min-height: 560px; }
  .hero h1 { font-size: 1.95rem; }
  .hero-description { max-width: 280px; }
  .hero-stage { bottom: 0; height: 172px; }
  .hero-phone { width: 88px; }
}
@media (prefers-reduced-motion: no-preference) {
  .hero-copy { animation: text-enter .75s ease-out both; }
  .hero-console { animation: console-enter .9s .12s ease-out both; }
  .hero-phone { animation: phone-enter 1s .2s ease-out both, phone-float 6s 1.2s ease-in-out infinite; }
  .live-indicator { animation: signal 2.4s ease-in-out infinite; }
  .reveal-ready [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
  .reveal-ready [data-reveal].is-visible { opacity: 1; transform: translateY(0); }
  @keyframes text-enter { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes console-enter { from { opacity: 0; transform: translateY(30px) rotate(-7deg); } to { opacity: 1; transform: translateY(0) rotate(-4deg); } }
  @keyframes phone-enter { from { opacity: 0; transform: translateY(30px) rotate(9deg); } to { opacity: 1; transform: translateY(0) rotate(5deg); } }
  @keyframes phone-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -8px; } }
  @keyframes signal { 0%,100% { box-shadow: 0 0 0 4px rgba(250,128,90,.19); } 50% { box-shadow: 0 0 0 9px rgba(250,128,90,0); } }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}