@font-face {
  font-family: "Manrope";
  src: url("assets/fonts/Manrope-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

@font-face {
  font-family: "Playfair Display";
  src: url("assets/fonts/PlayfairDisplay-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
}

:root {
  color-scheme: light;
  --page-bg: #edf2f8;
  --canvas: #f8f7f4;
  --surface: #ffffff;
  --surface-muted: #e7e6e3;
  --text: #181817;
  --text-muted: #5d5d59;
  --border: #deddd9;
  --media: #a8d7ff;
  --brand-blue: #2c3954;
  --accent-blue: #96b3f2;
  --sand: #d9b46a;
  --sand-light: #f3ddb1;
  --badge-blue-gradient: linear-gradient(
    135deg,
    color-mix(in srgb, var(--media) 72%, #ffffff),
    color-mix(in srgb, var(--accent-blue) 58%, #ffffff)
  );
  --gold-gradient: linear-gradient(135deg, var(--sand-light) 0%, var(--sand) 100%);
  --hero-gradient: linear-gradient(
    145deg,
    color-mix(in srgb, var(--accent-blue) 18%, var(--brand-blue)) 0%,
    var(--brand-blue) 48%,
    color-mix(in srgb, var(--media) 8%, var(--brand-blue)) 100%
  );
  --button-gradient: linear-gradient(
    135deg,
    color-mix(in srgb, var(--media) 42%, var(--accent-blue)) 0%,
    var(--accent-blue) 42%,
    color-mix(in srgb, var(--brand-blue) 38%, var(--accent-blue)) 100%
  );
  --card-shadow:
    0 8px 18px rgba(12, 18, 31, 0.16),
    0 2px 4px rgba(12, 18, 31, 0.08);
  --soft-shadow:
    0 10px 24px rgba(44, 57, 84, 0.08),
    0 2px 5px rgba(44, 57, 84, 0.05);
  --on-dark: #ffffff;
  --site-header-height: 88px;
  --supporting-text-size: clamp(0.82rem, 3.85vw, 1.08rem);
  --duration-fast: 120ms;
  --duration-default: 220ms;
  --duration-slow: 320ms;
  --reveal-distance: 14px;
  --reveal-stagger: 80ms;
  --reveal-max-delay: 400ms;
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--page-bg);
}

html.menu-open,
html.menu-open body {
  overflow: hidden;
}

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100svh;
  color: var(--text);
  background: var(--page-bg);
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}

button,
a {
  color: inherit;
  font: inherit;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(24, 24, 23, 0.12);
}

a {
  text-decoration: none;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 10px 13px;
  border-radius: 12px;
  color: var(--on-dark);
  background: var(--brand-blue);
  font-size: 14px;
  font-weight: 750;
  transform: translateY(-160%);
}

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

button:focus-visible,
a:focus-visible {
  outline: 2px solid var(--surface);
  outline-offset: 2px;
  box-shadow: 0 0 0 5px var(--brand-blue);
}

summary:focus-visible,
.review-track:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 3px var(--accent-blue);
}

.mobile-page {
  position: relative;
  width: min(100%, 480px);
  min-height: 100vh;
  min-height: 100svh;
  margin: 0 auto;
  overflow: clip;
  background: var(--canvas);
}

.site-header {
  position: relative;
  z-index: 30;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 52px;
  align-items: center;
  gap: 8px;
  /* Keep the header height fixed when resizing the logo. */
  height: var(--site-header-height);
  padding: 5px 16px;
}

.wordmark {
  position: relative;
  z-index: 2;
  display: block;
  min-width: 0;
  max-width: 166px;
  justify-self: start;
  font-family: "Playfair Display", Georgia, serif;
  font-size: 22px;
  font-weight: 650;
  line-height: 0.96;
  letter-spacing: -0.025em;
}

.site-header__brand,
.footer-wordmark {
  display: flex;
  width: 184.32px;
  max-width: 100%;
  align-items: center;
  gap: 7.2px;
  color: var(--brand-blue);
  line-height: 1;
}

.site-header__brand-icon,
.footer-brand-icon {
  display: block;
  width: 70.2px;
  height: 70.2px;
  flex: 0 0 70.2px;
}

.site-header__brand-text,
.footer-brand-text {
  display: block;
  width: 106.92px;
  min-width: 0;
  height: auto;
}

.menu-toggle {
  position: relative;
  z-index: 2;
  display: grid;
  width: 52px;
  height: 52px;
  padding: 13px;
  border: 0;
  border-radius: 50%;
  background: var(--accent-blue);
  cursor: pointer;
  place-content: center;
}

.menu-toggle::before,
.menu-toggle::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 19px;
  height: 2px;
  border-radius: 999px;
  background: var(--on-dark);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, -50%, 0) rotate(0deg) scaleX(0.72);
  transition:
    opacity 140ms var(--ease-out),
    transform 180ms var(--ease-in-out);
}

.menu-toggle img {
  display: block;
  width: 24px;
  height: 24px;
  opacity: 1;
  transform: scale(1);
  transition:
    opacity 120ms var(--ease-out),
    transform 180ms var(--ease-in-out);
}

.menu-toggle[aria-expanded="true"] img {
  opacity: 0;
  transform: scale(0.72);
}

.menu-toggle[aria-expanded="true"]::before,
.menu-toggle[aria-expanded="true"]::after {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0) rotate(45deg) scaleX(1);
}

.menu-toggle[aria-expanded="true"]::after {
  transform: translate3d(-50%, -50%, 0) rotate(-45deg) scaleX(1);
}

.mobile-menu {
  --menu-action-height: 64px;
  --menu-bottom-gap: max(18px, env(safe-area-inset-bottom, 0px));
  position: fixed;
  z-index: 1;
  top: 0;
  left: 50%;
  width: min(100%, 480px);
  height: 100vh;
  height: 100dvh;
  padding: var(--site-header-height) 16px 0;
  overflow: hidden;
  overscroll-behavior: contain;
  color: var(--brand-blue);
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--accent-blue) 16%, var(--canvas)), var(--canvas) 48%),
    var(--canvas);
  box-shadow: 0 18px 50px rgba(44, 57, 84, 0.18);
  transform: translateX(-50%);
  animation: mobile-menu-enter var(--duration-slow) var(--ease-out);
}

.mobile-menu[hidden],
.mobile-menu__links a[hidden],
.menu-scrollbar[hidden],
.trial-section[hidden] {
  display: none;
}

.mobile-menu__inner {
  position: relative;
  height: 100%;
  min-height: 0;
}

.mobile-menu__links {
  display: grid;
  height: 100%;
  align-content: start;
  padding-bottom: calc(var(--menu-action-height) + var(--menu-bottom-gap) + 16px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-padding-bottom: calc(var(--menu-action-height) + var(--menu-bottom-gap) + 16px);
  border-top: 1px solid color-mix(in srgb, var(--brand-blue) 12%, transparent);
}

.mobile-menu__links a {
  display: flex;
  min-height: 52px;
  align-items: center;
  border-bottom: 1px solid color-mix(in srgb, var(--brand-blue) 12%, transparent);
  font-size: 18px;
  font-weight: 690;
  letter-spacing: -0.025em;
}

.mobile-menu__links a:focus-visible {
  outline: 2px solid var(--accent-blue);
  outline-offset: -3px;
  box-shadow: none;
}

.mobile-menu__links .mobile-menu__support {
  justify-content: flex-start;
  gap: 10px;
  margin-bottom: 16px;
  border-bottom: 0;
  color: var(--brand-blue);
  font-weight: 800;
}

.mobile-menu__support > span:first-child {
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 4px;
}

.mobile-menu.has-custom-scrollbar .mobile-menu__links {
  padding-right: 16px;
  scrollbar-width: none;
}

.mobile-menu.has-custom-scrollbar .mobile-menu__links::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.menu-scrollbar {
  position: absolute;
  z-index: 3;
  top: 8px;
  right: -16px;
  bottom: calc(var(--menu-action-height) + var(--menu-bottom-gap) + 12px);
  width: 32px;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  cursor: pointer;
}

.menu-scrollbar::before,
.menu-scrollbar__thumb::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  border-radius: 999px;
  transform: translateX(-50%);
  content: "";
}

.menu-scrollbar::before {
  width: 4px;
  background: color-mix(in srgb, var(--accent-blue) 16%, transparent);
}

.menu-scrollbar__thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--menu-thumb-height, 44px);
  transform: translateY(var(--menu-thumb-top, 0px));
  cursor: grab;
}

.menu-scrollbar__thumb::before {
  width: 6px;
  background: linear-gradient(180deg, var(--media), var(--accent-blue));
  transition: width var(--duration-fast) var(--ease-out);
}

.menu-scrollbar__thumb:focus-visible {
  outline: none;
}

.menu-scrollbar__thumb:focus-visible::before {
  background: var(--accent-blue);
}

.menu-scrollbar__thumb:focus-visible::before,
.menu-scrollbar.is-dragging .menu-scrollbar__thumb::before { width: 8px; }
.menu-scrollbar.is-dragging,
.menu-scrollbar.is-dragging .menu-scrollbar__thumb { cursor: grabbing; }

@media (prefers-reduced-motion: reduce) {
  .menu-scrollbar__thumb::before { transition: none; }
}

.mobile-menu__footer {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: var(--menu-bottom-gap);
  left: 0;
  background: none;
  pointer-events: none;
}

.mobile-menu__action {
  min-height: var(--menu-action-height);
  margin: 0;
  pointer-events: auto;
}

.mobile-menu__links a:active,
.mobile-menu__action:active {
  transform: scale(0.985);
}

main {
  padding: 0;
}

.hero {
  position: relative;
  padding: 26px 16px 22px;
  overflow: clip;
  border-radius: 32px;
  background: var(--brand-blue);
  background: var(--hero-gradient);
  isolation: isolate;
}

.section-portrait {
  position: relative;
  overflow: clip;
  isolation: isolate;
}

.hero::before,
.section-portrait::before {
  position: absolute;
  z-index: 0;
  top: -10px;
  right: clamp(-128px, -22vw, -72px);
  width: clamp(300px, 88.8vw, 396px);
  aspect-ratio: 1338 / 1175;
  background: url("assets/images/marcus-aurelius-hero-v2.png") top right / contain no-repeat;
  content: "";
  opacity: 1;
  pointer-events: none;
  -webkit-mask-image:
    linear-gradient(
      to right,
      transparent 0%,
      rgba(0, 0, 0, 0.22) 10%,
      rgba(0, 0, 0, 0.94) 27%,
      #000 42%,
      #000 100%
    ),
    linear-gradient(
      to bottom,
      #000 0%,
      #000 68%,
      rgba(0, 0, 0, 0.98) 78%,
      transparent 100%
    );
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(
      to right,
      transparent 0%,
      rgba(0, 0, 0, 0.18) 10%,
      rgba(0, 0, 0, 0.78) 27%,
      #000 42%,
      #000 100%
    ),
    linear-gradient(
      to bottom,
      #000 0%,
      #000 68%,
      rgba(0, 0, 0, 0.82) 78%,
      transparent 100%
    );
  mask-composite: intersect;
}

