/* BY BARIŞ ORGANİZASYON — V23 MOBILE FINAL PATCH
   Mobile-only corrections: package heading, Instagram removal,
   footer accordion, and fixed horizontal quick-contact bar. */

@media (max-width: 767px) {
  /* 1) Package title/copy must never collide on narrow phones. */
  body.vip-home-page .bb-packages__head {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    align-items: initial !important;
    margin-bottom: 22px !important;
  }
  body.vip-home-page .bb-packages__head > div,
  body.vip-home-page .bb-packages__head > p {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  body.vip-home-page .bb-packages__head h2 {
    max-width: 320px !important;
    margin: 0 !important;
    font-size: clamp(28px, 8.1vw, 34px) !important;
    line-height: 1.06 !important;
    letter-spacing: -0.035em !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
  body.vip-home-page .bb-packages__head > p {
    display: block !important;
    margin: 13px 0 0 !important;
    padding: 0 !important;
    font-size: 12.5px !important;
    line-height: 1.62 !important;
    color: #61747a !important;
  }

  /* 2) Instagram showcase is intentionally desktop/tablet only. */
  body.vip-home-page .bb-instagram,
  body.vip-home-page #instagram {
    display: none !important;
  }

  /* 3) Footer becomes a true mobile accordion. */
  body.vip-site .bb-footer,
  body.vip-site .bb-footer__main {
    background: #061f29 !important;
  }
  body.vip-site .bb-footer__main {
    padding: 34px 0 24px !important;
  }
  body.vip-site .bb-footer__grid {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
  }
  body.vip-site .bb-footer__brand {
    margin: 0 0 8px !important;
    padding: 0 0 24px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
  }
  body.vip-site .bb-footer__brand > a:first-child {
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 12px !important;
    border-radius: 10px !important;
    background: #fff !important;
  }
  body.vip-site .bb-footer__brand > a:first-child img {
    display: block !important;
    width: auto !important;
    max-width: 170px !important;
    max-height: 60px !important;
  }
  body.vip-site .bb-footer__brand p {
    margin: 18px 0 16px !important;
    color: rgba(255,255,255,.76) !important;
    font-size: 12.5px !important;
    line-height: 1.7 !important;
  }
  body.vip-site .bb-footer__socials a {
    color: #fff !important;
    border-color: rgba(255,255,255,.18) !important;
  }
  body.vip-site .bb-footer__col {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
  }
  body.vip-site .bb-footer__toggle {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    cursor: pointer !important;
    text-align: left !important;
  }
  body.vip-site .bb-footer__toggle::before {
    content: "" !important;
    position: static !important;
    display: block !important;
    flex: 0 0 24px !important;
    width: 24px !important;
    height: 1px !important;
    margin: 0 13px 0 0 !important;
    background: #c28d3d !important;
  }
  body.vip-site .bb-footer__toggle > span {
    display: block !important;
    flex: 1 1 auto !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase !important;
  }
  body.vip-site .bb-footer__toggle > i {
    position: relative !important;
    display: block !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 50% !important;
    transform: none !important;
    opacity: 1 !important;
  }
  body.vip-site .bb-footer__toggle > i::before,
  body.vip-site .bb-footer__toggle > i::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 10px;
    height: 1.5px;
    border: 0;
    background: #fff;
    transform: translate(-50%,-50%);
    transition: transform .25s ease, opacity .25s ease;
  }
  body.vip-site .bb-footer__toggle > i::after {
    transform: translate(-50%,-50%) rotate(90deg);
  }
  body.vip-site .bb-footer__toggle[aria-expanded="true"] > i::after {
    transform: translate(-50%,-50%) rotate(0deg);
    opacity: 0;
  }
  body.vip-site .bb-footer__panel {
    display: block !important;
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    padding: 0 !important;
    transition: max-height .34s ease, opacity .24s ease, padding .28s ease !important;
  }
  body.vip-site .bb-footer__col.is-open > .bb-footer__panel {
    max-height: 720px !important;
    opacity: 1 !important;
    padding: 0 0 20px 37px !important;
  }
  body.vip-site .bb-footer__panel ul {
    margin: 0 !important;
    padding: 0 !important;
  }
  body.vip-site .bb-footer__panel li {
    margin: 0 !important;
    padding: 0 !important;
  }
  body.vip-site .bb-footer__panel li + li {
    margin-top: 8px !important;
  }
  body.vip-site .bb-footer__panel li a,
  body.vip-site .bb-footer__contact a,
  body.vip-site .bb-footer__contact > span {
    color: rgba(255,255,255,.82) !important;
    font-size: 12.5px !important;
    line-height: 1.55 !important;
  }
  body.vip-site .bb-footer__contact {
    gap: 12px !important;
  }
  body.vip-site .bb-footer__col--contact.is-open > .bb-footer__panel {
    padding-left: 0 !important;
  }
  body.vip-site .bb-footer__col--contact .bb-footer__contact {
    padding-left: 37px !important;
    padding-right: 8px !important;
  }
  body.vip-site .bb-footer__bottom {
    padding-bottom: 62px !important;
    background: #041922 !important;
  }
  body.vip-site .bb-footer__bottom-row {
    display: block !important;
    padding: 16px 0 !important;
  }
  body.vip-site .bb-footer__bottom-row p {
    margin: 0 !important;
    font-size: 10.5px !important;
    line-height: 1.6 !important;
  }
  body.vip-site .bb-footer__bottom-row p + p {
    margin-top: 5px !important;
    color: #d8a952 !important;
  }

  /* 4) Phone / WhatsApp / Instagram become one fixed horizontal mobile bar. */
  body.vip-site .bb-floating-contact {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 99999 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    width: 100% !important;
    height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    border-top: 1px solid rgba(0,0,0,.10) !important;
    box-shadow: 0 -8px 24px rgba(3,22,31,.16) !important;
    background: #fff !important;
  }
  body.vip-site .bb-floating-contact > .telefon,
  body.vip-site .bb-floating-contact > .whatsapp,
  body.vip-site .bb-floating-contact > .instagram {
    position: static !important;
    display: block !important;
    flex: 1 1 0 !important;
    width: auto !important;
    height: 58px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body.vip-site .bb-floating-contact > .telefon a,
  body.vip-site .bb-floating-contact > .whatsapp a,
  body.vip-site .bb-floating-contact > .instagram a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 58px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #fff !important;
    line-height: 58px !important;
    font-size: 25px !important;
    box-shadow: none !important;
    transform: none !important;
  }
  body.vip-site .bb-floating-contact > .telefon a { background: #2f7fb7 !important; }
  body.vip-site .bb-floating-contact > .whatsapp a { background: #21c86a !important; }
  body.vip-site .bb-floating-contact > .instagram a { background: #ec315e !important; }
  body.vip-site .bb-floating-contact .tooltiptext { display: none !important; }
  body.vip-site .bb-floating-contact i {
    margin: 0 !important;
    color: #fff !important;
  }

  /* Keep page controls above the fixed quick-contact bar. */
  body.vip-site #scrollUp,
  body.vip-site .scroll-top,
  body.vip-site .back-to-top {
    bottom: 72px !important;
  }
}

@media (max-width: 420px) {
  body.vip-home-page .bb-packages__head h2 {
    max-width: 280px !important;
    font-size: 29px !important;
  }
}
