/* =====================================================================
 * yp_footer.css — CHAN TRANG DUNG CHUNG cho MOI trang yellowpages.vn
 * Cap doi voi yp_footer.asp. Dat 31/07/2026.
 * Nguon thiet ke: ypvn_mockup_trangchu_v25.html §.foot (dong 215-221)
 * YPVN-BUILD: cls-v24-V66 | dien thoai: luoi 2 cot, can trai | 2026-08-24
 *
 * ⚠ NGOAI LE CO CHU DICH doi voi luat "moi selector bat dau bang
 *   body[data-yp-page=...]". Luat do sinh ra vi 3 phien lam viec song song
 *   (index / cls / lgs) va vi container-xxl la diem va cham. O day nguoc lai:
 *   chan trang la thu PHAI giong nhau tren ca 3 trang, nen pham vi hoa theo
 *   trang se pha muc dich. Thay vao do pham vi hoa bang .ypx-foot — lop moi
 *   hoan toan, khong ton tai o bat ky file CSS nao khac, nen khong the va cham.
 *
 * ⚠ MOI bien deu co GIA TRI DU PHONG: var(--ypx-ink, #171510).
 *   ⚠ CAU DUOI DAY DA CU, sua o V49: truoc kia :root nam trong yp_home2.css
 *     ma cls.asp / lgs.asp khong nap. TU LAT V46 khoi :root do da bi go khoi
 *     yp_home2.css; token nay o yp_tokens.css va CA BA TRANG deu nap no.
 *     Nen gia tri du phong gio chi chay khi yp_tokens.css khong tai duoc.
 *   V49 dong bo lai nam gia tri du phong theo bang mau AM hien hanh (V44/V45):
 *     --ypx-line #E3E5E9 -> #EAE6DD · --ypx-line-soft #EDEFF2 -> #F0EFEB
 *     --ypx-ink #17150F -> #171510 · --ypx-muted #635F56 -> #5B5851
 *     --ypx-faint #8A8579 -> #807D74
 *   Hom nay KHONG doi mot pixel nao (token luon nap duoc); day la bao hiem
 *   cho truong hop tokens hong — de chan trang khong lanh giua mot trang am.
 * ===================================================================== */

