/* =========================================================================
   Producers page — dark SaaS platform aesthetic
   Near-black + cream + gold hairline. Separate from consumer site tokens.
   ========================================================================= */

:root {
  --pr-bg:       16 24 40;      /* deep ink blue — warmer than black */
  --pr-bg-2:     22 32 52;      /* card/panel */
  --pr-bg-3:     28 40 64;      /* deeper card */
  --pr-bg-warm:  32 28 40;      /* warm plum accent panel */
  --pr-line:     52 66 92;      /* hairline, softer */
  --pr-line-hi:  78 96 128;
  --pr-ink:      244 236 218;   /* ivory, warmer */
  --pr-ink-soft: 196 196 204;
  --pr-ink-mute: 138 144 160;
  --pr-gold:     216 172 96;    /* deeper warm gold */
  --pr-gold-lo:  146 112 58;
  --pr-copper:   200 118 76;    /* accent */
  --pr-green:    114 180 146;
  --pr-red:      212 122 100;
}

.producers-page {
  background: rgb(var(--pr-bg));
  color: rgb(var(--pr-ink));
}
.producers-page body,
body.producers-page {
  background: rgb(var(--pr-bg));
  color: rgb(var(--pr-ink));
}
/* Headings on dark producers pages must use ivory ink, not consumer --ink */
body.producers-page h1,
body.producers-page h2,
body.producers-page h3,
body.producers-page h4 {
  color: rgb(var(--pr-ink));
}

/* override consumer hero/nav where needed */
body.producers-page .nav {
  background: rgb(var(--pr-bg) / 0);
  border-bottom-color: transparent;
}
body.producers-page .nav.is-scrolled {
  background: rgb(var(--pr-bg) / 0.88);
  backdrop-filter: saturate(1.2) blur(10px);
  border-bottom-color: rgb(var(--pr-line) / 0.6);
}
body.producers-page .nav__links { color: rgb(var(--pr-ink-soft)); }
body.producers-page .nav__links a:hover { color: rgb(var(--pr-ink)); }
body.producers-page .nav.is-scrolled .nav__logo img {
  filter: none; /* logo stays white on dark */
}
body.producers-page .nav .btn--ghost {
  color: rgb(var(--pr-ink));
  border-color: rgb(var(--pr-ink) / 0.25);
}
body.producers-page .nav .btn--ghost:hover {
  background: rgb(var(--pr-ink));
  color: rgb(var(--pr-bg));
}

/* ------------ Layout helpers ------------ */
.pr-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--gutter, 32px);
}
.pr-section { padding: clamp(80px, 10vw, 160px) 0; position: relative; }
.pr-eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgb(var(--pr-gold));
}
.pr-hair {
  display: inline-block; width: 24px; height: 1px;
  background: rgb(var(--pr-gold));
  vertical-align: middle;
  margin-right: 14px;
}

/* ------------ Hero ------------ */
.pr-hero {
  position: relative;
  padding: 180px 0 140px;
  overflow: hidden;
}
.pr-hero::before {
  content: "";
  position: absolute; inset: 0;
  background:
    /* warm shaft of light — top right */
    radial-gradient(1100px 700px at 82% -10%, rgb(var(--pr-gold) / 0.18), transparent 55%),
    /* secondary warm glow, low */
    radial-gradient(800px 500px at 10% 90%, rgb(var(--pr-copper) / 0.10), transparent 60%),
    /* deep blue ambience */
    radial-gradient(1200px 800px at 50% 30%, rgb(40 56 90 / 0.45), transparent 65%);
  pointer-events: none;
}
.pr-hero__streak {
  position: absolute;
  top: -10%; right: -10%;
  width: 60%; height: 140%;
  background: linear-gradient(115deg,
    transparent 40%,
    rgb(var(--pr-gold) / 0.08) 48%,
    rgb(var(--pr-gold) / 0.14) 50%,
    rgb(var(--pr-gold) / 0.06) 54%,
    transparent 62%);
  transform: rotate(8deg);
  filter: blur(2px);
  pointer-events: none;
  z-index: 0;
}
.pr-hero::after {
  /* slow animated grain — subtle */
  content: "";
  position: absolute; inset: -50%;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.045 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity: 0.7;
  mix-blend-mode: overlay;
  animation: grainShift 22s steps(1) infinite;
  pointer-events: none;
}
@keyframes grainShift {
  0%   { transform: translate(0,0); }
  20%  { transform: translate(-3%, 2%); }
  40%  { transform: translate(2%, -1%); }
  60%  { transform: translate(-1%, -2%); }
  80%  { transform: translate(3%, 1%); }
  100% { transform: translate(0,0); }
}
@media (prefers-reduced-motion: reduce) {
  .pr-hero::after { animation: none; }
}
.pr-hero__inner { position: relative; z-index: 1; }

