/* ============================================================
   TMS WEALTH — components.css
   Monogram motif, watermark, video, infographics, commentary, portal
   ============================================================ */

/* ---------- Monogram motif (private-client texture) ---------- */
.motif { position: relative; }
.motif > * { position: relative; z-index: 1; }
.motif::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='132' height='176' viewBox='0 0 132 176'%3E%3Cg fill='none' stroke='%2333271d' stroke-width='1'%3E%3Cellipse cx='33' cy='44' rx='17' ry='23'/%3E%3Cellipse cx='99' cy='132' rx='17' ry='23'/%3E%3C/g%3E%3Cg fill='%2333271d'%3E%3Ccircle cx='33' cy='44' r='1'/%3E%3Ccircle cx='99' cy='132' r='1'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 108px 144px;
  opacity: 0.05;
}
.motif--light::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='132' height='176' viewBox='0 0 132 176'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1'%3E%3Cellipse cx='33' cy='44' rx='17' ry='23'/%3E%3Cellipse cx='99' cy='132' rx='17' ry='23'/%3E%3C/g%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='33' cy='44' r='1'/%3E%3Ccircle cx='99' cy='132' r='1'/%3E%3C/g%3E%3C/svg%3E");
  opacity: 0.07;
}

/* ---------- Oversized watermark monogram ---------- */
.wm { position: relative; overflow: hidden; }
.wm-mark {
  position: absolute; font-family: var(--font-display); font-weight: 500;
  color: var(--ink); opacity: 0.04; line-height: 1; letter-spacing: 0.04em;
  pointer-events: none; user-select: none; white-space: nowrap; z-index: 0;
}
.wm-mark--tr { top: -0.28em; right: -0.04em; font-size: clamp(160px, 24vw, 380px); }
.wm-mark--c { top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: clamp(200px, 30vw, 520px); }
.wm--light .wm-mark { color: var(--on-deep); opacity: 0.05; }
.wm > * { position: relative; z-index: 1; }

/* ---------- Video placeholder cue ---------- */
.video-cue {
  position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 14px;
  color: #fff; font-size: 0.66rem; letter-spacing: 0.26em; text-transform: uppercase; font-weight: 500;
}
.video-cue .vc-ring {
  width: 58px; height: 58px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.7);
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  transition: background .4s ease, border-color .4s ease, transform .4s ease;
}
.video-cue .vc-ring svg { transform: translateX(1px); }
.video-cue:hover .vc-ring { background: rgba(255,255,255,0.14); transform: scale(1.06); }
.video-cue--center { top: 50%; left: 50%; transform: translate(-50%,-50%); flex-direction: column; gap: 18px; text-align: center; }
.video-cue--corner { left: 48px; bottom: 48px; }
.video-tag {
  position: absolute; z-index: 3; top: 50%; right: 40px; transform: translateY(-50%) rotate(90deg); transform-origin: right center;
  color: rgba(255,255,255,0.66); font-size: 0.58rem; letter-spacing: 0.32em; text-transform: uppercase;
}

/* ---------- Full-bleed photo / film band ---------- */
.filmband { position: relative; height: 86vh; min-height: 560px; overflow: hidden; display: flex; align-items: flex-end; }
.filmband .fb-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.filmband .fb-media img { width: 100%; height: 112%; object-fit: cover; object-position: center 30%; will-change: transform; }
.filmband::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(20,14,8,0.66), rgba(20,14,8,0.12) 50%, rgba(20,14,8,0.30)); }
.filmband .fb-content { position: relative; z-index: 2; color: #fff; padding: 0 0 8vh; width: 100%; }
.filmband .fb-quote {
  font-family: var(--font-display); font-weight: var(--disp-weight);
  font-size: clamp(1.9rem, 3.4vw, 3.1rem); line-height: 1.28; max-width: 20ch; color: #fff;
  letter-spacing: 0.005em;
}
.filmband .fb-quote em { font-style: italic; }
[data-type="sans"] .filmband .fb-quote em, [data-type="caps"] .filmband .fb-quote em { font-style: normal; }
.filmband .fb-attr { margin-top: 22px; font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase; color: rgba(255,255,255,0.82); }

/* ---------- Process infographic ---------- */
.process { margin-top: 8px; }
.process-line { display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }
.process-line::before {
  content: ""; position: absolute; top: 17px; left: 8%; right: 8%; height: 1px; background: var(--line-strong);
  transform: scaleX(0); transform-origin: left; transition: transform 1.4s cubic-bezier(.2,.7,.2,1) .2s;
}
.process.in .process-line::before { transform: scaleX(1); }
.step { text-align: center; padding: 0 16px; position: relative; opacity: 0; transform: translateY(16px); transition: opacity .9s ease, transform .9s ease; }
.process.in .step { opacity: 1; transform: none; }
.process.in .step:nth-child(2) { transition-delay: .12s; }
.process.in .step:nth-child(3) { transition-delay: .24s; }
.process.in .step:nth-child(4) { transition-delay: .36s; }
.step-node {
  width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--accent); background: var(--bg);
  display: inline-flex; align-items: center; justify-content: center; margin-bottom: 24px;
  font-family: var(--font-display); font-size: 0.92rem; color: var(--accent); position: relative; z-index: 1;
}
.who.motif .step-node, .step-node.on-alt { background: var(--bg-alt); }
.step-title { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.7rem * var(--disp-scale)); color: var(--ink); margin-bottom: 12px; letter-spacing: var(--disp-tracking); }
.step-desc { font-size: 0.92rem; color: var(--ink-soft); line-height: 1.55; max-width: 24ch; margin: 0 auto; text-wrap: balance; }

@media (max-width: 760px) {
  .process-line { grid-template-columns: 1fr 1fr; gap: 44px 0; }
  .process-line::before { display: none; }
}

/* ---------- Who grid (visual cards) ---------- */
.whocards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 8px; }
.whocard {
  background: var(--bg); padding: 38px 30px; min-height: 200px; display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
  transition: background .4s ease;
}
.whocard:hover { background: var(--bg-alt); }
.whocard .wc-idx { font-family: var(--font-display); font-size: 1rem; color: var(--accent); }
.whocard .wc-label { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.55rem * var(--disp-scale)); line-height: 1.18; color: var(--ink); letter-spacing: var(--disp-tracking); text-wrap: balance; }
.who .whocards .whocard { background: var(--bg-alt); }
.who .whocards { background: var(--line); }
.who .whocard:hover { background: var(--bg); }

@media (max-width: 860px) { .whocards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .whocards { grid-template-columns: 1fr; } }

/* ---------- Market Commentary ---------- */
.commentary { background: var(--bg-alt); transition: background .6s ease; }
.comm-grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(40px, 6vw, 88px); align-items: start; }
.comm-feature { }
.comm-feature .cf-media { overflow: hidden; margin-bottom: 28px; aspect-ratio: 16/10; }
.comm-feature .cf-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
.comm-meta { font-size: 0.68rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--accent); margin-bottom: 16px; }
.comm-feature h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2.4rem * var(--disp-scale)); line-height: 1.18; color: var(--ink); margin: 0 0 16px; letter-spacing: var(--disp-tracking); }
.comm-feature p { color: var(--ink-soft); margin: 0 0 22px; max-width: 52ch; }
.comm-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.comm-list li { padding: 22px 0; border-bottom: 1px solid var(--line); }
.comm-list a { display: block; transition: opacity .3s ease; }
.comm-list a:hover { opacity: 0.62; }
.comm-list .cl-date { font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
.comm-list .cl-title { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.4rem * var(--disp-scale)); color: var(--ink); line-height: 1.25; letter-spacing: var(--disp-tracking); }
.comm-empty { margin-top: 18px; font-size: 0.8rem; color: var(--muted); letter-spacing: 0.04em; }