.ypx-foot{
  background:var(--ypx-surface, #FFFFFF);
  border-top:1px solid var(--ypx-line, #EAE6DD);
  margin-top:22px;
  padding:26px 0 34px;
}
.ypx-foot .ypx-fwrap{
  max-width:var(--ypx-shell, 1480px);
  margin:0 auto;
  padding-inline:24px;
}

/* hang chinh */
.ypx-foot .ypx-flk{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px 26px;
  padding-bottom:18px;
  border-bottom:1px solid var(--ypx-line-soft, #F0EFEB);
}
.ypx-foot .ypx-flk a{
  font-size:14.5px; font-weight:500;
  color:var(--ypx-ink, #171510)!important;
  text-decoration:none;
}
.ypx-foot .ypx-flk a:hover{
  color:var(--ypx-action, #0E6B73)!important;
  text-decoration:none;
}

/* khoi thong tin phap nhan */
.ypx-foot .ypx-finfo{
  text-align:center; margin:0; padding-top:18px;
  font-size:14px; line-height:1.85;
  color:var(--ypx-muted, #5B5851);
}
.ypx-foot .ypx-finfo b{
  color:var(--ypx-ink, #171510); font-weight:600;
}
.ypx-foot .ypx-fcr{
  display:block; margin-top:12px;
  font-size:13px; color:var(--ypx-faint, #807D74);
}

/* V49 — MAN VUA: thu chu va khe lai de dai lien ket VAN mot dong.
   Do voi bo nhan moi (8 muc), khe 16px, co chu 13,5px:
       1200px du 94,2 · 1152px du 171,7 · 1080px du 99,7
       1024px du  43,7 ·  992px du  11,7   — tat ca MOT DONG
   992px la ranh gioi PC/dien thoai cua chinh site (.d_pc = none tu <=991px);
   duoi nguong do la bo cuc dien thoai, xuong dong la dung.
   ⚠ Dat TRUOC hai khoi @media hep hon ben duoi — cung do dac hieu thi nap
     sau thang, nen thu tu nay la co y. */
@media screen and (max-width:1199.98px){
  .ypx-foot .ypx-flk{ gap:8px 16px }
  .ypx-foot .ypx-flk a{ font-size:13.5px }
}

@media screen and (max-width:991px){
  .ypx-foot .ypx-fwrap{ padding-inline:16px }
}
@media screen and (max-width:575px){
  .ypx-foot{ padding:20px 0 26px }
  .ypx-foot .ypx-flk{ gap:8px 18px }
  .ypx-foot .ypx-finfo{ font-size:13.5px; line-height:1.75 }
}
/* =====================================================================
 * V66 — CHAN TRANG BAN DIEN THOAI: LUOI 2 COT, CAN TRAI
 * ---------------------------------------------------------------------
 * Do tren ban do (SAU khi V65 go va cham ten lop .ypx-fwrap — truoc do
 * padding-inline bi de ve 0 nen moi phep do be ngang deu sai):
 *
 *                       360px      421px      575px
 *   chan trang cao      530,0      408,1      356,3
 *   hang lien ket       4 hang     3 hang     2 hang  (rach mep, can giua)
 *   vung cham lien ket  20,3px     20,3px     20,3px  -> 8/8 DUOI 24
 *   khoi phap nhan      15 dong    11 dong    10 dong (can giua)
 *
 * BA CAI SUA:
 *
 * 1. 20,3px duoi ca nguong THAP nhat cua WCAG (2.5.8 AA = 24px). Chan trang
 *    la noi dat "Lien he" va "English" — hai muc nguoi ta thuc su bam.
 *    -> luoi 2 cot, o cao 40px.
 *    Do be rong tung nhan @360 (vung chu 328px): dai nhat "Xac thuc doanh
 *    nghiep" 152,4px. 2 cot khe 12px => moi cot 158px. Vua, con du 5,6px.
 *    Da do lai: 0/8 nhan bi cat o ca 360 / 421 / 575.
 *
 * 2. Hang lien ket rach mep: 3-4 hang can giua, moi hang mot do dai, mat
 *    khong co mep nao de bam vao. Luoi cho hai cot thang.
 *
 * 3. Khoi phap nhan can giua 11-15 dong — dang kho doc nhat cua van ban
 *    nhieu dong: moi lan xuong dong mat lai phai di tim diem bat dau.
 *    "Chu quan: CONG TY ... THONG TIN / DOANH NGHIEP VIET" bi be doi giua
 *    ten phap nhan. -> can TRAI, line-height 1,75 -> 1,6.
 *
 * ⚠ Ke ngan dat o TREN moi o va BO o hai o dau — khong phai ke duoi.
 *   Ke duoi thi hang cuoi co mot vach, ngay duoi no lai la border-bottom
 *   san co cua .ypx-flk => HAI VACH sat nhau (da dung thu va nhin thay).
 *   Ke tren + bo hai o dau vua khong con vach thua, vua KHONG phu thuoc
 *   tong so muc chan hay le — chi phu thuoc "hai o dau", luon dung.
 *
 * ⚠ CAO THEM 59px @421 (408,1 -> 467,1). Doi lai 8/8 lien ket dat nguong
 *   cham va ca hai khoi doc duoc. Muon nen lai: min-height 40 -> 34px thi
 *   con 439,1px, van tren nguong 24.
 *
 * ⚠ Nhanh >=576px KHONG doi mot pixel — da do: van 8 cot flow cu, can giua.
 * ⚠ 575px la nguong DA CO SAN trong chinh tep nay, khong phai so moi.
 * ===================================================================== */
@media screen and (max-width:575px){
  .ypx-foot .ypx-flk{
    display:grid; grid-template-columns:1fr 1fr;
    gap:0 12px;
    padding-bottom:14px;
  }
  .ypx-foot .ypx-flk a{
    display:flex; align-items:center;
    min-height:40px;
    border-top:1px solid var(--ypx-line-soft, #F0EFEB);
  }
  .ypx-foot .ypx-flk a:nth-child(-n+2){ border-top:0 }

  .ypx-foot .ypx-finfo{ text-align:left; line-height:1.6 }
}