.hero::after {
  position: absolute;
  z-index: 0;
  right: 50%;
  bottom: -42px;
  width: clamp(462px, 146%, 559px);
  aspect-ratio: 1397 / 918;
  background: url("assets/images/hero-amphitheater.png") center / contain no-repeat;
  content: "";
  filter: contrast(0.92) saturate(0.55) brightness(1.08);
  opacity: 0.63;
  pointer-events: none;
  transform: translateX(50%);
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.42) 15%,
    #000 34%,
    #000 76%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.42) 15%,
    #000 34%,
    #000 76%,
    transparent 100%
  );
}

.hero > *,
.section-portrait > * {
  position: relative;
  z-index: 1;
}

.hero h1 {
  max-width: none;
  margin: 0;
  color: var(--on-dark);
  font-size: clamp(1.6875rem, 8.7vw, 2.125rem);
  font-weight: 760;
  line-height: 0.98;
  letter-spacing: -0.5px;
}

.hero h1 span {
  display: block;
  white-space: nowrap;
}

.hero h1 .hero-title__highlight {
  width: fit-content;
  max-width: 100%;
  background-image: linear-gradient(
    90deg,
    rgba(168, 215, 255, 0.58),
    rgba(150, 179, 242, 0.4)
  );
  background-repeat: no-repeat;
  background-position: 0 calc(88% + 3px);
  background-size: 100% 0.58em;
}

.hero-description {
  max-width: none;
  margin: 27px 0 0;
  color: var(--on-dark);
  font-size: min(var(--supporting-text-size), 14.7px);
  font-weight: 430;
  line-height: 1.38;
  letter-spacing: -0.018em;
  text-wrap: pretty;
}

.hero-description span {
  display: block;
  white-space: nowrap;
}

.hero-stage {
  --hero-photo-height: clamp(250px, 70.5vw, 305px);
  position: relative;
  height: var(--hero-photo-height);
  margin-top: 43px;
  overflow: hidden;
  border-radius: 28px;
  background: transparent;
}

.hero-photo {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: var(--hero-photo-height);
  margin: 0;
  overflow: hidden;
  border-radius: 20px;
  background: #d7d7d2;
  user-select: none;
}

.hero-photo > img {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  object-fit: cover;
  transform: scale(1.15);
  -webkit-user-drag: none;
  object-position: 44% 35%;
  transform-origin: 44% 35%;
}

.hero-photo__pagination {
  position: absolute;
  z-index: 2;
  bottom: 14px;
  left: 50%;
  display: flex;
  align-items: center;
  padding: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 0 2px 6px rgba(12, 18, 31, 0.06);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transform: translateX(-50%);
}

.hero-photo__indicator {
  position: relative;
  display: grid;
  width: 22px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  transition: width var(--duration-default) var(--ease-in-out);
  place-items: center;
}

.hero-photo__indicator::before {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(44, 57, 84, 0.18);
  content: "";
  transition:
    width var(--duration-default) var(--ease-in-out),
    background-color var(--duration-default) var(--ease-in-out);
}

.hero-photo__indicator.is-active {
  width: 36px;
}

.hero-photo__indicator.is-active::before {
  width: 32px;
  background: linear-gradient(90deg, var(--media), var(--accent-blue));
  box-shadow: none;
}

.primary-action {
  position: relative;
  display: flex;
  min-height: 64px;
  margin-top: 12px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px 10px 20px;
  border-radius: 22px;
  overflow: hidden;
  color: var(--on-dark);
  background: var(--button-gradient);
  box-shadow:
    0 8px 18px rgba(44, 57, 84, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
  font-size: 18px;
  font-weight: 720;
  line-height: 1.1;
  letter-spacing: -0.025em;
  transform-origin: center;
  isolation: isolate;
  transition: transform var(--duration-fast) var(--ease-out);
}

.primary-action:active {
  transform: scale(0.98);
}

.primary-action--hero-trial {
  margin-top: 50px;
  border: 1px solid rgba(44, 57, 84, 0.08);
  color: var(--brand-blue);
  background: linear-gradient(145deg, #ffffff 0%, #f8fbff 100%);
  box-shadow:
    0 8px 18px rgba(12, 18, 31, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.primary-action--hero-trial .primary-action__badge {
  background: var(--badge-blue-gradient);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.52);
}

.primary-action--learn-more {
  justify-content: space-between;
}

.primary-action--hero-trial .primary-action__label,
.primary-action--learn-more .primary-action__label {
  width: 100%;
  justify-content: space-between;
}

.primary-action--hero-trial .cta-arrow,
.primary-action--learn-more .cta-arrow,
.section-action > .cta-arrow {
  margin-right: 5px;
}

.primary-action__label {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
}

.action-chevron {
  display: block;
  width: 8px;
  height: 12px;
  flex: 0 0 auto;
  background: currentColor;
  -webkit-mask: url("assets/icons/cta-chevron.svg") center / contain no-repeat;
  mask: url("assets/icons/cta-chevron.svg") center / contain no-repeat;
}

.cta-arrow {
  position: relative;
  top: 1px;
  left: -5px;
  transform: translateX(1px);
  animation: primary-action-arrow-nudge 2.1s var(--ease-in-out) infinite;
}

.action-chevron--back {
  transform: rotate(180deg);
}

.primary-action__badge {
  flex: 0 0 auto;
  padding: 11px 13px;
  border-radius: 999px;
  color: var(--brand-blue);
  background: var(--surface);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.action-note {
  max-width: 41ch;
  margin: 13px auto 0;
  padding: 0 4px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  text-wrap: pretty;
}

/* Approved first screen of the revised landing. */
.hero--current {
  margin-top: 0;
  padding-top: 28px;
  padding-bottom: 24px;
  color: var(--on-dark);
  scroll-margin-top: 16px;
}

.section-eyebrow,
.section-heading .section-eyebrow {
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid var(--surface);
  border-radius: 999px;
  color: var(--brand-blue);
  background: var(--surface);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  text-wrap: balance;
  opacity: 1;
}

.hero-new__eyebrow {
  margin-bottom: 18px;
}

.hero .hero-new__title {
  margin: 0;
  font-size: clamp(1.75rem, 8.5vw, 2.375rem);
  font-weight: 760;
  line-height: 1.06;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.hero-new__topics {
  container-type: inline-size;
  display: grid;
  gap: 6px;
  margin: 22px 0 0;
}

.hero-new__topics-row {
  display: flex;
  align-items: stretch;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hero-new__topics li {
  max-width: 100%;
  min-width: 0;
  flex-shrink: 0;
  padding: 7px 6px;
  border: 1px solid rgba(168, 215, 255, 0.24);
  border-radius: 10px;
  background: rgba(168, 215, 255, 0.09);
  color: rgba(255, 255, 255, 0.75);
  font-size: clamp(10px, 2.92cqw, 12px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
}

.hero-new__topics-row:first-child li:first-child,
.hero-new__topics-row:last-child li:last-child {
  flex-shrink: 1;
}

.hero-new__description {
  margin: 20px 0 0;
  color: var(--on-dark);
  font-size: 15px;
  font-weight: 430;
  line-height: 1.5;
}

.hero-new__description span {
  display: block;
}

.hero--current .hero-stage {
  margin-top: 24px;
}

.hero-new__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.hero-new__facts li {
  display: flex;
  min-width: 0;
  min-height: 44px;
  align-items: center;
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  color: var(--on-dark);
  background: rgba(255, 255, 255, 0.1);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.25;
}

.hero-new__fact--wide {
  grid-column: 1 / -1;
}

.hero-new__facts.is-reveal-ready li {
  opacity: 0;
  transform: translateY(10px);
}

.hero-new__facts.is-reveal-ready.is-revealed li {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-out);
}

.hero-new__facts.is-revealed li:nth-child(2) { transition-delay: 160ms; }
.hero-new__facts.is-revealed li:nth-child(3) { transition-delay: 320ms; }
.hero-new__facts.is-revealed li:nth-child(4) { transition-delay: 480ms; }
.hero-new__facts.is-revealed li:nth-child(5) { transition-delay: 640ms; }

@media (prefers-reduced-motion: reduce) {
  .hero-new__facts.is-reveal-ready li,
  .hero-new__facts.is-reveal-ready.is-revealed li {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.hero-new__action,
.closing-action {
  gap: 8px;
  margin-top: 20px;
  padding-left: 16px;
}

.hero-new__action .primary-action__label,
.closing-action .primary-action__label {
  width: auto;
  flex: 1;
  gap: 6px;
  justify-content: space-between;
}

.hero-new__action .cta-arrow,
.closing-action .cta-arrow {
  margin-right: 0;
}

.hero-new__action .primary-action__label > span:first-child,
.closing-action .primary-action__label > span:first-child {
  white-space: normal;
  text-wrap: balance;
}

.landing-section {
  padding: 50px 16px 0;
}

.section-shell {
  margin-top: 50px;
  padding: 32px 16px 28px;
  border-radius: 32px;
}

.section-heading {
  display: grid;
  gap: 14px;
  margin: 0 0 24px;
}

.section-heading h2 {
  margin: 0;
  color: var(--brand-blue);
  font-size: clamp(1.9rem, 8.6vw, 2.125rem);
  font-weight: 760;
  line-height: 1.01;
  letter-spacing: -0.5px;
  text-wrap: balance;
}

.heading-underline {
  display: inline-block;
  background-image: linear-gradient(
    90deg,
    rgba(168, 215, 255, 0.58),
    rgba(150, 179, 242, 0.4)
  );
  background-repeat: no-repeat;
  background-position: 0 88%;
  background-size: 100% 0.58em;
  white-space: nowrap;
}

.final-section h2 > .heading-underline {
  display: inline-block;
  width: fit-content;
}

.section-heading p {
  max-width: 38ch;
  margin: 0;
  color: color-mix(in srgb, var(--brand-blue) 82%, var(--canvas));
  font-size: 16px;
  font-weight: 470;
  line-height: 1.45;
  letter-spacing: -0.018em;
  text-wrap: pretty;
}

.section-heading--on-dark h2,
.section-heading--on-dark p {
  color: var(--on-dark);
}

.section-heading--on-dark p {
  opacity: 0.84;
}

.card-label {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 7px 10px;
  border-radius: 999px;
  color: var(--brand-blue);
  background: color-mix(in srgb, var(--accent-blue) 24%, var(--canvas));
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.section-action {
  position: relative;
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px 12px 20px;
  border-radius: 21px;
  overflow: hidden;
  color: var(--on-dark);
  background: var(--button-gradient);
  box-shadow:
    0 8px 18px rgba(44, 57, 84, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  font-size: 17px;
  font-weight: 740;
  line-height: 1.1;
  letter-spacing: -0.025em;
  isolation: isolate;
  transition: transform var(--duration-fast) var(--ease-out);
}

.section-action:active {
  transform: scale(0.985);
}

.primary-action::before,
.section-action::before {
  position: absolute;
  z-index: 0;
  top: -70%;
  bottom: -70%;
  left: -12%;
  width: 72%;
  background: linear-gradient(
    105deg,
    transparent 8%,
    rgba(255, 240, 196, 0.025) 27%,
    rgba(255, 244, 211, 0.1) 43%,
    rgba(255, 255, 255, 0.15) 51%,
    rgba(255, 241, 201, 0.08) 61%,
    transparent 88%
  );
  content: "";
  filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transform: skewX(-10deg) translate3d(-145%, 0, 0);
  animation: cta-shimmer 4.8s cubic-bezier(0.45, 0, 0.3, 1) infinite;
  will-change: transform, opacity;
}

.primary-action > *,
.section-action > * {
  position: relative;
  z-index: 1;
}

.section-action--dark {
  color: var(--on-dark);
  background: var(--button-gradient);
}

.section-action--light {
  color: var(--on-dark);
  background: var(--button-gradient);
}

.section-action__label {
  display: inline-flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  white-space: nowrap;
}

.section-action__badge {
  flex: 0 0 auto;
  padding: 9px 11px;
  border-radius: 999px;
  color: var(--brand-blue);
  background: var(--surface);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.paths-section {
  padding-top: 57px;
}

.path-list {
  display: grid;
  gap: 12px;
}

.path-card {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 8%, transparent);
  border-radius: 24px;
  color: var(--brand-blue);
  background: var(--surface);
  box-shadow: var(--soft-shadow);
}

.path-card--accent {
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--media) 38%, var(--canvas)),
    var(--canvas) 64%
  );
}

.path-card--blue {
  background: color-mix(in srgb, var(--accent-blue) 45%, var(--canvas));
}

.path-card summary {
  position: relative;
  display: grid;
  gap: 13px;
  padding: 18px 18px 24px;
  cursor: pointer;
  isolation: isolate;
  list-style: none;
}

.path-card summary::-webkit-details-marker {
  display: none;
}

.path-card__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  opacity: 0.5;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.path-card__art {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 0;
  box-sizing: border-box;
  display: block;
  width: clamp(72px, 20vw, 84px);
  aspect-ratio: 1;
  overflow: hidden;
  padding: 5px;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 8%, transparent);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: none;
  pointer-events: none;
}

.path-card__art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1.15);
  transform-origin: center;
}

.path-card--illustrated summary > :not(.path-card__art) {
  position: relative;
  z-index: 1;
}

.path-card--illustrated .path-card__meta {
  padding-right: 94px;
}

.path-card summary strong {
  display: block;
  max-width: 17ch;
  font-size: clamp(1.28rem, 6vw, 1.62rem);
  font-weight: 750;
  line-height: 1.04;
  letter-spacing: -0.5px;
}

.path-card.path-card--illustrated summary strong {
  max-width: calc(100% - 100px);
  margin-top: 10px;
}

.path-card__lead {
  display: block;
  max-width: 36ch;
  color: color-mix(in srgb, var(--brand-blue) 82%, var(--canvas));
  font-size: 14px;
  font-weight: 470;
  line-height: 1.38;
  letter-spacing: -0.018em;
}

.path-card__toggle {
  display: inline-flex;
  width: fit-content;
  min-width: 118px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand-blue) 8%, transparent);
  font-size: 12px;
  font-weight: 760;
}

.path-card__toggle::after {
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "";
  transform: rotate(45deg) translateY(-2px);
  transition: transform var(--duration-default) var(--ease-in-out);
}

.path-card[open] .path-card__toggle::after {
  transform: rotate(225deg) translate(-1px, -1px);
}

.path-card__body {
  padding: 0 18px 24px;
}

.path-card[open] .path-card__body {
  animation: details-enter var(--duration-default) var(--ease-out);
}

.benefit-list,
.price-includes {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.benefit-list li,
.price-includes li {
  position: relative;
  padding-left: 22px;
  font-size: 14px;
  font-weight: 520;
  line-height: 1.35;
}

.benefit-list li::before,
.price-includes li::before,
.professional-questions li::before {
  position: absolute;
  top: 0.28em;
  left: 0;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--accent-blue);
  box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--accent-blue) 42%, var(--surface));
  content: "";
}