@media (max-width: 860px) { .comm-grid { grid-template-columns: 1fr; } }

/* ---------- Aura logo image (brand-img) ---------- */
.brand-img { display: block; height: 21px; width: auto; }
.tms--stacked .brand-img { height: 30px; }
.tms--word .brand-img { height: 26px; }
.photo-mark .brand-img { height: 16px; }
.arc-logo .brand-img { height: 26px; }
.phil-logo .brand-img { height: 34px; margin: 0 auto; }
/* white treatment of the black logo on dark / photo surfaces */
.tms--light .brand-img, .tms--ondeep .brand-img { filter: invert(1) brightness(1.7); }
.nav.on-photo:not(.scrolled) .brand-img { filter: invert(1) brightness(1.7); }

/* ---------- Aura motion: logo reveal, hero entrance, logo sheen ---------- */
@keyframes auraWipe {
  0%   { clip-path: inset(0 100% 0 0); opacity: 0; }
  60%  { opacity: 1; }
  100% { clip-path: inset(0 0 0 0); opacity: 1; }
}
@keyframes heroRise {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: none; }
}
@keyframes auraSheen {
  from { transform: translateX(-130%) skewX(-18deg); }
  to   { transform: translateX(260%) skewX(-18deg); }
}
/* sheen overlay sits over the nav logo, masked to the logo box */
.brand-link { position: relative; overflow: hidden; }
.brand-link::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 38%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.55), transparent);
  transform: translateX(-130%) skewX(-18deg); pointer-events: none; opacity: 0;
}
.nav:not(.on-photo) .brand-link::after, .nav.scrolled .brand-link::after {
  background: linear-gradient(100deg, transparent, rgba(138,110,84,0.30), transparent);
}
.brand-link:hover::after { opacity: 1; animation: auraSheen 0.9s ease-out; }

@media (prefers-reduced-motion: no-preference) {
  .nav .brand-img { animation: auraWipe 1.2s cubic-bezier(.2,.7,.2,1) 0.25s both; }
  .hero--full .hero-content > *,
  .hero--split .hero-text > *,
  .hero--text .hero-text > * { opacity: 0; animation: heroRise 1s cubic-bezier(.2,.7,.2,1) both; }
  .hero--full .hero-content > *:nth-child(1),
  .hero--split .hero-text > *:nth-child(1),
  .hero--text .hero-text > *:nth-child(1) { animation-delay: 0.45s; }
  .hero--full .hero-content > *:nth-child(2),
  .hero--split .hero-text > *:nth-child(2),
  .hero--text .hero-text > *:nth-child(2) { animation-delay: 0.62s; }
  .hero--full .hero-content > *:nth-child(3),
  .hero--split .hero-text > *:nth-child(3),
  .hero--text .hero-text > *:nth-child(3) { animation-delay: 0.79s; }
  .hero--full .hero-content > *:nth-child(4),
  .hero--split .hero-text > *:nth-child(4),
  .hero--text .hero-text > *:nth-child(4) { animation-delay: 0.96s; }
}

/* ---------- BrokerCheck required disclosure (hero footnote) ---------- */
.hero-bc { margin: clamp(38px, 5vh, 60px) 0 0; padding-top: 22px; border-top: 1px solid rgba(255,255,255,0.26); font-family: var(--font-body); font-size: 17px; line-height: 1.5; font-weight: 300; color: rgba(255,255,255,0.9); max-width: 62ch; }
.hero-bc a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.hero-bc a:hover { opacity: 0.75; }
.hero-bc--ink { border-top-color: var(--line); color: var(--ink-soft); }
.hero-bc--ink a { color: var(--accent); }
.hero-bc--ink a:hover { color: var(--ink); }
.hero--text .hero-bc { margin-left: auto; margin-right: auto; text-align: center; }
@media (prefers-reduced-motion: no-preference) {
  .hero--full .hero-content > *:nth-child(5),
  .hero--split .hero-text > *:nth-child(5),
  .hero--text .hero-text > *:nth-child(5) { animation-delay: 1.13s; }
}
@media (max-width: 680px) { .hero-bc { font-size: 16px; margin-top: 28px; padding-top: 16px; } }
/* Mobile: BrokerCheck must remain reachable — hero shrinks so the footnote sits in view */
@media (max-width: 680px) {
  .hero--full { min-height: auto; padding-bottom: 8vh; }
  .hero--full .hero-content { padding-top: 22vh; padding-bottom: 4vh; }
  .hero-bc { max-width: 100%; }
  .nav.bc-on .bc-dock { padding: 10px 22px; }
  .bc-dock p { font-size: 15px; line-height: 1.45; }
}

/* ---------- BrokerCheck docked in header (after hero footnote scrolls past) ---------- */
.bc-dock { max-height: 0; opacity: 0; overflow: hidden; padding: 0 48px; border-top: 1px solid transparent; transition: max-height .45s ease, opacity .35s ease, padding .45s ease, border-color .45s ease; }
.nav.bc-on .bc-dock { max-height: 64px; opacity: 1; padding: 11px 48px; border-top-color: var(--line); }
.nav.bc-on .nav-dateline { max-height: 0; opacity: 0; padding-top: 0; padding-bottom: 0; overflow: hidden; border-top-color: transparent; }
.nav-dateline { max-height: 48px; overflow: hidden; transition: max-height .4s ease, opacity .3s ease, padding .4s ease, color .45s ease, border-color .45s ease; }
.bc-dock p { margin: 0 auto; max-width: 1280px; font-family: var(--font-body); font-size: 17px; line-height: 1.45; color: var(--ink); text-align: center; }
.bc-dock a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.bc-dock a:hover { color: var(--ink); }
@media (max-width: 900px) { .nav.bc-on .bc-dock { padding: 9px 22px; } .bc-dock p { font-size: 16px; text-align: left; } }

