/* Shared navy treatment for inner-page banners; the homepage stays unshaded. */
:root { --tt-banner-overlay: rgba(6, 17, 29, .82); }
@layer tt-card-layout {
  html body :is(.tt-info-hero-bg, .tt-category-hero-bg, .tt-contact-hero-bg) {
    opacity: 1 !important;
    filter: none !important;
  }
  html body .tt-contact-hero-bg {
    background-image: url('/image/data/techtools-contact-ai/contact-us-simple-2026.png') !important;
  }
  html body :is(.tt-info-hero-bg, .tt-category-hero-bg, .tt-contact-hero-bg)::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: var(--tt-banner-overlay) !important;
    opacity: 1 !important;
    pointer-events: none !important;
  }
  html body .tt-cat-hero-overlay {
    background: var(--tt-banner-overlay) !important;
    pointer-events: none !important;
  }
  /* Remove the extra glows/gradients rather than stacking multiple overlays. */
  html body :is(.tt-info-hero, .tt-category-hero, .tt-contact-hero)::after,
  html body .tt-hero-slider .tt-hero-overlay { display: none !important; }
  html body :is(.tt-blog-single-hero, .tt-search-hero) {
    position: relative;
    isolation: isolate;
  }
  html body :is(.tt-blog-single-hero, .tt-search-hero)::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--tt-banner-overlay);
    pointer-events: none;
    z-index: -1;
  }
}
/* Inner-page copy stays readable over the navy treatment. */
@layer tt-storefront-typography {
  :is(#tt-banner-overlay, body) :is(.tt-info-hero, .tt-contact-hero, .tt-category-hero, .tt-cat-hero, .tt-blog-single-hero, .tt-search-hero) :is(h1, .tt-info-hero-copy > p, .tt-contact-hero-copy > p, .tt-category-copy > p, .tt-cat-hero-copy > p, .tt-blog-lead, .tt-blog-meta, .tt-search-hero p) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
  }
}