/* split hero layout */
.pr-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 64px;
  align-items: center;
}
@media (min-width: 1024px) {
  .pr-hero__grid { grid-template-columns: 1.15fr 0.85fr; gap: 80px; }
}
.pr-hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(40px, 6.8vw, 96px);
  line-height: 1.02;
  letter-spacing: -0.028em;
  color: rgb(var(--pr-ink));
  max-width: 18ch;
  margin: 32px 0 0;
  font-weight: 400;
}
.pr-hero h1 .line { display: block; }
.pr-hero h1 em { font-style: italic; color: rgb(var(--pr-gold)); }
.pr-hero__sub {
  margin-top: 32px;
  font-size: clamp(17px, 1.3vw, 21px);
  line-height: 1.55;
  color: rgb(var(--pr-ink-soft));
  max-width: 52ch;
}
.pr-hero__cta {
  margin-top: 52px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 20px 32px;
}
.pr-btn {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 16px 26px;
  font-family: var(--font-sans); font-size: 15px; font-weight: 500;
  letter-spacing: 0.02em; line-height: 1;
  cursor: pointer; border: 1px solid transparent;
  background: rgb(var(--pr-ink)); color: rgb(var(--pr-bg));
  transition: transform 600ms cubic-bezier(.22,.61,.36,1),
              background 600ms cubic-bezier(.22,.61,.36,1),
              box-shadow 600ms cubic-bezier(.22,.61,.36,1);
}
.pr-btn:hover { background: #fff; transform: translateY(-1px); }
.pr-btn__arrow { transition: transform 600ms cubic-bezier(.22,.61,.36,1); }
.pr-btn:hover .pr-btn__arrow { transform: translateX(4px); }
.pr-link {
  color: rgb(var(--pr-ink));
  font-size: 15px;
  border-bottom: 1px solid rgb(var(--pr-line-hi));
  padding-bottom: 3px;
  transition: border-color 400ms ease;
}
.pr-link:hover { border-color: rgb(var(--pr-gold)); }

.pr-hero__meta {
  margin-top: 80px;
  display: flex; flex-wrap: wrap; gap: 40px;
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
}
.pr-hero__meta .dot { display:inline-block; width:5px; height:5px; background: rgb(var(--pr-gold)); margin-right: 10px; vertical-align: middle; }

/* ------------ Hero live comp calculator ------------ */
.calc {
  background: linear-gradient(180deg, rgb(var(--pr-bg-2)), rgb(var(--pr-bg-3)));
  border: 1px solid rgb(var(--pr-line));
  border-radius: 6px;
  padding: 28px;
  position: relative;
  box-shadow:
    0 40px 80px -40px rgb(0 0 0 / 0.6),
    0 0 0 1px rgb(var(--pr-gold) / 0.08) inset;
}
.calc::before {
  content: "";
  position: absolute; inset: -1px;
  border-radius: 6px;
  background: linear-gradient(135deg, rgb(var(--pr-gold) / 0.35), transparent 40%, transparent 60%, rgb(var(--pr-gold) / 0.15));
  z-index: -1;
  filter: blur(10px);
  opacity: 0.4;
}
.calc__head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 20px;
}
.calc__title {
  font-family: var(--font-serif);
  font-size: 19px; letter-spacing: -0.01em;
  color: rgb(var(--pr-ink));
}
.calc__badge {
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: rgb(var(--pr-gold));
}
.calc__row { margin: 18px 0; }
.calc__label {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  margin-bottom: 8px;
}
.calc__label .v {
  font-family: var(--font-sans);
  font-size: 13px; font-weight: 500;
  color: rgb(var(--pr-ink));
  letter-spacing: 0;
  text-transform: none;
}
.calc__slider {
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 3px;
  background: rgb(var(--pr-line));
  outline: none; border-radius: 2px;
  cursor: pointer;
}
.calc__slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 18px; height: 18px; border-radius: 50%;
  background: rgb(var(--pr-gold));
  border: 3px solid rgb(var(--pr-bg-2));
  box-shadow: 0 0 0 1px rgb(var(--pr-gold));
  cursor: pointer;
  transition: transform 300ms ease;
}
.calc__slider::-webkit-slider-thumb:hover { transform: scale(1.15); }
.calc__slider::-moz-range-thumb {
  width: 18px; height: 18px; border-radius: 50%;
  background: rgb(var(--pr-gold));
  border: 3px solid rgb(var(--pr-bg-2));
  box-shadow: 0 0 0 1px rgb(var(--pr-gold));
  cursor: pointer;
}
.calc__pill-row {
  display: flex; gap: 6px;
  flex-wrap: wrap;
}
.calc__pill {
  flex: 1;
  padding: 8px 10px;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: rgb(var(--pr-ink-soft));
  background: rgb(var(--pr-bg-3));
  border: 1px solid rgb(var(--pr-line));
  cursor: pointer;
  border-radius: 3px;
  transition: all 300ms ease;
  text-align: center;
}
.calc__pill:hover { border-color: rgb(var(--pr-gold) / 0.5); color: rgb(var(--pr-ink)); }
.calc__pill.is-active {
  background: rgb(var(--pr-gold) / 0.12);
  border-color: rgb(var(--pr-gold));
  color: rgb(var(--pr-gold));
}
.calc__result {
  margin-top: 24px;
  padding: 22px 0 4px;
  border-top: 1px solid rgb(var(--pr-line));
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.calc__result .k {
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  margin-bottom: 8px;
}
.calc__result .v {
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(28px, 3vw, 38px);
  letter-spacing: -0.02em;
  line-height: 1;
  color: rgb(var(--pr-ink));
}
.calc__result .v.hi { color: rgb(var(--pr-gold)); }
.calc__result .d {
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.1em;
  color: rgb(var(--pr-green));
  margin-top: 6px;
}
.calc__foot {
  margin-top: 18px;
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: 0.08em;
  color: rgb(var(--pr-ink-mute));
  line-height: 1.6;
}

/* ------------ Live cohort / slot picker ------------ */
.cohort {
  background: linear-gradient(180deg, rgb(var(--pr-bg-2)), rgb(var(--pr-bg-3)));
  border: 1px solid rgb(var(--pr-line));
  border-radius: 6px;
  padding: 36px;
  margin-top: 48px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
}
@media (min-width: 900px) {
  .cohort { grid-template-columns: 1fr 1fr; gap: 48px; padding: 44px; }
}
.cohort__meta {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  margin-bottom: 20px;
}
.cohort__meta .live {
  color: rgb(var(--pr-gold));
  display: inline-flex; align-items: center; gap: 8px;
}
.cohort__meta .live::before {
  content: ""; display: inline-block;
  width: 6px; height: 6px; border-radius: 50%;
  background: rgb(var(--pr-gold));
  box-shadow: 0 0 0 4px rgb(var(--pr-gold) / 0.2);
  animation: pulse 1.8s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgb(var(--pr-gold) / 0.35); }
  50%      { box-shadow: 0 0 0 8px rgb(var(--pr-gold) / 0); }
}
.cohort h3 {
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.15; letter-spacing: -0.015em;
  color: rgb(var(--pr-ink));
  margin: 0 0 18px;
}
.cohort__capacity {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  margin-bottom: 10px;
}
.cohort__bar {
  height: 6px; background: rgb(var(--pr-line));
  border-radius: 3px; overflow: hidden; position: relative;
}
.cohort__bar > span {
  display: block; height: 100%;
  background: linear-gradient(90deg, rgb(var(--pr-gold)), rgb(var(--pr-copper)));
  width: 0%;
  transition: width 1.4s cubic-bezier(.22,.61,.36,1);
}
.cohort__bar-meta {
  display: flex; justify-content: space-between;
  font-family: var(--font-mono); font-size: 11px;
  color: rgb(var(--pr-ink-soft));
  margin-top: 10px;
  letter-spacing: 0.04em;
}
.cohort__bar-meta .taken { color: rgb(var(--pr-ink)); }
.cohort__body p {
  color: rgb(var(--pr-ink-soft));
  font-size: 15px; line-height: 1.6;
  margin: 18px 0 0;
}