/* ---------- Footer disclosure links ---------- */
.footer-link { color: var(--on-deep); text-decoration: underline; text-underline-offset: 3px; }
.footer-link:hover { color: #fff; }
.footer-memb { margin-top: 10px; }
.footer-block2 { margin-top: 18px; }
.footer-disc p { margin: 0; }
.footer-disc p + p { margin-top: 18px; }

/* ---------- Nav additions ---------- */
[data-brand="aura"] .tms--nav .tms-letters { letter-spacing: 0.17em; }
[data-brand="aura"] .tms--stacked .tms-letters { letter-spacing: 0.26em; }
[data-brand="aura"] .photo-mark .tms-letters { letter-spacing: 0.14em; }
.nav-cta { white-space: nowrap; flex: none; padding: 12px 24px !important; font-size: 0.7rem !important; }
.nav-sep { width: 1px; height: 20px; background: currentColor; opacity: 0.22; }
.nav-access { font-variant: small-caps; }
.nav-links { gap: 30px !important; }
.nav-clock { font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); opacity: 0.78; font-variant-numeric: tabular-nums; white-space: nowrap; pointer-events: none; padding-left: 26px; border-left: 1px solid var(--line); }
.nav-left { display: flex; align-items: center; gap: 26px; }
.nav.on-photo:not(.scrolled) .nav-clock { color: #fff; opacity: 0.8; border-left-color: rgba(255,255,255,0.28); }
@media (max-width: 1240px) { .nav-clock { display: none; } }
@media (max-width: 1180px) {
  .nav-links { gap: 22px !important; }
  .nav-link { font-size: 0.74rem; }
}

/* ---------- Motif toggle ---------- */
[data-motif="off"] .motif::before,
[data-motif="off"] .wm-mark { display: none; }

/* ---------- Philosophy (trust statement) ---------- */
.philosophy { }
.phil-lead { max-width: 900px; margin: 0 auto; text-align: center; }
.phil-lead .eyebrow { justify-content: center; margin-bottom: 26px; }
.phil-statement {
  font-family: var(--font-display); font-weight: var(--disp-weight);
  font-size: calc(2.9rem * var(--disp-scale)); line-height: 1.24; letter-spacing: var(--disp-tracking);
  color: var(--ink); margin: 0 auto; max-width: 21ch; text-wrap: balance;
}
.phil-statement em { font-style: italic; color: var(--accent); }
[data-type="sans"] .phil-statement em, [data-type="caps"] .phil-statement em { font-style: normal; }
.phil-sign { margin-top: 40px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.phil-sign .sig {
  font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-weight: 500;
  font-size: 2rem; color: var(--ink); line-height: 1;
}
.phil-sign .sig-role { font-size: 0.66rem; letter-spacing: 0.26em; text-transform: uppercase; color: var(--muted); font-weight: 500; }

.phil-principles {
  margin-top: clamp(60px, 9vh, 110px); display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(32px, 4vw, 64px); border-top: 1px solid var(--line); padding-top: 48px;
}
.principle { text-align: left; }
.principle .pr-k {
  display: flex; align-items: baseline; gap: 12px;
  font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.5rem * var(--disp-scale));
  color: var(--ink); margin-bottom: 14px; letter-spacing: var(--disp-tracking);
}
.principle .pr-num { font-size: 0.72rem; letter-spacing: 0.1em; color: var(--accent); font-family: var(--font-body); font-weight: 600; }
.principle p { color: var(--ink-soft); font-size: 0.96rem; line-height: 1.6; margin: 0; max-width: 32ch; }

@media (max-width: 760px) {
  .phil-principles { grid-template-columns: 1fr; gap: 36px; }
  .principle { padding-bottom: 36px; border-bottom: 1px solid var(--line); }
  .principle:last-child { border-bottom: none; padding-bottom: 0; }
}

/* ---------- Hero crest (laurel credential) ---------- */
.hero-crest { position: absolute; z-index: 2; right: clamp(36px, 8vw, 150px); top: 50%; transform: translateY(-54%); width: clamp(180px, 17vw, 252px); color: #fff; filter: drop-shadow(0 2px 16px rgba(0,0,0,0.45)); pointer-events: none; }
@media (max-width: 1000px) { .hero-crest { display: none; } }

/* ---------- Career Arc (timeline) ---------- */
.arc-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(40px, 6vw, 100px); align-items: start; }
.arc-figure { position: relative; overflow: hidden; min-height: 600px; align-self: stretch; }
.arc-figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; will-change: transform; }
.arc-figure figcaption { position: absolute; left: 24px; bottom: 22px; color: #fff; font-size: 0.66rem; letter-spacing: 0.22em; text-transform: uppercase; text-shadow: 0 1px 12px rgba(0,0,0,0.5); }
.arc-list { position: relative; padding-left: 40px; }
.arc-list::before { content: ""; position: absolute; left: 7px; top: 16px; bottom: 16px; width: 1px; background: var(--line-strong); }
.arc-item { position: relative; padding-bottom: clamp(40px, 5.5vh, 64px); }
.arc-item:last-child { padding-bottom: 0; }
.arc-item::before { content: ""; position: absolute; left: -40px; top: 16px; width: 15px; height: 15px; border-radius: 50%; border: 1px solid var(--accent); background: var(--bg); box-sizing: border-box; }
.arc-item.big::before { background: var(--accent); }
.arc-year { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2.9rem * var(--disp-scale)); color: var(--ink); line-height: 1; letter-spacing: var(--disp-tracking); }
.arc-year .amt { color: var(--accent); }
.arc-label { font-size: 0.66rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--accent); margin: 16px 0 10px; }
.arc-logo { display: flex; align-items: baseline; gap: 11px; margin: 15px 0 11px; }
.arc-logo .al-tms { font-family: var(--font-display); font-weight: 500; font-size: 1.5rem; letter-spacing: 0.16em; color: var(--ink); }
.arc-logo .al-w { font-size: 0.64rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--accent); font-weight: 500; }
.arc-text { color: var(--ink-soft); font-size: 1.04rem; line-height: 1.62; max-width: 48ch; margin: 0; }
.arc-text .hl { color: var(--ink); }
@media (max-width: 900px) { .arc-grid { grid-template-columns: 1fr; } .arc-figure { min-height: 56vh; } }

/* ---------- Method (clarity ledger) ---------- */
.method-grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.method-head h2 { max-width: 13ch; }
.method-head .lead { margin-top: 22px; max-width: 34ch; }
.method-list { border-top: 1px solid var(--line-strong); }
.method-row { display: grid; grid-template-columns: 56px 1fr; gap: 26px; padding: 28px 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.method-num { font-family: var(--font-display); color: var(--accent); font-size: 1.2rem; }
.method-row h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.6rem * var(--disp-scale)); color: var(--ink); margin: 0 0 8px; letter-spacing: var(--disp-tracking); }
.method-row p { color: var(--ink-soft); font-size: 0.96rem; line-height: 1.55; margin: 0; max-width: 46ch; }
@media (max-width: 900px) { .method-grid { grid-template-columns: 1fr; gap: 36px; } }

/* ---------- Who ledger (editorial index) ---------- */
.who-ledger { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(48px, 6vw, 96px); border-top: 1px solid var(--line-strong); }
.wl-row { display: grid; grid-template-columns: 44px 1fr; grid-template-areas: "idx label" "gap desc"; column-gap: 18px; row-gap: 10px; padding: 30px 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.wl-idx { grid-area: idx; font-family: var(--font-display); color: var(--accent); font-size: 1.05rem; }
.wl-label { grid-area: label; font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.55rem * var(--disp-scale)); color: var(--ink); line-height: 1.14; letter-spacing: var(--disp-tracking); }
.wl-desc { grid-area: desc; font-size: 0.92rem; color: var(--ink-soft); line-height: 1.55; max-width: 40ch; }
@media (max-width: 760px) { .who-ledger { grid-template-columns: 1fr; } }

