/* Logo green for public text accents. Load after the public component styles.
   --green continues to control button surfaces, borders and focus indicators.
   Only text-bearing leaves are clipped; mixed-content containers stay untouched. */
.studio-site {
  --brand-text-solid: #42be4e;
  --brand-gradient: linear-gradient(110deg, #77c14e 0%, #42be4e 50%, #09ba4d 100%);
  --brand-text-image: none;
  --brand-text-fill: currentColor;
}

/* Transparent fill is enabled only when clipping can paint the text. */
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  .studio-site {
    --brand-text-image: var(--brand-gradient);
    --brand-text-fill: transparent;
  }
}

/* Existing green headings, labels, links and their green hover states. */
.studio-site .hero h1 span,
.studio-site .render-gallery-heading .eyebrow,
.studio-site .render-gallery-heading h2 em,
.studio-site .render-collection-nav a:hover,
.studio-site .hero h1 i,
.studio-site .footer-cta h2 span,
.studio-site .page-head h1 em,
.studio-site .expertise h2 em,
.studio-site .upcoming-copy h2 span,
.studio-site .hiring-hero h1 em,
.studio-site .application-intro h1 em,
.studio-site .channel-section h2 em,
.studio-site .review-write-intro h3 em,
.studio-site .journal-head em,
.studio-site .regional-head em,
.studio-site .journal-intro em,
.studio-site .regional-teaser em,
.studio-site .industry-intro h2 em,
.studio-site .industry-hero h1 em,
.studio-site .values em,
.studio-site .service-number,
.studio-site .studio-copy .eyebrow,
.studio-site .page-head .eyebrow,
.studio-site .process-grid > div > span,
.studio-site .about-story > .eyebrow,
.studio-site .values > .eyebrow,
.studio-site .upcoming-copy .eyebrow,
.studio-site .social-panel .eyebrow,
.studio-site .contact-socials > .eyebrow,
.studio-site .hiring-hero .eyebrow,
.studio-site .hiring-intro .eyebrow,
.studio-site .job-number,
.studio-site .hiring-apply .eyebrow,
.studio-site .application-intro > .eyebrow,
.studio-site .application-form-heading > .eyebrow,
.studio-site .application-success > .eyebrow,
.studio-site .founder-copy > .eyebrow:not(.founder-profile-top .eyebrow),
.studio-site .channel-copy .eyebrow,
.studio-site .reviews-intro > .eyebrow,
.studio-site .review-write-intro > .eyebrow,
.studio-site .learning-intro .eyebrow,
.studio-site .lesson-copy .eyebrow,
.studio-site .journal-head > .eyebrow,
.studio-site .journal-teaser .eyebrow,
.studio-site .story .eyebrow,
.studio-site .regional-head .eyebrow,
.studio-site .regional-copy > .eyebrow,
.studio-site .regional-services > .eyebrow,
.studio-site .regional-faq > .eyebrow,
.studio-site .regional-teaser > .eyebrow,
.studio-site .related-stories > .eyebrow,
.studio-site .story-meta > span,
.studio-site .case-contribution .eyebrow,
.studio-site .spotlight-group-heading .eyebrow,
.studio-site .industry-intro .eyebrow,
.studio-site .industry-hero > .eyebrow,
.studio-site .industry-sources .eyebrow,
.studio-site .industry-next > .eyebrow,
.studio-site .industry-topic,
.studio-site .industry-frequency,
.studio-site .media-card-caption small,
.studio-site .copy-status,
.studio-site .form-progress,
.studio-site .review-status:not(.is-error),
.studio-site .enquiry-status:not(.is-error),
.studio-site .new-enquiry,
.studio-site .job-card summary,
.studio-site [id="hiring-form"] legend span,
.studio-site .upload-title > span,
.studio-site .remove-resume,
.studio-site .header nav .mobile-contact,
.studio-site .category-nav a[aria-current="page"],
.studio-site .media-fallback a,
.studio-site .social-links > a,
.studio-site .hiring-contact a,
.studio-site .form-contact a,
.studio-site .journal-tabs a[aria-current],
.studio-site .story-body a:not(.pill),
.studio-site .regional-copy p a,
.studio-site .regional-service-grid .text-link,
.studio-site .comparison figcaption a,
.studio-site .industry-intro .text-link,
.studio-site .industry-footnote a,
.studio-site .service-film-link,
.studio-site .save-look[aria-pressed="true"],
.studio-site .text-link:hover,
.studio-site .footer-links nav a:hover,
.studio-site .footer-links > div > a:not(.logo):hover,
.studio-site .category-links a:hover,
.studio-site .back-link:hover,
.studio-site .email-large:hover,
.studio-site .social-platforms a:hover,
.studio-site .footer-socials a:hover,
.studio-site .founder-socials a:hover,
.studio-site .credits a:hover,
.studio-site .founder-copy h3 a:hover,
.studio-site .studio-leadership a:hover,
.studio-site .lesson-copy h3 a:hover,
.studio-site .learning-more summary:hover,
.studio-site .journal-tabs a:hover,
.studio-site .story-card h2 a:hover,
.studio-site .story-card h3 a:hover,
.studio-site .story-card .text-link:hover,
.studio-site .role-tags a:hover,
.studio-site .service-film-copy a:hover,
.studio-site .spotlight-caption a:hover,
.studio-site .service-row:hover h3,
.studio-site .directory-card:hover h3,
.studio-site .expertise-card:hover h3 {
  color: var(--brand-text-solid);
  background-image: var(--brand-text-image);
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: var(--brand-text-fill);
}

/* SVG arrows/stars and text over a filled badge keep their original surfaces. */
.studio-site .contact-link span,
.studio-site .service-row:hover .service-arrow,
.studio-site .service-capabilities li span,
.studio-site .directory-arrow,
.studio-site .social-platforms span,
.studio-site .footer-socials span,
.studio-site .founder-socials span,
.studio-site .review-stars > span,
.studio-site .success-mark,
.studio-site .review-mark,
.studio-site .craft-drawer > summary b,
.studio-site .review-drawer > summary > span,
.studio-site .industry-card-top > span[aria-hidden="true"],
.studio-site .industry-source-list a span:last-child,
.studio-site .external-watch,
.studio-site .inspiration-open span,
.studio-site .service-film-play:not(:hover) > span:first-child,
.studio-site .big-arrow:not(:hover) {
  color: var(--brand-text-solid);
}
.studio-site .compact-process li::before,
.studio-site .application-card li::marker,
.studio-site .story-body li::marker {
  color: var(--brand-text-solid);
}

/* System contrast and printed pages must never rely on background images. */
@media (forced-colors: active), print {
  .studio-site {
    --brand-text-image: none;
    --brand-text-fill: currentColor;
  }
}
