/**
 * SIT Recycling — Standardised Compact Typography
 * Compatible with SIT Recycling Enterprise V6.3.11 and later V6.3.x themes.
 *
 * Installation (recommended):
 * WordPress Admin → Appearance → Customize → Additional CSS
 * Paste this entire file and Publish.
 *
 * Theme-file installation:
 * Save as assets/css/type-standardisation.css and enqueue it AFTER every
 * page-specific stylesheet so these rules remain the final typography layer.
 */

/* --------------------------------------------------------------------------
   1. One site-wide type scale
   -------------------------------------------------------------------------- */
:root {
  --sit-type-font-body: Inter, Aptos, "Segoe UI", Arial, sans-serif;
  --sit-type-font-heading: Poppins, Inter, Aptos, "Segoe UI", Arial, sans-serif;

  --sit-type-hero: clamp(2.5rem, 3.35vw, 3.375rem);      /* 40–54px */
  --sit-type-section: clamp(2rem, 2.7vw, 2.75rem);       /* 32–44px */
  --sit-type-feature: clamp(1.75rem, 2.15vw, 2.25rem);   /* 28–36px */
  --sit-type-card-title: 1.375rem;                        /* 22px */
  --sit-type-small-title: 1.125rem;                       /* 18px */

  --sit-type-lead: 1.0625rem;                            /* 17px */
  --sit-type-body: 1rem;                                 /* 16px */
  --sit-type-card-copy: 0.9375rem;                        /* 15px */
  --sit-type-ui: 0.875rem;                               /* 14px */
  --sit-type-caption: 0.75rem;                            /* 12px */

  --sit-leading-heading: 1.04;
  --sit-leading-body: 1.68;
  --sit-leading-compact: 1.45;
}

body.sit-recycle-site {
  font-family: var(--sit-type-font-body);
  font-size: var(--sit-type-body);
  line-height: var(--sit-leading-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.sit-recycle-site :where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--sit-type-font-heading) !important;
  font-weight: 750;
  text-wrap: balance;
}

/* --------------------------------------------------------------------------
   2. Public hero headings — same size on every route
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-home-hero h1,
  .sit-page-hero h1,
  .sit-v63-hero__copy h1,
  .sit-v631-collection-hero h1,
  .sit-v6311-hero h1,
  .sit-content h1,
  .sit-certificate-page__header h1,
  .sit-case-studies__header h1,
  .sit-case-study-single__header h1,
  .sit-v63-login h1
) {
  margin-top: 0;
  font-size: var(--sit-type-hero) !important;
  line-height: var(--sit-leading-heading) !important;
  letter-spacing: -0.045em !important;
}

/* Keep the intended line breaks/colour treatments without allowing giant text. */
body.sit-recycle-site :where(
  .sit-home-hero__title-row,
  .sit-home-hero h1 > span,
  .sit-page-hero h1 > span,
  .sit-v63-hero__copy h1 > span,
  .sit-v631-collection-hero h1 > span,
  .sit-v6311-hero h1 > span
) {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* --------------------------------------------------------------------------
   3. Section headings — one consistent H2 scale
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-section-heading h2,
  .sit-feature-copy h2,
  .sit-editorial-head h2,
  .sit-page-intro h2,
  .sit-special-page h2,
  .sit-final-cta h2,
  .sit-deliverables h2,
  .sit-v637-mission-head h2,
  .sit-v638-impact-heading h2,
  .sit-v638-proposal-layout > aside h2,
  .sit-v639-overview-copy h2,
  .sit-v639-section-heading h2,
  .sit-v639-boundary-grid h2,
  .sit-v639-evidence h2,
  .sit-v639-faq h2,
  .sit-v639-request-layout h2,
  .sit-v6310-section-heading h2,
  .sit-v6310-faq-grid h2,
  .sit-v6310-request-grid > aside h2,
  .sit-v6311-heading h2,
  .sit-v6311-overview h2,
  .sit-v6311-evidence h2,
  .sit-v6311-cta h2
) {
  font-size: var(--sit-type-section) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
}

