/*
 * WallRouter Theme Override
 * Primary  : #ff6b35  (orange  — logo icon background)
 * Secondary: #e8521a  (dark orange — hover / depth)
 * Accent   : #2d8f2d  (deep green — logo tagline / CTA alternate)
 * Light    : #81bf20  (lime green  — already used for Login btn)
 * Neutral  : #1a1a2e  (near-black navy for header bg)
 * White    : #ffffff
 */

/* ─── CSS Variables ─────────────────────────────────────────── */
:root {
    --wr-orange:      #ff6b35;
    --wr-orange-dark: #e8521a;
    --wr-green:       #2d8f2d;
    --wr-lime:        #81bf20;
    --wr-navy:        #1a1a2e;
    --wr-white:       #ffffff;
    --wr-light-bg:    #fff8f5;
    --wr-gray:        #f5f5f5;
}

/* ─── HEADER ─────────────────────────────────────────────────── */
.main-header,
.main-header.home-5 {
    background: var(--wr-white) !important;
    border-bottom: 3px solid var(--wr-orange);
    box-shadow: 0 2px 16px rgba(255,107,53,0.10);
}

.main-header .navigation > li > a,
.main-header .navigation li a {
    color: var(--wr-navy) !important;
    font-weight: 600;
    transition: color 0.2s;
}
.main-header .navigation > li > a:hover,
.main-header .navigation > li.current > a {
    color: var(--wr-orange) !important;
}

/* Sticky header */
.sticky-header {
    background: var(--wr-white) !important;
    border-bottom: 3px solid var(--wr-orange);
    box-shadow: 0 2px 16px rgba(255,107,53,0.12);
}

/* Mobile menu */
.mobile-menu .menu-box {
    background: var(--wr-navy) !important;
}
.mobile-menu .navigation li a {
    color: var(--wr-white) !important;
}
.mobile-menu .navigation li a:hover {
    color: var(--wr-orange) !important;
}
.mobile-menu .close-btn {
    color: var(--wr-orange) !important;
}

/* ─── BUTTONS ────────────────────────────────────────────────── */
.theme-btn-two {
    background: var(--wr-orange) !important;
    border-color: var(--wr-orange) !important;
    color: var(--wr-white) !important;
    transition: background 0.25s, transform 0.2s !important;
}
.theme-btn-two:hover {
    background: var(--wr-orange-dark) !important;
    border-color: var(--wr-orange-dark) !important;
    color: var(--wr-white) !important;
    transform: translateY(-2px);
}

/* Login button stays lime-green */
a.theme-btn-two[href="login.php"],
a.theme-btn-two[style*="#81bf20"] {
    background: var(--wr-lime) !important;
    border-color: var(--wr-lime) !important;
}
a.theme-btn-two[href="login.php"]:hover,
a.theme-btn-two[style*="#81bf20"]:hover {
    background: var(--wr-green) !important;
    border-color: var(--wr-green) !important;
}

