/* Targeted first-paint guards: only the legacy Framer hero layers on the two affected routes. */
html:not(.gromatrix-profile-first-view-ready)
  section.framer-1yolvh5[data-framer-name="Hero Section"]
  > [data-framer-name="Heading Stack"],
html:not(.gromatrix-profile-first-view-ready)
  section.framer-1yolvh5[data-framer-name="Hero Section"]
  > .framer-1hcpb11-container {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html:not(.gromatrix-growth-first-view-ready)
  .framer-e8pghn
  > :not(.gromatrix-hero-copy),
html:not(.gromatrix-growth-first-view-ready)
  .framer-gc8zx9
  > :not(.gromatrix-nav-logo) {
  visibility: hidden !important;
  opacity: 0 !important;
}

.gromatrix-growth-first-view-ready .framer-gc8zx9 > .framer-12megna {
  display: none;
}

/* The retired Growth hero copy/contact never paints; the Framer particle scene remains intact. */
.framer-e8pghn > .gromatrix-hero-copy,
.gromatrix-hero-contact-restore,
a[href="tel: 2042949280"],
a[href="tel:2042949280"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Growth header CTA: remove only the leaked blue/purple focus rectangle. */
.framer-5Gjk6 a[data-framer-name="Arrow"],
.framer-5Gjk6 a[data-framer-name="Arrow"]:hover,
.framer-5Gjk6 a[data-framer-name="Arrow"]:focus,
.framer-5Gjk6 a[data-framer-name="Arrow"]:focus-visible,
.framer-5Gjk6 a[data-framer-name="Arrow"]:active,
.framer-5Gjk6 a[data-framer-name="Arrow"]:visited,
.framer-5Gjk6 a[data-framer-name="Arrow"] .framer-1xdmck8 {
  border-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.framer-5Gjk6 a[data-framer-name="Arrow"]:focus-visible .framer-1ywkosw {
  text-decoration: underline;
  text-decoration-color: #00b7ad;
  text-underline-offset: 4px;
}

/* Profile team links only: portraits, sizing, layout, and hover motion are unchanged. */
html.gromatrix-profile-first-view-ready a:has(img[src*="team-"]),
html.gromatrix-profile-first-view-ready a:has(img[src*="team-"]):hover,
html.gromatrix-profile-first-view-ready a:has(img[src*="team-"]):focus,
html.gromatrix-profile-first-view-ready a:has(img[src*="team-"]):focus-visible,
html.gromatrix-profile-first-view-ready a:has(img[src*="team-"]):active,
html.gromatrix-profile-first-view-ready a:has(img[src*="team-"]) > * {
  border-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* These are legacy template-only text groups; the animated Framer scene remains untouched. */
section.framer-1yolvh5[data-framer-name="Hero Section"]
  [data-framer-name="Subparagraph Stack"],
.framer-12xmem8 [data-framer-name="Info"] {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Existing footer, expanded with the same inherited palette and typography. */
footer.gm-footer-enhanced {
  box-sizing: border-box;
  padding: clamp(56px, 7vw, 92px) max(24px, 5vw) 28px !important;
}

.gm-footer-enhanced .gmf-shell {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 1440px;
  width: 100%;
}

.gm-footer-enhanced .gmf-grid {
  display: grid;
  gap: clamp(32px, 4vw, 64px);
  grid-template-columns: minmax(260px, 1.6fr) repeat(3, minmax(130px, 0.75fr)) minmax(190px, 1fr);
}

.gm-footer-enhanced .gmf-brand,
.gm-footer-enhanced .gmf-column {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.gm-footer-enhanced .gmf-logo-link {
  display: inline-flex;
  margin-bottom: 22px;
}

.gm-footer-enhanced .gmf-logo-link img {
  display: block;
  height: auto;
  max-width: 220px;
  width: 100%;
}

.gm-footer-enhanced .gmf-brand p,
.gm-footer-enhanced .gmf-contact p {
  color: inherit;
  font: inherit;
  line-height: 1.7;
  margin: 0;
  max-width: 430px;
  opacity: 0.72;
}

.gm-footer-enhanced .gmf-column h2 {
  color: inherit;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
  margin: 0 0 22px;
  text-transform: uppercase;
}

.gm-footer-enhanced .gmf-column a,
.gm-footer-enhanced .gmf-social a,
.gm-footer-enhanced .gmf-bottom a {
  color: inherit;
  font: inherit;
  line-height: 1.5;
  opacity: 0.72;
  text-decoration: none;
}

.gm-footer-enhanced .gmf-column a + a {
  margin-top: 13px;
}

.gm-footer-enhanced .gmf-column a:hover,
.gm-footer-enhanced .gmf-social a:hover,
.gm-footer-enhanced .gmf-bottom a:hover {
  opacity: 1;
}

.gm-footer-enhanced a:focus-visible {
  outline: 2px solid #05afa1;
  outline-offset: 4px;
}

.gm-footer-enhanced .gmf-social {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  margin-top: 24px;
}

.gm-footer-enhanced .gmf-bottom {
  align-items: center;
  border-top: 1px solid currentColor;
  display: flex;
  gap: 20px;
  justify-content: space-between;
  margin-top: clamp(44px, 6vw, 72px);
  padding-top: 26px;
}

.gm-footer-enhanced .gmf-bottom,
.gm-footer-enhanced .gmf-bottom nav {
  color: inherit;
  font: inherit;
  font-size: 14px;
}

.gm-footer-enhanced .gmf-bottom {
  opacity: 0.76;
}

.gm-footer-enhanced .gmf-copyright-text::before {
  content: attr(data-copy);
}

.gm-footer-enhanced .gmf-bottom nav {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 24px;
}

/* Contact hero copy only; layout, background, effects, and controls remain unchanged. */
.contact-hero .contact-hero-logo {
  display: block;
  height: auto;
  margin: 0 auto clamp(22px, 3.2vh, 38px);
  max-width: min(420px, 78vw);
  object-fit: contain;
  transform: translateY(-150px);
  width: 100%;
}

.contact-hero .contact-eyebrow,
.contact-hero .hero-inner > h1 {
  position: relative;
  top: -142px;
}

.contact-hero .contact-hero-description {
  color: var(--text-1);
  font-size: clamp(15px, 1.25vw, 18px);
  font-weight: 400;
  line-height: 1.7;
  margin: 0;
  max-width: 980px;
}

/* Growth Marketing section headings only: retain the design while improving multiline readability. */
.gm-services h2,
.gm-services .gm-capability__copy h2 {
  font-size: clamp(30px, 3.7vw, 54px) !important;
  line-height: 1.1 !important;
}

.gm-services .gm-together__highlight {
  font-size: clamp(30px, 3.6vw, 52px) !important;
  line-height: 1.1 !important;
}

/* Keep the decorative services grid behind readable foreground text zones. */
.gm-services-intro__copy,
.gm-capability__copy,
.gm-together__heading,
.gm-together__intro,
.gm-services-cta > * {
  position: relative;
  z-index: 3;
}

.gm-services-intro__copy::before,
.gm-together__heading::before,
.gm-together__intro::before {
  background: radial-gradient(ellipse at center, #000 0%, #000 78%, transparent 100%);
  content: "";
  inset: -28px -42px;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

.gm-capability__copy::before {
  background: radial-gradient(ellipse at 38% 50%, #000 0%, #000 88%, transparent 100%) !important;
}

/* Customer-journey paragraph alignment only. */
.framer-ov2zib:has(.gromatrix-clients-body) {
  align-items: center !important;
  width: min(760px, calc(100vw - 40px)) !important;
}

.gromatrix-clients-body,
.gromatrix-clients-body p {
  font-size: clamp(14px, 1.2vw, 17px) !important;
  line-height: 1.65 !important;
  margin: 20px auto 0 !important;
  max-width: 760px !important;
  text-align: center !important;
  width: 100% !important;
}

/* Reliable single-tap targets for the existing Profile and Services menus. */
.gromatrix-index-nav__menu-button,
.gromatrix-index-menu__close,
.framer-5Gjk6 .framer-eptx9q,
.gromatrix-menu-close {
  pointer-events: auto !important;
  position: relative;
  touch-action: manipulation;
  z-index: 10001;
}

@media (max-width: 1100px) {
  .gm-footer-enhanced .gmf-grid {
    grid-template-columns: minmax(260px, 1.5fr) repeat(2, minmax(160px, 1fr));
  }
}

@media (max-width: 720px) {
  footer.gm-footer-enhanced {
    padding: 52px 24px 24px !important;
  }

  .gm-footer-enhanced .gmf-grid {
    gap: 36px;
    grid-template-columns: 1fr;
  }

  .gm-footer-enhanced .gmf-logo-link img {
    max-width: 190px;
  }

  .gm-footer-enhanced .gmf-bottom {
    align-items: flex-start;
    flex-direction: column;
    line-height: 1.6;
  }

  .contact-hero .contact-hero-description {
    font-size: 15px;
    line-height: 1.55;
    max-width: 620px;
  }

  .contact-hero .contact-hero-logo {
    margin-bottom: 20px;
    max-width: min(285px, 72vw);
    transform: translateY(-92px);
  }

  .contact-hero .contact-eyebrow,
  .contact-hero .hero-inner > h1 {
    top: -86px;
  }
}

/* Center the first-screen copy on the Home, About, and Contact routes. */
:is(
  html body.home #root main .services-hero,
  html body.page #root main .services-hero:has(.hero-eyebrow),
  html body.page #root main .services-hero.contact-hero
) {
  align-items: center !important;
  display: flex !important;
  height: 100svh !important;
  justify-content: center !important;
  min-height: 100svh !important;
  padding: clamp(72px, 12.5vh, 90px) clamp(24px, 6vw, 80px) 0 !important;
}

:is(
  html body.home #root main .services-hero,
  html body.page #root main .services-hero:has(.hero-eyebrow),
  html body.page #root main .services-hero.contact-hero
) > .hero-inner {
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto !important;
  max-width: 1120px !important;
  text-align: center !important;
  transform: none !important;
  width: 100% !important;
}

html body.home #root main .services-hero h1 {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  text-align: center !important;
  width: 100% !important;
}

html body.home #root main .services-hero h1 .hero-heading-line,
html body.home #root main .services-hero h1 .hero-business-line {
  align-items: baseline !important;
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

html body.home #root main .services-hero h1 .hero-business-line .hero-rotate > span {
  text-align: left !important;
  width: 100% !important;
}

html body.home #root main .services-hero h1 .hero-business-line {
  transform: translateX(clamp(10px, 1.5vw, 20px)) !important;
}

html body.home #root main .services-hero .hero-desc {
  font-weight: 400 !important;
}

/* Keep the animated growth-story copy lighter and free of the oval card. */
html body.home #root .growth-story.is-enhanced .growth-story__heading {
  font-size: clamp(36px, 4.2vw, 76px) !important;
  line-height: 1 !important;
}

html body.home #root .growth-story.is-enhanced .growth-story__panel::before {
  display: none !important;
  content: none !important;
}

/* Keep the About-page closing statement completely revealed. */
html body.page #root .why-gromatrix__closing > p,
html body.page #root .why-gromatrix__closing > h3 {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  visibility: visible !important;
}

html body.home #root .navbar.scrolled .navbar-inner {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Keep the final homepage CTA crisp against the animated background. */
html body.home #root .cta-band {
  isolation: isolate;
  position: relative;
  z-index: 20;
}

html body.home #root .cta-band .cta-button {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: #00b7ad !important;
  border-color: #00a99f !important;
  box-shadow: none !important;
  color: #ffffff !important;
  filter: none !important;
  opacity: 1 !important;
  text-shadow: none !important;
  position: relative;
  z-index: 2;
}

html body.home #root .cta-band .cta-button:hover,
html body.home #root .cta-band .cta-button:focus-visible {
  background: #009e95 !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

@media (max-width: 720px) {
  :is(
    html body.home #root main .services-hero,
    html body.page #root main .services-hero:has(.hero-eyebrow),
    html body.page #root main .services-hero.contact-hero
  ) {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  html body.home #root main .services-hero h1 .hero-rotate {
    display: block !important;
    margin: 0 auto !important;
    min-height: 1.18em !important;
    min-width: 100% !important;
    text-align: center !important;
    transform: none !important;
    width: 100% !important;
  }

  html body.home #root main .services-hero h1 .hero-business-line {
    align-items: center !important;
    flex-direction: column !important;
    transform: none !important;
  }

  html body.home #root main .services-hero h1 .hero-rotate > span {
    left: 0 !important;
    text-align: center !important;
    width: 100% !important;
  }
}
