/* ===== template-parts/components/button/assets/styles.css ===== */
/* Component: Button */
.tt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--tt-font);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.01rem;
    text-transform: uppercase;
    /* Figma node I2348:26861;2348:27241 (Size=L, Primary): KHÔNG bo góc (radius 0) — không tự chế 0.5rem. */
    border-radius: 0;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.tt-btn__label {
    display: block;
}

.tt-btn__icon {
    display: block;
    width: 1rem;
    height: 1rem;
    margin-left: 0.5rem;
}

/* Icon đơn sắc: trên nút Primary (nền cam) phải đổi sang TRẮNG — icon gốc màu cam sẽ vô hình.
   filter brightness(0) invert(1) = trắng tinh bất kể màu nguồn. Outline giữ màu gốc (cam). */
.tt-btn--primary .tt-btn__icon {
    filter: brightness(0) invert(1);
}

.tt-btn--xl {
    padding: 1rem 4rem;
}

.tt-btn--l {
    padding: 0.75rem 1.5rem;
}

/* Figma Primary button fill = #fa6900 (orange-accent), không phải #f15a29. */
.tt-btn--primary {
    background: var(--tt-orange-accent);
    color: var(--tt-white);
}

.tt-btn--primary:hover {
    background: #FF7B1C;
}

.tt-btn--outline {
    background: transparent;
    color: var(--tt-orange-accent);
    border: 1px solid var(--tt-orange-accent);
}

.tt-btn--outline:hover {
    background: var(--tt-orange-accent);
    color: var(--tt-white);
}

@media (prefers-reduced-motion: reduce) {
    .tt-btn {
        transition: none;
    }
}

/* Mobile: button label font nhỏ hơn desktop (node I2348:27462;2348:36951 / I2348:27463;2348:36960: 14px/18.2px, ls -0.14px). */
/* Padding mobile = desktop (0.75rem 1.5rem) — không thay đổi. */
@media screen and (max-width: 639.98px) {
    .tt-btn {
        font-size: 0.875rem;
        line-height: 1.1375rem;
        letter-spacing: -0.0088rem;
        height: 2.63rem;
    }
}


/* ===== template-parts/cong-ty-thanh-vien/section-banner/assets/styles.css ===== */
/* Section: Banner (hero) — Công ty thành viên (node 2348:30360, 1600×678) */
.ctv-banner {
  position: relative;
  width: 100%;
  height: 42.375rem;
  overflow: hidden;
  font-family: var(--tt-font);
}

@media (min-width: 1024px) {
  .ctv-banner {
    height: calc(100vh - 7rem);
  }
  .ctv-banner__content {
    padding-bottom: 5rem !important;
  }
}

.ctv-banner__bg,
.ctv-banner__overlay {
  position: absolute;
  inset: 0;
}

.ctv-banner__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Overlay đo node 2348:30363 */
.ctv-banner__overlay {
  background: linear-gradient(
    180deg,
    rgba(3, 13, 39, 0.07) 0%,
    rgba(4, 18, 50, 0.7) 100%
  );
}

/* Container 2348:30364 abs {left:0; bottom:0}, padding [2.5, 6.25] */
.ctv-banner__content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 2.5rem 6.25rem;
}

.ctv-banner__lead {
  display: flex;
  flex-direction: column;
}

.ctv-banner__breadcrumb {
  display: flex;
  align-items: center;
  margin-bottom: 1.25rem;
}