/* ---------- Hero Markets panel ---------- */
.mkt { position: absolute; z-index: 2; right: clamp(30px, 6vw, 104px); top: 50%; transform: translateY(-50%); width: clamp(280px, 26vw, 344px); background: rgba(22,16,10,0.44); backdrop-filter: blur(16px) saturate(1.1); -webkit-backdrop-filter: blur(16px) saturate(1.1); border: 1px solid rgba(255,255,255,0.16); color: #EDE4D7; padding: 22px 22px 16px; }
.mkt-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,0.14); margin-bottom: 4px; }
.mkt-title { font-size: 0.6rem; letter-spacing: 0.28em; text-transform: uppercase; display: flex; align-items: center; gap: 9px; }
.mkt-live { width: 6px; height: 6px; border-radius: 50%; background: #84BE97; animation: mktpulse 2.6s infinite; flex: none; }
@keyframes mktpulse { 0% { box-shadow: 0 0 0 0 rgba(132,190,151,0.55); } 70% { box-shadow: 0 0 0 7px rgba(132,190,151,0); } 100% { box-shadow: 0 0 0 0 rgba(132,190,151,0); } }
.mkt-date { font-size: 0.6rem; letter-spacing: 0.06em; color: rgba(255,255,255,0.6); }
.mkt-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: baseline; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,0.07); font-variant-numeric: tabular-nums; }
.mkt-row:last-of-type { border-bottom: none; }
.mkt-name { font-size: 0.72rem; letter-spacing: 0.02em; color: rgba(237,228,215,0.9); }
.mkt-val { font-size: 0.76rem; text-align: right; color: #fff; }
.mkt-chg { font-size: 0.66rem; text-align: right; min-width: 56px; }
.mkt-chg.up { color: #8FCB9B; }
.mkt-chg.down { color: #DC9A85; }
.mkt-foot { margin-top: 12px; font-size: 0.54rem; letter-spacing: 0.08em; color: rgba(255,255,255,0.42); text-transform: uppercase; }
@media (max-width: 1080px) { .mkt { display: none; } }

/* ---------- Services (editorial product cards) ---------- */
.svc2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 8px; }
.svc2-card { background: var(--bg); padding: clamp(32px, 3vw, 50px); display: flex; flex-direction: column; gap: 20px; transition: background .4s ease; }
.svc2-card:hover { background: var(--bg-alt); }
.svc2-top { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.svc2-idx { font-family: var(--font-display); font-size: calc(2.3rem * var(--disp-scale)); color: var(--accent); line-height: 1; }
.svc2-tag { font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); text-align: right; }
.svc2-card h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.95rem * var(--disp-scale)); color: var(--ink); margin: 0; letter-spacing: var(--disp-tracking); line-height: 1.1; }
.svc2-desc { color: var(--ink-soft); font-size: 0.98rem; line-height: 1.55; margin: 0; }
.svc2-meta { margin-top: auto; border-top: 1px solid var(--line); }
.svc2-meta .m-row { display: grid; grid-template-columns: auto 1fr; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.svc2-meta .m-row:last-child { border-bottom: none; }
.svc2-meta .m-k { color: var(--muted); letter-spacing: 0.14em; text-transform: uppercase; font-size: 0.6rem; }
.svc2-meta .m-v { color: var(--ink-soft); text-align: right; font-size: 0.82rem; }
@media (max-width: 760px) { .svc2 { grid-template-columns: 1fr; } }

/* ---------- Commentary (premium) ---------- */
.comm-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; border-bottom: 1px solid var(--line-strong); padding-bottom: 20px; margin-bottom: 44px; flex-wrap: wrap; }
.comm-ticker { display: flex; gap: 24px; flex-wrap: wrap; font-variant-numeric: tabular-nums; }
.comm-ticker .t-item { font-size: 0.72rem; letter-spacing: 0.02em; color: var(--ink-soft); display: flex; gap: 7px; align-items: baseline; }
.comm-ticker .t-item b { font-weight: 600; color: var(--ink); }
.comm-ticker .up { color: #3F7D54; }
.comm-ticker .down { color: #B0654E; }
.comm-tag { display: inline-block; font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); border: 1px solid var(--line-strong); padding: 6px 13px; border-radius: 999px; margin-bottom: 20px; }
.comm-feature h3 { font-size: calc(2.7rem * var(--disp-scale)); line-height: 1.12; }
.comm-byline { display: flex; gap: 12px; align-items: center; font-size: 0.68rem; letter-spacing: 0.08em; color: var(--muted); text-transform: uppercase; margin: 0 0 26px; }
.comm-byline .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--muted); }
.comm-side { display: flex; flex-direction: column; gap: 32px; }
.side-panel { border: 1px solid var(--line); padding: 24px; }
.side-panel h4 { font-size: 0.62rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--muted); margin: 0 0 16px; display: flex; align-items: center; justify-content: space-between; }
.side-mkt-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line); font-variant-numeric: tabular-nums; font-size: 0.78rem; align-items: baseline; }
.side-mkt-row:last-child { border-bottom: none; }
.side-mkt-row .n { color: var(--ink-soft); font-size: 0.74rem; }
.side-mkt-row .v { text-align: right; color: var(--ink); }
.side-mkt-row .c { text-align: right; min-width: 50px; font-size: 0.7rem; }
.side-mkt-row .c.up { color: #3F7D54; }
.side-mkt-row .c.down { color: #B0654E; }
.side-sub label { display: block; font-size: 0.78rem; color: var(--ink-soft); margin-bottom: 12px; line-height: 1.5; }
.side-sub .sub-row { display: flex; border-bottom: 1px solid var(--line-strong); }
.side-sub input { flex: 1; border: none; background: transparent; font-family: var(--font-body); font-size: 0.9rem; padding: 8px 0; outline: none; color: var(--ink); }
.side-sub button { border: none; background: none; cursor: pointer; font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); }
@media (max-width: 860px) { .comm-side { flex-direction: row; flex-wrap: wrap; } .comm-side > * { flex: 1; min-width: 240px; } }

/* ---------- Article page ---------- */
.art { max-width: 1180px; margin: 0 auto; padding: 116px 48px 96px; }
.art-back { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); display: inline-flex; gap: 8px; margin-bottom: 56px; }
.art-back:hover { color: var(--ink); }
.art-head { max-width: 840px; margin: 0 auto; text-align: center; }
.art-tag { display: inline-block; font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--accent); border: 1px solid var(--line-strong); padding: 6px 14px; border-radius: 999px; margin-bottom: 26px; }
.art-title { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: clamp(2.6rem, 5vw, 4.2rem); line-height: 1.08; color: var(--ink); margin: 0; letter-spacing: var(--disp-tracking); text-wrap: balance; }
.art-dek { font-size: 1.3rem; line-height: 1.55; color: var(--ink-soft); font-weight: 300; margin: 26px auto 0; max-width: 60ch; text-wrap: pretty; }
.art-byline { display: flex; gap: 14px; align-items: center; justify-content: center; font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-top: 32px; }
.art-byline .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--muted); }
.art-hero { margin-top: 52px; aspect-ratio: 16/9; overflow: hidden; }
.art-hero img { width: 100%; height: 100%; object-fit: cover; object-position: center 15%; }
.art-body { display: grid; grid-template-columns: minmax(0,1fr) 320px; gap: clamp(40px, 5vw, 72px); max-width: 1080px; margin: clamp(48px,7vh,80px) auto 0; align-items: start; }
.art-main { max-width: 700px; }
.art-main > p { font-size: 1.14rem; line-height: 1.82; color: var(--ink); margin: 0 0 1.4em; }
.art-main > p.dropcap::first-letter { font-family: var(--font-display); font-weight: 500; float: left; font-size: 4.6rem; line-height: 0.78; padding: 6px 14px 0 0; color: var(--accent); }
.art-h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2rem * var(--disp-scale)); color: var(--ink); margin: 1.7em 0 0.5em; letter-spacing: var(--disp-tracking); }
.pullquote { margin: 1.8em 0; padding: 4px 0 4px 28px; border-left: 2px solid var(--accent); }
.pullquote p { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.95rem * var(--disp-scale)); line-height: 1.3; color: var(--ink); margin: 0; letter-spacing: var(--disp-tracking); }
.callout-stat { background: var(--bg-alt); padding: 30px 32px; margin: 1.8em 0; display: flex; align-items: baseline; gap: 22px; }
.callout-stat .cs-num { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(3.4rem * var(--disp-scale)); color: var(--accent); line-height: 1; }
.callout-stat .cs-txt { color: var(--ink-soft); font-size: 0.96rem; line-height: 1.5; }
.art-side { position: sticky; top: 104px; display: flex; flex-direction: column; gap: 26px; }
.art-side .side-cap { font-size: 0.62rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--muted); margin: 0 0 14px; }
.art-chart { display: flex; align-items: flex-end; gap: 7px; height: 92px; margin-top: 6px; }
.art-chart .bar { flex: 1; background: var(--accent); opacity: 0.32; transition: opacity .3s; }
.art-chart .bar.hi { opacity: 0.85; }
.art-side .src { font-size: 0.62rem; color: var(--muted); margin-top: 12px; letter-spacing: 0.04em; }
@media (max-width: 900px) { .art-body { grid-template-columns: 1fr; } .art-side { position: static; flex-direction: row; flex-wrap: wrap; } .art-side > * { flex: 1; min-width: 240px; } .art { padding: 96px 24px 72px; } }

