text-base12 a {
    color: #ffffff !important;
    font-weight: 700;
}

/* ==========================================================================
   Modern theme surfaces — replaces old PNG shapes + wavy section masks
   ========================================================================== */

.banner-shape {
    display: none !important;
}

.shapes-container,
.theme-surface {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.shapes-container::before,
.shapes-container::after,
.theme-surface::before,
.theme-surface::after {
    mask: none !important;
    -webkit-mask: none !important;
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    background: transparent !important;
}

/* Soft mesh atmosphere for dark branded sections */
.theme-surface.bg--title,
.shapes-container.bg--title {
    background-image:
        radial-gradient(ellipse 70% 55% at 12% 20%, rgba(255, 255, 255, 0.14), transparent 55%),
        radial-gradient(ellipse 55% 45% at 88% 75%, rgba(18, 194, 168, 0.22), transparent 60%),
        radial-gradient(ellipse 40% 35% at 70% 15%, rgba(90, 94, 255, 0.2), transparent 55%),
        linear-gradient(160deg, rgba(255, 255, 255, 0.04), transparent 40%);
    background-repeat: no-repeat;
}

.theme-surface.bg--title::before,
.shapes-container.bg--title::before {
    content: "";
    position: absolute !important;
    inset: 0 !important;
    z-index: 0;
    pointer-events: none;
    opacity: 0.35;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 20%, transparent 75%) !important;
    -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 20%, transparent 75%) !important;
}

.theme-surface.bg--title::after,
.shapes-container.bg--title::after {
    content: "";
    position: absolute !important;
    width: 42vw !important;
    max-width: 520px !important;
    aspect-ratio: 1;
    right: -8% !important;
    top: -18% !important;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.12), transparent 68%);
    animation: themeOrbFloat 14s ease-in-out infinite alternate;
}

.theme-surface .container,
.shapes-container .container {
    position: relative;
    z-index: 1;
}

/* Cleaner page hero / breadcrumb band */
.hero-section.theme-surface {
    padding: 72px 0 56px;
}

@media (max-width: 575px) {
    .hero-section.theme-surface {
        padding: 56px 0 40px;
    }
}

.hero-section .hero-title {
    position: relative;
    display: inline-block;
}

.hero-section .hero-title::after {
    content: "";
    display: block;
    width: 56px;
    height: 3px;
    margin-top: 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
}

/* Footer: no floating ornaments, cleaner top edge */
footer.theme-surface {
    padding-top: 72px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

footer.theme-surface::after {
    display: none !important;
}

/* Soft modern cards on light sections */
.bg--section {
    background:
        radial-gradient(ellipse 60% 50% at 100% 0%, rgba(90, 94, 255, 0.05), transparent 55%),
        #f7fbfe;
}

@keyframes themeOrbFloat {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }
    100% {
        transform: translate3d(-4%, 10%, 0) scale(1.08);
    }
}

@media (prefers-reduced-motion: reduce) {
    .theme-surface.bg--title::after,
    .shapes-container.bg--title::after {
        animation: none;
    }
}