/* ─── BANNER / HERO ──────────────────────────────────────────── */
.banner-style-five {
    background: linear-gradient(135deg, #fff8f5 0%, #fff 40%, #e8f5e9 100%) !important;
}
.banner-style-five h1 {
    color: var(--wr-navy) !important;
}
.banner-style-five h1 span {
    color: var(--wr-orange) !important;
}
.banner-style-five .text {
    color: #444 !important;
}

/* ─── SECTION TITLES ─────────────────────────────────────────── */
.sec-title h2,
.sec-title h1 {
    color: var(--wr-navy) !important;
}
.sec-title .sub-title,
.sec-title span {
    color: var(--wr-orange) !important;
}

/* ─── SERVICE / HOW IT WORKS ─────────────────────────────────── */
.service-block-one .inner-box {
    border-top: 4px solid var(--wr-orange);
    transition: box-shadow 0.3s, transform 0.3s;
}
.service-block-one .inner-box:hover {
    box-shadow: 0 12px 32px rgba(255,107,53,0.18) !important;
    transform: translateY(-6px);
}
.service-block-one .icon-box {
    color: var(--wr-orange) !important;
}
.service-block-one .icon-box i,
.service-block-one .icon-box:before {
    color: var(--wr-orange) !important;
}
.service-block-one h3 a {
    color: var(--wr-navy) !important;
}
.service-block-one h3 a:hover {
    color: var(--wr-orange) !important;
}

/* ─── WHY CHOOSE SECTION ─────────────────────────────────────── */
.feature-style-four {
    background: var(--wr-light-bg) !important;
}
.feature-style-four .sec-title h2 {
    color: var(--wr-navy) !important;
}
.feature-style-four .text b {
    color: var(--wr-orange) !important;
}

/* ─── CLIENTS / PARTNERS CAROUSEL ───────────────────────────── */
.clients-style-two {
    background: var(--wr-gray) !important;
}

/* ─── WHO CAN JOIN SECTION ───────────────────────────────────── */
.about-style-three {
    background: linear-gradient(135deg, #fff8f5, #fff) !important;
}

/* ─── COUNTER SECTION ────────────────────────────────────────── */
.counter-style-three {
    background: var(--wr-navy) !important;
}
.counter-style-three .sec-title h2 {
    color: var(--wr-white) !important;
}
.counter-style-three .count-text,
.counter-style-three .text {
    color: var(--wr-white) !important;
}
.counter-style-three .inner-box {
    border-top: 3px solid var(--wr-orange);
}

/* ─── FAQ SECTION ────────────────────────────────────────────── */
.faq-section {
    background: var(--wr-white) !important;
}
.accordion-box .acc-btn {
    color: var(--wr-navy) !important;
    border-left: 4px solid transparent;
    transition: border-color 0.2s, color 0.2s;
}
.accordion-box .acc-btn.active,
.accordion-box .acc-btn:hover {
    color: var(--wr-orange) !important;
    border-left-color: var(--wr-orange) !important;
}
.accordion-box .acc-btn .icon-outer {
    color: var(--wr-orange) !important;
    border-color: var(--wr-orange) !important;
}

/* ─── FOOTER ─────────────────────────────────────────────────── */
.main-footer {
    background: var(--wr-navy) !important;
}
.main-footer .widget-title {
    color: var(--wr-orange) !important;
    border-bottom: 2px solid var(--wr-orange);
    padding-bottom: 8px;
    display: inline-block;
}
.main-footer .links-widget .list li a,
.main-footer .contact-widget .list li a,
.main-footer .about-widget .text {
    color: #ccc !important;
    transition: color 0.2s;
}
.main-footer .links-widget .list li a:hover,
.main-footer .contact-widget .list li a:hover {
    color: var(--wr-orange) !important;
}
.main-footer .contact-widget .list li i {
    color: var(--wr-orange) !important;
}
.main-footer .footer-bottom {
    border-top: 1px solid rgba(255,107,53,0.25);
}
.main-footer .copyright {
    color: #aaa !important;
}

/* Footer logo wrapper */
.footer-wallrouter-logo {
    background: rgba(255,255,255,0.08) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
}

/* ─── SCROLL TO TOP BUTTON ───────────────────────────────────── */
.scroll-top {
    background: var(--wr-orange) !important;
    border-color: var(--wr-orange) !important;
    color: var(--wr-white) !important;
}
.scroll-top:hover {
    background: var(--wr-orange-dark) !important;
}

/* ─── LINKS & MISC ───────────────────────────────────────────── */
a {
    transition: color 0.2s;
}
a:hover {
    color: var(--wr-orange);
}

/* ─── PAGE BODY ──────────────────────────────────────────────── */
body {
    background-color: var(--wr-white);
}

/* Icon boxes accent */
.flaticon-smartphone-1:before,
.flaticon-shopping:before,
.flaticon-wallet:before {
    color: var(--wr-orange) !important;
}