/* --------------------------------------------------------------------------
   4. Large feature headings — below H2, above card titles
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-v638-participant-copy h3,
  .sit-v639-diagnostic-panel h3,
  .sit-v639-tracker-main h3,
  .sit-v6310-finder-panels h3,
  .sit-v6310-grade-panels h3,
  .sit-v6310-offer-standard h3,
  .sit-v6310-bulk-panel h3,
  .sit-v6311-route-panel__content h3
) {
  font-size: var(--sit-type-feature) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.035em !important;
}

/* --------------------------------------------------------------------------
   5. Card and component headings
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-service-card h3,
  .sit-route-card h3,
  .sit-feature-card h3,
  .sit-sector-card h3,
  .sit-v637-mission-card h3,
  .sit-v638-boundary-grid h3,
  .sit-v638-stage-grid h3,
  .sit-v638-decision-grid h3,
  .sit-v639-option-grid h3,
  .sit-v639-boundary-list h3,
  .sit-v6310-product-card h3,
  .sit-v6310-compare-grid h3,
  .sit-v6310-form-section__heading h3,
  .sit-v6311-gates__grid h3,
  .sit-v6311-applications__grid h3,
  .sit-v62-mission-grid h3,
  .sit-v62-sector-grid h3,
  .sit-v63-card-grid h3,
  .sit-v63-impact-grid h3,
  .sit-v63-route-grid h3,
  .sit-v631-preparation-grid h3
) {
  font-size: var(--sit-type-card-title) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.025em !important;
}

body.sit-recycle-site :where(
  .sit-v6310-journey-grid h3,
  .sit-v639-tracker-steps strong,
  .sit-v639-overview-principles strong,
  .sit-v638-impact-assurance strong,
  .sit-v6311-hero__proof h2
) {
  font-size: var(--sit-type-small-title) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.015em !important;
}

/* --------------------------------------------------------------------------
   6. Body, lead and card copy
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-home-hero__copy > p,
  .sit-page-hero__copy > p:not(.sit-eyebrow),
  .sit-v63-hero__copy > p,
  .sit-v631-collection-hero__copy > p,
  .sit-v6311-hero__copy > p,
  .sit-section-heading > p:last-child,
  .sit-page-intro p,
  .sit-special-page__intro > p,
  .sit-v638-impact-heading > p:last-child,
  .sit-v639-section-heading > p,
  .sit-v6310-section-heading > p,
  .sit-v6311-heading > p:last-child,
  .sit-final-cta p
) {
  font-size: var(--sit-type-lead) !important;
  line-height: 1.72 !important;
}

body.sit-recycle-site :where(
  .sit-home-v62,
  .sit-page,
  .sit-v63-page:not(.sit-v63-portal-dashboard),
  .sit-v6311-circular
) :where(p:not(.sit-eyebrow), li, dd, dt, blockquote) {
  font-size: var(--sit-type-body);
  line-height: var(--sit-leading-body);
}

body.sit-recycle-site :where(
  .sit-service-card p,
  .sit-route-card p,
  .sit-feature-card p,
  .sit-sector-card p,
  .sit-v637-mission-card p,
  .sit-v638-boundary-grid li,
  .sit-v638-stage-grid p,
  .sit-v638-role-details p,
  .sit-v638-decision-grid li,
  .sit-v639-diagnostic-panel li,
  .sit-v639-option-grid li,
  .sit-v6310-product-card p,
  .sit-v6310-compare-grid p,
  .sit-v6310-grade-panels aside p,
  .sit-v6310-journey-grid p,
  .sit-v6311-gates__grid p,
  .sit-v6311-applications__grid p
) {
  font-size: var(--sit-type-card-copy) !important;
  line-height: 1.62 !important;
}

/* --------------------------------------------------------------------------
   7. Navigation, buttons, labels and forms
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-primary-nav > ul > li > a,
  .sit-primary-nav > ul > li > button,
  .sit-mobile-nav a,
  .sit-mobile-nav button,
  .sit-v631-collection-header nav a,
  .sit-v638-impact-nav a,
  .sit-v639-repair-nav a,
  .sit-v6310-shop-nav a,
  .sit-v6311-nav a
) {
  font-size: var(--sit-type-ui) !important;
  line-height: 1.35 !important;
}

body.sit-recycle-site :where(
  .sit-button,
  .sit-text-link,
  .sit-header-cta,
  button,
  input[type="submit"]
) {
  font-size: var(--sit-type-ui) !important;
}

body.sit-recycle-site :where(
  .sit-eyebrow,
  [class*="__kicker"],
  [class*="-kicker"],
  [class*="__label"],
  [class*="-label"],
  figcaption,
  small
) {
  font-size: var(--sit-type-caption);
  line-height: var(--sit-leading-compact);
}

body.sit-recycle-site :where(
  .sit-form label,
  .sit-v63-request-card label,
  .sit-v6310-shop-request label,
  .wpforms-container label,
  .wpcf7 label,
  .gform_wrapper label
) {
  font-size: var(--sit-type-ui) !important;
  line-height: 1.45 !important;
}

body.sit-recycle-site :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
  select,
  textarea,
  .wpforms-container input,
  .wpforms-container select,
  .wpforms-container textarea,
  .wpcf7 input,
  .wpcf7 select,
  .wpcf7 textarea,
  .gform_wrapper input,
  .gform_wrapper select,
  .gform_wrapper textarea
) {
  font-family: var(--sit-type-font-body) !important;
  font-size: var(--sit-type-body) !important;
  line-height: 1.5 !important;
}

body.sit-recycle-site :where(
  .sit-v631-form-heading h2,
  .sit-form__header h2,
  .sit-form-heading h2,
  .sit-v63-request-card > header h2
) {
  font-size: clamp(1.75rem, 2.3vw, 2.25rem) !important;
  line-height: 1.12 !important;
}

body.sit-recycle-site :where(
  .sit-v631-form-section h3,
  .sit-form-section h3,
  .sit-v6310-form-section__heading h3
) {
  font-size: 1.25rem !important;
  line-height: 1.25 !important;
}

/* --------------------------------------------------------------------------
   8. Footer typography — keep utility headings compact
   -------------------------------------------------------------------------- */
