/*
 * CRP "Spacious" layer (26 Sep 2026)
 * Larger type, roomier spacing, lighter fonts (Manrope + Inter) and a light second band, layered over
 * style.css. Same palette and layout.
 * To revert: delete this file (functions.php only loads it when it exists).
 */

/* 0. Lighter typefaces (27 Sep 2026): Manrope headings, Inter body, self-hosted like the originals.
   The weight ranges are capped on purpose: style.css asks for 700-900 in ~90 places, and a capped
   variable font renders all of those at the cap, so every heading gets slimmer without touching each rule. */
@font-face {
  font-family: "Manrope";
  src: url("../../fonts/Manrope-var.woff2") format("woff2");
  font-weight: 300 650;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../../fonts/Inter-var.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-heading: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --wp--preset--font-family--heading: var(--font-heading);
  --wp--preset--font-family--body: var(--font-body);
}

html {
  font-synthesis-weight: none; /* never fake a bolder weight than the capped range */
}

h1, h2, h3, h4, h5, h6 {
  letter-spacing: -0.02em;
}

/* 1. Tokens: type scale up one step, section and card spacing up ~25-35% */
:root {
  --t-xs: 0.875rem;   /* 13 -> 14px */
  --t-sm: 1rem;       /* 15 -> 16px */
  --t-base: 1.125rem; /* 17 -> 18px */
  --t-md: 1.25rem;    /* 19 -> 20px */
  --t-lg: 1.5rem;     /* 22 -> 24px */
  --t-xl: 1.875rem;   /* 28 -> 30px */
  --t-2xl: clamp(2rem, 3.6vw, 2.875rem);   /* max 40 -> 46px */
  --t-3xl: clamp(2.5rem, 5.4vw, 4rem);     /* max 58 -> 64px */
  --t-fig: clamp(2.5rem, 4.6vw, 3.625rem);

  --space-4: 1.125rem;
  --space-5: 2rem;
  --space-6: 2.5rem;
  --space-7: 3.75rem;
  --space-8: 5rem;
  --space-9: 7.5rem;
  --space-10: 10rem;

  --container: 1200px;
  --gutter: 32px;
  --band-y: clamp(4.5rem, 9vw, 8.5rem);

  /* Block editor presets used inside page content */
  --wp--preset--font-size--small: var(--t-sm);
  --wp--preset--font-size--xs: var(--t-xs);
  --wp--preset--font-size--sm: var(--t-sm);
  --wp--preset--font-size--base: var(--t-base);
  --wp--preset--font-size--md: var(--t-md);
  --wp--preset--font-size--lg: var(--t-lg);
  --wp--preset--font-size--xl: var(--t-xl);
  --wp--preset--font-size--2xl: clamp(2rem, 3.6vw, 2.5rem);
  --wp--preset--font-size--3xl: clamp(2.5rem, 5vw, 3.5rem);
  --wp--style--block-gap: 1.75rem;
}

@media (max-width: 640px) {
  :root {
    --gutter: 20px;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --band-y: 4rem;
  }
}

/* 2. Reading rhythm */
body {
  line-height: 1.7;
}

p, ul, ol {
  margin-bottom: 1.25em;
}

li + li {
  margin-top: 0.35em;
}

h1 {
  margin-bottom: var(--space-6);
}

h2 {
  margin-bottom: var(--space-5);
}

h3 {
  margin-top: var(--space-7);
  margin-bottom: var(--space-3);
}

.crp-hero .crp-lead {
  font-size: var(--t-md);
  line-height: 1.65;
}

/* Page headlines were capped at 44-50px */
.crp-hero h1.wp-block-heading {
  font-size: clamp(2.5rem, 4.4vw, 3.75rem);
  line-height: 1.08;
  margin-bottom: var(--space-5);
}

.crp-band--head h1,
.crp-band--head h1.wp-block-heading {
  font-size: clamp(2.25rem, 4.6vw, 3.5rem);
  line-height: 1.08;
}

.crp-free-report-hero h1.wp-block-heading {
  font-size: clamp(2.25rem, 4vw, 3.25rem);
}

@media (max-width: 640px) {
  .crp-hero h1.wp-block-heading,
  .crp-band--head h1,
  .crp-band--head h1.wp-block-heading {
    font-size: clamp(2rem, 8.5vw, 2.4rem) !important;
    line-height: 1.12 !important;
  }
}

