/* v1.33.44: lightweight site-wide responsive layout; no form submission logic changes. */
.bapnil-mobile-dock{display:none}
@media(max-width:767px){
 html{scroll-padding-top:78px}
 body{overflow-x:clip;padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))}
 #masthead{box-shadow:0 3px 14px rgba(5,50,46,.09)}
 .ast-container,.site-content .ast-container{max-width:100%;min-width:0}
 .site-content .ast-container{padding-left:16px!important;padding-right:16px!important}
 .entry-content,.entry-content>*,.wts-managed-page,.wts-directory-section{min-width:0;max-width:100%}
 img,iframe,video,svg{max-width:100%;height:auto}
 table{max-width:100%}
 .wts-directory-table-wrap,.wp-block-table,.entry-content .wp-block-table{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
 .wts-hero,.wts-home-hero{border-radius:17px!important;padding:30px 20px!important;margin-top:10px!important;margin-bottom:20px!important}
 .wts-page-title,.wts-hero h1,.wts-home-hero h1{font-size:clamp(28px,7.4vw,38px)!important;line-height:1.13!important;letter-spacing:-.025em!important;margin:8px 0 12px!important}
 .wts-hero .wts-lead,.wts-home-hero .wts-lead{font-size:14px!important;line-height:1.65!important}
 .wts-eyebrow{font-size:10px!important;letter-spacing:.1em!important}
 .wts-hero .wp-block-buttons,.wts-home-hero .wp-block-buttons,.bapnil-static-actions{display:flex;gap:10px;flex-wrap:wrap}
 .wts-hero .wp-block-button__link,.wts-home-hero .wp-block-button__link{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:11px 15px!important;font-size:13px}
 .wts-content-grid,.wts-quick-links,.wts-directory-section,.bapnil-legal-grid,.bapnil-static-grid,.bapnil-contact-grid{gap:12px!important}
 .wts-section-card,.bapnil-legal-card,.bapnil-general-faq-intro{padding:18px!important;border-radius:14px!important;box-shadow:0 3px 14px rgba(4,56,50,.045)}
 .wts-content-grid,.wts-quick-links,.bapnil-legal-grid,.bapnil-static-grid{grid-template-columns:minmax(0,1fr)!important}
 .wts-trust-strip{margin:8px 0 18px!important;padding:14px!important;gap:12px!important;flex-wrap:wrap}
 .wts-bottom-cta{padding:23px 18px!important;margin:20px 0 28px!important}
 .entry-content h2{font-size:clamp(21px,5.5vw,27px);line-height:1.25}
 .entry-content h3{font-size:19px;line-height:1.3}
 .entry-content p,.entry-content li{overflow-wrap:break-word}
 .entry-content a,.entry-content button,.entry-content summary{touch-action:manipulation}
 .wts-directory-table{min-width:560px}
 input:not([type=checkbox]):not([type=radio]),textarea,select{max-width:100%}
 .bapnil-mobile-dock{position:fixed;z-index:99998;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;align-items:stretch;min-height:64px;padding:6px 7px calc(6px + env(safe-area-inset-bottom,0px));border-top:1px solid #d9e9e5;background:rgba(255,255,255,.97);box-shadow:0 -5px 25px rgba(7,49,45,.12);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
 .bapnil-mobile-dock a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:51px;min-width:0;border-radius:11px;color:#385e59;font-size:10px;font-weight:750;text-decoration:none!important;line-height:1.15}
 .bapnil-mobile-dock-icon{display:grid;place-items:center;line-height:1}
 .bapnil-mobile-dock a[aria-current=page]{background:#e8f5f1;color:#006a57}
 .bapnil-mobile-dock a.bapnil-mobile-dock-book{background:#087c67;color:white!important}
 .bapnil-mobile-dock a:focus-visible{outline:2px solid #eebc44;outline-offset:-2px}
 /* Existing WP blocks and the original iframe booking logic are preserved. */
 .wp-block-columns:not(.is-not-stacked-on-mobile){flex-wrap:wrap!important}
 .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column{flex-basis:100%!important;min-width:0!important}
 .bapnil-blog-hero{padding:25px 19px!important}
 .bapnil-blog-hero h1{font-size:29px!important}
 .bapnil-general-faq-item summary{padding:17px 48px 17px 15px}
}
@media(max-width:360px){.bapnil-mobile-dock a{font-size:9px}.bapnil-mobile-svg{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){.bapnil-mobile-dock *{transition:none!important}}

/* ============================================================
 * BookAppointment.pk mobile design system 1.34.0
 * Presentation only. Existing WP page content, URLs, schema,
 * form actions and booking application events are preserved.
 * ============================================================ */
@media (max-width: 767px) {
 :root{--ba-deep:#073e3b;--ba-forest:#075d50;--ba-teal:#008f77;--ba-lime:#e9f7f2;--ba-paper:#f5f8f7;--ba-line:#dcebe7;--ba-text:#153d3a;--ba-gold:#ffc94e;--ba-radius:18px}
 body:not(.wp-admin){background:var(--ba-paper);color:var(--ba-text);-webkit-font-smoothing:antialiased}
 body:not(.wp-admin) #page{background:var(--ba-paper)}
 #masthead{background:#fff!important;border-bottom:1px solid var(--ba-line);box-shadow:0 6px 28px rgba(4,58,51,.065)!important}
 #masthead .ast-primary-header-bar{background:#fff!important}
 #masthead .site-branding img{max-height:40px;width:auto;object-fit:contain}
 #masthead .ast-mobile-menu-trigger-minimal{border:1px solid var(--ba-line);border-radius:12px;padding:8px}
 .ast-mobile-popup-drawer .ast-mobile-popup-inner{background:#fff}
 .ast-mobile-popup-drawer .menu-item>a{min-height:48px;font-weight:700;color:var(--ba-text)}
 #content.site-content{background:var(--ba-paper)}
 #primary,.site-main,.entry-content{min-width:0}
 .entry-content > .wp-block-group.alignwide,.entry-content > .wp-block-columns.alignwide{margin-left:0!important;margin-right:0!important}
 .entry-content > .wp-block-group,.entry-content > .wp-block-columns{margin-bottom:16px}
 .entry-content h1,.entry-content h2,.entry-content h3{letter-spacing:-.035em;color:var(--ba-text);text-wrap:pretty}
 .entry-content h2{font-size:clamp(21px,5.5vw,26px)!important;font-weight:800;line-height:1.25;margin-bottom:12px}
 .entry-content h3{font-size:18px!important;font-weight:800;line-height:1.3}
 .entry-content p,.entry-content li{line-height:1.65;font-size:14px}
 .entry-content a:not(.wp-block-button__link){text-underline-offset:3px}
 .wts-home-hero,.wts-hero,.bapnil-static-hero,.bapnil-blog-hero,.bapnil-center-hero{background:radial-gradient(circle at 110% -5%,rgba(184,244,226,.24) 0,transparent 38%),linear-gradient(128deg,#063c3a 0%,#07584d 62%,#127d6c 100%)!important;color:#fff!important;border:0!important;box-shadow:0 12px 28px rgba(5,65,56,.14)!important;border-radius:20px!important;padding:27px 20px!important;min-height:0!important}
 .wts-home-hero h1,.wts-hero h1,.bapnil-static-hero h1,.bapnil-blog-hero h1,.bapnil-center-hero h1{color:#fff!important;font-weight:850!important;font-size:clamp(29px,8vw,39px)!important;line-height:1.1!important;letter-spacing:-.045em!important}
 .wts-home-hero p,.wts-hero p,.bapnil-static-hero p,.bapnil-blog-hero span,.bapnil-center-hero p{color:#e5f5f0!important}
 .wts-eyebrow,.bapnil-static-hero .bapnil-guide-label,.bapnil-blog-hero>p{color:var(--ba-gold)!important;font-size:11px!important;letter-spacing:.11em!important;font-weight:800}
 .wts-hero .wp-block-buttons,.wts-home-hero .wp-block-buttons,.bapnil-static-actions{gap:9px!important;margin-top:18px!important}
 .wts-hero .wp-block-button,.wts-home-hero .wp-block-button{flex:1 1 auto;min-width:0}
 .wts-hero .wp-block-button__link,.wts-home-hero .wp-block-button__link,.bapnil-static-page .bapnil-btn-primary{border-radius:12px!important;min-height:46px!important;background:var(--ba-gold)!important;color:#173e39!important;font-weight:800!important;box-shadow:0 3px 0 rgba(0,0,0,.08)}
 .wts-hero .is-style-outline .wp-block-button__link{color:#fff!important;background:transparent!important;border:1px solid rgba(255,255,255,.55)!important}
 .wts-content-grid,.bapnil-static-grid,.bapnil-legal-grid,.bapnil-contact-grid,.bapnil-guide-grid,.bapnil-home-sections,.bapnil-showcase-grid,.bapnil-decision-grid,.bapnil-city-local-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:13px!important}
 .wts-section-card,.bapnil-static-grid article,.bapnil-legal-card,.bapnil-general-faq-intro,.bapnil-general-faq-item,.bapnil-center-profile,.bapnil-center-record,.bapnil-home-city-card,.bapnil-showcase-card,.bapnil-guide-grid>*,.bapnil-city-local-grid>*{border:1px solid var(--ba-line)!important;border-radius:var(--ba-radius)!important;background:#fff!important;box-shadow:0 4px 18px rgba(8,60,54,.045)!important;padding:18px!important;min-width:0}
 .bapnil-showcase-card *{max-width:100%}
 .bapnil-showcase-card a,.bapnil-home-city-card a{overflow-wrap:anywhere}
 .wts-trust-strip{border:1px solid var(--ba-line);border-radius:16px!important;box-shadow:0 8px 20px rgba(4,58,51,.055)!important}
 .wts-verification-note,.bapnil-static-note,.bapnil-center-source,.bapnil-guide-source{background:#fff9e8!important;border-left:4px solid var(--ba-gold)!important;border-radius:12px!important;padding:16px!important}
 .wts-bottom-cta,.bapnil-home-help{background:#e5f4ee!important;border:1px solid #cee8df!important;border-radius:18px!important;padding:23px 18px!important}
 .wts-bottom-cta .wp-block-button__link,.bapnil-static-actions .bapnil-btn:not(.bapnil-btn-primary){background:var(--ba-forest)!important;color:#fff!important;border-color:var(--ba-forest)!important;border-radius:12px!important;min-height:46px}
 .wts-directory-section,.bapnil-center-details,.bapnil-center-faq,.bapnil-center-visit,.bapnil-center-plan,.bapnil-center-enrichment{border:1px solid var(--ba-line)!important;border-radius:18px!important;background:#fff!important;padding:17px!important;margin-bottom:15px!important}
 .wts-directory-table-wrap,.bapnil-term-table-wrap{border:1px solid var(--ba-line);border-radius:13px;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;background:#fff}
 .wts-directory-table th,.bapnil-term-head{background:var(--ba-deep)!important;color:#fff!important}
 .wts-directory-table td,.wts-directory-table th{padding:12px!important;font-size:13px}
 .bapnil-center-profile a,.bapnil-city-links a,.bapnil-hub-link{overflow-wrap:anywhere}
 .bapnil-center-search input,.wts-directory-section input,.bapnil-static-page input{min-height:46px;border:1px solid #c8dfd8!important;border-radius:11px!important;background:#fff!important;padding:10px 13px!important}
 .bapnil-center-search button,.bapnil-center-search .button{min-height:46px;border-radius:11px!important;background:var(--ba-teal)!important}
 .bapnil-general-faq-list,.bapnil-faq-list{gap:10px!important}
 .bapnil-general-faq-item{padding:0!important;overflow:hidden}
 .bapnil-general-faq-item summary{font-size:14px;padding:17px 48px 17px 16px;color:var(--ba-deep)}
 .bapnil-general-faq-item>div{padding:0 16px 17px}
 .bapnil-blog-hero{width:100%!important;margin:12px auto 20px!important}
 .bapnil-blog-compare,.bapnil-related-posts>div{grid-template-columns:1fr!important}
 .bapnil-tasheer-booking,.bapnil-gamca-booking{margin:12px auto 18px!important;width:100%!important}
 .bapnil-tasheer-booking-frame,.bapnil-gamca-booking iframe,iframe[title*="Booking"],iframe[title*="booking"]{width:100%!important;max-width:100%!important;border-radius:17px!important}
 .bapnil-mobile-dock{background:#fff!important;border-top:1px solid #dcebe7!important;box-shadow:0 -6px 25px rgba(5,50,46,.10)!important}
 .bapnil-mobile-dock a{color:#466862!important;border-radius:12px!important}
 .bapnil-mobile-dock a[aria-current=page]{background:#e5f5ef!important;color:#006e58!important}
 .bapnil-mobile-dock a.bapnil-mobile-dock-book{background:#087b61!important;color:#fff!important}
 .bapnil-mobile-dock-icon{font-weight:700}
 .bapnil-mobile-dock-label{font-size:10px;font-weight:750;letter-spacing:.01em}
 .bapnil-mobile-dock a:focus-visible,.entry-content a:focus-visible,.entry-content button:focus-visible{outline:3px solid #d79b11!important;outline-offset:2px}
 .site-footer{background:#edf4f1!important;margin-bottom:0}
 .site-footer .ast-builder-grid-row-container{padding-bottom:10px}
 .bapnil-mobile-section-shortcuts{margin:12px auto 17px;max-width:1200px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .bapnil-mobile-section-shortcuts a{min-height:73px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px 5px;border-radius:14px;border:1px solid var(--ba-line);background:#fff;text-decoration:none!important;font-size:11px;font-weight:800;color:var(--ba-deep)!important;text-align:center;box-shadow:0 2px 7px rgba(4,58,51,.03)}
 .bapnil-mobile-section-shortcuts span{display:grid;place-items:center;line-height:1}
 .bapnil-mobile-section-shortcuts a:focus-visible{outline:2px solid var(--ba-teal)}
}
@media(max-width:385px){.bapnil-mobile-section-shortcuts a{font-size:10px}}

@media(min-width:768px){.bapnil-mobile-section-shortcuts{display:none!important}}

/* ============================================================
 * Mobile app shell 1.34.0
 * Sticky app bar, tab-bar icons, and the offset that keeps the existing
 * WhatsApp chooser clear of the tab bar. Presentation only; the markup
 * owner is includes/100-mobile-layout.php and it is the only writer of
 * these rules.
 *
 * The body:not(.wp-admin) prefix is deliberate, not decoration: a bare
 * single-class rule loses to the two-class rules in the page's inline
 * blocks, and those inline blocks print after this stylesheet, so a tie
 * would go against us as well.
 * ============================================================ */
@media (max-width: 767px) {
 body:not(.wp-admin) #masthead{position:sticky;top:0;z-index:99997;background:#fff!important;border-bottom:1px solid var(--ba-line,#dcebe7);box-shadow:0 5px 20px rgba(4,58,51,.07)!important}
 body:not(.wp-admin).admin-bar #masthead{top:46px}
 body:not(.wp-admin) #masthead .site-branding img{max-height:38px!important;width:auto}
 body:not(.wp-admin) #masthead .ast-mobile-menu-trigger-minimal{width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;margin:0;padding:0!important;border:1px solid var(--ba-line,#dcebe7)!important;border-radius:13px!important;background:#fff!important;color:#0f4d47!important}
 body:not(.wp-admin) #masthead .ast-mobile-menu-trigger-minimal .ast-mobile-svg{width:22px;height:22px}
 /* Icons are line drawings, so they take the label's colour and the active tab reads at a glance. */
 .bapnil-mobile-svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
 .bapnil-mobile-dock a[aria-current=page] .bapnil-mobile-svg{stroke-width:2.1}
 .bapnil-mobile-section-shortcuts a .bapnil-mobile-svg{width:25px;height:25px;stroke-width:1.7}
 /* The chooser is fixed at bottom:15px; the tab bar now owns that edge. */
 body:not(.wp-admin) .bapnil-wa-chooser{bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:99991}
 /* The launcher keeps its label on a desktop corner it does not share, but on a phone it stands down to the badge alone: the tab bar owns the bottom edge, and the full-width next/submit button of an embedded booking form sits at exactly the height a 171px-wide pill would cover, so the pill would swallow taps meant for the form. */
 body:not(.wp-admin) .bapnil-wa-launcher{width:52px;height:52px;padding:0;gap:0;justify-content:center;border-radius:50%;box-shadow:0 10px 24px rgba(11,60,45,.3)}
 body:not(.wp-admin) .bapnil-wa-launcher svg{width:52px;height:52px;padding:14px;margin:0}
 body:not(.wp-admin) .bapnil-wa-launcher-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 /* Astra marks the open header menu on <body>, and on a 667px-tall phone the expanded menu reaches the tab bar, so both floating layers stand down while it is open. */
 body.ast-main-header-nav-open .bapnil-mobile-dock,body.ast-main-header-nav-open .bapnil-wa-chooser{display:none!important}
 /* Reserve the tab bar's own height so it never sits on the last line of a page. */
 body:not(.wp-admin){padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}
 /* Astra's scroll-to-top is a 32px button at bottom:30px right:30px with z-index 99, so the tab bar at 99998 paints over it: measured on /medical-centers/ it occupies x 312-343, y 783-814 while the bar starts at y 780, which makes it both hidden and untappable on a phone. It is not lifted instead, because the only free height in that corner is above the 52px WhatsApp badge, and a third floating control stacked there is the clutter this shell exists to remove. Desktop keeps the button. */
 body:not(.wp-admin) #ast-scroll-top{display:none!important}
 /* An alignfull hero computes wider than the viewport by a few pixels, which leaves the whole page able to slide sideways. clip, not hidden: hidden would make this element a scroll container and break the sticky app bar. */
 html{overflow-x:clip;scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
}
@media(prefers-reduced-motion:reduce){.bapnil-mobile-dock a{transition:none!important}}

/* ============================================================
 * Page patterns 1.34.0
 * The shell above gives every page the same frame. This section gives the
 * managed page types the same reading rhythm inside it: a compact header,
 * one card per idea, thumb-sized tap targets, and label-over-value detail
 * rows instead of the side-by-side columns the desktop layout uses and a
 * 390px screen cannot hold.
 *
 * Presentation only and additive: no URL, title, H1, canonical, robots
 * value or schema node is written, and no markup is introduced. Every
 * selector targets a class these pages already carry. Rules that have to
 * beat one of the page's inline blocks carry the body:not(.wp-admin)
 * prefix, and that prefix is the only reason it is there.
 * ============================================================ */
@media (max-width: 767px) {

 /* --- Reclaim the reading column, and this is the main reason the pages read as
    cramped. Measured on /contact-us/ at 390px the insets stacked as
    .ast-container 16 + .ast-article-single 20 + .bapnil-static-page 16 + the hero's
    own 19 = 71px per side, so a 390px screen gave the text 231px: about 28
    characters a line, which is what turns a paragraph into a wall. The page gutter
    stays; the three nested insets inside it do not. --- */
 body:not(.wp-admin) .ast-article-single{padding-left:0!important;padding-right:0!important;padding-top:12px!important}
 body:not(.wp-admin) .bapnil-static-page,body:not(.wp-admin) .wts-managed-page>main,body:not(.wp-admin) #primary>main{padding-left:0!important;padding-right:0!important}

 /* --- Reading rhythm. 14px body copy is what made these pages read as a
    wall of text on a phone, and a 1.65 line-height at that size leaves no
    room between paragraphs. --- */
 body:not(.wp-admin) .entry-content p,
 body:not(.wp-admin) .entry-content li{font-size:15.5px;line-height:1.68}
 body:not(.wp-admin) .entry-content p{margin-bottom:14px}
 body:not(.wp-admin) .entry-content ul,body:not(.wp-admin) .entry-content ol{padding-left:21px}
 body:not(.wp-admin) .entry-content li{margin-bottom:7px}
 body:not(.wp-admin) .entry-content ul li::marker{color:#12988d}
 /* Source, review and note boxes are reference material, not body copy. */
 body:not(.wp-admin) .bapnil-guide-source,body:not(.wp-admin) .bapnil-center-source,body:not(.wp-admin) .bapnil-static-note,body:not(.wp-admin) .bapnil-docs-note,body:not(.wp-admin) .bapnil-selection-note{padding:14px 15px!important;font-size:14.5px!important;line-height:1.65!important;border-radius:12px!important}
 body:not(.wp-admin) .bapnil-guide-label{font-size:11px!important;letter-spacing:.09em!important;line-height:1.35}
 /* Section anchors now sit under a sticky app bar. */
 body:not(.wp-admin) .entry-content [id]{scroll-margin-top:90px}

 /* --- One type scale for the page body. The desktop build runs a 40px h2 with
    -0.035em tracking beside a 14px paragraph; at 390px that reads as a poster
    with fine print under it. Four sizes, four jobs: page title, section,
    sub-section, copy. Measured on /gamca-medical-test-list-pakistan/ the article
    title was rendering at 38px inside a 299px column, which is the single
    clearest reason these pages read as a website; a header rule later in this
    file still overrides h1 inside a hero, because these two have equal
    specificity and the later one wins. --- */
 body:not(.wp-admin) .entry-content h1{font-size:clamp(23px,6vw,28px)!important;line-height:1.2!important;font-weight:800!important;letter-spacing:-.022em!important;color:#123f3a!important;margin:0 0 10px!important;text-wrap:pretty!important}
 /* The article and page title is not inside .entry-content, so it needs its own
    rule. An inline block in this plugin sizes it at
    clamp(38px,4.1vw,62px)!important on .single-post article .entry-header
    .entry-title, which is a desktop hero size carrying a 38px mobile floor; the
    selector below is written long on purpose, because anything shorter loses to
    it on specificity and the floor stays. */
 body:not(.wp-admin) .single-post article .entry-header .entry-title,body:not(.wp-admin) header.entry-header .entry-title,body:not(.wp-admin) h1.entry-title{font-size:clamp(23px,6vw,28px)!important;line-height:1.2!important;font-weight:800!important;letter-spacing:-.022em!important;color:#123f3a!important;margin:0 0 12px!important;text-wrap:pretty!important}
 body:not(.wp-admin) .entry-content{color:#1c3b38}
 body:not(.wp-admin) .entry-content h2{font-size:20px!important;line-height:1.3!important;font-weight:800!important;letter-spacing:-.018em!important;color:#123f3a!important;margin:26px 0 10px!important;text-wrap:pretty!important}
 body:not(.wp-admin) .entry-content h3{font-size:16.5px!important;line-height:1.35!important;font-weight:750!important;letter-spacing:-.012em!important;color:#123f3a!important;margin:20px 0 8px!important}
 body:not(.wp-admin) .entry-content h2:first-child,body:not(.wp-admin) .entry-content h3:first-child{margin-top:0!important}
 body:not(.wp-admin) .entry-content p{color:#2b4b47}
 body:not(.wp-admin) .entry-content strong{color:#123f3a;font-weight:750}
 body:not(.wp-admin) .entry-content a:not(.wp-block-button__link):not(.bapnil-btn){color:#0b7a6c!important;text-underline-offset:3px;text-decoration-thickness:1px}
 body:not(.wp-admin) .entry-content hr{border:0;border-top:1px solid #e2ecea;margin:22px 0}
 /* Every small uppercase label shares one size and colour. */
 body:not(.wp-admin) .bapnil-guide-label,body:not(.wp-admin) .bapnil-card-kicker,body:not(.wp-admin) .bapnil-reviews-eyebrow{font-size:10.5px!important;font-weight:800!important;letter-spacing:.11em!important;text-transform:uppercase;color:#0f7a6b!important;margin:0 0 9px!important}
 /* One note and source box, instead of four shades of yellow. */
 body:not(.wp-admin) .wts-verification-note,body:not(.wp-admin) .bapnil-static-note,body:not(.wp-admin) .bapnil-center-source,body:not(.wp-admin) .bapnil-guide-source,body:not(.wp-admin) .bapnil-docs-note,body:not(.wp-admin) .bapnil-center-record-note,body:not(.wp-admin) .bapnil-verified-date,body:not(.wp-admin) .bapnil-selection-note,body:not(.wp-admin) .bapnil-center-complaints{background:#fdf9ef!important;border:1px solid #f0e4c6!important;border-left:3px solid #e0b53e!important;border-radius:12px!important;padding:13px 14px!important;color:#5b5443!important;font-size:14.5px!important;line-height:1.65!important}
 /* The dark brand panels keep their colour but take the house radius, and their
    buttons stop being two half-width pills floating in a wide card. */
 body:not(.wp-admin) .bapnil-home-help,body:not(.wp-admin) .bapnil-city-crawl-nav,body:not(.wp-admin) .bapnil-service-decisions,body:not(.wp-admin) .bapnil-home-trust{border-radius:18px!important;padding:20px 18px!important}
 body:not(.wp-admin) .bapnil-home-help>div:last-child{display:grid!important;gap:9px!important;width:100%!important}
 body:not(.wp-admin) .bapnil-home-help a{min-height:48px!important;display:flex!important;align-items:center;justify-content:center;text-align:center;border-radius:13px!important}
 body:not(.wp-admin) .bapnil-service-decisions .bapnil-decision-grid a,body:not(.wp-admin) .bapnil-home-city-card .bapnil-city-links a{font-weight:750}

 /* --- One card width. These wrappers each set their own width from the viewport
    (calc(100% - 40px), calc(100% - 28px), min(...,1180px)), which measured as
    three different widths on one screen — 313, 303 and 277 — so the left edges of
    the cards did not line up. On a phone they all take the reading column. --- */
 body:not(.wp-admin) .bapnil-center-profile,body:not(.wp-admin) .bapnil-center-enrichment,body:not(.wp-admin) .bapnil-home-sections,body:not(.wp-admin) .bapnil-official-checks,body:not(.wp-admin) .bapnil-keyword-cluster,body:not(.wp-admin) .bapnil-city-overview-head,body:not(.wp-admin) .bapnil-home-faq,body:not(.wp-admin) .bapnil-home-feature-row,body:not(.wp-admin) .bapnil-home-process{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}
 body:not(.wp-admin) .bapnil-center-crawl-links,body:not(.wp-admin) .bapnil-city-crawl-nav,body:not(.wp-admin) .bapnil-verified-guide,body:not(.wp-admin) .bapnil-service-decisions,body:not(.wp-admin) .bapnil-center-record,body:not(.wp-admin) .bapnil-sibling-centers,body:not(.wp-admin) .bapnil-center-plan,body:not(.wp-admin) .bapnil-center-faq{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}

 /* --- Two header treatments, one owner each. This is the whole reason the inner
    pages read as a website rather than as an app: measured on /tasheer/fees/ at
    390px every inner page opened with a 20px-radius dark card whose title ran at
    27.3px in white over the page photograph, so the first thing on the screen was
    a banner. A native screen opens with a plain header: no panel, the title in
    its own dark bar, one grey line under it, and the content immediately below.
    The photograph is not hidden here to be tidy - it is hidden because a photo
    behind a heading forces every colour decision around it, and the same heading
    then renders differently on 110 pages. --- */
 body:not(.wp-admin) .wts-hero,
 body:not(.wp-admin) .bapnil-static-hero,
 body:not(.wp-admin) .bapnil-center-hero,
 body:not(.wp-admin) .bapnil-blog-hero{position:relative!important;overflow:visible!important;background:transparent!important;color:#153d3a!important;border:0!important;border-bottom:1px solid #e6efec!important;border-radius:0!important;box-shadow:none!important;padding:15px 0 17px!important;margin:0 0 15px!important;min-height:0!important}
 body:not(.wp-admin) .wts-hero::before,body:not(.wp-admin) .wts-hero::after,
 body:not(.wp-admin) .bapnil-static-hero::before,body:not(.wp-admin) .bapnil-static-hero::after,
 body:not(.wp-admin) .bapnil-center-hero::before,body:not(.wp-admin) .bapnil-center-hero::after,
 body:not(.wp-admin) .bapnil-blog-hero::before,body:not(.wp-admin) .bapnil-blog-hero::after{display:none!important;content:none!important}
 /* --- The header sits on the reading column, not on the viewport. Every one of
    these heroes is an `alignfull` block, so the theme sized it to 100vw: measured
    on /tasheer/fees/ at 390px the box ran 16..406 while the column is 16..357, and
    the 16px that hung past the right edge was only invisible because this file
    clips the overflow. Transparent, that cost nothing; with the title bar and the
    paragraph panel now filled, the two filled blocks reached the right screen edge
    and were cut square there while the left kept its 16px gutter, and the title no
    longer spanned its column but the viewport. These are the only elements that
    were affected, and they are set back to the column here rather than by clipping
    more. --- */
 body:not(.wp-admin) .wts-hero,
 body:not(.wp-admin) .bapnil-static-hero,
 body:not(.wp-admin) .bapnil-center-hero,
 body:not(.wp-admin) .bapnil-blog-hero{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
 body:not(.wp-admin) .wts-hero>.bapnil-primary-figure,
 body:not(.wp-admin) .bapnil-static-hero>.bapnil-primary-figure,
 body:not(.wp-admin) .bapnil-center-hero>.bapnil-primary-figure,
 body:not(.wp-admin) .bapnil-blog-hero>.bapnil-primary-figure{display:none!important}
 body:not(.wp-admin) .wts-hero h1,
 body:not(.wp-admin) .bapnil-static-hero h1,
 body:not(.wp-admin) .bapnil-center-hero h1,
 body:not(.wp-admin) .bapnil-blog-hero h1{font-size:clamp(20px,5.7vw,24px)!important;line-height:1.24!important;letter-spacing:-.021em!important;font-weight:800!important;color:#123f3a!important;margin:0 0 7px!important;text-wrap:pretty!important}
 body:not(.wp-admin) .wts-hero .wts-lead,body:not(.wp-admin) .wts-hero>p,
 body:not(.wp-admin) .bapnil-static-hero>p:not(.bapnil-guide-label),
 body:not(.wp-admin) .bapnil-center-hero>p:last-child,
 body:not(.wp-admin) .bapnil-blog-hero p{font-size:14.5px!important;line-height:1.55!important;color:#5e7c78!important;margin:0!important}
 /* The kicker names the page for a crawler and for a person scrolling past, so it
    stays and turns teal: a gold chip only reads on a dark header, and this header
    is white now. */
 body:not(.wp-admin) .wts-hero .wts-eyebrow,
 body:not(.wp-admin) .bapnil-static-hero .bapnil-guide-label,
 body:not(.wp-admin) .bapnil-center-hero>p:first-child{display:block!important;padding:0!important;background:none!important;border:0!important;color:#0f7a6b!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:.11em!important;margin:0 0 7px!important}
 /* Actions stay, but as one compact row rather than a stacked block: measured on
    /tasheer/fees/ the two stacked buttons alone were 105px, which pushed the
    header to 345px and made the first thing on the screen a call-to-action wall.
    A header is a header; the page's own action rows carry the weight. */
 body:not(.wp-admin) .wts-hero .wp-block-buttons,
 body:not(.wp-admin) .bapnil-static-hero .bapnil-static-actions{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;margin-top:14px!important}
 body:not(.wp-admin) .wts-hero .wp-block-button,
 body:not(.wp-admin) .bapnil-static-hero .bapnil-static-actions .bapnil-btn{width:auto!important;min-width:0!important;min-height:44px!important;display:inline-flex!important;align-items:center;justify-content:center;text-align:center;margin:0!important}
 body:not(.wp-admin) .wts-hero .wp-block-button__link,
 body:not(.wp-admin) .bapnil-static-hero .bapnil-static-actions .bapnil-btn{display:inline-flex!important;align-items:center;justify-content:center;padding:11px 16px!important;min-height:44px!important;line-height:1.2;border-radius:11px!important;font-weight:750!important;font-size:14px!important;background:#087c67!important;color:#fff!important;border:1px solid transparent!important}
 body:not(.wp-admin) .wts-hero .is-style-outline .wp-block-button__link,
 body:not(.wp-admin) .bapnil-static-hero .bapnil-static-actions .bapnil-btn:not(.bapnil-btn-primary),
 body:not(.wp-admin) .bapnil-static-hero .bapnil-static-actions .bapnil-btn-dark{background:#fff!important;color:#0b6f62!important;border:1px solid #cfe4de!important;font-weight:750!important}
 /* The decorative GCC flag pill is hidden on a phone by the "Removed for now"
    section at the foot of this file, so this block no longer reserves the pill's
    height or restyles it: the pill and its 56px reservation arrived together in
    1.34.5 and they leave together now. */

 /* --- One header on every page type, the front page included. v1.34.6 replaced
    the branded dark panel that used to stand here. The reason is the title bar in
    the "Mobile title bars" section at the foot of this file: the page title is
    now a solid dark block, and a dark block cannot be read against a dark panel,
    so a phone had to choose between the two. Measured from the owner's reference
    (a 390x844 capture, 186x407 as supplied): the bar and the paragraph beneath it
    sit directly on the page background, the paragraph in its own light panel, and
    there is no photograph on a phone. Desktop keeps the photograph and the
    gradient; this block is inside the 767px query. --- */
 body.home:not(.wp-admin) .wts-hero,
 body:not(.wp-admin) .wts-home-hero{overflow:visible!important;border:0!important;border-radius:0!important;padding:0 0 14px!important;margin:0 0 16px!important;background:transparent!important;box-shadow:none!important}
 body.home:not(.wp-admin) .wts-hero>.bapnil-primary-figure,
 body:not(.wp-admin) .wts-home-hero>.bapnil-primary-figure,
 body.home:not(.wp-admin) .wts-hero::after,
 body:not(.wp-admin) .wts-home-hero::after{display:none!important;content:none!important}
 body.home:not(.wp-admin) .wts-hero .wts-eyebrow,
 body:not(.wp-admin) .wts-home-hero .wts-eyebrow{display:block!important;padding:0!important;border:0!important;background:none!important;color:#0f7a6b!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:.11em!important;margin:0 0 9px!important}
 body.home:not(.wp-admin) .wts-hero .wp-block-buttons,
 body:not(.wp-admin) .wts-home-hero .wp-block-buttons{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:9px!important;margin-top:17px!important}
 body.home:not(.wp-admin) .wts-hero .wp-block-button__link,
 body:not(.wp-admin) .wts-home-hero .wp-block-button__link{background:#ffc94e!important;color:#123f3a!important;border:0!important;border-radius:13px!important;font-weight:800!important;font-size:15px!important}
 body.home:not(.wp-admin) .wts-hero .is-style-outline .wp-block-button__link,
 body:not(.wp-admin) .wts-home-hero .is-style-outline .wp-block-button__link{background:transparent!important;color:#fff!important;border:1px solid rgba(255,255,255,.42)!important;font-weight:700!important}
 /* The 58px reservation this block used to hold is gone with the flag pill it
    was reserving for: a phone now hides that pill, so the height would have been
    a gap under the title bar. It comes back with the pill. */

 /* --- FAQ: /frequently-asked-questions/, /wafid/faq/, /tasheer/faq/ --- */
 body:not(.wp-admin) .bapnil-general-faq-layout{display:block!important;margin:14px 0 30px!important}
 body:not(.wp-admin) .bapnil-general-faq-intro{margin-bottom:13px!important;padding:18px!important}
 body:not(.wp-admin) .bapnil-general-faq-list,body:not(.wp-admin) .bapnil-faq-list{gap:9px!important}
 body:not(.wp-admin) .bapnil-general-faq-item summary,body:not(.wp-admin) .bapnil-faq-list summary{display:flex;align-items:center;min-height:52px;font-size:15px!important;font-weight:800;line-height:1.4;padding:14px 50px 14px 16px!important}
 body:not(.wp-admin) .bapnil-general-faq-item summary:after,body:not(.wp-admin) .bapnil-faq-list summary:after{top:50%!important;transform:translateY(-50%);right:14px!important}
 body:not(.wp-admin) .bapnil-general-faq-item>div{padding:0 16px 16px!important}
 body:not(.wp-admin) .bapnil-general-faq-item>div p,body:not(.wp-admin) .bapnil-faq-list details p{font-size:15px!important;line-height:1.66!important;margin:0!important}

 /* --- Fees: /tasheer/fees/ and /wafid/fees/ --- */
 body:not(.wp-admin) .bapnil-fee-schedule{padding:17px 15px!important;margin:12px auto 18px!important;border-radius:18px!important}
 body:not(.wp-admin) .bapnil-fee-schedule h3{margin:24px 0 10px!important}
 body:not(.wp-admin) .bapnil-fee-cards{gap:12px!important}
 body:not(.wp-admin) .bapnil-fee-card{padding:15px!important;border-radius:15px!important}
 body:not(.wp-admin) .bapnil-fee-card h4{font-size:15.5px!important;margin-bottom:10px!important}
 body:not(.wp-admin) .bapnil-fee-figure{padding:11px 13px!important;margin-bottom:12px!important;border-radius:12px!important}
 body:not(.wp-admin) .bapnil-fee-figure span{font-size:11.5px!important}
 body:not(.wp-admin) .bapnil-fee-figure strong{font-size:24px!important;line-height:1.2}
 body:not(.wp-admin) .bapnil-fee-lines dt{font-size:14.5px!important;line-height:1.45}
 body:not(.wp-admin) .bapnil-fee-lines dd{font-size:15px!important}
 body:not(.wp-admin) .bapnil-fee-lines dt,body:not(.wp-admin) .bapnil-fee-lines dd{padding:9px 0!important}
 body:not(.wp-admin) .bapnil-fee-premium,body:not(.wp-admin) .bapnil-fee-disclaimer{font-size:14.5px!important;line-height:1.68!important}
 body:not(.wp-admin) .bapnil-fee-modes{gap:8px!important}
 body:not(.wp-admin) .bapnil-fee-modes li{padding:9px 15px!important;font-size:14px!important}
 body:not(.wp-admin) .bapnil-fee-table{max-width:100%!important;border-radius:13px!important}
 body:not(.wp-admin) .bapnil-fee-table-row>span,body:not(.wp-admin) .bapnil-fee-table-row>strong{padding:11px 13px!important;font-size:14.5px!important}
 body:not(.wp-admin) .bapnil-fee-difference{padding:12px 14px!important;font-size:14.5px!important;line-height:1.6!important}

 /* --- Tasheer centres: /tasheer/centers/ and its six city pages --- */
 body:not(.wp-admin) .bapnil-tasheer-centers-v13324{padding:17px 15px!important;margin:14px 0!important;border-radius:18px!important}
 body:not(.wp-admin) .bapnil-tasheer-centers-grid{gap:11px!important;margin:16px 0 6px!important}
 body:not(.wp-admin) .bapnil-tasheer-center{padding:16px!important;border-radius:15px!important}
 body:not(.wp-admin) .bapnil-tasheer-center h3{line-height:1.3;margin-bottom:8px!important}
 body:not(.wp-admin) .bapnil-center-address{font-size:15px!important;line-height:1.6!important;margin-bottom:11px!important}
 body:not(.wp-admin) .bapnil-tasheer-center .bapnil-center-details{font-size:15px!important}
 body:not(.wp-admin) .bapnil-tasheer-center .bapnil-center-details dt{margin:11px 0 2px!important;font-size:11.5px!important;letter-spacing:.045em!important;color:#5b7a76!important}
 body:not(.wp-admin) .bapnil-tasheer-center .bapnil-center-details dd{font-size:15px!important;line-height:1.55!important}
 body:not(.wp-admin) .bapnil-tasheer-center .bapnil-center-details dt:not(:first-of-type){border-top:1px solid var(--ba-line,#dcebe7);padding-top:11px}
 body:not(.wp-admin) .bapnil-tasheer-holidays li{font-size:14.5px!important;padding:8px 0!important}
 body:not(.wp-admin) .bapnil-tasheer-holidays li strong{display:block;min-width:0!important;margin-bottom:2px}
 body:not(.wp-admin) .bapnil-center-checklist li{font-size:15px!important;line-height:1.6!important}
 body:not(.wp-admin) .bapnil-tasheer-centers-actions{gap:9px!important;margin-top:18px!important}
 body:not(.wp-admin) .bapnil-tasheer-centers-actions a{min-height:48px!important;display:flex!important;align-items:center;justify-content:center;border-radius:13px!important;font-size:15px}
 body:not(.wp-admin) .bapnil-center-complaints{padding:13px 14px!important;font-size:14.5px!important;line-height:1.6!important}

 /* --- Guide pages: /tasheer/appointment/, /wafid/appointment/, /wafid/token/ --- */
 body:not(.wp-admin) .bapnil-verified-guide{margin:12px auto!important;padding:17px 15px!important;border-radius:18px!important}
 body:not(.wp-admin) .bapnil-guide-grid{gap:11px!important}
 body:not(.wp-admin) .bapnil-guide-grid>*{padding:16px!important;border-radius:15px!important}
 body:not(.wp-admin) .bapnil-guide-grid h2{line-height:1.3!important;margin-bottom:9px!important}
 body:not(.wp-admin) .bapnil-guide-checklist{padding-left:20px!important;margin-top:11px!important}
 body:not(.wp-admin) .bapnil-guide-checklist li{font-size:15px!important;line-height:1.6!important;margin-bottom:7px!important}
 body:not(.wp-admin) .bapnil-tasheer-docs-v13325{padding:17px 15px!important;margin:14px 0!important;border-radius:18px!important}
 body:not(.wp-admin) .bapnil-docs-form{padding:14px!important;gap:11px!important;border-radius:14px!important}
 body:not(.wp-admin) .bapnil-docs-field label{font-size:11.5px!important}
 body:not(.wp-admin) .bapnil-docs-field select{min-height:48px;font-size:16px!important}
 body:not(.wp-admin) .bapnil-docs-list li{font-size:15px!important;line-height:1.6!important;margin-bottom:9px!important}

 /* --- Contact --- */
 body:not(.wp-admin) .bapnil-contact-grid,body:not(.wp-admin) .bapnil-static-grid{gap:11px!important}
 body:not(.wp-admin) .bapnil-contact-grid>*,body:not(.wp-admin) .bapnil-static-grid>*{padding:16px!important;border-radius:15px!important}
 body:not(.wp-admin) .bapnil-contact-grid a,body:not(.wp-admin) .bapnil-static-grid a{display:inline-flex;align-items:center;min-height:44px;font-weight:800}

 /* --- Medical-centre profiles: /medical-centers/<city>/<centre>/ --- */
 body:not(.wp-admin) .bapnil-center-details{gap:12px!important}
 body:not(.wp-admin) .bapnil-center-details>div{padding:17px!important;border-radius:15px!important}
 body:not(.wp-admin) .bapnil-center-details dl{grid-template-columns:minmax(0,1fr)!important;gap:2px 0!important}
 body:not(.wp-admin) .bapnil-center-details dt{font-size:11.5px!important;letter-spacing:.045em!important;color:#5b7a76!important;margin-top:10px}
 body:not(.wp-admin) .bapnil-center-details dd{font-size:15px!important;line-height:1.55!important}
 body:not(.wp-admin) .bapnil-map-link{display:flex!important;align-items:center;justify-content:center;width:100%!important;min-height:48px!important;border-radius:12px!important}
 body:not(.wp-admin) .bapnil-center-map iframe{height:300px!important}
 body:not(.wp-admin) .bapnil-center-record{padding:17px!important}
 body:not(.wp-admin) .bapnil-center-record dt{font-size:11.5px!important;letter-spacing:.045em!important;color:#5b7a76!important;margin-top:10px!important}
 body:not(.wp-admin) .bapnil-center-record dd{font-size:15px!important}
 body:not(.wp-admin) .bapnil-center-record-note{font-size:14.5px!important;line-height:1.65!important}

 /* --- Link lists read as app rows rather than as text links --- */
 body:not(.wp-admin) .bapnil-city-links{gap:9px!important}
 body:not(.wp-admin) .bapnil-city-links a{display:flex!important;align-items:center;justify-content:space-between;gap:10px;min-height:48px;font-size:15px;border-radius:13px!important}
 body:not(.wp-admin) .bapnil-city-links a::after{content:"\203A";font-size:20px;line-height:1;font-weight:900;color:#8ab5ae}
 body:not(.wp-admin) .bapnil-center-crawl-links>div a{min-height:48px;font-size:14.5px;border-radius:13px!important}
 body:not(.wp-admin) .bapnil-sibling-centers>div a,body:not(.wp-admin) .bapnil-city-crawl-nav>div a{min-height:46px!important;display:inline-flex;align-items:center}
 body:not(.wp-admin) .bapnil-tasheer-cities-v13334 a{min-height:46px;display:inline-flex;align-items:center}

 /* --- One card shape for every white card, written last on purpose: it is the
    single owner of that shape. Each page section still sets its own padding,
    because that is a per-section choice, but a card cannot disagree with another
    card about its radius, border, background or shadow. --- */
 body:not(.wp-admin) .wts-section-card,body:not(.wp-admin) .bapnil-static-grid>*,body:not(.wp-admin) .bapnil-legal-card,body:not(.wp-admin) .bapnil-general-faq-intro,body:not(.wp-admin) .bapnil-general-faq-item,body:not(.wp-admin) .bapnil-guide-grid>*,body:not(.wp-admin) .bapnil-tasheer-center,body:not(.wp-admin) .bapnil-center-plan,body:not(.wp-admin) .bapnil-center-faq,body:not(.wp-admin) .bapnil-sibling-centers,body:not(.wp-admin) .bapnil-center-details>div,body:not(.wp-admin) .bapnil-center-record,body:not(.wp-admin) .bapnil-fee-card,body:not(.wp-admin) .bapnil-fee-schedule,body:not(.wp-admin) .bapnil-tasheer-centers-v13324,body:not(.wp-admin) .bapnil-tasheer-docs-v13325,body:not(.wp-admin) .bapnil-verified-guide{border:1px solid #e2ecea!important;border-radius:16px!important;background:#fff!important;box-shadow:0 2px 12px rgba(8,60,54,.045)!important}
}
/* ============================================================
 * 1.34.6 — Mobile title bars, and three elements the owner took out
 *
 * Measured from the owner's reference capture (supplied at 186x407, a 390x844
 * phone view): the page title is a solid dark block spanning the reading
 * column, white text inset about 16px, roughly 9px of padding above and below
 * the line, sitting directly on the page background, and the paragraph under it
 * sits in its own light panel. Every H1 and H2 now takes that bar on a phone.
 *
 * The bar is a phone-only treatment. Desktop keeps the headings it had: a
 * 1180px column with a coloured bar across every section heading is a different
 * design decision from the one asked for here.
 *
 * Presentation only. No URL, title, H1, canonical, robots value, schema node or
 * markup is written, and everything hidden below is hidden with display:none so
 * it stays in the document and for a crawler.
 * ============================================================ */
@media (max-width: 767px) {
 :root{--ba-title:#073e3b;--ba-mint:#d9f0e9}

 /* --- The line above the title, as a breadcrumb instead of a section label.
    The desktop reading is in wts-site.css against the dark hero card; this is the
    same markup on a phone, where that hero is transparent and the ink has to be
    dark. The trail is allowed to wrap, because "Medical Centers › GAMCA Medical
    Centers in Islamabad" is two lines on 341px, but the chips are one scrollable
    row and never wrap: eight family names stacked is a wall above the title, and
    the row ends on the hub link, so nothing is unreachable on a narrow screen. --- */
 body:not(.wp-admin) .wts-crumb{margin:0 0 8px}
 /* Measured on the first build: a bare `.wts-crumb-trail li` lost to this file's own
    `body:not(.wp-admin) .entry-content li{font-size:15.5px}` and to its content-link
    colour rule, so the trail rendered at body size with link-blue ink. Both of those
    have three classes, so these four match them and then say what a crumb actually is. */
 body:not(.wp-admin) .wts-crumb .wts-crumb-trail{gap:2px 6px;flex-wrap:wrap}
 body:not(.wp-admin) .wts-crumb .wts-crumb-trail li{gap:6px;color:#6b8b87;font-size:11px;font-weight:800;letter-spacing:.03em;line-height:1.4!important}
 body:not(.wp-admin) .wts-crumb .wts-crumb-trail li+li:before{color:#a8c6c1;font-size:12px}
 body:not(.wp-admin) .wts-crumb .wts-crumb-trail a{color:#0f7a6b!important;text-decoration:none!important;border-bottom:1px solid #b7dbd4!important;padding-bottom:1px}
 body:not(.wp-admin) .wts-crumb .wts-crumb-trail [aria-current]{color:#123f3a!important;font-weight:850}
 body:not(.wp-admin) .wts-crumb .wts-crumb-hub{flex-wrap:nowrap;overflow-x:auto;gap:7px;margin:6px 0 0;padding:0 2px 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 body:not(.wp-admin) .wts-crumb .wts-crumb-hub::-webkit-scrollbar{display:none}
 body:not(.wp-admin) .wts-crumb .wts-crumb-hub li{flex:0 0 auto}
 body:not(.wp-admin) .wts-crumb .wts-crumb-hub a{min-height:32px;padding:0 11px;border-color:#dcece8!important;background:#fff!important;color:#0b6f62!important;font-size:11.5px!important;font-weight:750;line-height:1.2!important;text-decoration:none!important;box-shadow:0 1px 3px rgba(8,60,54,.05)}
 body:not(.wp-admin) .wts-crumb .wts-crumb-all a{background:#d9f0e9!important;border-color:#bfe2d9!important;color:#0d6b60!important;font-weight:850}
 /* Every hero is light on a phone, so the chip row's marker is the light one here too. */
 body:not(.wp-admin) .wts-crumb .wts-crumb-more{width:26px;height:26px;bottom:3px;background:#fff;border-color:#cfe4de;color:#0b6f62;font-size:16px;box-shadow:0 2px 8px rgba(8,60,54,.16)}

 /* --- One bar for H1 and H2, on every page type. Written against #content and
    not against a page class, because the same two headings have to match on a
    guide, a fee table, a centre profile and a blog post, and the rules that used
    to own them are spread across four sections above. The id also outranks the
    newest inline block, which is what a desktop-sized article title was. --- */
 body:not(.wp-admin) #content h1,
 body:not(.wp-admin) #content h2{background:var(--ba-title)!important;background-image:none!important;color:#fff!important;border:0!important;border-radius:11px!important;box-shadow:none!important;padding:9px 14px!important;margin:0 0 13px!important;font-weight:800!important;line-height:1.3!important;letter-spacing:-.012em!important;text-wrap:pretty!important;overflow-wrap:anywhere;width:auto!important;max-width:100%!important;min-height:0!important;display:block!important;text-align:left!important}
 /* The owner asked for the title inside its block to be centred, and only the title: the
    section bars below keep the left inset they were measured with. */
 body:not(.wp-admin) #content h1{font-size:18px!important;text-align:center!important}
 body:not(.wp-admin) #content h2{font-size:16.5px!important}
 body:not(.wp-admin) #content h2:first-child{margin-top:0!important}
 body:not(.wp-admin) #content h1 a,body:not(.wp-admin) #content h2 a{color:#fff!important;text-decoration:none!important}
 /* The footer's headings are furniture, not page structure. */
 body:not(.wp-admin) .site-footer h1,body:not(.wp-admin) .site-footer h2{background:none!important;color:#123f3a!important;padding:0!important;font-size:16px!important}

 /* --- The paragraph under a title takes the light panel the reference shows.
    The hero background is transparent on a phone as of this version, so this is
    what separates the header from the first section. --- */
 body:not(.wp-admin) .wts-hero .wts-lead,
 body:not(.wp-admin) .wts-hero>p:not(.wts-eyebrow),
 body:not(.wp-admin) .wts-home-hero .wts-lead,
 body:not(.wp-admin) .bapnil-static-hero>p:not(.bapnil-guide-label),
 body:not(.wp-admin) .bapnil-center-hero>p:last-child,
 body:not(.wp-admin) .bapnil-blog-hero p{background:var(--ba-mint)!important;border-radius:13px!important;padding:13px 14px!important;color:#123f3a!important;font-size:14.5px!important;line-height:1.6!important;margin:0!important}

 /* --- A dark card cannot carry a dark bar: the bar would be a darker rectangle
    on a dark ground and the heading would look like it had lost its styling. Six
    panels on this site are dark cards with their own heading, and each was
    measured on a phone rather than guessed: bapnil-post-cta rgb(15,79,74),
    bapnil-service-decisions rgb(15,79,74), bapnil-official-checks rgb(16,63,61),
    bapnil-medical-hub-head and bapnil-city-crawl-nav rgb(15,79,74), and
    bapnil-city-local-guide rgb(15,79,74). On these the bar inverts - white ground,
    deep-green text - so the same block reads in both places and no second title
    style has to be invented. Anything the gradient panels change into is caught
    by the same rule, because the panel class is what decides it, not the colour. --- */
 body:not(.wp-admin) #content .bapnil-post-cta h2,
 body:not(.wp-admin) #content .bapnil-service-decisions h2,
 body:not(.wp-admin) #content .bapnil-official-checks h2,
 body:not(.wp-admin) #content .bapnil-medical-hub-head h2,
 body:not(.wp-admin) #content .bapnil-city-local-guide h2,
 body:not(.wp-admin) #content .bapnil-city-crawl-nav h2{background:#fff!important;color:#073e3b!important}

 /* --- Removed for now, on the owner's instruction, on a phone only: the
    decorative GCC flag ribbon, the header's own "Book GAMCA Appointment" and
    "Ask a question" action row, and every "Ask a question" link the plugin
    prints in a support block. Deleting this one block brings all three back and
    nothing else here depends on it. No destination is lost: the tab bar's Book
    tab still routes to booking, and every page keeps its own sections.

    The ask link is named by a class of its own (bapnil-wa-ask, set in
    81-related-content.php) and not by "any bapnil-wa link that is not the
    primary one". That broader selector was written first and measured wrong:
    /wafid/faq/ prints its "View Medical Centers" directory link with a bare
    bapnil-wa class, so the broad rule hid a navigation link while the owner had
    only asked for the support links. A hidden call to action is easy to see and
    a hidden directory link is not, which is why the class exists. --- */
 body:not(.wp-admin) .bapnil-gcc-flags,
 body:not(.wp-admin) #content .wts-hero .wp-block-buttons,
 body:not(.wp-admin) #content .wts-home-hero .wp-block-buttons,
 body:not(.wp-admin) #content .bapnil-static-hero .bapnil-static-actions,
 body:not(.wp-admin) a.bapnil-wa-ask,
 body:not(.wp-admin) .bapnil-post-cta-actions .is-outline,
 body:not(.wp-admin) .bapnil-home-help a.is-outline{display:none!important}
}
/* ============================================================
 * 1.35.0 — Dark green chrome, and the brand marks in the tab bar
 *
 * The owner asked for the phone's chrome in one colour - the top bar, the menu
 * behind the hamburger and the tab bar - and for the two brand marks on the
 * Wafid and Tasheer tabs. The footer navigation already shipped #123f3c from
 * 91-compliance.php, so the four surfaces now take one token instead of three
 * greens and a white.
 *
 * The wordmark is the one piece that cannot simply go dark: measured, the
 * header webp is 2073 opaque pixels out of 2180 sampled, which means it carries
 * its own white plate, and brightness(0) invert(1) would turn that plate into a
 * white block. It keeps a white plate - given a radius and a hairline so it
 * reads as a logo chip - and the rest of the bar carries the colour.
 *
 * Phone only, like every other section here: measured at 1280px afterwards, the
 * desktop header, menu and footer are unchanged.
 * ============================================================ */
@media (max-width: 767px) {
 /* --- The app bar --- */
 body:not(.wp-admin) #masthead{background:#073e3b!important;border-bottom:1px solid rgba(255,255,255,.13)!important;box-shadow:0 6px 24px rgba(3,42,39,.26)!important}
 body:not(.wp-admin) #masthead .ast-primary-header-bar,body:not(.wp-admin) #masthead .main-header-bar,body:not(.wp-admin) #masthead .ast-builder-grid-row{background:transparent!important}
 body:not(.wp-admin) #masthead .site-branding img{background:#fff;padding:3px 6px;border-radius:9px;box-shadow:0 1px 4px rgba(0,0,0,.18)}
 body:not(.wp-admin) #masthead .ast-mobile-menu-trigger-minimal{background:rgba(255,255,255,.14)!important;border-color:rgba(255,255,255,.3)!important;color:#fff!important}
 body:not(.wp-admin) #masthead .ast-mobile-menu-trigger-minimal svg{stroke:#fff!important;fill:none!important}

 /* --- The menu behind the hamburger, in both shapes Astra renders: the inline
    panel this install uses and the off-canvas drawer other installs use. Both
    are styled so the colour does not depend on which one is switched on. --- */
 body:not(.wp-admin) .main-header-bar-navigation,body:not(.wp-admin) .main-header-bar-navigation .main-header-menu,
 body:not(.wp-admin) .main-header-bar-navigation .sub-menu,
 body:not(.wp-admin) .ast-mobile-popup-drawer .ast-mobile-popup-inner{background:#073e3b!important;box-shadow:none!important}
 body:not(.wp-admin) .main-header-bar-navigation a,
 body:not(.wp-admin) .ast-mobile-popup-drawer .menu-item>a{color:#e8f5f1!important}
 body:not(.wp-admin) .main-header-bar-navigation .menu-item>a,body:not(.wp-admin) .main-header-bar-navigation .menu-item{border-color:rgba(255,255,255,.12)!important}
 body:not(.wp-admin) .main-header-bar-navigation .ast-menu-toggle{background:transparent!important;color:#fff!important}
 body:not(.wp-admin) .main-header-bar-navigation a:focus-visible{outline:2px solid #ffc94e!important;outline-offset:-2px}

 /* --- The tab bar. The Book tab was green on white, which is invisible on a
    green bar, so it takes the site's gold and dark text - the same pairing the
    hero uses, and the only tab that has to win the eye. --- */
 body:not(.wp-admin) .bapnil-mobile-dock{background:#073e3b!important;border-top:1px solid rgba(255,255,255,.13)!important;box-shadow:0 -6px 25px rgba(3,42,39,.28)!important}
 body:not(.wp-admin) .bapnil-mobile-dock a{color:#b7d6cf!important}
 body:not(.wp-admin) .bapnil-mobile-dock a[aria-current=page]{background:rgba(255,255,255,.15)!important;color:#fff!important}
 body:not(.wp-admin) .bapnil-mobile-dock a.bapnil-mobile-dock-book{background:#ffc94e!important;color:#123f3a!important}
 body:not(.wp-admin) .bapnil-mobile-dock a:focus-visible{outline-color:#ffc94e!important}

 /* --- The two brand marks. One icon box for all five tabs, so the labels stay
    on one line: the round badge keeps its own white ground (its artwork is red,
    grey and maroon, which would not read on deep green) and the Tasheer mark
    sits on the same white chip so the pair looks chosen rather than accidental. --- */
 body:not(.wp-admin) .bapnil-mobile-dock-icon{width:26px;height:26px;display:grid;place-items:center;line-height:1}
 body:not(.wp-admin) .bapnil-mobile-brand{display:block!important;width:26px!important;height:26px!important;object-fit:contain;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2)}
 body:not(.wp-admin) .bapnil-mobile-dock a[aria-current=page] .bapnil-mobile-brand{box-shadow:0 0 0 2px rgba(255,255,255,.55)}

 /* --- The footer navigation, on the same token. --- */
 /* v1.36.3 — the policy links used to sit in this file's own dark-green band, which made
    them a second piece of chrome under the page rather than part of it. The owner asked
    for them to read as page content, so the band is gone: page background, one hairline,
    the site's teal links, and the same reading on a phone as on a desktop. The old band
    also carried white links, so removing it without recolouring would have left dark text
    on a dark ground — measured after the change, the links are rgb(11,111,102) on the
    page's rgb(245,248,247). */
 body:not(.wp-admin) .bapnil-compliance-footer{background:transparent!important;border-top:1px solid #dce8e5!important;gap:8px 16px;padding:16px 18px 4px!important}
 body:not(.wp-admin) .bapnil-compliance-footer a{color:#0b6f66!important;font-size:13px;text-decoration:none!important}
}
