/* Peptides 101 | The Longevity Clinic x Upper Aeon
   Upper Aeon palette (midnight, deep indigo, cool white) with TLC yellow for every action
   and a few keyword highlights. ADAM for the event name, Onest for everything else.
   Atmosphere comes from Upper Aeon event photography, not from gradients. Motion patterns
   adapted from Magic UI (Blur Fade, Scroll Progress, Shiny Button), as listed on 21st.dev. */

@font-face { font-family: "Adam"; src: url("/images/ua/fonts/adam-bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
/* Inter (Regular + Medium) is loaded from Google Fonts in each page's <head>. Brand kit: Inter, Regular and Medium only. */
/* metric-matched fallback so the swap to Inter does not reflow the page */
@font-face { font-family: "Inter Fallback"; src: local("Arial"), local("Helvetica Neue"); size-adjust: 107.12%; ascent-override: 90.49%; descent-override: 22.56%; line-gap-override: 0%; }

:root {
  --bg: #020B2C;
  --bg-0: rgba(2, 11, 44, 0);
  --panel: #0B0F2B;
  --text: #F7F6F3;
  --muted: rgba(245, 246, 250, 0.7);
  --faint: rgba(245, 246, 250, 0.62);
  --rule: rgba(245, 246, 250, 0.12);
  --field: rgba(245, 246, 250, 0.04);
  --field-line: rgba(245, 246, 250, 0.18);
  --paper: #FFFFFF;
  --ink: #0B0F2B;
  --ink-muted: rgba(11, 15, 43, 0.68);
  --ink-rule: rgba(11, 15, 43, 0.12);
  --accent: #C6A96B;
  --accent-hover: #B89A5F;
  --accent-edge: #B89A5F;
  --accent-shadow: 0 1px 0 var(--accent-edge), 0 10px 22px -12px rgba(0, 0, 0, 0.5);
  --wash: #F6F2FF;          /* Lavender Mist (brand light section ground) */
  --mist-2: #EDE4FD;        /* Lavender Mist 200 */
  --lavender: #C2A9F4;      /* Soft Lavender: labels, highlights */
  --purple: #5C3D99;        /* Muted Purple: atmosphere, glow, labels on light */
  --ok: #3E7B5B;
  --bad: #A0525F;
  --error: #F09A9A;
  --radius: 6px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --sans: "Inter", "Inter Fallback", "Helvetica Neue", Arial, sans-serif;
  --display: "Adam", "Helvetica Neue", Arial, sans-serif;
  --track: 0.222em;
  /* type roles: one size per job */
  --fs-display: clamp(44px, 6.6vw, 92px);
  --fs-title: clamp(44px, 6vw, 80px);
  --fs-h2: clamp(32px, 4vw, 52px);
  --fs-statement: clamp(22px, 2.3vw, 28px);
  --fs-h3: 23px;
  --fs-lead: 19px;
  --fs-body: 17px;
  --fs-small: 15px;
  --fs-micro: 14px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scrollbar-color: rgba(245, 246, 250, 0.25) var(--bg); caret-color: var(--accent); }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family: var(--sans); font-size: var(--fs-body); line-height: 1.6; font-weight: 400;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
p { margin: 0 0 1em; }
/* never leave a single word alone on the last line */
p, li, dd, summary, h3 { text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
input, button, select { font-family: inherit; }
::selection { background: var(--accent); color: var(--ink); }

.wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 40px; }

.h2 { font-weight: 500; font-size: var(--fs-h2); line-height: 1.08; letter-spacing: -0.025em; margin: 0; max-width: 17em; text-wrap: balance; }
.h3 { font-weight: 500; font-size: var(--fs-statement); line-height: 1.2; letter-spacing: -0.02em; margin: 0 0 18px; text-wrap: balance; }
.head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px 64px; align-items: end; margin-bottom: 64px; }
.head p { color: var(--muted); font-size: var(--fs-lead); line-height: 1.5; max-width: 30em; }
.light .head p { color: var(--ink-muted); }

/* buttons and links */
.btn {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 18px 30px; border-radius: var(--radius); border: 0; cursor: pointer; text-align: center;
  font-weight: 600; font-size: 16px; letter-spacing: -0.005em; text-decoration: none;
  transition: background-color .3s var(--ease), transform .2s var(--ease), opacity .2s;
}
.btn--accent { background: var(--accent); color: var(--ink); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; gap: 12px; box-shadow: var(--accent-shadow); }
.btn--accent:hover { background: var(--accent-hover); }
.btn:active { transform: translateY(1px); }
.btn--accent:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--accent-edge), 0 8px 18px -10px rgba(0, 0, 0, 0.6); }
.btn[disabled] { opacity: 0.7; cursor: progress; transform: none; }
.btn--accent::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(110deg, transparent 35%, rgba(11, 15, 43, 0.08) 50%, transparent 65%);
  transform: translateX(-120%); transition: transform .9s var(--ease);
}
.btn--accent:hover::after { transform: translateX(120%); }
.btn--block { width: 100%; }
.btn--sm { padding: 11px 18px; font-size: 14px; }
.btn--accent:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
.light .btn--accent:focus-visible, .join .btn--accent:focus-visible { outline-color: var(--ink); }
.hl { color: var(--accent); }
.nav__home:focus-visible, .faq summary:focus-visible, .foot__legal a:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 2px; }

/* scroll progress */
.progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 50; background: var(--accent); transform-origin: 0 50%; transform: scaleX(0); }

/* nav */
.nav { position: sticky; top: 0; z-index: 40; background: rgba(2, 11, 44, 0.86); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--rule); }
.nav__in { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 108px; }
.nav__home { text-decoration: none; display: inline-flex; }
.lockup { display: block; height: 40px; width: auto; }
.lockup--ua { height: 60px; }