.inline-action {
  display: flex;
  min-height: 50px;
  margin-top: 16px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 16px;
  color: var(--on-dark);
  background: var(--button-gradient);
  box-shadow:
    0 7px 16px rgba(44, 57, 84, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  font-size: 14px;
  font-weight: 750;
  text-align: center;
}

.inline-action::after {
  position: relative;
  left: -5px;
  width: 8px;
  height: 12px;
  flex: 0 0 auto;
  background: currentColor;
  content: "";
  -webkit-mask: url("assets/icons/cta-chevron.svg") center / contain no-repeat;
  mask: url("assets/icons/cta-chevron.svg") center / contain no-repeat;
  animation: primary-action-arrow-nudge 2.1s var(--ease-in-out) infinite;
}

/* Alternative second section, immediately after the original routes. */
.paths-section--current {
  scroll-margin-top: 24px;
}

.path-choice {
  display: grid;
  gap: 18px;
  padding: clamp(16px, 4.6vw, 20px);
}

.path-choice__heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 14px;
}

.path-choice__heading h3 {
  margin: 0;
  font-size: clamp(20px, 5.8vw, 24px);
  font-weight: 750;
  line-height: 1.12;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.path-choice .path-card__art {
  position: static;
}

.path-choice__copy {
  display: grid;
  gap: 12px;
}

.path-choice__copy p {
  margin: 0;
  color: color-mix(in srgb, var(--brand-blue) 82%, var(--canvas));
  font-size: 15px;
  font-weight: 470;
  line-height: 1.45;
  text-wrap: pretty;
}

.path-choice__action {
  margin: 0;
  color: var(--brand-blue);
}

.inside-section {
  position: relative;
  overflow: hidden;
  background: linear-gradient(
    150deg,
    color-mix(in srgb, var(--media) 58%, var(--canvas)),
    color-mix(in srgb, var(--accent-blue) 35%, var(--canvas))
  );
  isolation: isolate;
}

.inside-section::before {
  position: absolute;
  z-index: 0;
  top: -10px;
  right: -23px;
  width: 208px;
  aspect-ratio: 450 / 640;
  background: url("assets/images/inside-marcus-bust.png") top right / contain no-repeat;
  content: "";
  filter: contrast(0.92) saturate(0.6);
  opacity: 0.32;
  pointer-events: none;
  -webkit-mask-image:
    linear-gradient(to left, #000 0%, #000 48%, rgba(0, 0, 0, 0.74) 68%, transparent 100%),
    linear-gradient(to bottom, #000 0%, #000 58%, rgba(0, 0, 0, 0.62) 76%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to left, #000 0%, #000 48%, rgba(0, 0, 0, 0.74) 68%, transparent 100%),
    linear-gradient(to bottom, #000 0%, #000 58%, rgba(0, 0, 0, 0.62) 76%, transparent 100%);
  mask-composite: intersect;
}

.club-section::before {
  content: none;
}

.inside-section .section-heading h2 > span {
  display: block;
}

.inside-section > * {
  position: relative;
  z-index: 1;
}

.inside-bento {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.inside-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border-radius: 22px;
  color: var(--brand-blue);
  background: var(--canvas);
  box-shadow: 0 3px 10px rgba(44, 57, 84, 0.06);
}

.inside-card h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 760;
  line-height: 1.05;
  letter-spacing: -0.5px;
}

.inside-card p {
  margin: 0;
  color: color-mix(in srgb, var(--brand-blue) 80%, var(--canvas));
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.014em;
}

.inside-card--media,
.inside-card--wide {
  grid-column: 1 / -1;
}

.inside-card--media {
  min-height: calc(clamp(245px, 68vw, 300px) + 210px);
}

.inside-card__copy {
  display: grid;
  gap: 12px;
  padding: 18px;
}

.inside-card__copy h3 {
  max-width: none;
  font-size: 23px;
}

.inside-card__copy p {
  max-width: 34ch;
  font-size: 14px;
}

.inside-card--media img {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: clamp(245px, 68vw, 300px);
  border-radius: 24px 24px 0 0;
  object-fit: cover;
  object-position: 50% 0%;
}

.inside-card__chips {
  position: absolute;
  right: 12px;
  bottom: 12px;
  left: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.inside-card__chips span,
.inside-card__rows span {
  padding: 7px 9px;
  border-radius: 999px;
  color: var(--brand-blue);
  background: rgba(255, 255, 255, 0.9);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.1;
}

.inside-card--compact {
  display: grid;
  min-height: 188px;
  align-content: space-between;
  gap: 12px;
  padding: 15px 15px 24px;
}

.inside-card__number {
  display: grid;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent-blue) 30%, var(--canvas));
  place-items: center;
}

.inside-card__number img {
  display: block;
  width: 34px;
  height: 34px;
  opacity: 0.3;
  object-fit: contain;
}

.inside-card--dark {
  color: var(--on-dark);
  background: var(--brand-blue);
}

.inside-card--dark p {
  color: rgba(255, 255, 255, 0.76);
}

.inside-card--dark .inside-card__number {
  background: rgba(255, 255, 255, 0.13);
}

.inside-card--wide {
  display: grid;
  gap: 14px;
  padding: 18px 18px 24px;
}

.inside-card--sand {
  isolation: isolate;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--sand-light) 78%, var(--canvas)) 0%,
    color-mix(in srgb, var(--sand) 46%, var(--canvas)) 100%
  );
}

.inside-card--sand > * {
  position: relative;
  z-index: 1;
}