.ctv-banner__crumb {
  display: inline-block;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5rem;
  color: rgba(255, 255, 255, 0.8);

  color: var(--Neutral-01, #b8b8b8);
  text-align: justify;

  /* PC/Body/16/16-R-150 */
  font-family: "Lexend Deca";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 1.5rem */
  letter-spacing: -0.02rem;
}

.ctv-banner__crumb--current {
  color: var(--tt-white);
  color: var(--Body-White-100, #fff);
  text-align: justify;

  /* PC/Body/16/16-R-150 */
  font-family: "Lexend Deca";
  margin-left: 0.62rem;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 1.5rem */
  letter-spacing: -0.02rem;
}

/* h1 — node 2348:30368 */
.ctv-banner__title {
  font-weight: 600;
  font-size: 3.0625rem;
  max-width: 29.44rem;
  line-height: 3.9812rem;
  letter-spacing: -0.0919rem;
  text-transform: uppercase;
  color: var(--tt-white);
  margin-top: 1.5rem;
}

/* Subtitle — node 2348:30370, 23.6875rem */
.ctv-banner__desc {
  width: 23.6875rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
  letter-spacing: -0.02rem;
  color: rgba(255, 255, 255, 0.8);

  color: var(--Body-White-80, rgba(255, 255, 255, 0.8));

  /* PC/Body/16/16-R-150 */
  font-family: "Lexend Deca";
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%; /* 1.5rem */
  letter-spacing: -0.02rem;
}

/* ===== MOBILE (node MB 2348:30741, 375×500) — nền trắng, chữ đen, ảnh tràn 2 mép dưới text ===== */
@media screen and (max-width: 639.98px) {
  .ctv-banner {
    height: 31.25rem;
    background: var(--tt-white);
  }

  /* Ảnh 27.8125×18.375rem, absolute {left:-2.1875rem; top:12.875rem} — copy nguyên absolute_css 2348:30742 */
  .ctv-banner__bg {
    inset: auto;
    left: -2.1875rem;
    top: 14.875rem;
    width: 27.8125rem;
    height: auto;
  }

  .ctv-banner__overlay {
    display: none;
  }

  /* Text frame absolute {left:0; top:0}, padding [2,1,0,1] (node 2348:30743) */
  .ctv-banner__content {
    top: 0;
    bottom: auto;
    display: block;
    padding: 2rem 1rem 0;
  }

  .ctv-banner__lead {
    display: block;
  }

  /* child_margin 1rem giữa breadcrumb và khối title (2348:30743) */
  .ctv-banner__breadcrumb {
    margin-bottom: 1rem;
  }

  /* Breadcrumbs Black MB — đo I2348:30744;2348:26773/26774 */
  .ctv-banner__crumb {
    font-size: 0.875rem;
    line-height: 1.3125rem;
    letter-spacing: -0.0175rem;
    color: rgba(19, 19, 19, 0.6);
  }

  .ctv-banner__crumb--current {
    color: #131313;
  }

  /* h1 mobile — đo 2348:30746 */
  .ctv-banner__title {
    font-size: 1.5rem;
    line-height: 1.95rem;
    letter-spacing: -0.03rem;
    max-width: 15rem;
    color: var(--tt-heading);
    margin-top: 1.25rem;
  }

  /* desc — đo 2348:30747, margin-top 0.5rem (child_margin 2348:30745) */
  .ctv-banner__desc {
    width: 100%;
    margin-top: 0.5rem;
    font-weight: 300;
    font-size: 0.875rem;
    line-height: 1.3125rem;
    letter-spacing: -0.0175rem;
    text-align: justify;
    color: var(--tt-heading);
    margin-bottom: 0.25rem;
  }

  .ctv-banner__video {
    height: auto;
  }
}


/* ===== template-parts/cong-ty-thanh-vien/section-domestic/assets/styles.css ===== */
/* Section: Trong nước / Domestic — Công ty thành viên (node 2348:30371) */
.ctv-domestic {
    display: flex;
    align-items: stretch;
    width: 100%;
    --ctv-domestic-gutter: 6.25rem;
    padding: 0 var(--ctv-domestic-gutter);
    font-family: var(--tt-font);
}

.ctv-domestic__col {
    flex: 1;
    min-width: 0;
}

/* ---- Left: text + office list ---- */
.ctv-domestic__col--text {
    display: flex;
    flex-direction: column;
}

.ctv-domestic__head {
    width: 33.0625rem;
    max-width: 100%;
}

.ctv-domestic__heading {
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 3.25rem;
    letter-spacing: -0.05rem;
    text-transform: uppercase;
    color: var(--tt-heading);
}

.ctv-domestic__subtitle {
    margin-top: 0.6875rem;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
    color: var(--tt-text);
}

.ctv-domestic__list {
    margin: 2.25rem 0 0;
    padding: 0;
    list-style: none;
    border-bottom: 1px solid var(--tt-stroke);
    border-top: 1px solid var(--tt-stroke);
}

/* Item — padding [1.875, 2, 1.875, 0], divider top #e7e7e7 (node 2348:30377) */
.ctv-domestic__office {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.875rem 2rem 1.875rem 0;
    border-top: 0;
    cursor: pointer;
    width: 100%;
    transition: background 0.25s ease;
}

.ctv-domestic__office + .ctv-domestic__office {
    border-top: 1px solid var(--tt-stroke);
}

/* Active item — gradient cam mờ (node 2348:30378), bg phủ từ mép trái viewport tới hết cột (Figma x=0→800px) */
.ctv-domestic__office.is-active {
  
    background: linear-gradient(90deg, rgba(241, 90, 41, 0.00) 3.74%, rgba(241, 90, 41, 0.06) 19.61%);
}

.ctv-domestic__office-text {
    display: flex;
    flex-direction: column;
}

.ctv-domestic__office-title {
    font-weight: 600;
    font-size: 1.5625rem;
    line-height: 2.0312rem;
    text-transform: uppercase;
    color: var(--tt-heading);
}

.ctv-domestic__office-desc {
    margin-top: 0.625rem;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
    color: var(--tt-text);
}

.ctv-domestic__office.is-active .ctv-domestic__office-title,
.ctv-domestic__office.is-active .ctv-domestic__office-desc {
    color: var(--tt-orange-accent);
}

/* Chevron 2.125rem — mask đổi màu: inactive navy #0e265e (đo I2348:30388), active cam #fa6900 (đo I2348:30382) */
.ctv-domestic__office-icon {
    flex-shrink: 0;
    display: block;
    width: 2.125rem;
    height: 2.125rem;
    margin-left: 1.25rem;
    background-color: var(--tt-navy);
    -webkit-mask: url("https://vinatechgroup.vn/wp-content/themes/okhub-theme/assets/images/cong-ty-thanh-vien/ic-chevron-right.svg") no-repeat center / contain;
    mask: url("https://vinatechgroup.vn/wp-content/themes/okhub-theme/assets/images/cong-ty-thanh-vien/ic-chevron-right.svg") no-repeat center / contain;
    transition: background-color 0.25s ease;
}

.ctv-domestic__office.is-active .ctv-domestic__office-icon {
    background-color: var(--tt-orange-accent);
}

/* ---- Right: media + map button ---- */
.ctv-domestic__col--media {
    position: relative;
    overflow: hidden;
}

.ctv-domestic__media-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Button bar bottom — bg #f2f3f5 (node 2348:30398), padding 1rem */
.ctv-domestic__map {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--tt-gray-bar);
    padding: 1rem;
}

.ctv-domestic__map-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ctv-domestic__map-label {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.3rem;
    text-transform: uppercase;
    color: var(--tt-navy);
}

.ctv-domestic__map-icon {
    width: 1.25rem;
    height: 1.25rem;
}

/* Mobile accordion media — ẩn ở desktop (desktop dùng cột phải swap ảnh) */
.ctv-domestic__office-media {
    display: none;
}

/* ===== MOBILE (node MB 2348:30748, 375×842) — accordion 3 trụ sở ===== */
@media screen and (max-width: 639.98px) {
    .ctv-domestic {
        --ctv-domestic-gutter: 0rem;
        flex-direction: column;
        padding: 3rem 0;
    }

    /* Cột phải desktop (ảnh + nút map) — mobile dùng media inline trong từng item */
    .ctv-domestic__col--media {
        display: none;
    }

    /* Head padding ngang 1rem (node 2348:30749) */
    .ctv-domestic__head {
        width: 100%;
        padding: 0 1rem;
    }

    /* h2 — đo 2348:30750 */
    .ctv-domestic__heading {
        font-size: 1.25rem;
        line-height: 2rem;
        letter-spacing: -0.0375rem;
        max-width: 15rem;
    }

    /* subtitle — đo 2348:30751 */
    .ctv-domestic__subtitle {
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: -0.0175rem;
        color: rgba(19, 19, 19, 0.8);
    }

    /* child_margin section 1.5rem (2348:30748) */
    .ctv-domestic__list {
        margin-top: 1.5rem;
    }

    /* Item — padding [1.25,1] (node 2348:30754/30767/30773), icon arrow-down absolute góc phải */
    .ctv-domestic__office {
        position: relative;
        display: block;
        min-height: 7.88rem;
        padding: 1.25rem 1rem;
        border-top: 1px solid var(--tt-stroke);
    }

    /* Active: bg cam phẳng rgba(241,90,41,.06) — đo 2348:30754 (không gradient như desktop) */
    .ctv-domestic__office.is-active {
        background: rgba(241, 90, 41, 0.06);
        margin-left: 0;
        padding-left: 1rem;
    }

    /* Header row: title (chừa chỗ icon) — icon 1.25rem (node 2348:30757) */
    .ctv-domestic__office-title {
        padding-right: 1.875rem;
        font-size: 1rem;
        line-height: 1.4rem;
        max-width: 20.14rem;
    }

    /* SVG export tu instance item DANG MO (chevron-up) -> dong = xoay 180 (v), mo = nguyen (^) */
    .ctv-domestic__office-icon {
        position: absolute;
        top: 1.25rem;
        right: 1rem;
        width: 1.25rem;
        height: 1.25rem;
        margin-left: 0;
        background-color: var(--tt-heading);
        -webkit-mask: url("https://vinatechgroup.vn/wp-content/themes/okhub-theme/assets/images/cong-ty-thanh-vien/ic-arrow-down.svg") no-repeat center / contain;
        mask: url("https://vinatechgroup.vn/wp-content/themes/okhub-theme/assets/images/cong-ty-thanh-vien/ic-arrow-down.svg") no-repeat center / contain;
        transform: rotate(180deg);
        transition: background-color 0.25s ease, transform 0.25s ease;
    }

    .ctv-domestic__office.is-active .ctv-domestic__office-icon {
        transform: none;
    }

    /* desc — đo 2348:30758 (active cam đã có rule chung), child_margin 0.625rem */
    .ctv-domestic__office-desc {
        margin-top: 0.625rem;
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: 0;
    }

    /* Media trong item active — container 21.4375×14.4375rem (node 2348:30759) */
    .ctv-domestic__office-media {
        display: block;
        position: relative;
        margin-top: 0;
        height: 14.4375rem;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transform: translateY(-0.375rem);
        transition: max-height 0.32s ease, margin-top 0.32s ease, opacity 0.24s ease, transform 0.32s ease;
    }

    .ctv-domestic__office.is-active .ctv-domestic__office-media {
        margin-top: 0.625rem;
        max-height: 14.4375rem;
        opacity: 1;
        transform: translateY(0);
    }

    .ctv-domestic__office-img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Button bar — absolute {left:0;right:0;bottom:0}, bg #fff, padding [0.625,0.75] (node 2348:30761) */
    .ctv-domestic__office-map {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.625rem 0.75rem;
        background: var(--tt-white);
    }

    /* "XEM TRÊN BẢN ĐỒ" — đo 2348:30764 */
    .ctv-domestic__office-map-label {
        font-weight: 600;
        font-size: 0.875rem;
        line-height: 1.1375rem;
        letter-spacing: -0.0088rem;
        text-transform: uppercase;
        color: var(--tt-navy);
    }

    .ctv-domestic__office-map-icon {
        width: 1rem;
        height: 1rem;
    }
}


/* ===== template-parts/cong-ty-thanh-vien/section-global/assets/styles.css ===== */
/* Section: Global / International — Công ty thành viên (node 2348:30403) */
.ctv-global {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 6.25rem;
    font-family: var(--tt-font);
}

/* Top heading — center (node 2348:30404) */
.ctv-global__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.ctv-global__heading {
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 3.25rem;
    letter-spacing: -0.05rem;
    text-transform: uppercase;
    color: var(--tt-heading);
}

.ctv-global__subtitle {
    margin-top: 1rem;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
    color: var(--tt-text);
}

/* Cards row — margin-left 1.25 giữa 2 card (node 2348:30407) */
.ctv-global__cards {
    display: flex;
    align-items: stretch;
    margin-top: 2rem;
}

.ctv-global__card {
    position: relative;
    flex: 1;
    min-width: 0;
    height: 27.9375rem;
    overflow: hidden;
}

.ctv-global__card + .ctv-global__card {
    margin-left: 1.25rem;
}

.ctv-global__card-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Gradient tối đỉnh → trong suốt đáy (node 2348:30410) */
.ctv-global__card-overlay {
    position: absolute;
    inset: 0;
   background: linear-gradient(180deg, rgba(0, 0, 0, 0.80) 0%, rgba(22, 22, 22, 0.63) 25.08%, rgba(56, 56, 56, 0.36) 37.63%, rgba(102, 102, 102, 0.00) 100%);

}

/* Content top — padding 1.25, heading+text margin-top 0.375 (node 2348:30416) */
.ctv-global__card-top {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 1.25rem;
}

.ctv-global__card-title {
    font-weight: 600;
    font-size: 1.25rem;
    line-height: 1.625rem;
    letter-spacing: -0.0187rem;
    text-transform: uppercase;
    color: var(--tt-white);
}

.ctv-global__card-desc {
    max-width: 30rem; /* text box Figma 27.5rem (AU node 2348:30418) / 29.9375rem (US node 2348:30430) */
    margin-top: 0.375rem;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
    color: var(--tt-white);
}

/* Button bar bottom — bg #f2f3f5, padding 1rem (node 2348:30411) */
.ctv-global__card-map {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--tt-gray-bar);
    padding: 1rem;
}