/* slot picker */
.slots__head {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  margin-bottom: 14px;
}
.slots__week {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
  margin-bottom: 14px;
}
.slot-day {
  background: rgb(var(--pr-bg));
  border: 1px solid rgb(var(--pr-line));
  border-radius: 4px;
  padding: 10px 6px;
  text-align: center;
  cursor: pointer;
  transition: all 300ms ease;
}
.slot-day:hover { border-color: rgb(var(--pr-gold) / 0.5); }
.slot-day.is-active { background: rgb(var(--pr-gold) / 0.12); border-color: rgb(var(--pr-gold)); }
.slot-day .dow { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(var(--pr-ink-mute)); }
.slot-day .d { font-family: var(--font-serif); font-size: 20px; color: rgb(var(--pr-ink)); margin-top: 4px; letter-spacing: -0.01em; }
.slot-day.is-active .d { color: rgb(var(--pr-gold)); }
.slot-day .n { font-family: var(--font-mono); font-size: 9px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.04em; margin-top: 4px; }

.slots__times {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-bottom: 18px;
}
.slot-time {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: 0.04em;
  color: rgb(var(--pr-ink));
  background: rgb(var(--pr-bg));
  border: 1px solid rgb(var(--pr-line));
  padding: 10px 0;
  text-align: center;
  border-radius: 3px;
  cursor: pointer;
  transition: all 300ms ease;
}
.slot-time:hover { border-color: rgb(var(--pr-gold)); color: rgb(var(--pr-gold)); }
.slot-time.is-active { background: rgb(var(--pr-gold)); color: rgb(var(--pr-bg)); border-color: rgb(var(--pr-gold)); }
.slot-time.is-taken {
  color: rgb(var(--pr-ink-mute));
  background: transparent;
  text-decoration: line-through;
  cursor: not-allowed;
}
.slot-time.is-taken:hover { border-color: rgb(var(--pr-line)); color: rgb(var(--pr-ink-mute)); }

