/*
 * Googsi shared design system / v1.1.57.
 * One cached, site-wide definition for all page heroes. Historical page CSS
 * may retain sector-specific illustrations, but it no longer sets hero paint.
 * Shared selectors use one explicit .googsi-shared-hero marker in templates.
 */
:root {
  --googsi-navy: #111e3b;
  --googsi-navy-ink: #14223e;
  --googsi-coral: #fa5569;
  --googsi-coral-hover: #d83b50;
  --googsi-hero-muted: #dbe3f3;
  --googsi-panel-border: #e0e7ef;
  --googsi-panel-bg: #fff;
  --googsi-soft-bg: #f6f8fb;
  --googsi-content-max: 1160px;
}

/* Page-specific legacy gradients and glow must never repaint a hero. */
body .googsi-shared-hero.googsi-shared-hero.googsi-shared-hero {
  background: var(--googsi-navy) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
  isolation: isolate;
}
body .googsi-shared-hero.googsi-shared-hero.googsi-shared-hero::before,
body .googsi-shared-hero.googsi-shared-hero.googsi-shared-hero::after {
  content: none !important;
  display: none !important;
}
body .googsi-shared-hero :is(.hero-grid-overlay, .hero-ring, .pizza-hero-glow, .pizza-showcase-aura) {
  display: none !important;
}

/* Common scale and readable text. Sector illustration content is unchanged. */
body .googsi-shared-hero.googsi-shared-hero :is(h1, .hero-title) {
  color: #fff !important;
  font-size: clamp(35px, 4.3vw, 56px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.042em !important;
  text-shadow: none !important;
}
body .googsi-shared-hero.googsi-shared-hero h1 :is(strong, span),
body .googsi-shared-hero.googsi-shared-hero .hero-title :is(strong, span) {
  background-image: none !important;
  -webkit-text-fill-color: currentColor !important;
}
body .googsi-shared-hero.googsi-shared-hero :is(
  .hero-description, .googsi-home31-hero-description, .gg-lead,
  .gg-premium-web-copy > p:not(.gg-premium-hero-sub),
  .service-area-hero-copy > p, .pizza-hero-copy > p,
  .map-profile-hero-copy > p, .tire-web-hero-copy > p,
  .web-build-hero-copy > p, .blog-index-hero-copy > p,
  .web-guide-hero-copy > p
) {
  color: var(--googsi-hero-muted) !important;
  font-size: 16px !important;
  line-height: 1.67 !important;
  text-shadow: none !important;
}
body .googsi-shared-hero.googsi-shared-hero :is(
  .hero-eyebrow, .gg-eyebrow, .gg-premium-kicker, .pizza-kicker,
  .service-area-eyebrow, .googsi-home31-eyebrow,
  .map-profile-eyebrow, .web-build-eyebrow,
  .blog-index-hero-kicker, .web-guide-hero-kicker
) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #ffb9c7 !important;
  font-size: 12px !important;
  letter-spacing: .07em !important;
}

/* Central button shapes and states; secondary actions remain clearly distinct. */
body .googsi-shared-hero.googsi-shared-hero a:is(
  .hero-button, .gg-btn, .gg-premium-btn, .service-area-button,
  .pizza-button, .googsi-home31-button, .corporate-hero-button,
  .web-build-button, .map-profile-button
) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 11px 18px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  transform: none !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}
body .googsi-shared-hero.googsi-shared-hero a:is(
  [class*="primary"], .gg-btn-primary, .service-area-button.primary
) {
  background: var(--googsi-coral) !important;
  background-image: none !important;
  border: 1px solid var(--googsi-coral) !important;
  color: #fff !important;
}
body .googsi-shared-hero.googsi-shared-hero a:is(
  [class*="secondary"], [class*="outline"], [class*="ghost"],
  [class*="quiet"], .service-area-button.secondary
) {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .48) !important;
  color: #fff !important;
}
body .googsi-shared-hero.googsi-shared-hero a[class*="primary"]:hover {
  background: var(--googsi-coral-hover) !important;
  border-color: var(--googsi-coral-hover) !important;
}
body .googsi-shared-hero.googsi-shared-hero a:is(
  [class*="secondary"], [class*="outline"], [class*="ghost"], [class*="quiet"]
):hover {
  background: rgba(255, 255, 255, .12) !important;
  color: #fff !important;
}