.ctv-global__map-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ctv-global__map-label {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.3rem;
    text-transform: uppercase;
    color: var(--tt-navy);
}

.ctv-global__map-icon {
    width: 1.25rem;
    height: 1.25rem;
}

/* ===== MOBILE — frame MB 2348:30739 KHÔNG có section Global/International → ẩn (PLAN Phần 2, user duyệt) ===== */
@media screen and (max-width: 639.98px) {
    .ctv-global {
        display: none;
    }
}


/* ===== template-parts/cong-ty-thanh-vien/section-map/assets/styles.css ===== */
/* Section: Map (mạng lưới toàn cầu) — Công ty thành viên (node 2348:30431) */
.ctv-map {
  position: relative;
  width: 100%;
  height: 46.625rem;
  background: var(--tt-gray-bar);
  overflow: hidden;
  font-family: var(--tt-font);
}

/* ---- Network text block (abs left 4.5rem, vertical center) — node 2348:30716 ---- */
.ctv-map__network {
  position: absolute;
  left: 4.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 32.0625rem;
}

/* Heading 1 dòng (node 2348:30718, hug 28.5rem) — nowrap tránh wrap do render lệch subpixel */
.ctv-map__net-heading {
  font-weight: 600;
  font-size: 2.5rem;
  line-height: 3.25rem;
  letter-spacing: -0.05rem;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--tt-heading);
}

