/* ============================================================
   A Bridge to the Throne — static rebuild
   Palette and type measured off the Framer canvas (31 Aug 2026).
   96 BPM motion grid: beat 625ms, quarter 160ms, ease (.22,1,.36,1)
   ============================================================ */

/* ---------- fonts ---------- */
@font-face { font-family: "Bodoni Moda"; src: url("/assets/fonts/bodoni-moda-normal.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Bodoni Moda"; src: url("/assets/fonts/bodoni-moda-italic.woff2") format("woff2"); font-weight: 400 900; font-style: italic; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url("/assets/fonts/eb-garamond-normal.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url("/assets/fonts/eb-garamond-italic.woff2") format("woff2"); font-weight: 400 800; font-style: italic; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("/assets/fonts/switzer-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("/assets/fonts/switzer-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("/assets/fonts/switzer-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Switzer"; src: url("/assets/fonts/switzer-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

/* ---------- tokens ---------- */
:root {
  --ink950: #0B0D14;
  --midnight: #0E1427;
  --void: #0A0F1E;
  --elevated: #1F283D;
  --gold: #FFD181;
  --gold-deep: #C99A4E;
  --amber: #D8A24A;
  --bronze: #8C5D30;
  --ember: #8A5A2B;
  --bone: #E7E3D8;
  --platinum: #C9CCD4;
  --cream: #EECDA6;
  --silver: #A4A6AE;
  --muted: #8891A6;
  --hairline: rgba(140, 93, 48, 0.42);
  --hairline-soft: rgba(164, 166, 174, 0.16);
  --grad-gold: linear-gradient(135deg, #F6CD77 0%, #C98A2D 48%, #F4C466 100%);
  --grad-gold-v: linear-gradient(180deg, #FFD181 0%, #D8A24A 100%);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --beat: 625ms;
  --quarter: 160ms;
  --serif: "Bodoni Moda", "Didot", Georgia, serif;
  --sans: "Switzer", "Inter", -apple-system, "Helvetica Neue", sans-serif;
  --garamond: "EB Garamond", Georgia, serif;
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--ink950);
  color: var(--bone);
  font-family: var(--sans);
  font-size: 19px;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
section { scroll-margin-top: 72px; }
button { font: inherit; border: 0; background: none; }
input, select, textarea { font: inherit; color: inherit; }

/* ---------- type presets (base = >=1200) ---------- */
.t-display { font-family: var(--serif); font-weight: 700; font-size: 54px; letter-spacing: -0.025em; line-height: 0.9; color: var(--platinum); text-wrap: balance; }
.t-h2 { font-family: var(--serif); font-weight: 700; font-size: 64px; letter-spacing: -0.015em; line-height: 1.02; color: var(--cream); text-wrap: balance; }
.t-h2-light { font-family: var(--serif); font-weight: 700; font-size: 64px; letter-spacing: -0.015em; line-height: 1.02; color: #12161F; text-wrap: balance; }
.t-quote { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 34px; letter-spacing: -0.01em; line-height: 1.22; color: var(--cream); text-wrap: balance; }
.t-thesis { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 30px; letter-spacing: -0.01em; line-height: 1.25; color: var(--cream); text-wrap: balance; }
.t-label { font-family: var(--sans); font-weight: 600; font-size: 14px; letter-spacing: 0.11em; line-height: 1.4; color: var(--silver); text-transform: uppercase; }
.t-body { font-family: var(--sans); font-weight: 400; font-size: 18px; line-height: 1.65; color: var(--bone); }
.t-body--tight { letter-spacing: -0.02em; }
.t-dek { font-family: var(--sans); font-weight: 400; font-size: 18px; letter-spacing: -0.02em; line-height: 1.65; color: var(--muted); text-wrap: balance; }
.t-caption { font-family: var(--garamond); font-weight: 400; font-size: 16px; letter-spacing: -0.02em; line-height: 1.5; color: var(--muted); }
.t-navlink { font-family: var(--sans); font-weight: 500; font-size: 15px; letter-spacing: -0.02em; line-height: 1.2; color: var(--platinum); cursor: pointer; display: inline-block; transition: transform var(--quarter) var(--ease); }
.t-navlink:hover { transform: translateY(-2px); }
.t-ticker { font-family: var(--serif); font-weight: 700; font-size: 34px; letter-spacing: 0.04em; line-height: 1.1; color: var(--gold-deep); text-transform: uppercase; }
.t-audience { font-family: var(--serif); font-weight: 700; font-size: 40px; letter-spacing: -0.01em; line-height: 1.18; color: #12161F; }
.t-body-light { font-family: var(--sans); font-weight: 400; font-size: 18px; letter-spacing: -0.02em; line-height: 1.65; color: #3A4150; }

@media (max-width: 1199.98px) {
  .t-display { font-size: 44px; }
  .t-h2, .t-h2-light { font-size: 48px; }
  .t-quote { font-size: 28px; }
  .t-audience { font-size: 32px; }
}
@media (max-width: 809.98px) {
  .t-display { font-size: 38px; }
  .t-h2, .t-h2-light { font-size: 38px; line-height: 1.06; }
  .t-quote { font-size: 23px; }
  .t-audience { font-size: 27px; }
}
@media (max-width: 639.98px) {
  .t-display { font-size: 32px; }
}

/* ---------- spacing utilities (canvas spacers) ---------- */
.sp-t8 { margin-top: 8px; } .sp-t10 { margin-top: 10px; } .sp-t18 { margin-top: 18px; }
.sp-t20 { margin-top: 20px; } .sp-t22 { margin-top: 22px; } .sp-t24 { margin-top: 24px; }
.sp-t26 { margin-top: 26px; } .sp-t28 { margin-top: 28px; } .sp-t30 { margin-top: 30px; }
.sp-t32 { margin-top: 32px; } .sp-t34 { margin-top: 34px; } .sp-t40 { margin-top: 40px; }
.sp-t52 { margin-top: 52px; } .sp-t54 { margin-top: 54px; } .sp-t56 { margin-top: 56px; }
.sp-t58 { margin-top: 58px; }
.maxw-400 { max-width: 400px; } .maxw-470 { max-width: 470px; } .maxw-480 { max-width: 480px; }
.maxw-520 { max-width: 520px; } .maxw-560 { max-width: 560px; } .maxw-620 { max-width: 620px; }
.maxw-660 { max-width: 660px; } .maxw-720 { max-width: 720px; } .maxw-760 { max-width: 760px; }
.maxw-820 { max-width: 820px; } .maxw-900 { max-width: 900px; }

/* ---------- shared devices ---------- */
.eyebrow { display: flex; align-items: center; gap: 14px; }
.eyebrow--center { justify-content: center; }
.eyebrow__rule { width: 46px; height: 1px; background: var(--gold-deep); flex: none; }
.eyebrow__rule--token { background: var(--gold-deep); }
.eyebrow__rule--ember { background: var(--ember); }
.eyebrow__label { font-family: var(--sans); font-weight: 600; font-size: 22px; letter-spacing: 0.12em; line-height: 1.35; color: var(--gold-deep); text-transform: uppercase; }
.eyebrow__label--light { font-family: var(--serif); font-weight: 500; font-size: 22px; letter-spacing: 0.22em; line-height: 1.3; color: var(--ember); }
@media (max-width: 809.98px) {
  .eyebrow { gap: 9px; }
  .eyebrow__rule { width: 28px; }
  .eyebrow__label, .eyebrow__label--light { font-size: 13px; letter-spacing: 0.08em; }
}

.wtc { border-left: 2px solid var(--bronze); padding: 4px 0 6px 28px; display: flex; flex-direction: column; gap: 16px; max-width: 640px; }
.wtc--wide { max-width: 720px; padding-left: 30px; gap: 18px; }
.wtc--toll { max-width: 760px; padding: 10px 0 12px 34px; }

.stage { position: relative; width: 100%; height: 100%; overflow: clip; pointer-events: none; }
.stage--abs { position: absolute; inset: 0; z-index: 0; }
.stage__img { position: absolute; inset: 0; background-size: cover; background-position: center; will-change: transform; transform: translateY(var(--par, 0px)) scale(var(--fieldscale, 1)); }
[data-rvfield] { opacity: 0; --fieldscale: 1.08; transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
[data-rvfield].field-in { --fieldscale: 1; }
.crossing__field.field-in { opacity: 0.44; }
.water__photo.field-in { opacity: 0.3; }
@media (prefers-reduced-motion: reduce) { [data-rvfield] { transition: none; --fieldscale: 1; } .crossing__field { opacity: 0.44; } .water__photo { opacity: 0.3; } }
.photosec { position: relative; overflow: clip; }
.overlay { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; padding: 64px 48px; overflow: clip; }
.overlay__content { width: 100%; max-width: 1240px; display: flex; flex-direction: column; align-items: flex-start; }
.overlay__content--end { align-items: flex-end; }
.overlay__content--center { align-items: center; max-width: 900px; }
@media (max-width: 809.98px) { .overlay { padding: 48px 22px; } }

.grain { position: absolute; inset: 0; background-image: url("/assets/images/grain.png"); background-size: 480px; opacity: 0.08; mix-blend-mode: soft-light; }
.grain--soft { opacity: 0.07; }
.grain--loop { opacity: 0.08; }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-family: var(--sans); font-weight: 600; font-size: 15px; letter-spacing: 0.02em; line-height: 1.2; transition: transform var(--quarter) var(--ease), box-shadow var(--quarter) var(--ease), background-color var(--quarter) var(--ease); }
.btn--gold { background: var(--grad-gold); color: var(--ink950); padding: 15px 16px; border-radius: 2px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.42), 0 10px 24px rgba(201,138,45,0.28); }
.btn--gold:hover { transform: translateY(-3px) scale(1.03); box-shadow: inset 0 1px 0 rgba(255,255,255,0.42), 0 12px 30px rgba(216,162,74,0.36); }
.btn--ghost { border: 1px solid rgba(164,166,174,0.34); color: var(--bone); padding: 15px 16px; border-radius: 2px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.30); }
.btn--ghost:hover { transform: translateY(-3px) scale(1.03); background-color: rgba(255,209,129,0.09); }
.btn--nav { padding: 11px 22px; font-size: 14px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.42), 0 8px 20px rgba(201,138,45,0.24); }
.btn--gold-v { background: var(--grad-gold-v); color: var(--ink950); padding: 14px 24px; border-radius: 2px; }
.btn--gold-v:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(216,162,74,0.34); }
.btn--pill { border-radius: 999px; padding: 15px 28px; }
.btn--full { width: 100%; padding: 16px 30px; }

/* ---------- forms ---------- */
.field { background: rgba(11,13,20,0.7); border: 1px solid rgba(164,166,174,0.28); border-radius: 2px; padding: 14px 16px; font-family: var(--sans); font-size: 16px; line-height: 1.2; color: var(--bone); width: 100%; outline: none; transition: border-color var(--quarter) var(--ease); }
.field::placeholder { color: var(--muted); }
.field:focus { border-color: var(--gold); }
.field--r10 { border-radius: 10px; border-color: rgba(164,166,174,0.22); }
.field--area { height: 120px; resize: vertical; line-height: 1.5; }
.field--select { appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238891A6' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }
.field--select:invalid, .field--select option[value=""] { color: var(--muted); }
.field--select:has(option[value=""]:checked) { color: var(--muted); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.form-msg { font-family: var(--sans); font-size: 14px; line-height: 1.5; margin-top: 10px; }
.form-msg--ok { color: var(--gold); }
.form-msg--err { color: #E08B8B; }

/* ---------- reveals ---------- */
[data-rv], [data-rv-mount] { opacity: 0; transform: translateY(14px); transition: opacity var(--beat) var(--ease), transform var(--beat) var(--ease); transition-delay: var(--rv-delay, 0s); }
.rv-in { opacity: 1 !important; transform: none !important; }

/* ============================================================
   NAV
   ============================================================ */
.nav { position: sticky; top: 0; z-index: 9; display: flex; align-items: center; justify-content: space-between; padding: 18px 48px; background: rgba(11,13,20,0.78); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--hairline-soft); }
.nav__wordmark { font-family: var(--serif); font-weight: 700; font-size: 19px; letter-spacing: -0.01em; line-height: 1.2; color: var(--bone); }
.nav__links { display: flex; align-items: center; gap: 34px; }
@media (max-width: 1199.98px) { .nav { padding: 16px 40px; } }
@media (max-width: 809.98px) { .nav { padding: 14px 20px; } .nav__links { display: none; } }

/* ============================================================
   THE APPROACH (hero)
   ============================================================ */
.approach { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; min-height: 800px; max-height: 1040px; padding: 66px 0 74px; background: var(--ink950); overflow: clip; }
.approach .stage { position: absolute; inset: 0; z-index: 0; }
.approach__backdrop { height: 118%; top: -9%; background-image: url("/assets/images/hero-backdrop.jpg"); filter: saturate(1.06); }
.approach__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,13,20,0.88) 0%, rgba(11,13,20,0.72) 30%, rgba(11,13,20,0.7) 64%, rgba(11,13,20,0.94) 100%); }
.approach__bloom { position: absolute; inset: 0; background: radial-gradient(38% 50% at 17% 55%, rgba(216,162,74,0.14) 0%, rgba(11,13,20,0) 70%); animation: bloom 10s var(--ease) infinite alternate; }
@keyframes bloom { from { transform: scale(1); } to { transform: scale(1.04); } }
.approach__vignette { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,13,20,0.88) 0%, rgba(11,13,20,0) 20%, rgba(11,13,20,0) 72%, rgba(11,13,20,1) 100%); }
.approach__content { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 48px; width: 100%; max-width: 1188px; padding: 0 24px; }
.approach__book { display: flex; flex-direction: column; gap: 24px; width: 400px; flex: none; }
.approach__caption { }
.approach__column { flex: 1; min-width: 360px; max-width: 440px; position: relative; z-index: 2; }
.approach__headline { margin-top: 26px; }
.approach__headline-gold { font-family: var(--serif); font-weight: 700; font-size: 52px; letter-spacing: -0.025em; line-height: 0.98; background: linear-gradient(102deg, #8C5D30 8%, #E8B978 34%, #FFD181 50%, #E8B978 66%, #8C5D30 94%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.approach__thesis { font-family: var(--garamond); font-style: italic; font-weight: 400; font-size: 30px; line-height: 1.2; color: var(--bone); max-width: 400px; margin-top: 30px; }
.approach__avail { font-family: var(--serif); font-weight: 700; font-size: 18px; letter-spacing: 0.16em; line-height: 1.45; text-transform: uppercase; color: var(--gold); margin-top: 28px; text-wrap: balance; }
.approach__ctas { display: flex; gap: 22px; margin-top: 24px; }
.approach__portrait { position: relative; width: 300px; height: 450px; flex: none; z-index: 1; box-shadow: 0 24px 60px rgba(0,0,0,0.55), 0 3px 10px rgba(0,0,0,0.4); }
.approach__portrait-photo { position: absolute; inset: 0; background-image: url("/assets/images/portrait-throne.jpg"); background-size: cover; background-position: center top; }

/* Bridge Book (3D) */
.book3d { position: relative; width: 380px; height: 608px; perspective: 1400px; perspective-origin: 50% 45%; }
.book3d__glow { position: absolute; left: -34%; top: -14%; width: 168%; height: 132%; background: radial-gradient(44% 42% at 50% 54%, rgba(216,162,74,0.34) 0%, rgba(138,90,43,0.11) 48%, rgba(11,13,20,0) 76%); pointer-events: none; }
.book3d__pivot { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; will-change: transform; }
.book3d__scene { position: absolute; left: -52%; top: -16%; width: 204%; height: 132%; transform: translateZ(-150px); background-image: url("/assets/images/cover-scene.jpg"); background-size: cover; background-position: center 42%; opacity: 0.32; filter: saturate(0.9); -webkit-mask-image: radial-gradient(58% 54% at 50% 50%, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.5) 46%, rgba(0,0,0,0) 76%); mask-image: radial-gradient(58% 54% at 50% 50%, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.5) 46%, rgba(0,0,0,0) 76%); pointer-events: none; }
.book3d__shadow { position: absolute; left: 6%; top: 8%; width: 88%; height: 92%; border-radius: 6px; background: rgba(0,0,0,0.72); filter: blur(38px); transform: translateZ(-40px) translateY(34px); opacity: 0.6; pointer-events: none; will-change: transform; }
.book3d__cover { position: absolute; inset: 0; border-radius: 3px; overflow: hidden; box-shadow: 0 2px 6px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,209,129,0.16); transform-style: preserve-3d; will-change: transform; }
.book3d__cover img { width: 100%; height: 100%; object-fit: cover; }
.book3d__spine { position: absolute; left: 0; top: 0; width: 15px; height: 100%; background: linear-gradient(90deg, rgba(0,0,0,0.62) 0%, rgba(0,0,0,0.3) 42%, rgba(255,255,255,0.07) 74%, rgba(0,0,0,0.18) 100%); pointer-events: none; }
.book3d__glare { position: absolute; top: -30%; left: 0; width: 62%; height: 160%; background: linear-gradient(90deg, rgba(255,244,222,0) 0%, rgba(255,244,222,0.16) 48%, rgba(255,244,222,0) 100%); transform: rotate(16deg) translateX(40%); opacity: 0.55; pointer-events: none; will-change: transform; }

@media (max-width: 1199.98px) {
  .approach { height: auto; min-height: 0; max-height: none; padding: 60px 40px 68px; }
  .approach__content { gap: 36px; }
  .approach__book { width: 300px; }
  .book3d { width: 300px; height: 480px; }
  .approach__column { min-width: 300px; }
  .approach__headline-gold { font-size: 44px; }
  .approach__portrait { width: 220px; height: 330px; }
}
@media (max-width: 809.98px) {
  .approach { padding: 42px 22px 60px; }
  .approach__content { flex-direction: column; gap: 36px; max-width: 360px; padding: 0; }
  .approach__book { width: 300px; align-items: center; gap: 16px; }
  .approach__caption { width: 100%; text-align: center; }
  .approach__column { width: 100%; min-width: 0; max-width: 346px; display: flex; flex-direction: column; align-items: center; text-align: center; }
  .approach__headline-gold { font-size: 32px; }
  .approach__thesis { max-width: 100%; }
  .approach__ctas { flex-direction: column; gap: 12px; width: 100%; }
  .approach__ctas .btn { width: 100%; }
  .approach__portrait { display: none; }
}

/* ============================================================
   DECK TICKER
   ============================================================ */
.ticker { background: var(--void); border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); padding: 22px 0 24px; overflow: clip; }
.ticker__row { display: flex; gap: 30px; width: max-content; will-change: transform; }
.ticker__set { display: flex; align-items: center; gap: 30px; padding-right: 30px; }
.ticker__diamond { font-family: var(--serif); font-size: 20px; line-height: 1.2; color: var(--ember); }
@media (max-width: 1199.98px) { .ticker { padding: 120px 0 130px; } }
@media (max-width: 809.98px) { .ticker { padding: 84px 0 92px; } }

