/* 12 · North Star Coaching — coach. Deep plum, gold, white; Fraunces and Outfit. Dust drifting in
   light behind a line that types itself, a pill that follows the section, icons that draw. */
.v-ns { --bg: #2a1433; --bg2: #1d0d24; --fg: #fbf5ff; --mut: #bfa9cc; --acc: #f2b705; --edge: #46295a; background: var(--bg); color: var(--fg); font-family: "Outfit", var(--sans); --btn-r: 999px; --fx-particle-color: #f2b705; --fx-logo-ink: var(--mut); --fx-step-accent: var(--acc); }
.v-ns .ns-hero { min-height: 100svh; display: grid; align-content: center; background: var(--bg2); }
.v-ns .ns-hero__in { position: relative; z-index: 1; padding-block: clamp(56px, 8vw, 100px); }
.v-ns .eyebrow { color: var(--acc); }
.v-ns h2 { font: 300 clamp(46px, 8.8vw, 140px)/0.92 var(--serif); letter-spacing: -0.03em; }
.v-ns h2 em { font-style: italic; font-weight: 600; color: var(--acc); }
.v-ns .ns-type { margin-top: 26px; font: 500 clamp(20px, 2.2vw, 30px)/1.3 "Outfit", var(--sans); color: var(--mut); max-width: 30ch; }
.v-ns .btn { background: var(--acc); color: #2a1433; }
.v-ns .ns-body { padding-block: clamp(40px, 5vw, 72px) clamp(56px, 7vw, 100px); }
.v-ns .ns-pill { position: sticky !important; top: 16px !important; left: auto !important; right: auto !important; margin-inline: 0 !important; z-index: 5 !important; display: inline-flex; gap: 6px; padding: 6px; border: 1px solid var(--edge); border-radius: 999px; --fx-pill-bg: var(--acc); --fx-pill-bar: #1d0d24; --fx-pill-ink: #fbf5ff; }
.v-ns .ns-pill a { padding: 12px 18px; border-radius: 999px; font: 600 14px/1 "Outfit", var(--sans); text-decoration: none; }
.v-ns .ns-work { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 64px); margin-top: clamp(40px, 5vw, 72px); align-items: start; }
.v-ns .ns-portrait { aspect-ratio: 3 / 4; border-radius: 20px; }
.v-ns h3 { font: 300 clamp(32px, 4vw, 60px)/1 var(--serif); letter-spacing: -0.02em; }
.v-ns h3 em { font-style: italic; color: var(--acc); }
.v-ns .ns-copy .lede { margin-top: 18px; color: var(--mut); }
.v-ns .ns-stats { margin-top: 36px; }
.v-ns .stat b { font-family: var(--serif); font-weight: 600; color: var(--acc); }
.v-ns .ns-stage { margin-top: 36px; aspect-ratio: 16 / 9; border-radius: 20px; }
.v-ns .ns-pillars { margin-top: clamp(56px, 7vw, 96px); }
.v-ns .ns-icons { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 28px; }
.v-ns .ns-icons li { padding: 24px; border: 1px solid var(--edge); border-radius: 18px; color: var(--acc); }
.v-ns .ns-icons h4 { font: 600 22px/1.2 "Outfit", var(--sans); color: var(--fg); margin-top: 16px; }
.v-ns .ns-icons p { color: var(--mut); margin-top: 8px; font-size: 15px; }
.v-ns .ns-heard { margin-top: clamp(56px, 7vw, 96px); }
.v-ns .ns-logos { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 24px; margin-top: 24px; color: var(--mut); }
.v-ns .ns-logos svg { width: 100%; height: auto; }
.v-ns .fxlist { color: var(--mut); }
@media (max-width: 900px) { .v-ns .ns-work { grid-template-columns: 1fr; } }