/* Text 26.25rem (node 2348:30719) — wrap sau "TP.HCM," như design */
.ctv-map__net-text {
  width: 26.25rem;
  margin-top: 1.25rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
  letter-spacing: -0.02rem;
  color: var(--tt-text);
}

.ctv-map__net-btn {
  margin-top: 2.5rem;
}

.ctv-map__net-btn .tt-btn--primary {
  width: 16.5rem;
  height: 3.5rem;
  padding: 0;
}

/* ---- World map container (abs left 41.1875rem, top 3.9722rem) — node 2348:30432 ---- */
.ctv-map__world {
  position: absolute;
  left: 41.1875rem;
  top: 3.9722rem;
  width: 54.3125rem;
  height: 35.7267rem;
}

.ctv-map__world-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ===== MOBILE (node MB 2348:30779, 375×545) — stack column, map full-bleed ===== */
@media screen and (max-width: 639.98px) {
  /* padding [2.5,1,3.75,1], flow column (không còn absolute) */
  .ctv-map {
    display: flex;
    flex-direction: column;
    height: auto;
    padding: 2.5rem 1rem 3.75rem;
    overflow: visible;
  }

  /* network wrapper tan vào flex cha → net-head / world / net-btn xếp đúng thứ tự design */
  .ctv-map__network {
    display: contents;
  }

  .ctv-map__net-head {
    order: 1;
  }

  .ctv-map__world {
    order: 2;
  }

  .ctv-map__net-btn {
    order: 3;
  }

  /* Heading — đo 2348:30781 (center) */
  .ctv-map__net-heading {
    font-size: 1.25rem;
    line-height: 2rem;
    letter-spacing: -0.0375rem;
    white-space: normal;
    text-align: center;
  }

  /* Text — đo 2348:30782 (center, rgba .8), child_margin 0.625rem (2348:30780) */
  .ctv-map__net-text {
    width: 100%;
    margin-top: 0.625rem;
    font-size: 0.875rem;
    line-height: 1.3125rem;
    letter-spacing: -0.0175rem;
    text-align: center;
    color: rgba(19, 19, 19, 0.8);
  }

  /* Container map 23.4375×15.4172rem full-bleed (tràn padding 1rem) — child_margin section 2.25rem */
  .ctv-map__world {
    position: relative;
    left: auto;
    top: auto;
    width: calc(100% + 2rem);
    margin-left: -1rem;
    margin-right: -1rem;
    margin-top: 2.25rem;
    height: 15.4172rem;
  }

  .ctv-map__world-img {
    object-fit: cover;
  }

  /* Nút "Liên hệ ngay" FILL width (node 2348:31067 sizing_h FILL) */
  .ctv-map__net-btn {
    margin-top: 2.25rem;
  }

  .ctv-map__net-btn .tt-btn {
    width: 100%;
    height: 2.63rem;
  }

}


