/* Go-live: logo Step Up, mục số liệu /hop-tac/, nút phụ hero, khung ảnh media. Nguồn ở tools/golive.css;
   tools/extract_preview.py chép ra assets/css/golive.<hash>.css. Không sửa site.*.css / pages.*.css. */

/* Logo Step Up bản A (viewBox 132x48): cao 32 px, điện thoại 28 px, bề ngang theo tỷ lệ */
.hdr__logo-img{display:block;height:32px;width:auto;max-width:none}
.ftr__logo{display:block;height:32px;width:auto;max-width:none;margin:0 0 var(--space-8)}
@media(max-width:767px){.hdr__logo-img{height:28px}}

/* Mục số liệu: 3 thẻ trắng bo 16 px, số to, nhãn dưới, canh giữa */
dl.stats{gap:var(--space-5)}
@media(min-width:768px){dl.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
dl.stats>.stat{align-items:center;justify-content:center;text-align:center;gap:var(--space-2);
  padding:var(--space-8) var(--space-5);border:0;border-radius:16px;background:var(--surface-card);
  box-shadow:0 6px 20px rgba(15,23,42,.07)}
dl.stats>.stat .stat__value{color:var(--neutral-900);white-space:nowrap}
dl.stats>.stat .stat__label{color:var(--text-secondary)}

/* Link dài (URL làm chữ) trong bài tuyển dụng: xuống dòng, không đẩy tràn ngang ở điện thoại */
.w-prose a{overflow-wrap:anywhere}

/* Một trục trái cho mọi section: khối chữ hẹp (--text 960, --read 680) giữ khung rộng 1200 như các
   section khác, chỉ giới hạn bề ngang dòng chữ bên trong, căn trái. Trước đây khung hẹp căn giữa
   làm mép chữ nhảy 48 → 160 → 300 px giữa các section. */
.w-container--text,.w-container--read{max-width:calc(var(--web-container-wide) + 2 * var(--web-gutter))}
.w-container--text>*{max-width:var(--web-container-text);margin-inline:0}
.w-container--read>*{max-width:var(--web-container-read);margin-inline:0}

/* Hero: nút phụ dạng chữ (pk-btn--text) thành nút viền, cùng cao / bo / cỡ chữ với nút chính bên cạnh.
   Nền trong, viền teal 1.5px; hover nền sáng cùng tông, viền nhạt dần (không thêm viền, không trắng);
   nhấn lún và nhỏ lại. Điện thoại: rộng hết hàng như nút chính. */
.hero__ctas .pk-btn--text{padding-bottom:var(--button-depth,4px)}
.hero__ctas .pk-btn--text .pk-btn__face{--btn-bg:transparent;--btn-text:var(--text-heading);min-width:var(--btn-minw);
  padding:0 var(--btn-pad);margin-left:0;border:1.5px solid var(--cyan-600);text-transform:uppercase;
  letter-spacing:var(--type-button-tracking);text-decoration:none;
  transition:transform var(--motion-normal) var(--ease-spring),background var(--motion-normal),border-color var(--motion-normal)}
@media(hover:hover)and (pointer:fine){.hero__ctas .pk-btn--text:hover .pk-btn__face{background:var(--cyan-50);border-color:var(--cyan-400)}}
.hero__ctas .pk-btn--text:active .pk-btn__face{transform:translateY(3px) scale(.97);background:var(--cyan-50);
  border-color:var(--cyan-400);transition:transform 60ms ease-out}
@media(max-width:767px){.hero__ctas .pk-btn--text{display:block;width:100%}.hero__ctas .pk-btn--text .pk-btn__face{min-width:0}}

/* Ảnh media (tools/place_media.py theo tools/media_slots.json) */
/* Thẻ path: ảnh chụp lấp đầy khung, không lộ nền khung; màn app: điện thoại cắt ngang ở mép dưới khung */
.path__media .path__img.media-cover{width:100%;height:100%;object-fit:cover}
.path__media .path__img.media-phone{height:168px;width:auto;align-self:flex-end}
/* Ảnh chụp ở hero: bo góc như ảnh split */
.hero__media .hero__img.media-photo{border-radius:var(--radius-3xl)}
/* Mốc /hop-tac/: hai ô cùng tỉ lệ; 2023 màn app nền trong trên nền nhạt, 2026 ảnh chụp lấp đầy ô */
.step .media-tile{width:100%;height:auto;aspect-ratio:1232/966;object-fit:cover;border-radius:var(--radius-xl);margin:var(--space-2) 0}
.step .media-tile--tint{object-fit:contain;background:var(--surface-tinted);padding:var(--space-3)}
/* Ảnh trong bài (prose): rộng hết cột chữ, bo góc */
.w-prose>.media-prose{width:100%;height:auto;border-radius:var(--radius-2xl);margin:0 0 var(--space-5)}
/* Màn app đứng riêng (điện thoại nền trong) giữa các khối chữ */
.media-phone-block{width:240px;max-width:100%;height:auto;margin:0 0 var(--space-6)}
/* /hop-tac/ Tín hiệu thành công: 2 huy hiệu + ảnh sân khấu một hàng; điện thoại: 2 huy hiệu một hàng, ảnh dưới */
.media-awards{--gap:var(--space-6);display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4) var(--gap);margin:0 0 var(--space-8)}
.media-awards .media-badge{height:140px;width:auto}
.media-awards .media-stage{height:180px;width:auto;border-radius:var(--radius-xl)}
@media(max-width:767px){.media-awards .media-badge{width:calc(50% - var(--gap) / 2);height:auto}
  .media-awards .media-stage{width:100%;height:auto}}