.slots__cta {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 18px;
  border-top: 1px solid rgb(var(--pr-line));
}
.slots__cta .sel {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.08em;
  color: rgb(var(--pr-ink-soft));
}
.slots__cta .sel .hi { color: rgb(var(--pr-gold)); }

/* ------------ Problem section ------------ */
.pr-problem { background: rgb(var(--pr-bg)); border-top: 1px solid rgb(var(--pr-line)); }
.pr-problem .pr-container { max-width: 920px; }
.pr-problem__block {
  padding: 48px 0;
  border-bottom: 1px solid rgb(var(--pr-line));
}
.pr-problem__block:last-child { border-bottom: 0; }
.pr-problem__block p {
  font-family: var(--font-serif);
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.35;
  letter-spacing: -0.015em;
  color: rgb(var(--pr-ink));
  max-width: 38ch;
  margin: 0;
  font-weight: 400;
}
.pr-problem__block .idx {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em;
  color: rgb(var(--pr-ink-mute));
  margin-bottom: 20px;
}

/* ------------ Pivot line ------------ */
.pr-pivot {
  padding: clamp(140px, 18vw, 220px) 0;
  text-align: center;
}
.pr-pivot p {
  font-family: var(--font-serif);
  font-size: clamp(36px, 5.2vw, 68px);
  line-height: 1.1;
  letter-spacing: -0.022em;
  color: rgb(var(--pr-ink));
  max-width: 20ch;
  margin: 0 auto;
  font-weight: 400;
}
.pr-pivot p em { font-style: italic; color: rgb(var(--pr-gold)); }

/* ------------ Platform / dashboards ------------ */
.pr-platform { position: relative; }
.pr-platform__intro { max-width: 64ch; margin-bottom: 80px; }
.pr-platform__intro h2 {
  font-family: var(--font-serif);
  font-size: clamp(34px, 4.2vw, 58px);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: rgb(var(--pr-ink));
  margin-top: 24px;
  font-weight: 400;
}
.pr-platform__intro p { margin-top: 24px; color: rgb(var(--pr-ink-soft)); font-size: 18px; max-width: 56ch; }

.dash-stack { display: flex; flex-direction: column; gap: 120px; }
.dash-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
  align-items: center;
}
@media (min-width: 960px) {
  .dash-row { grid-template-columns: 0.8fr 1.2fr; gap: 80px; }
  .dash-row.reverse { grid-template-columns: 1.2fr 0.8fr; }
  .dash-row.reverse .dash-row__copy { order: 2; }
  .dash-row.reverse .dash-row__mock { order: 1; }
}
.dash-row__copy .kicker {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: rgb(var(--pr-gold));
}
.dash-row__copy h3 {
  font-family: var(--font-serif);
  font-size: clamp(28px, 2.6vw, 40px);
  line-height: 1.12;
  letter-spacing: -0.015em;
  color: rgb(var(--pr-ink));
  margin-top: 18px;
  font-weight: 400;
}
.dash-row__copy p { color: rgb(var(--pr-ink-soft)); font-size: 17px; margin-top: 20px; max-width: 46ch; }
.dash-row__copy ul { list-style: none; padding: 0; margin: 24px 0 0; }
.dash-row__copy li {
  font-size: 15px; color: rgb(var(--pr-ink-soft));
  padding: 10px 0;
  border-top: 1px solid rgb(var(--pr-line));
  display: flex; align-items: baseline; gap: 14px;
}
.dash-row__copy li::before {
  content: ""; display: inline-block;
  width: 5px; height: 5px; background: rgb(var(--pr-gold));
  transform: translateY(-2px);
  flex-shrink: 0;
}
.dash-row__copy li:last-child { border-bottom: 1px solid rgb(var(--pr-line)); }

/* Dashboard mock shell */
.mock {
  background: rgb(var(--pr-bg-2));
  border: 1px solid rgb(var(--pr-line));
  border-radius: 8px;
  overflow: hidden;
  box-shadow:
    0 24px 64px -24px rgb(0 0 0 / 0.6),
    0 2px 0 rgb(var(--pr-ink) / 0.02) inset;
  font-size: 13px;
  opacity: 0;
  transform: translateY(24px) scale(0.985);
  transition: opacity 1000ms cubic-bezier(.22,.61,.36,1), transform 1000ms cubic-bezier(.22,.61,.36,1);
}
.mock.is-in { opacity: 1; transform: none; }
.mock__chrome {
  padding: 12px 16px;
  border-bottom: 1px solid rgb(var(--pr-line));
  display: flex; align-items: center; gap: 14px;
  background: rgb(var(--pr-bg-3));
}
.mock__dots { display: flex; gap: 6px; }
.mock__dots span { width: 8px; height: 8px; border-radius: 50%; background: rgb(var(--pr-line-hi)); }
.mock__url {
  font-family: var(--font-mono); font-size: 11px; color: rgb(var(--pr-ink-mute));
  background: rgb(var(--pr-bg-2)); padding: 4px 10px; border-radius: 4px;
  border: 1px solid rgb(var(--pr-line));
  flex: 1; text-align: center; letter-spacing: 0.04em;
}
.mock__tab {
  font-family: var(--font-mono); font-size: 11px; color: rgb(var(--pr-ink-soft));
  letter-spacing: 0.12em; text-transform: uppercase;
}
.mock__body { padding: 24px; }

