/**
 * Cachet Courtesans - Site-wide hero fixes
 * Loaded after page styles via components.js to fix dark-hero contrast issues.
 */

/* Homepage video hero  overlay only, do not resize (avoids clipping CTA buttons) */
.hero-section .hero-overlay,
.toronto-escorts-hero .hero-overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.62) 0%, rgba(0, 0, 0, 0.4) 45%, rgba(0, 0, 0, 0.68) 100%) !important;
}

.hero-section .hero-title {
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.45) !important;
}

.page-hero-overlay,
.oc-hero-overlay,
.tc-hero-overlay,
.emp-hero__overlay,
.blog-hero__video-wrap::after,
.blog-hero__overlay,
.blog-hero--with-image .blog-hero__overlay {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.48) 50%, rgba(0, 0, 0, 0.74) 100%) !important;
}

.about-hero-section > div[style*="absolute"] {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.72) 100%) !important;
}

.lx-hero::before {
    background: rgba(0, 0, 0, 0.72) !important;
}

/* Image hero sizing (not homepage video hero) */
.page-hero img,
.oc-hero img,
.tc-hero img {
    height: clamp(360px, 44vw, 520px) !important;
}

/* Badge pills on dark heroes */
.page-hero-badge,
.oc-hero-badge,
.tc-hero-badge,
.rp-hero-badge,
.emp-hero__badge,
.lx-hero-badge,
.tos-hero__badge,
.pp-hero__badge,
.c-hero__badge,
.ef-hero .badge,
[class*="-hero-badge"]:not(.sf-hero-badge),
[class*="-hero__badge"] {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
    color: #f0e8ff !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.oc-hero-badge svg,
.tc-hero-badge svg,
.rp-hero-badge svg,
.emp-hero__badge svg,
.tos-hero__badge svg,
.pp-hero__badge svg,
.c-hero__badge svg,
[class*="-hero-badge"] svg,
[class*="-hero__badge"] svg {
    fill: #d4b8ff !important;
    color: #d4b8ff !important;
}

/* Accent words in titles on dark backgrounds */
.page-hero h1 span,
.oc-hero h1 span,
.tc-hero h1 span,
.sf-hero h1 span,
.lx-hero h1 span,
.ef-hero h1 span,
.rp-hero h1 .rp-gold,
[class*="-hero"] h1 span,
[class*="-hero"] h1 .rp-gold {
    color: #d4b8ff !important;
}

/* Image-only hero subtitles */
.img-hero-caption,
.about-hero-text p,
.about-hero-section .about-hero-text p {
    color: #d4b8ff !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}

.rp-hero h1,
.emp-hero h1,
.page-hero h1,
.oc-hero h1,
.tc-hero h1,
.ef-hero h1,
.sf-hero h1,
.lx-hero h1,
.rp-hero h1,
.emp-hero h1 {
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.45) !important;
}

.page-hero p,
.oc-hero p,
.tc-hero p,
.ef-hero p {
    color: rgba(255, 255, 255, 0.88) !important;
}

/* Outline buttons on dark heroes  global btn-secondary handles hover via surface-dark */

.page-trust-item svg,
.oc-trust-item svg {
    color: #d4b8ff !important;
}

body.blog-page .blog-hero .hero-label {
    color: #d4b8ff !important;
}

.rp-hero-price .rp-amount {
    color: #d4b8ff !important;
}

.rp-hero-badge {
    color: #f0e8ff !important;
}

.page-hero-content,
.oc-hero-content,
.tc-hero-content {
    padding: 48px 24px !important;
}

@media (max-width: 768px) {
    .page-hero img,
    .oc-hero img,
    .tc-hero img {
        height: clamp(300px, 55vw, 400px) !important;
    }
}
