/* Mumbai Citiclinic: shared header and footer, used by every inner page.
   All footer rules are scoped to .site-footer so they don't clash with Bootstrap or index.css. */

/* Never wider than the screen */
.sc-page{overflow-wrap:break-word}
.sc-page .container img,.sc-page .container-fluid img{max-width:100%;height:auto}
.sc-page iframe,.sc-page video,.sc-page embed,.sc-page object{max-width:100%}
.sc-page .well>.row{margin-left:0;margin-right:0}

.sc-page .aboutus{margin-top:0}

/* ==========================================================================
   Shared header for the inner pages (body.sc-page): purple top bar + fixed
   header on the light green background. Markup: <header class="sh-header">.
   Behaviour (menu button, top bar scrolling away): js/site-header.js.
   px units throughout because Bootstrap 3 sets html font-size to 10px.
   ========================================================================== */
.sh-header{position:fixed;top:0;left:0;right:0;z-index:1030;will-change:transform;text-align:left}
.sh-header *,.sh-header *::before,.sh-header *::after{box-sizing:border-box}
.sh-wrap{max-width:1180px;margin:0 auto;padding:0 20px}

/* Top bar: location, phone, WhatsApp, email, social (tablets and desktops) */
.sh-topbar{height:40px;background:#43295f;color:#e6ddf0;font:400 14px/1.2 "Open Sans","Segoe UI",Arial,sans-serif}
.sh-topbar .sh-wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;height:40px}
.sh-topbar a{color:#fff;text-decoration:none}
.sh-topbar a:hover,.sh-topbar a:focus{color:#fff;text-decoration:underline}
.sh-info{display:flex;align-items:center;gap:22px;min-width:0;white-space:nowrap}
.sh-info span,.sh-info a{display:inline-flex;align-items:center;gap:6px}
.sh-i{width:1.25em;height:1.25em;flex:none;fill:none;stroke:#b9d6c5;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sh-i[data-fill]{fill:#b9d6c5;stroke:none}
.sh-social{display:flex;gap:6px;flex:none}
.sh-social a{display:inline-flex;width:32px;height:32px;align-items:center;justify-content:center;border-radius:50%}
.sh-social a:hover,.sh-social a:focus{background:rgba(255,255,255,.12);text-decoration:none}
.sh-social .sh-i{stroke:#fff}
.sh-social .sh-i[data-fill]{fill:#fff}
@media (max-width:1024px){.sh-info>span{display:none}}   /* drop the location so the bar fits one row */
@media (max-width:767px){.sh-topbar{display:none}}

/* Main header row: logo left, menu right */
.sh-main{background:#e9f6ee url(../img/citiclinic/navbackground.jpg) center/cover;border-bottom:1px solid #d6e6dc;box-shadow:0 2px 10px rgba(36,26,49,.06);font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
.sh-main .sh-wrap{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;height:80px}
.sh-brand{display:block;padding:4px 0;flex:none}
.sh-brand img{display:block;width:180px;height:auto;max-width:none}
.sh-nav ul{list-style:none;display:flex;align-items:center;gap:2px;margin:0;padding:0}
.sh-nav li{margin:0;padding:0;float:none}
.sh-nav a{display:block;padding:8px 11px;color:#2c2a31;text-decoration:none;font-weight:500;font-size:15px;line-height:1.5;white-space:nowrap;border-bottom:2px solid transparent;background:none}
.sh-nav a:hover,.sh-nav a:focus{color:#5b3e78;text-decoration:none;border-bottom-color:#7ba786}
.sh-nav a[aria-current="page"]{color:#5b3e78;border-bottom-color:#5b3e78}
.sh-nav a:focus-visible,.sh-toggle:focus-visible{outline:2px solid #5b3e78;outline-offset:2px}
.sh-toggle{display:none;align-items:center;justify-content:center;padding:8px;margin:0;background:rgba(255,255,255,.6);border:1px solid #d6d1dd;border-radius:4px;color:#5b3e78;cursor:pointer}
.sh-toggle svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
@media (min-width:1081px) and (max-width:1280px){
  .sh-nav a{padding:8px 7px;font-size:14.4px}
  .sh-brand img{width:160px}
}
/* 1080px and below: menu button + drop-down panel */
@media (max-width:1080px){
  .js .sh-toggle{display:inline-flex}
  .js .sh-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#f4faf6;border-bottom:1px solid #d6e6dc;box-shadow:0 10px 28px rgba(36,26,49,.12);max-height:calc(100vh - 80px);overflow-y:auto}
  .js .sh-nav.open{display:block}
  .sh-nav ul{flex-direction:column;align-items:stretch;padding:10px 20px 18px}
  .sh-nav a{padding:12px;border-bottom:1px solid #dfe9e2}
  .sh-nav a[aria-current="page"]{border-bottom-color:#dfe9e2}
  .sh-brand img{width:170px}
}
@media (max-width:420px){.sh-brand img{width:146px}}
.sh-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* Content starts below the header: 81px header row (+ 40px top bar from 768px up) */
.sc-page{padding-top:81px}
@media (min-width:768px){.sc-page{padding-top:121px}}

/* Floating quick actions (book / WhatsApp / call), bottom-right on every page (markup at the end of each page) */
.quick-actions {
    position: fixed; right: 18px; bottom: 18px; z-index: 1020;
    display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
}
.qa-btn {
    position: relative; display: flex; align-items: center; justify-content: center;
    width: 54px; height: 54px; border-radius: 50%; color: #ffffff; text-decoration: none;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25); transition: transform .2s, box-shadow .2s;
}
.qa-btn svg { width: 26px; height: 26px; }
.qa-book { background: #5b3e78; }
.qa-wa { background: #25d366; }
.qa-call { background: #466e52; }
.qa-btn:hover, .qa-btn:focus { color: #ffffff; text-decoration: none; transform: scale(1.08); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3); }
.qa-btn:focus-visible { outline: 3px solid #7ba786; outline-offset: 3px; }
.qa-label {
    position: absolute; right: 64px; top: 50%; transform: translate(6px, -50%);
    white-space: nowrap; padding: 8px 13px; border-radius: 18px;
    background: #ffffff; color: #333333; font: 600 13px/1 "Open Sans", Arial, sans-serif;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s;
}
.qa-btn:hover .qa-label, .qa-btn:focus-visible .qa-label { opacity: 1; transform: translate(0, -50%); }
.qa-wa::after {
    content: ""; position: absolute; inset: 0; border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.55); animation: qa-pulse 2.4s ease-out infinite;
}
@keyframes qa-pulse { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.55); } 70%, 100% { box-shadow: 0 0 0 14px rgba(37, 211, 102, 0); } }
@media (prefers-reduced-motion: reduce) { .qa-wa::after { animation: none; } .qa-btn, .qa-label { transition: none; } }
@media (hover: none) { .qa-label { display: none; } }
@media (max-width: 767px) {
    .quick-actions { right: 12px; bottom: 12px; gap: 10px; }
    .qa-btn { width: 48px; height: 48px; }
    .qa-btn svg { width: 23px; height: 23px; }
}
/* Large screens: a row, so the stack never covers the service tabs on shorter laptop screens; labels pop up above */
@media (min-width: 1200px) {
    .quick-actions { flex-direction: row; align-items: center; }
    .qa-label { right: 50%; top: auto; bottom: 64px; transform: translate(50%, 6px); }
    .qa-btn:hover .qa-label, .qa-btn:focus-visible .qa-label { transform: translate(50%, 0); }
}
@media print { .quick-actions { display: none; } }

/* Footer */
.site-footer{margin:0;clear:both;background:#241a31;color:#c3bacd;text-align:left;font:15px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif}
.site-footer *,.site-footer *::before,.site-footer *::after{box-sizing:border-box}
.site-footer .sf-wrap{max-width:1180px;margin:0 auto;padding-inline:20px}
.site-footer .sf-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:28px;padding-block:40px 26px}
@media (max-width:900px){.site-footer .sf-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.site-footer .sf-grid{grid-template-columns:1fr}}
.site-footer h2{margin:0 0 12px;font-family:inherit;font-size:.8em;font-weight:700;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;color:#b9d6c5}
.site-footer p{margin:0 0 12px}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.site-footer li{margin:0}
.site-footer address{margin:0;font-style:normal;line-height:1.6}
.site-footer a{color:#e7e1ee;background:transparent;text-decoration:none}
.site-footer a:hover,.site-footer a:focus{color:#fff;text-decoration:underline}
.site-footer img{display:block;max-width:100%;height:auto;border:0}
.site-footer .sf-logo{display:inline-block;margin-bottom:12px;padding:8px 12px;background:#fff}
.site-footer .sf-logo img{width:146px;height:60px}
.site-footer .sf-social{display:flex;gap:6px;margin-top:16px}
.site-footer .sf-social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);color:#fff}
.site-footer .sf-social a:hover,.site-footer .sf-social a:focus{background:rgba(255,255,255,.18);text-decoration:none}
.site-footer .sf-social svg{width:19px;height:19px}
.site-footer .sf-social .sf-x{width:15px;height:15px}
.site-footer .sf-contact{margin-top:12px}
.site-footer #siteseal img{display:inline-block}
.site-footer .sf-legal{border-top:1px solid rgba(255,255,255,.1)}
.site-footer .sf-legal .sf-wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-block:14px;font-size:.85em}