/* hero */
.hero { position: relative; overflow: hidden; isolation: isolate; padding: 56px 0 0; }
.hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; z-index: -2; opacity: 0.55; }
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, var(--bg) 0%, var(--bg) 34%, rgba(2, 11, 44, 0.72) 58%, rgba(2, 11, 44, 0.45) 100%),
    linear-gradient(0deg, var(--bg) 0%, var(--bg-0) 30%);
}
.hero__grid { display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); grid-template-areas: "title title" "copy stage"; gap: 0 40px; align-items: end; }
.hero__title { grid-area: title; }
.hero__copy { grid-area: copy; }
.hero .stage { grid-area: stage; }
/* sit under the headline instead of dropping to the bottom of the photo's height on wide screens */
.hero__copy { align-self: start; }
.hero__copy { padding: 28px 0 56px; }
.hero__brand { font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: var(--track); font-size: clamp(18px, 1.9vw, 26px); line-height: 1; white-space: nowrap; margin: 0 0 22px; }
.hero__h1 { font-weight: 700; font-size: clamp(26px, 3vw, 40px); line-height: 1.1; letter-spacing: -0.028em; margin: 0; text-wrap: balance; }
.hero__h1 .hl { display: inline; }
.hero__lead { font-size: var(--fs-lead); line-height: 1.5; color: var(--muted); max-width: 30em; margin-bottom: 24px; text-wrap: pretty; }
.hero__hosts { font-size: var(--fs-small); line-height: 1.45; color: var(--muted); margin: 18px 0 0; }
.hero__hosts strong { color: var(--text); font-weight: 600; }
.hero__btn { padding: 21px 30px; font-size: var(--fs-body); }
.btn__arrow { width: 18px; height: 18px; flex: none; transition: transform .3s var(--ease); }
.btn:hover .btn__arrow { transform: translateX(3px); }
.when { display: grid; gap: 0; margin: 0 0 28px; max-width: 30em; border-top: 1px solid var(--rule); }
.when div[hidden] { display: none; }
.when div { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; padding: 11px 0; border-bottom: 1px solid var(--rule); }
.when dt { font-size: var(--fs-micro); color: var(--faint); white-space: nowrap; }
.when dd { font-variant-numeric: tabular-nums; margin: 0; font-weight: 500; font-size: var(--fs-small); white-space: nowrap; }

/* group portrait (shared by both pages): bleeds to the viewport's right edge */
.stage { position: relative; margin: 0 calc(-1 * max(40px, (100vw - 1240px) / 2 + 40px)) 0 0; }
.stage__group { display: block; width: 100%; height: auto; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%); mask-image: linear-gradient(90deg, transparent 0, #000 7%); }
.stage__cap { position: relative; z-index: 2; height: 88px; margin: 16px 0 0; }
.stage__cap p { position: absolute; left: var(--x); top: 0; transform: translateX(-50%); width: 22%; text-align: center; }
.stage__cap p { margin: 0; display: grid; gap: 2px; font-size: var(--fs-micro); line-height: 1.3; }
.stage__cap strong { font-weight: 600; font-size: var(--fs-small); }
.stage__cap span { color: var(--muted); }
/* wider caption so a long title stays on one row (desktop only; wraps naturally on tablet and mobile) */
@media (min-width: 1081px) {
  .stage__cap .cap--wide { width: 26%; }
  .stage__cap .cap--wide strong { white-space: nowrap; }
  .stage__cap .cap--narrow { width: 20%; }
  .stage__cap .cap--narrow strong { white-space: nowrap; }
}

/* repeated call to action between sections */
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 56px; }
.cta-row p { margin: 0; font-size: var(--fs-small); color: var(--ink-muted); text-wrap: balance; }
.cta-row--dark p { color: var(--muted); }
.coa__btn, .faq__btn { margin-top: 32px; }


/* light section */
.light { background: var(--wash); color: var(--ink); padding: 72px 0 128px; }
.lessons { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink-rule); }
.lesson { display: grid; grid-template-columns: 96px 1fr 1.25fr; gap: 0 48px; padding: 26px 0; border-bottom: 1px solid var(--ink-rule); align-items: start; }
.lesson__no { font-size: 32px; line-height: 1; font-weight: 400; color: var(--ink-muted); }
.lesson h3 { margin: 4px 0 0; font-weight: 500; font-size: var(--fs-h3); line-height: 1.25; letter-spacing: -0.015em; text-wrap: balance; }
.lesson p { margin: 4px 0 0; color: var(--ink-muted); }
.beginner { margin: 56px 0 0; padding: 48px; border-radius: 8px; background: var(--ink); color: var(--text); display: grid; grid-template-columns: 1fr 1.2fr; gap: 24px 64px; }
.beginner h3 { margin: 0; font-weight: 500; font-size: var(--fs-statement); line-height: 1.25; letter-spacing: -0.015em; text-wrap: balance; }
.beginner p { margin: 0; color: var(--muted); }

.coa { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 80px; align-items: center; margin-top: 112px; }
.coa__card { background: var(--paper); border: 1px solid var(--ink-rule); border-radius: 8px; padding: 28px 32px 30px; box-shadow: 0 24px 48px -32px rgba(11, 15, 43, 0.35); font-size: var(--fs-small); }
.coa__head { display: flex; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid var(--ink-rule); font-weight: 600; }
.coa__head span:last-child { color: var(--ink-muted); font-weight: 400; }
.coa__row { display: flex; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid rgba(11, 15, 43, 0.07); }
.coa__row:last-child { border-bottom: 0; padding-bottom: 0; }
.coa__row .ok { color: var(--ok); font-weight: 500; }
.coa__row .no { color: var(--bad); }
.coa__copy p { color: var(--ink-muted); font-size: var(--fs-lead); line-height: 1.55; }


/* people */
.people { padding: 128px 0; }
.people__title { margin-bottom: 56px; }
.team { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.member__img { position: relative; margin-bottom: 20px; }
.member img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; border-radius: 4px; }
.member__reveal { position: absolute; left: 12px; right: 12px; bottom: 12px; padding: 10px 12px; border-radius: 4px; background: rgba(2, 11, 44, 0.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); font-size: var(--fs-micro); font-weight: 600; line-height: 1.35; text-align: center; text-wrap: balance; }
.member h3 { margin: 0 0 4px; font-weight: 600; font-size: 20px; letter-spacing: -0.015em; line-height: 1.2; }
.member__role { color: var(--text); font-size: var(--fs-small); margin-bottom: 10px; }
.member p:not(.member__role) { color: var(--muted); font-size: var(--fs-small); }

