/* Tommy & Spartan — The Founding 20 — static stylesheet (replaces Tailwind Play CDN) */
:root {
  --advisory-navy:    #0F1B2D;
  --advisory-navy-2:  #16263F;
  --advisory-paper:   #F5EFE3;
  --advisory-paper-2: #EDE5D2;
  --advisory-gold:    #C9A84C;
  --advisory-gold-2:  #9A7A2C;

  --font-display: 'Playfair Display', Georgia, serif;
  --font-sans:    'Inter', system-ui, -apple-system, sans-serif;
  --font-tommy:   'Parisienne', cursive;
  --font-spartan: 'Playfair Display', serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { background-color: var(--advisory-paper); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }

.advisory-display { font-family: var(--font-display); font-feature-settings: "lnum" 1, "kern" 1; letter-spacing: -0.01em; }

.container { margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.container.w-896  { max-width: 896px; }
.container.w-1024 { max-width: 1024px; }
.container.w-672  { max-width: 672px; }

.bg-navy  { background-color: var(--advisory-navy); }
.bg-paper { background-color: var(--advisory-paper); }

.kicker { font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.22em; margin-bottom: 24px; }
.kicker.gold  { color: var(--advisory-gold); }
.kicker.ink   { color: rgba(15, 27, 45, 0.6); font-weight: 400; margin-bottom: 32px; }

/* Hero */
.hero-inner { padding-top: 64px; padding-bottom: 96px; }
.hero-lockup { margin-bottom: 48px; }
.hero h1 { font-size: 36px; line-height: 1.06; color: var(--advisory-paper); font-weight: 400; }
.hero h1 em { font-style: italic; color: var(--advisory-paper); }
.hero .lede { margin-top: 40px; max-width: 672px; font-size: 18px; line-height: 1.625; color: rgba(245, 239, 227, 0.82); }
.hero .lede + .lede { margin-top: 20px; }
.hero-rule { margin-top: 56px; height: 1px; width: 48px; background-color: var(--advisory-gold); }
.hero-tag { margin-top: 32px; font-size: 13px; color: rgba(245, 239, 227, 0.5); letter-spacing: 0.06em; }

/* Proof strip */
.proof { border-top: 1px solid rgba(15, 27, 45, 0.08); }
.proof-inner { padding-top: 40px; padding-bottom: 40px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.proof-label { font-size: 11px; text-transform: uppercase; color: rgba(15, 27, 45, 0.6); letter-spacing: 0.22em; }
.proof-names { display: flex; flex-wrap: wrap; align-items: center; column-gap: 40px; row-gap: 12px; font-size: 20px; color: var(--advisory-navy); }
.proof-names .dot { font-size: 10px; color: rgba(15, 27, 45, 0.3); }

/* Section padding */
.section-inner { padding-top: 80px; padding-bottom: 80px; }

/* Cost grid */
.cost-grid { display: grid; gap: 24px; }
.cost-card { border-top: 1px solid var(--advisory-gold); padding-top: 20px; }
.cost-card .stat { font-size: 36px; color: var(--advisory-navy); }
.cost-card .label { margin-top: 4px; font-size: 11px; text-transform: uppercase; color: rgba(15, 27, 45, 0.55); letter-spacing: 0.14em; }
.cost-card .body { margin-top: 16px; font-size: 14.5px; line-height: 1.625; color: rgba(15, 27, 45, 0.72); }
.pullquote { margin-top: 48px; border-left: 3px solid var(--advisory-gold); border-radius: 2px; padding: 20px 0 20px 24px; }
.pullquote .line { font-size: 20px; line-height: 1.22; color: var(--advisory-navy); }
.pullquote .sub { margin-top: 8px; font-size: 14.5px; line-height: 1.625; color: rgba(15, 27, 45, 0.7); }

/* Guide section */
.guide-grid { display: grid; gap: 32px; }
.guide-card .head { font-size: 24px; line-height: 1.2; color: var(--advisory-paper); }
.guide-card .body { margin-top: 16px; font-size: 15px; line-height: 1.625; color: rgba(245, 239, 227, 0.75); }
.gate-box { margin-top: 40px; border: 1px solid rgba(201, 168, 76, 0.28); border-radius: 2px; padding: 24px; }
.gate-box .head { font-size: 20px; line-height: 1.22; color: var(--advisory-paper); }
.gate-box .body { margin-top: 12px; font-size: 14px; line-height: 1.625; color: rgba(245, 239, 227, 0.68); }

/* Offer */
.offer-lockup { margin-bottom: 40px; }
.offer h2 { font-size: 30px; line-height: 1.14; color: var(--advisory-navy); font-weight: 400; }
.offer .lede { margin-top: 20px; max-width: 672px; font-size: 16px; line-height: 1.625; color: rgba(15, 27, 45, 0.72); }
.offer-grid { margin-top: 40px; display: grid; gap: 20px; }
.offer-card { display: flex; flex-direction: column; border: 1px solid rgba(15, 27, 45, 0.15); border-radius: 2px; padding: 24px; background-color: transparent; }
.offer-card .price { font-size: 30px; color: var(--advisory-navy); }
.offer-card .label { margin-top: 4px; font-size: 11px; text-transform: uppercase; color: rgba(15, 27, 45, 0.48); letter-spacing: 0.14em; }
.offer-card .body { margin-top: 16px; font-size: 13.5px; line-height: 1.625; color: rgba(15, 27, 45, 0.72); }
.offer-card.featured { border-color: var(--advisory-navy); background-color: var(--advisory-navy); }
.offer-card.featured .price { color: var(--advisory-gold); }
.offer-card.featured .label { color: rgba(245, 239, 227, 0.52); }
.offer-card.featured .body { color: rgba(245, 239, 227, 0.82); }

/* CTA */
.cta-inner { padding-top: 80px; padding-bottom: 80px; text-align: center; }
.cta-lockup { margin-bottom: 40px; display: flex; justify-content: center; }
.cta h2 { font-size: 30px; line-height: 1.14; color: var(--advisory-paper); font-weight: 400; }
.cta .lede { margin: 20px auto 0; max-width: 512px; font-size: 15px; line-height: 1.625; color: rgba(245, 239, 227, 0.72); }
.cta-actions { margin-top: 40px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.cta-button {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 2px; padding: 16px 40px; font-size: 14px; font-weight: 500;
  background-color: var(--advisory-gold); color: var(--advisory-navy);
  letter-spacing: 0.04em; text-decoration: none; transition: opacity 0.15s ease;
}
.cta-button:hover { opacity: 0.9; }
.cta-email { font-size: 13px; color: rgba(245, 239, 227, 0.46); }
.cta-email a { color: rgba(245, 239, 227, 0.46); text-decoration: underline; text-underline-offset: 4px; transition: opacity 0.15s ease; }
.cta-email a:hover { opacity: 0.7; }

/* Lockup (image asset, tight-cropped — img/ts-lockup-*.png) */
.ts-logo { display: block; width: auto; }
.ts-logo--hero { height: 120px; }
.ts-logo--md { height: 96px; }

@media (min-width: 640px) {
  .hero h1 { font-size: 48px; }
  .offer h2, .cta h2 { font-size: 36px; }
  .ts-logo--hero { height: 150px; }
}

@media (min-width: 768px) {
  .proof-inner { flex-direction: row; align-items: center; justify-content: space-between; gap: 40px; }
  .cost-grid { grid-template-columns: repeat(3, 1fr); }
  .guide-grid { grid-template-columns: repeat(2, 1fr); }
  .offer-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 1024px) {
  .container { padding-left: 40px; padding-right: 40px; }
  .hero-inner { padding-top: 96px; padding-bottom: 128px; }
  .hero h1 { font-size: 64px; }
  .section-inner { padding-top: 96px; padding-bottom: 96px; }
  .proof-inner { padding-top: 48px; padding-bottom: 48px; }
  .cta-inner { padding-top: 96px; padding-bottom: 96px; }
}

/* Self-service section */
.self-serve { border-top: 1px solid rgba(15, 27, 45, 0.08); }
.price .per { font-size: 13px; color: rgba(15, 27, 45, 0.5); letter-spacing: normal; }
.offer-card.featured .price .per { color: rgba(245, 239, 227, 0.52); }
.sprint-card { margin-top: 20px; display: flex; flex-direction: column; gap: 12px; border: 1px solid rgba(15, 27, 45, 0.15); border-radius: 2px; padding: 24px; }
.sprint-card .price { font-size: 24px; color: var(--advisory-navy); }
.sprint-card .price .per { font-size: 12px; }
.sprint-card .label { margin-top: 4px; font-size: 11px; text-transform: uppercase; color: rgba(15, 27, 45, 0.48); letter-spacing: 0.14em; }
.sprint-card .body { font-size: 13.5px; line-height: 1.625; color: rgba(15, 27, 45, 0.72); }

@media (min-width: 768px) {
  .sprint-card { flex-direction: row; align-items: center; justify-content: space-between; }
  .sprint-card .body { max-width: 384px; }
}

/* Self-service launch date — emphasised (≈2× the kicker) */
.self-serve .kicker.ink { margin-bottom: 8px; }
.self-serve-date { font-size: 22px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--advisory-gold-2); margin-bottom: 24px; }

/* "Also from Tommy & Spartan" cross-link section (Spartan Training) */
.also { border-top: 1px solid rgba(15, 27, 45, 0.08); }
.also h2 { font-size: 30px; line-height: 1.16; color: var(--advisory-navy); font-weight: 400; max-width: 680px; }
.also .lede { margin-top: 18px; }
.also-actions { margin-top: 32px; }
.cta-button.alt { background: var(--advisory-navy); color: var(--advisory-paper); }
@media (min-width: 640px) { .also h2 { font-size: 36px; } }

/* "Two ways to work with us" — product-family section */
.ways { border-top: 1px solid rgba(15, 27, 45, 0.08); }
.ways-grid { display: grid; gap: 24px; }
.ways-card { display: flex; flex-direction: column; border-top: 1px solid var(--advisory-gold); padding-top: 24px; }
.ways-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: rgba(15, 27, 45, 0.55); }
.ways-card h3 { margin-top: 10px; font-size: 24px; line-height: 1.18; color: var(--advisory-navy); font-weight: 400; }
.ways-card p { margin-top: 16px; font-size: 15px; line-height: 1.625; color: rgba(15, 27, 45, 0.72); }
.ways-link { margin-top: 20px; font-size: 14px; font-weight: 500; letter-spacing: 0.02em; color: var(--advisory-gold-2); text-decoration: none; transition: opacity 0.15s ease; }
.ways-link:hover { opacity: 0.7; }
@media (min-width: 768px) { .ways-grid { grid-template-columns: repeat(2, 1fr); } }

/* Readability: emphasis via weight, not italic (italics reserved for large headline words only) */
.lede em, .body em, .sub em, .offer .lede em, .cta .lede em, .also .lede em { font-style: normal; font-weight: 600; }

/* Persistent top nav (site-wide) */
.topnav { background: var(--advisory-navy); border-bottom: 1px solid rgba(201, 168, 76, 0.18); }
.topnav-inner { display: flex; align-items: center; justify-content: space-between; padding-top: 18px; padding-bottom: 18px; }
.topnav-brand img { height: 34px; width: auto; display: block; }
.topnav-links { display: flex; align-items: center; gap: 28px; }
.topnav-links a { color: var(--advisory-paper); text-decoration: none; font-size: 14px; letter-spacing: 0.04em; transition: color 0.15s ease; }
.topnav-links a:hover { color: var(--advisory-gold); }
.topnav-links a.is-current { color: var(--advisory-gold); }
.topnav-cta { border: 1px solid var(--advisory-gold); color: var(--advisory-gold); border-radius: 2px; padding: 9px 18px; }
.topnav-cta:hover { background: var(--advisory-gold); color: var(--advisory-navy); }
@media (max-width: 560px) {
  .topnav-inner { padding-top: 14px; padding-bottom: 14px; }
  .topnav-brand img { height: 28px; }
  .topnav-links { gap: 14px; }
  .topnav-links a { font-size: 12.5px; }
  .topnav-cta { padding: 8px 13px; }
}