/* 3. Readable floor for small labels: badges and kickers were 10-12px */
.crp-ai-badge,
.crp-doctor-trust-card__badge,
.crp-matrix-card-badge--crp,
.crp-matrix-card-badge--old,
.crp-page-badge,
.crp-result__badge,
.crp-contact-pill,
.crp-pricing-badge,
.crp-matrix-badge,
.crp-hero__kicker,
.crp-subpage-kicker,
.crp-free-report-hero .crp-hero__kicker,
.crp-cell-addon {
  font-size: 0.8125rem;
}

.crp-score__d,
.crp-pages figure::after {
  font-size: 0.875rem;
}

/* The hero "sample diagnostic" (.crp-console) is a picture of a report: left at its own sizes on purpose,
   larger text there overlaps the grid. */

.crp-ch__sub,
.crp-who__quote cite {
  font-size: var(--t-sm);
}

.crp-proof li span,
.crp-proof-note p {
  font-size: var(--t-sm) !important;
}

.crp-proof-note {
  padding: 1.25rem 1.75rem !important;
}

/* Secondary text that sat at 13-14px */
.crp-form-trust__item,
.crp-pricing-sub,
.crp-pricing-rate small,
.crp-hero-trust__row,
.crp-redaction,
.crp-pages figcaption span,
.crp-proof li span,
.crp-proof-note p,
.crp-contact-info-card__text,
.crp-doctor-trust-card__desc,
.crp-matrix-item,
.crp-btn--ghost {
  font-size: var(--t-sm);
}

/* Tables */
.crp-table th,
.crp-table td,
.wp-block-table th,
.wp-block-table td,
.crp-table--pricing th,
.crp-table--pricing td {
  font-size: var(--t-sm);
  padding-top: 0.85rem;
  padding-bottom: 0.85rem;
}

.crp-table thead th,
.wp-block-table thead th {
  font-size: 0.875rem;
}

/* 4. Columns and grids inside page content */
.wp-block-columns {
  gap: var(--space-6);
}

@media (max-width: 781px) {
  .wp-block-columns {
    gap: var(--space-5);
  }
}

.crp-hero h1.wp-block-heading,
.crp-band--head h1 {
  letter-spacing: -0.025em;
}

/* 5. Contrast rhythm: the "2026 search shift" band was a second dark block straight after the dark hero.
   Now light, so the page alternates. Colours: text 12-16:1, badges and icons 4.5:1+ on their backgrounds. */
.crp-band--seo-shift {
  background: #FFFFFF !important;
  border-top: 1px solid #E2E8F0 !important;
  border-bottom: 1px solid #E2E8F0 !important;
}

.crp-band--seo-shift .crp-matrix-badge {
  color: #0F766E;
  background: #F0FDFA;
  border-color: #99F6E4;
}

.crp-band--seo-shift .crp-matrix-title,
.crp-band--seo-shift .crp-matrix-card-title--old,
.crp-band--seo-shift .crp-matrix-card-title--crp {
  color: #0F172A;
}

.crp-band--seo-shift .crp-matrix-sub {
  color: #475569;
}

.crp-band--seo-shift .crp-matrix-card--old {
  background: #FFFFFF;
  border: 1px solid #FECACA;
  border-top: 3px solid #EF4444;
  box-shadow: 0 10px 30px -18px rgba(15, 23, 42, 0.18);
}

.crp-band--seo-shift .crp-matrix-card--crp {
  background: #F0FDFA;
  border: 1px solid #99F6E4;
  border-top: 3px solid #0D9488;
  box-shadow: 0 16px 40px -20px rgba(13, 148, 136, 0.35);
}

.crp-band--seo-shift .crp-matrix-card-badge--old {
  color: #B91C1C;
}

.crp-band--seo-shift .crp-matrix-card-badge--crp {
  color: #0F766E;
}

.crp-band--seo-shift .crp-matrix-item--old {
  color: #475569;
}

.crp-band--seo-shift .crp-matrix-item--old strong {
  color: #1E293B;
}

.crp-band--seo-shift .crp-matrix-icon--old {
  color: #DC2626;
}

.crp-band--seo-shift .crp-matrix-item--crp {
  color: #334155;
}

.crp-band--seo-shift .crp-matrix-item--crp strong {
  color: #0F172A;
}

.crp-band--seo-shift .crp-matrix-icon--crp {
  color: #0D9488;
}