body.sit-recycle-site .sit-site-footer :where(h2, h3) {
  font-size: 1rem !important;
  line-height: 1.3 !important;
  letter-spacing: 0.08em !important;
}

body.sit-recycle-site :where(
  .sit-footer-social h2,
  .sit-footer-follow h2,
  .sit-footer-cta h2
) {
  font-size: clamp(1.75rem, 2.4vw, 2.25rem) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.035em !important;
}

body.sit-recycle-site .sit-site-footer :where(p, li, a, span) {
  font-size: var(--sit-type-card-copy);
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   9. Preserve dense illustrative dashboards and protected portal UI
   -------------------------------------------------------------------------- */
body.sit-recycle-site :where(
  .sit-v62-dashboard,
  .sit-v638-impact-dashboard,
  .sit-v63-portal-dashboard
) :where(p, li, dd, dt, span, small, em, a, button) {
  font-size: 0.75rem;
  line-height: 1.45;
}

body.sit-recycle-site .sit-v63-portal-dashboard h1 {
  font-size: clamp(2rem, 3vw, 2.5rem) !important;
  line-height: 1.05 !important;
}

body.sit-recycle-site :where(
  .sit-v62-dashboard h2,
  .sit-v638-impact-dashboard h2,
  .sit-v63-portal-dashboard h2
) {
  font-size: 1.5rem !important;
  line-height: 1.15 !important;
}

body.sit-recycle-site :where(
  .sit-v62-dashboard h3,
  .sit-v638-impact-dashboard h3,
  .sit-v63-portal-dashboard h3
) {
  font-size: 1rem !important;
  line-height: 1.25 !important;
}

/* --------------------------------------------------------------------------
   10. Responsive scale
   -------------------------------------------------------------------------- */
@media (max-width: 1100px) {
  :root {
    --sit-type-hero: clamp(2.375rem, 5vw, 3rem);      /* 38–48px */
    --sit-type-section: clamp(1.875rem, 4vw, 2.375rem); /* 30–38px */
    --sit-type-feature: clamp(1.625rem, 3.3vw, 2rem); /* 26–32px */
  }
}

@media (max-width: 767px) {
  :root {
    --sit-type-hero: clamp(2.125rem, 10vw, 2.625rem);  /* 34–42px */
    --sit-type-section: clamp(1.75rem, 8.5vw, 2.125rem); /* 28–34px */
    --sit-type-feature: clamp(1.5rem, 7vw, 1.875rem);  /* 24–30px */
    --sit-type-card-title: 1.25rem;                     /* 20px */
    --sit-type-lead: 1rem;                              /* 16px */
    --sit-type-body: 1rem;                              /* 16px */
    --sit-type-card-copy: 0.9375rem;                    /* 15px */
  }

  body.sit-recycle-site :where(
    .sit-home-hero h1,
    .sit-page-hero h1,
    .sit-v63-hero__copy h1,
    .sit-v631-collection-hero h1,
    .sit-v6311-hero h1
  ) {
    max-width: 13ch;
  }

  body.sit-recycle-site :where(
    .sit-primary-nav > ul > li > a,
    .sit-primary-nav > ul > li > button,
    .sit-mobile-nav a,
    .sit-mobile-nav button
  ) {
    font-size: 0.9375rem !important;
  }
}