/* ---------------- CRM kanban ---------------- */
.crm__head {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px;
}
.crm__title { font-family: var(--font-serif); font-size: 18px; color: rgb(var(--pr-ink)); }
.crm__meta { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.12em; text-transform: uppercase; }
.crm__cols {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}
.crm__col {
  background: rgb(var(--pr-bg-3));
  border: 1px solid rgb(var(--pr-line));
  border-radius: 4px;
  padding: 10px;
  min-height: 220px;
}
.crm__col h5 {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgb(var(--pr-ink-soft));
  margin: 0 0 10px;
  display: flex; justify-content: space-between; align-items: center;
}
.crm__col h5 span.count {
  background: rgb(var(--pr-line)); color: rgb(var(--pr-ink-soft));
  padding: 1px 6px; border-radius: 3px; font-size: 10px;
}
.crm-card {
  background: rgb(var(--pr-bg-2));
  border: 1px solid rgb(var(--pr-line));
  border-radius: 3px;
  padding: 10px;
  margin-bottom: 8px;
}
.crm-card .name { font-size: 12px; color: rgb(var(--pr-ink)); font-weight: 500; }
.crm-card .amt { font-family: var(--font-mono); font-size: 11px; color: rgb(var(--pr-gold)); margin-top: 6px; letter-spacing: 0.03em; }
.crm-card .tag {
  display: inline-block;
  font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  background: rgb(var(--pr-bg-3)); padding: 2px 6px; border-radius: 2px;
  margin-top: 8px;
}

/* ---------------- Academy ---------------- */
.ac__grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.ac-card {
  background: rgb(var(--pr-bg-3));
  border: 1px solid rgb(var(--pr-line));
  padding: 14px;
  border-radius: 4px;
  display: flex; flex-direction: column; gap: 10px;
}
.ac-card .kick { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-gold)); letter-spacing: 0.12em; text-transform: uppercase; }
.ac-card .title { font-size: 13px; color: rgb(var(--pr-ink)); font-weight: 500; line-height: 1.3; min-height: 36px; }
.ac-card .meta { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-ink-mute)); }
.ac-card .bar { height: 3px; background: rgb(var(--pr-line)); border-radius: 2px; overflow: hidden; }
.ac-card .bar > span { display: block; height: 100%; background: rgb(var(--pr-gold)); }
.ac-card .bar--done > span { background: rgb(var(--pr-green)); }

/* ---------------- Rate Grid ---------------- */
.rg {
  font-family: var(--font-mono); font-size: 11px;
}
.rg__head, .rg__row {
  display: grid;
  grid-template-columns: 1.4fr 1.6fr 0.7fr 0.8fr 0.8fr 0.9fr 0.6fr;
  align-items: center;
  padding: 10px 8px;
  gap: 8px;
}
.rg__head {
  color: rgb(var(--pr-ink-mute));
  letter-spacing: 0.12em; text-transform: uppercase;
  border-bottom: 1px solid rgb(var(--pr-line));
}
.rg__row { border-bottom: 1px solid rgb(var(--pr-line) / 0.6); }
.rg__row:last-child { border-bottom: 0; }
.rg__carrier { color: rgb(var(--pr-ink)); font-family: var(--font-sans); font-size: 12px; font-weight: 500; letter-spacing: 0; }
.rg__product { color: rgb(var(--pr-ink-soft)); font-family: var(--font-sans); font-size: 12px; letter-spacing: 0; }
.rg__num { color: rgb(var(--pr-ink)); letter-spacing: 0.03em; }
.rg__num.hi { color: rgb(var(--pr-gold)); }
.rg__rating {
  display: inline-block; padding: 1px 6px; border-radius: 2px;
  background: rgb(var(--pr-bg-3)); border: 1px solid rgb(var(--pr-line));
  color: rgb(var(--pr-ink)); font-size: 10px; letter-spacing: 0.05em;
}

/* ---------------- Product Intelligence ---------------- */
.pi__grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;
}
.pi-card {
  background: rgb(var(--pr-bg-3));
  border: 1px solid rgb(var(--pr-line));
  padding: 14px;
  border-radius: 4px;
}
.pi-card__head { display: flex; justify-content: space-between; align-items: baseline; }
.pi-card__carrier { font-size: 13px; color: rgb(var(--pr-ink)); font-weight: 500; }
.pi-card__rating { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-gold)); letter-spacing: 0.08em; }
.pi-card__product { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-ink-mute)); margin-top: 4px; letter-spacing: 0.08em; text-transform: uppercase; }
.pi-card__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.pi-card__stat .v { font-family: var(--font-serif); font-size: 20px; color: rgb(var(--pr-ink)); letter-spacing: -0.01em; }
.pi-card__stat .v sup { font-size: 0.55em; color: rgb(var(--pr-gold)); font-family: var(--font-sans); margin-left: 1px; }
.pi-card__stat .l { font-family: var(--font-mono); font-size: 9px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.12em; text-transform: uppercase; margin-top: 3px; }

