/*
 * Chi trang kho van. Giu class Elementor de van sua duoc trong editor.
 * So khop so do element cua https://speegoweb.vercel.app/vi/kho-van/ (viewport 1440).
 */

body:not(.elementor-editor-active) .elementor .page-fulfillment {
  --padding-top: 0px;
  --padding-right: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-block-start: 0px;
  --padding-block-end: 0px;
  --padding-inline-start: 0px;
  --padding-inline-end: 0px;
  --gap: 0px 0px;
  --row-gap: 0px;
  --column-gap: 0px;
  --widgets-spacing: 0px 0px;
  padding: 0 !important;
  gap: 0 !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment > .e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment > .elementor-widget-html {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Elementor text widget chen <br> dau tieu de, day hero xuong ~67px. */
body:not(.elementor-editor-active) .elementor .page-fulfillment h1.ff-hero-brand-title > br:first-child {
  display: none;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-hero-brand-title.elementor-widget {
  width: auto !important;
  max-width: 100%;
  height: auto !important;
  margin: 0 0 8px !important;
  line-height: 1.12;
}

/* <p> trong widget ke thua kich thuoc cua lop nghia, khong bi rule 16px cua .page-container. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-title p,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-desc p,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-card .elementor-widget-text-editor p,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-step-num p {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-item.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-title.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-desc.e-con {
  height: auto !important;
  min-height: 0 !important;
  flex: 0 1 auto !important;
  --flex-grow: 0;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-title.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stat-bar-desc.e-con {
  width: auto !important;
  --width: auto;
}

/* Hub card tren mau co trong theo noi dung (~615px), Elementor keo ra max-width 1040px. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-card.e-con {
  width: max-content !important;
  max-width: min(1040px, calc(100% - 48px)) !important;
  height: auto !important;
  margin: 0 auto !important;
  flex: 0 0 auto !important;
  align-self: center !important;
  --width: max-content;
  --flex-grow: 0;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-left.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-right.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-tag.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-title.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-address.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-hotline.e-con {
  width: max-content !important;
  max-width: 100%;
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  --width: max-content;
  --flex-grow: 0;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-left.e-con {
  align-items: flex-start !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-right.e-con {
  align-items: flex-end !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-hotline.e-con {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-hotline > .elementor-widget {
  width: auto !important;
  flex: 0 0 auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-step-num.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-step-num .elementor-widget-text-editor {
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-step-num p {
  line-height: 1;
  color: inherit;
}

/* Class btn-orange nam ca tren widget lan the <a>, nen padding bi nhan doi (70px thay vi 46px). */
body:not(.elementor-editor-active) .elementor .page-fulfillment .elementor-widget.btn-orange {
  display: inline-flex;
  width: auto !important;
  max-width: none;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-process-cta.e-con {
  height: auto !important;
  min-height: 0 !important;
}

/* Eyebrow policy bi an tren mau; widget rong van chiem o grid nen tieu de xuong dong. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-policy-heading > .elementor-widget:first-child:not(.ff-section-title) {
  display: none !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-policy-heading {
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.8fr) !important;
  align-items: end;
}

/* Mau gom small+h3 trong 1 cot. Elementor tach thanh 4 o nen cot thoi gian xuong hang. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy {
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.35fr) minmax(0, 0.9fr) !important;
  align-items: center;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(1) {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  width: auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(2) {
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  width: auto !important;
  margin-top: 7px;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(3) {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  width: auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(4) {
  grid-column: 3;
  grid-row: 1 / span 2;
  align-self: center;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy .elementor-widget-text-editor p,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy li {
  margin-top: 0;
  margin-bottom: 0;
}

/* Heading mau la small + h3 xep cot trai, nhan ben phai. Elementor tach thanh 3 widget nam ngang. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading.e-con {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0 !important;
  --gap: 0px;
  --row-gap: 0px;
  --column-gap: 0px;
  height: auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading.e-con > :nth-child(1) {
  grid-column: 1;
  grid-row: 1;
  width: auto !important;
  align-self: end;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading.e-con > :nth-child(2) {
  grid-column: 1;
  grid-row: 2;
  width: auto !important;
  margin-top: 0 !important;
  align-self: start;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading.e-con > :nth-child(3) {
  grid-column: 2;
  grid-row: 1 / span 2;
  justify-self: end;
  align-self: center;
  width: auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading .elementor-widget-text-editor span {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  color: #b9c6d1;
  white-space: nowrap;
}

/* Gia $7 nam cot phai. Elementor boc small/b/strong trong 1 widget nen grid cua article khong thay chung. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-plan-strip article.e-con {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-plan-strip article > .elementor-widget {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 22px;
  row-gap: 5px;
  align-items: center;
  width: 100% !important;
  height: auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-author-info.e-con {
  gap: 6px !important;
  --gap: 6px;
  --row-gap: 6px;
  height: auto !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-author-name.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-author-title.e-con,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-author-ref.e-con {
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  --flex-grow: 0;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-author-info .elementor-widget-text-editor p {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
}

/* Dock 5 icon ben phai. Compat CSS khoa position/display nen icon JS gan vao bi an. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact {
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  pointer-events: none;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid {
  position: fixed !important;
  z-index: 960 !important;
  top: 50% !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  left: auto !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  grid-template-columns: none !important;
  pointer-events: none;
  --width: auto;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid > .elementor-element {
  width: 64px !important;
  height: 64px !important;
  min-height: 0 !important;
  flex: 0 0 64px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  pointer-events: auto;
  --width: 64px;
  --flex-grow: 0;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact a.ff-quicklink-card,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact a.ff-quicklink-card.ff-quicklink-card--hub {
  display: grid !important;
  place-items: center !important;
  justify-content: center !important;
  align-items: center !important;
  width: 64px !important;
  height: 64px !important;
  min-width: 64px !important;
  min-height: 64px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 20px !important;
  grid-template-columns: none !important;
  background: linear-gradient(145deg, #164463, #04243d 78%) !important;
  background-color: #04243d !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact a.ff-quicklink-card.ff-quicklink-card--hub {
  background: linear-gradient(145deg, #fa7847, #f05828 75%) !important;
  background-color: #f05828 !important;
}

/* Icon dock vao lan luot tu tren xuong, cung nhip ff-dock-enter cua trang mau. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid > .elementor-element .ff-quicklink-card {
  animation: ff-dock-enter .5s cubic-bezier(.16, 1, .3, 1) backwards !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid > .elementor-element:nth-child(2) .ff-quicklink-card {
  animation-delay: .06s !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid > .elementor-element:nth-child(3) .ff-quicklink-card {
  animation-delay: .12s !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid > .elementor-element:nth-child(4) .ff-quicklink-card {
  animation-delay: .18s !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklinks-grid > .elementor-element:nth-child(5) .ff-quicklink-card {
  animation-delay: .24s !important;
}

@media (prefers-reduced-motion: reduce) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-card {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-icon {
  display: grid !important;
  place-items: center;
  position: static !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  color: #fff !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-icon svg {
  width: 30px !important;
  height: 30px !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-title,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-sub,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-btn {
  display: none !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section.is-compact .ff-quicklink-compact-label {
  display: block !important;
  position: absolute !important;
  right: calc(100% + 14px) !important;
  top: 50% !important;
  width: max-content !important;
  max-width: min(280px, 70vw) !important;
  margin: 0 !important;
  transform: translate(8px, -50%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Hang gia: cot trai co dan, gia nam sat phai. Compat dang khoa 1168px + 101px. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-price-body .ff-price-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  width: 100% !important;
  column-gap: 24px !important;
  row-gap: 4px !important;
  box-sizing: border-box;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-price-row > strong {
  justify-self: end !important;
  align-self: center !important;
  width: auto !important;
  max-width: none !important;
  text-align: right !important;
  white-space: nowrap;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-price-row > div {
  min-width: 0;
  justify-self: start !important;
  text-align: left !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-price-body .ff-price-promo {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  width: 100% !important;
  gap: 16px !important;
  box-sizing: border-box;
}

/* Tieu de kho nam trai. Widget eyebrow rong van la flex item nen day tieu de sang phai. */
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-header {
  justify-content: flex-start !important;
  align-items: flex-end !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-header > .elementor-widget:has(.ff-tag-eyebrow) {
  display: none !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-header .ff-section-title {
  width: auto !important;
  margin: 0 !important;
  text-align: left !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-card {
  min-height: 0 !important;
  overflow: hidden;
  border-radius: 16px;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-card > .elementor-widget,
body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-card .elementor-widget-container {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
}

body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

@media (min-width: 1025px) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-card {
    flex: 0 0 calc((100% - 36px) / 3) !important;
    width: calc((100% - 36px) / 3) !important;
    height: clamp(190px, 21vw, 286px) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .cta-form-band-section {
    width: 100% !important;
    padding-top: 72px !important;
    padding-bottom: 72px !important;
  }
}

/* ==========================================================================
   pw-speego responsive parity (2026-10-04): khop Vercel /vi/kho-van/
   Tablet 768 + Mobile 390 (Playwright: check2.js).
   Nguyen nhan: rule desktop !important o tren (policy/claim/sheet-heading)
   + display:flex mac dinh cua .e-con Elementor de be rule grid/flex-direction
   responsive tu style.css. Khoi phuc lai dung breakpoint 1024/850/768/600.
   Update 2026-10-05 (user): tablet (601-1024) TAT CA khoi cards 2 cols,
   mobile (<=600) 1 cot.
   ========================================================================== */

/* Tablet <=1024: Elementor e-con ep flex-row lam mat grid 2 cols -> dung grid. */
@media (max-width: 1024px) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stats-bars-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-steps-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-estimator-body {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }

  /* Form fields + package options: tablet giu 2 cols (base), mobile 1 cot (<=600). */
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-estimator-form,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-package-options {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  /* Vercel tablet quicklinks = 2 cols (351px x2). Elementor dang flex-col sup do. */
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  /* Bao bi: base auto-fit + rule 1fr cua page-fulfillment -> tablet dung 2 cols. */
  body:not(.elementor-editor-active) .elementor .page-fulfillment #bang-gia-fulfillment #fulfillment-cost .ff-packaging-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  /* wp-elementor-compat.css (max-1024 block) da chup nham trang thai dock
     compact (position:fixed, icon hien, title/sub/btn an) lam rule mac dinh.
     Khi section CHUA .is-compact (chua scroll qua) phai hien cards thuong
     nhu Vercel: static grid, padding day du, title/sub/btn hien, icon an. */
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklinks-grid {
    position: static !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    align-items: stretch !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklinks-grid > .elementor-element {
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) a.ff-quicklink-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    min-width: 0 !important;
    padding: 22px 20px !important;
    margin: 0 !important;
    border-radius: 12px !important;
    transform: none !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklink-icon {
    display: none !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklink-title {
    display: block !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklink-sub {
    display: block !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklink-btn {
    display: inline-flex !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklink-compact-label {
    display: none !important;
  }

  /* CTA band Vercel tablet da xep chong (column). Elementor giu row -> ep column. */
  body:not(.elementor-editor-active) .elementor .page-fulfillment .cta-form-band-grid.e-con,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .cta-form-band-section > .container.cta-form-band-grid {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 32px !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .cta-band-left,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .cta-band-right {
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 auto !important;
  }
}

/* <=850px: go bo rule desktop !important (policy 2col / claim 3col) de xep chong nhu mau. */
@media (max-width: 600px) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-estimate-field {
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-estimate-field :is(input[type="number"], select) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .consult-card-white .consult-form .form-row-2col {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .consult-card-white {
    min-width: 0 !important;
    padding: 24px !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .cta-band-left .section-title {
    font-size: clamp(2rem, 7vw, 3rem) !important;
    line-height: 1.15 !important;
    max-width: none !important;
  }
}

/* Tablet warehouse policy and claim cards stack below 850px. */
@media (max-width: 850px) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-policy-heading {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    align-items: start !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(1),
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(2),
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(3),
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy > :nth-child(4) {
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: start !important;
    width: 100% !important;
    margin-top: 0 !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading.e-con {
    grid-template-columns: minmax(0, 1fr) !important;
    row-gap: 8px !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-sheet-heading.e-con > :nth-child(3) {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-self: start !important;
  }
}

/* Tablet 601-768px: giu 2 cols (ke thua rule <=1024). Hub column, quicklinks 2 cols.
   Mobile 1 cot chuyen xuong block <=600px. */
@media (max-width: 768px) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-card.e-con {
    width: 100% !important;
    max-width: 100% !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 14px !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-left.e-con,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-dark-hub-right.e-con {
    align-items: flex-start !important;
    text-align: left !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-warehouse-cards-grid {
    overflow-x: auto !important;
  }
}

/* Mobile <=600px: TAT CA khoi cards 1 cot (stats/steps/quicklinks/packaging/
   claim/form). Yeu cau user: tablet 2 cot, mobile 1 cot. */
@media (max-width: 600px) {
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-stats-bars-row,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-steps-grid,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-grid,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-quicklinks-section:not(.is-compact) .ff-quicklinks-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment #bang-gia-fulfillment #fulfillment-cost .ff-packaging-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-estimator-form,
  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-package-options {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-claim-policy {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 22px !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-price-body .ff-price-row {
    column-gap: 12px !important;
  }

  body:not(.elementor-editor-active) .elementor .page-fulfillment .ff-price-row > strong {
    white-space: normal !important;
  }
}