.inside-card--sand .inside-card__number {
  position: absolute;
  top: 18px;
  right: 18px;
  background: rgba(255, 255, 255, 0.58);
}

.inside-card--sand h3 {
  padding-right: 58px;
}

.inside-card--sand .inside-card__rows span {
  background: rgba(255, 255, 255, 0.58);
}

.inside-card--wide h3 {
  max-width: 24ch;
  font-size: 22px;
}

.inside-card__rows {
  display: grid;
  gap: 7px;
}

.inside-card__rows span {
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent-blue) 17%, var(--surface));
  font-size: 12px;
}

.inside-card--link {
  background: var(--accent-blue);
}

/* One symptom per step, with a moving white highlight. */
.anxiety-section {
  color: var(--on-dark);
  background: var(--hero-gradient);
  scroll-margin-top: 24px;
}

.anxiety-section .section-heading h2 {
  text-wrap: balance;
}

.anxiety-symptoms {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin: 0;
  padding: 0 5px;
  list-style: none;
}

.anxiety-symptoms li {
  display: flex;
  min-width: 0;
  min-height: 44px;
  align-items: center;
  padding: 11px 14px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 14px;
  color: var(--on-dark);
  background: transparent;
  font-size: 14px;
  font-weight: 560;
  line-height: 1.4;
  transform: scale(1);
  transform-origin: center;
  transition:
    transform var(--duration-slow) var(--ease-emphasized),
    background-color var(--duration-slow) var(--ease-in-out),
    border-color var(--duration-slow) var(--ease-in-out),
    color var(--duration-slow) var(--ease-in-out),
    box-shadow var(--duration-slow) var(--ease-out);
}

.anxiety-symptoms li.is-active {
  border-color: var(--surface);
  color: var(--brand-blue);
  background: var(--surface);
  box-shadow: 0 8px 18px rgba(12, 18, 31, 0.14);
  transform: scale(1.025);
}

@media (prefers-reduced-motion: reduce) {
  .anxiety-symptoms li,
  .anxiety-symptoms li.is-active { transform: none; transition: none; }
}

.anxiety-section__copy {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}

.anxiety-section__copy p {
  margin: 0;
  font-size: 15px;
  font-weight: 470;
  line-height: 1.45;
  text-wrap: pretty;
}

.anxiety-section__action {
  margin-top: 24px;
  color: var(--brand-blue);
}

.community-section {
  color: var(--on-dark);
  background: var(--hero-gradient);
}

.community-photo {
  position: relative;
  height: clamp(245px, 68vw, 300px);
  margin: 0;
  overflow: hidden;
  border-radius: 24px;
  background: var(--brand-blue);
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.community-photo:active {
  cursor: grabbing;
}

.community-photo__pagination {
  left: 50%;
  transform: translateX(-50%);
}

.community-photo__track {
  display: flex;
  height: 100%;
  transform: translate3d(0, 0, 0);
  transition: transform var(--duration-default) var(--ease-in-out);
  will-change: transform;
}

.community-photo__slide {
  height: 100%;
  min-width: 100%;
  flex: 0 0 100%;
  overflow: hidden;
}

.community-photo::after {
  position: absolute;
  inset: 45% 0 0;
  background: linear-gradient(transparent, rgba(23, 31, 50, 0.78));
  content: "";
  pointer-events: none;
}

.community-photo img {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  object-fit: cover;
  -webkit-user-drag: none;
}

.community-photo__slide--group img {
  object-position: 50% 54%;
}

.community-photo__slide--meeting img {
  object-position: 50% 46%;
}

.community-photo__slide--lecture img {
  object-position: 50% 43%;
}

.community-photo__slide--discussion img {
  object-position: 50% 38%;
}

.community-photo__slide--conversation img {
  object-position: 50% 34%;
}

.community-photo--static,
.community-photo--static:active {
  cursor: auto;
  touch-action: auto;
}

.community-photo--static::after { content: none; }

.community-photo--static > img {
  object-position: 50% 38%;
  transform: scale(1.15);
  transform-origin: 50% 38%;
}

.community-tags {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.community-tags span {
  display: flex;
  min-height: 60px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.1);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.25;
}

.community-section .section-action {
  margin-top: 12px;
}

.club-section {
  scroll-margin-top: 24px;
}

.club-story {
  overflow: hidden;
  border-radius: 22px;
  color: var(--brand-blue);
  background: var(--canvas);
  box-shadow: 0 3px 10px rgba(44, 57, 84, 0.06);
}

.club-story__copy {
  display: grid;
  gap: 14px;
  padding: 20px 18px 24px;
}

.club-story__copy p {
  margin: 0;
  font-size: 16px;
  font-weight: 470;
  line-height: 1.45;
  letter-spacing: -0.018em;
  text-wrap: pretty;
}

.club-story__copy .club-story__lead {
  font-size: 20px;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.club-story__photo {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 24px 24px 0 0;
}

.club-library {
  margin-top: 16px;
  padding: 20px 14px 14px;
  border-radius: 22px;
  color: var(--on-dark);
  background: var(--hero-gradient);
}

.club-library h3 {
  margin: 0 0 16px;
  font-size: 22px;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.club-library__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.club-library__facts li {
  display: flex;
  min-width: 0;
  min-height: 44px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.1);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.35;
  text-wrap: pretty;
}

.club-library__fact--wide {
  grid-column: 1 / -1;
}

.club-library__facts .club-library__fact--white,
.club-library__facts .club-library__fact--blue,
.club-library__facts .club-library__fact--gold {
  color: var(--brand-blue);
  border-color: rgba(255, 255, 255, 0.25);
}

.club-library__facts .club-library__fact--white {
  background: var(--surface);
}

.club-library__facts .club-library__fact--blue {
  background: var(--badge-blue-gradient);
}

.club-library__facts .club-library__fact--gold {
  background: var(--gold-gradient);
}

.ai-section {
  position: relative;
  overflow: visible;
  background: var(--canvas);
  isolation: isolate;
}

.ai-section::before {
  position: absolute;
  z-index: 0;
  top: -78px;
  right: -72vw;
  height: clamp(1160px, calc(100% + 360px), 1190px);
  aspect-ratio: 974 / 1615;
  background: url("assets/images/reviews-corinthian-column.png") center / contain no-repeat;
  content: "";
  filter: contrast(0.97) saturate(0.45) brightness(0.98) blur(0.35px);
  opacity: 1;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.5) 13%,
    #000 27%,
    #000 52%,
    rgba(0, 0, 0, 0.64) 63%,
    transparent 75%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, 0.5) 13%,
    #000 27%,
    #000 52%,
    rgba(0, 0, 0, 0.64) 63%,
    transparent 75%,
    transparent 100%
  );
}

.ai-section > * {
  position: relative;
  z-index: 1;
}

.ai-product-card {
  padding: 14px 14px 20px;
  border-radius: 28px;
  color: var(--brand-blue);
  background: linear-gradient(150deg, var(--media), var(--accent-blue));
  box-shadow: var(--soft-shadow);
}

.ai-product-card__head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 4px 4px 14px;
}

.ai-product-card__head > span:last-child {
  display: grid;
  gap: 2px;
}

.ai-product-card__head strong {
  font-size: 16px;
}

.ai-product-card__head small {
  color: color-mix(in srgb, var(--brand-blue) 72%, transparent);
  font-size: 12px;
  font-weight: 600;
}

.ai-avatar {
  display: block;
  width: 62px;
  height: 62px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.64);
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 3px 9px rgba(44, 57, 84, 0.12);
}

.ai-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.02);
}

.ai-chat {
  display: grid;
  gap: 9px;
  padding: 13px;
  overflow: hidden;
  border-radius: 21px;
  background: var(--canvas);
}

.ai-message {
  width: fit-content;
  min-width: 0;
  max-width: 88%;
  margin: 0;
  padding: 11px 12px;
  border-radius: 15px;
  font-size: 14px;
  font-weight: 560;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.ai-message.is-typing-prepared {
  display: grid;
  width: fit-content;
  min-width: 0;
  max-width: 88%;
}

.ai-message__measure,
.ai-message__typed {
  grid-area: 1 / 1;
  min-width: 0;
}

.ai-message__measure {
  visibility: hidden;
}

.ai-chat.is-sequence-ready .ai-message {
  opacity: 0;
  transform: translateY(7px) scale(0.99);
  transform-origin: center;
  transition:
    opacity var(--duration-default) var(--ease-out),
    transform var(--duration-default) var(--ease-out);
}

.ai-chat.is-sequence-ready .ai-message.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.ai-message.is-waiting .ai-message__typed::after {
  display: inline-block;
  margin-left: 1px;
  content: "•••";
  font-size: 12px;
  letter-spacing: 3px;
  animation: ai-typing-dots 720ms var(--ease-in-out) infinite;
}

.ai-message.is-typing .ai-message__typed::after {
  display: inline-block;
  width: 1.5px;
  height: 1em;
  margin-left: 3px;
  background: currentColor;
  content: "";
  vertical-align: -0.12em;
  animation: ai-typing-caret 620ms steps(1, end) infinite;
}

.ai-message--question {
  justify-self: end;
  color: var(--brand-blue);
  background: var(--gold-gradient);
  box-shadow:
    0 5px 12px rgba(44, 57, 84, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.54);
  border-bottom-right-radius: 5px;
}

.ai-message--answer {
  background: color-mix(in srgb, var(--accent-blue) 25%, var(--surface));
  border-bottom-left-radius: 5px;
}

.ai-capabilities {
  display: grid;
  gap: 7px;
  margin-top: 9px;
}

.ai-capabilities span {
  padding: 11px 12px;
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.54);
  font-size: 14px;
  font-weight: 720;
}

.ai-section .section-action {
  margin-top: 12px;
}

.featured-expert {
  margin: 0;
  overflow: hidden;
  border-radius: 26px;
  background: var(--brand-blue);
  box-shadow: var(--soft-shadow);
}

.featured-expert img {
  display: block;
  width: 100%;
  height: clamp(285px, 78vw, 350px);
  object-fit: cover;
  object-position: 50% 22%;
}

.featured-expert__caption {
  display: grid;
  gap: 6px;
  padding: 17px 18px 24px;
  color: var(--on-dark);
}

.featured-expert__caption span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  opacity: 0.7;
}

.featured-expert__caption h3,
.featured-expert__caption p {
  margin: 0;
}

.featured-expert__caption h3 {
  font-size: 24px;
  line-height: 1;
  letter-spacing: -0.5px;
}

.featured-expert__caption p {
  font-size: 14px;
  line-height: 1.35;
  opacity: 0.78;
}