/* ---------- Hero Private Access login ---------- */
.hero-login { position: absolute; z-index: 2; right: clamp(30px, 6vw, 104px); top: 50%; transform: translateY(-50%); width: clamp(300px, 26vw, 350px); background: rgba(22,16,10,0.50); backdrop-filter: blur(16px) saturate(1.1); -webkit-backdrop-filter: blur(16px) saturate(1.1); border: 1px solid rgba(255,255,255,0.18); color: #EDE4D7; padding: 26px 24px; }
.hl-head { display: flex; align-items: center; gap: 10px; font-size: 0.62rem; letter-spacing: 0.28em; text-transform: uppercase; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,0.14); margin-bottom: 18px; }
.hl-head svg { opacity: 0.85; }
.hl-sub { font-size: 0.8rem; color: rgba(237,228,215,0.72); margin: 0 0 18px; line-height: 1.55; font-weight: 300; }
.hl-form { display: grid; gap: 12px; }
.hl-form input { font-family: var(--font-body); font-size: 0.88rem; color: #fff; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.18); padding: 12px 14px; outline: none; transition: border-color .3s ease; }
.hl-form input::placeholder { color: rgba(255,255,255,0.42); }
.hl-form input:focus { border-color: rgba(255,255,255,0.6); }
.hl-btn { margin-top: 4px; background: #EDE4D7; color: #2A2018; border: none; padding: 13px; font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500; cursor: pointer; transition: background .3s ease; }
.hl-btn:hover { background: #fff; }
.hl-foot { display: flex; justify-content: space-between; gap: 12px; margin-top: 16px; font-size: 0.68rem; }
.hl-foot a { color: rgba(237,228,215,0.82); border-bottom: 1px solid transparent; padding-bottom: 2px; }
.hl-foot a:hover { border-color: rgba(237,228,215,0.5); }
.hl-ok { font-family: var(--font-display); font-size: 1.25rem; line-height: 1.4; color: #fff; margin: 10px 0; }
@media (max-width: 1080px) { .hero-login { display: none; } }

/* ---------- Markets ticker band ---------- */
.ticker { background: var(--bg-deep); color: var(--on-deep); display: flex; align-items: stretch; overflow: hidden; border-top: 1px solid rgba(255,255,255,0.08); transition: background .6s ease; }
.ticker-label { display: flex; align-items: center; gap: 9px; padding: 0 28px; font-size: 0.62rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--on-deep); background: rgba(255,255,255,0.04); border-right: 1px solid rgba(255,255,255,0.1); white-space: nowrap; flex: none; z-index: 2; }
.ticker-mask { overflow: hidden; flex: 1; }
.ticker-track { display: inline-flex; white-space: nowrap; animation: tickmove 46s linear infinite; width: max-content; }
.ticker:hover .ticker-track { animation-play-state: paused; }
.tk-item { display: inline-flex; align-items: baseline; gap: 12px; padding: 16px 32px; border-right: 1px solid rgba(255,255,255,0.08); font-variant-numeric: tabular-nums; }
.tk-name { font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--on-deep-soft); }
.tk-val { font-size: 0.82rem; color: #fff; }
.tk-chg { font-size: 0.72rem; }
.tk-chg.up { color: #8FCB9B; }
.tk-chg.down { color: #DC9A85; }
@keyframes tickmove { from { transform: translateX(0); } to { transform: translateX(-33.333%); } }
@media (prefers-reduced-motion: reduce) { .ticker-track { animation: none; } }
@media (max-width: 680px) { .ticker-label { padding: 0 16px; } .tk-item { padding: 14px 22px; } }

/* ---------- Method: animated path infographic ---------- */
.method-head { max-width: 660px; margin: 0 auto clamp(56px, 8vh, 96px); text-align: center; }
.method-head .eyebrow { justify-content: center; }
.method-head h2 { margin: 18px auto 0; max-width: 16ch; }
.method-head .lead { margin: 22px auto 0; max-width: 44ch; }
.mpath { position: relative; }
.mpath-line { position: absolute; top: 34px; left: 12.5%; right: 12.5%; height: 1px; background: var(--line-strong); }
.mpath-line::after { content: ""; position: absolute; inset: 0; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform 2s cubic-bezier(.4,0,.2,1) .2s; }
.mpath.in .mpath-line::after { transform: scaleX(1); }
.mpath-grid { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.mstep { text-align: center; padding: 0 16px; opacity: 0; transform: translateY(20px); transition: opacity .8s ease, transform .8s ease; }
.mpath.in .mstep { opacity: 1; transform: none; }
.mpath.in .mstep:nth-child(2) { transition-delay: .5s; }
.mpath.in .mstep:nth-child(3) { transition-delay: 1s; }
.mpath.in .mstep:nth-child(4) { transition-delay: 1.5s; }
.mnode { width: 68px; height: 68px; border-radius: 50%; border: 1px solid var(--accent); background: var(--bg); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 1.5rem; color: var(--accent); margin: 0 auto 30px; position: relative; z-index: 1; }
.mpath.in .mstep:nth-child(1) .mnode { animation: fillnode .55s ease .4s forwards; }
.mpath.in .mstep:nth-child(2) .mnode { animation: fillnode .55s ease .9s forwards; }
.mpath.in .mstep:nth-child(3) .mnode { animation: fillnode .55s ease 1.4s forwards; }
.mpath.in .mstep:nth-child(4) .mnode { animation: fillnode .55s ease 1.9s forwards; }
@keyframes fillnode { to { background: var(--accent); color: #fff; } }
.mstep h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.55rem * var(--disp-scale)); color: var(--ink); margin: 0 0 12px; letter-spacing: var(--disp-tracking); }
.mstep p { color: var(--ink-soft); font-size: 0.92rem; line-height: 1.55; margin: 0 auto; max-width: 24ch; }
@media (max-width: 760px) { .mpath-grid { grid-template-columns: 1fr 1fr; gap: 52px 20px; } .mpath-line { display: none; } }
@media (prefers-reduced-motion: reduce) { .mpath-line::after, .mpath .mnode { animation: none !important; transition: none !important; } .mpath.in .mpath-line::after { transform: scaleX(1); } }

/* ---------- Who: typographic manifesto ---------- */
.who-manifesto { display: grid; grid-template-columns: 1.18fr 0.82fr; gap: clamp(48px, 6vw, 100px); align-items: center; }
.wm-text .eyebrow { margin-bottom: 30px; }
.wm-statement { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2.15rem * var(--disp-scale)); line-height: 1.36; color: var(--muted); letter-spacing: var(--disp-tracking); margin: 0; text-wrap: pretty; }
.wm-statement .em { color: var(--ink); font-style: italic; }
[data-type="sans"] .wm-statement .em, [data-type="caps"] .wm-statement .em { font-style: normal; color: var(--accent); }
.wm-figure { position: relative; overflow: hidden; min-height: 540px; align-self: stretch; }
.wm-figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; will-change: transform; }
@media (max-width: 860px) { .who-manifesto { grid-template-columns: 1fr; } .wm-figure { min-height: 52vh; order: -1; } }

/* ---------- Services: accordion ---------- */
.svc-acc { border-top: 1px solid var(--line-strong); margin-top: 8px; }
.svc-item { border-bottom: 1px solid var(--line); }
.svc-btn { width: 100%; display: grid; grid-template-columns: 56px 1fr auto; gap: 28px; align-items: center; padding: clamp(26px,3.4vh,38px) 0; cursor: pointer; text-align: left; background: none; border: none; }
.svc-num { font-family: var(--font-display); font-size: calc(1.4rem * var(--disp-scale)); color: var(--accent); }
.svc-h { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2.1rem * var(--disp-scale)); color: var(--ink); letter-spacing: var(--disp-tracking); transition: color .3s ease; line-height: 1.05; }
.svc-item.open .svc-h, .svc-btn:hover .svc-h { color: var(--accent); }
.svc-tag2 { font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); margin-right: 22px; }
.svc-plus { width: 20px; height: 20px; position: relative; flex: none; }
.svc-plus::before, .svc-plus::after { content: ""; position: absolute; background: var(--ink-soft); transition: transform .4s ease, background .3s; }
.svc-plus::before { top: 50%; left: 0; right: 0; height: 1px; transform: translateY(-50%); }
.svc-plus::after { left: 50%; top: 0; bottom: 0; width: 1px; transform: translateX(-50%); }
.svc-item.open .svc-plus::after { transform: translateX(-50%) scaleY(0); }
.svc-panel { overflow: hidden; max-height: 0; opacity: 0; transition: max-height .55s cubic-bezier(.4,0,.2,1), opacity .4s ease; }
.svc-item.open .svc-panel { max-height: 280px; opacity: 1; }
.svc-panel-inner { padding: 0 0 36px 84px; display: grid; grid-template-columns: 1.2fr auto; gap: clamp(32px,5vw,72px); align-items: start; }
.svc-panel-inner p { color: var(--ink-soft); font-size: 1.08rem; line-height: 1.65; margin: 0; max-width: 52ch; }
.svc-meta2 { display: grid; gap: 14px; min-width: 200px; }
.svc-meta2 .mm { display: flex; justify-content: space-between; gap: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.svc-meta2 .mm .k { font-size: 0.6rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.svc-meta2 .mm .v { color: var(--ink); font-size: 0.84rem; }
@media (max-width: 680px) { .svc-btn { grid-template-columns: 40px 1fr auto; gap: 16px; } .svc-tag2 { display: none; } .svc-panel-inner { grid-template-columns: 1fr; padding-left: 56px; } .svc-item.open .svc-panel { max-height: 460px; } }

/* ---------- Hero CTA sizing ---------- */
.hero-actions .btn { padding: 14px 30px; font-size: 0.72rem; white-space: nowrap; }

/* ---------- Services heading one line ---------- */
#services .sec-head h2 { max-width: none; white-space: nowrap; }
#commentary .sec-head h2 { max-width: none; white-space: nowrap; }
@media (max-width: 640px) { #services .sec-head h2, #commentary .sec-head h2 { white-space: normal; } }

/* ---------- Hero login brand + clock ---------- */
.hl-brand { display: flex; align-items: center; gap: 12px; padding-bottom: 15px; border-bottom: 1px solid rgba(255,255,255,0.14); }
.hl-brand .tms-mono { color: #EDE4D7; }
.hl-brandtxt { font-size: 0.62rem; letter-spacing: 0.28em; text-transform: uppercase; }
.hl-clock { font-size: 0.58rem; letter-spacing: 0.13em; text-transform: uppercase; color: rgba(255,255,255,0.56); margin: 14px 0 16px; font-variant-numeric: tabular-nums; }

/* ---------- Philosophy (redesigned) ---------- */
.philosophy { text-align: center; }
.philosophy .phil-mono { display: flex; justify-content: center; margin-bottom: 26px; color: var(--accent); }
.phil-statement2 { margin: 0 auto; max-width: 20ch; }
.phil-lead-line { display: block; font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.7rem * var(--disp-scale)); line-height: 1.3; color: var(--muted); letter-spacing: var(--disp-tracking); }
.phil-clarity { display: block; font-family: var(--font-display); font-weight: var(--disp-weight); font-size: clamp(4.2rem, 11vw, 8rem); line-height: 0.95; color: var(--accent); letter-spacing: 0.01em; margin-top: 0.08em; }
[data-type="sans"] .phil-clarity { font-weight: 300; }
.phil-underline { display: block; width: 0; height: 2px; background: var(--accent); margin: 26px auto 0; transition: width 1.3s cubic-bezier(.2,.7,.2,1) .3s; }
.philosophy.in .phil-underline { width: 110px; }
.phil-horizon { margin: 34px auto 0; font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.55rem * var(--disp-scale)); color: var(--ink); letter-spacing: var(--disp-tracking); }
.phil-horizon .em { font-style: italic; color: var(--ink); }
[data-type="sans"] .phil-horizon .em, [data-type="caps"] .phil-horizon .em { font-style: normal; color: var(--accent); }
.phil-horizon .strike { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 1px; }

/* ---------- Who: orbit graphic ---------- */
.who-head { text-align: center; max-width: 640px; margin: 0 auto clamp(40px, 6vh, 70px); }
.who-head .eyebrow { justify-content: center; margin-bottom: 18px; }
.who-head .who-line { color: var(--ink-soft); margin-top: 18px; font-weight: 300; }
.orbit { position: relative; width: min(660px, 94%); margin: 0 auto; aspect-ratio: 1 / 0.82; }
.orbit-svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.orbit-line { stroke: var(--line-strong); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; pathLength: 1; transition: stroke-dashoffset 1.1s ease .15s; }
.orbit.in .orbit-line { stroke-dashoffset: 0; }
.orbit-core { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.orbit-core .tms-mono { color: var(--accent); margin: 0 auto; }
.orbit-core .oc-label { font-size: 0.58rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--muted); margin-top: 12px; }
.orbit-node { position: absolute; transform: translate(-50%, -50%); text-align: center; width: 160px; opacity: 0; transition: opacity .7s ease, transform .7s ease; }
.orbit.in .orbit-node { opacity: 1; }
.orbit-node .on-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); margin: 0 auto 12px; }
.orbit-node .on-label { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.25rem * var(--disp-scale)); color: var(--ink); line-height: 1.16; letter-spacing: var(--disp-tracking); }
.who-fallback { display: none; }
@media (max-width: 700px) {
  .orbit { display: none; }
  .who-fallback { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 10px; max-width: 420px; margin: 0 auto; }
  .who-fallback span { font-family: var(--font-display); font-size: 1.15rem; color: var(--ink); padding: 8px 16px; border: 1px solid var(--line); border-radius: 999px; }
}

/* ---------- Private Access page clock ---------- */
.pa-clock { font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.7); margin-top: 10px; font-variant-numeric: tabular-nums; }

