.nav-split a { width: 100%; margin-bottom: 5px; border-bottom: 1px solid #fff; display: inline-block; padding-bottom: 10px !important;}
.mobile-menu ul{ display: inline-block;}

.main-logo{ display: none; }
#header-bar{ position: absolute; top:0; left:0; width:100%; z-index:100; }
#header-bar .container{ display: flex; justify-content: space-between; align-items: center; padding: 30px 0px; }
#header-bar .header-logo{ width: 200px; }
#header-bar .header-logo .logo-fix{ display: none; }
#header-bar .header-menu{ display: flex; align-items: center; gap: 20px; }

#header-bar.header-fixed-top{ position: fixed; top:0; left:0; width:100%; z-index:100; background-color: #fff; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
#header-bar.header-fixed-top .container{ padding: 10px 0px; }
#header-bar.header-fixed-top .booknow a{ color: var(--color-orange); cursor: pointer;  }
#header-bar.header-fixed-top .booknow a:hover{ color: var(--color-blue1) !important; }
#header-bar.header-fixed-top .header-logo .logo-white{ display: none; }
#header-bar.header-fixed-top .header-logo .logo-fix{ display: block; }

#mainmenu .container{ position: relative; }
#mainmenu .close-menu{ position: absolute; top: 20px; right: 20px; z-index: 110; display: none; }
#mainmenu #menu.open .close-menu{ display: block; }

#menu.menu-slick{ top: 80px; }

@media screen and (max-width: 991px) { 
  #mainmenu .container{ max-width: none; }
  #header-bar .container{ padding: 20px 30px; max-width: none; }
  #header-bar .booknow{  left: auto; position: relative; top: 2px; }
  #menu.menu-slick{ position: absolute;  top: 0; left: 0; width: 100%;  }
  #menu.menu-slick.open{ position: fixed; top: 0; left: 0;  }
  #header-bar.header-fixed-top{ padding: 0px 20px; }
   .nav-split a{  margin-bottom: 5px;}



  }

@media screen and (max-width: 768px) {
  .cbp-so-side-top {
    margin-top: 100px;
  }
  }

@media screen and (max-width: 640px) {
  .space-left { padding-right: 0; }
  .space-right { padding: 0 20px; }
  }

@media screen and (max-width: 480px) { 
  #header-bar .header-logo{ width: 150px;  }
  #header-bar .container{ padding: 10px 20px !important;  }
  #header-bar.header-fixed-top .container{ padding: 0px !important;  }
  #header-bar .header-menu{ gap: 10px;  }
  #header-bar .booknow a{ font-size: 1rem; }
  #mainmenu .close-menu{ top: 0; right: 5px; }
  .header-menu .toggle-menu{ width: 40px; height: 40px; }
  #header-bar.header-fixed-top{ padding: 10px 20px;  }
  }

@media screen and (max-width: 375px) { 
  #header-bar .header-logo{ width: 130px;  }
  #header-bar .booknow a{ letter-spacing: -1px; }
  #menu.open .menu-main {  top: 100px;  }
  }

.button-circle.outline {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.button-circle.outline small {
    display: block;
    line-height: 1.3;
    text-align: center;
    width: 100%;
}

.button-center {
  text-align: center;
}

/* ── btn-360 layout only — ไม่แตะ text style เดิม ── */

/* Desktop: ไม่แก้อะไร ปล่อยตามเดิม */

/* Tablet 768px */
@media screen and (max-width: 768px) {
    .link-button.horizontal {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 16px;
        padding: 0;
        margin-top: 16px;
    }

    .link-button.horizontal li {
        list-style: none;
        margin: 0;
    }
}

/* Mobile 480px */
@media screen and (max-width: 480px) {
    .link-button.horizontal {
        justify-content: flex-start;
        gap: 12px;
        margin-top: 12px;
    }

    .link-button.horizontal .btn-360 {
        width: 80px;
        height: 80px;
    }
}