/* =============================================================
   ICONIC Board — Shared Imagery System
   Warm, professional, aspirational — Mayo Clinic meets Goop
   ============================================================= */

/* ── Unsplash hero images (royalty-free, optimized CDN) ──────
   Photo credits via Unsplash License
   Images: warm, practitioners, nature-wellness, consultation
   ─────────────────────────────────────────────────────────── */

/* ── Hero overlay mixin (applied per-page) ─────────────────── */
.img-hero-overlay {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 0.8s ease;
    z-index: 0;
    /* Lazy-loaded: opacity set to 1 after image loads */
}

.img-hero-overlay.loaded {
    opacity: 1;
}

/* Dark gradient overlay so text stays readable */
.img-hero-overlay::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(11, 29, 58, 0.82) 0%,
        rgba(26, 58, 42, 0.75) 50%,
        rgba(11, 29, 58, 0.65) 100%
    );
}

/* Forest hero variant (green-tinted pages) */
.img-hero-overlay.forest-tint::after {
    background: linear-gradient(
        135deg,
        rgba(26, 58, 42, 0.85) 0%,
        rgba(11, 29, 58, 0.70) 60%,
        rgba(26, 58, 42, 0.65) 100%
    );
}

/* ── Page-specific hero images ─────────────────────────────── */

/* Homepage — hands-on healing consultation scene */
.page-index .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1576091160550-2173dba999ef?w=1920&q=75&auto=format&fit=crop');
}

/* How It Works — practitioner consulting client */
.page-how-it-works .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1559757148-5c350d0d3c56?w=1920&q=75&auto=format&fit=crop');
}

/* Credentials overview — professional, nature-wellness */
.page-credentials .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1920&q=75&auto=format&fit=crop');
}

/* IBC-HHA tier — warm healing hands */
.page-ibc-hha .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1544161515-4ab6ce6db874?w=1920&q=75&auto=format&fit=crop');
}

/* IBC-HHP tier — professional consultation */
.page-ibc-hhp .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=1920&q=75&auto=format&fit=crop');
}

/* IBC-HHE tier — nature, wellness environment */
.page-ibc-hhe .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1518531933037-91b2f5f229cc?w=1920&q=75&auto=format&fit=crop');
}

/* IBC-DHH / Diplomate — prestige, formal setting */
.page-ibc-hhd .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?w=1920&q=75&auto=format&fit=crop');
}

/* Apply page — commitment, beginning of journey */
.page-apply .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?w=1920&q=75&auto=format&fit=crop');
}

/* Directory — finding practitioners, community */
.page-directory .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=1920&q=75&auto=format&fit=crop');
}

/* Ethics & Standards — gravitas, trust */
.page-ethics .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1920&q=75&auto=format&fit=crop');
}

/* Endorsements — specialty, depth */
.page-endorsements .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1515377905703-c4788e51af15?w=1920&q=75&auto=format&fit=crop');
}

/* How It Works alt — botanical, serene */
.page-tiers .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=1920&q=75&auto=format&fit=crop');
}

/* About — diverse professional team */
.page-about .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?w=1920&q=75&auto=format&fit=crop');
}

/* Accreditation & standards — formal, institutional */
.page-accreditation .img-hero-overlay,
.page-accreditation-standards .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1606761568499-6d2451b23c66?w=1920&q=75&auto=format&fit=crop');
}

.page-accreditation-policies .img-hero-overlay,
.page-credentialing-integrity .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1521791055366-0d553872952f?w=1920&q=75&auto=format&fit=crop');
}

.page-accreditation-practices .img-hero-overlay,
.page-accreditation-brochure .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?w=1920&q=75&auto=format&fit=crop');
}

.page-micro-credentials .img-hero-overlay,
.page-credentials-guide .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1518531933037-91b2f5f229cc?w=1920&q=75&auto=format&fit=crop');
}

