/* Covozi v1.64 — Creators / Fans / Advertisers responsive parity.
 * Goals:
 *  - give the three marketing pages the same usable <=900px hamburger navigation as Home;
 *  - reuse the successful Home mobile typography metrics rather than shrinking desktop type;
 *  - keep tablet/mobile cards readable, touchable and intentionally stacked;
 *  - preserve every approved desktop composition above 900px.
 */

.covozi-creators-v153-topbar__menu-toggle,
.covozi-creators-v153-topbar__mobile,
.covozi-fans-v156-topbar__menu-toggle,
.covozi-fans-v156-topbar__mobile,
.covozi-advertisers-v157-topbar__menu-toggle,
.covozi-advertisers-v157-topbar__mobile {
  display: none;
}

@media (max-width: 900px) {
  .covozi-creators-v153-topbar,
  .covozi-fans-v156-topbar,
  .covozi-advertisers-v157-topbar {
    overflow: visible !important;
  }

  .covozi-creators-v153-topbar__shell,
  .covozi-fans-v156-topbar__shell,
  .covozi-advertisers-v157-topbar__shell {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) auto !important;
    align-items: center !important;
    width: min(100% - 28px, 720px) !important;
    gap: 10px !important;
  }

  .covozi-creators-v153-topbar__menu-toggle,
  .covozi-fans-v156-topbar__menu-toggle,
  .covozi-advertisers-v157-topbar__menu-toggle {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(7,25,54,.12);
    border-radius: 11px;
    background: #fff;
    color: #071936;
    font: 800 20px/1 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(7,25,54,.045);
  }
  .covozi-creators-v153-topbar__menu-toggle:focus-visible,
  .covozi-fans-v156-topbar__menu-toggle:focus-visible,
  .covozi-advertisers-v157-topbar__menu-toggle:focus-visible {
    outline: 4px solid rgba(255,198,41,.42);
    outline-offset: 2px;
  }

  .covozi-creators-v153-topbar__brand,
  .covozi-fans-v156-topbar__brand,
  .covozi-advertisers-v157-topbar__brand {
    justify-self: start !important;
    min-width: 0 !important;
  }
  .covozi-creators-v153-topbar__cta,
  .covozi-fans-v156-topbar__cta,
  .covozi-advertisers-v157-topbar__cta {
    justify-self: end !important;
  }

  .covozi-creators-v153-topbar__mobile,
  .covozi-fans-v156-topbar__mobile,
  .covozi-advertisers-v157-topbar__mobile {
    position: absolute;
    z-index: 10050;
    top: calc(100% + 8px);
    left: max(14px, env(safe-area-inset-left));
    right: max(14px, env(safe-area-inset-right));
    display: block;
    padding: 10px;
    border: 1px solid rgba(7,25,54,.12);
    border-radius: 16px;
    background: rgba(255,255,255,.985);
    box-shadow: 0 18px 42px rgba(7,25,54,.16);
    backdrop-filter: blur(14px);
  }
  .covozi-creators-v153-topbar__mobile[hidden],
  .covozi-fans-v156-topbar__mobile[hidden],
  .covozi-advertisers-v157-topbar__mobile[hidden] {
    display: none !important;
  }
  .covozi-creators-v153-topbar__mobile nav,
  .covozi-fans-v156-topbar__mobile nav,
  .covozi-advertisers-v157-topbar__mobile nav {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 6px;
  }
  .covozi-creators-v153-topbar__mobile a,
  .covozi-fans-v156-topbar__mobile a,
  .covozi-advertisers-v157-topbar__mobile a {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    border-radius: 11px;
    color: #071936;
    text-decoration: none;
    font: 750 14px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  }
  .covozi-creators-v153-topbar__mobile a.is-active,
  .covozi-fans-v156-topbar__mobile a.is-active,
  .covozi-advertisers-v157-topbar__mobile a.is-active,
  .covozi-creators-v153-topbar__mobile a:hover,
  .covozi-fans-v156-topbar__mobile a:hover,
  .covozi-advertisers-v157-topbar__mobile a:hover,
  .covozi-creators-v153-topbar__mobile a:focus-visible,
  .covozi-fans-v156-topbar__mobile a:focus-visible,
  .covozi-advertisers-v157-topbar__mobile a:focus-visible {
    background: #fff7d8;
    outline: none;
  }

  /* Tablet hierarchy: do not let desktop display type dominate an 820–900px viewport. */
  .covozi-creators-v153 h1,
  .covozi-creators-v153 .hero-copy h1,
  .covozi-fans-progress .covozi-fans-hero h1,
  .covozi-advertisers-v157 .covozi-advertisers-hero h1 {
    font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
    font-size: clamp(38px,6vw,48px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    text-wrap: balance;
  }
  .covozi-creators-v153 h2,
  .covozi-fans-progress .covozi-fans-heading h2,
  .covozi-fans-progress .covozi-fans-final h2,
  .covozi-advertisers-v157 .covozi-advertisers-heading h2,
  .covozi-advertisers-v157 .covozi-advertisers-final h2 {
    font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
    font-size: clamp(31px,4.6vw,40px) !important;
    line-height: 1.11 !important;
    letter-spacing: -.03em !important;
    text-wrap: balance;
  }
  .covozi-creators-v153 .lead,
  .covozi-fans-progress .covozi-fans-lead,
  .covozi-fans-progress .covozi-fans-heading>p,
  .covozi-advertisers-v157 .covozi-advertisers-lead,
  .covozi-advertisers-v157 .covozi-advertisers-heading>p {
    font-size: 17px !important;
    line-height: 1.58 !important;
  }

  /* Keep support rails readable instead of miniature desktop summaries. */
  .covozi-creators-v153 .lead-tool p,
  .covozi-creators-v153 .path-meta p,
  .covozi-creators-v153 .wwm-mini p,
  .covozi-fans-progress .covozi-fans-benefits article,
  .covozi-fans-progress .covozi-fans-tool-row>span,
  .covozi-fans-progress .covozi-fans-answer-grid article,
  .covozi-advertisers-v157 .covozi-advertisers-benefits article,
  .covozi-advertisers-v157 .covozi-advertisers-tool-row>span {
    font-size: 14.5px !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 640px) {
  .covozi-creators-v153,
  .covozi-fans-progress,
  .covozi-advertisers-v157 {
    --covozi-mobile-heading: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  }

  .covozi-creators-v153-topbar,
  .covozi-fans-v156-topbar,
  .covozi-advertisers-v157-topbar {
    height: 70px !important;
    min-height: 70px !important;
  }
  .covozi-creators-v153-topbar__shell,
  .covozi-fans-v156-topbar__shell,
  .covozi-advertisers-v157-topbar__shell {
    grid-template-columns: 40px minmax(0,1fr) auto !important;
    width: calc(100% - 20px) !important;
    gap: 8px !important;
  }
  .covozi-creators-v153-topbar__menu-toggle,
  .covozi-fans-v156-topbar__menu-toggle,
  .covozi-advertisers-v157-topbar__menu-toggle {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    font-size: 19px;
  }
  .covozi-creators-v153-topbar__brand,
  .covozi-fans-v156-topbar__brand,
  .covozi-advertisers-v157-topbar__brand {
    flex-basis: 108px !important;
    width: 108px !important;
    height: 38px !important;
  }
  .covozi-creators-v153-topbar__brand img,
  .covozi-fans-v156-topbar__brand img,
  .covozi-advertisers-v157-topbar__brand img {
    width: 108px !important;
    max-width: 108px !important;
  }
  .covozi-creators-v153-topbar__cta,
  .covozi-fans-v156-topbar__cta,
  .covozi-advertisers-v157-topbar__cta {
    min-height: 44px !important;
    padding: 0 13px !important;
    border-radius: 10px !important;
    font-size: 13.5px !important;
  }
  .covozi-creators-v153-topbar__mobile nav,
  .covozi-fans-v156-topbar__mobile nav,
  .covozi-advertisers-v157-topbar__mobile nav {
    grid-template-columns: 1fr;
  }
  .covozi-creators-v153-topbar__mobile a,
  .covozi-fans-v156-topbar__mobile a,
  .covozi-advertisers-v157-topbar__mobile a {
    min-height: 46px;
    font-size: 14px;
  }

  /* Match the Home mobile reading hierarchy. */
  .covozi-creators-v153 h1,
  .covozi-creators-v153 .hero-copy h1,
  .covozi-fans-progress .covozi-fans-hero h1,
  .covozi-advertisers-v157 .covozi-advertisers-hero h1 {
    font-family: var(--covozi-mobile-heading) !important;
    font-size: clamp(35px,9.4vw,41px) !important;
    line-height: 1.075 !important;
    letter-spacing: -.038em !important;
    font-weight: 800 !important;
    text-wrap: pretty;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }
  .covozi-creators-v153 h2,
  .covozi-fans-progress .covozi-fans-heading h2,
  .covozi-fans-progress .covozi-fans-final h2,
  .covozi-advertisers-v157 .covozi-advertisers-heading h2,
  .covozi-advertisers-v157 .covozi-advertisers-final h2 {
    font-family: var(--covozi-mobile-heading) !important;
    font-size: clamp(29px,7.8vw,34px) !important;
    line-height: 1.11 !important;
    letter-spacing: -.032em !important;
    font-weight: 800 !important;
    text-wrap: pretty;
  }
  .covozi-creators-v153 h3,
  .covozi-fans-progress h3,
  .covozi-advertisers-v157 h3 {
    font-family: var(--covozi-mobile-heading) !important;
    font-size: 22px !important;
    line-height: 1.18 !important;
    letter-spacing: -.02em !important;
  }

  .covozi-creators-v153 section,
  .covozi-fans-progress .covozi-fans-section,
  .covozi-advertisers-v157 .covozi-advertisers-section {
    padding-top: 54px !important;
    padding-bottom: 64px !important;
  }
  .covozi-creators-v153 #creator-hero,
  .covozi-fans-progress .covozi-fans-hero,
  .covozi-advertisers-v157 .covozi-advertisers-hero {
    padding-top: 42px !important;
    padding-bottom: 62px !important;
  }
  .covozi-creators-v153 .lead,
  .covozi-creators-v153 .copy,
  .covozi-fans-progress .covozi-fans-support,
  .covozi-fans-progress .covozi-fans-heading>p,
  .covozi-advertisers-v157 .covozi-advertisers-support,
  .covozi-advertisers-v157 .covozi-advertisers-heading>p {
    font-size: 16px !important;
    line-height: 1.58 !important;
  }

  .covozi-creators-v153 .eyebrow,
  .covozi-fans-progress .covozi-fans-eyebrow,
  .covozi-advertisers-v157 .covozi-advertisers-eyebrow {
    font-size: 11px !important;
    line-height: 1.2 !important;
    letter-spacing: .115em !important;
    padding: 9px 13px !important;
  }

  .covozi-creators-v153 .btn,
  .covozi-fans-progress .covozi-fans-button,
  .covozi-advertisers-v157 .covozi-advertisers-button {
    min-height: 52px !important;
    font-size: 15.5px !important;
  }

  /* Remove accidental tiny support text caused by desktop card density. */
  .covozi-creators-v153 .lead-tool p,
  .covozi-creators-v153 .broadcast-tip,
  .covozi-creators-v153 .wwm-mini p,
  .covozi-fans-progress .covozi-fans-benefits article,
  .covozi-fans-progress .covozi-fans-tool-row>span,
  .covozi-fans-progress .covozi-fans-answer-grid article,
  .covozi-advertisers-v157 .covozi-advertisers-benefits article,
  .covozi-advertisers-v157 .covozi-advertisers-tool-row>span,
  .covozi-advertisers-v157 .covozi-advertisers-pricing p {
    font-size: 14.5px !important;
    line-height: 1.5 !important;
  }

  /* Cards should read as individual mobile surfaces, without excessive inset. */
  .covozi-creators-v153 .product-art,
  .covozi-creators-v153 .hub-art,
  .covozi-creators-v153 .wwm-art,
  .covozi-creators-v153 .broadcast-ui,
  .covozi-fans-progress .covozi-fans-visual,
  .covozi-advertisers-v157 .covozi-advertisers-visual {
    border-radius: 18px !important;
  }
}

@media (max-width: 370px) {
  .covozi-creators-v153-topbar__brand,
  .covozi-fans-v156-topbar__brand,
  .covozi-advertisers-v157-topbar__brand {
    width: 98px !important;
    min-width: 98px !important;
    flex-basis: 98px !important;
  }
  .covozi-creators-v153-topbar__brand img,
  .covozi-fans-v156-topbar__brand img,
  .covozi-advertisers-v157-topbar__brand img {
    width: 98px !important;
    max-width: 98px !important;
  }
  .covozi-creators-v153-topbar__cta,
  .covozi-fans-v156-topbar__cta,
  .covozi-advertisers-v157-topbar__cta {
    padding-inline: 11px !important;
    font-size: 13px !important;
  }
}