/* ===== template-parts/cong-ty-thanh-vien/section-why-choose/assets/styles.css ===== */
/* Section: Tại sao chọn / Why Choose — Công ty thành viên (node 2348:30721) */
.ctv-why {
    width: 100%;
    font-family: var(--tt-font);
}

/* ---- Head row: heading trái + tabs phải (node 2348:30723) ---- */
.ctv-why__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0 6.25rem;
}

.ctv-why__heading {
    flex-shrink: 0;
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 3.25rem;
    max-width: 23rem;
    letter-spacing: -0.05rem;
    text-transform: uppercase;
    color: var(--tt-heading);
}

/* Tabs frame 47.5rem, 3 tab FILL (node 2348:30725) */
.ctv-why__tabs {
    display: flex;
    width: 47.5rem;
}

.ctv-why__tab {
    position: relative;
    flex: 1;
    display: block;
    background: transparent;
    padding: 0 0 1rem;
    border-bottom: 1px solid var(--tt-stroke);
    font-family: var(--tt-font);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5rem;
    text-transform: uppercase;
    text-align: center;
    color: var(--tt-heading);
    transition: color 0.25s ease;
}

/* Active: chữ cam + underline cam 0.1875rem (node 2348:30729) */
.ctv-why__tab.is-active {
    color: var(--tt-orange-accent);
}

