/* =====================================================
   GREENBANK MEDICAL — MASTER THEME
   CLEAN • NON-DUPLICATED • ELITE
===================================================== */

:root {
    --accent-color: #0B7D3B;
    --heading-color: #0E2B1A;
    --default-color: #24312B;
    --background-color: #ffffff;
    --surface-color: #ffffff;
    --contrast-color: #ffffff;
}

/* =====================================================
   GLOBAL POLISH
===================================================== */

html {
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.section-title h2 {
    letter-spacing: .5px;
}

.services .service-item,
.doctors .member,
.testimonials .testimonial-item {
    border-radius: 16px;
}

/* =====================================================
   TOPBAR
===================================================== */

.topbar {
    background: linear-gradient(135deg,rgba(11,125,59,.95),rgba(143,209,79,.95));
    color: #fff;
}

    .topbar a {
        color: #fff;
    }

/* =====================================================
   FLAGSHIP HEADER (AUTHORITATIVE)
===================================================== */

.header {
    position: sticky;
    top: 0;
    z-index: 9999;
    padding: 18px 0;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(11,125,59,.08);
    transition: all .28s ease;
}

    /* floating shadow */
    .header::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 24px;
        background: radial-gradient(ellipse at center,rgba(0,0,0,.08),transparent 70%);
        pointer-events: none;
    }

    /* scrolled state */
    .header.header-scrolled {
        padding: 10px 0;
        background: rgba(255,255,255,.96);
        box-shadow: 0 12px 28px rgba(0,0,0,.08);
    }

/* logo sizing */
.logo img {
    max-height: 52px;
    transition: max-height .25s ease;
}

.header.header-scrolled .logo img {
    max-height: 44px;
}

/* =====================================================
   NAVMENU — ELITE MEDICAL
===================================================== */

