:root {
  --landing-bg: #060c18;
  --landing-surface: #0b1627;
  --landing-surface-raised: #101e34;
  --landing-text: #f5f8ff;
  --landing-muted: #aab9d1;
  --landing-border: rgba(178, 202, 255, 0.14);
  --landing-blue: #66a8ff;
  --landing-violet: #9790ff;
  --landing-cyan: #6fe5df;
  --landing-max-width: 1180px;
  --landing-gutter: 24px;
  --landing-font: 'DM Sans', 'Segoe UI', sans-serif;
  --landing-display: 'Space Grotesk', 'DM Sans', sans-serif;
}

html { scroll-behavior: smooth; }

body.landing {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--landing-text);
  background:
    radial-gradient(circle at 12% -8%, rgba(83, 142, 255, 0.22), transparent 31rem),
    radial-gradient(circle at 93% 20%, rgba(139, 108, 255, 0.16), transparent 28rem),
    linear-gradient(180deg, #07111f 0%, var(--landing-bg) 43%, #08111e 100%);
  font-family: var(--landing-font);
}

body.landing::before {
  position: fixed;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  content: '';
  opacity: 0.42;
  background-image: linear-gradient(rgba(179, 203, 255, 0.024) 1px, transparent 1px), linear-gradient(90deg, rgba(179, 203, 255, 0.024) 1px, transparent 1px);
  background-size: 76px 76px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
}

body.landing button,
body.landing a { font: inherit; }

.landing-shell { position: relative; z-index: 1; }
.landing-shell, .landing-shell * { box-sizing: border-box; }
.landing-container { width: min(var(--landing-max-width), calc(100% - (var(--landing-gutter) * 2))); margin: 0 auto; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.landing-skip-link {
  position: fixed;
  z-index: 200;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  border-radius: 10px;
  color: #06101e;
  background: #fff;
  transform: translateY(-160%);
  transition: transform 160ms ease;
}

.landing-skip-link:focus { transform: translateY(0); }

.landing-header {
  position: sticky;
  z-index: 100;
  top: 0;
  width: min(var(--landing-max-width), calc(100% - (var(--landing-gutter) * 2)));
  margin: 0 auto;
  padding: 14px 0 8px;
  font-family: var(--landing-font);
}

.landing-header a,
.landing-header button { font-family: inherit; }

.landing-header-bar {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
  align-items: center;
  gap: 20px;
  min-height: 58px;
  padding: 8px 10px 8px 16px;
  border: 1px solid var(--landing-border);
  border-radius: 18px;
  background: rgba(7, 16, 30, 0.92);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(16px);
}

.landing-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--landing-text);
  font-family: var(--landing-display);
  font-size: 0.98rem;
  font-weight: 700;
  letter-spacing: -0.035em;
  text-decoration: none;
}

.landing-brand img { display: block; flex: 0 0 auto; filter: drop-shadow(0 6px 10px rgba(100, 157, 255, 0.2)); }
.landing-desktop-nav { display: flex; align-items: center; justify-content: center; gap: 22px; }
.landing-desktop-nav a { padding: 8px 2px; color: var(--landing-muted); font-size: 0.89rem; font-weight: 600; text-decoration: none; transition: color 150ms ease; }
.landing-desktop-nav a:hover, .landing-desktop-nav a:focus-visible, .landing-desktop-nav a.is-active { color: #fff; }

.landing-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }

.landing-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  transition: transform 150ms ease, border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
}

.landing-button svg { width: 16px; height: 16px; flex: 0 0 auto; }
.landing-button:hover { transform: translateY(-1px); }
.landing-button-primary { color: #07111f; background: linear-gradient(135deg, #8ed5ff, #9f9bff); box-shadow: 0 10px 24px rgba(93, 140, 255, 0.2); }
.landing-button-primary:hover { box-shadow: 0 14px 28px rgba(93, 140, 255, 0.32); }
.landing-button-quiet { color: #eaf2ff; border-color: rgba(174, 203, 255, 0.22); background: rgba(255, 255, 255, 0.035); }
.landing-button-quiet:hover { border-color: rgba(161, 193, 255, 0.5); background: rgba(120, 163, 255, 0.12); }
.landing-button-disabled { color: rgba(226, 236, 250, 0.55); border-color: rgba(174, 203, 255, 0.12); background: rgba(255, 255, 255, 0.03); cursor: not-allowed; }

.landing-profile { position: relative; }
.landing-profile-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 196px;
  min-height: 42px;
  padding: 4px 9px 4px 5px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--landing-text);
  background: transparent;
  cursor: pointer;
}

