/* ================================================================
   nhakinhphoisay.vn — Minimal ratio + responsive fix
   Không override màu, không đổi font — chỉ fix layout & tỷ lệ
   ================================================================ */

/* ─── 1. Ảnh không bị méo ─────────────────────────────────── */
img {
  max-width: 100% !important;
  height: auto !important;
}

/* ─── 2. Image module: tỷ lệ 4:3 cố định, không bị cắt lẻ ── */
.et_pb_image .et_pb_image_wrap {
  display: block;
  overflow: hidden;
  border-radius: 8px;
}

.et_pb_image .et_pb_image_wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  aspect-ratio: 4 / 3;
  transition: transform 0.4s ease;
}

.et_pb_image .et_pb_image_wrap:hover img {
  transform: scale(1.04);
}

/* ─── 3. Gallery: đều ratio, không so le chiều cao ──────────── */
.et_pb_gallery_image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 6px;
}

.et_pb_gallery_image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.4s ease;
}

.et_pb_gallery_item:hover .et_pb_gallery_image img {
  transform: scale(1.05);
}

/* ─── 4. Blurb icon: giới hạn size, không phình ─────────────── */
.et_pb_blurb .et_pb_main_blurb_image img {
  max-width: 72px !important;
  max-height: 72px !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ─── 5. Section có bg-image: luôn cover, không bị tile ─────── */
.et_pb_section[style*="background-image"] {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* ─── 6. Scroll reveal nhẹ ──────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.reveal.visible {
  opacity: 1;
  transform: none;
}
.reveal:nth-child(2) { transition-delay: 0.08s; }
.reveal:nth-child(3) { transition-delay: 0.16s; }
.reveal:nth-child(4) { transition-delay: 0.24s; }
.reveal:nth-child(5) { transition-delay: 0.32s; }
.reveal:nth-child(6) { transition-delay: 0.40s; }

/* ─── 7. Responsive layout ──────────────────────────────────── */

/* Tablet 768–980px: 1/4, 1/5, 1/6 → 2 cột */
@media (max-width: 980px) {
  .et_pb_column_1_4,
  .et_pb_column_1_5,
  .et_pb_column_1_6 {
    width: 48% !important;
    margin-bottom: 24px !important;
  }

  .et_pb_gallery_grid .et_pb_gallery_item {
    width: 50% !important;
  }
}

/* Mobile <768px: tất cả stack 1 cột */
@media (max-width: 767px) {
  .et_pb_column,
  .et_pb_column_1_2,
  .et_pb_column_1_3,
  .et_pb_column_1_4,
  .et_pb_column_1_5,
  .et_pb_column_1_6,
  .et_pb_column_2_3,
  .et_pb_column_2_5,
  .et_pb_column_3_8 {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .et_pb_gallery_grid .et_pb_gallery_item {
    width: 50% !important;
  }

  .et_pb_column + .et_pb_column {
    margin-top: 20px !important;
  }

  .et_pb_section {
    padding: 32px 0 !important;
  }

  h1 { font-size: 26px !important; }
  h2 { font-size: 20px !important; }
}

/* ─── 8. Logo không bị xô ────────────────────────────────────── */
#logo {
  max-height: 52px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}

/* ─── 9. Smooth scroll ───────────────────────────────────────── */
html { scroll-behavior: smooth; }

/* ─── 10. Section fullwidth specialty: cắt gọn 2 bên ─────────
   Section et_pb_section_2 chạy sát mép viewport → thêm margin
   + border-radius + overflow:hidden để thấy rõ khối chữ nhật   */
.et_pb_specialty_fullwidth {
  margin-left: 4% !important;
  margin-right: 4% !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* Đảm bảo background của specialty section cover đúng sau khi có border-radius */
.et_pb_specialty_fullwidth .et_pb_background_mask,
.et_pb_specialty_fullwidth::before {
  border-radius: inherit !important;
}

/* Video box: responsive 16:9 */
.et_pb_video_box {
  position: relative !important;
  padding-bottom: 56.25% !important;
  height: 0 !important;
  overflow: hidden !important;
  border-radius: 10px !important;
}
.et_pb_video_box iframe {
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
}