/* Branch page — mobile (≤767px) = Figma 3638:13704 "OHIO Hà Nội – Mobile" (390 frame, auto-layout).
   Loaded after ohio-branch.css / -lower-blocks.css / -tabs.css on page-ohio-branch.php only; desktop untouched.
   Sections: px 20, column gap 20; tinted ones (about, doctors, facility, reviews, FAQ: #F7F3FB) pad 40, white ones 20.
   Section title = orange bar 32×3 + gap 8 + H2 22/30. Icons = Figma line icons (img/branch/m-*.svg, masked). */
.ohio-br__dots{display:none}
@media (max-width:767px){
  .ohio-br>section{padding:20px 0!important}
  .ohio-br>section:is(.ohio-br__about,.ohio-br__docs-sec,.ohio-br__fac-sec,.ohio-br__rv-sec,.ohio-br__faq-sec){padding:40px 0!important;background:var(--ohio-purple-50)}
  .ohio-br>section>.ohio-container:not(.ohio-lh__form-wrap){display:flex;flex-direction:column;gap:20px}
  .ohio-br>section>.ohio-container:not(.ohio-lh__form-wrap)>*,.ohio-br .ohio-br__head,.ohio-br .ohio-br__faq .ohio-sec-title,.ohio-br .ohio-br__head .ohio-sec-title{margin:0!important}
  .ohio-br .ohio-sec-title--bar::before,.ohio-br .ohio-br__about .ohio-sec-title::before{content:"";display:block;width:32px;height:3px;margin:0 0 8px!important;border-radius:2px;background:var(--ohio-cta)} /* 3638:13819 */
  .ohio-br .ohio-btn{gap:8px;letter-spacing:.56px}
  .ohio-br .ohio-btn--arrow::after,.ohio-br .ohio-br__about .ohio-br__book::after,.ohio-br .ohio-br__svc-body .ohio-btn::after{content:"";display:block;position:static;flex:none;animation:none;opacity:1;border:0;width:18px;height:18px;background:currentColor;-webkit-mask:url(../img/branch/m-arrow-18.svg) center/18px no-repeat;mask:url(../img/branch/m-arrow-18.svg) center/18px no-repeat}
  .ohio-br .ohio-br__head-link{gap:6px;font:600 14px/20px var(--ohio-font-body);color:var(--ohio-text-link)}
  .ohio-br .ohio-br__head-link svg{width:16px;height:16px}
  .ohio-br .ohio-br__i--tel,.ohio-br .ohio-br__i--nav{width:18px;height:18px}
  .ohio-br .ohio-br__i--nav{-webkit-mask-image:url(../img/branch/m-pin.svg);mask-image:url(../img/branch/m-pin.svg)}

  /* Hero 3638:13818: photo 390×220 (artwork 200% wide, x −80%, y −6.4%), block p 20/20/24 gap 12 */
  .ohio-br>section.ohio-br__hero{overflow:hidden;padding:0!important}
  .ohio-br .ohio-br__hero-img{display:block;width:200%;max-width:none;height:282px;margin:-14px 0 -48px -80%;clip-path:inset(14px 0 48px 0);object-fit:cover;object-position:center top}
  .ohio-br .ohio-br__hero-in{padding:20px 20px 0}
  .ohio-br .ohio-br__hero-txt{display:flex;flex-direction:column;gap:12px}
  .ohio-br .ohio-br__hero-txt>*,.ohio-br .ohio-br__hero .ohio-crumbs,.ohio-br .ohio-br__hero .ohio-label{margin:0}
  .ohio-br .ohio-br__hero .ohio-br__m-only{display:flex;flex-direction:column;gap:12px}
  .ohio-br .ohio-br__hero .ohio-crumbs{font-size:12px;line-height:20px}
  .ohio-br .ohio-br__hero .ohio-crumbs>span:not([aria-current]){color:var(--ohio-neutral-300)}
  .ohio-br .ohio-br__hero .ohio-label{color:var(--ohio-purple-600)}
  .ohio-br .ohio-br__lead{font:400 15px/24px var(--ohio-font-body)}
  .ohio-br .ohio-br__hero-btns{gap:10px}
  .ohio-br .ohio-br__hero-btns .ohio-btn{height:44px}
  .ohio-br .ohio-br__hero .ohio-br__book{box-shadow:0 6px 8px rgba(241,121,31,.28)}
  .ohio-br .ohio-br__hero .ohio-br__i--cal{display:none}
  .ohio-br .ohio-br__top{margin-top:12px;padding-bottom:24px}
  .ohio-br .ohio-br__info{gap:12px} /* 3638:13816 */
  .ohio-br .ohio-br__info li{gap:10px}
  .ohio-br .ohio-br__info-ico .ohio-br__i{width:18px;height:18px;color:var(--ohio-purple-600)}
  .ohio-br .ohio-br__info li:nth-child(1) .ohio-br__i{-webkit-mask-image:url(../img/branch/m-pin.svg);mask-image:url(../img/branch/m-pin.svg)}
  .ohio-br .ohio-br__info li:nth-child(2) .ohio-br__i{-webkit-mask-image:url(../img/branch/m-clock.svg);mask-image:url(../img/branch/m-clock.svg)}
  .ohio-br .ohio-br__info li:nth-child(3) .ohio-br__i{-webkit-mask-image:url(../img/branch/m-phone.svg);mask-image:url(../img/branch/m-phone.svg)}
  .ohio-br .ohio-br__info-l{font:400 12px/20px var(--ohio-font-body);letter-spacing:0;text-transform:none}
  .ohio-br .ohio-br__info strong{font:500 13px/20px var(--ohio-font-body)}
  .ohio-br .ohio-br__info-cta .ohio-btn{height:44px}

  /* About 3638:13861: H2 → photo 350×250 r16 → text 15/24 → points → needs → CTA (orange, arrow) */
  .ohio-br .ohio-br__about-in,.ohio-br .ohio-br__about-txt,.ohio-br .ohio-br__about-act{display:contents}
  .ohio-br .ohio-br__about .ohio-sec-title{order:-2}
  .ohio-br .ohio-br__about-img{order:-1}
  .ohio-br .ohio-br__about-img img{height:250px;aspect-ratio:auto;border-radius:16px}
  .ohio-br .ohio-br__about-txt>*,.ohio-br .ohio-br__about-act>*{margin:0}
  .ohio-br .ohio-br__about .ohio-br__full{display:none} /* not in the mobile frame */
  .ohio-br .ohio-br__about .ohio-lead{-webkit-line-clamp:6;font:400 15px/24px var(--ohio-font-body)} /* 3638:13826 = 6 lines */
  .ohio-br .ohio-br__points{gap:16px}
  .ohio-br .ohio-br__points li{gap:14px}
  .ohio-br .ohio-br__points b{width:36px;height:36px;border-radius:18px;background:var(--ohio-purple-700);font:600 16px/24px var(--ohio-font-body);color:#fff}
  .ohio-br .ohio-br__points strong{font:600 16px/24px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__points small{margin-top:4px;font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-br__needs{gap:8px}
  .ohio-br .ohio-br__needs span{flex-basis:100%;margin:0;font:700 13px/20px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__needs a,.ohio-br .ohio-br__needs a:first-of-type{height:auto;padding:4px 10px;border-radius:999px;background:var(--ohio-purple-50);font:600 12px/20px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__about .ohio-br__book{height:44px;background:var(--ohio-grad-cta);box-shadow:0 6px 8px rgba(241,121,31,.28)} /* 3638:13857 */

  /* Why 3638:13932: 2-col cards 169 wide, gap 12, p16 gap 10, icon tile 44 r12, title 16/24, text 13/20 */
  .ohio-br .ohio-br__why{gap:12px}
  .ohio-br .ohio-br__why-item{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--ohio-border);border-radius:16px}
  .ohio-br .ohio-br__why-ico{width:44px;height:44px;border-radius:12px;background:var(--ohio-purple-50)}
  .ohio-br .ohio-br__why-ico .ohio-br__i{width:22px;height:22px}
  .ohio-br .ohio-br__why-t{margin:0;font:600 16px/24px var(--ohio-font-body);text-transform:none;color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__why-item p{font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}

  /* Doctors 3638:14010: cards 220 wide gap 12 (photo 200), body p12 gap 8: tags → name → bio → role → link */
  .ohio-br .ohio-br__docs{align-items:flex-start;gap:12px;margin:0;padding:0;scroll-padding:0}   /* cards keep their own height (410/444) */
  .ohio-br .ohio-br__doc{flex:0 0 220px;border:1px solid var(--ohio-border);border-radius:16px}
  .ohio-br .ohio-br__doc-img img{height:200px;background:var(--ohio-purple-50)}
  .ohio-br .ohio-br__doc-body{gap:8px;padding:12px}
  .ohio-br .ohio-br__doc-body>*{margin:0}
  .ohio-br .ohio-br__tags{order:-1;gap:6px}
  .ohio-br .ohio-br__tags span{padding:4px 10px;border-radius:999px;font:600 12px/20px var(--ohio-font-body)}
  .ohio-br .ohio-br__tags span+span{background:var(--ohio-neutral-50);color:var(--ohio-neutral-700)}
  .ohio-br .ohio-br__tags span:nth-child(n+3){display:none}   /* frame: at most 2 tags per card (3638:13938/13953) */
  .ohio-br .ohio-br__doc-name{font:600 16px/24px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__doc-bio{order:1;font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-br__doc-role{order:2;font:400 12px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-br__doc-more{order:3;gap:6px;padding:0;border:0;color:var(--ohio-text-link)}
  /* row 3638:14009: L3 hugs (166, pad 16) + link fills the rest, both top-aligned */
  .ohio-br .ohio-br__docs-sec .ohio-br__more{justify-content:flex-start;align-items:flex-start;gap:10px}
  .ohio-br .ohio-br__docs-sec .ohio-br__more .ohio-btn{flex:none;padding:0 16px}
  .ohio-br .ohio-br__docs-sec .ohio-br__more .ohio-br__head-link{flex:1;min-width:0;align-self:flex-start;margin:0}
  @media (max-width:379px){.ohio-br .ohio-br__docs-sec .ohio-br__more .ohio-br__head-link{white-space:normal}.ohio-br .ohio-br__docs-sec .ohio-br__more .ohio-br__head-link svg{flex:none}}   /* 360: wraps instead of overflowing */
  .ohio-br .ohio-br__docs-sec .ohio-br__more .ohio-btn svg{display:none}

  /* Pill tabs (services 3638:14022, facility 3638:14125): p 8/14, 13/20, white + #ECEAF0 border, active #422666 */
  .ohio-br .ohio-br__svc-tabs,.ohio-br .ohio-br__fac-tabs{gap:8px;margin:0 0 20px;padding:0;border-radius:0;background:none}
  .ohio-br .ohio-br__svc-tabs label,.ohio-br .ohio-br__fac-tabs label{height:auto;padding:8px 14px;border:1px solid var(--ohio-border);border-radius:999px;background:#fff;font:600 13px/20px var(--ohio-font-body);color:var(--ohio-text-body)}
  .ohio-br #ohio-br-fac-0:checked ~ .ohio-br__fac-tabs [for="ohio-br-fac-0"],.ohio-br #ohio-br-fac-1:checked ~ .ohio-br__fac-tabs [for="ohio-br-fac-1"]{background:var(--ohio-purple-700);border-color:var(--ohio-purple-700);color:#fff}

  /* Services 3638:14034: card #F7F3FB r16, photo 220, body p16 gap 10, H3 18/26, L2 button with arrow */
  .ohio-br .ohio-br__svc-panel{border:0;border-radius:16px}
  .ohio-br .ohio-br__svc-img{height:220px}
  .ohio-br .ohio-br__svc-body{gap:10px;padding:16px}
  .ohio-br .ohio-br__svc-body>*{margin:0}
  .ohio-br .ohio-br__svc-body .ohio-h3{text-transform:none}
  .ohio-br .ohio-br__svc-body .ohio-text{font:400 15px/24px var(--ohio-font-body)}
  .ohio-br .ohio-br__svc-body .ohio-btn{height:44px}
  .ohio-br .ohio-br__svc-info{display:flex;flex-direction:column;gap:10px;margin:0} .ohio-br .ohio-br__svc-info .ohio-label{margin:0;color:var(--ohio-text-label)} .ohio-br .ohio-br__svc-info .ohio-text{margin:0} /* 3638:14025–14028 */

  /* Stories 3638:14105: cards 280 wide gap 12 (photo 200), body p14 gap 6: name 16/24 → service 13/20 → quote 15/24 → link */
  .ohio-br .ohio-br__rail{gap:12px;margin:0;padding:0;scroll-padding:0}
  .ohio-br .ohio-br__story{border:1px solid var(--ohio-border);border-radius:16px}
  .ohio-br .ohio-br__story-img{border:0}
  .ohio-br .ohio-br__story-img img{height:200px}
  .ohio-br .ohio-br__story-body{gap:6px;padding:14px}
  .ohio-br .ohio-br__story-body>*{margin:0}
  .ohio-br .ohio-br__story h4{color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__story-cat{order:1;font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-br__story-ex{order:2;font:400 15px/24px var(--ohio-font-body)}
  .ohio-br .ohio-br__story .ohio-br__head-link{order:3;align-self:flex-start;padding:0;border:0}
  .ohio-br .ohio-br__st-sec .ohio-br__more .ohio-btn{height:44px}

  /* Facility 3638:14128–14131: lead photo 240 r16 + caption, then 2-col 120 r12 + captions (gap 6), grid gap 12 */
  .ohio-br .ohio-br__gallery{gap:12px}
  .ohio-br .ohio-br__gallery a{display:flex;flex-direction:column;gap:6px;overflow:visible;border:0;border-radius:0}
  .ohio-br .ohio-br__gallery img{height:120px;aspect-ratio:auto;border-radius:12px}
  .ohio-br .ohio-br__gallery a:first-child{margin-bottom:8px}
  .ohio-br .ohio-br__gallery a:first-child img{height:240px;aspect-ratio:auto;border-radius:16px}
  .ohio-br .ohio-br__gallery span{position:static;padding:0;background:none;font:600 13px/20px var(--ohio-font-body);color:var(--ohio-purple-700)}

  /* Videos 3638:14181 / reviews 3638:14215: cards 280 (thumb 160) and 290 (white p20 r16) in a clipped row */
  .ohio-br .ohio-br__vids,.ohio-br .ohio-br__rv-rail{gap:12px;margin:0;padding:0;scroll-padding:0}
  .ohio-br .ohio-br__vid{overflow:hidden;border:1px solid var(--ohio-border);border-radius:16px}
  .ohio-br .ohio-br__vid-media{border:0;border-radius:0}
  .ohio-br .ohio-br__vid-media img{height:160px}
  .ohio-br .ohio-br__vid-play{width:52px;height:52px;margin:-26px 0 0 -26px;box-shadow:0 4px 6px rgba(66,38,102,.25)}
  .ohio-br .ohio-br__vid-play::after{left:20px;top:16px}
  .ohio-br .ohio-br__vid-dur{right:10px;bottom:8px;padding:2px 8px;border-radius:6px;background:rgba(26,18,33,.75);font:600 12px/20px var(--ohio-font-body)}   /* 3638:14138 */
  .ohio-br .ohio-br__vid-play::after{border-left-color:var(--ohio-cta)}
  .ohio-br .ohio-br__vid-media{overflow:visible} /* tag 3638:14140 = chip under the thumb (12 below), title 8 below it */
  .ohio-br .ohio-br__vid-tag{top:172px;left:12px;padding:4px 10px;background:var(--ohio-purple-50);font:600 12px/20px var(--ohio-font-body)}
  .ohio-br .ohio-br__vid-media:has(.ohio-br__vid-tag)+h4{margin-top:48px!important}
  .ohio-br .ohio-br__rv-av,.ohio-br .ohio-br__rv-br{display:none} /* 3638:14187: name 16/24 + "service · OHIO X" 13/20 */
  .ohio-br .ohio-br__rv-top{height:28px}
  .ohio-br .ohio-br__rv-q{display:block;flex:none;width:28px;height:28px;background:var(--ohio-cta);-webkit-mask:url(../img/branch/m-quote.svg) center/28px no-repeat;mask:url(../img/branch/m-quote.svg) center/28px no-repeat}   /* icon/quote 3638:14182 */
  .ohio-br .ohio-br__rv-q svg{display:none}
  .ohio-br .ohio-br__rv-rail{align-items:start} /* cards keep their own height (frame: items-start) */
  .ohio-br .ohio-br__rv-foot{margin-top:0}
  .ohio-br .ohio-br__rv-who{gap:2px}
  .ohio-br .ohio-br__rv-who strong{font:600 16px/24px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__rv-who small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}   /* one line (3638:14194) */
  .ohio-br .ohio-br__vid h4{width:auto;margin:12px 12px 0;font:600 16px/24px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__vid p{width:auto;margin:8px 12px 12px;font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-br__rv-rail{grid-auto-columns:290px}
  .ohio-br .ohio-br__rv{min-height:0;gap:12px;padding:20px;border:0;border-radius:16px}
  .ohio-br .ohio-br__rv-text{margin:0;font:400 16px/26px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__rv-foot{padding:0;border:0}

  /* Directions 3638:14269: photo 220 r16, thumbs 110×72 r8 gap 8 (row clipped), info box p16 gap 12, map 200 r16 + link */
  .ohio-br .ohio-br__dir-sec .ohio-bri__panel-in{grid-template-columns:minmax(0,1fr);gap:20px}
  .ohio-br .ohio-bri__photo img{height:220px;aspect-ratio:auto}
  .ohio-br .ohio-bri__thumbs{display:flex;gap:8px;margin-top:20px;overflow:hidden}
  .ohio-br .ohio-bri__thumbs a,.ohio-br .ohio-bri__thumbs a:nth-child(n+4){display:block;flex:0 0 110px}
  .ohio-br .ohio-bri__info{margin:0 0 20px}
  .ohio-br .ohio-bri__info li{gap:10px;margin:0 0 12px;font:500 13px/20px var(--ohio-font-body);color:var(--ohio-text-body)}
  .ohio-br .ohio-bri__info li:last-child{margin:0}
  .ohio-br .ohio-br__dir-sec .ohio-bri__info::before{content:var(--br-name);display:block;margin:0 0 12px;font:600 18px/26px var(--ohio-font-head);color:var(--ohio-purple-700)} /* 3638:14225 */
  .ohio-br .ohio-bri__info li>span:last-child{gap:2px;padding:0}
  .ohio-br .ohio-bri__info strong{font:400 12px/20px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-bri__ico{color:var(--ohio-purple-600)}
  .ohio-br .ohio-bri__mapcard a{gap:6px;padding:6px 0 0;color:var(--ohio-text-link)}
  .ohio-br .ohio-bri__mapcard a svg{width:16px;height:16px}
  .ohio-br .ohio-bri__actions .ohio-btn svg{width:18px;height:18px}

  /* FAQ 3638:14320: lead 15/24 muted 8px under the H2; items gap 10, p 14/16 r12, open #F7F3FB + #DED0EE; +/− 20px */
  .ohio-br .ohio-br__faq>div:first-child .ohio-text{margin:8px 0 0;font:400 15px/24px var(--ohio-font-body);color:var(--ohio-text-muted)}
  .ohio-br .ohio-br__faq>div:last-child{display:flex;flex-direction:column;gap:10px}
  .ohio-br .ohio-br__faq .ohio-faq{margin:0;padding:14px 16px;border:1px solid var(--ohio-border);border-radius:12px;background:#fff}
  .ohio-br .ohio-br__faq .ohio-faq[open]{border-color:var(--ohio-purple-200);background:var(--ohio-purple-50)}
  .ohio-br .ohio-br__faq .ohio-faq summary{min-height:0;gap:12px;font:600 16px/24px var(--ohio-font-body);color:var(--ohio-purple-700)}
  .ohio-br .ohio-br__faq .ohio-faq summary::after{content:"";flex:none;width:20px;height:20px;border-radius:0;background:var(--ohio-text-muted);-webkit-mask:url(../img/branch/m-plus.svg) center/20px no-repeat;mask:url(../img/branch/m-plus.svg) center/20px no-repeat}
  .ohio-br .ohio-br__faq .ohio-faq[open] summary::after{background:var(--ohio-purple-700);-webkit-mask-image:url(../img/branch/m-minus.svg);mask-image:url(../img/branch/m-minus.svg)}
  .ohio-br .ohio-br__faq .ohio-faq p{margin:8px 0 0;font:400 13px/20px var(--ohio-font-body);color:var(--ohio-text-body)}
  .ohio-br .ohio-br__faq-sec .ohio-br__m-only{margin:10px 0 0}   /* link at x 20 (3638:14319); desktop head-link keeps its 6px */

  /* Contact form = shared .ohio-lh__form-sec rules (css/ohio-contact-mobile.css); the branch frame 3638:14399 is white with a tinted channels card */
  .ohio-br .ohio-lh__form-sec .ohio-lh__channels{background:var(--ohio-purple-50)}

  /* Row dots (js/ohio-branch-row-dots.js) under doctors / stories / videos / reviews: 16 below the row, one per card */
  .ohio-br .ohio-container>.ohio-br__dots:not([hidden]){display:flex;justify-content:center;gap:6px;margin:-4px 0 0!important}
  .ohio-br .ohio-br__dots i{width:6px;height:6px;border-radius:3px;background:var(--ohio-purple-200);transition:width .2s}
  .ohio-br .ohio-br__dots i.is-on{width:20px;background:var(--ohio-purple-700)}
}