/* ---------------- Scripts / objections ---------------- */
.sc {
  display: grid; grid-template-columns: 260px 1fr; gap: 1px;
  background: rgb(var(--pr-line));
  border-radius: 4px;
  overflow: hidden;
}
.sc__list { background: rgb(var(--pr-bg-3)); padding: 12px; }
.sc__list .grp {
  font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.14em; text-transform: uppercase;
  padding: 10px 8px 6px;
}
.sc__list .item {
  padding: 8px; font-size: 12px; color: rgb(var(--pr-ink-soft));
  border-radius: 3px;
  cursor: default;
}
.sc__list .item.active { background: rgb(var(--pr-bg-2)); color: rgb(var(--pr-ink)); border-left: 2px solid rgb(var(--pr-gold)); padding-left: 10px; }
.sc__body { background: rgb(var(--pr-bg-2)); padding: 20px; }
.sc__title { font-family: var(--font-serif); font-size: 16px; color: rgb(var(--pr-ink)); letter-spacing: -0.01em; }
.sc__objection {
  font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-gold)); letter-spacing: 0.14em; text-transform: uppercase;
  margin-top: 14px;
}
.sc__quote { color: rgb(var(--pr-ink-soft)); font-size: 13px; margin-top: 6px; line-height: 1.55; font-style: italic; }
.sc__divider { height: 1px; background: rgb(var(--pr-line)); margin: 16px 0; }
.sc__resp {
  font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-gold)); letter-spacing: 0.14em; text-transform: uppercase;
}
.sc__answer { color: rgb(var(--pr-ink)); font-size: 13px; margin-top: 6px; line-height: 1.6; }

/* ---------------- Leaderboard ---------------- */
.lb__head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 16px; }
.lb__title { font-family: var(--font-serif); font-size: 18px; color: rgb(var(--pr-ink)); }
.lb__meta { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.12em; text-transform: uppercase; }
.lb__row {
  display: grid; grid-template-columns: 32px 1fr 1fr 1fr 90px;
  gap: 12px; align-items: center;
  padding: 12px 8px;
  border-bottom: 1px solid rgb(var(--pr-line) / 0.7);
  font-size: 12px;
}
.lb__row:last-child { border-bottom: 0; }
.lb__rank { font-family: var(--font-mono); font-size: 11px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.08em; }
.lb__row.top .lb__rank { color: rgb(var(--pr-gold)); }
.lb__name { color: rgb(var(--pr-ink)); font-weight: 500; }
.lb__loc { font-family: var(--font-mono); font-size: 10px; color: rgb(var(--pr-ink-mute)); letter-spacing: 0.06em; text-transform: uppercase; }
.lb__num { font-family: var(--font-mono); font-size: 11px; color: rgb(var(--pr-ink)); text-align: right; letter-spacing: 0.04em; }
.lb__bar { height: 3px; background: rgb(var(--pr-line)); border-radius: 2px; overflow: hidden; }
.lb__bar > span { display: block; height: 100%; background: rgb(var(--pr-gold)); }

.pr-section.pr-light,
.pr-light {
  background: rgb(244 240 230);  /* warm ivory */
  color: rgb(28 36 52);
  border-top: 1px solid rgb(220 212 196);
  border-bottom: 1px solid rgb(220 212 196);
}
.pr-light .pr-eyebrow { color: rgb(155 112 42); }
.pr-light .pr-hair { background: rgb(155 112 42); }
.pr-light h2, .pr-light h3 { color: rgb(20 28 44) !important; }
.pr-light p { color: rgb(66 78 98); }
.pr-light em { color: rgb(155 112 42); font-style: italic; }

/* Problem blocks — light variant */
.pr-light.pr-problem .pr-problem__block { border-bottom-color: rgb(220 212 196); }
.pr-light.pr-problem .pr-problem__block p { color: rgb(20 28 44); }
.pr-light.pr-problem .idx { color: rgb(132 120 96); }

/* Platform — light variant */
.pr-light .dash-row__copy .kicker { color: rgb(155 112 42); }
.pr-light .dash-row__copy h3 { color: rgb(20 28 44); }
.pr-light .dash-row__copy p { color: rgb(66 78 98); }
.pr-light .dash-row__copy li { color: rgb(66 78 98); border-top-color: rgb(220 212 196); }
.pr-light .dash-row__copy li:last-child { border-bottom-color: rgb(220 212 196); }
.pr-light .dash-row__copy li::before { background: rgb(155 112 42); }
/* mocks stay dark on light — nice contrast */

