:root{
  --green:#56d600;
  --blue:#1236d8;
  --dark:#12213a;
  --light:#f5fbff;
  --text:#4b5870;
  --white:#fff;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;color:var(--text);line-height:1.6;background:#fff}
a{text-decoration:none;color:inherit}
.container{width:min(1120px,92%);margin:auto}
.topbar{background:var(--dark);color:#fff;font-size:14px;padding:8px 0}
.topbar .container{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
header{background:#fff;box-shadow:0 3px 15px rgba(0,0,0,.08);position:sticky;top:0;z-index:1000}
.nav{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.logo{height:68px;width:auto}
.nav-links{display:flex;gap:26px;align-items:center}
.nav-links a{font-weight:700;color:var(--dark);padding:10px 0}
.nav-links a:hover,.nav-links a.active{color:var(--blue)}
.btn{display:inline-block;padding:12px 22px;border-radius:28px;background:var(--blue);color:#fff;font-weight:700;border:0;cursor:pointer}
.btn:hover{background:#0c26a5}
.menu-btn{display:none;background:none;border:0;font-size:28px;color:var(--dark)}
.hero{background:linear-gradient(115deg,#eefcf0,#eef4ff);padding:90px 0}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:50px;align-items:center}
.hero h1{font-size:52px;line-height:1.12;color:var(--dark);margin-bottom:20px}
.hero h1 span{color:var(--green)}
.hero p{font-size:18px;max-width:620px;margin-bottom:28px}
.hero-card{background:#fff;padding:30px;border-radius:22px;box-shadow:0 15px 40px rgba(18,54,216,.12)}
.hero-card h3{color:var(--dark);margin-bottom:15px}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:-35px;position:relative}
.quick-card{background:#fff;border-radius:15px;padding:24px;box-shadow:0 8px 28px rgba(0,0,0,.1)}
.quick-card h3{color:var(--dark);margin-bottom:5px}
.section{padding:75px 0}
.section.alt{background:var(--light)}
.section-title{text-align:center;margin-bottom:42px}
.section-title h2{font-size:36px;color:var(--dark);margin-bottom:8px}
.section-title p{max-width:650px;margin:auto}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.card{background:#fff;border-radius:16px;padding:28px;box-shadow:0 8px 25px rgba(0,0,0,.07)}
.icon{width:55px;height:55px;border-radius:14px;background:#e9fbe3;color:var(--green);display:grid;place-items:center;font-size:25px;margin-bottom:18px}
.card h3{color:var(--dark);margin-bottom:10px}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.about-image{background:linear-gradient(135deg,var(--blue),var(--green));min-height:330px;border-radius:24px;display:grid;place-items:center;color:#fff;text-align:center;padding:35px}
.about-image strong{font-size:44px;display:block}
.doctor{overflow:hidden;text-align:center;padding:0 0 22px}
.doctor .photo{height:210px;background:linear-gradient(135deg,#dff6ff,#eefbe8);display:grid;place-items:center;font-size:70px;color:var(--blue)}
.doctor h3{color:var(--dark);margin:18px 0 3px}
.badge{display:inline-block;background:#edf1ff;color:var(--blue);padding:5px 12px;border-radius:20px;font-size:13px}
.page-hero{background:linear-gradient(120deg,#0d2cae,#5bd800);color:#fff;padding:65px 0;text-align:center}
.page-hero h1{font-size:44px;margin-bottom:8px}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:35px}
.contact-item{display:flex;gap:15px;margin-bottom:20px}
.contact-item strong{display:block;color:var(--dark)}
form{background:#fff;padding:30px;border-radius:18px;box-shadow:0 8px 30px rgba(0,0,0,.08)}
input,textarea,select{width:100%;padding:13px 15px;margin:7px 0 15px;border:1px solid #d8dfeb;border-radius:8px;font:inherit}
textarea{min-height:130px;resize:vertical}
footer{background:var(--dark);color:#cbd4e3;padding:50px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
footer h3{color:#fff;margin-bottom:14px}
footer a{display:block;margin:7px 0}
.copyright{text-align:center;border-top:1px solid #33415a;margin-top:30px;padding-top:18px;font-size:14px}
.notice{background:#eafbf0;border-left:4px solid var(--green);padding:15px 18px;border-radius:7px;margin-top:20px}

/* Full-width home carousel */
.full-carousel{width:100%;position:relative;overflow:hidden;background:#eef4ff}
.full-carousel .carousel{border-radius:0;box-shadow:none;width:100%;}
.full-carousel .carousel-slide{height:clamp(360px,48vw,650px)}
.full-carousel .carousel-slide img{width:100%;height:100%;object-fit:cover}
.full-carousel .carousel-overlay{position:absolute;inset:0;display:flex;align-items:center;background:linear-gradient(90deg,rgba(9,25,55,.72),rgba(9,25,55,.15) 65%,transparent)}
.full-carousel .carousel-copy{width:min(1120px,92%);margin:auto;color:#fff;padding-right:42%}
.full-carousel .carousel-copy h1{font-size:clamp(34px,5vw,64px);line-height:1.08;margin-bottom:15px}
.full-carousel .carousel-copy p{font-size:clamp(16px,2vw,22px);margin-bottom:22px}
.section .card,.quick-card,.doctor{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.section .card:hover,.quick-card:hover,.doctor:hover{transform:translateY(-9px);box-shadow:0 18px 40px rgba(18,54,216,.16)}
.doctor .photo{overflow:hidden;position:relative}
.doctor .photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.doctor:hover .photo img{transform:scale(1.06)}
.patient-feature{display:grid;grid-template-columns:1.05fr .95fr;gap:45px;align-items:center}
.patient-photo{border-radius:24px;overflow:hidden;box-shadow:0 15px 40px rgba(0,0,0,.12)}
.patient-photo img{display:block;width:100%;height:390px;object-fit:cover;transition:transform .5s ease}
.patient-photo:hover img{transform:scale(1.04)}
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:25px}
.feature-list .card{padding:20px}
.stat-strip{background:var(--blue);color:#fff;padding:35px 0}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.stats strong{display:block;font-size:34px;color:#fff}.stats span{font-size:14px;opacity:.9}
@media(max-width:850px){.full-carousel .carousel-copy{padding-right:20%}.patient-feature{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}}
@media(max-width:550px){.full-carousel .carousel-copy{padding-right:5%}.full-carousel .carousel-slide{height:500px}.full-carousel .carousel-overlay{background:rgba(9,25,55,.55)}.feature-list{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}}

@media(max-width:850px){
 .nav-links{display:none;position:absolute;left:0;right:0;top:88px;background:#fff;flex-direction:column;padding:20px;box-shadow:0 10px 20px rgba(0,0,0,.08)}
 .nav-links.show{display:flex}.menu-btn{display:block}
 .hero-grid,.about-grid,.contact-grid{grid-template-columns:1fr}
 .hero h1{font-size:40px}.quick-grid,.grid-3,.grid-4{grid-template-columns:1fr 1fr}
 .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:550px){
 .quick-grid,.grid-3,.grid-4,.footer-grid{grid-template-columns:1fr}
 .hero{padding:60px 0}.section{padding:55px 0}.hero h1{font-size:34px}
 .page-hero h1{font-size:34px}
}

.carousel{position:relative;overflow:hidden;border-radius:24px;box-shadow:0 15px 40px rgba(18,54,216,.14);background:#eef4ff}
.carousel-track{display:flex;transition:transform .6s ease}
.carousel-slide{min-width:100%;position:relative}
.carousel-slide img{display:block;width:100%;height:auto}
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.9);color:var(--blue);font-size:28px;cursor:pointer;z-index:2;box-shadow:0 5px 15px rgba(0,0,0,.12)}
.carousel-btn.prev{left:18px}.carousel-btn.next{right:18px}
.carousel-dots{position:absolute;left:0;right:0;bottom:16px;text-align:center;z-index:3}
.carousel-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:#fff;opacity:.6;border:0;margin:0 5px;padding:0;cursor:pointer}
.carousel-dot.active{opacity:1;transform:scale(1.25);background:var(--green)}
@media(max-width:700px){.carousel-btn{width:38px;height:38px;font-size:22px}.carousel-slide img{min-height:260px;object-fit:cover}}

.card:hover .icon{transform:rotate(5deg) scale(1.08);background:#dff8d5}.icon{transition:transform .3s ease,background .3s ease}


/* Google Maps section */
.map-section{padding-top:10px}.map-wrapper{overflow:hidden;border-radius:18px;box-shadow:0 12px 30px rgba(0,0,0,.12);background:#fff}.map-wrapper iframe{display:block;width:100%;min-height:450px}@media(max-width:700px){.map-wrapper iframe{min-height:350px}}

/* Doctor consultation schedule */
.table-wrap{overflow-x:auto;background:#fff;border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.schedule-table{width:100%;border-collapse:collapse;min-width:850px}
.schedule-table th{background:var(--dark);color:#fff;text-align:left;padding:16px 14px}
.schedule-table td{padding:16px 14px;border-bottom:1px solid #e5eaf2;vertical-align:middle}
.schedule-table tbody tr{transition:background .2s ease}
.schedule-table tbody tr:hover{background:#f3fbff}
.small-btn{display:inline-block;background:var(--green);color:#fff;padding:8px 13px;border-radius:20px;font-size:13px;font-weight:700}
.small-btn:hover{background:#3fb000}
.schedule-link{display:inline-block;margin-top:10px;color:var(--blue);font-size:13px;font-weight:700}
.consult-actions{display:flex;justify-content:center;gap:15px;margin-top:28px;flex-wrap:wrap}
.secondary-btn{background:var(--green)}
.secondary-btn:hover{background:#3fb000}
.social-strip{background:#0c192d;color:#dce5f2;padding:14px 0}
.social-strip .container{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}
.social-strip a{display:inline-block!important;margin:0!important;font-weight:700;color:#fff}
.social-strip a:hover{color:var(--green)}
.social-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.social-card{background:#fff;border-radius:18px;padding:25px;box-shadow:0 10px 30px rgba(0,0,0,.08);min-height:520px}
.social-card h3{color:var(--dark);font-size:24px;margin-bottom:6px}
.social-card p{margin-bottom:18px}
@media(max-width:850px){.social-grid{grid-template-columns:1fr}.social-card{min-height:auto}}


.appointment-btn {
    background: linear-gradient(135deg, #05e82b, #50f43b);
    color: #ffffff;
    padding: 14px 28px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(5, 234, 17, 0.25);
}

.appointment-btn:hover {
    background: linear-gradient(135deg, #3de781, #087f8c);
    transform: translateY(-3px);
    box-shadow: 0 8px 18px rgba(235, 7, 220, 0.35);
}


/* Click Effect */
.appointment-btn:active {
    transform: translateY(0);
}

/* Keyboard Accessibility */
.appointment-btn:focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 4px;
}