/**
 * Adinkra symbol backgrounds — alternates by section on every page.
 * Heroes: home-style gradients + visible but soft symbols.
 * Content sections: symbols pushed to edges, toned down for white text readability.
 */

:root {
    --adinkra-hero-bg:
        radial-gradient(ellipse 90% 70% at 8% 12%, rgba(251, 191, 36, 0.16) 0%, transparent 52%),
        radial-gradient(ellipse 70% 55% at 94% 16%, rgba(255, 255, 255, 0.09) 0%, transparent 48%),
        radial-gradient(ellipse 60% 50% at 78% 88%, rgba(217, 119, 6, 0.1) 0%, transparent 50%),
        radial-gradient(ellipse 45% 40% at 35% 92%, rgba(251, 191, 36, 0.08) 0%, transparent 45%),
        linear-gradient(165deg, #0f172a 0%, #111827 40%, #1f2937 100%);
    --adinkra-content-mask: radial-gradient(ellipse 95% 75% at 50% 42%, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.55) 48%, rgba(0, 0, 0, 0.2) 100%);
    --adinkra-hero-mask: radial-gradient(ellipse 110% 85% at 48% 38%, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.75) 58%, rgba(0, 0, 0, 0.3) 100%);
}

.adinkra-section {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.adinkra-section > * {
    position: relative;
    z-index: 1;
}

.adinkra-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-repeat: repeat;
    pointer-events: none;
    z-index: 0;
    opacity: 0.08;
    -webkit-mask-image: var(--adinkra-content-mask);
    mask-image: var(--adinkra-content-mask);
}

.adinkra-section::after {
    content: '';
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: 0;
    opacity: 0.045;
    -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 40%, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.45) 100%);
    mask-image: radial-gradient(ellipse 80% 60% at 50% 40%, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.45) 100%);
}

/* Symbol variants — tile + accent */
.adinkra-gye-nyame::before {
    background-image: url('/assets/images/adinkra-tile-gye-nyame.svg');
    background-size: 260px 260px;
}

.adinkra-gye-nyame::after {
    background-image: url('/assets/images/adinkra-gye-nyame.svg');
    background-size: 140px 140px;
    background-position: -2% 8%;
}

.adinkra-sankofa::before {
    background-image: url('/assets/images/adinkra-tile-sankofa.svg');
    background-size: 240px 240px;
}

.adinkra-sankofa::after {
    background-image: url('/assets/images/adinkra-sankofa.svg');
    background-size: 130px 130px;
    background-position: 94% 10%;
}

.adinkra-dwennimmen::before {
    background-image: url('/assets/images/adinkra-tile-dwennimmen.svg');
    background-size: 250px 250px;
}

.adinkra-dwennimmen::after {
    background-image: url('/assets/images/adinkra-dwennimmen.svg');
    background-size: 135px 135px;
    background-position: 4% 75%;
}

.adinkra-akoma::before {
    background-image: url('/assets/images/adinkra-tile-akoma.svg');
    background-size: 230px 230px;
}

.adinkra-akoma::after {
    background-image: url('/assets/images/adinkra-akoma.svg');
    background-size: 125px 125px;
    background-position: 92% 68%;
}

.adinkra-nkyinkyim::before {
    background-image: url('/assets/images/adinkra-tile-nkyinkyim.svg');
    background-size: 220px 220px;
}

.adinkra-nkyinkyim::after {
    background-image: url('/assets/images/adinkra-nkyinkyim.svg');
    background-size: 120px 120px;
    background-position: 6% 14%;
}

.adinkra-eban::before {
    background-image: url('/assets/images/adinkra-tile-eban.svg');
    background-size: 240px 240px;
}

.adinkra-eban::after {
    background-image: url('/assets/images/adinkra-eban.svg');
    background-size: 128px 128px;
    background-position: 88% 20%;
}

/* —— Hero sections (home + all subpage heroes) —— */
#home.adinkra-gye-nyame,
.adinkra-section.hero-pattern.adinkra-gye-nyame,
main.adinkra-section.hero-pattern.adinkra-gye-nyame,
article.adinkra-section.adinkra-gye-nyame {
    background: var(--adinkra-hero-bg) !important;
}

#home.adinkra-gye-nyame::before,
.adinkra-section.hero-pattern.adinkra-gye-nyame::before,
main.adinkra-section.hero-pattern.adinkra-gye-nyame::before,
article.adinkra-section.adinkra-gye-nyame::before {
    opacity: 0.13;
    -webkit-mask-image: var(--adinkra-hero-mask);
    mask-image: var(--adinkra-hero-mask);
}

#home.adinkra-gye-nyame::after,
.adinkra-section.hero-pattern.adinkra-gye-nyame::after,
main.adinkra-section.hero-pattern.adinkra-gye-nyame::after,
article.adinkra-section.adinkra-gye-nyame::after {
    opacity: 0.08;
    background-position: -2% 8%;
    -webkit-mask-image: radial-gradient(ellipse 70% 55% at 30% 25%, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.15) 100%);
    mask-image: radial-gradient(ellipse 70% 55% at 30% 25%, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.15) 100%);
}

#home.adinkra-gye-nyame::after {
    background-position: -2% 8%, 96% 6%;
}

/* Override legacy inline .hero-pattern::before (old mixed tile) on heroes */
.adinkra-section.hero-pattern.adinkra-gye-nyame::before,
main.adinkra-section.hero-pattern.adinkra-gye-nyame::before {
    background-image: url('/assets/images/adinkra-tile-gye-nyame.svg') !important;
    background-size: 260px 260px !important;
    background-repeat: repeat !important;
}

/* CTA / gradient bands — extra subtle (white headline text) */
.adinkra-section.gradient-bg::before,
.adinkra-section.gradient-bg::after {
    opacity: 0.04;
}

/* Partners — minimal */
#partners.adinkra-gye-nyame::before {
    opacity: 0.05;
}

#partners.adinkra-gye-nyame::after {
    background-size: 100px 100px;
    background-position: 92% 40%;
    opacity: 0.035;
}

/* Full-page fallback (404) */
body.adinkra-page {
    position: relative;
    isolation: isolate;
    background: var(--adinkra-hero-bg) !important;
}

body.adinkra-page::before,
body.adinkra-page::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

body.adinkra-page > * {
    position: relative;
    z-index: 1;
}

body.adinkra-page.adinkra-gye-nyame::before {
    background: url('/assets/images/adinkra-tile-gye-nyame.svg') repeat;
    background-size: 260px 260px;
    opacity: 0.09;
    -webkit-mask-image: var(--adinkra-hero-mask);
    mask-image: var(--adinkra-hero-mask);
}

body.adinkra-page.adinkra-gye-nyame::after {
    background: url('/assets/images/adinkra-gye-nyame.svg') no-repeat 92% 8%;
    background-size: 110px 110px;
    opacity: 0.05;
}

@media (max-width: 768px) {
    .adinkra-section:not(.hero-pattern):not(#home)::before {
        opacity: 0.06;
    }

    .adinkra-section:not(.hero-pattern):not(#home)::after {
        opacity: 0.03;
    }

    .adinkra-section.hero-pattern.adinkra-gye-nyame::before,
    #home.adinkra-gye-nyame::before,
    article.adinkra-section.adinkra-gye-nyame::before {
        opacity: 0.1;
    }

    .adinkra-section::before {
        background-size: 200px 200px !important;
    }

    .adinkra-section::after {
        background-size: 72px 72px !important;
    }
}
