/* =============================================================
   XE TẢI THÀNH HƯNG — Trang Giới thiệu (page-gioi-thieu.php)
   TỰ CHỨA ĐỦ — chỉ phụ thuộc biến màu --hh-* trong hh-header.css
   ============================================================= */
.hh-page{background:#fff;font-family:'Be Vietnam Pro',Arial,sans-serif;color:var(--hh-ink);line-height:1.65}
.hh-page *{box-sizing:border-box}
.hh-page a{text-decoration:none;color:inherit}
.hh-page h1,.hh-page h2,.hh-page h3,.hh-page h4{margin:0;line-height:1.2;font-family:inherit;text-transform:none}
.hh-page p{margin:0 0 1em}
.hh-page img{max-width:100%;display:block;height:auto}
.hh-page ul{list-style:none;margin:0;padding:0}
.hh-page .hh-wrap{max-width:1180px;margin:0 auto;padding:0 24px;width:100%}
.hh-page .hh-eyebrow{display:inline-block;color:var(--hh-orange);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:0}
.hh-sec{padding:72px 0}
.hh-sec.hh-alt{background:var(--hh-bg)}
.hh-sec-h{text-align:center;max-width:680px;margin:0 auto 44px}
.hh-sec-h h2{font-size:34px;font-weight:800;letter-spacing:-.4px;line-height:1.25;margin:8px 0 12px;text-align:center}
.hh-sec-h h2 span,.hh-page h2 span{color:var(--hh-red)}
.hh-sec-h p{color:var(--hh-muted);margin:0;font-size:16px;text-align:center}
.hh-stars{color:var(--hh-amber);letter-spacing:1px}
.hh-page .hh-btn-ghost{background:#fff;border:1.5px solid var(--hh-line);color:var(--hh-ink)}
.hh-page .hh-btn-ghost:hover{border-color:var(--hh-red);color:var(--hh-red)}
.hh-page .hh-btn-white{background:#fff;color:var(--hh-red)}

/* Breadcrumb */
.hh-crumb{border-bottom:1px solid var(--hh-line);background:#fff}
.hh-crumb ol{list-style:none;margin:0;padding:14px 0;display:flex;flex-wrap:wrap;gap:8px;font-size:13.5px;color:var(--hh-muted)}
.hh-crumb li+li::before{content:"\203A";margin-right:8px;color:#b6c1cc}
.hh-crumb a:hover{color:var(--hh-red)}
.hh-crumb [aria-current]{color:var(--hh-ink);font-weight:600}

/* HERO */
.hh-hero{padding:56px 0 64px;background:radial-gradient(900px 400px at 88% -10%,rgba(247,148,29,.12),transparent 60%),radial-gradient(700px 380px at 5% 0%,rgba(214,37,43,.10),transparent 60%)}
.hh-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.hh-pill{display:inline-flex;align-items:center;gap:8px;background:var(--hh-oranges);color:var(--hh-oranged);font-weight:700;font-size:13.5px;padding:7px 14px;border-radius:999px}
.hh-pill .hh-ico{width:16px;height:16px}
.hh-hero h1{font-size:44px;line-height:1.16;font-weight:800;margin:16px 0 14px;letter-spacing:-.02em}
.hh-hero h1 span{color:var(--hh-red)}
.hh-hero .hh-lead{color:var(--hh-muted);font-size:17px;margin:0 0 22px;max-width:48ch}
.hh-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}
.hh-chip{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--hh-line);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600}
.hh-chip .hh-ico{color:var(--hh-orange);width:18px;height:18px}
.hh-hbtns{display:flex;gap:12px;flex-wrap:wrap}
.hh-hphoto{width:100%;height:420px;object-fit:cover;border-radius:20px}

/* STATS */
.hh-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.hh-stat{background:#fff;border:1px solid var(--hh-line);border-radius:var(--hh-r);padding:26px 22px;text-align:center}
.hh-stat b{display:block;font-size:38px;font-weight:800;color:var(--hh-red);line-height:1;letter-spacing:-.02em}
.hh-stat span{display:block;margin-top:8px;color:var(--hh-muted);font-size:14px;font-weight:600}

/* ABOUT */
.hh-about{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center}
.hh-about .hh-rte p{color:var(--hh-ink);font-size:16px;margin:0 0 16px;text-align:left}
.hh-about .hh-rte p:last-child{margin:0}
.hh-about .hh-sec-h{text-align:left;max-width:none;margin:8px 0 20px}
.hh-about .hh-sec-h h2{text-align:left}
.hh-aphoto{width:100%;height:440px;object-fit:cover;border-radius:20px}

/* TẦM NHÌN / SỨ MỆNH */
.hh-vm{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hh-vmcard{border:1px solid var(--hh-line);border-radius:var(--hh-r);padding:30px;background:#fff}
.hh-vmcard.hh-b{background:var(--hh-red);color:#fff;border-color:var(--hh-red)}
.hh-vmcard.hh-b p{color:#ffe3e4}
.hh-vmi{width:56px;height:56px;border-radius:14px;background:var(--hh-reds);color:var(--hh-red);display:grid;place-items:center;margin-bottom:16px}
.hh-vmcard.hh-b .hh-vmi{background:rgba(255,255,255,.15);color:#fff}
.hh-vmi .hh-ico{width:28px;height:28px}
.hh-vmcard h3{font-size:20px;font-weight:800;margin:0 0 8px;text-align:left}
.hh-vmcard p{color:var(--hh-muted);font-size:15px;margin:0;text-align:left}

/* GIÁ TRỊ CỐT LÕI */
.hh-motto{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.hh-mcard{background:#fff;border:1px solid var(--hh-line);border-radius:var(--hh-r);padding:30px 22px;text-align:center;transition:.2s}
.hh-mcard:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(21,33,46,.08)}
.hh-mi{width:62px;height:62px;margin:0 auto 16px;border-radius:50%;background:var(--hh-reds);color:var(--hh-red);display:grid;place-items:center}
.hh-mi .hh-ico{width:30px;height:30px}
.hh-mcard:nth-child(even) .hh-mi{background:var(--hh-oranges);color:var(--hh-orange)}
.hh-mcard h3{font-size:18px;font-weight:700;margin:0 0 6px;text-align:center}
.hh-mcard p{color:var(--hh-muted);font-size:14px;margin:0;text-align:center}

/* VÌ SAO CHỌN */
.hh-inc{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hh-incit{display:flex;gap:14px;background:#fff;border:1px solid var(--hh-line);border-radius:var(--hh-r);padding:22px}
.hh-ii{width:44px;height:44px;flex:none;border-radius:12px;background:var(--hh-reds);color:var(--hh-red);display:grid;place-items:center}
.hh-ii .hh-ico{width:22px;height:22px}
.hh-incit h3{font-size:17px;font-weight:700;margin:0 0 5px;text-align:left}
.hh-incit p{color:var(--hh-muted);font-size:14.5px;margin:0;text-align:left}

/* THẺ DỊCH VỤ */
.hh-svgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hh-scard{background:#fff;border:1px solid var(--hh-line);border-radius:var(--hh-r);overflow:hidden;display:block;height:100%;transition:.2s;color:inherit}
.hh-scard:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(21,33,46,.09)}
.hh-simg{overflow:hidden;background:var(--hh-bg)}
.hh-simg img{height:190px;width:100%;object-fit:cover;transition:.4s}
.hh-scard:hover .hh-simg img{transform:scale(1.05)}
.hh-sc-body{padding:22px}
.hh-sc-body h3{font-size:18px;font-weight:700;margin:0 0 8px;text-align:left}
.hh-sc-body p{color:var(--hh-muted);font-size:14.5px;margin:0 0 14px;text-align:left}
.hh-sc-more{display:inline-flex;align-items:center;gap:6px;color:var(--hh-red);font-weight:700;font-size:14.5px}
.hh-sc-more .hh-ico{width:16px;height:16px}

/* ĐÁNH GIÁ */
.hh-revgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hh-rvcard{background:#fff;border:1px solid var(--hh-line);border-radius:var(--hh-r);padding:26px}
.hh-rvcard .hh-stars{margin-bottom:10px;letter-spacing:2px}
.hh-rvcard p{margin:0 0 18px;font-size:15px;color:var(--hh-ink);text-align:left}
.hh-rvby{display:flex;align-items:center;gap:12px}
.hh-av{width:42px;height:42px;flex:none;border-radius:50%;background:var(--hh-red);color:#fff;font-weight:700;display:grid;place-items:center}
.hh-rvby b{display:block;font-size:15px}
.hh-rvby span{color:var(--hh-muted);font-size:13.5px}

/* GALLERY */
.hh-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.hh-gallery figure{margin:0;border-radius:14px;overflow:hidden;position:relative;aspect-ratio:1/1;background:var(--hh-bg)}
.hh-gallery img{width:100%;height:100%;object-fit:cover;transition:.45s}
.hh-gallery figure:hover img{transform:scale(1.07)}

/* BÁO CHÍ
   LƯU Ý: text-align ở đây phải đặt TRỰC TIẾP lên từng thẻ, không dựa vào
   kế thừa từ .hh-press-head — giá trị kế thừa luôn THUA mọi rule khớp trực tiếp,
   kể cả một rule `p{...}` rất yếu trong style.css của theme. */
.hh-press{padding:60px 0;background:#f8f8f8}
.hh-press .hh-wrap{max-width:1170px;padding:0 15px}
.hh-press-head{text-align:center;max-width:900px;margin:0 auto 48px}
.hh-press .hh-press-head p.hh-press-eyebrow{font-size:24px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:#950505;margin:0 0 6px;text-align:center}
/* 2 vạch trang trí nằm SÁT MÉP DƯỚI tiêu đề (trước đây bottom:-.5rem nên tràn xuống đè lên dòng mô tả) */
.hh-press .hh-press-head h2.hh-press-title{font-size:36px;font-weight:700;text-transform:uppercase;color:#d71920;margin:0 0 30px;position:relative;padding-bottom:18px;text-align:center}
.hh-press-title::before{background:#297F87;bottom:0;left:50%;transform:translateX(-50%);content:"";height:.2rem;position:absolute;width:10rem}
.hh-press-title::after{background:#F6D167;bottom:0;left:50%;transform:translateX(-50%);content:"";height:.2rem;position:absolute;width:3rem}
.hh-press .hh-press-head p.hh-press-subtitle{font-size:16px;line-height:1.6;color:#227378;max-width:600px;margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;text-align:center}
.hh-press-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.hh-press-item{background:#fff;border:1px solid #ececec;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.05);display:flex;align-items:center;justify-content:center;padding:16px;min-height:90px}
.hh-press-link{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:transform .15s ease}
.hh-press-link:hover{transform:scale(1.05)}
.hh-press-logo{max-width:100%;max-height:50px;width:auto;height:auto;object-fit:contain;display:block}

/* CTA CUỐI */
.hh-finalcta{background:linear-gradient(120deg,var(--hh-red),#f0474d);color:#fff;text-align:center;padding:64px 24px}
.hh-finalcta h2{font-size:32px;font-weight:800;margin:0 0 10px;color:#fff;text-align:center}
.hh-finalcta p{color:#ffe0e1;margin:0 0 20px;font-size:16px;text-align:center}
.hh-ph{font-size:28px;font-weight:800;margin:0 0 22px;text-align:center}
.hh-ph a{color:#fff}
.hh-finalcta .hh-btn-white{color:var(--hh-red)}

/* ================= RESPONSIVE ================= */
@media(max-width:1024px){
  .hh-hero-grid,.hh-about,.hh-vm{grid-template-columns:1fr;gap:32px}
  .hh-stats,.hh-motto{grid-template-columns:repeat(2,1fr)}
  .hh-inc,.hh-svgrid,.hh-revgrid{grid-template-columns:repeat(2,1fr)}
  .hh-press-grid{grid-template-columns:repeat(4,1fr)}
  .hh-sec{padding:56px 0}
  .hh-hero h1{font-size:36px}
}
@media(max-width:768px){
  .hh-press-grid{grid-template-columns:repeat(3,1fr)}
  .hh-press .hh-press-head h2.hh-press-title{font-size:28px;margin-bottom:26px}
  .hh-press .hh-press-head p.hh-press-eyebrow{font-size:19px}
}
@media(max-width:560px){
  .hh-page .hh-wrap{padding:0 16px}
  .hh-sec{padding:30px 0;border-bottom:8px solid var(--hh-sep)}
  .hh-sec.hh-alt{border-bottom-color:#e4eaf0}
  .hh-sec-h{margin-bottom:22px}
  .hh-sec-h h2{font-size:22px;line-height:1.3}
  .hh-sec-h p{font-size:14.5px}
  .hh-page .hh-btn{width:100%}
  .hh-crumb ol{padding:11px 16px;flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;font-size:12.5px}
  .hh-hero{padding:24px 0 28px}
  .hh-hero-grid{display:block}
  .hh-hero h1{font-size:26px;margin:12px 0 10px}
  .hh-hero .hh-lead{font-size:15px;max-width:none}
  /* Ảnh nằm SAU nhóm nút khi xếp dọc → cần margin-top, không phải margin-bottom */
  .hh-hphoto{height:210px;border-radius:14px;margin-top:20px;margin-bottom:0}
  .hh-chips{display:grid;gap:8px;margin-bottom:18px}
  .hh-hbtns{display:grid;gap:10px}
  .hh-stats,.hh-motto{grid-template-columns:1fr 1fr;gap:10px}
  .hh-stat{padding:18px 12px}
  .hh-stat b{font-size:26px}
  .hh-stat span{font-size:12.5px}
  .hh-about{gap:20px}
  .hh-aphoto{height:220px;border-radius:14px}
  .hh-vmcard{padding:22px 18px}
  .hh-mcard{padding:20px 14px}
  .hh-mi{width:52px;height:52px}
  .hh-inc,.hh-svgrid,.hh-revgrid{grid-template-columns:1fr;gap:12px}
  .hh-gallery{grid-template-columns:repeat(2,1fr);gap:10px}
  .hh-press{padding:36px 0}
  .hh-press-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .hh-press-head{margin-bottom:26px}
  .hh-press .hh-press-head h2.hh-press-title{font-size:22px;padding-bottom:14px;margin-bottom:20px}
  .hh-press-title::before{width:7rem}
  .hh-press .hh-press-head p.hh-press-subtitle{font-size:14.5px}
  .hh-press-item{min-height:70px;padding:12px}
  .hh-finalcta{padding:34px 16px}
  .hh-finalcta h2{font-size:22px}
  .hh-ph{font-size:22px}
}
