:root {
    --mad-green: #007a3d;
    --mad-deep-green: #004f2a;
    --mad-light-green: #e9f7ef;
    --mad-gold: #f4c400;
    --mad-orange: #044821;
    --mad-red: #d8242f;
    --mad-ink: #173525;
}

/* Public-site brand palette taken from the My Africa Directory logo. */
.color-bg,
.green-bg,
.header-search_container .header-search-button:hover,                        g
.pagination a.current-page,
.pagination a:hover,
.down-btn i,
.section-separator:before,
.footer-widget h3:before,                                                        g
.nav-holder nav li a:before,
.accordion a.toggle span,
.tc-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active,
.tc-pagination2 .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--mad-green) !important;
}

.color2-bg,
.main-search-button,
.header-search-button:hover,
.down-btn:hover,
.accordion a.toggle.act-accordion {
    background: var(--mad-orange) !important;
}

.color3-bg,
.yellow-bg {
    background: var(--mad-gold) !important;
}

.blue-bg,
.dark-blue-bg,
.gradient-dark {
    background: var(--mad-deep-green) !important;
}

.gradient-bg {
    background-color: var(--mad-green) !important;
    background-image: linear-gradient(135deg, var(--mad-deep-green) 0%, var(--mad-green) 58%, #10a95b 100%) !important;
}
.blue-gradient-bg {
    background-color: var(--mad-gold) !important;
    background-image: linear-gradient(135deg, #e29f00 0%, var(--mad-gold) 58%, var(--mad-orange) 100%) !important;
}
.green-gradient-bg {
    background-color: var(--mad-green) !important;
    background-image: linear-gradient(135deg, #006b36 0%, #0ba457 100%) !important;
}
.purp-gradient-bg {
    background-color: var(--mad-red) !important;
    background-image: linear-gradient(135deg, #b91f28 0%, var(--mad-red) 52%, var(--mad-orange) 100%) !important;
}

.nav-holder nav li a.act-link,
.nav-holder nav li a:hover,
.nav-holder nav li a i,
.show-reg-form i,
.section-subtitle,
.footer-social li a,
.subfooter-nav li a,
#subscribe-button i,
.footer-contacts li i,
.footer-link i,
.footer-widget-posts .widget-posts-date i,
.geodir-category-location a i,
.btn i,
.time-line-icon i,
.process-count,
.main-search-input-tabs .tabs-menu li.current a,
.hero-categories li a i,
.to-top {
    color: #f5c023 !important;
}

.main-footer .footer-inner {
    background-color: var(--mad-deep-green) !important;
    background-image: linear-gradient(145deg, #003c21 0%, var(--mad-deep-green) 55%, #0a6739 100%) !important;
}

.footer-header {
    background: linear-gradient(90deg, var(--mad-green), #0a9a53) !important;
}

.sub-footer {
    background: #173e2b !important;
}

.footer-wave path {
    fill: #0a6739 !important;
}

.main-header,
.header-search_container {
    border-color: rgba(0, 122, 61, .16) !important;
}

.btn.color-bg,
.btn.gradient-bg {
    background: var(--mad-green) !important;
    border-color: var(--mad-green) !important;
}

.btn.color-bg:hover,
.btn.gradient-bg:hover {
    background: var(--mad-orange) !important;
    border-color: var(--mad-orange) !important;
}

/* Reusable public page components. */
.mad-page-hero {
    position: relative;
    padding: 150px 0 84px;
    overflow: hidden;
    background: linear-gradient(115deg, rgba(0, 79, 42, .96), rgba(0, 122, 61, .88)), var(--mad-hero-image, url('/images/bg/hero/2.jpg')) center/cover no-repeat;
    color: #fff;
}

.mad-page-hero:after {
    content: "";
    position: absolute;
    inset: auto -80px -150px auto;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    border: 75px solid rgba(244, 196, 0, .13);
}

.mad-page-hero .container { position: relative; z-index: 2; }
.mad-page-hero h1 { margin: 0 0 14px; color: #fff; font-size: clamp(38px, 5vw, 64px); }
.mad-page-hero p { max-width: 760px; margin: 0; color: rgba(255,255,255,.88); font-size: 17px; line-height: 1.8; }
.mad-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--mad-gold); font-size: 12px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.mad-section { padding: 82px 0; }
.mad-soft-section { background: linear-gradient(180deg, #f5fbf7, #fff); }
.mad-section-heading { max-width: 760px; margin: 0 auto 42px; text-align: center; }
.mad-section-heading h2 { margin: 0 0 12px; color: var(--mad-ink); font-size: clamp(30px, 4vw, 44px); }
.mad-section-heading p { color: #637268; font-size: 15px; line-height: 1.8; }

.mad-faq-filter { padding: 10px 17px; border: 1px solid #dce9e0; border-radius: 999px; background: #fff; color: var(--mad-ink); font-weight: 800; }
.mad-faq-filter:hover, .mad-faq-filter.is-active { border-color: var(--mad-green); background: var(--mad-green); color: #fff; }
.mad-faq-list { display: grid; gap: 14px; }
.mad-faq-item { overflow: hidden; border: 1px solid #dce9e0; border-radius: 16px; background: #fff; box-shadow: 0 12px 30px rgba(0,79,42,.06); }
.mad-faq-question { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 19px 22px; border: 0; background: #fff; color: var(--mad-ink); text-align: left; font-size: 15px; font-weight: 800; cursor: pointer; }
.mad-faq-question i { color: var(--mad-orange); transition: transform .2s ease; }
.mad-faq-item.is-open .mad-faq-question i { transform: rotate(45deg); }
.mad-faq-answer { display: none; padding: 0 22px 22px; color: #66736b; font-size: 14px; line-height: 1.8; white-space: pre-line; }
.mad-faq-item.is-open .mad-faq-answer { display: block; }

.mad-newsletter-feedback { display: block; margin-top: 9px; font-size: 12px; font-weight: 700; }
.mad-newsletter-feedback.success { color: #dfffe9; }
.mad-newsletter-feedback.error { color: #ffd5d5; }

@media (max-width: 767px) {
    .mad-page-hero { padding: 125px 0 62px; }
    .mad-section { padding: 58px 0; }
}

/* Compact branded mobile-app promotion. */
.mad-app-section {
    position: relative;
    min-height: 330px;
    padding: 48px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 20%, rgba(244,196,0,.18), transparent 24%),
        radial-gradient(circle at 88% 72%, rgba(216,36,47,.14), transparent 22%),
        linear-gradient(125deg, #004f2a 0%, #007a3d 58%, #0a9851 100%);
}
.mad-app-section .row { display: flex; align-items: center; }
.mad-app-copy { position: relative; z-index: 2; padding: 10px 0; }
.mad-app-copy h3 { margin: 0 0 12px; color: #fff; font-size: clamp(30px, 4vw, 44px); }
.mad-app-copy p { max-width: 560px; margin: 0 0 22px; color: rgba(255,255,255,.86); font-size: 14px; line-height: 1.75; }
.mad-app-badge-row { display: flex; flex-wrap: wrap; gap: 12px; }
.mad-app-btn { display: inline-flex; align-items: center; gap: 11px; min-width: 174px; padding: 11px 18px; border-radius: 999px; background: #fff; color: #17442d; font-size: 12px; font-weight: 800; box-shadow: 0 14px 32px rgba(0,0,0,.14); }
.mad-app-btn i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--mad-gold); color: var(--mad-deep-green); font-size: 17px; }
.mad-app-btn:hover { transform: translateY(-3px); color: var(--mad-red); }
.mad-app-visual { position: relative; z-index: 2; height: 245px; display: flex; align-items: center; justify-content: center; }
.mad-app-visual > img { width: min(100%, 485px); max-height: 245px; object-fit: contain; filter: drop-shadow(0 24px 26px rgba(0,0,0,.25)); }
.mad-app-logo-card { position: absolute; right: 13%; top: 5%; width: 130px; padding: 11px; border-radius: 16px; background: #fff; box-shadow: 0 18px 38px rgba(0,0,0,.22); }
.mad-app-logo-card img { width: 100%; height: 68px; object-fit: contain; }
.mad-app-accent { position: absolute; border-radius: 50%; pointer-events: none; }
.mad-app-accent.one { width: 170px; height: 170px; left: -55px; bottom: -75px; border: 35px solid rgba(244,196,0,.12); }
.mad-app-accent.two { width: 145px; height: 145px; right: 2%; top: -50px; border: 30px solid rgba(216,36,47,.11); }
@media (max-width: 767px) {
    .mad-app-section { min-height: 0; padding: 48px 0 36px; text-align: center; }
    .mad-app-section .row { display: block; }
    .mad-app-copy p { margin-left: auto; margin-right: auto; }
    .mad-app-badge-row { justify-content: center; }
    .mad-app-visual { height: 210px; margin-top: 22px; }
    .mad-app-visual > img { max-height: 205px; }
    .mad-app-logo-card { right: 6%; width: 100px; }
}