/* Marketing page. Rhythmic cutlist: short hard-cut sections, no pinning. */

.site { overflow-x: hidden; }
.cut { position: relative; overflow: hidden; }
.cut h2, .cut h3 { text-wrap: balance; }
.cut p { text-wrap: pretty; }

/* display face, shared voice */
.hero__h1, .word, .offer__price, .welcome__h, .teach__h, .coach__h,
.programs__h, .plan__name, .plan__price span, .visit__h, .visit__hours,
.registry__h, .close__h {
  font-family: var(--sc-font-display); font-weight: 900; text-transform: uppercase;
  line-height: 0.92; letter-spacing: -0.01em; margin: 0;
}
em { font-style: italic; color: var(--gold); }

/* ---------------------------------------------------------------- clock */
.clock {
  justify-self: center; display: flex; align-items: baseline; gap: 10px;
  font-family: var(--sc-font-display); font-weight: 800; font-variant-numeric: tabular-nums;
  padding: 6px 14px; border-radius: var(--radius);
  background: rgba(10, 5, 6, 0.55); border: 1px solid rgba(212, 169, 79, 0.4);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition: background-color 200ms var(--ease-out), border-color 200ms var(--ease-out);
}
.clock__rd { font-size: 0.95rem; letter-spacing: 0.14em; color: var(--sc-ink-soft); }
.clock__t { font-size: 2rem; line-height: 1; color: var(--gold); min-width: 3.1ch; text-align: right; }
.clock.is-final { background: rgba(120, 18, 18, 0.7); border-color: var(--red-alert); }
.clock.is-final .clock__t { color: #fff; animation: clockPulse 1s steps(2, jump-none) infinite; }
.clock.is-bell { animation: bell 620ms var(--ease-out); }
@keyframes clockPulse { 50% { color: #ffb4ad; } }
@keyframes bell {
  0% { transform: rotate(0); background: var(--gold); }
  15% { transform: rotate(-6deg); }
  30% { transform: rotate(5deg); }
  45% { transform: rotate(-4deg); }
  60% { transform: rotate(3deg); }
  100% { transform: rotate(0); }
}
@media (max-width: 760px) {
  .bar { grid-template-columns: auto 1fr auto; }
  .clock { padding: 4px 10px; gap: 6px; }
  .clock__rd { font-size: 0.75rem; }
  .clock__t { font-size: 1.5rem; }
}
@media (max-width: 380px) { .clock__rd { display: none; } }

/* ---------------------------------------------------------------- the corner */
.corner {
  position: absolute; left: 50%; top: calc(var(--bar-h) - 1px);
  translate: -50% 0;
  display: grid; justify-items: center; gap: 4px;
  min-width: min(520px, 92vw); padding: 14px 28px 18px;
  background: linear-gradient(180deg, var(--burgundy) 0%, var(--burgundy-2) 100%);
  border: 1px solid rgba(212, 169, 79, 0.45); border-top: 0;
  border-radius: 0 0 12px 12px;
  box-shadow: 0 18px 40px rgba(10, 4, 5, 0.55), inset 0 -1px 0 rgba(212, 169, 79, 0.25);
  clip-path: inset(0 0 100% 0);
  transition: clip-path 360ms var(--ease-out);
  pointer-events: none;
}
.corner.is-open { clip-path: inset(0 0 -20px 0); }
.corner__num {
  font-family: var(--sc-font-display); font-weight: 900; font-size: clamp(2.4rem, 6vw, 4rem);
  line-height: 0.9; color: var(--gold); letter-spacing: 0.02em; font-variant-numeric: tabular-nums;
}
.corner__call { font-weight: 600; font-size: 0.95rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bone); }
.corner__num.is-new { animation: callIn 260ms var(--ease-out); }
@keyframes callIn { from { opacity: 0; transform: translateY(-8px) scale(0.96); } }

/* ---------------------------------------------------------------- hero */
.hero { height: 100svh; min-height: 620px; position: relative; overflow: hidden; background: #0b0708; }
.hero__scene { position: absolute; inset: var(--bar-h) 0 0 0; overflow: hidden; }
.hero__plane { position: absolute; will-change: transform; }
.hero__bg { top: -2%; left: -16%; width: 118%; height: 105%; max-width: none; object-fit: cover; object-position: 50% 0%; }
.hero__scrim {
  position: absolute; inset: 0;
  background: linear-gradient(270deg, rgba(10, 6, 7, 0.9) 0%, rgba(10, 6, 7, 0.6) 30%, rgba(10, 6, 7, 0) 52%),
              linear-gradient(0deg, rgba(10, 6, 7, 0.6) 0%, rgba(10, 6, 7, 0) 25%);
}
.hero__copy {
  position: absolute; z-index: 2; right: clamp(18px, 5vw, 80px); bottom: clamp(48px, 12vh, 140px);
  max-width: 30rem; display: grid; gap: 18px; justify-items: start;
}
.hero__tag { margin: 0; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; font-size: 0.85rem; color: var(--gold); }
.hero__h1 { font-size: clamp(3.4rem, 7vw, 6.6rem); letter-spacing: -0.015em; text-shadow: 0 4px 24px rgba(0, 0, 0, 0.5); }
.hero__sub { margin: 0; font-size: 1.15rem; max-width: 30ch; color: #eadfd4; line-height: 1.5; }
.hero__cta { margin-top: 6px; font-size: 1.2rem; padding: 16px 28px; }

@media (max-width: 1100px) {
  .hero { height: 100svh; min-height: 640px; }
  .hero__bg { left: -3%; width: 106%; object-position: 48% 0%; }
  .hero__scrim { background: linear-gradient(0deg, rgba(10, 6, 7, 0.97) 0%, rgba(10, 6, 7, 0.88) 36%, rgba(10, 6, 7, 0) 60%); }
  .hero__copy { left: 18px; right: 18px; bottom: 32px; gap: 14px; }
  .hero__h1 { font-size: clamp(3rem, 15vw, 4.4rem); }
  .hero__sub { font-size: 1.02rem; }
}

/* ---------------------------------------------------------------- offer (gold cut) */
.cut--gold { background: var(--gold); color: var(--sc-accent-ink); }
.offer { padding: clamp(56px, 10vh, 110px) clamp(18px, 6vw, 96px); }
.offer__inner { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: clamp(24px, 5vw, 80px); align-items: end; max-width: 1200px; margin: 0 auto; }
.offer__kicker { grid-column: 1 / -1; margin: 0 0 6px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; font-size: 0.9rem; color: var(--burgundy-2); }
.offer__price { grid-row: 2 / 4; font-size: clamp(7rem, 20vw, 15rem); color: var(--burgundy); display: flex; align-items: flex-start; font-variant-numeric: tabular-nums; }
.offer__dollar { font-size: 0.42em; margin-top: 0.12em; }
.offer__per { font-size: 0.14em; align-self: flex-end; margin: 0 0 0.9em 0.4em; letter-spacing: 0.08em; color: var(--sc-accent-ink); }
.offer__line { margin: 0 0 18px; font-size: clamp(1.15rem, 2vw, 1.5rem); font-weight: 600; max-width: 26ch; line-height: 1.35; }
.offer .btn { justify-self: start; margin-bottom: 2.2rem; }
@media (max-width: 760px) {
  .offer__inner { grid-template-columns: 1fr; }
  .offer__price { grid-row: auto; }
  .offer .btn { margin-bottom: 0; }
}

/* ---------------------------------------------------------------- welcome */
.welcome { padding: clamp(72px, 14vh, 160px) clamp(18px, 6vw, 96px); background: var(--sc-canvas); }
.welcome__copy { display: grid; gap: 22px; max-width: 46rem; }
.welcome__h { font-size: clamp(3.2rem, 8vw, 7rem); }
.welcome__list { font-family: var(--sc-font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.05; letter-spacing: 0.02em; color: var(--bone) !important; }
.welcome__copy p { margin: 0; font-size: 1.2rem; color: var(--sc-ink-soft); max-width: 46ch; }

/* ---------------------------------------------------------------- teach (the peak) */
.teach { padding: clamp(150px, 22vh, 220px) clamp(18px, 6vw, 96px) clamp(72px, 12vh, 140px); background: var(--burgundy); }
.teach__h { font-size: clamp(3.4rem, 8vw, 7rem); color: var(--bone); }
.teach__grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: clamp(20px, 3vw, 48px); margin-top: clamp(36px, 6vw, 72px); max-width: 1200px; }
.teach__grid > div { border-top: 2px solid var(--gold); padding-top: 18px; }
.teach__grid h3 { margin: 0 0 10px; font-family: var(--sc-font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1; color: var(--gold); }
.teach__grid p { margin: 0; font-size: 1.1rem; line-height: 1.55; color: #f1e4d8; }
@media (max-width: 860px) { .teach__grid { grid-template-columns: 1fr; } .teach { padding-top: 170px; } }

/* ---------------------------------------------------------------- coach */
.coach { display: grid; grid-template-columns: minmax(280px, 0.8fr) 1.2fr; gap: clamp(28px, 6vw, 96px); align-items: center; padding: clamp(64px, 12vh, 140px) clamp(18px, 6vw, 96px); background: linear-gradient(180deg, #0f0a0b, #1a0f12); }
.coach__photo { margin: 0; border-radius: 10px; overflow: hidden; box-shadow: 0 30px 60px rgba(5, 2, 3, 0.6), 0 0 0 1px rgba(212, 169, 79, 0.25); max-height: 82vh; }
.coach__photo img { width: 100%; height: 100%; max-height: 82vh; object-fit: cover; object-position: 50% 30%; }
.coach__copy { display: grid; gap: 20px; max-width: 38rem; }
.coach__h { font-size: clamp(3.2rem, 7vw, 6.4rem); color: var(--gold); }
.coach__lede { margin: 0; font-family: var(--sc-font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(1.6rem, 3vw, 2.2rem); letter-spacing: 0.02em; line-height: 1.05; }
.coach__copy p:not(.coach__lede) { margin: 0; font-size: 1.15rem; color: var(--sc-ink-soft); max-width: 52ch; }
.coach__phone { justify-self: start; font-weight: 700; color: var(--gold); }
@media (max-width: 760px) {
  .coach { grid-template-columns: 1fr; }
  .coach__photo { max-height: 70vh; }
}

/* ---------------------------------------------------------------- proof */
.proof { display: grid; grid-template-columns: auto 1fr; gap: clamp(28px, 6vw, 96px); align-items: center; padding: clamp(64px, 10vh, 120px) clamp(18px, 6vw, 96px); background: var(--burgundy-2); }
.proof__video { width: min(360px, 80vw); border-radius: 14px; overflow: hidden; box-shadow: 0 24px 50px rgba(5, 2, 3, 0.55), 0 0 0 1px rgba(212, 169, 79, 0.35); background: #000; }
.proof__video video { width: 100%; height: auto; aspect-ratio: 9 / 16; object-fit: cover; }
.proof__copy { display: grid; gap: 22px; justify-items: start; max-width: 40rem; }
.proof__quote { margin: 0; }
.proof__quote p { margin: 0; font-family: var(--sc-font-display); font-weight: 800; text-transform: uppercase; font-size: clamp(2.2rem, 4.6vw, 4rem); line-height: 0.98; }
.proof__quote--sm p { font-size: clamp(1.4rem, 2.4vw, 2rem); color: var(--gold); line-height: 1.05; }
.proof__cite { margin: 0; color: var(--sc-ink-soft); font-size: 0.95rem; }
@media (max-width: 760px) {
  .proof { grid-template-columns: 1fr; justify-items: center; }
  .proof__copy { justify-items: start; }
}

/* ---------------------------------------------------------------- programs */
.programs { padding: clamp(64px, 12vh, 140px) clamp(18px, 6vw, 96px); background: var(--sc-canvas); }
.programs__h { font-size: clamp(3.4rem, 8vw, 7rem); margin-bottom: clamp(28px, 5vw, 56px); }
.programs__grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(16px, 2.5vw, 32px); align-items: stretch; max-width: 1200px; }
.plan { position: relative; display: grid; align-content: start; gap: 14px; padding: clamp(24px, 3vw, 40px); border-radius: 10px; background: var(--sc-surface); box-shadow: 0 18px 40px rgba(5, 2, 3, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06); }
.plan--main { background: linear-gradient(160deg, #2a0d14 0%, var(--burgundy-2) 100%); outline: 2px solid var(--gold); outline-offset: -2px; }
.plan__name { font-size: clamp(2rem, 3.4vw, 2.8rem); color: var(--gold); }
.plan__price { margin: 0; font-size: 1.05rem; color: var(--sc-ink-soft); }
.plan__price span { font-size: clamp(3.6rem, 7vw, 5.6rem); color: var(--bone); margin-right: 6px; font-variant-numeric: tabular-nums; }
.plan__note { margin: 0; color: var(--bone); font-weight: 600; }
.plan__list { margin: 6px 0 12px; padding: 0; list-style: none; display: grid; gap: 10px; }
.plan__list li { position: relative; padding-left: 26px; color: #e7dacd; }
.plan__list li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 12px; height: 12px; border-radius: 2px; background: var(--gold); transform: rotate(45deg) scale(0.75); }
.plan .btn { justify-self: start; margin-top: auto; }
.programs__fine { margin: 28px 0 0; color: var(--sc-ink-soft); max-width: 70ch; }
@media (max-width: 860px) { .programs__grid { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- visit */
.visit { padding: clamp(64px, 11vh, 130px) clamp(18px, 6vw, 96px); background: #f3eadf; color: #1b1112; }
.visit a { color: var(--burgundy); font-weight: 700; }
.visit__grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(28px, 6vw, 96px); align-items: end; max-width: 1200px; }
.visit__h { font-size: clamp(3.4rem, 8vw, 7rem); color: var(--burgundy); }
.visit__hours { font-size: clamp(2.4rem, 5vw, 4.2rem); color: #1b1112; margin-top: 8px; font-variant-numeric: tabular-nums; }
.visit__info { display: grid; gap: 14px; font-size: 1.2rem; }
.visit__info p { margin: 0; }
.visit__note { color: #5b4a44; font-size: 1rem; }
@media (max-width: 760px) { .visit__grid { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------- registry */
.registry { padding: clamp(56px, 10vh, 110px) clamp(18px, 6vw, 96px); background: #0c0809; border-top: 1px solid rgba(212, 169, 79, 0.2); }
.registry__inner { display: grid; gap: 18px; justify-items: start; max-width: 46rem; margin-left: auto; text-align: left; }
.registry__h { font-size: clamp(2.6rem, 5.4vw, 4.6rem); color: var(--gold); }
.registry__inner p { margin: 0; font-size: 1.15rem; color: var(--sc-ink-soft); max-width: 48ch; }

/* ---------------------------------------------------------------- close */
.close { min-height: 100svh; display: grid; grid-template-rows: 1fr auto; background: radial-gradient(70% 60% at 50% 40%, #3a0d17 0%, #160a0c 70%); }
.close__inner { align-self: center; justify-self: center; text-align: center; display: grid; gap: 22px; justify-items: center; padding: calc(var(--bar-h) + 40px) 18px 40px; }
.close__h { font-size: clamp(3.4rem, 10vw, 9rem); }
.close__line { margin: 0; font-size: 1.2rem; color: var(--sc-ink-soft); }
.close__cta { font-size: 1.35rem; padding: 18px 34px; }
.when-closed { display: none; }
.signup-closed .when-closed { display: grid; }
.signup-closed .when-open { display: none !important; }
.close__contact { gap: 16px; justify-items: center; }
.close__contact p { margin: 0; font-size: 1.2rem; max-width: 34ch; }
.close__btns { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.foot {display: grid; gap: 8px; justify-items: center; text-align: center; padding: 28px 18px 36px; border-top: 1px solid rgba(212, 169, 79, 0.2); color: var(--sc-ink-soft); font-size: 0.92rem; }
.foot img { height: 56px; width: auto; margin-bottom: 6px; }
.foot p { margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .hero__plane { transform: none !important; }
  .corner { transition: none; }
}
