:root{
  /* Logo-matched brand palette */
  --brand-blue:#0b3d90;
  --brand-blue-dark:#09307c;
  --brand-blue-soft:#eaf2ff;
  --brand-green:#0b9447;
  --brand-green-dark:#08763a;
  --brand-green-soft:#eaf8ef;
  --brand-ink:#102d5a;
  --brand-muted:#627089;
  --brand-paper:#ffffff;
  --brand-bg:#f7faff;
  --brand-line:#dce6f4;

  /* Remap the original theme variables so the whole page follows the logo */
  --ink:var(--brand-ink);
  --teal:var(--brand-blue);
  --mint:#8fb6ef;
  --aqua:var(--brand-blue-soft);
  --cream:var(--brand-bg);
  --paper:var(--brand-paper);
  --blue:#edf4ff;
  --gold:var(--brand-green);
  --coral:var(--brand-green);
  --muted:var(--brand-muted);
  --line:var(--brand-line);
  --shadow:0 24px 60px rgba(11,61,144,.12);

  --fs-xs:.75rem;
  --fs-sm:.875rem;
  --fs-base:1rem;
  --fs-md:1.125rem;
  --fs-lg:1.5rem;
  --fs-xl:2rem;

  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:18px;
  --radius-xl:24px;
  --radius-pill:999px;
}