/* ---------- Philosophy (dark statement band) ---------- */
.philosophy-dark { background: var(--bg-deep); color: var(--on-deep); text-align: center; transition: background .6s ease; }
.phil-logo { display: flex; justify-content: center; margin-bottom: 36px; }
.phil-logo .tms--stacked .tms-letters { font-size: 2.3rem; }
.phil-logo .tms--stacked .tms-rule { width: 84px; }
.philosophy-dark .eyebrow { justify-content: center; color: var(--on-deep-soft); margin-bottom: 30px; }
.phil-quote { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2.9rem * var(--disp-scale)); line-height: 1.22; color: var(--on-deep); max-width: 19ch; margin: 0 auto; letter-spacing: var(--disp-tracking); text-wrap: balance; }
.phil-quote em { font-style: italic; color: #fff; }
[data-type="sans"] .phil-quote em, [data-type="caps"] .phil-quote em { font-style: normal; }
.phil-quote2 { font-family: var(--font-display); font-style: italic; font-size: calc(1.5rem * var(--disp-scale)); color: var(--on-deep-soft); margin: 22px auto 0; }
[data-type="sans"] .phil-quote2, [data-type="caps"] .phil-quote2 { font-style: normal; }
.phil-rule { display: block; width: 0; height: 1px; background: var(--on-deep-soft); margin: 40px auto 0; transition: width 1.3s cubic-bezier(.2,.7,.2,1) .9s; }
.philosophy-dark.in .phil-rule { width: 92px; }

/* Philosophy entrance — logo wipe, then staggered rise */
@media (prefers-reduced-motion: no-preference) {
  .philosophy-dark.in .phil-logo .brand-img { animation: auraWipe 1.15s cubic-bezier(.2,.7,.2,1) .1s both; }
  .philosophy-dark .eyebrow,
  .philosophy-dark .phil-quote,
  .philosophy-dark .phil-quote2,
  .philosophy-dark .phil-sign-dark {
    opacity: 0; transform: translateY(20px);
    transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);
  }
  .philosophy-dark.in .eyebrow { opacity: 1; transform: none; transition-delay: .3s; }
  .philosophy-dark.in .phil-quote { opacity: 1; transform: none; transition-delay: .46s; }
  .philosophy-dark.in .phil-quote2 { opacity: 1; transform: none; transition-delay: .68s; }
  .philosophy-dark.in .phil-sign-dark { opacity: 1; transform: none; transition-delay: 1.05s; }
}
.phil-sign-dark { margin-top: 34px; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.phil-sign-dark .sig-name { font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-weight: 500; font-size: 1.85rem; color: var(--on-deep); }
.phil-sign-dark .sig-r { font-size: 0.64rem; letter-spacing: 0.26em; text-transform: uppercase; color: var(--on-deep-soft); }

/* ---------- Photo logo mark (watermark on images) ---------- */
.photo-mark { position: absolute; z-index: 3; left: 24px; top: 22px; filter: drop-shadow(0 1px 10px rgba(0,0,0,0.5)); pointer-events: none; }
/* Photo watermark: scale the WHOLE lockup down together. Both halves of the nav lockup
   (.tms-letters "TMS" and .tms-full "WEALTH") must be set, or WEALTH keeps the full nav size
   and dwarfs TMS. The bar is 0.88rem to hold the nav's own bar-to-text ratio at this size. */
.photo-mark .tms-letters,
.photo-mark .tms-full { font-size: 1.12rem; }
.photo-mark .tms-bar { height: 0.88rem; }
/* legacy stacked-lockup children, inert for the nav lockup used by the watermark */
.photo-mark .tms-divider { height: 22px; }
.photo-mark .tms-sub { font-size: 0.5rem; }
.cf-media { position: relative; }
.art-hero { position: relative; }

/* ---------- Contact with photo ---------- */
.contact .contact-grid { grid-template-columns: 0.82fr 1.18fr; align-items: stretch; }
.contact-figure { position: relative; overflow: hidden; min-height: 540px; align-self: stretch; }
.contact-figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; }
.contact-body .contact-direct { margin-top: 40px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.14); }
.contact-body .form { margin-top: 36px; }
@media (max-width: 860px) { .contact .contact-grid { grid-template-columns: 1fr; } .contact-figure { min-height: 48vh; order: -1; } }