.navmenu ul {
    gap: 6px;
}

    .navmenu ul li a {
        font-weight: 600;
        font-size: 15px;
        color: #1f2937;
        padding: 12px 16px;
        border-radius: 10px;
        position: relative;
        transition: all .25s ease;
    }

        /* hover */
        .navmenu ul li a:hover {
            color: #0b7d3b !important;
            background: rgba(11,125,59,.06);
            transform: translateY(-1px);
        }

        /* active */
        .navmenu ul li a.active {
            color: #0b7d3b !important;
            background: rgba(11,125,59,.12);
        }

            /* active underline */
            .navmenu ul li a.active::after {
                content: "";
                position: absolute;
                left: 16px;
                right: 16px;
                bottom: 6px;
                height: 2px;
                border-radius: 2px;
                background: linear-gradient(90deg,#0b7d3b,#7fc857);
            }

/* dropdown caret */
.navmenu .toggle-dropdown {
    color: #24312B;
    transition: color .25s ease;
}

.navmenu li:hover > a .toggle-dropdown {
    color: #0b7d3b;
}

/* =====================================================
   CTA BUTTON — FLAGSHIP
===================================================== */

.btn-getstarted,
.btn-get-started,
.php-email-form button[type=submit] {
    border-radius: 999px !important;
    padding: 12px 24px !important;
    font-weight: 600;
    background: linear-gradient(135deg,#0b7d3b,#16a34a);
    color: #fff;
    border: none;
    box-shadow: 0 10px 26px rgba(11,125,59,.28);
    transition: all .25s ease;
}

    .btn-getstarted:hover,
    .btn-get-started:hover {
        transform: translateY(-2px);
        box-shadow: 0 16px 40px rgba(11,125,59,.38);
        color: #fff;
    }

/* =====================================================
   FORM — PREMIUM UX
===================================================== */

.form-control:focus {
    border-color: var(--accent-color);
    box-shadow: 0 0 0 .2rem rgba(11,125,59,.15);
}

.form-group-premium {
    position: relative;
}

.premium-input {
    border-radius: 12px;
    padding: 14px 16px;
    border: 1.5px solid #e2e8f0;
    transition: all .25s ease;
    background: #fff;
}

    .premium-input:hover {
        border-color: rgba(11,125,59,.45);
    }

    .premium-input:focus {
        border-color: #0b7d3b;
        box-shadow: 0 0 0 3px rgba(11,125,59,.12);
    }

    .premium-input.input-error {
        border-color: #dc3545;
        box-shadow: 0 0 0 3px rgba(220,53,69,.12);
    }

    .premium-input.input-valid {
        border-color: #0b7d3b;
    }

/* floating label */

.floating-field {
    position: relative;
}

    .floating-field label {
        position: absolute;
        left: 14px;
        top: 14px;
        font-size: 14px;
        color: #6b7280;
        background: #fff;
        padding: 0 6px;
        transition: all .25s ease;
        pointer-events: none;
    }

.premium-input:focus + label,
.premium-input:not(:placeholder-shown) + label {
    top: -8px;
    font-size: 11px;
    color: #0b7d3b;
    font-weight: 600;
}

/* success check */

.field-check {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%) scale(.6);
    color: #16a34a;
    opacity: 0;
    transition: all .25s ease;
}

.premium-input.input-valid ~ .field-check {
    opacity: 1;
    transform: translateY(-50%) scale(1);
}

/* textarea */

.auto-grow {
    resize: none;
    min-height: 140px;
    overflow: hidden;
}

textarea.auto-grow::-webkit-scrollbar {
    display: none;
}

.appointment-form-wrapper {
    padding: 32px 34px;
}

/* =====================================================
   PREMIUM SELECT (KEEP ARROW)
===================================================== */

.form-select.premium-input {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%230b7d3b' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5l6 6 6-6' stroke='%230b7d3b' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 14px;
    padding-right: 44px;
}

/* =====================================================
   FOOTER — PREMIUM (FORCED)
===================================================== */

.footer-wave {
    height: 70px;
    background: linear-gradient(to top right,transparent 49%,#0f5132 50%);
}

.footer {
    position: relative;
    background: linear-gradient(135deg,#0f5132 0%,#0b3d2a 55%,#07281c 100%) !important;
    color: #eaf7f0;
    overflow: hidden;
}

    .footer .footer-top {
        background: transparent !important;
    }

    .footer::before {
        content: "";
        position: absolute;
        top: -120px;
        right: -120px;
        width: 320px;
        height: 320px;
        background: radial-gradient(circle,rgba(127,200,87,.25) 0%,transparent 70%);
    }

    .footer::after {
        content: "";
        position: absolute;
        bottom: -140px;
        left: -140px;
        width: 360px;
        height: 360px;
        background: radial-gradient(circle,rgba(11,125,59,.25) 0%,transparent 70%);
    }

.footer-top {
    padding: 70px 0 40px;
    position: relative;
    z-index: 1;
}

.footer h4 {
    color: #fff !important;
}

.footer a {
    color: #d7f5e6 !important;
    transition: all .25s ease;
}

    .footer a:hover {
        color: #7fc857 !important;
    }

.footer-about p,
.footer-contact p,
.footer .copyright {
    color: #cfeee0 !important;
}

/* =====================================================
   MOBILE
===================================================== */

.mobile-nav-active .navmenu {
    background: rgba(255,255,255,.98);
    backdrop-filter: blur(18px);
}

.mobile-nav-toggle {
    font-size: 28px;
    transition: transform .25s ease;
}

.mobile-nav-active .mobile-nav-toggle {
    transform: rotate(90deg);
}


/* ========================================
   GREENBANK — ELITE CLINIC INFO CARD
======================================== */

.stats-card {
    padding: 30px 36px;
}

/* grid */
.clinic-info-grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

/* item */
.clinic-info-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex: 1;
}

/* icon circle */
.info-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(11,125,59,.08);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #0b7d3b;
    flex-shrink: 0;
}

/* title */
.info-title {
    font-weight: 700;
    font-size: 15px;
    color: #0e2b1a;
    margin-bottom: 4px;
}

/* text */
.info-text {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.6;
}

/* divider */
.clinic-divider {
    width: 1px;
    height: 54px;
    background: linear-gradient( to bottom, transparent, rgba(11,125,59,.18), transparent );
}

/* subtle luxury hover */
.stats-card {
    transition: all .35s ease;
}

    .stats-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 28px 70px rgba(11,125,59,.16);
    }

/* responsive */
@@media (max-width: 768px) {

    .clinic-info-grid {
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;
    }

    .clinic-divider {
        width: 100%;
        height: 1px;
    }
}

/* =========================================
   GREENBANK ELITE SCROLL PROGRESS BAR
========================================= */

.nav-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0%;
    z-index: 20000;
    background: linear-gradient(90deg,#0b7d3b,#7fc857);
    box-shadow: 0 0 12px rgba(11,125,59,.45);
    transition: width .15s linear;
    pointer-events: none;
}
/* === HERO STATS — FORCE SIZE === */
.hero-stats .stat .stat-text .number {
    font-size: 1.09rem !important;
    font-weight: 600;
    line-height: 1.2;
}

.hero-stats .stat .stat-text .label {
    font-size: 0.85rem !important;
    opacity: .8;
}

/* ========================================
   DOCTOR THUMBNAIL — PREMIUM
======================================== */

.profile-image {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    overflow: hidden;
    background: linear-gradient(135deg,#f3faf6,#e6f5ed);
    border: 1px solid rgba(11,125,59,.15);
    box-shadow: 0 6px 18px rgba(11,125,59,.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.doctor-thumb {
    width: 70%;
    height: 70%;
    object-fit: contain;
}