/* A single visual language for all hero mockups and supporting badges. */
body .googsi-shared-hero :is(
  .hero-browser, .ggds-browser, .pizza-showcase-window,
  .gg-hero-note, .service-area-visual-placeholder
) {
  border-radius: 15px !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, .2) !important;
  transform: none !important;
}
body .googsi-shared-hero .hero-float {
  background: rgba(20, 35, 69, .94) !important;
  border: 1px solid rgba(255, 255, 255, .23) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
body .googsi-shared-hero :is(
  .hero-visual, .ggds-hero-visual, .pizza-hero-visual,
  .service-area-hero-media
) {
  max-width: 100%;
  min-width: 0;
}
body .googsi-shared-hero :is(a, button):focus-visible {
  outline: 3px solid #ffc8d2 !important;
  outline-offset: 4px !important;
}

/* Reuse one card/border vocabulary for the main sector landing components. */
:is(.association-web-page, .service-area-page, .gg-sector-page)
  :is(.association-web-feature-grid article, .service-area-service-grid a,
      .service-area-process-grid article, .gg-feature-card) {
  border-color: var(--googsi-panel-border);
  border-radius: 14px;
  box-shadow: none;
}

@media (max-width: 760px) {
  body .googsi-shared-hero.googsi-shared-hero :is(h1, .hero-title) {
    font-size: clamp(32px, 8.8vw, 44px) !important;
    line-height: 1.13 !important;
  }
  body .googsi-shared-hero.googsi-shared-hero :is(
    .hero-description, .googsi-home31-hero-description,
    .gg-lead, .service-area-hero-copy > p
  ) { font-size: 15px !important; }
  body .googsi-shared-hero :is(.hero-browser, .ggds-browser, .pizza-showcase-window) {
    max-width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .googsi-shared-hero * {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}

/* Shared, cached sales components: ready-site catalog and concise service hub. */
.googsi-ready-catalog {padding-top: 0;}
body .googsi-ready-catalog .googsi-ready-hero {
  display: block;
  width: 100vw;
  max-width: none;
  min-height: 0;
  margin: 0 0 20px calc(50% - 50vw);
  padding: 0;
  overflow: hidden;
}
.googsi-ready-hero-inner {
  width: min(calc(100% - 48px), var(--googsi-content-max));
  min-height: 480px;
  margin: 0 auto;
  padding: 62px 0;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  align-items: center;
  gap: clamp(32px, 6vw, 80px);
}
.googsi-ready-catalog .googsi-ready-hero .service-area-hero-copy {
  min-width: 0;
  padding: 0;
}
.googsi-ready-hero-pricing {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}
.googsi-ready-catalog .googsi-ready-hero-price {
  width: min(100%, 440px);
  margin: 0;
  padding: clamp(26px, 3vw, 37px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  border: 1px solid rgba(255, 255, 255, .8);
  border-top: 5px solid var(--googsi-coral);
  border-radius: 19px;
  background: #fff;
  color: var(--googsi-navy-ink);
  box-shadow: 0 18px 44px rgba(3, 12, 33, .22);
}
.googsi-ready-catalog .googsi-ready-price-label,
.googsi-ready-heading > span,.googsi-ready-choice > span {color: #c63d58; font-size: 11px; font-weight: 800; letter-spacing: .075em;}
.googsi-ready-price-amount {display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px; margin-top: 14px;}
.googsi-ready-catalog .googsi-ready-price-amount strong {font-size: clamp(40px, 4.2vw, 54px); line-height: 1.05; letter-spacing: -.045em; color: #142343;}
.googsi-ready-catalog .googsi-ready-price-amount > span {font-size: 16px; font-weight: 700; color: #53627b;}
.googsi-ready-catalog .googsi-ready-price-inclusion {margin: 12px 0 0; font-size: 14px; font-weight: 750; color: #34445e;}
.googsi-ready-price-features {width: 100%; display: grid; gap: 11px; margin: 24px 0 0; padding: 20px 0 0; list-style: none; border-top: 1px solid #e5eaf1;}
.googsi-ready-price-features li {position: relative; padding-left: 26px; font-size: 13px; font-weight: 650; line-height: 1.5; color: #34445e;}
.googsi-ready-price-features li::before {content: '✓'; position: absolute; left: 0; top: 0; font-weight: 900; color: #16805f;}
.googsi-ready-catalog .googsi-ready-price-footnote {margin: 20px 0 0; padding: 13px 14px; border-radius: 10px; background: #f4f6fa; font-size: 12px; line-height: 1.6; color: #5b6b83;}
.googsi-ready-section {width: min(calc(100% - 36px), var(--googsi-content-max)); margin: 0 auto; padding: clamp(35px, 5vw, 67px) 0;}
.googsi-ready-section--soft {padding-inline: clamp(18px, 3vw, 34px); background: var(--googsi-soft-bg); border-radius: 18px;}
.googsi-ready-heading {max-width: 810px; margin-bottom: 24px;}
.googsi-ready-heading h2,.googsi-ready-mini-heading h2 {margin: 7px 0 12px; color: var(--googsi-navy-ink); font-size: clamp(27px, 3vw, 36px); line-height: 1.2; letter-spacing: -.025em;}
.googsi-ready-heading p,.googsi-ready-mini-heading p {margin: 0; color: #586781; line-height: 1.68; font-size: 15px;}
.googsi-ready-card-grid {display: grid; gap: 16px;}
.googsi-ready-card-grid--three {grid-template-columns: repeat(3, minmax(0, 1fr));}
.googsi-ready-card-grid--two {grid-template-columns: repeat(2, minmax(0, 1fr));}
.googsi-ready-card,.googsi-ready-choice {min-width: 0; border: 1px solid var(--googsi-panel-border); border-radius: 15px; background: #fff; box-shadow: none;}
.googsi-ready-card {padding: 24px;}
.googsi-ready-count {display: inline-flex; font-size: 12px; font-weight: 800; color: #da4b61; margin-bottom: 12px;}
.googsi-ready-card h3,.googsi-ready-choice h3 {font-size: 19px; color: #172642; margin: 0 0 9px; line-height: 1.32;}
.googsi-ready-card p,.googsi-ready-choice p {margin: 0; font-size: 14px; line-height: 1.68; color: #5b6a83;}
.googsi-ready-disclaimer {margin: 19px 0 0; max-width: 950px; color: #5d6e85; font-size: 13px; line-height: 1.65;}
.googsi-ready-sector-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;}
.googsi-ready-sector-card {display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--googsi-panel-border); border-radius: 15px; background: #fff;}
.googsi-ready-sector-visual {display: flex; flex-direction: column; justify-content: center; position: relative; aspect-ratio: 16 / 9; min-height: 155px; overflow: hidden; background: #eef2f8;}
.googsi-ready-sector-visual img {display: block; width: 100%; height: 100%; object-fit: cover;}
.googsi-ready-sector-visual--planned {padding: 24px; background: #e9eef7; color: var(--googsi-navy-ink);}
.googsi-ready-sector-visual--planned::after {content: ''; position: absolute; right: -35px; bottom: -66px; width: 150px; height: 150px; border: 18px solid rgba(20, 34, 62, .045); border-radius: 50%; pointer-events: none;}
.googsi-ready-sector-visual--planned > span {font-size: 10px; font-weight: 850; letter-spacing: .1em; color: #6c7993;}
.googsi-ready-sector-visual--planned > strong {max-width: 240px; margin: 12px 0 8px; font-size: clamp(19px, 2vw, 25px); line-height: 1.22; letter-spacing: -.02em;}
.googsi-ready-sector-visual--planned > small {font-size: 12px; color: #697993;}
.googsi-ready-sector-content {display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding: 23px;}
.googsi-ready-sector-status {display: inline-flex; margin-bottom: 12px; padding: 5px 9px; border-radius: 6px; background: #f1f4f8; color: #5b6982; font-size: 10px; font-weight: 850; letter-spacing: .065em;}
.googsi-ready-sector-status.is-live {background: #e3f6ee; color: #177356;}
.googsi-ready-sector-content h3 {margin: 0 0 10px; color: #172642; font-size: 19px; line-height: 1.3;}
.googsi-ready-sector-content p {margin: 0; color: #5b6a83; font-size: 13px; line-height: 1.65;}
.googsi-ready-sector-features {display: grid; gap: 7px; margin: 17px 0; padding: 0; list-style: none;}
.googsi-ready-sector-features li {position: relative; padding-left: 18px; font-size: 12px; line-height: 1.5; color: #4b5b75;}
.googsi-ready-sector-features li::before {content: '✓'; position: absolute; left: 0; color: #16805f; font-weight: 900;}
.googsi-ready-sector-links {display: flex; flex-wrap: wrap; gap: 6px 15px; margin-top: auto;}
.googsi-ready-sector-links a,.googsi-ready-addon a,.googsi-ready-choice a {font-weight: 750; font-size: 12px; color: #204ca0; text-decoration: none;}
.googsi-ready-sector-links a:hover,.googsi-ready-addon a:hover,.googsi-ready-choice a:hover {text-decoration: underline;}
.googsi-ready-sector-request {display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 10px; margin-top: 17px; padding: 11px 13px; border-radius: 9px; background: var(--googsi-coral); color: #fff !important; font-size: 13px; font-weight: 800; text-decoration: none !important;}
.googsi-ready-sector-request:hover {background: var(--googsi-coral-hover);}
.googsi-ready-addon a {display: inline-block; margin-top: 15px;}
.googsi-ready-choice {padding: 27px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px;}
.googsi-ready-choice h3 {margin: 0;}
.googsi-ready-choice strong {font-size: 16px; color: #172642; margin-top: auto;}
.googsi-ready-steps {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;}
.googsi-ready-steps > div {padding: 20px; border-radius: 13px; border: 1px solid var(--googsi-panel-border); background: #fff;}
.googsi-ready-steps b {display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 9px; background: #fce9ed; color: #bf3b54; margin-bottom: 12px;}
.googsi-ready-steps strong {display: block; color: #172642; font-size: 15px;}
.googsi-ready-steps p {margin: 7px 0 0; color: #617089; font-size: 13px; line-height: 1.6;}
.googsi-ready-faq {width: min(calc(100% - 36px), var(--googsi-content-max)); margin: 0 auto;}
.googsi-ready-mini-section {background: #fff; padding: 48px 0 52px;}
.googsi-ready-mini-heading {max-width: 790px; margin-bottom: 21px;}
.googsi-ready-mini-services {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;}
.googsi-ready-mini-services > a {position: relative; display: flex; flex-direction: column; gap: 7px; padding: 23px 46px 23px 24px; border: 1px solid var(--googsi-panel-border); border-radius: 14px; text-decoration: none; background: #fff;}
.googsi-ready-mini-services strong {color: #172642; font-size: 16px;}
.googsi-ready-mini-services span {color: #5e6e86; font-size: 13px; line-height: 1.6;}
.googsi-ready-mini-services b {position: absolute; right: 19px; top: 24px; color: #da4861; font-size: 18px;}
.googsi-ready-mini-services a:hover {background: #f8faff;}
@media (max-width: 850px) {
  .googsi-ready-hero-inner {grid-template-columns: 1fr; gap: 32px; padding: 45px 0 48px;}
  .googsi-ready-hero-pricing {justify-content: flex-start;}
  .googsi-ready-sector-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
  .googsi-ready-card-grid--three {grid-template-columns: repeat(2, minmax(0, 1fr));}
  .googsi-ready-steps {grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 610px) {
  .googsi-ready-hero-inner {width: min(calc(100% - 32px), var(--googsi-content-max)); gap: 27px; padding: 37px 0 43px;}
  .googsi-ready-catalog .googsi-ready-hero-price {width: 100%; padding: 25px 23px;}
  .googsi-ready-catalog .googsi-ready-hero .service-area-hero-actions {flex-direction: column;}
  .googsi-ready-sector-grid {grid-template-columns: 1fr;}
  .googsi-ready-card-grid--three,.googsi-ready-card-grid--two,.googsi-ready-mini-services,.googsi-ready-steps {grid-template-columns: 1fr;}
  .googsi-ready-section {padding-top: 36px; padding-bottom: 36px;}
  .googsi-ready-mini-section {padding: 35px 0;}
}