.live-doctor-details{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:28px;align-items:start}.live-doctor-details>div{background:#fff;border:1px solid rgba(15,118,110,.16);border-radius:24px;padding:28px;box-shadow:0 18px 45px rgba(15,23,42,.06)}.live-doctor-details h3{margin:0 0 16px;font-size:1.2rem}.live-schedule p{display:flex;justify-content:space-between;gap:20px;margin:0;padding:14px 0;border-bottom:1px solid rgba(15,23,42,.09)}.live-schedule p:last-child{border-bottom:0}.live-schedule span{text-align:right;color:#475569}.live-booking-card .button{width:100%;justify-content:center;margin:18px 0 8px}.profile-card dd a{color:inherit;text-decoration:none}@media(max-width:720px){.live-doctor-details{grid-template-columns:1fr}.live-doctor-details>div{padding:22px}.live-schedule p{display:block}.live-schedule span{display:block;text-align:left;margin-top:5px}}

/* Overall page: white, blue and green like the logo */
body{
  background:var(--brand-bg);
  color:var(--brand-ink);
  font-size:var(--fs-base);
}
body:before{
  background:
    radial-gradient(circle at 10% 10%,rgba(11,61,144,.08) 0 8%,transparent 27%),
    radial-gradient(circle at 92% 12%,rgba(11,148,71,.08) 0 8%,transparent 26%),
    linear-gradient(180deg,#fff 0,#f8fbff 48%,#f4f9ff 100%);
}

/* Typography: match the bold sans-serif character of the logo */
.hero h1,
h2,
.doctor-card-name,
.doctor-mark,
.step-number{
  font-family:'DM Sans',sans-serif;
  letter-spacing:-.045em;
}
.hero h1{font-weight:800;line-height:.98}
.hero h1 em{color:var(--brand-green);font-style:normal;font-weight:800}
.section-heading h2,.doctor h2,.process h2,.booking h2,.pharmacy h2,.visit h2{font-weight:800}

/* Header brand lockup */
.site-header{background:rgba(255,255,255,.9);backdrop-filter:blur(14px)}
.brand{gap:12px;color:var(--brand-blue-dark)}
.brand-logo{
  width:52px;
  height:52px;
  object-fit:cover;
  border-radius:50%;
  border:2px solid rgba(11,61,144,.16);
  background:#fff;
  box-shadow:0 8px 24px rgba(11,61,144,.10);
}
.brand span{
  display:flex;
  flex-direction:column;
  gap:2px;
  line-height:1;
  font-size:0;
}
.brand span::before{
  content:'MODERN';
  color:var(--brand-blue);
  font-size:20px;
  font-weight:800;
  letter-spacing:.035em;
}
.brand span::after{
  content:'PHARMACY & CLINIC';
  color:var(--brand-green);
  font-size:10px;
  font-weight:800;
  letter-spacing:.06em;
}
.brand span b{display:none}
nav a,.button,.text-link{font-size:var(--fs-sm)}
nav a{color:var(--brand-ink)}
nav a:hover{color:var(--brand-blue)}
.nav-cta{
  background:var(--brand-blue);
  color:#fff!important;
  box-shadow:0 10px 24px rgba(11,61,144,.18);
}
.nav-cta:hover{background:var(--brand-blue-dark)}

/* Hero */
.eyebrow{font-size:.8125rem;line-height:1.4;color:var(--brand-green);letter-spacing:.14em}
.lead,.doctor-card p,.slot-chip span,.floating small,.trust-strip small,.service-grid p,.doctor-content>p,.process-grid p,.doctor-facts span,.pharmacy>div>p,.qr-card small{color:var(--brand-muted)}
.button-primary{
  background:var(--brand-blue);
  color:#fff;
  box-shadow:0 11px 26px rgba(11,61,144,.22);
}
.button-primary:hover{background:var(--brand-blue-dark)}
.button-secondary{
  background:#fff;
  color:var(--brand-green);
  border:1px solid rgba(11,148,71,.28);
  box-shadow:0 10px 25px rgba(11,61,144,.06);
}
.button-secondary:hover{border-color:var(--brand-green);background:var(--brand-green-soft)}
.hero-meta{
  background:rgba(255,255,255,.94);
  border-color:var(--brand-line);
  box-shadow:0 14px 40px rgba(11,61,144,.07);
}
.hero-meta span,.slot-chip span,.floating small,.trust-strip small,.doctor-facts span,.booking-note p,.form-note,.qr-card small{font-size:var(--fs-xs)}
.hero-meta b,.doctor-card p,.floating b,.trust-strip b,.doctor-facts b,.form-head b,.booking-form label,input,select,textarea{font-size:var(--fs-sm)}

.hero-visual{isolation:isolate}
.visual-glow{
  background:linear-gradient(145deg,#dce9ff,#e8f8ee);
  filter:drop-shadow(20px 25px 0 #eef5ff);
}
.visual-glow:after{border-color:rgba(11,61,144,.24)}
.doctor-card{border:1px solid rgba(11,61,144,.08);box-shadow:0 28px 70px rgba(11,61,144,.15)}
.doctor-avatar{
  background:linear-gradient(145deg,var(--brand-blue-soft),#fff);
  color:var(--brand-blue);
  font-family:'DM Sans',sans-serif;
  font-weight:800;
  box-shadow:6px 6px 0 var(--brand-green-soft);
}
.availability-pill{color:var(--brand-green-dark);background:var(--brand-green-soft)}
.ecg-line{color:var(--brand-green)}
.slot-chip{background:#f3f7fd;border:1px solid #e3ebf6}
.floating{border-color:#e3ebf6;box-shadow:0 18px 40px rgba(11,61,144,.12)}
.medical-cross{
  background:var(--brand-blue);
  color:#fff;
  box-shadow:6px 6px 0 var(--brand-green-soft);
}

/* Trust strip */
.trust-strip article{
  border-color:var(--brand-line);
  box-shadow:0 10px 32px rgba(11,61,144,.055);
}
.trust-icon{background:var(--brand-blue-soft);color:var(--brand-blue)}
.trust-strip article:nth-child(even) .trust-icon{background:var(--brand-green-soft);color:var(--brand-green)}

/* Services: strong blue band with green accents */
.services{
  background:linear-gradient(135deg,#0b3d90 0%,#082f72 60%,#0b9447 150%);
  color:#fff;
}
.services .eyebrow{color:#9ee2b7}
.service-grid{gap:22px}
.service-grid article{
  background:#fff;
  color:var(--brand-ink);
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 18px 40px rgba(4,25,66,.10);
}
.service-grid article:nth-child(2){background:var(--brand-green-soft)}
.service-grid article:nth-child(3){background:var(--brand-blue-soft)}
.service-icon{background:#fff}
.service-icon svg{stroke:var(--brand-blue)}
.service-grid article:nth-child(2) .service-icon svg{stroke:var(--brand-green)}
.service-grid p,.doctor-content>p,.process-grid p,.booking-intro>p,.pharmacy>div>p{font-size:var(--fs-base)}
.service-grid h3,.process-grid h3{font-size:var(--fs-md)}

/* Doctor section */
.doctor{gap:clamp(28px,4vw,48px)}
.doctor-orbit{border-color:rgba(11,61,144,.24)}
.doctor-mark{
  background:linear-gradient(145deg,var(--brand-blue),var(--brand-blue-dark));
  color:#fff;
  box-shadow:-16px 16px 0 var(--brand-green-soft);
}
.doctor-plus{background:var(--brand-green);color:#fff}
.doctor-title{color:var(--brand-green)!important}
.doctor-facts span{border-color:var(--brand-line);box-shadow:0 8px 20px rgba(11,61,144,.035)}

/* Process */
.process{background:linear-gradient(180deg,#eef5ff 0,#f8fbff 100%)}
.process-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;width:100%}
.process-grid article{border-color:var(--brand-line);box-shadow:0 10px 30px rgba(11,61,144,.04)}
.step-number{color:#a8bbd6;opacity:1;font-weight:800}
.step-graphic{background:var(--brand-blue-soft);color:var(--brand-blue)}
.process-grid article:nth-child(even) .step-graphic{background:var(--brand-green-soft);color:var(--brand-green)}
.pay-graphic{background:var(--brand-blue-soft)!important;color:var(--brand-blue)!important}
.confirm-graphic{background:var(--brand-green-soft)!important;color:var(--brand-green)!important}

/* Booking: blue foundation, green conversion accents */
.booking{
  background:linear-gradient(135deg,#082f72 0%,#0b3d90 68%,#075f36 145%);
  color:#fff;
}
.booking .eyebrow{color:#a8edbf}
.booking-intro>p{color:#dce8f9}
.fee-card{
  background:#062659;
  box-shadow:6px 6px 0 var(--brand-green);
}
.fee-card span,.fee-card small{color:#d8e6f8}
.booking-note{border-color:#ffffff35;background:#ffffff10}
.booking-note p{color:#dce8f9}
.booking-form{background:#ffffff12;border-color:#ffffff32;box-shadow:0 24px 55px rgba(3,22,57,.18)}
.form-head{border-color:#ffffff2c}
.form-head span,.form-note{color:#d8e6f8}
.optional{color:#cae1ff}
input,select,textarea{border-color:#c8d8ee;color:var(--brand-ink)}
input:focus,select:focus,textarea:focus{border-color:#67c989;box-shadow:0 0 0 3px rgba(11,148,71,.18)}
#booking-form .button-primary{background:var(--brand-green);color:#fff!important;box-shadow:0 11px 26px rgba(5,60,30,.25)}
#booking-form .button-primary:hover{background:var(--brand-green-dark)}

/* Pharmacy */
.pharmacy{background:linear-gradient(120deg,#eef5ff 0%,#f2fbf5 100%)}
#pharmacy .text-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  margin-top:26px;
  padding:13px 18px;
  background:var(--brand-green);
  color:#fff;
  border-radius:var(--radius-pill);
  text-decoration:none;
  font-weight:800;
  box-shadow:0 10px 25px rgba(11,148,71,.20);
}
#pharmacy .text-link:hover{background:var(--brand-green-dark);transform:translateY(-1px)}
.qr-card{box-shadow:12px 12px 0 var(--brand-blue-soft),0 18px 50px rgba(11,61,144,.10)}
.qr-glow{background:var(--brand-green-soft)}

/* Visit / location */
.visit{
  background:linear-gradient(125deg,#eaf2ff,#edf9f1);
  border:1px solid var(--brand-line);
  box-shadow:0 24px 55px rgba(11,61,144,.07);
}
.map-art{border-color:var(--brand-blue)}
.map-art span{background:var(--brand-green)}
.review-widget{box-shadow:0 10px 30px rgba(11,61,144,.08)}
.visit-details a{color:var(--brand-blue)}

/* Floating WhatsApp stays intentionally green */
.floating-whatsapp{
  right:max(24px,env(safe-area-inset-right));
  bottom:max(24px,env(safe-area-inset-bottom));
  background:var(--brand-green);
  box-shadow:0 12px 32px rgba(7,89,42,.25);
}
.floating-whatsapp span{color:var(--brand-green)}

/* Footer and modal */
footer>a:not(.brand){color:var(--brand-blue);font-weight:700}
dialog{background:#f8fbff;color:var(--brand-ink);box-shadow:0 24px 70px rgba(6,38,89,.38)}
dialog::backdrop{background:rgba(5,31,72,.72)}
.payment-badge{background:var(--brand-blue-soft);color:var(--brand-blue)}

/* Shared component cleanup */
.hero-meta,.trust-strip article,.service-grid article,.doctor-facts span,.fee-card,.booking-note{border-radius:var(--radius-lg)}
.slot-chip,.floating,.booking-form,.qr-card{border-radius:var(--radius-xl)}
input,select,textarea{border-radius:var(--radius-sm)}
.button,.nav-cta,.availability-pill,.floating-whatsapp{border-radius:var(--radius-pill)}
#doctor .eyebrow,#booking-form .form-head span{text-transform:none}
.nav-cta:focus-visible,.button:focus-visible,.text-link:focus-visible,.floating-whatsapp:focus-visible{outline:3px solid #8fb6ef;outline-offset:3px}

@media(max-width:900px){
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:720px){
  .brand-logo{width:44px;height:44px}
  .brand span::before{font-size:17px}
  .brand span::after{font-size:8px}
  nav{border-color:var(--brand-line);box-shadow:0 16px 40px rgba(11,61,144,.12)}
}

@media(max-width:600px){
  .process-grid{grid-template-columns:1fr}
  .floating-whatsapp{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom))}
}
