* {
    -webkit-tap-highlight-color: transparent;
  }

  body {
    overflow-y: auto !important;
    position: relative;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    height: 100%;
  }

  html, body {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    height: 100%;
  }

  /* Logo */
  .logo-bg {
    position: absolute !important;
    top: 10px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 150px !important;
    height: 150px !important;
  }

  /* Fullscreen background */
  .logo-bg2 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    z-index: -1 !important;
  }

  /* Mobile buttons */
  .mobile-buttons {
    margin-top: 200px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 5px !important;
  }

  /* Dropdown styles */
  .dropdown2 {
  position: relative;
  display: inline-block;
  margin-top: 10px;
  left: 30%;
  }
  .dropdown{
  position: fixed;
  display: block;
  margin-top: 10px;
  left: 0%;
  }
  .dropdown-button{
    background-color: red;
  color: white;
  padding: 10px 30px;
  cursor: pointer;
  border: none;
  position: relative;
  display: inline-block;
  margin-top: 0px;
  border-radius: 6px;
}
  .dropdown2-button {
  background-color: red;
  color: white;
  padding: 10px 30px;
  cursor: pointer;
  border: none;
  position: relative;
  display: inline-block;
  margin-top: 0px;
  border-radius: 6px;
  }

  /* Dropdown container styles */
  .container,
  .container2 {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 100% !important;
    background-color: black !important;
    z-index: 999 !important;
    display: none !important;
    text-align: center !important;
  }

  .container ul,
  .container2 ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Hover dropdown open */
  .dropdown:hover .container,
  .dropdown2:hover .container2 {
    display:  !important;
  }

  /* Billing options */
  .billing-options {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
    margin-bottom: 0px;
    z-index: 5;
    flex-wrap: wrap;
  }

  .billing-options a {
    color: white;
    font-size: 18px;
    text-decoration: none;
    font-family: Georgia, serif;
    border-bottom: 2px solid transparent;
    padding-bottom: 10px;
    transition: all 0.2s ease;
    z-index: 6;
  }

  .billing-options a:hover {
    color: yellow;
    border-bottom: 2px solid yellow;
    cursor: pointer;
  }

  .billing-options a.active {
    color: yellow;
    border-bottom: 2px solid yellow;
    font-weight: bold;
  }

  /* Product info blocks */
  .productinfo,
  .productinfo2 {
    background-color: black;
    padding: 20px 40px;
    border: 1px solid black;
    border-radius: 10px;
    z-index: 2;
    margin-top: 20px;
    width: 100%;
    box-sizing: border-box;
    max-width: 1000px;
  }

  .productinfo2 {
    font-size: 22px;
  }

  .productinfo p,
  .productinfo2 p {
    color: white;
    font-family: 'Georgia', serif;
    font-size: 22px;
    line-height: 1.6;
    text-align: center;
    word-wrap: break-word;
    margin: 0 auto;
  }

  .productinfo h1,
  .productinfo2 h1 {
    color: white;
    font-family: 'Georgia', serif;
    font-size: 25px;
    line-height: 1.6;
    text-align: center;
    word-wrap: break-word;
    margin: 0 auto;
  }

  /* Packages */
  .packages {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    margin-top: 75px;
    z-index: 2;
    position: relative;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
  }

  .package,
  .package2 {
    background-color: black;
    border: 1px solid white;
    border-radius: 10px;
    padding: 20px;
    width: 280px;
    text-align: center;
    box-sizing: border-box;
    margin-bottom: 20px;
  }

  .package2 {
    width: 880px;
  }

  .package2 p {
    color: red;
    font-size: 30px;
    max-width: 1000px;
  }

  .package li,
  .package2 li {
    color: red;
    font-size: 20px;
    text-align: left;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .package2 li {
    font-size: 25px;
    word-wrap: break-word;
    max-width: 700px;
  }

  /* Links inside packages */
  .package-link {
    text-decoration: none;
  }

  .package-link:hover .package {
    border-color: yellow;
    transform: scale(1.03);
    transition: transform 0.2s ease;
  }

  /* Page wrapper */

  .page-wrapper {
    all: unset !important;
    display: unset !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }

  

  /* Overlay */
  .button-overlay {
    pointer-events: none !important;
    position: fixed !important;
    height: 100vh !important;
    width: 100% !important;
    overflow: hidden !important;
  }
/* Force dropdown & dropdown2 to align perfectly */
.dropdown,
.dropdown2 {
  position: relative !important;
  display: block !important;
  margin: 10px auto !important;
  width: 100% !important;         /* match exactly */
  max-width: 500px !important;    /* same for both */
  text-align: center !important;
  box-sizing: border-box !important;
  margin-top: 2px !important;
  left: 0px !important;
}

/* Force buttons to match exactly */
.dropdown-button,
.dropdown2-button {
  background-color: red !important;
  color: white !important;
  padding: 15px 40px !important;  /* identical padding */
  cursor: pointer !important;
  border: none !important;
  display: block !important;
  margin: 0 auto !important;
  border-radius: 6px !important;
  font-size: 22px !important;     /* identical text size */
  width: 100% !important;
  box-sizing: border-box !important;
}
/* Match dropdown1 and dropdown2 alignment & keep hover working */
.dropdown,
.dropdown2 {
  position: relative !important;
  display: block !important;
  margin: 10px auto !important;
  width: 100% !important;
  max-width: 500px !important;
  text-align: center !important;
  box-sizing: border-box !important;
  margin-top: 2px !important;
  left: 0px !important;
}

.dropdown-button,
.dropdown2-button {
  background-color: red !important;
  color: white !important;
  padding: 20px 50px !important; /* bigger click area */
  cursor: pointer !important;
  border: none !important;
  display: block !important;
  margin: 0 auto !important;
  border-radius: 6px !important;
  font-size: 26px !important; /* bigger text */
  width: 100% !important;
  max-width: 500px !important; /* same max width */
  box-sizing: border-box !important;
}

/* Fix missing dropdown display on hover */
.dropdown:hover .container,
.dropdown2:hover .container2 {
  display: block !important;
}
.dropdown,
.dropdown2 {
  position: relative !important;
  left: 0 !important; /* reset offsets */
  display: block !important;
  margin: 10px auto !important;
  width: 100% !important;
  max-width: 500px !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.container {
  min-width: 100% !important;
}
/* MOBILE FIX: Center all dropdown buttons */
.dropdown,
.dropdown2 {
  position: relative !important; /* Keep them in normal document flow */
  display: block !important;
  margin: 10px auto !important;   /* Auto margins center them */
  left: 0 !important;             /* Remove forced offsets */
  width: 100% !important;         /* Full width on mobile */
  max-width: 500px !important;    /* Prevent huge buttons */
  text-align: center !important;
  box-sizing: border-box !important;
}

/* Match button styles for both */
.dropdown-button,
.dropdown2-button {
  background-color: red !important;
  color: white !important;
  padding: 15px 40px !important;
  border: none !important;
  display: block !important;
  margin: 0 auto !important;
  border-radius: 6px !important;
  font-size: 22px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Ensure dropdown menus line up and span the full screen width */
.container,
.container2 {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  width: 100% !important;
  background-color: black !important;
  z-index: 999 !important;
  display: none !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

/* Keep hover/tap working */
.dropdown:hover .container,
.dropdown2:hover .container2 {
  display: block !important;
}
/* FINAL OVERRIDE — FORCE CENTERING */
.mobile-buttons .dropdown,
.mobile-buttons .dropdown2 {
  position: relative !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  left: 0 !important;
  right: 0 !important;
  float: none !important;
  width: 100% !important;       /* or set a max-width if you don't want full width */
  max-width: 500px !important;
}
@media (max-width: 766px) {
  .dropdown,
  .dropdown2 {
    display: block !important;
    width: 100vw !important; /* force full viewport width */
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
  }

  .dropdown-button,
  .dropdown2-button {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}

@media (max-width: 1024px) {
  .dropdown,
  .dropdown2 {
    display: block !important;
    width: 100vw !important; /* force full viewport width */
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
  }

  .dropdown-button,
  .dropdown2-button {
    width: 100vw !important;
  }
}

.home-icon {
  position: absolute;
  top: 20px;    /* adjust */
  left: 20px;   /* adjust */
  width: 50px;  /* small size */
  height: 40px;
  background-image: url('home-icon.png');
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 9999; /* above all */
  cursor: pointer;
}