/* ---------- Private Access (login) ---------- */
.pa { min-height: 100vh; display: grid; grid-template-columns: 1.05fr 0.95fr; background: var(--bg); }
.pa-media { position: relative; overflow: hidden; }
.pa-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.pa-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(20,14,8,0.42), rgba(20,14,8,0.14)); }
.pa-media .pa-brand { position: absolute; z-index: 2; left: 48px; top: 44px; }
.pa-media .pa-line { position: absolute; z-index: 2; left: 48px; bottom: 56px; right: 48px; color: #fff; font-family: var(--font-display); font-weight: var(--disp-weight); font-size: clamp(1.7rem, 2.6vw, 2.6rem); line-height: 1.3; max-width: 16ch; }
.pa-panel { display: flex; flex-direction: column; justify-content: center; padding: 6vh clamp(36px, 7vw, 96px); position: relative; }
.pa-top { position: absolute; top: 36px; right: clamp(36px,7vw,96px); }
.pa-top a { font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-soft); border-bottom: 1px solid var(--line-strong); padding-bottom: 3px; }
.pa-panel .eyebrow { margin-bottom: 22px; }
.pa-panel h1 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: clamp(2.6rem, 4vw, 3.6rem); color: var(--ink); margin: 0 0 14px; line-height: 1.06; letter-spacing: var(--disp-tracking); }
.pa-panel .pa-sub { color: var(--ink-soft); font-weight: 300; margin: 0 0 40px; max-width: 38ch; }
.pa-form { display: grid; gap: 24px; max-width: 420px; }
.pa-field { display: grid; gap: 9px; }
.pa-field label { font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
.pa-field input { font-family: var(--font-body); font-size: 1rem; color: var(--ink); background: transparent; border: none; border-bottom: 1px solid var(--line-strong); padding: 11px 0; outline: none; transition: border-color .35s ease; }
.pa-field input:focus { border-color: var(--ink); }
.pa-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 0.82rem; }
.pa-row a { color: var(--ink-soft); border-bottom: 1px solid transparent; }
.pa-row a:hover { border-color: var(--line-strong); }
.pa-remember { display: inline-flex; align-items: center; gap: 9px; color: var(--ink-soft); cursor: pointer; }
.pa-remember input { accent-color: var(--accent); }
.pa-submit { margin-top: 6px; }
.pa-note { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); font-size: 0.86rem; color: var(--ink-soft); }
.pa-note a { color: var(--ink); border-bottom: 1px solid var(--accent); padding-bottom: 2px; }
.pa-disc { margin-top: 26px; font-size: 0.7rem; line-height: 1.6; color: var(--muted); max-width: 48ch; }

