/* ==========================================================================
   Footer v3 — Figma home frame 3409:1942, footer group 3798:19641 (frame y 8402-9035, 1920x633).
   Desktop >=1200: content canvas 1166 wide (frame x 377..1543, centred on 960) with every block placed
   from the frame: left = frame x - 377, top = frame y - 8402 (text boxes from home-text-spec.tsv).
   Background 3798:19643: gradient #422666 (right) > #47296C 30.5% > #56337C 70.6% > #653C8D (left).
   <1200: stacked; <=767: Tím 700 flat, branch cards (mobile pixel pass is a later phase).
   The UX Block wrapper section (.qh_f1) is neutralised so the footer controls its own spacing.
   ========================================================================== */
.qh_f1.section{padding:0!important;background:none!important}
.qh_f1 > .section-content > .row,.qh_f1 .row > .col{max-width:none;padding:0;margin:0;flex-basis:100%}

.ohio-footer{background:linear-gradient(to left,#422666 0,#47296C 30.52%,#56337C 70.6%,#653C8D 100%);color:#fff;
  font:400 12px/15px "Montserrat",Arial,sans-serif;padding:48px 20px 32px;overflow:hidden}
.ohio-footer a{color:inherit;text-decoration:none}
.ohio-footer a:hover{color:#fff;text-decoration:underline}
.ohio-footer :is(p,h3,h4,ul){margin:0}
.ohio-footer ul{padding:0}
.ohio-footer__in{max-width:1166px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:36px 40px}
.ohio-footer__brand{display:grid;gap:16px;align-content:start}
.ohio-footer__logo img{display:block;width:200px;height:auto}
.ohio-footer__intro{font:300 11.6px/20px "Montserrat",Arial,sans-serif}
.ohio-footer__dmca,.ohio-footer__bct{display:inline-block;height:44px;width:auto}
.ohio-footer .ohio-footer__title{font:600 24px/29px "Montserrat",Arial,sans-serif;text-transform:uppercase;color:#fff;margin:0 0 16px}
.ohio-footer__branches{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
.ohio-footer__branches .ohio-footer__title{grid-column:1 / -1;margin:0}
.ohio-footer__branch{position:relative}
.ohio-footer__branch p{line-height:22.5px}
.ohio-footer__branch strong,.ohio-footer__li strong,.ohio-footer__time strong{font-weight:600}
.ohio-footer .ohio-footer__branch-name{position:relative;padding-left:17.5px;font:600 20px/24px "Montserrat",Arial,sans-serif;color:#fff;margin-bottom:6.4px}
.ohio-footer__branch-name .ohio-footer__ico{position:absolute;left:0;top:7.4px;width:11.5px;height:15.7px}
.ohio-footer__contact{display:grid;gap:8px;align-content:start;grid-column:1 / -1}
.ohio-footer__contact .ohio-footer__title{margin:0}
.ohio-footer__label{position:relative;padding-left:13.8px}
.ohio-footer__label .ohio-footer__ico{position:absolute;left:0;top:1px}
.ohio-footer__li,.ohio-footer__time{position:relative;padding-left:25.8px}
.ohio-footer__li::before{content:"";position:absolute;left:14.4px;top:5px;width:4.6px;height:4.6px;border-radius:50%;background:#fff}
.ohio-footer .ohio-footer__time{margin-top:-8px}
.ohio-footer__policies{list-style:none;display:grid;gap:9px}
.ohio-footer__policies li{margin:0;padding:0;list-style:none;text-transform:capitalize}
.ohio-footer__note{position:absolute;font:italic 400 7.6px/9px "Montserrat",Arial,sans-serif;white-space:nowrap;color:#fff;opacity:1}
.ohio-footer__follow{font-weight:500}
.ohio-footer__li--email strong{margin-right:3px}
.ohio-footer__social{display:flex;gap:11.8px}
.ohio-footer__social img{display:block;width:43.2px;height:43.2px;object-fit:contain}
.ohio-footer__copy{grid-column:1 / -1;max-width:850px;margin:0 auto;text-align:center;font:italic 400 12.7px/22px "Montserrat",Arial,sans-serif;color:#fff}

/* --- desktop canvas ---------------------------------------------------- */
@media (min-width:1200px){
  .ohio-footer{padding:0}
  .ohio-footer__in{display:block;position:relative;width:1166px;height:633px}
  .ohio-footer__brand,.ohio-footer__branches,.ohio-footer__contact{display:contents}
  .ohio-footer__in > *,.ohio-footer__brand > *,.ohio-footer__contact > *,.ohio-footer__branches > *{position:absolute}
  .ohio-footer .ohio-footer__title{margin:0}
  /* brand: logo 3798:19646..19681 (377,8466 257x127), intro vectors y 8616-8676 (lh 20), DMCA 19961, BCT 19962 */
  .ohio-footer__logo{left:0;top:64px}
  .ohio-footer__logo img{width:257px;height:128px}
  .ohio-footer__intro{left:1px;top:208px;white-space:nowrap;color:#fff;opacity:1}
  .ohio-footer__dmca{left:-6px;top:305px;width:182px;height:58px}
  .ohio-footer__bct{left:179px;top:305px;width:156px;height:58px}
  /* branches: title 3798:19870 (797.4,8488); cells name tops 8540.8 / 8536.2 / 8696.4 / 8694.9 */
  .ohio-footer__branches .ohio-footer__title{left:420.4px;top:86px;white-space:nowrap;color:#fff;opacity:1}
  .ohio-footer__branch{white-space:nowrap;width:224px}
  .ohio-footer__branch:nth-of-type(1){left:420.4px;top:138.8px}
  .ohio-footer__branch:nth-of-type(2){left:641.4px;top:134.2px}
  .ohio-footer__branch:nth-of-type(3){left:420.4px;top:294.4px}
  .ohio-footer__branch:nth-of-type(4){left:641.4px;top:292.9px}
  .ohio-footer .ohio-footer__branch:nth-of-type(4) .ohio-footer__branch-name{font-size:21px;line-height:26px;margin-bottom:5.9px}
  .ohio-footer__branch p{position:static}
  .ohio-footer .ohio-footer__branch-name{position:static}
  .ohio-footer__note{left:167.9px;top:25.7px}
  .ohio-footer__branch-name .ohio-footer__ico{position:absolute}
  /* contact column x 1276.5 */
  .ohio-footer__contact .ohio-footer__title{left:899.5px;top:86px;white-space:nowrap;color:#fff;opacity:1}
  .ohio-footer__label,.ohio-footer__li,.ohio-footer__time{white-space:nowrap;color:#fff;opacity:1}
  .ohio-footer__label--care{left:899.5px;top:123.8px;padding-left:13.8px}
  .ohio-footer__li--email{left:899.8px;top:144.1px}
  .ohio-footer__label--time{left:899.5px;top:168px}
  .ohio-footer__li--hours{left:899.8px;top:186.9px}
  .ohio-footer .ohio-footer__time{left:899.8px;top:207.2px;margin:0}
  .ohio-footer__contact .ohio-footer__title--policy{left:899.5px;top:228.4px}
  .ohio-footer .ohio-footer__policies{left:899.6px;top:269.3px;gap:9.2px}
  .ohio-footer__follow{left:900px;top:315px}
  .ohio-footer__social{left:903px;top:345px}
  .ohio-footer__copy{left:150px;top:498.5px;width:850px;max-width:none;margin:0}
}

/* --- below desktop ----------------------------------------------------- */
@media (max-width:1199px){
  .ohio-footer__branches{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.ohio-footer__mlist{display:none}   /* mobile-only contact rows */

/* --- mobile: Footer Mobile 3630:7041 (390 wide, instance 3637:7502 in Trang chủ – Mobile) -----------------
   Tím 700 flat, padding 40/20/104 (104 = room for the 72px bottom bar), one column, gap 28 between blocks:
   logo 123×64 · intro 13/20 · DMCA 128.8×40.5 + BCT 120.4×45.6 gap 12 · branches (title + cards gap 16;
   card padding 12/14 r12 border .12 fill .06, pin 16 orange, name 600 16/24, address 13/20, hotline 600 13/20,
   licence 12/20 Tím 200) · contact (gap 10; rows icon 18 + 8) · policies (row gap 20) · follow + social ·
   divider .15 · copyright 12/18 Tím 200 centred. Type overrides of the guide layer: ohio-style-guide-layer.css. */
@media (max-width:767px){
  .ohio-footer{background:var(--ohio-purple-700);padding:40px 20px 104px}
  .ohio-footer__in{display:flex;flex-wrap:wrap;align-items:center;gap:28px 12px}
  .ohio-footer__brand{display:contents}
  .ohio-footer__in > *,.ohio-footer__brand > *{flex:0 0 100%;min-width:0}
  .ohio-footer__logo{line-height:0}
  .ohio-footer__logo img{width:auto;height:61px;margin:2px 0 1px}   /* visible art 123×61 inside the 64 box */
  .ohio-footer__intro br,.ohio-footer__branch p br{display:none}
  /* home2 badge PNGs carry transparent margins: scale so the visible art is 128.8×40.5 / 120.4×45.6 */
  .ohio-footer .ohio-footer__dmca{flex:0 0 auto;width:144.7px;height:46.1px;margin:-3.2px -7.2px -2.4px -8.7px}
  .ohio-footer .ohio-footer__bct{flex:0 0 auto;width:124.4px;height:46.2px;margin:-.8px -.8px -.8px -3.2px}

  .ohio-footer__branches{grid-template-columns:1fr;gap:16px}
  .ohio-footer__branch{padding:12px 14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.06)}
  .ohio-footer__branch p{margin:4px 0 0;line-height:20px}
  .ohio-footer__branch .ohio-footer__branch-name{display:flex;align-items:center;gap:6px;padding:0;margin:0}
  .ohio-footer__branch-name .ohio-footer__ico,.ohio-footer__note{display:none}
  .ohio-footer__branch-name::before{content:"";flex:0 0 16px;height:16px;background:url(../img/mobile/footer-pin.svg) center/16px no-repeat}
  .ohio-footer__branch p.ohio-footer__lic{display:inline;color:var(--ohio-purple-200)}
  .ohio-footer__branch p.ohio-footer__lic strong{font-weight:400}
  .ohio-footer__lic--cchn::before{content:" · "}

  .ohio-footer__contact{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
  .ohio-footer__contact > .ohio-footer__label,.ohio-footer__contact > .ohio-footer__li,.ohio-footer .ohio-footer__time{display:none}
  .ohio-footer__mlist{display:flex;flex-direction:column;gap:10px;margin:0;list-style:none}
  .ohio-footer__mlist li{display:flex;align-items:center;gap:8px;margin:0;list-style:none}
  .ohio-footer__mlist li::before{content:"";flex:0 0 18px;height:18px;background:center/18px no-repeat}
  .ohio-footer__mlist li.ohio-footer__mlist-mail::before{background-image:url(../img/mobile/footer-mail.svg)}
  .ohio-footer__mlist li.ohio-footer__mlist-time::before{background-image:url(../img/mobile/footer-clock.svg)}
  .ohio-footer__mlist li.ohio-footer__mlist-tel::before{background-image:url(../img/mobile/footer-phone.svg)}
  .ohio-footer__contact .ohio-footer__title--policy,.ohio-footer .ohio-footer__follow{margin-top:18px}
  .ohio-footer .ohio-footer__policies{display:flex;flex-wrap:wrap;gap:0 20px}
  .ohio-footer__policies li{text-transform:none}
  .ohio-footer__social img{width:44px;height:44px}
  .ohio-footer__copy{max-width:none;padding-top:28px;border-top:1px solid rgba(255,255,255,.15);color:var(--ohio-purple-200)}
}
