/* ================= DESKTOP ONLY ================= */


@media (min-width: 768px){
  .aus-hero-wrap-des{
    position: relative;
    overflow: visible !important;

    --gap-bottom-des: 0px;

    /* ✅ FLAG ÚC: full width theo background */
    --flag-left-des: 0;
    --flag-w-des: 100%;

    /* ✅ chỉnh chiều cao + độ mờ */
    --aus-flag-y-scale-des: 0.6;  /* chiều cao lá cờ  */
    --aus-flag-opacity-des: 0.6;   /* độ mờ lá cờ */

    /* Quốc huy (giống Liberty) */
    --coa-w-des: 22vw;
    --coa-left-des: 6vw;

    --hero-top-gap-des: 60px;
    padding-top: var(--hero-top-gap-des) !important;
  }

  .aus-hero-wrap-des .aus-hero{
    position: relative;
    overflow: visible !important;
    -webkit-clip-path:none !important; clip-path:none !important;
    -webkit-mask-image:none !important; mask-image:none !important;
  }

  /* ===== 2 ảnh đứng cùng cấp banner, neo vào đáy banner ===== */
  .aus-hero-wrap-des .BG-aus-flag-destop,
  .aus-hero-wrap-des .BG-COA-aus-destop{
    position: absolute !important;
    top: calc(var(--banner-top-des, 0px) + var(--banner-h-des, 0px));
    left: 0;
    height: auto !important;
    max-width: none !important;
    pointer-events: none;
    will-change: transform, opacity;
  }

  /* ✅ FLAG ÚC: full width + trồi lên + scaleY + mờ 20% */
  .aus-hero-wrap-des .BG-aus-flag-destop{
    z-index: 2;
    left: var(--flag-left-des);
    width: var(--flag-w-des) !important;

    opacity: 0;
    --slideY: 26px;

    transform:
      translateY(calc(-100% + var(--gap-bottom-des,0)))
      translateY(var(--slideY,0))
      scaleY(var(--aus-flag-y-scale-des, 0.82)) !important;

    transform-origin: left bottom;
    transition: opacity .6s ease, transform 900ms cubic-bezier(.3,0,.2,1);
  }

  /* ✅ QUỐC HUY ÚC: chạy ngang giống USA */
  .aus-hero-wrap-des .BG-COA-aus-destop{
    z-index: 3;
    left: var(--coa-left-des);
    width: var(--coa-w-des) !important;

    opacity: 0;
    --slideX: -60vw;

    transform:
      translateY(calc(-100% + var(--gap-bottom-des,0)))
      translateX(var(--slideX,0)) !important;

    transition: transform 1000ms cubic-bezier(.3,0,.2,1), opacity .6s ease;
  }

  /* ===== Trạng thái IN/OUT ===== */
  .aus-hero-wrap-des.is-active .BG-aus-flag-destop{
    opacity: var(--aus-flag-opacity-des, 0.8);
    --slideY: 0;
  }
  .aus-hero-wrap-des.is-active .BG-COA-aus-destop{
    opacity: 1;
    --slideX: 0;
  }

  .aus-hero-wrap-des.is-out .BG-aus-flag-destop{
    opacity: 0;
    --slideY: 40px;
  }
  .aus-hero-wrap-des.is-out .BG-COA-aus-destop{
    opacity: 0;
    --slideX: 100vw;
  }

  /* Reset tức thời để lần sau luôn “vào lại mượt” */
  .aus-hero-wrap-des.no-anim .BG-aus-flag-destop,
  .aus-hero-wrap-des.no-anim .BG-COA-aus-destop{
    transition:none !important;
  }

  .aus-hero-wrap-des.reset-left .BG-aus-flag-destop{
    opacity: 0;
    --slideY: 40px;
  }
  .aus-hero-wrap-des.reset-left .BG-COA-aus-destop{
    opacity: 0;
    --slideX: -60vw;
  }

  /* Text overlay */
  .aus-hero-wrap-des .aus-text-destop{
    position: absolute;
    z-index: 50;
    left: 50%;
    top: calc(var(--banner-top-des,0px) + var(--banner-h-des,0px)*0.5);
    transform: translate(-50%, -50%);
    text-align: center;
    pointer-events: auto;
    font-size: clamp(20px, 7vw, 36px);
    line-height: 1.1;
  }
}



/* ===================================================== */
/* Mở overflow cho các wrapper Flatsome thường gặp (đổi .usa-hero -> .aus-hero) */
.section.aus-hero, .banner.aus-hero,
.section.aus-hero > .section-content, .banner.aus-hero > .banner-inner,
.section.aus-hero > .ux-section-content, .banner.aus-hero > .banner-layers,
.section.aus-hero > .bg, .banner.aus-hero > .banner-inner > .bg,
.aus-hero .row,
.aus-hero .col,
.aus-hero .col-inner,
.aus-hero .banner,
.aus-hero .banner-inner,
.aus-hero .ux-img,
.aus-hero .ux-image,
.aus-hero figure,
.aus-hero .image-tools,
.aus-hero .image-cover,
.aus-hero .ux-builder-block,
.aus-hero [data-ll-status],
.aus-hero .litespeed_lazywrapper,
.aus-hero .lazyload,
.aus-hero .ls-blur-up-img,
.aus-hero .ls-is-cached {
  overflow: visible !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}


