/* GEO hero heading tags: not a mockup file. On /geo the small eyebrow line
   "Best GEO & AI SEO Agency In Singapore" is now the page's h1 and the big
   line "Be the brand AI recommends." is an h2, the same pattern as /seo. The
   approved styles were written for a <p class="eyebrow"> and an <h1>, and
   generic heading rules (h1 sizes from design.css, journal-r9/r10/r12 and
   pages-r1; h2 sizes from design.css) would otherwise restyle both lines
   after the swap. This puts back the exact computed values the two lines had
   before, per breakpoint, so the page renders pixel-identical. The values
   are the ones the old <p> and <h1> resolved to (eyebrow 13px/1.8, .075em;
   11px/1.5, .045em on phones; display line 48px, 44px up to 1190px, 39px
   on phones) and are checked against the page as it was before the swap.
   Selectors are scoped to #geo-hero .hero-message, so nothing else changes. */

/* Eyebrow line, now an h1: keep the eyebrow typography. */
rd-body.page-geo #geo-hero .hero-message > h1.eyebrow {
  font-size: 13px;
  line-height: 1.8;
  font-weight: 600;
  letter-spacing: 0.075em;
  text-wrap: wrap;
}
@media (max-width: 767px) {
  rd-body.page-geo #geo-hero .hero-message > h1.eyebrow {
    font-size: 11px;
    line-height: 1.5;
    letter-spacing: 0.045em;
  }
}

/* Display line, now an h2: keep the hero h1 typography. */
rd-body.page-geo #geo-hero .hero-message > h2 {
  font-size: 48px;
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: -0.05em;
}
@media (max-width: 1190px) {
  rd-body.page-geo #geo-hero .hero-message > h2 {
    font-size: 44px;
  }
}
@media (max-width: 767px) {
  rd-body.page-geo #geo-hero .hero-message > h2 {
    font-size: 39px;
    letter-spacing: -0.045em;
  }
}
