/* about-us/terms-of-use - page-only rules, loaded AFTER about-us-family.css.
   Measured on /about-us/terms-of-use-wp (same layout and metrics as
   privacy-policy-wp at 1440 / 768 / 390, so the same rules). Nothing here reaches another
   About Us page. The policy text keeps our centred column: the reference
   runs it edge to edge with no side padding at 1440, which reads as a defect. */

/* policy sub-headings (h4, e.g. "Types of Data:"): live 20/600/24 #141414,
   20px under (every width) */
.zabu .zabu-legal .zabu-prose h4 { font-size: 20px; font-weight: 600; line-height: 24px; color: #141414; margin: 0 0 20px; }

/* ============================================================================
   DESKTOP (>=1025), measured at 1440
   ============================================================================ */
@media (min-width: 1024.02px) {
    /* hero: 500 tall, 65px sides, crumb 16, sub 24/32 with 38.4 under it */
    .zabu .zabu-hero { padding: 80px 65px; }
    .zabu .zabu-hero .zabu-crumb a,
    .zabu .zabu-hero .zabu-crumb .zabu-crumb-text { font-size: 16px; line-height: 26.4px; }
    .zabu .zabu-hero .zabu-hero-sub p { margin-bottom: 38.4px; }

    /* newsletter: 100px sides; content centred vertically in the 380 band
       (text at 104), 32px to the button (13 / 35) */
    .zabu .zabu-cta { padding: 0 100px; }
    .zabu .zabu-cta-inner { align-items: center; }
    .zabu .zabu-cta-copy { gap: 32px; }
    .zabu .zabu-cta-copy .zabu-btn { padding: 13px 35px; }
}

/* ============================================================================
   TABLET (767-1024), measured at 768
   ============================================================================ */
@media (min-width: 767.02px) and (max-width: 1024.98px) {
    /* hero: 500 tall, 65px sides; crumb 16, h1 41/600/65, sub 24/32 + 38.4 */
    .zabu .zabu-hero { padding: 80px 65px; }
    .zabu .zabu-hero .zabu-crumb a,
    .zabu .zabu-hero .zabu-crumb .zabu-crumb-text { font-size: 16px; line-height: 26.4px; }
    .zabu .zabu-hero .zabu-crumb { margin-bottom: 90px; }   /* live 111 crumb->h1 (the family tablet rule cuts it to 60) */
    .zabu .zabu-hero h1 { font-size: 41px; line-height: 65px; }
    .zabu .zabu-hero .zabu-hero-sub p { font-size: 24px; line-height: 32px; margin-bottom: 38.4px; }

    /* policy text: live scales it down at tablet - body 14.6/24.1, h2 22.8,
       h3 18.2, h4 18.2; table cells padded 10.2 / 14.6 */
    .zabu .zabu-legal .zabu-prose p,
    .zabu .zabu-legal .zabu-prose li,
    .zabu .zabu-legal .zabu-prose td,
    .zabu .zabu-legal .zabu-prose th { font-size: 14.592px; line-height: 24.08px; }
    .zabu .zabu-legal .zabu-prose p { margin-bottom: 23.35px; }
    .zabu .zabu-legal .zabu-prose h2 { font-size: 22.8px; line-height: 29.64px; }
    .zabu .zabu-legal .zabu-prose h3 { font-size: 18.24px; line-height: 23.71px; }
    .zabu .zabu-legal .zabu-prose h4 { font-size: 18.24px; line-height: 21.89px; }
    .zabu .zabu-legal .zabu-prose th,
    .zabu .zabu-legal .zabu-prose td { padding: 10.2px 14.6px; }

    /* newsletter: 30px sides, copy 32/32 centred vertically, 32 to the button */
    .zabu .zabu-cta { padding: 0 30px; }
    .zabu .zabu-cta-inner { align-items: center; }
    .zabu .zabu-cta-copy { gap: 32px; }
    .zabu .zabu-cta-copy p { font-size: 32px; line-height: 32px; }
    .zabu .zabu-cta-copy .zabu-btn { padding: 13px 35px; }
}

/* ============================================================================
   PHONE (<=767), measured at 390
   ============================================================================ */
@media (max-width: 767.01px) {
    /* hero: 500 tall, 40/30 padding, centred; crumb 16 (one row), 20 to the
       h1 31/600/40.3; sub 18/23.4 with 28.8 under it */
    .zabu .zabu-hero { padding: 40px 30px; min-height: 500px; gap: 20px; }
    .zabu .zabu-hero .zabu-crumb { margin: 0; flex-wrap: nowrap; white-space: nowrap; }
    .zabu .zabu-hero .zabu-crumb a,
    .zabu .zabu-hero .zabu-crumb .zabu-crumb-text { font-size: 16px; line-height: 26.4px; }
    .zabu .zabu-hero h1 { font-size: 31px; line-height: 40.3px; }
    .zabu .zabu-hero .zabu-hero-sub p { font-size: 18px; line-height: 23.4px; margin-bottom: 28.8px; }

    /* policy text: the wide table was forcing the text column to 621px on a
       390 screen, clipping every paragraph. Keep the column to the screen and
       let the TABLE scroll sideways on its own. Sizes as live: body 14.6/24.1,
       h2 22.8, h3 18.2, h4 18.2. */
    .zabu .zabu-legal .zabu-prose { width: 100%; max-width: 100%; min-width: 0; }
    .zabu .zabu-legal .zabu-prose > div { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .zabu .zabu-legal .zabu-prose table { min-width: 560px; }
    .zabu .zabu-legal .zabu-prose p,
    .zabu .zabu-legal .zabu-prose li,
    .zabu .zabu-legal .zabu-prose td,
    .zabu .zabu-legal .zabu-prose th { font-size: 14.592px; line-height: 24.08px; }
    .zabu .zabu-legal .zabu-prose p { margin-bottom: 23.35px; }
    .zabu .zabu-legal .zabu-prose h2 { font-size: 22.8px; line-height: 29.64px; }
    .zabu .zabu-legal .zabu-prose h3 { font-size: 18.24px; line-height: 23.71px; }
    .zabu .zabu-legal .zabu-prose h4 { font-size: 18.24px; line-height: 21.89px; }
    .zabu .zabu-legal .zabu-prose th,
    .zabu .zabu-legal .zabu-prose td { padding: 10.2px 14.6px; }

    /* newsletter: 380 tall, 20px sides; copy 20/30, 32 to a centred 324 button */
    .zabu .zabu-cta { padding: 0 20px; min-height: 380px; }
    .zabu .zabu-cta-inner { padding: 50px 0; align-items: center; }
    .zabu .zabu-cta-copy { gap: 32px; }
    .zabu .zabu-cta-copy p { font-size: 20px; line-height: 30px; }
    .zabu .zabu-cta-copy .zabu-btn { width: 324px; max-width: 100%; align-self: center; padding: 13px 35px; }
}

/* in-copy links: live sets them bold (700) at every width */
.zabu .zabu-legal .zabu-prose a { font-weight: 700; }