/* thank-you: the two teachers revealed after registering */
.people--ty { padding: 104px 0 112px; border-top: 1px solid var(--rule); }
.people__head { margin-bottom: 56px; }
.people__head .people__title { margin-bottom: 0; }
.people__lead { margin: 20px 0 0; max-width: 30em; color: var(--muted); font-size: var(--fs-lead); line-height: 1.5; }
.team--duo { grid-template-columns: repeat(2, minmax(0, 340px)); gap: 32px 40px; }
.member__kicker { display: block; margin: 0 0 10px; font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); }
.member--lead h3 { font-size: clamp(30px, 3.2vw, 42px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.05; margin-bottom: 10px; }
/* thank-you hero: Silvana and Noah side by side under the headline */
.ty-reveal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--rule); max-width: 30em; }
.ty-reveal .member__img { margin-bottom: 14px; }
.ty-reveal .member img { aspect-ratio: 1 / 1; object-position: center 15%; }
.ty-reveal .member h3 { font-size: clamp(19px, 2vw, 24px); }
.ty-reveal .member--lead h3 { font-size: clamp(22px, 2.4vw, 30px); }
.ty-reveal .member__kicker { margin-bottom: 6px; }
.ty-reveal__label { grid-column: 1 / -1; margin: 0; font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.ty-reveal .member p:not(.member__role) { font-size: var(--fs-micro); }
.member p.member__notice { margin-top: 16px; padding: 14px 16px; border-left: 2px solid var(--accent); border-radius: 0 4px 4px 0; background: rgba(247, 246, 243, 0.06); color: var(--text); font-size: var(--fs-small); line-height: 1.5; }

.quote-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 32px 64px; align-items: end; margin-top: 96px; padding-top: 48px; border-top: 1px solid var(--rule); }
.quote-row .cta-row { margin-top: 0; flex-direction: column; align-items: flex-start; }
.quote { margin: 0; }
.quote blockquote { margin: 0; max-width: 32em; }
.quote blockquote p { font-size: clamp(26px, 3vw, 38px); font-weight: 500; line-height: 1.25; letter-spacing: -0.02em; margin-bottom: 24px; text-wrap: balance; }
.quote footer { font-weight: 600; display: grid; gap: 2px; }
.quote footer span { font-weight: 400; color: var(--muted); font-size: var(--fs-small); }

/* faq */
.faq__in { display: grid; grid-template-columns: 0.8fr 1.4fr; gap: 64px; }
.faq__list { border-top: 1px solid var(--ink-rule); }
.faq details { border-bottom: 1px solid var(--ink-rule); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; padding: 24px 0; font-weight: 500; font-size: var(--fs-lead); letter-spacing: -0.01em; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-weight: 400; font-size: 26px; line-height: 1; color: var(--ink-muted); transition: transform .3s var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: -8px 0 24px; color: var(--ink-muted); max-width: 36em; }

/* register */
.register { position: relative; padding: 128px 0 136px; overflow: hidden; isolation: isolate; }
.register__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; opacity: 0.4; }
.register::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--bg) 20%, rgba(2, 11, 44, 0.7) 100%), linear-gradient(0deg, var(--bg), var(--bg-0) 40%); }
.register__in { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.register__when { font-size: var(--fs-lead); line-height: 1.5; margin: 28px 0 36px; }
.faces { list-style: none; margin: 0 0 14px; padding: 0; display: flex; }
.faces li + li { margin-left: -10px; }
.faces img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; object-position: center 18%; border: 2px solid var(--bg); }

.form { display: grid; gap: 20px; padding: 40px; border-radius: 8px; background: var(--panel); border: 1px solid var(--rule); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 0.6); }
.field { display: grid; gap: 8px; }
.field > span:first-child { font-size: var(--fs-micro); font-weight: 500; color: var(--muted); }
.field input, .phone-row select, .phone-row input {
  width: 100%; padding: 15px 16px; font-size: 16px; color: var(--text);
  background: var(--field); border: 1px solid var(--field-line); border-radius: var(--radius); outline: none;
  transition: border-color .2s, background-color .2s;
}
.field input::placeholder { color: var(--faint); }
.field input:hover, .phone-row select:hover { border-color: rgba(245, 246, 250, 0.32); }
.field input:focus, .phone-row select:focus { border-color: var(--accent); background: rgba(245, 246, 250, 0.06); }
.field input[aria-invalid="true"] { border-color: var(--error); }
.field > span em { font-style: normal; color: var(--faint); font-weight: 400; }
.field__hint { font-size: var(--fs-micro); color: var(--faint); }
.field__error { font-size: var(--fs-micro); color: var(--error); }
.field__error:empty { display: none; }
.phone-row { display: flex; gap: 8px; }
/* native select for the full country list; the closed state shows only "US +1" */
.cc { position: relative; flex: 0 0 104px; }
.phone-row select {
  height: 100%; padding: 15px 26px 15px 12px; font-size: 15px; appearance: none; -webkit-appearance: none; color: transparent; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23F5F6FA' fill-opacity='.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center;
}
.phone-row select option { color: var(--ink); background: var(--paper); }
.cc__show { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); pointer-events: none; font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.phone-row input { flex: 1 1 auto; min-width: 0; }
.check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; font-size: var(--fs-small); line-height: 1.5; color: var(--muted); }
.check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--accent); flex: none; }
.form .btn { padding: 21px 30px; font-size: var(--fs-body); margin-top: 4px; }
.form__fine { text-align: center; font-size: var(--fs-micro); color: var(--faint); }

/* footer */
.foot { border-top: 1px solid var(--rule); }
.foot__in { padding: 48px 40px 56px; display: grid; grid-template-columns: auto 1fr; gap: 20px 56px; align-items: start; }
.foot__brands { display: flex; align-items: center; grid-row: span 2; }
.foot .lockup { height: 34px; }
.foot .lockup--ua { height: 30px; }
.foot__note, .foot__legal { margin: 0; font-size: var(--fs-micro); color: var(--faint); max-width: 52em; }
.foot__legal a { margin-left: 14px; color: var(--muted); white-space: nowrap; }
.foot__legal a:hover { color: var(--text); }
/* light footer */
.foot { background: var(--wash); border-top: 1px solid var(--ink-rule); color: var(--ink); }
.foot .lockup { filter: brightness(0); }
.foot .lockup--ua { height: 60px; }
.foot__note, .foot__legal { color: var(--ink-muted); }
.foot__legal a { color: var(--ink); }
.foot__legal a:hover { color: var(--ink-muted); }
/* thank-you page keeps the dark footer */
.foot--dark { background: transparent; border-top: 1px solid var(--rule); color: var(--text); }
.foot--dark .lockup { filter: none; }
.foot--dark .foot__note, .foot--dark .foot__legal { color: var(--faint); }
.foot--dark .foot__legal a { color: var(--muted); }
.foot--dark .foot__legal a:hover { color: var(--text); }

.dock { display: none; }

/* reveal (blur fade) */
.js .rv { opacity: 0; transform: translateY(14px); filter: blur(6px); transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); }
.js .rv.in { opacity: 1; transform: none; filter: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .rv { opacity: 1; transform: none; filter: none; transition: none; }
  .btn--accent::after { display: none; }
}

