.cta-wrapper {
      position: fixed;
      bottom: 2vh;
      right: 30px;
      z-index: 9999;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
    }

    .cta-wrapper > .cta-toggle-checkbox {
      display: none;
    }

    .cta-wrapper > .cta-menu {
      width: 260px;
      margin-bottom: 20px;
      opacity: 0;
      pointer-events: none;
      transform: translateY(30px);
      transition: opacity 0.3s ease, transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
      position: relative;
      filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.15));
    }

    /* Mũi tên chỉ xuống */
    .cta-wrapper > .cta-menu::after {
      content: '';
      position: absolute;
      bottom: -10px;
      right: 20px; /* Canh giữa với cục tròn 60px */
      border-width: 10px 10px 0;
      border-style: solid;
      border-color: #ffffff transparent transparent transparent;
    }

    /* Danh sách các nút bên trong box */
    .cta-wrapper > .cta-menu > .cta-menu-list {
      background: #ffffff;
      border-radius: 12px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }

    .cta-wrapper > .cta-menu > .cta-menu-list > .cta-item {
      display: flex;
      align-items: center;
      padding: 14px 20px;
      text-decoration: none;
      color: #333333;
      font-size: 15px;
      font-weight: 500;
      border-bottom: 1px solid #f0f0f0;
      transition: background-color 0.2s ease;
    }

    .cta-wrapper > .cta-menu > .cta-menu-list > .cta-item:last-child {
      border-bottom: none;
    }

    .cta-wrapper > .cta-menu > .cta-menu-list > .cta-item:hover {
      background-color: #e8f1f8; /* Màu nền xanh nhạt khi hover */
    }

    /* Icon Gradient bên trong danh sách */
    .cta-wrapper > .cta-menu > .cta-menu-list > .cta-item > .icon-circle {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: linear-gradient(135deg, #055cbe, #034694);
      display: flex;
      justify-content: center;
      align-items: center;
      margin-right: 15px;
      color: #ffffff;
      flex-shrink: 0;
    }

    .cta-wrapper > .cta-menu > .cta-menu-list > .cta-item > .icon-circle svg {
      width: 20px;
      height: 20px;
    }

    /* KHI CHECKBOX ĐƯỢC CHECK -> HIỆN BOX THÔNG TIN */
    .cta-wrapper > .cta-toggle-checkbox:checked ~ .cta-menu {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
    }

    /* CỤC TRÒN NÚT BẤM (Nằm bên dưới) */
    .cta-wrapper > .cta-button {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      background: linear-gradient(135deg, #055cbe, #034694);
      box-shadow: 0 4px 15px rgba(3, 70, 148, 0.4);
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
      position: relative;
      color: #ffffff;
      z-index: 10;
      transition: background 0.3s ease;
    }

    /* Hiệu ứng sóng lan tỏa (Pulse Ring) bên ngoài nút tròn */
    .cta-wrapper > .cta-button::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      border-radius: 50%;
      border: 2px solid #034694;
      animation: pulse-ring 2s infinite ease-out;
      z-index: -1;
    }

    @keyframes pulse-ring {
      0% { transform: scale(1); opacity: 0.8; }
      100% { transform: scale(1.6); opacity: 0; }
    }

    .cta-wrapper > .cta-toggle-checkbox:checked ~ .cta-button::before {
      display: none;
      animation: none;
    }

    .cta-wrapper > .cta-button > .icon-wrapper {
      position: absolute;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
    }

    .cta-wrapper > .cta-button > .icon-wrapper svg {
      width: 26px;
      height: 26px;
    }

    .cta-wrapper > .cta-button > .icon-phone {
      opacity: 1;
      transform: rotate(0) scale(1);
      /* Ring animation */
      animation: shake-ring 2.5s infinite;
    }

    @keyframes shake-ring {
      0%, 15% { transform: rotate(0deg); }
      20% { transform: rotate(-20deg); }
      25% { transform: rotate(20deg); }
      30% { transform: rotate(-20deg); }
      35% { transform: rotate(20deg); }
      40% { transform: rotate(-20deg); }
      45%, 100% { transform: rotate(0deg); }
    }

    .cta-wrapper > .cta-button > .icon-close {
      opacity: 0;
      transform: rotate(-90deg) scale(0.5);
    }

    .cta-wrapper > .cta-toggle-checkbox:checked ~ .cta-button > .icon-phone {
      opacity: 0;
      transform: rotate(90deg) scale(0.5);
      animation: none; /* Dừng rung khi ẩn */
    }

    .cta-wrapper > .cta-toggle-checkbox:checked ~ .cta-button > .icon-close {
      opacity: 1;
      transform: rotate(0) scale(1);
    }