.expert-deck {
  margin: 12px -18px -18px;
  padding: 18px 18px 18px;
  overflow: hidden;
}

.expert-deck__stack {
  position: relative;
  min-height: calc(clamp(126px, 39vw, 148px) + 106px);
  touch-action: pan-y;
}

.expert-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0;
  margin-top: 6px;
}

.expert-pagination__dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.expert-pagination button[data-expert-indicator] {
  position: relative;
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  place-items: center;
}

.expert-pagination button[data-expert-indicator]::before {
  width: 10px;
  height: 10px;
  border: 1.5px solid color-mix(in srgb, var(--brand-blue) 55%, transparent);
  border-radius: 50%;
  background: transparent;
  content: "";
  transition:
    background-color var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out),
    transform var(--duration-fast) var(--ease-out);
}

.expert-pagination button[data-expert-indicator][aria-current="true"]::before {
  border-color: var(--brand-blue);
  background: var(--brand-blue);
  transform: scale(1.15);
}

.expert-pagination__arrow {
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 15px;
  color: var(--on-dark);
  background: var(--button-gradient);
  box-shadow:
    0 7px 16px rgba(44, 57, 84, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  cursor: pointer;
  place-items: center;
}

.expert-pagination__arrow--previous {
  background: color-mix(in srgb, var(--accent-blue) 28%, var(--surface));
  box-shadow: none;
}

.expert-card {
  --expert-card-bg: var(--surface);
  --expert-card-color: var(--brand-blue);
  --expert-portrait-size: clamp(126px, 39vw, 148px);
  --expert-tab-offset: 16px;
  position: absolute;
  top: 26px;
  right: 0;
  left: 0;
  display: grid;
  min-height: calc(var(--expert-portrait-size) + 28px);
  grid-template-rows: auto auto auto;
  gap: 0;
  padding: 14px;
  border: 0;
  border-radius: 24px;
  color: var(--expert-card-color);
  background: var(--expert-card-bg);
  box-shadow:
    0 9px 18px rgba(44, 57, 84, 0.1),
    0 2px 5px rgba(44, 57, 84, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.44);
  cursor: pointer;
  opacity: 1;
  text-align: left;
  transform-origin: 50% 0;
  transition:
    transform var(--duration-slow) var(--ease-emphasized),
    opacity var(--duration-default) var(--ease-out),
    filter var(--duration-default) var(--ease-out);
}

.expert-card::before {
  position: absolute;
  top: -9px;
  left: var(--expert-tab-offset);
  width: 78px;
  height: 18px;
  border-radius: 14px 14px 0 0;
  background: var(--expert-card-bg);
  content: "";
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36);
}

.expert-card > * {
  transition: opacity var(--duration-default) var(--ease-out);
}

.expert-card:not([data-position="0"]) > * {
  opacity: 0;
}

.expert-card:nth-child(2) {
  --expert-card-bg: color-mix(in srgb, var(--accent-blue) 48%, var(--canvas));
  --expert-tab-offset: 50px;
}

.expert-card:nth-child(3) {
  --expert-card-bg: var(--accent-blue);
  --expert-tab-offset: 84px;
}

.expert-card:nth-child(4) {
  --expert-card-bg: color-mix(in srgb, var(--media) 72%, var(--canvas));
  --expert-tab-offset: 118px;
}

.expert-card:nth-child(5) {
  --expert-card-bg: var(--brand-blue);
  --expert-card-color: var(--on-dark);
  --expert-tab-offset: 152px;
}

.expert-card[data-position="0"] {
  z-index: 5;
  pointer-events: auto;
  transform: translate3d(0, 22px, 0) scale(1);
}

.expert-card[data-position="1"] {
  z-index: 4;
  pointer-events: none;
  transform: translate3d(0, 13px, 0) scale(0.972);
}

.expert-card[data-position="2"] {
  z-index: 3;
  pointer-events: none;
  transform: translate3d(0, 4px, 0) scale(0.944);
}

.expert-card[data-position="3"] {
  z-index: 2;
  pointer-events: none;
  transform: translate3d(0, -5px, 0) scale(0.916);
}

.expert-card[data-position="4"] {
  z-index: 1;
  pointer-events: none;
  transform: translate3d(0, -14px, 0) scale(0.888);
}

.expert-card.is-leaving,
.expert-deck[data-direction="next"] .expert-card.is-leaving {
  z-index: 8;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(108%, 30px, 0) rotate(3.5deg) scale(0.98);
}

.expert-deck[data-direction="previous"] .expert-card.is-leaving {
  transform: translate3d(-108%, 30px, 0) rotate(-3.5deg) scale(0.98);
}

.expert-card strong {
  position: relative;
  z-index: 1;
  align-self: start;
  font-size: 22px;
  line-height: 1.05;
  letter-spacing: -0.5px;
}

.expert-card__specialty {
  align-self: start;
  justify-self: start;
  max-width: calc(100% - var(--expert-portrait-size) - 14px);
  margin-top: 0;
  padding: 5px 8px;
  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 9%, transparent);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.045em;
  text-transform: uppercase;
  white-space: nowrap;
}

.expert-card__name {
  display: grid;
  gap: 1px;
  max-width: calc(100% - var(--expert-portrait-size) - 14px);
  margin-top: 30px;
}

.expert-card__name span {
  display: block;
  white-space: nowrap;
}

.expert-card__portrait {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 1;
  width: var(--expert-portrait-size);
  height: var(--expert-portrait-size);
  aspect-ratio: 1;
  overflow: hidden;
  border: 3px solid rgba(255, 255, 255, 0.76);
  border-radius: 20px;
  background: color-mix(in srgb, var(--media) 46%, var(--surface));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.expert-card__portrait img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  /* Fill the rounded frame with the circular portraits from the source site. */
  transform: scale(1.32);
}

.expert-card__description {
  align-self: start;
  max-width: calc(100% - var(--expert-portrait-size) - 14px);
  margin-top: 7px;
  padding-top: 0;
  border-top: 0;
  font-size: 11px;
  font-weight: 560;
  line-height: 1.35;
  letter-spacing: 0.01em;
  opacity: 0.72;
  text-wrap: pretty;
}

.process-section {
  --process-inset: 16px;
  overflow: hidden;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--accent-blue) 34%, var(--canvas)),
    color-mix(in srgb, var(--media) 50%, var(--canvas))
  );
}

.process-photo {
  aspect-ratio: 1;
  margin: -12px calc(-1 * var(--process-inset)) 0;
}

.process-photo img {
  --photo-fade: linear-gradient(
    180deg,
    transparent 0%,
    rgba(0, 0, 0, 0.02) 3%,
    rgba(0, 0, 0, 0.06) 6%,
    rgba(0, 0, 0, 0.13) 9%,
    rgba(0, 0, 0, 0.22) 12%,
    rgba(0, 0, 0, 0.34) 15%,
    rgba(0, 0, 0, 0.47) 18%,
    rgba(0, 0, 0, 0.61) 21%,
    rgba(0, 0, 0, 0.74) 24%,
    rgba(0, 0, 0, 0.84) 27%,
    rgba(0, 0, 0, 0.92) 30%,
    rgba(0, 0, 0, 0.97) 33%,
    rgba(0, 0, 0, 0.99) 36%,
    #000 40%,
    #000 60%,
    rgba(0, 0, 0, 0.98) 68%,
    rgba(0, 0, 0, 0.84) 76%,
    rgba(0, 0, 0, 0.54) 84%,
    rgba(0, 0, 0, 0.25) 90%,
    rgba(0, 0, 0, 0.07) 95%,
    transparent 99%,
    transparent 100%
  );
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 0%;
  -webkit-mask-image: var(--photo-fade);
  mask-image: var(--photo-fade);
}

.process-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.process-list li {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  padding: 18px 18px 24px;
  border-radius: 20px;
  color: var(--brand-blue);
  background: rgba(255, 255, 255, 0.86);
}

.process-list.is-reveal-ready li {
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-emphasized);
}

.process-list.is-reveal-ready.is-revealed li {
  opacity: 1;
  transform: translateY(0);
}

.process-list.is-reveal-ready.is-revealed li:nth-child(2) {
  transition-delay: 140ms;
}

.process-list.is-reveal-ready.is-revealed li:nth-child(3) {
  transition-delay: 280ms;
}

.process-list__icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
}

.process-list__icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.process-list li:first-child .process-list__icon img {
  transform: translateY(-1px) scale(1.22);
}

.process-list li:nth-child(2) .process-list__icon img,
.process-list li:nth-child(3) .process-list__icon img {
  transform: scale(1.35);
}

.process-list h3,
.process-list p {
  margin: 0;
}

.process-list h3 {
  font-size: 16px;
  font-weight: 760;
  line-height: 1.1;
  letter-spacing: -0.5px;
}

.process-list p {
  margin-top: 5px;
  font-size: 14px;
  font-weight: 520;
  line-height: 1.35;
  opacity: 0.78;
}

.process-section .section-action {
  margin-top: 12px;
}

.reviews-section {
  position: relative;
  overflow: visible;
  background: var(--canvas);
  isolation: isolate;
}

.reviews-section::before {
  position: absolute;
  z-index: 0;
  top: -58px;
  right: -72vw;
  height: calc(200% + 104px);
  aspect-ratio: 974 / 1615;
  background: url("assets/images/reviews-corinthian-column.png") center / contain no-repeat;
  content: "";
  filter: contrast(0.97) saturate(0.45) brightness(0.98) blur(0.35px);
  opacity: 1;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 5.5%,
    rgba(0, 0, 0, 0.5) 11%,
    #000 20%,
    #000 36%,
    rgba(0, 0, 0, 0.65) 45%,
    transparent 56%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 5.5%,
    rgba(0, 0, 0, 0.5) 11%,
    #000 20%,
    #000 36%,
    rgba(0, 0, 0, 0.65) 45%,
    transparent 56%,
    transparent 100%
  );
}

.reviews-section > * {
  position: relative;
  z-index: 1;
}

.reviews-heading-row {
  display: grid;
  gap: 18px;
  margin-bottom: 16px;
}

.reviews-heading-row .section-heading {
  margin-bottom: 0;
}

.carousel-controls {
  display: flex;
  gap: 8px;
}