/* ================= thank-you ================= */
.ty-hero { position: relative; overflow: hidden; isolation: isolate; padding: 56px 0 0; }
.ty-hero .hero__bg { opacity: 0.45; }
.ty-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--bg) 30%, rgba(2, 11, 44, 0.6) 100%), linear-gradient(0deg, var(--bg), var(--bg-0) 35%); }
.ty-hero__grid { display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr); gap: 32px; align-items: end; }
.ty-hero__copy { padding-bottom: 96px; }
.ty-hero__grid { align-items: center; }
.ty-hero .when { max-width: 30em; }
/* confirmation on top, then the two teachers beside the 3 steps */
.ty-hero { padding-bottom: 72px; }
.ty-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "copy copy" "reveal prep"; gap: 40px 48px; align-items: start; }
.ty-hero__copy { grid-area: copy; padding-bottom: 8px; }
.ty-reveal { grid-area: reveal; max-width: none; margin-top: 0; padding-top: 0; border-top: 0; gap: 24px; }
.ty-reveal .member img { aspect-ratio: 4 / 5; object-position: center 20%; }
.ty-reveal .member--lead h3 { font-size: clamp(24px, 2.6vw, 34px); }
.ty-hero .prep { grid-area: prep; margin-bottom: 0; }
.ty-hero__copy { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 48px; align-items: end; }
.ty-hero__copy .ty-title { margin: 0; }
.ty-date { padding: 22px 28px; border: 1px solid var(--rule); border-radius: 8px; background: rgba(11, 15, 43, 0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.ty-date .ty-when { margin: 0; padding: 0; border: 0; max-width: none; font-size: var(--fs-lead); }
.ty-date .ty-local { margin-top: 6px; }
/* thank-you: clearer focal point */
.ty-head { min-width: 0; }
.ty-kicker { margin: 0 0 14px; font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); }
.ty-kicker::before { content: "\2713"; margin-right: 10px; }
.ty-hero .ty-title { font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: var(--track); font-size: clamp(30px, 3.6vw, 50px); line-height: 1.12; }
.ty-hero .prep { border-top: 2px solid var(--accent); }
.ty-hero .prep__list li:first-child h3 { font-size: var(--fs-lead); }
.ty-bridge { display: flex; align-items: center; gap: 24px; margin: 0 0 72px; font-family: var(--display); text-transform: uppercase; letter-spacing: var(--track); font-size: var(--fs-small); line-height: 1.3; color: var(--ink); }
.ty-bridge::before, .ty-bridge::after { content: ""; flex: 1; height: 1px; background: var(--ink-rule); }
.ty-bridge span { text-align: center; }
.prep { padding: 40px; border-radius: 8px; background: var(--panel); border: 1px solid var(--rule); margin-bottom: 72px; }
.prep__title { margin: 0 0 8px; font-weight: 500; font-size: var(--fs-statement); letter-spacing: -0.015em; line-height: 1.2; }
.prep__list { list-style: none; margin: 0; padding: 0; counter-reset: prep; }
.prep__list li { counter-increment: prep; position: relative; padding: 22px 0 22px 44px; border-top: 1px solid var(--rule); }
.prep__list li:first-child { border-top: 0; }
.prep__list li::before { content: counter(prep); position: absolute; left: 0; top: 22px; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--rule); display: grid; place-items: center; font-size: var(--fs-micro); color: var(--muted); }
.prep__list h3 { margin: 2px 0 6px; font-weight: 600; font-size: var(--fs-body); }
.prep__list p { margin: 0; color: var(--muted); font-size: var(--fs-small); }
.prep__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.prep__qr { display: flex; align-items: center; gap: 18px; margin: 18px 0 0; }
.prep__qr img { width: 112px; height: 112px; border-radius: 6px; background: #fff; flex: none; }
.prep__qr figcaption { font-size: var(--fs-small); color: var(--muted); max-width: 16em; }
.btn--ghost { background: transparent; color: var(--text); border: 1px solid var(--field-line); }
.btn--ghost:hover { border-color: var(--text); }
.ty-title { font-weight: 700; font-size: clamp(34px, 4.2vw, 56px); line-height: 1.02; letter-spacing: -0.035em; margin: 0 0 20px; text-wrap: balance; }
.ty-lead { font-size: var(--fs-statement); font-weight: 500; line-height: 1.3; letter-spacing: -0.015em; max-width: 18em; margin-bottom: 28px; text-wrap: balance; }
.ty-when { margin: 0; padding-top: 20px; border-top: 1px solid var(--rule); font-size: var(--fs-body); color: var(--muted); max-width: 30em; }
.ty-when strong { color: var(--text); font-weight: 600; }
.ty-local { margin: 6px 0 0; font-size: var(--fs-small); color: var(--faint); }

/* ThePeptideDoctors offer: white sections */
.offer { padding: 128px 0; }
.offer__grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 64px; align-items: start; }
.offer__lead { font-size: var(--fs-statement); line-height: 1.35; letter-spacing: -0.01em; font-weight: 500; margin: 28px 0 16px; }
.offer__body { color: var(--ink-muted); }
.ty-video { border-radius: 8px; overflow: hidden; background: #000; color: var(--text); box-shadow: 0 30px 60px -36px rgba(11, 15, 43, 0.55); }
.ty-video video { width: 100%; height: auto; display: block; }
.ty-help__head { margin-top: 128px; }

.ty-help { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 0 64px; align-items: start; }
.benefits { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--ink-rule); }
.benefit { padding: 32px 0; border-bottom: 1px solid var(--ink-rule); }
.benefit h3 { margin: 0 0 10px; font-weight: 500; font-size: var(--fs-h3); letter-spacing: -0.015em; line-height: 1.25; }
.benefit p { margin: 0; color: var(--ink-muted); }
.who { position: sticky; top: 112px; padding: 40px; border-radius: 8px; background: #EDE4FD; color: var(--ink); display: grid; gap: 24px; }
.who h3 { margin: 0; font-weight: 500; font-size: var(--fs-statement); letter-spacing: -0.015em; }
.who ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.who li { padding-left: 28px; position: relative; color: var(--ink-muted); }
.who li::before { content: ""; position: absolute; left: 0; top: 12px; width: 14px; height: 2px; background: var(--accent); }

/* thank-you: consultation offer */
.offer--about { padding-top: 96px; border-top: 1px solid var(--ink-rule); }
.offer--about .ty-help { grid-template-columns: 1fr; }
.offer--about .benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
.offer--about .ty-help__head { margin-top: 88px; }
.consult { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 64px; align-items: start; }
.consult .h2 { font-size: clamp(28px, 3.2vw, 42px); }
.consult .offer__lead { margin-top: 24px; font-size: var(--fs-lead); font-weight: 400; line-height: 1.55; color: var(--ink-muted); }
.consult__kicker { margin: 0 0 16px; font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #8E7943; }
.consult__list { list-style: none; margin: 32px 0 0; padding: 0; border-top: 1px solid var(--ink-rule); }
.consult__list li { padding: 16px 0; border-bottom: 1px solid var(--ink-rule); color: var(--ink); font-weight: 500; }
.consult__list strong { display: block; color: var(--ink); font-weight: 600; margin-bottom: 2px; }
.consult__quote { margin: 40px 0 0; }
.consult__quote blockquote { margin: 0; }
.consult__quote p { font-size: var(--fs-statement); font-weight: 500; line-height: 1.3; letter-spacing: -0.015em; margin-bottom: 14px; }
.consult__quote footer { font-weight: 600; display: grid; gap: 2px; font-size: var(--fs-small); }
.consult__quote footer span { font-weight: 400; color: var(--ink-muted); }
.consult .price { position: sticky; top: 132px; }
.stack { list-style: none; margin: 0 0 24px; padding: 0; border-top: 1px solid var(--ink-rule); }
.stack li { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--ink-rule); font-size: var(--fs-small); color: var(--ink); }
.stack li span:last-child { color: var(--ink-muted); white-space: nowrap; }
.stack__total { font-weight: 600; }
/* dark offer sections: the light-section styles, re-pointed at dark values */
.offer--dark { --ink: #F7F6F3; --ink-muted: rgba(247, 246, 243, 0.7); --ink-rule: rgba(247, 246, 243, 0.14); --paper: #0B0F2B; background: var(--bg); color: var(--text); }
.offer--dark.offer--about { background: var(--panel); }
.offer--dark .btn--accent { color: #0B0F2B; }
.offer--dark .consult__kicker { color: var(--accent); }
.offer--dark .who { background: var(--bg); border: 1px solid var(--rule); }
.offer--dark .price { background: var(--panel); border-color: var(--rule); box-shadow: 0 30px 60px -40px rgba(0, 0, 0, 0.6); }
.offer--dark .ty-video { box-shadow: 0 30px 60px -36px rgba(0, 0, 0, 0.7); }
.consult .price__now { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 24px; font-size: var(--fs-body); font-weight: 600; color: var(--ink); }
.consult .price__now strong { font-size: clamp(32px, 3.2vw, 42px); margin: 0; color: var(--ink); }
.next { list-style: none; counter-reset: next; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; font-size: var(--fs-small); color: var(--ink-muted); }
.next li { counter-increment: next; display: flex; align-items: center; gap: 12px; }
.next li::before { content: counter(next); flex: none; width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--ink-rule); display: grid; place-items: center; font-size: 13px; color: var(--ink); }
.join { padding: 120px 0 136px; background: #EFEDE8; color: var(--ink); }
.join__in { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.join__intro { font-size: var(--fs-lead); color: var(--ink-muted); margin-top: 24px; }
.join__intro strong { color: var(--ink); font-weight: 600; }
.price { padding: 44px 40px 36px; border-radius: 8px; background: var(--paper); border: 1px solid var(--ink-rule); box-shadow: 0 30px 60px -40px rgba(11, 15, 43, 0.45); }
.price__tag { font-size: var(--fs-small); color: var(--ink-muted); margin-bottom: 18px; }
.price__now { margin: 0; font-size: var(--fs-lead); color: var(--ink-muted); }
.price__now strong { font-weight: 600; font-size: clamp(64px, 7vw, 88px); line-height: 1; letter-spacing: -0.04em; color: var(--ink); margin-right: 6px; }
.price__was { margin: 10px 0 30px; color: var(--ink-muted); }
.price__was s { color: var(--ink-muted); }
.price__was strong { color: var(--ink); font-weight: 600; }
.price__fine { font-size: var(--fs-micro); color: var(--ink-muted); margin: 16px 0 0; text-align: center; }
.price__note { margin: 26px 0 0; padding-top: 20px; border-top: 1px solid var(--ink-rule); font-size: var(--fs-small); font-weight: 500; color: var(--ink); }

/* ================= thank-you v3: countdown, one CTA, what you'll learn ================= */
.ty-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "copy cta"; gap: 32px 64px; align-items: center; }
.ty-hero__copy { display: block; padding-bottom: 0; }
.ty-hero__copy .ty-head { margin-bottom: 28px; }
.ty-hero__copy .ty-date { display: inline-block; }
.ty-cta { flex-direction: column; align-items: stretch; gap: 24px; }
.ty-cta__main { max-width: none; }
.ty-cta__qr { margin: 0; }
.ty-count { display: flex; gap: 10px; margin-top: 18px; }
.ty-count div { min-width: 68px; padding: 12px 10px 10px; text-align: center; border: 1px solid var(--rule); border-radius: 6px; background: rgba(2, 11, 44, 0.6); }
.ty-count strong { display: block; font-family: var(--display); font-weight: 700; font-size: clamp(26px, 3vw, 38px); line-height: 1; letter-spacing: 0.04em; font-variant-numeric: tabular-nums; color: var(--text); }
.ty-count span { display: block; margin-top: 6px; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--faint); }
.ty-cta { grid-area: cta; display: flex; align-items: center; gap: 32px; padding: 28px 32px; border-radius: 8px; background: var(--panel); border: 1px solid var(--rule); border-top: 2px solid var(--accent); }
.ty-cta__main { flex: 1 1 auto; max-width: 30em; }
.ty-cta__main .btn { padding: 21px 30px; font-size: var(--fs-body); }
.ty-cta__title { margin: 0 0 14px; font-weight: 500; font-size: var(--fs-statement); letter-spacing: -0.02em; line-height: 1.2; }
.ty-cta__why { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 8px; }
.ty-cta__why li { position: relative; padding-left: 26px; color: var(--muted); font-size: var(--fs-small); }
.ty-cta__why li::before { content: "\2713"; position: absolute; left: 0; color: var(--accent); font-weight: 700; }
.ty-cta__line { margin: 14px 0 0; font-size: var(--fs-small); color: var(--muted); }
.ty-cta__cal { margin: 10px 0 0; font-size: var(--fs-micro); color: var(--faint); }
.ty-cta__cal a { color: var(--text); text-underline-offset: 3px; }
.ty-cta__qr { margin: 0 0 0 auto; }
.ty-hero { padding: 40px 0 48px; }
.ty-learn { padding: 0 0 96px; }
.ty-live { margin-bottom: 64px; }
.ty-learn__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 64px; align-items: start; }
.ty-live { display: flex; align-items: center; gap: 24px; margin-bottom: 72px; padding: 22px 28px; border: 1px solid var(--accent); border-radius: 8px; background: rgba(198, 169, 107, 0.08); }
.ty-live__tag { flex: none; margin: 0; padding: 6px 12px; border-radius: 4px; background: var(--accent); color: var(--ink); font-family: var(--display); text-transform: uppercase; letter-spacing: var(--track); font-size: var(--fs-micro); }
.ty-live__text { margin: 0; font-size: var(--fs-lead); line-height: 1.45; }
.ty-live__text strong { font-weight: 600; }
@media (max-width: 720px) { .ty-live { flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px; margin-bottom: 48px; } }
.ty-learn__label { margin: 0 0 8px; font-family: var(--display); text-transform: uppercase; letter-spacing: var(--track); font-size: var(--fs-small); color: var(--accent); }
.ty-learn__list { list-style: none; margin: 0; padding: 0; }
.ty-learn__list li { padding: 28px 0; border-bottom: 1px solid var(--rule); }
.ty-learn__list li:first-child { border-top: 1px solid var(--rule); margin-top: 20px; }
.ty-learn__list h3 { margin: 0 0 8px; font-weight: 500; font-size: var(--fs-statement); letter-spacing: -0.02em; line-height: 1.2; }
.ty-learn__list p { margin: 0; color: var(--muted); }
.ty-learn .ty-reveal { margin: 0; padding: 0; border: 0; max-width: none; grid-area: auto; }
.ty-learn .ty-reveal__label { font-family: var(--display); letter-spacing: var(--track); font-size: var(--fs-small); color: var(--accent); }
.ty-reveal__hosts { grid-column: 1 / -1; margin: 0; font-size: var(--fs-small); color: var(--muted); }
.about-more > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.about-more > summary::-webkit-details-marker { display: none; }
.offer--about { padding: 40px 0; }
.about-more > summary { padding: 8px 0; }
.about-more > summary .h2 { font-size: var(--fs-statement); font-weight: 500; letter-spacing: -0.01em; max-width: none; }
.about-more > summary::after { content: "+"; font-size: 28px; line-height: 1; color: var(--ink-muted); transition: transform .3s var(--ease); }
.about-more[open] > summary::after { transform: rotate(45deg); }
.about-more[open] > summary { margin-bottom: 48px; }
.about-more + .cta-row { margin-top: 40px; }
@media (max-width: 1080px) {
  .ty-hero__grid { grid-template-columns: 1fr; grid-template-areas: "copy" "cta"; }
  .ty-learn__grid { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 720px) {
  .ty-count { gap: 8px; }
  .ty-count div { flex: 1 1 0; min-width: 0; }
  .ty-cta { padding: 24px 20px; }
  .ty-cta__qr { display: none; }
  .ty-learn { padding: 72px 0 80px; }
}

/* partnership lockup in the header: Upper Aeon x The Longevity Clinic */
.nav__home { align-items: center; gap: 24px; }
.nav__x { font-size: 28px; line-height: 1; font-weight: 300; color: var(--muted); }
.lockup--tlc { height: 52px; width: auto; }
@media (max-width: 720px) { .lockup--tlc { height: 32px; } }
/* Text version of the clinic name (unused now): The Longevity Clinic set as a wordmark in the Upper Aeon style: ADAM caps, wide tracking, vertically centred with the logo */
.nav__tlc { display: inline-grid; justify-items: start; font-family: var(--sans); font-weight: 200; text-transform: uppercase; color: var(--text); white-space: nowrap; line-height: 1; }
.tlc { display: inline-flex; align-items: center; gap: 10px; }
.tlc__emblem { flex: none; display: block; width: 38px; height: 52px; overflow: hidden; }
.tlc__emblem img { display: block; height: 52px; width: auto; max-width: none; }
/* Upper Aeon's triangle "A", cut from the real logo file, with EÖN set in the same type as the clinic name */
.tlc--ua { gap: 8px; }
.tlc__emblem--ua { width: 41px; height: 38px; }
.tlc__emblem--ua img { height: auto; width: 185px; margin-top: -17.6px; }
.tlc__the { font-size: 12px; font-weight: 400; letter-spacing: 0.3em; margin: 0 0 5px 2px; }
.tlc__main { font-size: 34px; font-weight: 300; letter-spacing: 0.2em; margin-right: -0.2em; line-height: 1; }
.tlc__clinic { justify-self: end; font-size: 12px; font-weight: 400; letter-spacing: 0.3em; margin: 5px 0 0; }
@media (max-width: 720px) {
  .nav__home { gap: 12px; }
  .nav__x { font-size: 18px; }
  .tlc--ua { gap: 5px; }
  .tlc__emblem--ua { width: 26px; height: 24px; }
  .tlc__emblem--ua img { width: 117px; margin-top: -11px; }
  .tlc { gap: 8px; }
  .tlc__emblem { width: 24px; height: 32px; }
  .tlc__emblem img { height: 32px; }
  .tlc__main { font-size: 16px; letter-spacing: 0.2em; margin-right: -0.2em; }
  .tlc__the, .tlc__clinic { font-size: 7px; letter-spacing: 0.25em; }
}

/* ================= thank-you: cleanup pass ================= */
/* 3. solid, slimmer header */
.nav { background: var(--bg); backdrop-filter: none; -webkit-backdrop-filter: none; }
.nav__in { height: 84px; }
/* 1. hero: columns share one height, content centred, tidy date box */
.ty-hero { padding: 48px 0 56px; }
.ty-hero__grid { align-items: stretch; }
.ty-hero__copy { display: flex; flex-direction: column; justify-content: center; }
.ty-date { align-self: flex-start; }
.ty-date .ty-when { font-size: var(--fs-body); }
.ty-when__zoom { display: block; margin-top: 2px; font-weight: 400; color: var(--muted); }
/* 2. calmer WhatsApp card */
.ty-cta { gap: 20px; }
.ty-cta__qr { margin: 0; display: flex; align-items: center; gap: 14px; padding-top: 20px; border-top: 1px solid var(--rule); }
.ty-cta__qr img { width: 72px; height: 72px; }
.ty-cta__qr figcaption { font-size: var(--fs-micro); max-width: 18em; }
/* 4. community row */
.about-more > summary { padding: 22px 0; border-top: 1px solid var(--ink-rule); border-bottom: 1px solid var(--ink-rule); }
.about-more > summary:focus { outline: none; }
.about-more > summary:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.about-more > summary::after { content: "+"; transform: none; }
.about-more[open] > summary::after { content: "\2212"; transform: none; }
.about-more[open] > summary { margin-bottom: 48px; }
/* 5. teacher names no longer shout */
.ty-learn .ty-reveal .member--lead h3 { font-size: clamp(20px, 2vw, 26px); letter-spacing: -0.02em; }
.consult__listen { display: inline-block; margin-top: 20px; font-size: var(--fs-small); font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--accent); text-decoration-thickness: 2px; }
.consult__listen:hover { color: #8E7943; }
.when .local-time { white-space: normal; text-align: right; }
.ty-quote { margin: 40px 0 0; padding-left: 24px; border-left: 2px solid var(--accent); }
.ty-quote blockquote { margin: 0; }
.ty-quote p { margin: 0 0 14px; font-size: var(--fs-statement); font-weight: 500; line-height: 1.3; letter-spacing: -0.015em; text-wrap: balance; }
.ty-quote footer { display: grid; gap: 2px; font-weight: 600; font-size: var(--fs-small); }
.ty-quote footer span { font-weight: 400; color: var(--muted); }
.ty-quote__listen { display: inline-block; margin-top: 16px; font-size: var(--fs-small); font-weight: 600; color: var(--text); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--accent); text-decoration-thickness: 2px; }
.ty-quote__listen:hover { color: var(--accent); }
/* alignment fixes: everything in the hero starts on the same left edge */
.ty-hero .ty-hero__copy { align-items: flex-start; text-align: left; }
.ty-hero .ty-head { margin: 0 0 28px; align-self: flex-start; text-align: left; }
.ty-hero .ty-cta { align-items: stretch; }
.ty-hero .ty-cta__main { flex: 0 0 auto; width: 100%; max-width: none; }
.ty-hero .ty-cta__qr { align-self: stretch; justify-content: flex-start; width: 100%; }
.ty-hero .ty-date { align-self: stretch; }
.ty-hero .ty-count div { flex: 1 1 0; min-width: 0; }
/* quote band under the two columns, then a closing line */
.ty-quote-row { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 32px 64px; align-items: center; margin-top: 72px; padding-top: 48px; border-top: 1px solid var(--ink-rule); }
.ty-quote-row .ty-quote { margin: 0; }
.ty-quote-row .ty-quote__listen { margin: 0; justify-self: start; }
/* photo of Noah with Gary beside the quote (thank-you page); no fixed crop, keeps the photo's own proportions */
.ty-quote-row--photo { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: center; }
.ty-quote__photo { grid-column: 1; grid-row: 1 / span 2; width: 100%; height: auto; border-radius: 8px; box-shadow: 0 24px 48px -32px rgba(11, 15, 43, 0.35); }
.ty-quote-row--photo .ty-quote, .ty-quote-row--photo .ty-quote__listen { grid-column: 2; }
.ty-quote-row--photo .ty-quote__listen { align-self: start; }
@media (max-width: 1080px) {
  .ty-quote__photo { grid-column: auto; grid-row: auto; max-width: 560px; }
  .ty-quote-row--photo .ty-quote, .ty-quote-row--photo .ty-quote__listen { grid-column: auto; }
}
.ty-close { margin: 72px 0 0; }
@media (max-width: 1080px) { .ty-quote-row { grid-template-columns: 1fr; margin-top: 56px; padding-top: 40px; } .ty-close { margin-top: 56px; } }
/* white middle section: dark hero above, dark footer below */
.light.ty-learn { padding: 72px 0 96px; }
.light.ty-learn .ty-live { background: rgba(198, 169, 107, 0.12); border-color: #8E7943; }
.light.ty-learn .ty-live__text { color: var(--ink); }
.light.ty-learn .ty-learn__label,
.light.ty-learn .ty-reveal__label { color: #8E7943; }
.light.ty-learn .ty-learn__list li { border-color: var(--ink-rule); }
.light.ty-learn .ty-learn__list p { color: var(--ink-muted); }
.light.ty-learn .member__role { color: var(--ink); }
.light.ty-learn .ty-reveal__hosts { color: var(--ink-muted); }
.light.ty-learn .member__reveal { color: var(--text); }
.light.ty-learn .ty-quote { border-left-color: #8E7943; }
.light.ty-learn .ty-quote footer span { color: var(--ink-muted); }
.light.ty-learn .ty-quote__listen { color: var(--ink); }
.light.ty-learn .ty-quote__listen:hover { color: #8E7943; }
@media (max-width: 720px) { .light.ty-learn { padding: 56px 0 72px; } }
/* confirmation-only page: the last section sits directly above the footer */
.page-ty .ty-learn { padding-bottom: 112px; }
/* 7. offer headline */
.consult .h2 { max-width: 16em; }
@media (max-width: 720px) { .nav__in { height: 72px; } }

/* slimmer sticky header on desktop */
@media (min-width: 721px) {
  .nav__in { height: 72px; }
  .nav .lockup--ua { height: 50px; }
}

/* ================= responsive ================= */
@media (max-width: 1080px) {
  .hero { padding-top: 40px; }
  .hero__grid, .ty-hero__grid { grid-template-columns: 1fr; }
  .ty-hero__grid { grid-template-areas: "copy" "cta"; gap: 32px; }
  .ty-hero__copy { grid-template-columns: 1fr; }
  .consult { grid-template-columns: 1fr; gap: 48px; }
  .consult .price { position: static; }
  .offer--about .benefits { grid-template-columns: 1fr; }
  /* copy and the button first, so the call to action sits above the fold; the photo follows */
  .hero__grid { grid-template-areas: "title" "copy" "stage"; }
  .hero__copy { padding-top: 22px; max-width: 34em; }
  .hero .when { max-width: none; }
  .hero__copy, .ty-hero__copy { padding-bottom: 32px; }
  .stage { margin: 0 -40px; }
  .stage__cap { margin-top: 12px; }
  .quote-row { grid-template-columns: 1fr; }
  .faq__side { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
  .faq__btn { margin-top: 0; }
  .head { grid-template-columns: 1fr; }
  .lesson { grid-template-columns: 64px 1fr; }
  .lesson p { grid-column: 2; margin-top: 14px; }
  .beginner { grid-template-columns: 1fr; }
  .coa, .register__in, .join__in, .offer__grid, .faq__in { grid-template-columns: 1fr; gap: 48px; }
  .ty-help { grid-template-columns: 1fr; gap: 48px; }
  .who { position: static; }
}
@media (max-width: 720px) {
  :root { --fs-body: 16px; --fs-lead: 18px; --fs-h3: 21px; }
  .wrap { padding: 0 20px; }
  .nav__in { height: 64px; gap: 12px; }
  .nav__in { height: 76px; }
  .lockup { height: 24px; }
  .foot .lockup { height: 28px; }
  .lockup--ua { height: 40px; }
  .foot .lockup--ua { height: 44px; }
  .nav__cta { display: none; }
  .hero { padding-top: 26px; }
  .hero__brand { font-size: 17px; margin-bottom: 14px; }
  .hero__h1 { font-size: clamp(31px, 8.6vw, 40px); line-height: 1.07; }
  .hero__copy { padding-top: 16px; }
  .hero__lead { font-size: var(--fs-body); margin-bottom: 18px; }
  .hero .when { margin-bottom: 18px; }
  .hero .when div { padding: 8px 0; }
  .hero__hosts { margin-top: 14px; }
  .stage { margin: 0 -20px; }
  .stage__cap { height: 64px; margin-top: 10px; }
  .stage__cap span { display: none; }
  .stage__cap p { width: 21%; font-size: 11px; }
  .stage__cap strong { font-size: 11.5px; line-height: 1.25; text-wrap: balance; }
  .cta-row { margin-top: 40px; }
  .cta-row .btn { width: 100%; }
  .light, .people, .offer { padding: 88px 0; }
  .head { margin-bottom: 40px; }
  .lesson { grid-template-columns: 1fr; padding: 32px 0; }
  .lesson__no { font-size: 32px; margin-bottom: 14px; }
  .lesson p { grid-column: 1; }
  .beginner, .who { padding: 32px 24px; }
  .coa { margin-top: 72px; }
  .register, .join { padding: 88px 0 96px; }
  .quote-row { margin-top: 64px; padding-top: 36px; }
  .quote-row .cta-row { align-items: stretch; }
  .team { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 16px; }
  .member h3 { font-size: 18px; }
  .member__reveal { left: 8px; right: 8px; bottom: 8px; padding: 8px; font-size: 12px; }
  .coa__btn, .faq__btn { width: 100%; }
  .ty-help__head { margin-top: 88px; }
  .form, .price, .prep { padding: 28px 20px; }
  .prep__qr { display: none; }
  .foot__in { grid-template-columns: 1fr; padding: 40px 20px 96px; }
  .foot__brands { grid-row: auto; }
  .foot__legal a { display: inline-block; margin: 8px 14px 0 0; }
  /* sticky bottom bar: appears once the hero button scrolls away, hides at the form */
  .dock {
    position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 45;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 9px 9px 9px 14px; border-radius: 10px; text-decoration: none;
    background: rgba(11, 15, 43, 0.94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--rule); box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.6);
    font-size: 12px; line-height: 1.35; color: var(--muted);
    transform: translateY(150%); transition: transform .45s var(--ease);
  }
  .dock strong { display: block; color: var(--text); font-weight: 600; font-size: 14px; }
  .dock .btn { padding: 13px 16px; font-size: 13px; white-space: nowrap; }
  .dock.show { transform: none; }
}

/* ================= Upper Aeon brand alignment =================
   Source: Upper Aeon Brand Kit / Brand Guidelines.
   Type:   ADAM Bold, capitals only, +222 tracking for H1/H2. Inter Regular and Medium for everything else.
   Colour: Midnight Blue / Deep Indigo / Warm White base, Soft Lavender for labels and highlights,
           Muted Purple on light grounds, Luxury Gold kept for buttons. */
html { font-synthesis: none; } /* never fake a bold: 600/700 requests render as Inter Medium */

/* H1 / H2 */
.hero__h1 { font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: var(--track); font-size: clamp(20px, 2.4vw, 34px); line-height: 1.3; }
.hl { color: var(--lavender); }
.h2 { font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: var(--track); font-size: clamp(20px, 2.5vw, 32px); line-height: 1.3; max-width: 20em; }
.ty-cta__title { font-family: var(--display); font-weight: 700; text-transform: uppercase; letter-spacing: var(--track); font-size: clamp(16px, 1.5vw, 20px); line-height: 1.35; }

/* Labels: Inter, small caps tracking, Soft Lavender (Muted Purple on light) */
.ty-kicker, .ty-learn__label, .ty-reveal__label, .ty-learn .ty-reveal__label, .consult__kicker, .member__kicker { font-family: var(--sans); font-weight: 500; letter-spacing: 0.2em; color: var(--lavender); }
.light.ty-learn .ty-learn__label, .light.ty-learn .ty-reveal__label { color: var(--purple); }

/* Gold is for buttons. Everything else that was gold moves to lavender / purple. */
.btn, .btn--accent { font-weight: 500; }
.btn--accent { letter-spacing: 0.08em; }
.ty-cta { border-top-color: var(--lavender); }
.ty-cta__why li::before { color: var(--lavender); }
.ty-live { border-color: var(--lavender); background: rgba(194, 169, 244, 0.1); }
.ty-live__tag { background: var(--lavender); }
.light.ty-learn .ty-live { background: var(--mist-2); border-color: var(--purple); }
.ty-quote { border-left-color: var(--lavender); }
.ty-quote__listen { text-decoration-color: var(--lavender); }
.light.ty-learn .ty-quote { border-left-color: var(--purple); }
.light.ty-learn .ty-quote__listen { text-decoration-color: var(--purple); }
.light.ty-learn .ty-quote__listen:hover { color: var(--purple); }
.join { background: var(--mist-2); }

/* Atmosphere: a restrained Muted Purple glow behind the hero and the register block */
.hero::before { background:
  radial-gradient(60% 85% at 80% 38%, rgba(92, 61, 153, 0.42) 0%, rgba(92, 61, 153, 0) 70%),
  linear-gradient(90deg, var(--bg) 0%, var(--bg) 34%, rgba(2, 11, 44, 0.72) 58%, rgba(2, 11, 44, 0.45) 100%),
  linear-gradient(0deg, var(--bg) 0%, var(--bg-0) 30%); }
.ty-hero::before { background:
  radial-gradient(55% 90% at 85% 40%, rgba(92, 61, 153, 0.4) 0%, rgba(92, 61, 153, 0) 70%),
  linear-gradient(90deg, var(--bg) 30%, rgba(2, 11, 44, 0.6) 100%),
  linear-gradient(0deg, var(--bg), var(--bg-0) 35%); }
.register::before { background:
  radial-gradient(55% 80% at 85% 50%, rgba(92, 61, 153, 0.35) 0%, rgba(92, 61, 153, 0) 70%),
  linear-gradient(90deg, var(--bg) 20%, rgba(2, 11, 44, 0.7) 100%),
  linear-gradient(0deg, var(--bg), var(--bg-0) 40%); }