/* Shared hero scale based on the approved Instagram service pages. */
:root {
  --heading-display: clamp(2.65rem, 4.55vw, 5rem);
  --heading-page: clamp(2.4rem, 4.1vw, 4.25rem);
  --heading-editorial: clamp(2.15rem, 3.7vw, 3.5rem);
  --heading-tracking: -.055em;
}

main :is(.hero, .service-hero, .followers-hero, .ig-hero) h1,
main .followers-hero-copy h1 {
  font-size: var(--heading-display);
  line-height: 1.04;
  letter-spacing: var(--heading-tracking);
  text-wrap: balance;
}

main :is(.simple-hero, .about-hero, .contact-hero, .faq-hero, .policy-hero, .tools-hero, .tool-hero, .thank-you-hero) h1 {
  font-size: var(--heading-page);
  line-height: 1.08;
  letter-spacing: var(--heading-tracking);
  text-wrap: balance;
}

main :is(.blog-hero, .article-hero) h1 {
  font-size: var(--heading-editorial);
  line-height: 1.12;
  letter-spacing: -.045em;
  text-wrap: balance;
}

main .home-hero h1 { max-width: 640px; }
main .article-hero h1 { margin: 16px 0 20px; }
main .article-hero { padding-block: 32px 52px; }
main .article-hero .breadcrumbs { margin-bottom: 30px; }
main .article-hero p { font-size: 1rem; line-height: 1.75; }
main .article-body { padding-top: 52px; }
main .article-meta { font-size: .78rem; line-height: 1.8; }

/* Catalog grouping keeps the two platforms equally easy to explore. */
.home-service-platform { margin-top: 42px; scroll-margin-top: 28px; }
.home-service-platform + .home-service-platform { margin-top: 64px; }
.home-platform-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 19px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--line);
}
.home-platform-heading h3 { margin: 0; font-size: 1.65rem; letter-spacing: -.035em; }
.home-platform-heading p { margin: 0; max-width: 560px; color: var(--muted); font-size: .85rem; line-height: 1.6; }
.home-platform-shortcuts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 28px auto 34px;
  max-width: 920px;
}
.home-platform-shortcuts > strong { flex: 0 0 100%; margin-bottom: 5px; color: #d5c7ff; font-size: .85rem; }
.home-platform-shortcuts > a {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border: 1px solid #ffffff28;
  border-radius: 12px;
  background: #ffffff09;
  color: #e8e7fa;
  font-size: .78rem;
  font-weight: 700;
  transition: background .2s, border-color .2s;
}
.home-platform-shortcuts > a:hover { background: #ffffff16; border-color: #a997e4; }
.home-platform-shortcuts > a:focus-visible { outline: 3px solid #a9cbff; outline-offset: 4px; }

@media (max-width: 900px) {
  :root { --heading-display: clamp(2.65rem, 6.6vw, 4.4rem); }
}
@media (max-width: 620px) {
  :root {
    --heading-display: clamp(2.45rem, 10.7vw, 3.5rem);
    --heading-page: clamp(2.15rem, 9.5vw, 3rem);
    --heading-editorial: clamp(1.95rem, 8.3vw, 2.65rem);
  }
  main .article-hero { padding-block: 24px 36px; }
  main .article-body { padding-top: 36px; }
  main .article-hero .breadcrumbs { margin-bottom: 24px; }
  .home-platform-heading { display: block; }
  .home-platform-heading p { margin-top: 9px; }
  .home-platform-shortcuts { justify-content: flex-start; text-align: left; }
}
