/* Signature refinement. Compiled after styles.css; also loaded in the editor. */
.tgp-signature-orbit {
  position: absolute;
  width: min(52vw, 760px);
  aspect-ratio: 1;
  right: -5%;
  top: -12%;
  color: #b1d8ff;
  opacity: .2;
  pointer-events: none;
  z-index: 1;
}
.tgp-signature-orbit svg { display: block; width: 100%; height: 100%; }
/* Preserve the original colorful hero while avoiding continuous paint work. */
.hero::after,
.hero .hero-cta,
.hero .hero-emergency-dot,
.hero .hero-trust { animation: none; }
/* The fixed noise layer covered the entire viewport, including other sections. */
.hero .hero-grain { display: none; }
.hero .hero-cta:focus-within { outline: 3px solid #fff; outline-offset: 5px; }
.tgp-page-hero > .tgp-signature-orbit { width: min(42vw, 600px); opacity: .13; }

/* The tie-dye band now runs at full saturation. The navy veil that used to sit
   here protected white-text contrast across the whole section; that job moved to
   the step cards and the header plate below, so the dye stays vibrant in the open
   areas. Bare tie-dye cannot carry white text on its own: the yellow stop is
   1.51:1, and even the old veil only lifted it to 3.51:1. */
.process.has-background { background: var(--gradient-rainbow) !important; }
.process .process-inner { max-width: 1400px; }
.process .process-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.process .process-number { border: 1px solid #8ec7ff80; border-radius: 50%; width: 64px; height: 64px; min-width: 0; padding: 0; display: grid; place-items: center; opacity: 1; color: #c0ddff !important; font-size: 1.5rem !important; }
.process .process-step { border-color: #ffffff30; background: rgb(0 21 101 / 0.55); padding: 24px; text-align: left; align-items: flex-start; margin: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
.process .process-step-title { font-size: 1.25rem !important; }
.process .process-step-text { font-size: .95rem; }
.process .process-connector { display: none; }

/* Service names remain real, descriptive links even when mobile hides arrows. */
.services .service-card-link { color: inherit; text-decoration: none; }
.services .service-card-link::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.services .service-card:focus-within { outline: 3px solid #3158b6; outline-offset: 4px; }
.services .service-arrow { pointer-events: none; }

/* No persistent paint animations on call controls. Interaction is enough. */
.btn-primary .wp-block-button__link,
.tgp-mobile-cta .wp-block-button__link { animation: none; }
@media (max-width: 900px) {
  .process .process-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .services .service-card { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 8px 16px; }
  .services .service-icon { grid-row: 1 / span 2; }
  .services .service-name, .services .service-desc { grid-column: 2; margin: 0; }
  .process .process-steps { grid-template-columns: 1fr; }
  .tgp-signature-orbit { width: 80vw; top: 0; right: -30%; opacity: .12; }
}