.carousel-controls button {
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 15px;
  color: var(--on-dark);
  background: var(--button-gradient);
  box-shadow:
    0 7px 16px rgba(44, 57, 84, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  cursor: pointer;
  font-size: 20px;
  place-items: center;
}

.carousel-controls button:disabled {
  cursor: default;
  opacity: 0.28;
}

.review-track {
  display: flex;
  gap: 12px;
  margin: 0 -16px;
  padding: 0 16px 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-padding-left: 16px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.review-track::-webkit-scrollbar {
  display: none;
}

.review-card {
  position: relative;
  display: grid;
  min-width: calc(100% - 30px);
  min-height: 252px;
  align-content: space-between;
  gap: 28px;
  margin: 0;
  padding: 18px 18px 24px;
  overflow: hidden;
  border-radius: 24px;
  color: var(--brand-blue);
  background: var(--surface);
  scroll-snap-align: start;
}

.review-card::before {
  position: absolute;
  top: 46px;
  right: 13px;
  color: color-mix(in srgb, var(--accent-blue) 30%, transparent);
  content: "“";
  font-family: Georgia, serif;
  font-size: 112px;
  line-height: 0.7;
  pointer-events: none;
}

.review-card--blue {
  background: color-mix(in srgb, var(--accent-blue) 42%, var(--canvas));
}

.review-card--empty::before { content: none; }

.review-card--capture {
  display: block;
  flex: 0 0 calc(100% - 30px);
  height: clamp(252px, 72vw, 300px);
  min-height: 0;
  padding: 12px;
  overflow: clip;
  background: #fff;
}

.review-card--capture::before { content: none; }

.review-card__preview {
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: visible;
}

.review-capture {
  display: block;
  width: 100%;
  height: auto;
  flex: none;
  margin-block: auto;
}

.review-card__open {
  position: absolute;
  z-index: 1;
  right: 12px;
  bottom: 12px;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 14px;
  color: var(--brand-blue);
  background: var(--badge-blue-gradient);
  cursor: zoom-in;
  place-items: center;
  transition: background-color var(--duration-fast), box-shadow var(--duration-fast);
}

.review-card__open:hover {
  box-shadow: 0 3px 10px rgba(44, 57, 84, .16);
}

.review-card--dark {
  color: var(--on-dark);
  background: var(--brand-blue);
}

.review-card__type {
  position: relative;
  z-index: 1;
  display: inline-flex;
  width: fit-content;
  padding: 7px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 9%, transparent);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.review-card > p {
  position: relative;
  z-index: 1;
  max-width: 26ch;
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.032em;
}

.review-card footer {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
}

.review-card__avatar {
  display: block;
  width: 62px;
  height: 62px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  border-radius: 50%;
  background: color-mix(in srgb, currentColor 10%, transparent);
  box-shadow: 0 3px 9px rgba(44, 57, 84, 0.12);
}

.review-card__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.price-section {
  color: var(--on-dark);
  background: var(--hero-gradient);
}

.price-card {
  position: relative;
  padding: 18px 18px 24px;
  overflow: hidden;
  border-radius: 27px;
  color: var(--brand-blue);
  background: var(--canvas);
}

.price-card > :not(.price-card__coffee) {
  position: relative;
  z-index: 1;
}

.price-card__coffee {
  position: absolute;
  z-index: 0;
  top: -5px;
  right: -15px;
  display: block;
  width: 151px;
  height: 151px;
  object-fit: contain;
  filter: drop-shadow(0 8px 12px rgba(44, 57, 84, 0.13));
  pointer-events: none;
  transform-origin: center;
  user-select: none;
  will-change: transform;
  animation: coffee-cup-float 5.2s var(--ease-in-out) infinite;
}

.price-card__label {
  display: inline-flex;
  padding: 7px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent-blue) 25%, var(--canvas));
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.price-card__value {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 18px 0 6px;
}

.price-card__value strong {
  font-size: clamp(3.12rem, 14.4vw, 4.14rem);
  font-weight: 780;
  line-height: 0.9;
  letter-spacing: -0.07em;
}

.price-card__value span {
  font-size: 14px;
  font-weight: 650;
  white-space: nowrap;
}

.price-card__comparison {
  margin: 0 0 40px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  opacity: 0.72;
}

.price-includes {
  gap: 11px;
}

.price-includes li {
  --price-item-delay: 0ms;
  font-size: 14px;
}

.price-includes.is-reveal-ready li {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--duration-slow) var(--ease-out) var(--price-item-delay),
    transform var(--duration-slow) var(--ease-emphasized) var(--price-item-delay);
}

.price-includes.is-reveal-ready.is-revealed li {
  opacity: 1;
  transform: translateY(0);
}

.price-includes.is-reveal-ready.is-revealed li::before {
  animation: price-bullet-pulse 3.4s var(--ease-in-out) infinite;
  animation-delay: calc(var(--price-item-delay) + 180ms);
}

.price-card .section-action {
  margin-top: 20px;
}

.price-card__support {
  margin: 11px 4px 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  opacity: 0.5;
}

.faq-list {
  display: grid;
  gap: 9px;
}

.faq-list details {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--brand-blue) 7%, transparent);
  border-radius: 19px;
  color: var(--brand-blue);
  background: color-mix(in srgb, var(--canvas) 72%, var(--surface));
}