/* ===== MOBILE ONLY (<=767px) ===== */
@media (max-width: 767px){
  .aus-hero-wrap{
    /* ✅ FLAG ÚC: full width theo background */
    --flag-w: 100vw;
    --flag-left: 0vw;

    /* ✅ chỉnh chiều cao + độ mờ */
    --aus-flag-y-scale-mb: 0.6;  /* giảm chiều cao (0.7–0.9) */
    --aus-flag-opacity-mb: 0.8;   /* mờ 20% */

    /* Quốc huy (giống USA) */
    --coa-w: 45vw;
    --coa-left: 2vw;

    --gap-bottom: 0px;
    --hero-top-gap-mb: 20px;
    padding-top: var(--hero-top-gap-mb) !important;
  }

  /* Neo theo đáy banner */
  .aus-hero-wrap .BG-aus-flag-mobile,
  .aus-hero-wrap .BG-COA-aus-mobile{
    position:absolute !important;
    top: calc(var(--banner-top,0px) + var(--banner-h,0px));
    left:0;
    height:auto !important;
    max-width:none !important;
    pointer-events:none;
    will-change: transform, opacity;
  }

  /* ✅ FLAG ÚC: trồi lên từ dưới + scaleY + mờ 20% */
  .aus-hero-wrap .BG-aus-flag-mobile{
    z-index:2;
    left: var(--flag-left);
    width: var(--flag-w) !important;

    opacity:0;
    --slideY: 22px;

    transform:
      translateY(calc(-100% + var(--gap-bottom,0)))
      translateY(var(--slideY,0))
      scaleY(var(--aus-flag-y-scale-mb, 0.84)) !important;

    transform-origin: left bottom;
    transition: opacity .6s ease, transform 900ms cubic-bezier(.3,0,.2,1);
  }

  /* ✅ QUỐC HUY ÚC: chạy ngang như USA */
  .aus-hero-wrap .BG-COA-aus-mobile{
    z-index:3;
    left: var(--coa-left);
    width: var(--coa-w) !important;

    opacity:0;
    --slideX:-60vw;

    transform:
      translateY(calc(-100% + var(--gap-bottom,0)))
      translateX(var(--slideX,0)) !important;

    transition: transform 1000ms cubic-bezier(.3,0,.2,1), opacity .6s ease;
  }

  /* ===== Trạng thái IN/OUT ===== */
  .aus-hero-wrap.is-active .BG-aus-flag-mobile{
    opacity: var(--aus-flag-opacity-mb, 0.8);
    --slideY: 0;
  }
  .aus-hero-wrap.is-active .BG-COA-aus-mobile{
    opacity: 1;
    --slideX: 0;
  }

  .aus-hero-wrap.is-out .BG-aus-flag-mobile{
    opacity:0;
    --slideY: 34px;
  }
  .aus-hero-wrap.is-out .BG-COA-aus-mobile{
    opacity:0;
    --slideX:100vw;
  }

  /* RESET để lần sau lại vào mượt */
  .aus-hero-wrap.reset-left .BG-aus-flag-mobile{
    opacity:0;
    --slideY: 34px;
  }
  .aus-hero-wrap.reset-left .BG-COA-aus-mobile{
    opacity:0;
    --slideX:-60vw;
  }

  /* Cho phép reset tức thời (không animate) */
  .aus-hero-wrap.no-anim .BG-aus-flag-mobile,
  .aus-hero-wrap.no-anim .BG-COA-aus-mobile{
    transition: none !important;
  }

  /* Text overlay giữa banner */
  .aus-hero-wrap .aus-text-mobile{
    position:absolute; z-index:50; left:50%;
    top: calc(var(--banner-top,0px) + var(--banner-h,0px) * 0.5);
    transform: translate(-50%, -50%);
    text-align:center; pointer-events:auto;
    font-size: clamp(20px, 7vw, 36px);
    line-height: 1.1;
  }
}


/* =========================
   AUS Tooltip (DESKTOP)
   (giống USA Tooltip desktop)
========================= */
.aus-hero-wrap-des .aus-coa-tip{
  position: absolute;
  z-index: 999999;
  left: var(--coa-cx, 0px);
  top:  calc(var(--coa-bottom, 0px) + 10px);

  transform: translate(-50%, 0);
  opacity: 0;
  pointer-events: none;
}

/* hiện khi COA dừng */
.aus-hero-wrap-des.coa-stopped .aus-coa-tip{
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.aus-hero-wrap-des .aus-coa-tip .bubble{
  position: relative;
  background: #1e4f86;
  color: #fff;
  border: 2px solid #000;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
}
.aus-hero-wrap-des .aus-coa-tip .bubble::after{
  content:"";
  position:absolute;
  left: 50%;
  top: -10px;
  transform: translateX(-50%);
  width:0;height:0;
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-bottom:10px solid #1e4f86;
  filter: drop-shadow(0 -2px 0 #000);
}


/* =========================
   AUS Tooltip (MOBILE)
   (giống USA Tooltip mobile)
========================= */
.aus-coa-tip-mb{
  position: fixed;
  z-index: 99; /* tăng cao hơn 99 để khỏi bị đè */
  left: 0;
  top: 0;

  /* ✅ dùng dịch chuyển do JS tính */
  transform: translate(var(--tip-tx, -50%), 0);
  opacity: 0;
  pointer-events: none;

  /* ✅ giới hạn bề ngang để không tràn */
  max-width: min(92vw, 360px);
}

.aus-coa-tip-mb.is-show{ opacity: 1; }

.aus-coa-tip-mb .bubble{
  position: relative;
  background: #1e4f86;
  color: #fff;
  border: 2px solid #000;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);

  max-width: 100%;
  overflow: visible !important;
  text-overflow: ellipsis;
}

/* ✅ mũi tên: vị trí theo biến --arrow-x */
.aus-coa-tip-mb .bubble::after{
  content:"";
  position:absolute;
  left: var(--arrow-x, 50%);
  top: -10px;
  transform: translateX(-50%);
  width:0;height:0;
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-bottom:10px solid #1e4f86;
  filter: drop-shadow(0 -2px 0 #000);
}