/* Credential verification */
.page-credential-verify .img-hero-overlay,
.page-credential-lookup .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?w=1920&q=75&auto=format&fit=crop');
}

/* Practitioners & community */
.page-practitioner .img-hero-overlay,
.page-for-hd .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1559757148-5c350d0d3c56?w=1920&q=75&auto=format&fit=crop');
}

.page-why-credentialed .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=1920&q=75&auto=format&fit=crop');
}

.page-peer-circles .img-hero-overlay,
.page-directory .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=1920&q=75&auto=format&fit=crop');
}

.page-mentorship .img-hero-overlay,
.page-mentorship-apply .img-hero-overlay,
.page-founding-members .img-hero-overlay,
.page-advisory-board .img-hero-overlay,
.page-advisory-council .img-hero-overlay,
.page-nominate .img-hero-overlay,
.page-ambassador .img-hero-overlay,
.page-ambassador-kit .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?w=1920&q=75&auto=format&fit=crop');
}

.page-professional-education .img-hero-overlay,
.page-practice-hours .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?w=1920&q=75&auto=format&fit=crop');
}

.page-ce-providers .img-hero-overlay,
.page-api-access .img-hero-overlay,
.page-api-docs .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1516321497487-e288fb19713f?w=1920&q=75&auto=format&fit=crop');
}

.page-exam .img-hero-overlay,
.page-accreditation-policies .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1521791055366-0d553872952f?w=1920&q=75&auto=format&fit=crop');
}

.page-renew .img-hero-overlay,
.page-resources .img-hero-overlay,
.page-resources-article .img-hero-overlay,
.page-research .img-hero-overlay,
.page-state-of-holistic .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=1920&q=75&auto=format&fit=crop');
}

.page-student-membership .img-hero-overlay,
.page-international .img-hero-overlay,
.page-school-referral .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1920&q=75&auto=format&fit=crop');
}

.page-member-perks .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1515377905703-c4788e51af15?w=1920&q=75&auto=format&fit=crop');
}

/* Standards & legal */
.page-disciplinary .img-hero-overlay,
.page-complaints .img-hero-overlay,
.page-complaint-status .img-hero-overlay,
.page-public-records .img-hero-overlay,
.page-terms .img-hero-overlay,
.page-privacy .img-hero-overlay,
.page-legal-resources .img-hero-overlay,
.page-legal-templates .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1920&q=75&auto=format&fit=crop');
}

/* Consumer Trust Center */
.page-trust .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1576091160550-2173dba999ef?w=1920&q=75&auto=format&fit=crop');
}
.page-trust-choose .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1559757148-5c350d0d3c56?w=1920&q=75&auto=format&fit=crop');
}
.page-trust-red-flags .img-hero-overlay,
.page-trust-report .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1920&q=75&auto=format&fit=crop');
}
.page-trust-questions .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?w=1920&q=75&auto=format&fit=crop');
}
.page-trust-credentials .img-hero-overlay,
.page-trust-protections .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1521791055366-0d553872952f?w=1920&q=75&auto=format&fit=crop');
}

/* Governance & org */
.page-governance .img-hero-overlay,
.page-accreditation-brochure .img-hero-overlay,
.page-annual-report .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1606761568499-6d2451b23c66?w=1920&q=75&auto=format&fit=crop');
}

.page-awards .img-hero-overlay,
.page-credential-verify .img-hero-overlay,
.page-employer-verify .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1551836022-d5d88e9218df?w=1920&q=75&auto=format&fit=crop');
}

/* Partners & business */
.page-partners .img-hero-overlay,
.page-partner-directory .img-hero-overlay,
.page-corporate-wellness .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?w=1920&q=75&auto=format&fit=crop');
}

/* Resources & tools */
.page-toolkit .img-hero-overlay,
.page-caqh-guide .img-hero-overlay,
.page-insurance-toolkit .img-hero-overlay,
.page-superbills .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?w=1920&q=75&auto=format&fit=crop');
}