/* ============================================================
   THE CROSSING
   ============================================================ */
.crossing { background: var(--void); }
.crossing__stage { aspect-ratio: 1.9; }
.crossing__field { background-image: url("/assets/images/crossing-platform.jpg"); background-position: center 52%; filter: brightness(0.78) contrast(0.96) saturate(0.68); }
.crossing__scrim { position: absolute; inset: 0; background: linear-gradient(96deg, rgba(7,10,16,0.98) 0%, rgba(7,10,16,0.92) 35%, rgba(7,10,16,0.66) 58%, rgba(7,10,16,0.30) 100%); }
.crossing__fade { position: absolute; inset: 0; background: linear-gradient(180deg, #080A10 0%, rgba(8,10,16,0) 18%, rgba(8,10,16,0) 78%, #080A10 100%); }
.col--crossing { width: 58%; min-width: 400px; }
@media (max-width: 809.98px) {
  .crossing__stage { aspect-ratio: 0.52; }
  .col--crossing { width: 100%; min-width: 0; }
}

/* ============================================================
   THE WATER
   ============================================================ */
.water { position: relative; background: #080A10; overflow: clip; padding: 88px 48px 96px; }
.water__photo { background-image: url("/assets/images/brownstone.jpg"); filter: brightness(0.84) contrast(0.96) grayscale(0.78) saturate(0.82); }
.water__scrim { position: absolute; inset: 0; background: linear-gradient(94deg, rgba(8,10,16,0.94) 0%, rgba(8,10,16,0.79) 31%, rgba(8,10,16,0.42) 58%, rgba(8,10,16,0.12) 82%, rgba(8,10,16,0.02) 100%); }
.water__fade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,10,16,0.86) 0%, rgba(8,10,16,0.05) 22%, rgba(8,10,16,0.08) 74%, rgba(8,10,16,0.88) 100%); }
.water__cast { position: absolute; inset: 0; background: rgba(44,70,110,0.22); mix-blend-mode: screen; }
.water__content { position: relative; z-index: 2; max-width: 1240px; margin: 0 auto; }
.col--water { width: 60%; min-width: 420px; }
@media (max-width: 1199.98px) { .water { padding: 120px 40px 130px; } }
@media (max-width: 809.98px) {
  .water { padding: 64px 22px 72px; }
  .col--water { width: 100%; min-width: 0; }
}