.landing-profile-trigger:hover, .landing-profile-trigger:focus-visible { border-color: var(--landing-border); background: rgba(255, 255, 255, 0.045); }
.landing-profile-trigger > img, .landing-profile-menu-user img, .landing-mobile-account > div > img { border-radius: 10px; object-fit: cover; }
.landing-profile-trigger > span, .landing-profile-menu-user > span, .landing-mobile-account > div > span { display: grid; min-width: 0; text-align: left; }
.landing-profile-trigger strong, .landing-profile-menu-user strong, .landing-mobile-account strong { overflow: hidden; font-size: 0.8rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.landing-profile-trigger small, .landing-profile-menu-user small, .landing-mobile-account small { overflow: hidden; color: var(--landing-muted); font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
.landing-profile-trigger > svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--landing-muted); }

.landing-profile-menu {
  position: absolute;
  z-index: 120;
  top: calc(100% + 10px);
  right: 0;
  width: 290px;
  padding: 8px;
  border: 1px solid var(--landing-border);
  border-radius: 16px;
  background: #0a1628;
  box-shadow: 0 24px 58px rgba(0, 0, 0, 0.42);
  animation: landing-pop 150ms ease-out;
}

.landing-profile-menu-user { display: flex; align-items: center; gap: 10px; padding: 8px 8px 12px; border-bottom: 1px solid rgba(179, 203, 255, 0.1); }
.landing-profile-group { display: grid; gap: 2px; padding: 10px 0 2px; }
.landing-profile-group + .landing-profile-group { border-top: 1px solid rgba(179, 203, 255, 0.08); margin-top: 8px; }
.landing-profile-group > span { padding: 0 9px 4px; color: #7f91ae; font-size: 0.67rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.landing-profile-group a { display: grid; grid-template-columns: 18px 1fr 16px; align-items: center; gap: 9px; min-height: 36px; padding: 7px 9px; border-radius: 9px; color: #dce8fb; font-size: 0.84rem; font-weight: 600; text-decoration: none; }
.landing-profile-group a:hover, .landing-profile-group a:focus-visible { background: rgba(117, 158, 255, 0.12); color: #fff; }
.landing-profile-group a svg { width: 16px; height: 16px; }
.landing-profile-group .landing-profile-link-arrow { color: #8ca6cc; }
.landing-profile-group a.is-destructive { color: #ffb6bb; }
.landing-profile-group a.is-destructive:hover, .landing-profile-group a.is-destructive:focus-visible { background: rgba(255, 104, 117, 0.12); color: #ffd3d6; }

.landing-mobile-toggle { display: none; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--landing-border); border-radius: 11px; color: var(--landing-text); background: rgba(255, 255, 255, 0.035); cursor: pointer; }
.landing-mobile-toggle svg { width: 20px; height: 20px; }
.landing-mobile-menu { display: none; }

.landing-hero { padding: 72px 0 30px; }
.landing-hero-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr); align-items: center; gap: clamp(34px, 7vw, 94px); min-height: 418px; }
.landing-hero-copy { max-width: 720px; animation: landing-reveal 460ms ease-out both; }
.landing-eyebrow { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; border: 1px solid rgba(135, 185, 255, 0.22); border-radius: 999px; color: #b7d7ff; background: rgba(94, 146, 255, 0.1); font-size: 0.69rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.landing-hero h1, .landing-section-heading h2, .landing-community h2, .landing-final-cta h2 { margin: 14px 0 0; font-family: var(--landing-display); letter-spacing: -0.055em; }
.landing-hero h1 { max-width: 12ch; font-size: clamp(2.5rem, 5vw, 4.7rem); line-height: 0.98; }
.landing-hero-copy > p { max-width: 640px; margin: 20px 0 0; color: var(--landing-muted); font-size: 1.04rem; line-height: 1.7; }
.landing-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }

.landing-hero-summary { padding: 24px; border: 1px solid rgba(162, 184, 255, 0.16); border-radius: 20px; background: linear-gradient(145deg, rgba(24, 45, 80, 0.72), rgba(12, 21, 39, 0.8)); box-shadow: 0 22px 55px rgba(0, 0, 0, 0.2); animation: landing-reveal 520ms 70ms ease-out both; }
.landing-hero-summary-label { color: #9db9e7; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.landing-hero-summary > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 18px 0; }
.landing-hero-summary > div span { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 11px 9px; border-radius: 11px; color: #e9f2ff; background: rgba(255, 255, 255, 0.055); font-size: 0.83rem; font-weight: 600; transition: transform 160ms ease, background-color 160ms ease; }
.landing-hero-summary > div span:hover { background: rgba(128, 166, 255, 0.14); transform: translateY(-2px); }
.landing-hero-summary svg { width: 17px; height: 17px; color: var(--landing-cyan); }
.landing-hero-summary p { margin: 0; color: #aebdd2; font-size: 0.8rem; line-height: 1.55; }

.landing-benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding-top: 18px; border-top: 1px solid rgba(179, 203, 255, 0.12); }
.landing-benefits > div { display: flex; align-items: flex-start; gap: 10px; min-width: 0; padding: 5px 0; }
.landing-benefits > div > svg { width: 19px; height: 19px; flex: 0 0 auto; margin-top: 2px; color: #91bfff; }
.landing-benefits span { display: grid; gap: 2px; }
.landing-benefits strong { font-size: 0.82rem; }
.landing-benefits small { color: var(--landing-muted); font-size: 0.73rem; line-height: 1.45; }

.landing-section { padding: 72px 0; }
.landing-section-heading { max-width: 710px; }
.landing-section-heading h2, .landing-community h2, .landing-final-cta h2 { font-size: clamp(1.9rem, 3.2vw, 3rem); line-height: 1.05; }
.landing-section-heading > p, .landing-community-copy > p, .landing-final-cta p { margin: 16px 0 0; color: var(--landing-muted); line-height: 1.7; }

.landing-capabilities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 34px; }
.landing-capability { min-width: 0; padding: 22px; border: 1px solid var(--landing-border); border-radius: 17px; background: linear-gradient(145deg, rgba(20, 36, 62, 0.66), rgba(11, 22, 39, 0.7)); transition: transform 160ms ease, border-color 160ms ease, background 160ms ease; }
.landing-capability:hover { border-color: rgba(137, 179, 255, 0.35); background: linear-gradient(145deg, rgba(27, 48, 82, 0.74), rgba(11, 22, 39, 0.8)); transform: translateY(-2px); }
.landing-icon-tile { display: inline-grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(145, 184, 255, 0.2); border-radius: 10px; color: #b8d5ff; background: rgba(102, 153, 255, 0.1); }
.landing-icon-tile svg { width: 18px; height: 18px; }
.landing-card-eyebrow { display: block; margin-top: 19px; color: #8bb8ff; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.075em; text-transform: uppercase; }
.landing-capability h3 { max-width: 30ch; margin: 7px 0 0; font-family: var(--landing-display); font-size: 1.18rem; line-height: 1.22; letter-spacing: -0.035em; }
.landing-capability p { margin: 10px 0 0; color: var(--landing-muted); font-size: 0.91rem; line-height: 1.6; }
.landing-capability ul { display: grid; gap: 7px; margin: 16px 0 0; padding: 0; list-style: none; }
.landing-capability li { display: grid; grid-template-columns: 15px 1fr; gap: 7px; color: #d2dff2; font-size: 0.82rem; line-height: 1.45; }
.landing-capability li svg { width: 15px; height: 15px; color: var(--landing-cyan); }

.landing-deluxe-callout { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; margin-top: 14px; padding: 18px 20px; border: 1px solid rgba(170, 158, 255, 0.24); border-radius: 17px; background: linear-gradient(110deg, rgba(74, 66, 144, 0.28), rgba(20, 35, 65, 0.62)); }
.landing-deluxe-callout .landing-card-eyebrow { margin-top: 0; color: #bdb7ff; }
.landing-deluxe-callout h3 { margin: 5px 0 0; font-family: var(--landing-display); font-size: 1.06rem; letter-spacing: -0.025em; }
.landing-deluxe-callout p { max-width: 70ch; margin: 6px 0 0; color: var(--landing-muted); font-size: 0.83rem; line-height: 1.55; }
.landing-deluxe-callout .landing-button { white-space: nowrap; }

.landing-journey-section { padding-top: 42px; }
.landing-section-heading-inline { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(240px, 0.65fr); align-items: end; gap: 42px; max-width: none; }
.landing-section-heading-inline p { max-width: 420px; margin-bottom: 0; }
.landing-journey-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 28px; }
.landing-journey-link { display: flex; flex-direction: column; gap: 18px; min-height: 202px; padding: 18px; border: 1px solid rgba(175, 199, 255, 0.13); border-radius: 16px; color: var(--landing-text); background: rgba(13, 27, 47, 0.56); text-decoration: none; transition: background 160ms ease, border-color 160ms ease, transform 160ms ease; }
.landing-journey-link:hover, .landing-journey-link:focus-visible { border-color: rgba(145, 185, 255, 0.38); background: rgba(25, 47, 80, 0.72); transform: translateY(-2px); }
.landing-journey-link > span:last-child { display: grid; align-content: start; gap: 7px; }
.landing-journey-link strong { font-family: var(--landing-display); font-size: 1rem; }
.landing-journey-link small { color: var(--landing-muted); font-size: 0.82rem; line-height: 1.5; }
.landing-journey-link em { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; color: #9fc6ff; font-size: 0.78rem; font-style: normal; font-weight: 700; }
.landing-journey-link em svg { width: 14px; height: 14px; }

.landing-community-section { padding-top: 66px; }
.landing-community { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 0.78fr); gap: clamp(28px, 6vw, 72px); align-items: center; min-width: 0; padding: clamp(24px, 4vw, 46px); border: 1px solid rgba(150, 167, 255, 0.2); border-radius: 22px; background: linear-gradient(120deg, rgba(30, 40, 94, 0.72), rgba(17, 28, 58, 0.86) 54%, rgba(10, 21, 39, 0.9)); }
.landing-community h2 { max-width: 14ch; }
.landing-community-points { display: grid; gap: 8px; margin: 20px 0 22px; }
.landing-community-points span { display: inline-flex; align-items: center; gap: 8px; color: #dce7fb; font-size: 0.85rem; }
.landing-community-points svg { width: 16px; height: 16px; color: #a5baff; }
.landing-community-card { --community-rotate-x: 0deg; --community-rotate-y: 0deg; --community-scroll-offset: 0px; min-width: 0; padding: 18px; border: 1px solid rgba(183, 195, 255, 0.18); border-radius: 17px; background: rgba(5, 12, 27, 0.58); transform: perspective(900px) translate3d(0, var(--community-scroll-offset), 0) rotateX(var(--community-rotate-x)) rotateY(var(--community-rotate-y)); transition: transform 220ms ease, border-color 180ms ease, background-color 180ms ease; will-change: transform; }
.landing-community-card:hover { border-color: rgba(164, 184, 255, 0.34); background: rgba(8, 17, 36, 0.72); }
.landing-community-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #dce8ff; font-size: 0.76rem; font-weight: 700; }
.landing-community-card-title { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.landing-community-discord-icon { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; color: #c8c5ff; background: rgba(151, 144, 255, 0.16); }
.landing-community-discord-icon svg { width: 14px; height: 14px; }
.landing-community-status { display: inline-flex; align-items: center; gap: 5px; color: #a7b9d5; font-weight: 600; }
.landing-community-status i { width: 7px; height: 7px; border-radius: 50%; background: #8ca0c2; }
.landing-community-card.is-ready .landing-community-status i { background: #70e3b4; box-shadow: 0 0 0 3px rgba(112, 227, 180, 0.12); }
.landing-community-card.is-ready .landing-community-status i { animation: landing-status-pulse 2.4s ease-out 1; }
.landing-community-card.is-error .landing-community-status i { background: #f4b279; }
.landing-community-identity { display: flex; align-items: center; gap: 12px; min-width: 0; margin: 22px 0; }
.landing-community-identity img, .landing-community-fallback { width: 56px; height: 56px; flex: 0 0 auto; border-radius: 14px; object-fit: cover; }
.landing-community-fallback { display: grid; place-items: center; color: #c3d5ff; background: rgba(125, 148, 255, 0.18); }
.landing-community-fallback svg { width: 24px; height: 24px; }
.landing-community-identity div { display: grid; min-width: 0; gap: 4px; }
.landing-community-identity strong { overflow: hidden; font-family: var(--landing-display); font-size: 1.1rem; text-overflow: ellipsis; white-space: nowrap; }
.landing-community-identity span { color: var(--landing-muted); font-size: 0.79rem; line-height: 1.45; }
.landing-community-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0; }
.landing-community-stats div { min-width: 0; padding: 10px; border-radius: 10px; background: rgba(255, 255, 255, 0.045); transition: transform 160ms ease, background-color 160ms ease; }
.landing-community-stats div:hover { background: rgba(131, 164, 255, 0.1); transform: translateY(-2px); }
.landing-community-stats dt { display: flex; align-items: center; gap: 5px; overflow: hidden; color: #a1b0c9; font-size: 0.66rem; text-overflow: ellipsis; white-space: nowrap; }
.landing-community-stats dt svg { width: 13px; height: 13px; flex: 0 0 auto; color: #9fbfff; }
.landing-community-stats dd { overflow: hidden; margin: 5px 0 0; color: #eef5ff; font-family: var(--landing-display); font-size: 0.92rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.landing-community-card-note { margin: 14px 0 0; color: #8294b1; font-size: 0.7rem; line-height: 1.45; }

.landing-final-section { padding-top: 30px; }
.landing-final-cta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 0.62fr); gap: 48px; align-items: center; padding: clamp(25px, 4vw, 42px); border-top: 1px solid rgba(166, 192, 255, 0.15); border-bottom: 1px solid rgba(166, 192, 255, 0.15); }
.landing-final-cta h2 { max-width: 15ch; }
.landing-final-cta p { max-width: 430px; }
.landing-final-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }

.public-footer { width: min(var(--landing-max-width), calc(100% - 48px)); margin: 0 auto; padding: 18px 0 28px; }
.public-footer-shell { display: grid; gap: 24px; }
.public-footer-grid { display: grid; grid-template-columns: minmax(190px, 1.4fr) repeat(3, minmax(130px, 0.8fr)); gap: 24px; padding-top: 26px; }
.public-footer-brand-link { display: flex; align-items: flex-start; gap: 10px; color: var(--landing-text); text-decoration: none; }
.public-footer-brand-mark img { display: block; width: 42px; height: 42px; object-fit: contain; }
.public-footer-brand-copy { display: grid; gap: 5px; }
.public-footer-brand-copy strong { font-family: var(--landing-display); font-size: 0.92rem; }
.public-footer-brand-copy span { max-width: 30ch; color: var(--landing-muted); font-size: 0.78rem; line-height: 1.5; }
.public-footer-col h3 { margin: 0 0 9px; color: #cfdef5; font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; }
.public-footer-col nav { display: grid; gap: 7px; }
.public-footer-col a, .public-footer-company-link { color: var(--landing-muted); font-size: 0.81rem; text-decoration: none; }
.public-footer-col a:hover, .public-footer-col a:focus-visible { color: #fff; }
.public-footer-company-link { display: inline-flex; align-items: center; gap: 7px; }
.public-footer-company-link.is-disabled { opacity: 0.62; }
.public-footer-company-icon { display: grid; place-items: center; width: 18px; height: 18px; }
.public-footer-company-icon svg { width: 15px; height: 15px; }
.public-footer-company-icon.is-discord { color: #a9a7ff; }
.public-footer-company-icon.is-youtube { color: #ff8f97; }
.public-footer-company-icon.is-about { color: #97c6ff; }
.public-footer-payment-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.public-footer-payment-logo { display: grid; place-items: center; width: 45px; height: 28px; padding: 4px; border: 1px solid rgba(178, 202, 255, 0.12); border-radius: 7px; background: rgba(255, 255, 255, 0.035); }
.public-footer-payment-logo img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.public-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-top: 16px; border-top: 1px solid rgba(178, 202, 255, 0.1); }
.public-footer-copy, .public-footer-bottom-links a { color: #91a1ba; font-size: 0.76rem; line-height: 1.5; }
.public-footer-bottom-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; }
.public-footer-bottom-links a { text-decoration: none; }
.public-footer-bottom-links a:hover, .public-footer-bottom-links a:focus-visible { color: #fff; }

body.landing a:focus-visible, body.landing button:focus-visible, .landing-header a:focus-visible, .landing-header button:focus-visible { outline: 3px solid #b7d6ff; outline-offset: 3px; }

.landing-shell.has-reveal [data-reveal] { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity 420ms ease var(--reveal-delay, 0ms), transform 420ms ease var(--reveal-delay, 0ms); }
.landing-shell.has-reveal [data-reveal].is-visible { opacity: 1; transform: translate3d(0, 0, 0); }

@keyframes landing-reveal { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes landing-pop { from { opacity: 0; transform: translateY(-4px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes landing-status-pulse { 0% { box-shadow: 0 0 0 0 rgba(112, 227, 180, 0.42); } 100% { box-shadow: 0 0 0 7px rgba(112, 227, 180, 0); } }

@media (max-width: 940px) {
  .landing-header-bar { grid-template-columns: 1fr auto; }
  .landing-desktop-nav, .landing-desktop-login, .landing-profile { display: none; }
  .landing-mobile-toggle { display: inline-grid; }
  .landing-mobile-menu { display: grid; gap: 14px; margin-top: 8px; padding: 14px; border: 1px solid var(--landing-border); border-radius: 16px; background: #091526; box-shadow: 0 18px 44px rgba(0, 0, 0, 0.35); animation: landing-pop 160ms ease-out; }
  .landing-mobile-menu nav { display: grid; }
  .landing-mobile-menu nav a { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 0 8px; border-bottom: 1px solid rgba(178, 202, 255, 0.1); color: #e4edfb; font-size: 0.91rem; font-weight: 600; text-decoration: none; }
  .landing-mobile-menu nav a.is-active { color: #fff; }
  .landing-mobile-menu nav a svg { width: 16px; height: 16px; color: #94bbf6; }
  .landing-mobile-account { display: grid; gap: 8px; padding-top: 8px; border-top: 1px solid rgba(178, 202, 255, 0.1); }
  .landing-mobile-account > div { display: flex; align-items: center; gap: 9px; padding: 3px 4px; }
  .landing-mobile-account .landing-profile-group { padding-top: 8px; }
  .landing-hero { padding-top: 48px; }
  .landing-hero-layout, .landing-community, .landing-final-cta { grid-template-columns: 1fr; }
  .landing-hero-layout { min-height: 0; }
  .landing-hero-summary { max-width: 560px; }
  .landing-deluxe-callout { grid-template-columns: auto minmax(0, 1fr); }
  .landing-deluxe-callout .landing-button { grid-column: 2; justify-self: start; }
  .landing-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 17px; }
  .landing-journey-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .landing-section-heading-inline { grid-template-columns: 1fr; gap: 14px; }
  .landing-section-heading-inline p { max-width: 620px; }
  .public-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .public-footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  :root { --landing-gutter: 14px; }
  .landing-container, .landing-header, .public-footer { width: min(var(--landing-max-width), calc(100% - (var(--landing-gutter) * 2))); }
  .landing-header { padding-top: 8px; }
  .landing-header-bar { min-height: 54px; padding: 6px 7px 6px 12px; border-radius: 15px; }
  .landing-brand { font-size: 0.9rem; }
  .landing-brand img { width: 36px; height: 36px; }
  .landing-hero { padding: 42px 0 24px; }
  .landing-hero h1 { font-size: clamp(2.25rem, 11vw, 3.25rem); }
  .landing-hero-copy > p { font-size: 0.96rem; }
  .landing-hero-actions .landing-button { flex: 1 1 180px; }
  .landing-hero-summary { padding: 18px; }
  .landing-hero-summary > div { grid-template-columns: 1fr; }
  .landing-benefits { grid-template-columns: 1fr; }
  .landing-section { padding: 52px 0; }
  .landing-capabilities, .landing-journey-grid { grid-template-columns: 1fr; }
  .landing-capability { padding: 18px; }
  .landing-journey-link { min-height: 0; flex-direction: row; }
  .landing-journey-link > .landing-icon-tile { flex: 0 0 auto; }
  .landing-community { padding: 20px; border-radius: 18px; }
  .landing-community-card { transform: none; will-change: auto; }
  .landing-community-stats { grid-template-columns: 1fr; }
  .landing-final-cta { gap: 22px; padding: 24px 0; }
  .landing-final-actions .landing-button { flex: 1 1 100%; }
  .public-footer-grid { grid-template-columns: 1fr; gap: 21px; }
  .public-footer-brand { grid-column: auto; }
  .public-footer-bottom { align-items: flex-start; flex-direction: column; }
  .public-footer-bottom-links { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body.landing *, body.landing *::before, body.landing *::after { animation-duration: 1ms; animation-iteration-count: 1; scroll-behavior: auto; transition-duration: 1ms; }
  .landing-shell.has-reveal [data-reveal] { opacity: 1; transform: none; }
  .landing-button:hover,
  .landing-capability:hover,
  .landing-journey-link:hover,
  .landing-hero-summary > div span:hover,
  .landing-community-stats div:hover { transform: none; }
  .landing-community-card { transform: none; will-change: auto; }
}

/* Shared financial account section used by the public profile and mobile menu. */
.landing-profile-menu {
  width: min(320px, calc(100vw - 24px));
  max-height: min(72dvh, 500px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.landing-profile-menu-user > span,
.landing-mobile-account > div > span {
  gap: 3px;
}

.account-wallet-badge {
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  justify-content: start;
  gap: 5px;
  width: max-content;
  max-width: 100%;
  margin-top: 3px;
  padding: 3px 7px;
  border: 1px solid rgba(125, 177, 255, 0.26);
  border-radius: 999px;
  color: #cfe2ff;
  background: rgba(75, 130, 222, 0.12);
  font-size: 0.65rem;
  line-height: 1;
}

.account-wallet-badge > span { color: #8fa5c5; }
.landing-profile-menu-user .account-wallet-badge > strong,
.landing-mobile-account .account-wallet-badge > strong {
  overflow: visible;
  color: #eff6ff;
  font-size: 0.65rem;
  line-height: 1;
  white-space: nowrap;
}

.landing-profile-finance {
  display: grid;
  gap: 5px;
  margin-top: 8px;
  padding: 10px 0 2px;
  border-top: 1px solid rgba(179, 203, 255, 0.08);
}

.landing-profile-finance-toggle {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) 18px;
  align-items: center;
  width: 100%;
  min-height: 44px;
  padding: 7px 9px;
  gap: 9px;
  border: 0;
  border-radius: 9px;
  color: #dce8fb;
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.landing-profile-finance-toggle:hover,
.landing-profile-finance-toggle:focus-visible { color: #fff; background: rgba(117, 158, 255, 0.12); }
.account-financial-item-icon,
.landing-profile-finance-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  line-height: 1;
}
.account-financial-item-icon svg,
.landing-profile-finance-chevron svg { width: 16px; height: 16px; flex: 0 0 auto; }
.landing-profile-finance-chevron { color: #8ca6cc; transition: transform 160ms ease; }
.landing-profile-finance-toggle[aria-expanded="true"] .landing-profile-finance-chevron { transform: rotate(180deg); }

.landing-profile-finance-panel:not([hidden]) {
  display: grid;
  gap: 4px;
  padding: 1px 0 1px 8px;
  animation: landing-finance-reveal 160ms ease-out both;
}

.landing-profile-finance-link {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  width: 100%;
  min-height: 38px;
  padding: 7px 9px;
  gap: 9px;
  border: 0;
  border-radius: 9px;
  color: #cddcf2;
  background: transparent;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.landing-profile-finance-link:hover,
.landing-profile-finance-link:focus-visible,
.landing-profile-finance-link.is-active { color: #fff; background: rgba(117, 158, 255, 0.12); }
.landing-profile-finance-toggle[aria-expanded="true"] { color: #fff; background: rgba(117, 158, 255, 0.08); }

@keyframes landing-finance-reveal { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 940px) {
  .landing-mobile-menu { max-height: calc(100dvh - 82px); overflow-y: auto; overscroll-behavior: contain; }
  .landing-mobile-account .landing-profile-finance { padding-top: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .landing-profile-finance-panel:not([hidden]) { animation: none; }
}

/* Definitive shared layout for expandable account groups. Keep this scope independent
   from page content styles so subscriptions pages cannot change the profile menu. */
.account-financial-menu {
  min-width: 0;
  font-family: var(--landing-font, 'DM Sans', 'Segoe UI', sans-serif);
}

.account-financial-menu-copy,
.account-financial-menu-item-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  overflow: hidden;
  text-align: left;
}

.account-financial-menu-title,
.account-financial-menu-description,
.account-financial-menu-item-title,
.account-financial-menu-item-description {
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  margin: 0;
}

.account-financial-menu-title,
.account-financial-menu-item-title {
  overflow: hidden;
  color: inherit;
  font-family: var(--landing-font, 'DM Sans', 'Segoe UI', sans-serif);
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-financial-menu-description,
.account-financial-menu-item-description {
  overflow-wrap: anywhere;
  color: #8295b1;
  font-family: var(--landing-font, 'DM Sans', 'Segoe UI', sans-serif);
  font-size: .7rem;
  font-weight: 500;
  line-height: 1.3;
  white-space: normal;
}

.account-financial-menu .account-financial-item-icon,
.account-financial-menu .account-financial-menu-item-action,
.account-financial-menu .landing-profile-finance-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 1;
}

.account-financial-menu .account-financial-item-icon { align-self: flex-start; margin-top: 2px; }
.account-financial-menu .account-financial-menu-item-action { align-self: flex-start; width: 16px; height: 18px; margin-top: 1px; color: #8ca6cc; }
.account-financial-menu .account-financial-menu-item-action svg { width: 14px; height: 14px; flex: 0 0 auto; }

.landing-profile-finance-toggle {
  grid-template-columns: 18px minmax(0, 1fr) 18px;
}

.landing-profile-finance-toggle .account-financial-menu-copy,
.landing-profile-finance-link .account-financial-menu-item-copy {
  min-width: 0;
}

.landing-profile-finance-link {
  grid-template-columns: 18px minmax(0, 1fr) 16px;
  align-items: flex-start;
  min-height: 44px;
}

.landing-profile-finance-link .account-financial-menu-item-title {
  font-size: .78rem;
  line-height: 1.25;
}

.landing-profile-finance-link .account-financial-menu-item-description {
  font-size: .68rem;
  line-height: 1.3;
}

.landing-profile-finance-link:hover .account-financial-menu-item-action,
.landing-profile-finance-link:focus-visible .account-financial-menu-item-action,
.landing-profile-finance-link.is-active .account-financial-menu-item-action { color: #fff; }

@media (max-width: 940px) {
  .landing-mobile-account .landing-profile-finance-link { min-height: 46px; }
}