/* Philosophy — light variant */
.pr-light.pr-phil .pr-phil__item { border-top-color: rgb(220 212 196); }
.pr-light.pr-phil .pr-phil__item:last-child { border-bottom-color: rgb(220 212 196); }
.pr-light.pr-phil .pr-phil__num { color: rgb(155 112 42); }
.pr-light.pr-phil h3 { color: rgb(20 28 44); }
.pr-light.pr-phil p { color: rgb(66 78 98); }
.pr-light.pr-phil em { color: rgb(20 28 44); }

/* FAQ — light variant */
.pr-light.pr-faq .pr-faq__list { border-top-color: rgb(220 212 196); }
.pr-light.pr-faq .pr-faq__item { border-bottom-color: rgb(220 212 196); }
.pr-light.pr-faq .pr-faq__q { color: rgb(20 28 44); }
.pr-light.pr-faq .pr-faq__q::after {
  background:
    linear-gradient(rgb(20 28 44), rgb(20 28 44)) center/12px 1px no-repeat,
    linear-gradient(rgb(20 28 44), rgb(20 28 44)) center/1px 12px no-repeat;
}
.pr-light.pr-faq .pr-faq__item.is-open .pr-faq__q::after {
  background: linear-gradient(rgb(20 28 44), rgb(20 28 44)) center/12px 1px no-repeat;
}
.pr-light.pr-faq .pr-faq__a p { color: rgb(66 78 98); }
.pr-light.pr-faq .pr-faq__a em { color: rgb(132 120 96); }

/* Pivot on light */
.pr-light.pr-pivot p { color: rgb(20 28 44); }
.pr-light.pr-pivot em { color: rgb(155 112 42); }

/* ------------ Cream accent (mid-tone between dark and full ivory) ------------ */
.pr-cream {
  background: rgb(232 224 206);
  color: rgb(28 36 52);
  border-top: 1px solid rgb(208 198 180);
  border-bottom: 1px solid rgb(208 198 180);
}
.pr-cream .pr-eyebrow { color: rgb(155 112 42); }
.pr-cream .pr-hair { background: rgb(155 112 42); }
.pr-cream h2, .pr-cream h3, .pr-cream p { color: inherit; }
.pr-cream p { color: rgb(66 78 98); }
.pr-cream em { color: rgb(155 112 42); font-style: italic; }
.pr-phil { background: rgb(var(--pr-bg)); border-top: 1px solid rgb(var(--pr-line)); }
.pr-phil .pr-container { max-width: 900px; }
.pr-phil__head { margin-bottom: 72px; }
.pr-phil__item {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  padding: 56px 0;
  border-top: 1px solid rgb(var(--pr-line));
}
.pr-phil__item:last-child { border-bottom: 1px solid rgb(var(--pr-line)); }
@media (min-width: 820px) {
  .pr-phil__item { grid-template-columns: 0.4fr 1fr; gap: 72px; }
}
.pr-phil__num {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: rgb(var(--pr-gold));
}
.pr-phil__item h3 {
  font-family: var(--font-serif);
  font-size: clamp(26px, 2.6vw, 38px);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: rgb(var(--pr-ink));
  margin: 0 0 18px;
  font-weight: 400;
}
.pr-phil__item p { color: rgb(var(--pr-ink-soft)); font-size: 17px; max-width: 56ch; }
.pr-phil__item em { font-style: italic; color: rgb(var(--pr-ink)); }

/* ------------ Founder ------------ */
.pr-founder {
  background: rgb(var(--pr-bg-2));
  border-top: 1px solid rgb(var(--pr-line));
  border-bottom: 1px solid rgb(var(--pr-line));
}
.pr-founder__grid {
  display: grid; grid-template-columns: 1fr; gap: 48px; align-items: center;
}
@media (min-width: 820px) {
  .pr-founder__grid { grid-template-columns: 0.9fr 1.4fr; gap: 80px; }
}
.pr-founder__photo {
  background:
    repeating-linear-gradient(135deg, rgb(var(--pr-bg-3)) 0 12px, rgb(var(--pr-bg-2)) 12px 24px);
  border: 1px solid rgb(var(--pr-line));
  aspect-ratio: 4 / 5;
  position: relative;
}
.pr-founder__photo .lbl {
  position: absolute; left: 16px; bottom: 14px;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  color: rgb(var(--pr-ink-mute));
  background: rgb(var(--pr-bg) / 0.85); padding: 4px 8px;
}
.pr-founder p { color: rgb(var(--pr-ink-soft)); font-size: 18px; line-height: 1.6; max-width: 52ch; }
.pr-founder h3 {
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(28px, 2.8vw, 40px);
  letter-spacing: -0.015em;
  margin: 18px 0 28px;
  color: rgb(var(--pr-ink));
}

