/*
 * Manabi Video Navi V247 — public readability and non-overlap release
 *
 * Final presentation-only layer. It normalizes the cinematic landing page
 * into an intrinsically-sized layout, separates decorative chrome from real
 * copy and gives every formerly pale badge an explicit foreground/background
 * pair. Forms, routes, media, data attributes and event ownership are not
 * changed here.
 */

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247 {
  --mnv-v247-pad: max(24px, calc((100vw - 1480px) / 2 + 32px));
  --mnv-v247-panel: #08234b;
  --mnv-v247-panel-deep: #061831;
  --mnv-v247-line: rgba(91, 190, 255, .34);
  --mnv-v247-text: #f7fbff;
  --mnv-v247-copy: #cfddf0;
  --mnv-v247-muted: #a9bdd7;
  --mnv-v247-accent: #ffad66;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247 main {
  overflow-x: clip !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247 :is(
  h1, h2, h3, h4, h5, h6, p, li, dt, dd, label, legend, summary,
  strong, b, small, span, a, button
) {
  overflow-wrap: anywhere;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247 :is(.button, button) {
  max-width: 100%;
  white-space: normal !important;
  text-align: center;
}

/* -------------------------------------------------------------------------
   Landing-page chrome: decorative rails must never share the text layer.
   ------------------------------------------------------------------------- */

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index {
  scroll-padding-top: 16px;
  background: #020817 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index main.container {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .mnv-v243-intro-sequence,
  .mnv-v243-global-chrome,
  .mnv-v243-hero-chrome,
  .mnv-v243-hero-index,
  .mnv-v243-kinetic-rail,
  .mnv-v243-section-meta,
  .mnv-v243-sequence,
  .mnv-v243-scan,
  .mnv-v243-kinetic-scene
) {
  display: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-hero-field > span {
  display: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-learning-range-section,
  .koto-features-section,
  .koto-support-section
)::after {
  display: none !important;
  content: none !important;
}

/* -------------------------------------------------------------------------
   Hero: intrinsic height, bounded typography and no absolute text collision.
   ------------------------------------------------------------------------- */

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero {
  min-height: 0 !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero::before,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero::after {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "copy" "stage" !important;
  gap: 0 !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy {
  display: flex !important;
  min-height: 0 !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  padding: clamp(60px, 6vw, 104px) var(--mnv-v247-pad) clamp(72px, 7vw, 120px) !important;
  overflow: visible !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-kicker {
  margin: 0 0 24px !important;
  color: #d8e9fb !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title {
  position: static !important;
  display: block !important;
  width: min(1040px, 100%) !important;
  max-width: 1040px !important;
  margin: 0 !important;
  overflow: visible !important;
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(42px, 4.7vw, 76px) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title > :is(
  .koto-hero-problem,
  .koto-solution-band,
  .koto-hero-solution,
  .koto-hero-solution em,
  .koto-hero-solution strong
) {
  position: static !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  line-height: inherit !important;
  transform: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title .koto-hero-problem {
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title .koto-hero-solution strong {
  background: none !important;
  color: var(--mnv-v247-accent) !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-route-convergence {
  display: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge {
  display: flex !important;
  width: min(620px, 100%) !important;
  margin: 16px 0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-promise {
  width: min(820px, 100%) !important;
  max-width: 820px !important;
  margin: 28px 0 0 !important;
  color: var(--mnv-v247-copy) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(16px, 1.25vw, 20px) !important;
  line-height: 1.8 !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions {
  display: flex !important;
  width: min(900px, 100%) !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin: 28px 0 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions .button {
  min-height: 54px !important;
  padding: 14px 22px !important;
  overflow: visible !important;
  border-radius: 12px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-trust-row {
  width: min(980px, 100%) !important;
  max-width: 980px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope {
  grid-template-columns: minmax(230px, auto) minmax(0, 1fr) !important;
  margin-top: 32px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope strong {
  color: #edf6ff !important;
  -webkit-text-fill-color: currentColor !important;
  white-space: normal !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope li,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-trust-row > span {
  color: #d6e6f8 !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

/* -------------------------------------------------------------------------
   Functional search cockpit: no title/status, counter or keyword collisions.
   ------------------------------------------------------------------------- */

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-stage {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 64px !important;
  min-width: 0 !important;
  padding: clamp(72px, 7vw, 112px) var(--mnv-v247-pad) !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-live-showcase {
  width: min(1320px, 100%) !important;
  max-width: 1320px !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-screen {
  overflow: hidden !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  justify-content: space-between !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar nav {
  display: flex !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  justify-content: flex-end !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-content {
  min-width: 0 !important;
  padding: clamp(28px, 3vw, 52px) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 24px !important;
  align-items: center !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome > div {
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome h2 {
  max-width: 100% !important;
  margin: 8px 0 0 !important;
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(32px, 4vw, 56px) !important;
  line-height: 1.18 !important;
  letter-spacing: -.04em !important;
  text-wrap: balance !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .status-badge.status-info {
  max-width: 260px !important;
  min-height: 38px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(80, 230, 183, .52) !important;
  border-radius: 999px !important;
  background: #0a3c35 !important;
  color: #d2ffef !important;
  -webkit-text-fill-color: currentColor !important;
  line-height: 1.4 !important;
  white-space: normal !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-form {
  min-width: 0 !important;
  margin-top: 32px !important;
  padding: clamp(22px, 2.7vw, 40px) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-input-shell {
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .char-counter {
  border: 1px solid rgba(104, 176, 255, .45) !important;
  border-radius: 8px !important;
  background: #0a2147 !important;
  color: #dceaff !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips > button {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  grid-template-areas: "number title" "number meta" !important;
  gap: 2px 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 86px !important;
  padding: 14px !important;
  text-align: left !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips > button > span {
  grid-area: number !important;
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  border: 1px solid #b8def8 !important;
  border-radius: 10px !important;
  background: #edf8ff !important;
  color: #12395f !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips > button > b {
  grid-area: title !important;
  color: #f7fbff !important;
  -webkit-text-fill-color: currentColor !important;
  line-height: 1.35 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips > button > small {
  grid-area: meta !important;
  color: #b8cbe3 !important;
  -webkit-text-fill-color: currentColor !important;
  line-height: 1.4 !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-bottom {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, auto) !important;
  gap: 18px !important;
  align-items: end !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-submit {
  min-width: 0 !important;
  min-height: 56px !important;
}

/* Journey and demonstration blocks shown directly below the form. */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-live-showcase {
  display: grid !important;
  gap: 22px !important;
  margin: 0 auto !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 16px !important;
  border: 1px solid var(--mnv-v247-line) !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, rgba(10, 36, 76, .98), rgba(5, 22, 50, .99)) !important;
  color: var(--mnv-v247-text) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey > div {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 10px !important;
  border-radius: 12px !important;
  background: rgba(8, 31, 67, .88) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey > div > b {
  display: grid !important;
  place-items: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #0d4c82 !important;
  color: #f7fbff !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey :is(strong, small) {
  display: block !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  line-height: 1.45 !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey small {
  margin-top: 3px !important;
  color: var(--mnv-v247-copy) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey > i {
  width: 28px !important;
  height: 1px !important;
  background: rgba(91, 190, 255, .48) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-showcase-title {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  justify-content: space-between !important;
  min-width: 0 !important;
  padding: 20px 22px !important;
  border: 1px solid var(--mnv-v247-line) !important;
  border-radius: 16px !important;
  background: rgba(7, 30, 65, .92) !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-showcase-title h2 {
  margin: 0 !important;
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(26px, 2.7vw, 42px) !important;
  line-height: 1.2 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-showcase-title h2 em {
  display: block !important;
  color: var(--mnv-v247-accent) !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-showcase-title > small {
  max-width: 280px !important;
  color: var(--mnv-v247-copy) !important;
  -webkit-text-fill-color: currentColor !important;
  line-height: 1.6 !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-preview-cards {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-preview-cards > article {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 22px !important;
  overflow: hidden !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-preview-cards > article > span,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-preview-cards > article > b {
  border: 1px solid rgba(89, 232, 255, .42) !important;
  border-radius: 8px !important;
  background: #0b3b70 !important;
  color: #e6f7ff !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-preview-cards > article > :is(strong, small) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-demo-player {
  min-width: 0 !important;
  overflow: hidden !important;
}

/* -------------------------------------------------------------------------
   Editorial acts: bounded headings and intrinsic, conventional card grids.
   ------------------------------------------------------------------------- */

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index main > :is(
  .koto-section,
  .brand-film-section,
  .koto-final-cta,
  .mnv-v243-manifesto,
  .mnv-v243-impact,
  .mnv-v243-proof
) {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: clamp(72px, 7vw, 112px) var(--mnv-v247-pad) !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
  scroll-margin-top: 86px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-section-heading,
  .conversion-section-heading,
  .koto-learning-range-intro,
  .koto-flow-copy,
  .mnv-v243-manifesto-copy,
  .mnv-v243-horizon-scene > div:last-child
) {
  width: min(1120px, 100%) !important;
  max-width: 1120px !important;
  min-width: 0 !important;
  margin: 0 auto clamp(36px, 4vw, 60px) !important;
  overflow: visible !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-section-heading,
  .conversion-section-heading,
  .koto-learning-range-intro,
  .koto-flow-copy
) > span {
  margin-bottom: 16px !important;
  color: var(--mnv-v247-accent) !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-section-heading,
  .conversion-section-heading,
  .koto-learning-range-intro,
  .koto-flow-copy
) h2,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-display-copy,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta h2 {
  max-width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(38px, 4.35vw, 70px) !important;
  font-weight: 900 !important;
  line-height: 1.14 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-section-heading,
  .conversion-section-heading,
  .koto-learning-range-intro,
  .koto-flow-copy,
  .mnv-v243-display-copy,
  .koto-final-cta
) em {
  color: var(--mnv-v247-accent) !important;
  -webkit-text-fill-color: currentColor !important;
  font-style: normal !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-section-heading,
  .conversion-section-heading,
  .koto-learning-range-intro,
  .koto-flow-copy,
  .mnv-v243-manifesto-copy,
  .mnv-v243-horizon-scene > div:last-child
) > p {
  width: min(820px, 100%) !important;
  max-width: 820px !important;
  margin: 24px 0 0 !important;
  color: var(--mnv-v247-copy) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: clamp(15px, 1.15vw, 18px) !important;
  line-height: 1.85 !important;
  opacity: 1 !important;
}

/* Manifesto */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-manifesto {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 42px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-manifesto-copy {
  margin-bottom: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-display-copy > small {
  display: block !important;
  margin-bottom: 12px !important;
  color: var(--mnv-v247-copy) !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: .54em !important;
  line-height: 1.35 !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-display-copy > strong {
  display: block !important;
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  line-height: inherit !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-impact-grid {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1320px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-impact-grid > * {
  position: static !important;
  min-width: 0 !important;
  min-height: 180px !important;
  padding: 24px !important;
  transform: none !important;
}

/* Learning ranges */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-section {
  display: block !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-section .koto-learning-range-intro {
  margin: 0 auto 48px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1480px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-learning-range-grid,
  .koto-pain-grid,
  .koto-feature-grid,
  .koto-experience-track,
  .koto-scene-grid,
  .koto-role-grid,
  .homepage-trust-grid,
  .org-path-grid
) > :is(article, a) {
  position: relative !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  overflow: hidden !important;
  transform: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-grid > article {
  padding: 26px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-grid > article > span,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-pain-grid > article > span,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-feature-grid > article > span,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-role-icon {
  display: grid !important;
  place-items: center !important;
  width: 54px !important;
  height: 54px !important;
  border: 1px solid rgba(89, 232, 255, .34) !important;
  border-radius: 14px !important;
  background: #0c3b73 !important;
  color: #83ebff !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-grid > article > ul li {
  border: 1px solid #b8def8 !important;
  background: #edf8ff !important;
  color: #12395f !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-learning-range-grid,
  .koto-pain-grid,
  .koto-feature-grid,
  .koto-experience-track,
  .koto-role-grid,
  .homepage-trust-grid,
  .org-path-grid
) > :is(article, a) :is(h3, strong, b) {
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
  .koto-learning-range-grid,
  .koto-pain-grid,
  .koto-feature-grid,
  .koto-experience-track,
  .koto-role-grid,
  .homepage-trust-grid,
  .org-path-grid
) > :is(article, a) :is(p, small) {
  color: var(--mnv-v247-copy) !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

/* Pain and feature grids */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-pain-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1480px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1320px, 100%) !important;
  margin: 0 auto !important;
}

/* Route diagram is converted from absolute orbit to a readable step board. */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-section {
  display: grid !important;
  grid-template-columns: minmax(320px, .75fr) minmax(0, 1.25fr) !important;
  gap: clamp(36px, 5vw, 76px) !important;
  align-items: start !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-copy {
  margin: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board {
  display: grid !important;
  grid-template-columns: minmax(180px, .48fr) minmax(0, 1.52fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 18px !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board .koto-flow-center {
  position: static !important;
  width: auto !important;
  min-height: 100% !important;
  transform: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board ol {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board li {
  position: static !important;
  inset: auto !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 8px 10px !important;
  align-items: center !important;
  width: auto !important;
  height: auto !important;
  min-height: 96px !important;
  padding: 14px !important;
  border-radius: 12px !important;
  transform: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board li > strong {
  min-width: 0 !important;
  line-height: 1.45 !important;
}

/* Progress, scenes and support */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-experience-track {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: min(1480px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-experience-track::before {
  display: none !important;
  content: none !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-experience-track > article > b {
  border: 1px solid #b8def8 !important;
  border-radius: 999px !important;
  background: #edf8ff !important;
  color: #12395f !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-scene-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1480px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-scene-grid > article > span {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 34px !important;
  padding: 7px 12px !important;
  border: 1px solid rgba(89, 232, 255, .38) !important;
  border-radius: 999px !important;
  background: #0b3b70 !important;
  color: #e6f7ff !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-scene-art {
  color: #5327b9 !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-role-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1320px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-support-note {
  display: flex !important;
  width: min(980px, 100%) !important;
  max-width: 980px !important;
  min-width: 0 !important;
  margin: 26px auto 0 !important;
  padding: 16px 20px !important;
  border: 1px solid rgba(89, 232, 255, .38) !important;
  border-radius: 14px !important;
  background: #09234b !important;
  color: #e8f4ff !important;
  -webkit-text-fill-color: currentColor !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-support-note :is(span, strong) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

/* Trust, organization and horizon */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .homepage-trust-grid,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .org-path-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  width: min(1320px, 100%) !important;
  margin: 0 auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .homepage-trust-grid > article > span {
  display: inline-flex !important;
  max-width: 100% !important;
  border: 1px solid rgba(89, 232, 255, .38) !important;
  border-radius: 999px !important;
  background: #0b3b70 !important;
  color: #e6f7ff !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .homepage-faq {
  width: min(1100px, 100%) !important;
  margin: 24px auto 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-horizon-scene {
  display: grid !important;
  grid-template-columns: minmax(260px, .55fr) minmax(0, 1.45fr) !important;
  gap: clamp(34px, 5vw, 72px) !important;
  align-items: center !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-horizon-scene > div:last-child {
  margin: 0 !important;
}

/* Film poster and timeline use rows, never narrow vertical copy columns. */
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-stage {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  width: min(1320px, 100%) !important;
  margin: 0 auto !important;
  min-width: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-poster {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 1px solid var(--mnv-v247-line) !important;
  border-radius: 14px !important;
  background: #071e41 !important;
  overflow: hidden !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline > div {
  position: static !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  grid-template-areas: "time title" "time copy" !important;
  gap: 3px 12px !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 112px !important;
  padding: 18px !important;
  border: 0 !important;
  border-right: 1px solid rgba(91, 190, 255, .22) !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline > div:last-child {
  border-right: 0 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline time {
  grid-area: time !important;
  align-self: start !important;
  color: var(--mnv-v247-accent) !important;
  -webkit-text-fill-color: currentColor !important;
  writing-mode: horizontal-tb !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline strong {
  grid-area: title !important;
  color: var(--mnv-v247-text) !important;
  -webkit-text-fill-color: currentColor !important;
  writing-mode: horizontal-tb !important;
  line-height: 1.45 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline span {
  grid-area: copy !important;
  color: var(--mnv-v247-copy) !important;
  -webkit-text-fill-color: currentColor !important;
  writing-mode: horizontal-tb !important;
  line-height: 1.55 !important;
  opacity: 1 !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta {
  display: grid !important;
  justify-items: center !important;
  text-align: center !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta > :is(h2, p, div) {
  width: min(920px, 100%) !important;
  max-width: 920px !important;
}

/* -------------------------------------------------------------------------
   Responsive release: density falls before text becomes narrow.
   ------------------------------------------------------------------------- */

@media (max-width: 1450px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index {
    --mnv-v247-pad: max(28px, 4.5vw);
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title {
    font-size: clamp(40px, 5.15vw, 70px) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
    .koto-learning-range-grid,
    .koto-pain-grid,
    .koto-scene-grid
  ) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-experience-track {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1180px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index {
    --mnv-v247-pad: max(24px, 4.5vw);
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-bottom,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-section,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-horizon-scene {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .status-badge.status-info {
    justify-self: start !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-feature-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .homepage-trust-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .org-path-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-impact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey > i {
    display: none !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-copy {
    margin: 0 auto 36px !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline > div:nth-child(2) {
    border-right: 0 !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline > div:nth-child(-n+2) {
    border-bottom: 1px solid rgba(91, 190, 255, .22) !important;
  }
}

@media (max-width: 900px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index {
    --mnv-v247-pad: max(20px, 4.5vw);
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-stage,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index main > :is(
    .koto-section,
    .brand-film-section,
    .koto-final-cta,
    .mnv-v243-manifesto,
    .mnv-v243-impact,
    .mnv-v243-proof
  ) {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
    .koto-section-heading,
    .conversion-section-heading,
    .koto-learning-range-intro,
    .koto-flow-copy
  ) h2,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-display-copy,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta h2 {
    font-size: clamp(36px, 7.2vw, 58px) !important;
    line-height: 1.16 !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board ol {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-experience-track,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-role-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index {
    --mnv-v247-pad: 18px;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy {
    padding-top: 48px !important;
    padding-bottom: 58px !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
    .koto-section-heading,
    .conversion-section-heading,
    .koto-learning-range-intro,
    .koto-flow-copy
  ) h2,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-display-copy,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta h2 {
    font-size: clamp(32px, 10.5vw, 48px) !important;
    letter-spacing: -.035em !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions .button,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta > div,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta .button {
    width: 100% !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope ul,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-example-chips,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-journey,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-preview-cards,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-learning-range-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-pain-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-feature-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-experience-track,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-scene-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-role-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .homepage-trust-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .org-path-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-impact-grid,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-flow-board ol,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .cosmic-showcase-title {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline > div {
    min-height: 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(91, 190, 255, .22) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .brand-film-timeline > div:last-child {
    border-bottom: 0 !important;
  }
}

@media (max-width: 430px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index {
    --mnv-v247-pad: 14px;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero #koto-hero-title,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
    .koto-section-heading,
    .conversion-section-heading,
    .koto-learning-range-intro,
    .koto-flow-copy
  ) h2,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .mnv-v243-display-copy,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-final-cta h2 {
    font-size: clamp(29px, 10.8vw, 42px) !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-content,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-form {
    padding: 16px !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}

@media (max-height: 560px) and (orientation: landscape) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-stage,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index main > :is(
    .koto-section,
    .brand-film-section,
    .koto-final-cta,
    .mnv-v243-manifesto,
    .mnv-v243-impact,
    .mnv-v243-proof
  ) {
    min-height: 0 !important;
    padding-top: 42px !important;
    padding-bottom: 42px !important;
  }
}

@media (forced-colors: active) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
    .status-badge.status-info,
    .char-counter,
    .koto-example-chips > button > span,
    .koto-learning-range-grid > article > ul li,
    .koto-experience-track > article > b,
    .koto-support-note
  ) {
    border: 1px solid CanvasText !important;
    background: Canvas !important;
    color: CanvasText !important;
    -webkit-text-fill-color: CanvasText !important;
    forced-color-adjust: auto !important;
  }
}

@media print {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index :is(
    .mnv-v243-intro-sequence,
    .mnv-v243-global-chrome,
    .mnv-v243-hero-chrome,
    .mnv-v243-kinetic-rail,
    .mnv-v243-section-meta,
    .mnv-v243-sequence,
    .future-utility-dock
  ) {
    display: none !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app.shell-public.page-index main > section {
    min-height: 0 !important;
    overflow: visible !important;
  }
}

/* -------------------------------------------------------------------------
   Navigation ownership

   The wide learner rail stays available at the left edge, but its content is
   the only vertical scroll owner. Page-top headers and the dashboard shortcut
   strip remain in normal document flow, so they leave the viewport naturally
   instead of painting a persistent background over later content.
   ------------------------------------------------------------------------- */

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app:is(.shell-public, .shell-auth) .site-header,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.public-app:is(.shell-public, .shell-auth).mobile-nav-open .site-header {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
}

body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.shell-learner .dash-layout > .desktop-dash-nav,
body.app-shell.future-ui.mnv-future-ui.mnv-world-v247.shell-learner .dash-layout > .mobile-mypage-menu {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  z-index: auto !important;
}

@media (min-width: 1181px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header {
    overflow: hidden !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header-inner {
    height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .brand {
    flex: 0 0 auto !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .site-nav-area,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .site-nav-area.open {
    position: static !important;
    display: flex !important;
    width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 100% !important;
    padding: 0 6px 10px 2px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-x: none !important;
    overscroll-behavior-y: contain !important;
    scroll-padding-block: 10px !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(112, 205, 255, .72) rgba(4, 19, 45, .56) !important;
    flex: 1 1 0 !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch;
    pointer-events: auto !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .site-nav {
    flex: 0 0 auto !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .nav-actions {
    flex: 0 0 auto !important;
    margin-top: 0 !important;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .site-nav-area::-webkit-scrollbar {
    width: 10px;
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .site-nav-area::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(4, 19, 45, .56);
  }

  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header .site-nav-area::-webkit-scrollbar-thumb {
    border: 2px solid rgba(4, 19, 45, .56);
    border-radius: 999px;
    background: rgba(112, 205, 255, .72);
  }
}

@media (max-width: 1180px) {
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive) .site-header,
  body.app-shell.future-ui.mnv-future-ui.mnv-world-v247:is(.shell-learner, .shell-immersive).mobile-nav-open .site-header {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
  }
}
