/* ==========================================================================
   Doctor profile — revised Figma Guideline 2026 (section 4724:14020): PC 4724:20796 (frame 4724:20797), mobile 4823:25256.
   Loaded after ohio-doctor-single.css / -mobile.css. Numbers = frame px at 1920:
   hero photo card 618×557 at y201 (1px #A092B2, r16, no ribbon), CTA level 2 on PC (mobile frame: level 1),
   H2 = 32×3 orange bar + 30/40, experience photo 543×331 at x1057, dotted lists, certificate wall 299/299/324/324 × 222,
   service cards #F7F3FB 1px #422666 r8 (no icon disc), article cards 563×96, activity photos 381×276, council cards 301×429.
   Type roles stay on Style Guide 4814:19501 (frame sizes only where they match). The mobile frame still draws the older
   structure (ribbon, "Thế mạnh chuyên môn"): one shared PC dataset is rendered with the mobile layout rules.
   ========================================================================== */

/* H2 with the 32×3 bar (all blocks) */
.ohio-dsp .ohio-sec-title--bar::before{content:"";display:block;width:32px;height:3px;margin:0 0 13px;border-radius:2px;background:var(--ohio-orange-400)}

@media (min-width:1024px){
/* hero: breadcrumb row (42) + 11 = photo at y201 as in the frame; the revised frame draws a 618×557 card (supersedes the 400×500 portrait of the older guide pass) */
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-hero{padding-top:11px!important;padding-bottom:66px!important}
.ohio-dsp .ohio-dsp-hero__grid{grid-template-columns:618px minmax(0,1fr);gap:28px}
.ohio-dsp .ohio-dsp-hero__photo{padding-top:0}
.ohio-dsp .ohio-dsp-hero__badge{display:none!important}
@media (max-width:1279px){.ohio-dsp .ohio-dsp-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.ohio-dsp .ohio-dsp-hero__frame{aspect-ratio:618/557;border:1px solid #A092B2;border-radius:16px;background:#fff}
.ohio-dsp-hero__info{padding-top:24px}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-hero__deg{height:31px;margin-left:0;padding:0 18px;border-radius:16px;font:600 var(--ohio-label-size)/31px var(--font-base);background:linear-gradient(90deg,#422666,#7E5AAE)}
.ohio-dsp-hero__name{margin:12px 0 0}
.ohio-dsp-hero__sum{padding-left:0;margin-top:20px}
.ohio-dsp-hero__sum img{display:none}
.ohio-dsp-hero__sum::before{content:"";flex:none;width:11px;height:11px;margin-top:9px;background:url(../img/bac-si/tick-circle.svg) center/contain no-repeat}
.ohio-dsp-hero__creds li{padding-left:27px}
.ohio-dsp-hero__creds li::before{left:2px}
.ohio-dsp-hero__sum span{flex:1}
.ohio-dsp-hero__creds-h{padding-left:0;margin-top:20px}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-hero__cta{width:100%;max-width:none;height:52px;margin:30px 0 0!important;padding:0 28px;border-radius:12px;font:600 14px/20px var(--font-base);letter-spacing:.6px;gap:10px;background:var(--ohio-grad-primary)!important;color:var(--ohio-text-on-dark)!important;box-shadow:none}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-hero__cta:hover{background:var(--ohio-grad-primary-hover)!important}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-hero__cta:active{background:var(--ohio-grad-primary-active)!important}

/* experience: copy left, photo 543×331 right */
.ohio-dsp-exp__row{grid-template-columns:minmax(0,1fr) 543px;column-gap:24px}
.ohio-dsp-exp__img{margin:11px 0 0;aspect-ratio:543/331;border:1px solid #A092B2;border-radius:16px}
.ohio-dsp-sub--exp{margin:28px 0 0}
.ohio-dsp-exp__text .ohio-dsp-dots{margin-top:16px}
.ohio-dsp-sub--spec{margin:24px 0 0}
.ohio-dsp-spec{margin:16px 0 0;gap:8px 40px;max-width:700px}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-spec li{min-height:0;padding:0 0 0 19px;gap:0;border:0;border-radius:0;background:none;position:relative;font:400 var(--fs-body)/var(--lh-body) var(--font-base)!important;color:var(--ohio-text-body)!important}
.ohio-dsp-spec li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:#000}
.ohio-dsp-spec__ico{display:none}
.ohio-dsp-dots li::before{width:6px;height:6px;top:9px}
.ohio-dsp-dots li{padding-left:19px}
html body.ohio-hh #wrapper .ohio-dsp ul.ohio-dsp-dots li{font:400 var(--fs-body)/var(--lh-body) var(--font-base)!important}   /* list is data-sg-type=body (round3: it kept the lead role of the old template) */

/* certificate wall 299/299/324/324 × 222 (+ 2 tall) */
.ohio-dsp-certs{grid-template-columns:299fr 299fr 324fr 324fr;grid-auto-rows:222px;gap:9px 11.33px;margin-top:29px}
.ohio-dsp-certs__item{box-sizing:border-box;padding:6px;border:1px solid #D9D9D9;border-radius:4px;background:#fff;box-shadow:0 6px 20px rgba(36,18,59,.08)}
.ohio-dsp-certs__item.is-tall{grid-row:span 2}
.ohio-dsp-certs__item img{object-fit:contain}

/* services: 3 cards #F7F3FB / 1px #422666 / r8, no icon disc */
.ohio-dsp-svc{padding-bottom:44px!important}
.ohio-dsp-svc .ohio-dsp-rowwrap{margin-top:36px}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-svc__card{min-height:98px;padding:16px 20px;gap:16px;align-items:center;border:1px solid #422666;border-radius:8px;background:var(--ohio-purple-50)}
.ohio-dsp-svc__ico{display:none}
.ohio-dsp-svc__txt{padding-top:0}

/* treatment photos: left-aligned title, no CTA (PC frame) */
.ohio-dsp-visit__grid{margin-top:26px}
.ohio-dsp-visit .ohio-dsp-center{display:none}
.ohio-dsp-visit{padding-bottom:48px!important}

/* activities + articles */
.ohio-dsp-acts__sub{margin:28px 0 0;padding-left:30px}
.ohio-dsp-acts__row{padding-left:36px;padding-right:0}
.ohio-dsp-posts{padding:0 61px;gap:16px 32px;margin-top:20px}
html body.ohio-hh #wrapper .ohio-dsp .ohio-dsp-post{min-height:96px;border:1px solid #422666;border-radius:8px;gap:16px;padding:8px 24px 8px 20px}
.ohio-dsp-post__ico{width:auto;height:auto;background:none;border-radius:0}
.ohio-dsp-acts__more{min-width:253px;margin-top:32px}

/* council arrows 54×54 outside the row */
.ohio-dsp__prev,.ohio-dsp__next{width:54px;height:54px}
.ohio-dsp-council .ohio-dsp__prev{left:-27px;top:157px}
.ohio-dsp-council .ohio-dsp__next{right:-27px;top:157px}
}
@media (min-width:1024px) and (max-width:1400px){.ohio-dsp-council .ohio-dsp__prev{left:-16px}.ohio-dsp-council .ohio-dsp__next{right:-16px}}

/* ≤1023 — mobile frame 4823:25256: photo card spans the 350 column (360 tall, r16) with the ribbon over it (the 168×210 portrait of the older pass is superseded) */
@media (max-width:1023px){
.ohio-dsp .ohio-dsp-hero__photo{width:100%;margin:0}
.ohio-dsp .ohio-dsp-hero__frame{aspect-ratio:auto;height:360px;border:0;border-radius:16px}
.ohio-dsp .ohio-dsp-hero__badge{display:inline-block!important;position:absolute;left:12px;top:12px;z-index:2;margin:0;padding:6px 12px;width:auto}
}
/* <=1023: experience bullets are the body role on mobile too (round3 integration) */
@media (max-width:1023px){
html body.ohio-hh #wrapper .ohio-dsp ul.ohio-dsp-dots li{font:400 var(--fs-body)/var(--lh-body) var(--font-base)!important}
}

/* ==========================================================================
   CM2 (23/10) — designer comment 1977163411: values re-read from the CURRENT frame 4724:20797 (edited after our first extraction).
   Text styles copied from the frame text nodes (owner: copy Figma sizes/weights/colours/case; only menus stay sentence case).
   Prefix #ohio-doctor.ohio-dsp outranks the earlier role rules (they use :is()/data-sg-type with !important).
   ========================================================================== */
@media (min-width:1024px){
/* hero 4724:20853-21206 — badge 185×31 (text 18/28 SemiBold, typed case), name 34/44, role 26/34 + 85×3 bar, check lists text at +57, CTA 606×80 */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__deg{height:31px;padding:0 16px 0 24px;border-radius:16px;background:linear-gradient(90deg,#422666,#a463d4);font:600 18px/31px var(--font-base)!important;letter-spacing:0!important;text-transform:none!important;color:#fff!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__name{margin:10px 0 0}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__title{margin:14px 0 0;font:600 26px/34px var(--font-base)!important;color:#422666!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__title::after{width:85px;height:3px;margin:6px 0 0;border-radius:2px;background:linear-gradient(90deg,#422666,#a463d4)}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__sum{gap:12px;margin:16px 0 0;padding-left:34px;font:600 18px/28px var(--font-base)!important;color:#1b1822!important}
.ohio-dsp-hero__sum::before{margin-top:8.5px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds-h{gap:4px;margin:26px 0 0;font:600 22px/30px var(--font-base)!important;color:#422666!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds{margin:14px 0 0}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds li{padding-left:57px;font:600 18px/28px var(--font-base)!important;color:#1b1822!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds li::before{left:34px;top:8.5px;width:11px;height:11px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__cta{width:606px;max-width:calc(100% - 10px);height:80px;margin:35px 0 0 10px!important;padding:0 28px;border-radius:12.7px;background:linear-gradient(90deg,#472a6b,#a463d4)!important;font:600 22px/30px var(--font-base)!important;letter-spacing:0!important;gap:14px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp :is(.ohio-dsp-hero__sum,.ohio-dsp-hero__creds-h) span{font:inherit!important;color:inherit!important;letter-spacing:inherit!important;text-transform:inherit}
.ohio-dsp-hero__cta svg{width:25px;height:21px}

/* section bars 32×3 #FF950E; bar→heading gap per block as drawn (frame bars 824 / 1312 / 2172 / 2395 / 3077 → texts 846 / 1330 / 2193 / 2413 / 3091) */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-sec-title--bar::before{margin-bottom:15px;border-radius:0;background:#ff950e}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-exp .ohio-sec-title--bar::before{margin-bottom:19px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-svc .ohio-sec-title--bar::before{margin-bottom:18px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts .ohio-sec-title--bar::before{margin-bottom:11px}

/* experience 4724:20896-20968: sub-heads 22/30 SemiBold #1B1822 sentence case with 22×29 / 30×27 icons at x+31; lists 18/28 Medium, no row gap; photo beside both blocks */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-sub{align-items:flex-start;gap:13px;padding-left:31px;font:600 22px/30px var(--font-base)!important;letter-spacing:0!important;text-transform:none!important;color:#1b1822!important}
.ohio-dsp-sub--exp img,.ohio-dsp-sub--spec img{margin-top:-1px}
.ohio-dsp-sub--exp span,.ohio-dsp-sub--spec span{padding-top:3px;font:inherit!important;color:inherit!important;text-transform:none!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-sub--exp{margin:43px 0 0}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-sub--spec{margin:12px 0 0}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-exp__text .ohio-dsp-dots{gap:0;margin-top:6px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp ul.ohio-dsp-dots li,html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-spec li{font:500 18px/28px var(--font-base)!important;letter-spacing:0!important;text-transform:none!important;color:#1b1822!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-spec li span{font:inherit!important;color:inherit!important;text-transform:none!important}
.ohio-dsp-dots li::before,.ohio-dsp-spec li::before{top:11px;width:6px;height:6px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-spec{grid-template-columns:344px 344px;gap:0;margin:3px 0 0;max-width:none}
.ohio-dsp-exp__img{margin:9px 0 0}
.ohio-dsp-exp{padding-bottom:86px!important}

/* credentials 4724:20925-21099: lead 22/30 SemiBold, list 18/28 Medium gap 18.5 */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-creds__lead{margin:13px 0 0;font:600 22px/30px var(--font-base)!important;letter-spacing:0!important;color:#1b1822!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-creds__list{gap:18.5px;margin-top:15px}

/* services 5277:12603: 3 cards 418×96 gap 12, title 22/23 SemiBold #422666 caps, text 17/21 Medium #000 */
.ohio-dsp-svc .ohio-dsp-rowwrap{margin-top:22px}
.ohio-dsp-svc__row{gap:12px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-svc__card{box-sizing:border-box;width:calc((100% - 24px)/3);min-height:96px;padding:19px 26px 23px 28px;align-items:center}
.ohio-dsp-svc__txt{gap:10px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-svc__txt strong{font:600 22px/23.1px var(--font-base)!important;letter-spacing:0!important;text-transform:uppercase!important;color:#422666!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-svc__txt small{font:500 17px/20.7px var(--font-base)!important;letter-spacing:0!important;color:#000!important}

/* treatment photos 5200:29945: card 623×537 (photo 623×427, 1px #3C145B), name 23/24 SemiBold #422666 at +454, text 18/19 SemiBold #000 at +485 */
.ohio-dsp-visit__grid{gap:30px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card{min-height:537px;border:1px solid #3c145b}
.ohio-dsp-visit__card img{height:427px}
.ohio-dsp-visit__card a:has(>.is-framed){height:427px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card figcaption{margin:27px 16px 31px 44px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card figcaption strong{font:600 23px/24px var(--font-base)!important;letter-spacing:0!important;color:#422666!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card figcaption span{margin-top:7px;font:600 18px/19px var(--font-base)!important;letter-spacing:0!important;color:#000!important}
.ohio-dsp-visit__card figcaption::before{top:3px;height:42px}
.ohio-dsp-visit{padding-bottom:61px!important}

/* activities + articles 5277:12641 / 5277:12619 */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__sub{margin:47px 0 0;padding-left:30px;font:600 26px/34px var(--font-base)!important;letter-spacing:0!important;text-transform:uppercase!important;color:#422666!important}
.ohio-dsp-acts__row{gap:30px;margin-top:16px;padding-left:36px}
.ohio-dsp-act{flex:none;width:381px;height:276px;border:1.1px solid #422666;box-shadow:4px 4px 12.2px rgba(0,0,0,.2)}
.ohio-dsp-rowwrap+.ohio-dsp-acts__sub--posts{margin-top:31px}
.ohio-dsp-posts{gap:16px 32px;margin-top:18px;padding:0 61px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post{min-height:96px;box-sizing:border-box;padding:8px 26px 8px 25px;gap:20px;border:1.03px solid #3e1d60;background:#f7f3fb}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post__txt{gap:6px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post__txt strong{font:600 22px/23.1px var(--font-base)!important;letter-spacing:0!important;text-transform:uppercase!important;color:#422666!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post__txt small{font:500 17px/20.7px var(--font-base)!important;letter-spacing:0!important;color:#000!important}
.ohio-dsp-acts__more{margin-top:33px;min-width:253px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__more{font:600 13px/18px var(--font-base)!important;letter-spacing:.6px!important}
.ohio-dsp-acts{padding-bottom:16px!important}

/* council 5176:27848: heading bar→text 15, cards 301×429 (photo 323, panel #F9F9F9 105: degree 17/21 #606060 +13, name 23/28 Bold #2C2C2C, "Xem thêm" 12/15 Medium #422666) */
.ohio-dsp-council .ohio-dsp-rowwrap{margin-top:33px}
.ohio-dsp-doc{width:301px;min-height:429px;box-shadow:2.135px 0 6.404px #f2f2f2}
.ohio-dsp-doc__body{padding-top:13px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__deg{margin:0;font:400 17px/21px var(--font-base)!important;letter-spacing:0!important;color:#606060!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__name{margin:0;font:700 23px/28px var(--font-base)!important;letter-spacing:0!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__name a{color:#2c2c2c!important}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__more{margin-top:11px;font:500 12px/15px var(--font-base)!important;letter-spacing:0!important;color:#422666!important}
/* the stored visit crops (_ohio_frame_crop) were measured for the old 623×215 box; the frame now draws 623×427 → cover */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card a{height:427px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card img.is-framed{position:static;left:auto;top:auto;width:100%;height:100%;max-width:none;object-fit:cover}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__photo{aspect-ratio:auto;height:323px}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__name a{font:inherit!important}
}

/* CM2 mobile 4823:25257 (390): values of the nodes that exist in both frames (PC dataset, mobile layout rules) */
@media(max-width:1023px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-crumbs,html body.ohio-hh #wrapper .ohio-crumbs-row .ohio-crumbs,html body.ohio-hh #wrapper .ohio-crumbs-row .ohio-crumbs a{line-height:20px!important}
 html body.ohio-hh #wrapper .ohio-crumbs-row .ohio-crumbs span{line-height:20px!important}
 html body.ohio-hh #wrapper .ohio-crumbs-row .ohio-crumbs > span:not([aria-current]){color:#bdb7c8!important}
 html body.ohio-hh #wrapper .ohio-crumbs-row .ohio-crumbs [aria-current]{font-weight:600!important;color:#422666!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__title{font:600 20px/28px var(--font-base)!important;color:#5e3d8a!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__sum{font:500 13px/20px var(--font-base)!important;color:#1b1822!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp :is(.ohio-dsp-hero__sum,.ohio-dsp-hero__creds-h) span{font:inherit!important;color:inherit!important;letter-spacing:inherit!important;text-transform:inherit}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds-h{font:600 16px/24px var(--font-base)!important;color:#422666!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds li{font:400 12px/18px var(--font-base)!important;color:#1b1822!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-creds__lead{font:400 13px/20px var(--font-base)!important;color:#6e6780!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-creds__list li{font:400 12px/18px var(--font-base)!important;color:#1b1822!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-exp__text .ohio-dsp-dots li{font:400 13px/20px var(--font-base)!important;color:#1b1822!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-spec li,html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-spec li span{font:500 13px/20px var(--font-base)!important;color:#1b1822!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-svc__txt strong{font:600 16px/24px var(--font-base)!important;text-transform:uppercase!important;color:#422666!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-svc__txt small{font:400 12px/18px var(--font-base)!important;color:#6e6780!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card figcaption strong{color:#422666!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card figcaption span{font:400 12px/18px var(--font-base)!important;color:#6e6780!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post__txt strong{font:600 18px/26px var(--font-base)!important;text-transform:none!important;color:#422666!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post__txt small{font:400 12px/18px var(--font-base)!important;color:#6e6780!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__more{box-shadow:inset 0 0 0 1.5px #422666!important;background:#fff!important;color:#422666!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__name,html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__name a{color:#422666!important}
}


/* ==========================================================================
   FD (23/10) — doctor single re-read from the CURRENT frames (Figma 10:54Z): PC 4724:20797, mobile 4823:25257.
   Copy twins (mobile frame types its own titles), mobile boxes copied from the frame nodes, PC type nits.
   ========================================================================== */
.ohio-dsp-t-m{display:none}
.ohio-dsp{--dsp-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M3.75 9h10.5M9.75 4.5 14.25 9l-4.5 4.5' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.ohio-dsp-hero__credbox{display:contents}
/* council "Xem thêm" arrow = icon (PC vector 6.7×5.6 1.4 after the text) */
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__more{display:inline-flex;align-items:center}
html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__more::after{content:"";display:block;flex:none;width:7px;height:6px;margin-left:1.4px;background:currentColor;-webkit-mask:var(--dsp-arrow) center/contain no-repeat;mask:var(--dsp-arrow) center/contain no-repeat}
@media(min-width:1024px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__deg{height:31.2px;line-height:28px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__card figcaption strong{line-height:24.2px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__more{line-height:14.63px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__deg{line-height:20.72px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc:is(:nth-child(2),:nth-child(3)) .ohio-dsp-doc__name{font-size:22.415px!important;line-height:27.32px!important}
}
@media(max-width:1023px){
 .ohio-dsp-t-pc{display:none}
 .ohio-dsp-t-m{display:inline}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__more::after{width:16px;height:16px;margin-left:6px}
 /* hero: ribbon 175×28 (4823:25268), degree pill 117×28 12/20 600 as typed (4823:25272), photo r16, CTA 350×52 (4823:25299) */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__badge{height:28px;min-height:0;padding:6px 12px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__deg{height:28px;min-height:0;padding:4px 10px;font:600 12px/20px var(--font-base)!important;letter-spacing:0!important;text-transform:none!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__frame img{border-radius:16px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__cta{height:52px}
 /* "Bằng cấp tóm tắt" card 350×178: pad 16, heading 16/24 caps, list gap 8 (4823:25279) */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__credbox{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:12px;background:#f7f3fb}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__credbox .ohio-dsp-hero__creds-h,html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__credbox .ohio-dsp-hero__creds-h span{margin:0!important;padding:0!important;border-radius:0!important;background:none!important;text-transform:uppercase!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__credbox .ohio-dsp-hero__creds{margin:0!important;padding:0!important;border-radius:0!important;background:none!important;gap:8px}
 /* photos / tiles */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-exp__img img{border-radius:16px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-act img{border-radius:12px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-post__ico{width:40px;height:40px;border-radius:10px;background:#422666 url(../img/bac-si/m-image-w.svg) center/20px no-repeat}
 /* visit CTA: arrow icon after the label (4823:25429 content = text + 8 + 18) */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__cta{gap:8px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__cta::after{content:"";display:block;flex:none;width:18px;height:18px;background:currentColor;-webkit-mask:var(--dsp-arrow) center/contain no-repeat;mask:var(--dsp-arrow) center/contain no-repeat}
 /* council card 170×342: photo 168×200, tag 28 12/20 600 #422666 on #F7F3FB, body p12 gap8, link 14/20 600 #5E3D8A + 16 icon */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__photo{height:200px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__photo img{width:100%;height:200px!important;aspect-ratio:auto!important;object-fit:cover}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__body{gap:8px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-doc__deg{align-self:flex-start;height:28px;box-sizing:border-box;font:600 12px/20px var(--font-base)!important;letter-spacing:0!important;color:#422666!important}
}

/* DS3 (24/10) — mobile frame 4823:25257: section bar 32×3 r2 #F6911C, 8 to the heading (nodes 4823:25303 / 25351 / 25416 / 25433 / 25465); breadcrumb row 20 under the header (4823:25260 at y84) */
@media(max-width:1023px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-sec-title--bar::before{width:32px;height:3px;margin-bottom:8px;border-radius:2px;background:#f6911c}
}

/* DS3 (24/10) — PC offsets measured against frame 4724:20797 (page x/y, bar = 0):
   CTA 977.8 w606.3 with text at +136.4 (pad-right 48.2, gap 13.1), credentials heading text at x1007.2, degree pill text at x994.8 (pill stays 185 wide),
   spec sub-head text at x385.6 (icon 30 + 4.6), activities: sub-head 27.9 under the title, 21.9 photos→articles head, articles +21.8, CTA centre 953.1, council link label at +113.5..114.8 of the card. */
@media(min-width:1024px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__cta{gap:13.1px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__cta::after{content:"";display:block;flex:none;position:static;width:7.1px;height:1px;margin:0;padding:0;border:0;background:none;opacity:1;animation:none}   /* spacer = frame label offset (+20.2 right) without touching the 28 Style Guide padding */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__creds-h{gap:10.3px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-hero__deg{padding:0 11.2px 0 28.8px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-sub--spec{gap:4.6px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__sub{margin-top:27.8px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__sub--posts{margin-top:5.9px}
 .ohio-dsp-posts{margin-top:21.8px}
 .ohio-dsp-acts__more{position:relative;left:-6.9px}
 .ohio-dsp-doc__more{position:relative;left:-4.4px}
}

/* DS3 — mobile visit CTA keeps its 18px arrow (frame 4823:25428: label at +107.5 of the 350 button); PC treatment cards are 623.1 wide with a 29.8 gap (frame cards at x320 / 972.9) */
@media(max-width:1023px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__cta::after{display:block!important}
}
@media(min-width:1024px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__grid{grid-template-columns:repeat(2,minmax(0,623.1px));column-gap:29.8px}
}

/* DS3 — mobile breadcrumb: row at y84 (20 under the header), current page always on its own line (frame 4823:25260-25265, 46 tall), photo 16 below (y146) */
@media(max-width:1023px){
 html body.ohio-hh #wrapper .ohio-dsp .ohio-crumbs-row{padding-top:20px}
 html body.ohio-hh #wrapper .ohio-dsp .ohio-crumbs [aria-current]{flex:0 0 100%}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp>section.ohio-dsp-hero{padding-top:16px!important}
}
/* S3 round 2 — PC section rhythm from the frame heading tops (4724:20796): creds cards 39.2 under the list, svc / creds / visit / acts bottoms, activities gaps 49.3,
   council pager (pill 66.7 + 12 dots, 46.2 under the cards, 67.9 above the footer) */
@media(min-width:1024px){
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-certs{margin-top:39.2px}
 /* S3 round 3: cert cards are mats in the frame, image 255.6 x 179.9 in a 298.7 x 222.4 card (+20.8 / +21.2); tall cards 256.2 x 369.8 in 323.5 x 455.1 (+33.5 / +43.8) */
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-certs__item{padding:20px 20.7px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-certs__item.is-tall{padding:41.8px 32.9px 39.5px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp section.ohio-dsp-creds{padding-bottom:50.9px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp section.ohio-dsp-svc{padding-bottom:50.6px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-visit__grid{margin-top:23.7px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp section.ohio-dsp-visit{padding-bottom:50.9px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__sub{margin-top:14.3px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__sub--posts{margin-top:33.25px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-posts{margin-top:18.7px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp .ohio-dsp-acts__more{margin-top:49.3px}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp section.ohio-dsp-acts{padding-bottom:32.8px!important}
 html body.ohio-hh #wrapper #ohio-doctor.ohio-dsp section.ohio-dsp-council{padding-bottom:67.9px!important}
 .ohio-dsp-council .ohio-dsp__dots{display:flex;align-items:center;justify-content:center;gap:14.5px;margin-top:46.2px}
 .ohio-dsp-council .ohio-dsp__dots[hidden]{display:none}
 .ohio-dsp-council .ohio-dsp__dots i{width:12px;height:12px;border-radius:6px;background:#ddd}
 .ohio-dsp-council .ohio-dsp__dots i.is-on{width:66.7px;background:#422666}
}