/* ------------ FAQ ------------ */
.pr-faq { background: rgb(var(--pr-bg)); }
.pr-faq__grid {
  display: grid; grid-template-columns: 1fr; gap: 48px;
}
@media (min-width: 900px) { .pr-faq__grid { grid-template-columns: 0.8fr 1.2fr; gap: 80px; } }
.pr-faq__head h2 {
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(32px, 3.6vw, 52px); line-height: 1.1;
  letter-spacing: -0.02em; color: rgb(var(--pr-ink));
  margin-top: 20px;
}
.pr-faq__list { border-top: 1px solid rgb(var(--pr-line)); }
.pr-faq__item { border-bottom: 1px solid rgb(var(--pr-line)); }
.pr-faq__q {
  width: 100%;
  background: transparent; border: none; cursor: pointer;
  padding: 28px 48px 28px 0;
  text-align: left;
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(19px, 1.4vw, 23px);
  letter-spacing: -0.01em; line-height: 1.3;
  color: rgb(var(--pr-ink));
  position: relative;
}
.pr-faq__q::after {
  content: ""; position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 12px; height: 12px;
  background:
    linear-gradient(rgb(var(--pr-ink)), rgb(var(--pr-ink))) center/12px 1px no-repeat,
    linear-gradient(rgb(var(--pr-ink)), rgb(var(--pr-ink))) center/1px 12px no-repeat;
  transition: transform 600ms cubic-bezier(.22,.61,.36,1);
}
.pr-faq__item.is-open .pr-faq__q::after {
  transform: translateY(-50%) rotate(45deg);
  background: linear-gradient(rgb(var(--pr-ink)), rgb(var(--pr-ink))) center/12px 1px no-repeat;
}
.pr-faq__a { max-height: 0; overflow: hidden; transition: max-height 700ms cubic-bezier(.22,.61,.36,1); }
.pr-faq__item.is-open .pr-faq__a { max-height: 400px; }
.pr-faq__a p { padding: 0 0 28px; color: rgb(var(--pr-ink-soft)); max-width: 64ch; font-size: 16px; line-height: 1.6; }
.pr-faq__a em { color: rgb(var(--pr-ink-mute)); font-style: normal; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }

/* ------------ Final CTA ------------ */
.pr-final { text-align: left; padding: clamp(120px, 16vw, 200px) 0; border-top: 1px solid rgb(var(--pr-line)); }
.pr-final .pr-container { max-width: 960px; }
.pr-final h2 {
  font-family: var(--font-serif); font-weight: 400;
  font-size: clamp(36px, 4.8vw, 64px); line-height: 1.1;
  letter-spacing: -0.022em;
  color: rgb(var(--pr-ink));
  margin-top: 24px;
  max-width: 22ch;
}
.pr-final__actions { margin-top: 52px; display: flex; flex-wrap: wrap; gap: 24px 36px; align-items: center; }
.pr-final__fine { margin-top: 28px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(var(--pr-ink-mute)); }

/* ------------ Footer ------------ */
.pr-footer { background: rgb(var(--pr-bg-2)); padding: 80px 0 40px; border-top: 1px solid rgb(var(--pr-line)); }
.pr-footer__top { display: grid; grid-template-columns: 1fr; gap: 48px; padding: 0 var(--gutter, 32px); max-width: 1280px; margin: 0 auto; }
@media (min-width: 820px) { .pr-footer__top { grid-template-columns: 2fr 1fr 1fr; } }
.pr-footer__brand p { color: rgb(var(--pr-ink-mute)); font-size: 14px; margin-top: 18px; max-width: 36ch; }
.pr-footer__col h4 { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: rgb(var(--pr-ink-mute)); margin: 0 0 16px; font-weight: 500; }
.pr-footer__col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.pr-footer__col a { color: rgb(var(--pr-ink-soft)); font-size: 14px; }
.pr-footer__col a:hover { color: rgb(var(--pr-ink)); }
.pr-footer__fine {
  max-width: 1280px; margin: 64px auto 0; padding: 32px var(--gutter, 32px) 0;
  border-top: 1px solid rgb(var(--pr-line));
}
.pr-footer__fine p { font-size: 12px; line-height: 1.7; color: rgb(var(--pr-ink-mute)); max-width: 90ch; }
.pr-footer__fine .copy { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgb(var(--pr-ink-mute)); margin-top: 20px; }

/* mobile simplifications */
@media (max-width: 720px) {
  .crm__cols { grid-template-columns: repeat(2, 1fr); overflow-x: auto; }
  .ac__grid { grid-template-columns: 1fr; }
  .pi__grid { grid-template-columns: 1fr; }
  .sc { grid-template-columns: 1fr; }
  .rg__head, .rg__row { grid-template-columns: 1.2fr 1fr 0.6fr 0.7fr 0.6fr; font-size: 10px; }
  .rg__head > :nth-child(6), .rg__head > :nth-child(7),
  .rg__row > :nth-child(6), .rg__row > :nth-child(7) { display: none; }
  .lb__row { grid-template-columns: 24px 1fr 1fr 70px; }
  .lb__row > :nth-child(3) { display: none; }
}