/* ============================================================
   THE THRONE
   ============================================================ */
.throne { background: #0E1019; }
.throne__stage { aspect-ratio: 2.05; }
.throne__field { position: absolute; inset: 0; background: radial-gradient(52% 82% at 18% 54%, rgba(201,154,78,0.20) 0%, rgba(74,48,30,0.16) 34%, #0E1019 76%); }
.throne__photo { position: absolute; top: 0; left: 0; width: 60%; height: 100%; background-image: url("/assets/images/throne-standing.jpg"); background-size: cover; background-position: center top; filter: brightness(0.89) contrast(0.98) saturate(0.8); }
.throne__scrim { position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(11,13,20,0.08) 0%, rgba(11,13,20,0.18) 30%, rgba(11,13,20,0.68) 53%, rgba(11,13,20,0.94) 68%, rgba(11,13,20,0.99) 100%); }
.throne__fade { position: absolute; inset: 0; z-index: 3; background: linear-gradient(180deg, rgba(11,13,20,0.9) 0%, rgba(11,13,20,0) 18%, rgba(11,13,20,0) 78%, rgba(11,13,20,0.95) 100%); }
.throne .grain { z-index: 4; }
.col--throne { width: 38%; min-width: 380px; }
@media (max-width: 809.98px) {
  .throne__stage { aspect-ratio: 0.62; }
  .throne__photo { filter: brightness(0.72) contrast(0.98) saturate(0.8); }
  .col--throne { width: 100%; min-width: 0; }
}

/* ============================================================
   WORDS TO CARRY
   ============================================================ */
.words { position: relative; background: #080A10; overflow: clip; padding: 104px 48px 112px; }
.words__glow { position: absolute; inset: 0; background: radial-gradient(50% 60% at 50% 0%, rgba(201,154,78,0.12) 0%, rgba(8,10,16,0) 72%); pointer-events: none; }
.words__content { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.words__quotes { width: 100%; max-width: 760px; }
@media (max-width: 809.98px) { .words { padding: 78px 22px 84px; } }

/* ============================================================
   THE BOOK
   ============================================================ */
.booksec { background: var(--ink950); padding: 150px 48px 160px; }
.booksec__content { display: flex; align-items: center; justify-content: center; gap: 64px; max-width: 1160px; margin: 0 auto; }
.booksec__mockup { width: 580px; aspect-ratio: 3 / 2; flex: none; background-image: url("/assets/images/book-mockup.jpg"); background-size: cover; background-position: center; border-radius: 4px; box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), 0 6px 16px rgba(0, 0, 0, 0.32); }
.booksec__copy { flex: 1; min-width: 380px; }
.booksec__heading { font-family: var(--serif); font-weight: 700; font-size: 40px; letter-spacing: -0.015em; line-height: 1.06; color: var(--cream); text-wrap: balance; }
.booksec__availability { display: flex; flex-direction: column; gap: 14px; }
.booksec__announce { font-family: var(--serif); font-weight: 700; font-size: 38px; letter-spacing: -0.015em; line-height: 1.05; background: linear-gradient(102deg, #8C5D30 8%, #E8B978 34%, #FFD181 50%, #E8B978 66%, #8C5D30 94%); -webkit-background-clip: text; background-clip: text; color: transparent; text-wrap: balance; }
.booksec__avail-label { display: flex; align-items: center; gap: 14px; font-family: var(--serif); font-weight: 500; font-size: 17px; letter-spacing: 0.2em; line-height: 1.3; color: var(--gold); text-transform: uppercase; }
.booksec__form { display: flex; align-items: center; gap: 10px; max-width: 440px; }
.booksec__form .field--email { flex: 1; }
.booksec__form .btn { flex: none; white-space: nowrap; }
.booksec__note { font-family: var(--sans); font-size: 14px; line-height: 1.5; color: var(--muted); max-width: 440px; }
@media (max-width: 1199.98px) {
  .booksec { padding: 120px 40px 130px; }
  .booksec__content { flex-direction: column; gap: 52px; }
  .booksec__mockup { width: 520px; max-width: 100%; aspect-ratio: 3 / 2; }
  .booksec__copy { width: 100%; min-width: 0; }
}
@media (max-width: 809.98px) {
  .booksec { padding: 84px 22px 92px; }
  .booksec__content { gap: 44px; }
  .booksec__mockup { width: 100%; aspect-ratio: 3 / 2; height: auto; }
  .booksec__heading { font-size: 30px; }
  .booksec__form { flex-direction: column; align-items: stretch; }
  .booksec__form .btn { width: 100%; letter-spacing: 0.12em; }
}

/* ============================================================
   SEEING IS NOT BUILDING
   ============================================================ */
.seeing { background: #10121C; }
.seeing__stage { aspect-ratio: 2; }
.seeing__field { position: absolute; inset: 0; background: radial-gradient(66% 78% at 84% 45%, rgba(43,66,108,0.28) 0%, rgba(16,18,28,0.9) 52%, #10121C 100%); filter: contrast(1.06); }
.seeing__photo { background-image: url("/assets/images/seeing-mirror.jpg"); filter: brightness(0.72) contrast(0.98) saturate(0.7); }
.seeing__scrim { position: absolute; inset: 0; z-index: 2; background: radial-gradient(62% 48% at 50% 44%, rgba(11,13,20,0.88) 0%, rgba(11,13,20,0.72) 46%, rgba(11,13,20,0.38) 76%, rgba(11,13,20,0.18) 100%); }
.seeing .grain { z-index: 3; }
@media (max-width: 809.98px) { .seeing__stage { aspect-ratio: 0.6; } }

/* ============================================================
   THE BRIDGE METHOD
   ============================================================ */
.method { position: relative; background: radial-gradient(70% 90% at 4% 52%, rgba(201,154,78,0.10) 0%, rgba(11,13,20,0) 54%); border-top: 1px solid var(--hairline-soft); overflow: clip; }
.method__inner { max-width: 1080px; margin: 0 auto; padding: 84px 48px 96px; display: flex; flex-direction: column; align-items: center; gap: 44px; }
.method__aside { width: 100%; max-width: 740px; }
.method__rule { width: 180px; height: 1px; background: linear-gradient(90deg, #8C5D30 0%, rgba(140,93,48,0.05) 100%); }

.bpath { position: relative; width: 100%; }
.bpath__svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.bpath__rows { position: relative; display: flex; flex-direction: column; }
.bpath__row { min-height: 236px; display: flex; align-items: center; }
.bpath__row--left { justify-content: flex-end; padding-right: 58%; }
.bpath__row--right { justify-content: flex-start; padding-left: 58%; }
.bpath__moment { max-width: 380px; width: 100%; }
.bpath__head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 10px; }
.bpath__numeral { font-family: var(--serif); font-weight: 500; font-size: 14px; letter-spacing: 0.18em; line-height: 1.4; color: var(--gold); text-transform: uppercase; }
.bpath__name { font-family: var(--serif); font-weight: 500; font-size: 23px; letter-spacing: 0.01em; line-height: 1.2; color: var(--cream); }
.bpath__imperative { font-family: var(--sans); font-style: italic; font-size: 17px; line-height: 1.6; color: var(--platinum); margin-bottom: 12px; }
.bpath__label { font-family: var(--serif); font-weight: 500; font-size: 14px; letter-spacing: 0.16em; line-height: 1.4; color: var(--silver); text-transform: uppercase; margin-bottom: 10px; }
.bpath__body { font-family: var(--sans); font-size: 17px; line-height: 1.6; color: var(--bone); }
@media (max-width: 1199.98px) { .method__inner { gap: 52px; } }
@media (max-width: 809.98px) { .method__inner { padding: 78px 22px 84px; gap: 36px; } }
@media (max-width: 719.98px) {
  .bpath__svg { display: none; }
  .bpath__row { min-height: 0; margin-bottom: 38px; padding: 0; justify-content: flex-start; }
  .bpath__moment { max-width: none; border-left: 1px solid var(--hairline); padding-left: 20px; }
}

/* ============================================================
   WHAT WE BUILD
   ============================================================ */
.webuild { background: var(--midnight); }
.webuild__stage { aspect-ratio: 1.7; }
.webuild__photo { background-image: url("/assets/images/blueprint.jpg"); filter: brightness(0.82) contrast(0.98) saturate(0.78); }
.webuild__lines { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(201,154,78,0.11) 0%, rgba(201,154,78,0.02) 31%, rgba(201,154,78,0) 59%); }
.webuild__measure { position: absolute; top: 0; left: 156px; width: 1px; height: 100%; z-index: 2; background: linear-gradient(180deg, rgba(201,154,78,0) 0%, rgba(201,154,78,0.28) 22%, rgba(201,154,78,0.12) 78%, rgba(201,154,78,0) 100%); }
.webuild__scrim { position: absolute; inset: 0; z-index: 3; background: linear-gradient(180deg, rgba(14,20,39,0.5) 0%, rgba(14,20,39,0.32) 20%, rgba(14,20,39,0.18) 52%, rgba(14,20,39,0.3) 78%, rgba(14,20,39,0.58) 100%); }
.webuild .grain { z-index: 4; }
.webuild__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px; width: 100%; }
.bcard { display: flex; flex-direction: column; gap: 14px; padding: 30px 26px 34px; background: rgba(16,22,42,0.66); border: 1px solid rgba(164,166,174,0.18); overflow: clip; transition: transform var(--quarter) var(--ease), background-color var(--quarter) var(--ease), box-shadow var(--quarter) var(--ease); }
.bcard:hover { transform: translateY(-3px); background-color: rgba(31,40,61,0.6); box-shadow: 0 14px 34px rgba(0,0,0,0.45); }
.bcard__index { font-family: var(--sans); font-weight: 600; font-size: 14px; letter-spacing: 0.12em; color: var(--gold-deep); text-transform: uppercase; }
.bcard__rule { width: 34px; height: 1px; background: var(--gold-deep); }
.bcard__title { font-family: var(--serif); font-weight: 700; font-size: 23px; letter-spacing: 0.01em; line-height: 1.2; color: var(--gold); }
.bcard__body { font-family: var(--sans); font-size: 18px; letter-spacing: -0.02em; line-height: 1.65; color: var(--muted); }
@media (max-width: 809.98px) {
  .webuild__stage { aspect-ratio: 0.55; }
  .webuild__cards { grid-template-columns: 1fr; gap: 14px; }
}

/* ============================================================
   THE BUILD CIRCLE
   ============================================================ */
.circle { position: relative; background: radial-gradient(68% 86% at 92% 10%, rgba(201,154,78,0.11) 0%, rgba(17,16,22,0) 52%); overflow: clip; padding: 84px 48px 72px; }
.circle__content { max-width: 1120px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 30px; }
.circle__copy { width: 100%; max-width: 700px; align-self: center; }
.orbit { position: relative; width: 100%; min-height: 880px; display: flex; align-items: center; justify-content: center; }
.orbit__ring { position: absolute; width: 620px; height: 620px; border-radius: 50%; border: 1px solid rgba(164,166,174,0.18); box-shadow: inset 0 0 120px rgba(216,162,74,0.07); }
.orbit__glow { position: absolute; width: 384px; height: 384px; border-radius: 50%; background: radial-gradient(50% 50% at 50% 50%, rgba(216,162,74,0.16) 0%, rgba(11,13,20,0) 72%); }
.orbit__centre { position: relative; z-index: 2; max-width: 322px; text-align: center; font-family: var(--serif); font-size: 34px; letter-spacing: -0.01em; line-height: 1.22; color: var(--cream); }
.orbit__pillar { position: absolute; width: 236px; padding: 20px 20px 22px; background: rgba(16,22,42,0.78); border: 1px solid rgba(164,166,174,0.18); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: background-color 240ms var(--ease), border-color 240ms var(--ease); z-index: 3; }
.orbit__pillar:hover { background: rgba(31,40,61,0.9); border-color: rgba(255,209,129,0.4); z-index: 4; }
.orbit__label { font-family: var(--serif); font-weight: 500; font-size: 14px; letter-spacing: 0.18em; line-height: 1.3; color: var(--gold); margin-bottom: 8px; }
.orbit__name { font-family: var(--serif); font-weight: 500; font-size: 21px; line-height: 1.2; color: var(--cream); margin-bottom: 8px; }
.orbit__body { font-family: var(--sans); font-size: 16px; line-height: 1.55; color: var(--platinum); }
@media (max-width: 1199.98px) { .circle { padding: 120px 40px 130px; } .circle__content { gap: 52px; } }
@media (max-width: 899.98px) {
  .orbit { min-height: 0; display: block; }
  .orbit__ring, .orbit__glow { display: none; }
  .orbit__centre { max-width: none; text-align: left; margin-bottom: 34px; }
  .orbit__pillar { position: relative; width: 100%; margin-bottom: 14px; }
}
@media (max-width: 809.98px) { .circle { padding: 78px 22px 84px; } .circle__content { gap: 36px; } }

/* ============================================================
   WHO THIS IS FOR
   ============================================================ */
.whofor { background: var(--bone); padding: 150px 48px 160px; }
.whofor__content { max-width: 1240px; margin: 0 auto; }
.whofor__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.whofor__cell { display: flex; flex-direction: column; gap: 10px; padding: 30px 30px 34px 0; border-top: 1px solid rgba(18,22,31,0.18); }
@media (max-width: 1199.98px) { .whofor { padding: 120px 40px 130px; } }
@media (max-width: 809.98px) {
  .whofor { padding: 84px 22px 92px; }
  .whofor__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   AUTHORITY IN PRACTICE
   ============================================================ */
.authority { background: radial-gradient(50% 50% at 50% 50%, #0A0F1E 0%, #101728 100%); overflow: clip; padding: 96px 48px; }
.authority__content { max-width: 1120px; margin: 0 auto; display: flex; flex-direction: column; gap: 46px; }
.authority__header { max-width: 760px; display: flex; flex-direction: column; gap: 18px; }
.authority__label { font-family: var(--sans); font-weight: 600; font-size: 18px; letter-spacing: 0.12em; line-height: 1.35; color: var(--gold-deep); text-transform: uppercase; }
.authority__heading { font-family: var(--serif); font-weight: 600; font-size: 54px; letter-spacing: -0.035em; line-height: 1.05; color: #F2D7AD; text-wrap: balance; }
.authority__dek { font-family: var(--sans); font-size: 19px; letter-spacing: -0.01em; line-height: 1.6; color: var(--bone); max-width: 660px; }
.authority__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.endorse { display: flex; flex-direction: column; gap: 24px; padding: 30px 28px 28px; min-height: 250px; background: rgba(13,18,33,0.76); border: 1px solid rgba(201,154,78,0.34); border-radius: 14px; }
.endorse__quote { font-family: var(--garamond); font-style: italic; font-size: 27px; letter-spacing: -0.01em; line-height: 1.2; color: #F2D7AD; }
.endorse__cite { font-family: var(--sans); font-weight: 600; font-size: 13px; letter-spacing: 0.1em; line-height: 1.35; color: var(--gold-deep); text-transform: uppercase; }
.authority__markers { border: 1px solid rgba(201,154,78,0.25); padding: 20px 24px; }
.authority__markers p { font-family: var(--sans); font-weight: 600; font-size: 14px; letter-spacing: 0.1em; line-height: 1.45; color: var(--bone); text-transform: uppercase; }
@media (max-width: 809.98px) {
  .authority { padding: 78px 22px; }
  .authority__heading { font-size: 38px; }
  .endorse__quote { font-size: 22px; }
}

/* ============================================================
   APPLY
   ============================================================ */
.apply { background: #080A10; }
.apply__stage { aspect-ratio: 1.55; }
.apply__causeway { position: absolute; inset: 0; background: radial-gradient(62% 88% at 82% 52%, rgba(201,154,78,0.16) 0%, rgba(8,10,16,0.82) 48%, #080A10 100%); filter: contrast(1.05); }
.apply__scrim { position: absolute; inset: 0; background: linear-gradient(96deg, rgba(8,10,16,0.95) 0%, rgba(8,10,16,0.86) 26%, rgba(8,10,16,0.56) 50%, rgba(8,10,16,0.34) 76%, rgba(8,10,16,0.3) 100%); }
.apply__row { flex-direction: row; align-items: flex-start; gap: 76px; max-width: 1180px; }
.apply__copy { flex: 1; min-width: 360px; }
.apply__criteria { display: flex; flex-direction: column; gap: 10px; max-width: 470px; }
.webuild .t-dek { color: var(--platinum); }
.apply__form { flex: 1; min-width: 340px; display: flex; flex-direction: column; gap: 14px; padding: 38px 36px 40px; background: rgba(20,26,44,0.62); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(164,166,174,0.18); }
@media (max-width: 1199.98px) { .apply__row { flex-direction: column; gap: 48px; } .apply__form { width: 100%; } }
@media (max-width: 809.98px) {
  .apply__stage { aspect-ratio: 0.45; }
  .apply__row { gap: 36px; }
  .apply__copy { min-width: 0; }
  .apply__form { min-width: 0; padding: 26px 22px 28px; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer { background: var(--void); border-top: 1px solid var(--hairline); padding: 80px 48px 54px; }
.footer__content { max-width: 1240px; margin: 0 auto; }
.footer__top { display: flex; align-items: flex-start; justify-content: space-between; }
.footer__wordmark { font-family: var(--serif); font-weight: 700; font-size: 26px; letter-spacing: -0.01em; line-height: 1.2; color: var(--bone); }
.footer__links { display: flex; gap: 34px; }
.footer__notify { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 54px; padding: 30px 34px; background: rgba(20, 26, 44, 0.5); border: 1px solid rgba(201, 154, 78, 0.25); }
.footer__notify-line { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 21px; line-height: 1.35; color: var(--cream); max-width: 420px; text-wrap: balance; }
.footer__form { display: flex; align-items: center; gap: 10px; flex: 1; max-width: 440px; }
.footer__form .field--email { flex: 1; }
.footer__form .btn { flex: none; white-space: nowrap; }
.footer__house { margin-top: 54px; }
.footer__house-label { color: var(--gold-deep); }
.footer__house-links { display: flex; flex-wrap: wrap; gap: 14px 44px; margin-top: 18px; }
.houselink { display: flex; flex-direction: column; gap: 3px; }
.houselink__role { font-family: var(--serif); font-weight: 500; font-size: 14px; letter-spacing: 0.16em; line-height: 1.3; text-transform: uppercase; color: var(--gold-deep); }
.houselink__name { font-family: var(--sans); font-weight: 500; font-size: 16px; letter-spacing: -0.01em; line-height: 1.3; color: var(--platinum); transition: color var(--quarter) var(--ease); }
@media (hover: hover) and (pointer: fine) {
  .houselink:hover .houselink__name { color: var(--gold); }
}
.footer__rule { width: 100%; height: 1px; background: var(--hairline-soft); margin-top: 54px; }
.footer__runout { margin-top: 26px; }
.footer__copyright { margin-top: 18px; }
@media (max-width: 1199.98px) { .footer { padding: 120px 40px 130px; } }
@media (max-width: 809.98px) {
  .footer { padding: 84px 22px 92px; }
  .footer__top { flex-direction: column; gap: 26px; }
  .footer__links { flex-direction: column; gap: 12px; }
}

/* ============================================================
   FIXED STATES / ACCESSIBILITY
   ============================================================ */
.apply .overlay, .crossing .overlay, .throne .overlay, .seeing .overlay, .webuild .overlay { pointer-events: none; }
.apply .overlay > *, .crossing .overlay > *, .throne .overlay > *, .seeing .overlay > *, .webuild .overlay > * { pointer-events: auto; }

a:focus-visible, button:focus-visible, .field:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

@media (max-width: 809.98px) {
  .approach__avail { font-size: 15px; letter-spacing: 0.12em; }
  .booksec__announce { font-size: 30px; }
  .footer__notify { flex-direction: column; align-items: stretch; gap: 20px; padding: 24px 20px; }
  .footer__form { flex-direction: column; align-items: stretch; max-width: none; }
  .footer__form .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-rv], [data-rv-mount] { opacity: 1; transform: none; transition: none; }
  .approach__bloom { animation: none; }
  .ticker__row { transform: none !important; }
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