@media (max-width: 860px) {
  .pa { grid-template-columns: 1fr; }
  .pa-media { min-height: 38vh; }
}

/* ============================================================
   PRINT — clean PDF export for compliance
   ============================================================ */
@media print {
  .reveal, .img-reveal, .img-reveal img { opacity: 1 !important; transform: none !important; }
  .nav, .snav { position: absolute !important; background: var(--bg) !important; backdrop-filter: none !important; box-shadow: none !important; }
  .hero-login, .twk-panel, .tweaks-fab, .ticker, [data-tweaks-fab], .nav-burger { display: none !important; }
  .hero--full { min-height: 80vh !important; }
  .filmband { height: auto !important; min-height: 70vh !important; }
  section, .wi-card, .wi-step, .svc-item, .wi-prompt, .arc-item { break-inside: avoid; }
  .philosophy-dark, .contact, .wi-convo, .footer { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  a { text-decoration: none !important; }
}

/* ============================================================
   NAV — fit longer item set
   ============================================================ */
.nav-links { gap: 26px !important; }
@media (max-width: 1240px) { .nav-links { gap: 20px !important; } .nav-link { font-size: 0.72rem; } }
@media (max-width: 1080px) { .nav-link { font-size: 0.68rem; letter-spacing: 0.1em; } .nav-links { gap: 16px !important; } }

/* ============================================================
   WOMEN & INVESTING — homepage teaser band
   ============================================================ */
.wi-teaser { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; background: var(--bg-alt); transition: background .6s ease; }
.wi-teaser-media { position: relative; overflow: hidden; min-height: 600px; }
.wi-teaser-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; will-change: transform; }
.wi-teaser-body { display: flex; flex-direction: column; justify-content: center; padding: clamp(56px, 8vh, 120px) clamp(40px, 6vw, 104px); }
.wi-teaser-body .eyebrow { margin-bottom: 24px; }
.wi-teaser-body h2 { max-width: 16ch; }
.wi-teaser-lead { color: var(--ink-soft); font-size: 1.14rem; line-height: 1.6; font-weight: 300; margin: 24px 0 38px; max-width: 46ch; }
@media (max-width: 860px) {
  .wi-teaser { grid-template-columns: 1fr; }
  .wi-teaser-media { min-height: 56vh; order: -1; }
}

/* ============================================================
   WOMEN & INVESTING — dedicated page
   ============================================================ */
.wi-hero { min-height: 78vh; display: grid; grid-template-columns: 1.05fr 0.95fr; align-items: stretch; padding-top: 108px; }
.wi-hero-text { display: flex; flex-direction: column; justify-content: center; padding: 8vh 5vw 8vh 0; padding-left: max(48px, calc((100vw - 1280px)/2 + 48px)); }
.wi-hero-text h1 { max-width: 13ch; margin-top: 18px; }
.wi-hero-sub { font-size: 1.26rem; font-weight: 300; line-height: 1.6; color: var(--ink-soft); margin-top: 28px; max-width: 44ch; }
.wi-hero-actions { margin-top: 40px; display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.wi-hero-media { position: relative; overflow: hidden; }
.wi-hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; }
@media (max-width: 900px) {
  .wi-hero { grid-template-columns: 1fr; }
  .wi-hero-text { padding: 14vh 36px 7vh; }
  .wi-hero-media { min-height: 56vh; }
}

/* Intro manifesto */
.wi-intro { text-align: center; }
.wi-intro .wrap-narrow { }
.wi-intro .eyebrow { justify-content: center; margin-bottom: 26px; }
.wi-statement { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(2.5rem * var(--disp-scale)); line-height: 1.3; color: var(--ink); letter-spacing: var(--disp-tracking); margin: 0 auto; max-width: 22ch; text-wrap: balance; }
.wi-statement em { font-style: italic; color: var(--accent); }
[data-type="sans"] .wi-statement em, [data-type="caps"] .wi-statement em { font-style: normal; }
.wi-intro-note { margin: 30px auto 0; color: var(--ink-soft); font-size: 1.12rem; line-height: 1.65; font-weight: 300; max-width: 54ch; }

/* Start-here path (numbered) */
.wi-start { background: var(--bg-alt); transition: background .6s ease; }
.wi-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 8px; }
.wi-step { background: var(--bg-alt); padding: 40px 30px; display: flex; flex-direction: column; gap: 18px; min-height: 240px; }
.wi-step .ws-num { font-family: var(--font-display); font-size: 1rem; color: var(--accent); letter-spacing: 0.1em; }
.wi-step h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.5rem * var(--disp-scale)); color: var(--ink); margin: 0; letter-spacing: var(--disp-tracking); line-height: 1.15; }
.wi-step p { color: var(--ink-soft); font-size: 0.95rem; line-height: 1.6; margin: 0; }
@media (max-width: 900px) { .wi-steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .wi-steps { grid-template-columns: 1fr; } }

/* Resource library cards */
.wi-lib-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 8px; }
.wi-card { background: var(--bg); padding: 38px 34px; display: flex; flex-direction: column; gap: 16px; min-height: 260px; transition: background .4s ease; }
.wi-card:hover { background: var(--bg-alt); }
.wi-card-top { display: flex; align-items: center; justify-content: space-between; }
.wi-kind { font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); }
.wi-soon { font-size: 0.58rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--line-strong); border-radius: 999px; padding: 4px 11px; }
.wi-card h3 { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.7rem * var(--disp-scale)); color: var(--ink); margin: 0; line-height: 1.2; letter-spacing: var(--disp-tracking); }
.wi-card p { color: var(--ink-soft); font-size: 0.95rem; line-height: 1.6; margin: 0; }
.wi-card .wi-read { margin-top: auto; font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-soft); display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 900px) { .wi-lib-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .wi-lib-grid { grid-template-columns: 1fr; } }

/* Conversation starters */
.wi-convo { background: var(--bg-deep); color: var(--on-deep); transition: background .6s ease; }
.wi-convo .eyebrow { color: var(--on-deep-soft); }
.wi-convo .eyebrow::before { background: var(--on-deep-soft); }
.wi-convo h2.display { color: var(--on-deep); }
.wi-convo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 48px; }
.wi-prompt { border: 1px solid rgba(255,255,255,0.16); padding: 34px 32px; display: flex; gap: 20px; align-items: flex-start; transition: background .4s ease; }
.wi-prompt:hover { background: rgba(255,255,255,0.04); }
.wi-prompt .wp-q { font-family: var(--font-display); font-size: 1.4rem; color: var(--on-deep-soft); line-height: 1; flex: none; }
.wi-prompt p { font-family: var(--font-display); font-weight: var(--disp-weight); font-size: calc(1.4rem * var(--disp-scale)); line-height: 1.32; color: var(--on-deep); margin: 0; letter-spacing: var(--disp-tracking); }
@media (max-width: 760px) { .wi-convo-grid { grid-template-columns: 1fr; } }

/* WI closing CTA */
.wi-cta { text-align: center; }
.wi-cta h2 { max-width: 18ch; margin: 0 auto; }
.wi-cta p { color: var(--ink-soft); font-size: 1.16rem; font-weight: 300; line-height: 1.6; margin: 22px auto 36px; max-width: 48ch; }
.wi-disc { margin-top: 64px; padding-top: 28px; border-top: 1px solid var(--line); font-size: 0.72rem; line-height: 1.7; color: var(--muted); max-width: 80ch; }