/* News & content */
.page-news .img-hero-overlay,
.page-news-article .img-hero-overlay,
.page-conference .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1516321497487-e288fb19713f?w=1920&q=75&auto=format&fit=crop');
}

/* Opportunities */
.page-opportunities .img-hero-overlay,
.page-opportunity-listing .img-hero-overlay,
.page-opportunities-post .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?w=1920&q=75&auto=format&fit=crop');
}

/* Policy & advocacy — law, legislation */
.page-advocacy .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1589829545856-d10d557cf95f?w=1920&q=75&auto=format&fit=crop');
}

/* Contact & support */
.page-contact .img-hero-overlay,
.page-support .img-hero-overlay,
.page-feedback .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1559757148-5c350d0d3c56?w=1920&q=75&auto=format&fit=crop');
}

/* Verify & 404 */
.page-verify .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1606761568499-6d2451b23c66?w=1920&q=75&auto=format&fit=crop');
}

.page-404 .img-hero-overlay {
    background-image: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=1920&q=75&auto=format&fit=crop');
}

/* Default fallback for any page */
.img-hero-overlay.default-bg {
    background-image: url('https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=1920&q=75&auto=format&fit=crop');
}

/* ── Section Dividers (botanical / abstract wellness) ───────── */

.section-divider {
    position: relative;
    overflow: hidden;
    height: 120px;
    flex-shrink: 0;
}

/* Botanical leaf pattern SVG as inline data URI */
.section-divider-botanical {
    background: var(--cream, #FAF7F0);
}

.section-divider-botanical::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg opacity='0.08'%3E%3Cellipse cx='30' cy='60' rx='22' ry='10' fill='%231A3A2A' transform='rotate(-30 30 60)'/%3E%3Cellipse cx='90' cy='60' rx='22' ry='10' fill='%23C4972F' transform='rotate(30 90 60)'/%3E%3Cellipse cx='60' cy='20' rx='16' ry='7' fill='%231A3A2A' transform='rotate(0 60 20)'/%3E%3Cellipse cx='60' cy='100' rx='16' ry='7' fill='%23C4972F' transform='rotate(15 60 100)'/%3E%3Ccircle cx='60' cy='60' r='3' fill='%23C4972F' opacity='0.4'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 120px 120px;
    opacity: 0.5;
}

/* Wave divider (SVG) */
.section-divider-wave {
    height: 80px;
    background: transparent;
}

.section-divider-wave svg {
    display: block;
    width: 100%;
    height: 100%;
}