.ctv-why__tab.is-active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 0.1875rem;
    background: var(--tt-orange-accent);
}

/* ---- Content row (node 2348:30730), margin-top 2.5 ---- */
.ctv-why__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2.5rem;
    padding: 0 6.25rem;
}

.ctv-why__panels {
    flex: 1;
    max-width: 41rem;
}

.ctv-why__panel {
    display: none;
}

.ctv-why__panel.is-active {
    display: block;
}

.ctv-why__panel-title {
    font-weight: 600;
    font-size: 1.5625rem;
    line-height: 2.0312rem;
    text-transform: uppercase;
    color: var(--tt-heading);
}

.ctv-why__panel-text {
    margin-top: 1rem;
    width: 34.375rem;
    max-width: 100%;
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
    color: var(--tt-text);
}

.ctv-why__btn {
    margin-top: 3rem;
}

/* Outline button: arrow cam → trắng khi hover (đảo màu nền) */
.ctv-why__btn .tt-btn--outline:hover .tt-btn__icon {
    filter: brightness(0) invert(1);
}

/* ---- Media right 47.5×27.375 (node 2348:30737) ---- */
.ctv-why__media {
    flex-shrink: 0;
    width: 47.5rem;
    height: 27.375rem;
    overflow: hidden;
}

.ctv-why__media-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ===== MOBILE (node MB 2348:31068, 375×623) — tabs cuộn ngang, ảnh full-bleed trên content ===== */
@media screen and (max-width: 639.98px) {
    .ctv-why {
        padding: 3rem 0;
    }

    /* Head: heading trên, tabs dưới (column) — heading padding ngang 0.75rem (node 2348:31070) */
    .ctv-why__head {
        display: block;
        padding: 0;
    }

    .ctv-why__heading {
        padding: 0 0.75rem;
        font-size: 1.25rem;
        line-height: 2rem;
        letter-spacing: -0.0375rem;
    }

    /* Design mobile heading 1 dong (node 2348:31071) — bo line-break cua content desktop */
    .ctv-why__heading br {
        display: none;
    }

    /* Tabs cuộn ngang — tổng width 3 tab ≈ 27.3rem > khung (tab 3 bị cắt trong design) */
    .ctv-why__tabs {
        position: relative;
        width: auto;
        margin-top: 1.5rem;
       margin-right: 1rem;
        margin-left: 1rem;
        overflow-x: auto;
        border-bottom: none;
        box-shadow: inset 0 -1px 0 var(--tt-stroke);
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .ctv-why__tabs::before {
        content: none;
    }

    .ctv-why__tabs::-webkit-scrollbar {
        display: none;
    }

    /* TAB HUG, padding [0.75,0,1,0], margin-left 0.9375rem giữa tab — đo I2348:31074 (0.75rem/500) */
    .ctv-why__tab {
        flex: 0 0 auto;
        padding: 0.75rem  0rem;
        border-bottom: none;
        z-index: 1;
        font-size: 0.75rem;
        line-height: 1.125rem;
        letter-spacing: -0.0112rem;
        white-space: nowrap;
    }

    .ctv-why__tab.is-active::after {
        bottom: 0;
        z-index: 2;
    }

    .ctv-why__tab + .ctv-why__tab {
        margin-left: 0.9375rem;
    }

    /* Content: ảnh full-bleed TRÊN, panel dưới (order design: image → content) */
    .ctv-why__content {
        display: flex;
        flex-direction: column;
        margin-top: 1.5rem;
        padding: 0;
    }

    .ctv-why__media {
        order: -1;
        width: 100%;
        height: 13.5rem;
    }

    .ctv-why__panels {
        max-width: 100%;
        margin-top: 1.5rem;
        padding: 0 1rem;
    }

    /* Panel title — đo 2348:31081 */
    .ctv-why__panel-title {
        font-size: 1rem;
        line-height: 1.4rem;
    }

    /* Panel text — đo 2348:31082 (w400, không ls — khác desktop w300) */
    .ctv-why__panel-text {
        width: 100%;
        margin-top: 0.625rem;
        font-weight: 400;
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: 0;
    }

    .ctv-why__btn {
        margin-top: 1.5rem;
    }

    .ctv-why__btn .tt-btn {
        font-size: 0.875rem;
        line-height: 1.1375rem;
        letter-spacing: -0.0088rem;
        height: 2.63rem;
        padding: 0;
        width: 11.69rem;
    }
}


/* ===== template-parts/cong-ty-thanh-vien/assets/styles.css ===== */
/* Trang Công ty thành viên — page tokens + section/component CSS imports (order theo PLAN.md) */
/* LƯU Ý: @import PHẢI đứng đầu file (trước mọi rule khác) — nếu không sẽ bị bỏ qua. */

/* Shared components (reuse) */


/* Sections */






:root {
    --tt-orange: #f15a29;        /* Orange-300 brand */
    --tt-orange-accent: #fa6900; /* button/link/active accent (đo get_node_styles) */
    --tt-orange-600: #FF7B1C;    /* hover đậm */
    --tt-orange-50: #fef0ea;     /* office item active tint */
    --tt-heading: #131313;       /* heading + body text (đo) */
    --tt-text: #131313;
    --tt-navy: #0e265e;          /* chữ nút "Xem trên bản đồ" (đo node 2348:30414) */
    --tt-white: #ffffff;
    --tt-gray-bar: #f2f3f5;      /* nền thanh nút + nền section map (đo 2348:30398/30431) */
    --tt-stroke: #e7e7e7;        /* divider + viền tab (đo 2348:30377/30726) */
    --tt-font: "Lexend Deca", sans-serif;
}

/* Khoảng cách giữa các section = 7.5rem (root child_margin node 2348:30357) */
.ctv-domestic,
.ctv-global,
.ctv-map,
.ctv-why {
    margin-top: 7.5rem;
}

/* Section cuối → Footer: 7.5rem */
.ctv-why {
    margin-bottom: 7.5rem;
}

/* ===== MOBILE (frame MB 2348:30739) — sections nối liền bằng padding riêng, không margin ===== */
@media screen and (max-width: 639.98px) {
    .ctv-domestic,
    .ctv-global,
    .ctv-map,
    .ctv-why {
        margin-top: 0;
    }

    .ctv-why {
        margin-bottom: 0;
    }
}

/* Tôn trọng reduced motion */
@media (prefers-reduced-motion: reduce) {
    .ctv-domestic__office,
    .ctv-domestic__office-icon,
    .ctv-domestic__office-media,
    .ctv-why__tab {
        transition: none;
    }
}