.faq-list summary {
  position: relative;
  padding: 17px 50px 23px 16px;
  cursor: pointer;
  list-style: none;
  font-size: 16px;
  font-weight: 720;
  line-height: 1.22;
  letter-spacing: -0.5px;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary::after {
  position: absolute;
  top: 50%;
  right: 16px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background:
    linear-gradient(currentColor, currentColor) center / 10px 1.5px no-repeat,
    linear-gradient(currentColor, currentColor) center / 1.5px 10px no-repeat,
    color-mix(in srgb, var(--accent-blue) 22%, var(--surface));
  content: "";
  transform: translateY(-50%);
  transition: transform var(--duration-default) var(--ease-in-out);
}

.faq-list details[open] summary::after {
  transform: translateY(-50%) rotate(45deg);
}

.faq-list details[open] summary {
  padding-bottom: 11px;
}

.faq-list details > p {
  margin: 0;
  padding: 0 16px 23px;
  color: color-mix(in srgb, var(--brand-blue) 78%, var(--canvas));
  font-size: 14px;
  font-weight: 500;
  line-height: 1.42;
}

.faq-list details[open] > p {
  animation: details-enter var(--duration-default) var(--ease-out);
}

.final-section {
  position: relative;
  display: grid;
  margin-top: 50px;
  overflow: hidden;
  border-radius: 32px;
  color: var(--on-dark);
  background: var(--brand-blue);
  isolation: isolate;
}

.final-section > img {
  --photo-fade: linear-gradient(
    180deg,
    #000 72%,
    rgba(0, 0, 0, 0.92) 78%,
    rgba(0, 0, 0, 0.65) 84%,
    rgba(0, 0, 0, 0.28) 90%,
    rgba(0, 0, 0, 0.07) 94%,
    transparent 97%,
    transparent 100%
  );
  display: block;
  width: 100%;
  height: auto;
  -webkit-mask-image: var(--photo-fade);
  mask-image: var(--photo-fade);
}

.final-section__content {
  position: relative;
  display: grid;
  gap: 14px;
  margin-top: -28px;
  padding: 20px 16px 24px;
}

.final-section h2,
.final-section p {
  margin: 0;
}

.final-section h2 {
  max-width: none;
  font-size: clamp(2rem, 10vw, 2.125rem);
  font-weight: 760;
  line-height: 0.98;
  letter-spacing: -0.5px;
}

.final-section h2 span {
  display: block;
  white-space: nowrap;
}

.final-section p {
  max-width: 34ch;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  opacity: 0.85;
}

.final-section .section-action {
  margin-top: 3px;
}

.site-footer {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  column-gap: 16px;
  row-gap: 28px;
  padding: 38px 16px 30px;
  overflow: hidden;
  color: var(--brand-blue);
  background: var(--canvas);
  isolation: isolate;
}

.site-footer::before {
  position: absolute;
  z-index: 0;
  right: 50%;
  bottom: -58px;
  width: min(134%, 504px);
  aspect-ratio: 1397 / 918;
  background: url("assets/images/hero-amphitheater.png") center / contain no-repeat;
  content: "";
  filter: contrast(0.9) saturate(0.35) brightness(1.04);
  mix-blend-mode: multiply;
  opacity: 0.7;
  pointer-events: none;
  transform: translateX(50%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 22%, #000 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 22%, #000 100%);
}

.site-footer > * {
  position: relative;
  z-index: 1;
}

.site-footer p {
  align-self: center;
  justify-self: end;
  margin: 0;
  font-size: 11px;
  font-weight: 560;
  line-height: 1.5;
  text-align: right;
  white-space: nowrap;
}

.footer-links {
  display: grid;
  grid-column: 1 / -1;
  gap: 9px;
  font-size: 12px;
  font-weight: 680;
}

.footer-support {
  grid-column: 1 / -1;
  width: 100%;
  color: var(--brand-blue);
  border: 2px solid currentColor;
  background: transparent;
  box-shadow: none;
}

.footer-support::before { content: none; }

@media (max-width: 420px) {
  .site-footer { grid-template-columns: minmax(0, 1fr); }
  .site-footer p { justify-self: start; text-align: left; }
}

@keyframes details-enter {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mobile-menu-enter {
  from {
    opacity: 0;
    transform: translate3d(-50%, -10px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(-50%, 0, 0);
  }
}

@keyframes cta-shimmer {
  0%,
  18% {
    opacity: 0;
    transform: skewX(-10deg) translate3d(-145%, 0, 0);
  }

  27% {
    opacity: 0.42;
  }

  48% {
    opacity: 0.78;
  }

  78% {
    opacity: 0.18;
    transform: skewX(-10deg) translate3d(220%, 0, 0);
  }

  84%,
  100% {
    opacity: 0;
    transform: skewX(-10deg) translate3d(220%, 0, 0);
  }
}

@keyframes coffee-cup-float {
  0%,
  100% {
    transform: translate3d(-5px, 0, 0);
  }

  50% {
    transform: translate3d(5px, 0, 0);
  }
}

@keyframes price-bullet-pulse {
  0%,
  18%,
  100% {
    box-shadow:
      inset 0 0 0 4px color-mix(in srgb, var(--accent-blue) 42%, var(--surface)),
      0 0 0 0 color-mix(in srgb, var(--accent-blue) 0%, transparent);
  }

  32% {
    box-shadow:
      inset 0 0 0 4px color-mix(in srgb, var(--accent-blue) 30%, var(--surface)),
      0 0 0 5px color-mix(in srgb, var(--accent-blue) 22%, transparent),
      0 0 13px color-mix(in srgb, var(--accent-blue) 58%, transparent);
  }

  46% {
    box-shadow:
      inset 0 0 0 4px color-mix(in srgb, var(--accent-blue) 38%, var(--surface)),
      0 0 0 2px color-mix(in srgb, var(--accent-blue) 10%, transparent),
      0 0 7px color-mix(in srgb, var(--accent-blue) 28%, transparent);
  }
}

@keyframes ai-typing-dots {
  0%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

@keyframes ai-typing-caret {
  0%,
  52% {
    opacity: 1;
  }

  53%,
  100% {
    opacity: 0;
  }
}

@keyframes primary-action-arrow-nudge {
  0%,
  100% {
    transform: translateX(1px);
  }

  50% {
    transform: translateX(4px);
  }
}

@media (max-width: 480px) and (hover: none) and (pointer: coarse) {
  .skip-link {
    display: none;
  }
}

@media (hover: hover) {
  .primary-action:hover,
  .section-action:hover {
    transform: translateY(-1px);
  }

  .path-card summary:hover,
  .faq-list summary:hover {
    background: color-mix(in srgb, var(--accent-blue) 8%, transparent);
  }
}

@media (max-width: 400px) {
  .hero h1 {
    font-size: clamp(1.5625rem, 7.7vw, 1.875rem);
  }

  .primary-action,
  .section-action {
    font-size: 16px;
  }
}

@media (max-width: 350px) {
  .path-choice__heading {
    gap: 6px;
  }

  .site-header {
    padding-right: 12px;
    padding-left: 12px;
  }

  .hero {
    --supporting-text-size: 12px;
    padding-right: 12px;
    padding-left: 12px;
    border-radius: 26px;
  }

  .site-header {
    grid-template-columns: minmax(0, 1fr) 48px;
    gap: 6px;
  }

  .menu-toggle {
    width: 48px;
    height: 48px;
  }

  .primary-action {
    gap: 6px;
    padding-right: 8px;
    padding-left: 8px;
  }

  .primary-action__label {
    gap: 6px;
  }

  .landing-section {
    padding-right: 12px;
    padding-left: 12px;
  }

  .section-shell {
    padding-right: 12px;
    padding-left: 12px;
    border-radius: 26px;
  }

  .process-section {
    --process-inset: 12px;
  }

  .section-heading h2 {
    font-size: 30px;
  }

  .section-heading p {
    font-size: 14px;
  }

  .path-card summary,
  .path-card__body {
    padding-right: 15px;
    padding-left: 15px;
  }

  .expert-deck__stack {
    min-height: calc(clamp(126px, 39vw, 148px) + 106px);
  }

  .expert-card {
    min-height: calc(var(--expert-portrait-size) + 28px);
    padding: 14px;
  }

  .expert-card strong {
    font-size: 20px;
  }

  .expert-card__name {
    max-width: calc(100% - var(--expert-portrait-size) - 14px);
  }

  .expert-card__specialty {
    max-width: calc(100% - var(--expert-portrait-size) - 14px);
  }

  .inside-bento,
  .community-tags {
    gap: 6px;
  }

  .inside-card--compact {
    min-height: 180px;
    padding: 13px 13px 21px;
  }

  .inside-card h3 {
    font-size: 16px;
  }

  .community-tags span {
    padding: 10px;
    font-size: 11px;
  }

  .section-action {
    padding-right: 12px;
    padding-left: 16px;
    font-size: 16px;
  }

  .review-track {
    margin-right: -12px;
    margin-left: -12px;
    padding-right: 12px;
    padding-left: 12px;
    scroll-padding-left: 12px;
  }

  .final-section__content,
  .site-footer {
    padding-right: 12px;
    padding-left: 12px;
  }

  .site-footer p {
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .primary-action,
  .section-action {
    transition-duration: 0.01ms;
  }

  .cta-arrow,
  .inline-action::after,
  .stage-card,
  .price-card__coffee,
  .primary-action::before,
  .section-action::before {
    animation: none;
  }

  .mobile-menu {
    animation: none;
  }

  .community-photo__track,
  .hero-photo__indicator,
  .hero-photo__indicator::before,
  .expert-card,
  .path-card__toggle::after,
  .faq-list summary::after {
    transition-duration: 0.01ms;
  }

  .menu-toggle img,
  .menu-toggle::before,
  .menu-toggle::after {
    transition-duration: 0.01ms;
  }

  .path-card[open] .path-card__body,
  .faq-list details[open] > p {
    animation: none;
  }

  .ai-chat.is-sequence-ready .ai-message {
    opacity: 1;
    transform: none;
    transition-duration: 0.01ms;
  }

  .ai-message.is-waiting .ai-message__typed::after,
  .ai-message.is-typing .ai-message__typed::after {
    animation: none;
  }

  .process-list.is-reveal-ready li,
  .process-list.is-reveal-ready.is-revealed li {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .price-includes.is-reveal-ready li,
  .price-includes.is-reveal-ready.is-revealed li {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .price-includes.is-reveal-ready.is-revealed li::before {
    animation: none;
  }
}

/* One-time scroll entrances. Individual translate preserves active card scales
   and button press transforms; no layout dimensions change during a reveal. */
[data-scroll-reveal="heading"],
[data-scroll-reveal="text"] { --reveal-distance: 10px; }
[data-scroll-reveal="pill"],
[data-scroll-reveal="action"] { --reveal-distance: 8px; }
[data-scroll-reveal="photo"] { --reveal-distance: 16px; }

.scroll-reveal-pending {
  opacity: 0;
  translate: 0 var(--reveal-distance);
}

.scroll-reveal-entering {
  animation: scroll-reveal-in var(--duration-slow) var(--ease-out)
    var(--scroll-reveal-delay, 0ms) both;
}

@keyframes scroll-reveal-in {
  from { opacity: 0; translate: 0 var(--reveal-distance); }
  to { opacity: 1; translate: 0 0; }
}

@media (prefers-reduced-motion: reduce), print {
  .scroll-reveal-pending,
  .scroll-reveal-entering {
    opacity: 1;
    translate: none;
    animation: none;
  }
}

/* Figma revision, blocks 5–16. Shared tokens and media from the approved landing. */
main > section { scroll-margin-top: 24px; }
.editorial-copy { display: grid; gap: 14px; color: var(--brand-blue); }
.editorial-copy p {
  margin: 0;
  font-size: 16px;
  font-weight: 470;
  line-height: 1.5;
  letter-spacing: -.018em;
  text-wrap: pretty;
}
.section-subtitle {
  margin: 28px 0 18px;
  font-size: 22px;
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.revised-action { margin-top: 24px; color: var(--brand-blue); }
.revised-action > span:first-child { min-width: 0; text-wrap: balance; }
.section-photo {
  display: block;
  width: 100%;
  height: auto;
  margin: 24px 0;
  border-radius: 24px;
}
.programs-section { background: var(--hero-gradient); }
.program-list, .platform-list { display: grid; gap: 12px; }
.program-card, .platform-card {
  padding: 20px 18px;
  border-radius: 22px;
  color: var(--brand-blue);
  background: rgba(255,255,255,.88);
}

.program-card { background: var(--surface); }
.program-card header, .platform-card header {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.program-card__icon, .platform-card__icon {
  width: 48px;
  height: 48px;
  object-fit: contain;
}
.program-card h3, .platform-card h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.program-card .editorial-copy p, .platform-card .editorial-copy p { font-size: 15px; }
.programs-experts {
  margin-top: 24px;
  padding: 20px 18px;
  border-radius: 22px;
  color: var(--brand-blue);
  background: var(--surface);
}
.programs-experts > .section-subtitle { margin: 0 0 18px; }
.programs-experts .expert-deck { margin-top: 4px; }
.club-life-section::before { content: none; }
.club-life-section > .club-life-mask {
  position: absolute;
  z-index: 0;
  top: 12px;
  right: 0;
  display: block;
  width: clamp(104px, 32vw, 152px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 12px rgba(44, 57, 84, 0.13));
  pointer-events: none;
  user-select: none;
  animation: coffee-cup-float 5.2s var(--ease-in-out) infinite;
}
@media (prefers-reduced-motion: reduce) {
  .club-life-section > .club-life-mask { animation: none; }
}
.club-life-photo { height: auto; aspect-ratio: 3 / 2; margin-top: 24px; }
.club-life-photo::after { content: none; }
.club-life-caption {
  margin: 10px 0 24px;
  color: var(--brand-blue);
  font-size: 13px;
  line-height: 1.4;
  text-align: center;
}
.club-life-card {
  padding: 20px 18px;
  border-radius: 22px;
  background: var(--surface);
}
.club-life-card h3 {
  margin: 0 0 14px;
  color: var(--brand-blue);
  font-size: 22px;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.format-pills, .professional-features, .closing-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  list-style: none;
}
.format-pills li {
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.78);
  color: var(--brand-blue);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}
.schedule-panel { margin: 24px 0; padding: 20px 18px; border-radius: 22px; background: var(--surface); scroll-margin-top: 24px; }
.schedule-panel h3 { margin: 0 0 16px; color: var(--brand-blue); font-size: 22px; line-height: 1.2; letter-spacing: -.025em; }
.content-empty { margin: 0; color: #59677e; font-size: 14px; font-weight: 470; line-height: 1.5; }
.schedule-events { display: grid; gap: 12px; }
.schedule-loading { display: grid; min-height: 88px; place-items: center; }
.schedule-loading::before {
  content: "";
  width: 32px;
  height: 32px;
  border: 3px solid #e0eafa;
  border-top-color: var(--accent-blue);
  border-radius: 50%;
  animation: schedule-loading-spin 1s linear infinite;
}
@keyframes schedule-loading-spin {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .schedule-loading::before { animation: none; }
}
.schedule-event { display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 14px; padding-top: 16px; border-top: 1px solid #e5eaf1; }
.schedule-event:first-child { padding-top: 0; border-top: 0; }
.schedule-event time { display: grid; align-content: start; gap: 3px; text-align: center; color: var(--brand-blue); font-size: 12px; }
.schedule-event time strong { font-size: 28px; line-height: 1.05; letter-spacing: -.04em; }
.schedule-event h4 { margin: 0; color: var(--brand-blue); font-size: 16px; line-height: 1.3; }
.schedule-event p { margin: 5px 0 0; color: #59677e; font-size: 13px; line-height: 1.4; }
.schedule-event a { display: inline-block; margin-top: 8px; color: var(--brand-blue); font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.schedule-archive-note { text-align: center; }
.founder-section > .editorial-copy { margin-top: 24px; }
.featured-expert__caption span, .featured-expert__caption p { opacity: 1; }
.editorial-emphasis { margin: 24px 0; color: var(--brand-blue); font-size: 24px; font-weight: 750; line-height: 1.2; letter-spacing: -.025em; text-wrap: balance; }
.editorial-callout { margin: 24px 0 0; padding: 20px; border-radius: 20px; color: var(--brand-blue); background: #e0eafa; font-size: 17px; font-weight: 650; line-height: 1.4; text-wrap: pretty; }
.platform-card__brand { display: block; margin-bottom: 6px; font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.professionals-section::before { content: none; }
.professionals-section .section-heading h2 { font-size: clamp(28px,7.4vw,32px); line-height: 1.09; }
.professional-questions { display: grid; gap: 12px; padding: 20px; margin: 24px 0; border-radius: 22px; background: rgba(255,255,255,.86); list-style: none; }
.professional-questions li { position: relative; padding-left: 22px; color: var(--brand-blue); font-size: 17px; font-weight: 650; line-height: 1.35; }
.professional-features { margin: 20px 0; }
.professional-features li { flex: 1 1 140px; padding: 12px; color: var(--brand-blue); background: rgba(255,255,255,.8); border-radius: 14px; font-size: 14px; font-weight: 600; line-height: 1.35; }
.professionals-section .section-photo { aspect-ratio: 1.2; object-fit: cover; object-position: center; }
.community-section--updated .editorial-copy, .trial-section .editorial-copy { color: var(--on-dark); }
.community-section--updated .community-photo { margin-top: 24px; }
.community-section--updated .section-heading h2 { font-size: clamp(28px,7.8vw,34px); line-height: 1.09; }
.ai-section--updated .section-heading h2 { font-size: clamp(28px,7.8vw,34px); line-height: 1.09; }
.ai-section--updated .section-eyebrow,
.founder-section .section-eyebrow { background: var(--badge-blue-gradient); border-color: rgba(255,255,255,.25); }
.ai-section--updated .ai-product-card { margin-top: 24px; }
.assistant-note { margin: 20px 0 0; padding: 0 2px; color: #59677e; font-size: 14px; line-height: 1.5; text-wrap: pretty; }
.review-groups { display: grid; gap: 20px; }
.review-group {
  position: relative;
  isolation: isolate;
  padding: 20px 18px;
  border-radius: 22px;
  color: var(--brand-blue);
  background: var(--surface);
  box-shadow: var(--soft-shadow);
  transform: scale(1);
  transition:
    transform var(--duration-slow) var(--ease-emphasized),
    box-shadow var(--duration-slow) var(--ease-out);
}
.review-group::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  background: var(--gold-gradient);
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--duration-slow) var(--ease-in-out);
}
.review-group.is-active {
  transform: scale(1.025);
  box-shadow: 0 10px 24px rgba(147, 111, 47, 0.16), 0 2px 5px rgba(44, 57, 84, 0.05);
}
.review-group.is-active::before { opacity: 1; }
.review-group .content-empty { transition: color var(--duration-slow) var(--ease-in-out); }
.review-group.is-active .content-empty { color: var(--brand-blue); }
@media (prefers-reduced-motion: reduce) {
  .review-group,
  .review-group.is-active { transform: none; transition: none; }
  .review-group::before,
  .review-group .content-empty { transition: none; }
}
.review-group h3 { margin: 0 0 14px; font-size: 20px; font-weight: 750; letter-spacing: -.025em; line-height: 1.2; }
.review-group__items { display: grid; gap: 12px; }
.review-screenshot { display: block; padding: 0; overflow: hidden; border: 0; border-radius: 14px; background: var(--canvas); cursor: zoom-in; }
.review-screenshot img { display: block; width: 100%; height: auto; }
.review-original { margin: 0; padding: 14px; border-radius: 14px; color: var(--brand-blue); background: var(--canvas); }
.review-original blockquote { margin: 0; white-space: pre-line; font-size: 15px; line-height: 1.5; }
.review-original figcaption { margin-top: 12px; font-size: 13px; font-weight: 700; }
.review-original a { text-decoration: underline; text-underline-offset: 3px; }
html.review-dialog-open,
html.review-dialog-open body { overflow: hidden; }

.review-lightbox {
  width: 100%;
  max-width: none;
  height: 100vh;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: var(--brand-blue);
  background: #fff;
}

.review-lightbox[open] { display: flex; flex-direction: column; }
.review-lightbox::backdrop { background: #fff; }

.review-lightbox__header {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: calc(12px + env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) 12px max(16px, env(safe-area-inset-left, 0px));
  border-bottom: 1px solid #e6eaf0;
}

.review-lightbox__controls button {
  width: 44px;
  height: 44px;
  border-radius: 14px;
}

.review-lightbox__close {
  margin-left: auto;
  min-height: 44px;
  padding: 8px 16px;
  border: 0;
  border-radius: 14px;
  color: var(--brand-blue);
  background: var(--badge-blue-gradient);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 650;
}

.review-lightbox__body {
  flex: 1;
  min-height: 0;
  padding: 16px max(8px, env(safe-area-inset-right, 0px)) 20px max(8px, env(safe-area-inset-left, 0px));
  overflow: auto;
  overscroll-behavior: contain;
}

.review-lightbox__body .review-capture,
.review-lightbox__body img {
  display: block;
  width: 100%;
  max-width: 1000px;
  height: auto;
  margin: 0 auto;
}

.review-lightbox__footer {
  display: flex;
  flex: none;
  justify-content: center;
  padding: 10px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  background: #fff;
}

.review-lightbox__pagination {
  position: static;
  background: #edf1f7;
  transform: none;
}

.review-lightbox__pagination .hero-photo__indicator {
  width: 26px;
  height: 34px;
}

.review-lightbox__pagination .hero-photo__indicator.is-active { width: 36px; }
.price-card--updated .price-card__value { margin-top: 24px; }
.price-card__month { position: relative; margin: 10px 0 32px; color: var(--brand-blue); font-size: 17px; font-weight: 650; }
.price-card__intro { margin: 0 0 20px; font-size: 16px; line-height: 1.4; }
.price-card--updated .price-includes { margin-bottom: 24px; }
.price-card__promise { margin: 20px 0 12px; color: var(--brand-blue); font-size: 15px; line-height: 1.5; text-align: center; }
.price-card--updated .price-card__support { opacity: 1; color: #59677e; }
.trial-section { padding-right: 0; padding-left: 0; padding-bottom: 0; overflow: hidden; background: var(--brand-blue); color: var(--on-dark); }
.trial-section > .section-heading, .trial-section > .editorial-copy { margin-right: 16px; margin-left: 16px; }
.trial-section > .editorial-copy { margin-bottom: 24px; }
.trial-photo {
  --trial-fade: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .012) 4%,
    rgba(0, 0, 0, .045) 8%,
    rgba(0, 0, 0, .10) 12%,
    rgba(0, 0, 0, .18) 16%,
    rgba(0, 0, 0, .28) 20%,
    rgba(0, 0, 0, .42) 24%,
    rgba(0, 0, 0, .58) 28%,
    rgba(0, 0, 0, .74) 32%,
    rgba(0, 0, 0, .86) 36%,
    rgba(0, 0, 0, .94) 40%,
    rgba(0, 0, 0, .985) 44%,
    #000 48%,
    #000 72%,
    rgba(0, 0, 0, .92) 78%,
    rgba(0, 0, 0, .65) 84%,
    rgba(0, 0, 0, .28) 90%,
    rgba(0, 0, 0, .07) 94%,
    transparent 98%
  );
  display: block;
  width: 100%;
  height: auto;
  mask-image: var(--trial-fade);
  -webkit-mask-image: var(--trial-fade);
}
.trial-content { position: relative; margin-top: -28px; padding: 0 16px 28px; }
.trial-content .section-subtitle { margin-top: 0; text-align: center; }
.trial-content > .editorial-copy { text-align: center; }
.trial-content > .editorial-copy p { text-wrap: balance; }
.trial-steps { display: grid; gap: 10px; margin: 0 0 24px; padding: 0; list-style: none; }
.trial-steps li { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 12px; padding: 18px 16px; border: 1px solid rgba(255,255,255,.08); border-radius: 20px; background: rgba(255,255,255,.1); }
.trial-steps__number { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: var(--surface); color: var(--brand-blue); font-size: 14px; font-weight: 750; }
.trial-steps h3 { margin: 0; color: var(--on-dark); font-size: 17px; font-weight: 750; line-height: 1.2; letter-spacing: -.02em; }
.trial-steps p { margin: 8px 0 0; color: var(--on-dark); font-size: 14px; line-height: 1.45; }
.closing-section { color: var(--on-dark); }
.closing-section .section-heading .closing-section__intro { margin: 0; max-width: none; font-size: 17px; font-weight: 500; letter-spacing: -.018em; text-transform: none; line-height: 1.45; opacity: 1; }
.closing-section .section-heading h2 { color: var(--on-dark); line-height: 1.06; }
.closing-section .section-photo { margin: 0 0 24px; }
.closing-topics { margin: 0 0 24px; }
.closing-topics li { padding: 8px 10px; border: 1px solid rgba(168,215,255,.3); border-radius: 11px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.75); font-size: 13px; font-weight: 500; line-height: 1.25; }
.closing-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.closing-facts li { padding: 12px; border: 1px solid rgba(255,255,255,.25); border-radius: 14px; color: var(--brand-blue); background: var(--badge-blue-gradient); font-size: 14px; font-weight: 650; line-height: 1.35; }
.closing-facts li:last-child { grid-column: 1/-1; }
.closing-price { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.closing-price__option { display: grid; gap: 7px; min-width: 0; }
.closing-price__option:last-child { text-align: right; }
.closing-price strong { font-size: clamp(32px, 9.75vw, 38px); font-weight: 750; line-height: 1; letter-spacing: -.04em; white-space: nowrap; }
.closing-price__option > span { font-size: 14px; font-weight: 500; line-height: 1.4; }
@media (max-width:350px) {
  .program-card, .platform-card { padding: 18px 14px; }
  .program-card header, .platform-card header { grid-template-columns: 40px minmax(0,1fr); gap: 10px; }
  .program-card__icon, .platform-card__icon { width: 40px; height: 40px; }
  .program-card h3, .platform-card h3 { font-size: 18px; }
  .editorial-copy p { font-size: 15px; }
  .trial-section { padding-right: 0; padding-left: 0; }
  .trial-section > .section-heading, .trial-section > .editorial-copy { margin-right: 12px; margin-left: 12px; }
  .trial-content { padding-right: 12px; padding-left: 12px; }
  .trial-steps li { padding: 16px 12px; gap: 10px; }
  .closing-facts li { padding: 10px; }
}