/* Gradient fade divider — cream to white */
.section-divider-fade-cream {
    height: 60px;
    background: linear-gradient(to bottom, var(--cream, #FAF7F0), var(--white, #ffffff));
}

/* Gradient fade — white to cream */
.section-divider-fade-white {
    height: 60px;
    background: linear-gradient(to bottom, var(--white, #ffffff), var(--cream, #FAF7F0));
}

/* Gold accent rule */
.section-divider-rule {
    height: 40px;
    display: flex;
    align-items: center;
    padding: 0 40px;
}

.section-divider-rule::before {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(196,151,47,0.4), transparent);
}

/* ── Abstract botanical full-width accent ───────────────────── */

/* Decorative pattern band between major content sections */
.section-accent-band {
    position: relative;
    overflow: hidden;
    padding: 28px 0;
    background: var(--cream-dark, #F0EBE0);
    border-top: 1px solid rgba(196,151,47,0.15);
    border-bottom: 1px solid rgba(196,151,47,0.15);
}

.section-accent-band::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='56' viewBox='0 0 200 56'%3E%3Cg opacity='0.12' fill='none' stroke='%231A3A2A' stroke-width='1'%3E%3Cpath d='M0 28 Q25 8 50 28 Q75 48 100 28 Q125 8 150 28 Q175 48 200 28'/%3E%3Cpath d='M0 20 Q25 0 50 20 Q75 40 100 20 Q125 0 150 20 Q175 40 200 20' opacity='0.5'/%3E%3Cpath d='M0 36 Q25 16 50 36 Q75 56 100 36 Q125 16 150 36 Q175 56 200 36' opacity='0.5'/%3E%3C/g%3E%3Cg opacity='0.08' fill='%23C4972F'%3E%3Ccircle cx='50' cy='28' r='2'/%3E%3Ccircle cx='100' cy='28' r='2'/%3E%3Ccircle cx='150' cy='28' r='2'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 200px 56px;
    background-repeat: repeat-x;
    background-position: center;
}

.section-accent-band-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
}

.section-accent-icon {
    width: 32px;
    height: 32px;
    opacity: 0.5;
    flex-shrink: 0;
}

.section-accent-text {
    font-size: 13px;
    color: var(--text-muted, #5A5A72);
    font-style: italic;
    letter-spacing: 0.5px;
    text-align: center;
}

/* ── Photo quote / testimonial band ─────────────────────────── */

.photo-quote-band {
    position: relative;
    overflow: hidden;
    padding: 80px 32px;
    min-height: 320px;
    display: flex;
    align-items: center;
}

.photo-quote-band::before {
    content: '';
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center 30%;
    background-repeat: no-repeat;
    filter: brightness(0.35) saturate(0.8);
    z-index: 0;
}

/* Healing hands — used on homepage */
.photo-quote-band.bg-healing::before {
    background-image: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1920&q=60&auto=format&fit=crop');
}

/* Nature / forest — used on credentials */
.photo-quote-band.bg-nature::before {
    background-image: url('https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=1920&q=60&auto=format&fit=crop');
}

/* Professional setting — used on apply/ethics */
.photo-quote-band.bg-professional::before {
    background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?w=1920&q=60&auto=format&fit=crop');
}

/* Wellness / botanical — used on directory */
.photo-quote-band.bg-wellness::before {
    background-image: url('https://images.unsplash.com/photo-1515377905703-c4788e51af15?w=1920&q=60&auto=format&fit=crop');
}

.photo-quote-band-inner {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

.photo-quote-mark {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 80px;
    line-height: 0.6;
    color: rgba(196,151,47,0.6);
    display: block;
    margin-bottom: 16px;
}

.photo-quote-text {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(18px, 2.5vw, 26px);
    font-style: italic;
    color: rgba(255,255,255,0.92);
    line-height: 1.55;
    margin-bottom: 20px;
}

.photo-quote-attr {
    font-size: 12px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: rgba(196,151,47,0.8);
    font-weight: 600;
}

/* ── Ensure all hero sections have relative positioning ─────── */
/* These selectors target existing hero containers site-wide    */

.hero,
.page-hero,
.tier-hero,
section.hero {
    position: relative;
    overflow: hidden;
}

.hero > *,
.page-hero > *,
.tier-hero > *,
section.hero > * {
    position: relative;
    z-index: 1;
}

/* ── Performance: Preload hint applied via JS ───────────────── */

/* Image skeleton shimmer while loading */
@keyframes img-shimmer {
    0% { background-position: -200% center; }
    100% { background-position: 200% center; }
}

.img-loading {
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0.02) 25%,
        rgba(255,255,255,0.06) 50%,
        rgba(255,255,255,0.02) 75%
    );
    background-size: 200% 100%;
    animation: img-shimmer 1.5s infinite;
}

/* ── Mobile adjustments ─────────────────────────────────────── */

@media (max-width: 768px) {
    .photo-quote-band {
        padding: 60px 24px;
        min-height: 260px;
    }

    .photo-quote-text {
        font-size: 18px;
    }

    .photo-quote-mark {
        font-size: 60px;
    }

    .section-accent-band {
        padding: 20px 0;
    }

    .section-accent-text {
        font-size: 12px;
    }

    .section-divider {
        height: 60px;
    }
}
