@media (min-width: 1000px) {
  body { padding-left: 242px; }
  header {
    position: fixed;
    z-index: 30;
    inset: 0 auto 0 0;
    width: 242px;
    height: 100dvh;
    border: 0;
    border-right: 1px solid #e1e5dc;
    background: #f2f3ed;
  }
  .nav.wrap {
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    padding: 30px 18px 24px;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: column;
    gap: 0;
  }
  .nav nav {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    margin-top: 46px;
    font-size: 16px;
  }
  .nav nav a,
  .nav nav .text-btn {
    display: flex;
    align-items: center;
    min-height: 53px;
    padding: 12px 14px;
    border-radius: 12px;
    color: #46574b;
    font-size: 16px;
    font-weight: 750;
    text-align: left;
  }
  .nav nav a:hover,
  .nav nav .text-btn:hover { color: #234735; background: #e6ece3; }
  .nav nav a.active { color: #fff; background: #285642; }
  .nav nav .text-btn { margin-top: 8px; }
  .city-pill { margin-top: auto; justify-content: center; min-height: 43px; background: #fff; }
  main.wrap,
  body > footer.wrap { width: calc(100% - 76px); max-width: 1320px; }
}

.quick-buy {
  margin-top: 16px;
  padding: 15px;
  border: 1px solid #cbd9c9;
  border-radius: 13px;
  background: #f1f6ef;
}
.quick-buy-heading { display: flex; align-items: flex-start; gap: 9px; color: #2d5944; }
.quick-buy-heading > span { display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 auto; border-radius: 50%; color: #fff; background: #42705a; font-size: 12px; }
.quick-buy-heading strong { display: block; font-size: 13px; line-height: 1.45; }
.quick-buy-heading small { display: block; margin-top: 3px; color: #6f7f70; font-size: 10px; line-height: 1.55; }
.quick-buy-items { display: grid; gap: 7px; margin-top: 11px; }
.quick-buy-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 11px; border: 1px solid #e1e8dd; border-radius: 10px; background: #fff; }
.quick-buy-item > span { min-width: 0; }
.quick-buy-item strong { display: block; color: #263d30; font-size: 11px; }
.quick-buy-item small { display: block; margin-top: 3px; color: #869083; font-size: 9px; line-height: 1.45; }
.quick-buy-item > a,
.quick-buy-route { flex: 0 0 auto; padding: 8px 10px; border-radius: 8px; color: #fff; background: #d95032; font-size: 10px; font-weight: 800; white-space: nowrap; }
.quick-buy-item > a:hover,
.quick-buy-route:hover { color: #fff; background: #bd4128; }
.quick-buy-note { display: block; margin-top: 9px; color: #8b907f; font-size: 9px; line-height: 1.6; }
.quick-buy-route { display: inline-flex; margin-top: 11px; }
.hero-region-switch { display: grid; width: fit-content; grid-template-columns: auto auto; gap: 3px 10px; align-items: center; margin-top: 18px; padding: 10px 13px; border: 1px solid #d9e4d7; border-radius: 12px; background: #fff; color: #245448; font-size: 11px; }
.hero-region-switch span { color: #82918a; font-size: 9px; grid-column: 1 / -1; }
.hero-region-switch strong { font-size: 13px; }
.hero-region-switch b { font-size: 10px; }
.hero-region-switch:hover { border-color: #245448; }
.destination-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; width: 100%; padding: 9px; margin: 0 0 7px; border: 2px solid #d7e1d3; border-radius: 15px; background: #f5f7f1; box-shadow: 0 4px 12px #203b3010; white-space: nowrap; }
.destination-switch::before { content: "여행지 선택"; grid-column: 1 / -1; padding: 0 3px 2px; color: #506d5d; font-size: 12px; font-weight: 900; }
.nav nav .destination-switch a { min-height: 46px; justify-content: center; padding: 9px 10px; border: 1px solid #d5dfd1; border-radius: 11px; color: #355847; background: #fff; font-size: 14px; font-weight: 900; transition: background .16s, color .16s, transform .16s, box-shadow .16s; }
.nav nav .destination-switch a.selected { color: #fff; border-color: #d95032; background: #d95032; box-shadow: 0 4px 10px #d9503245; }
.nav nav .destination-switch a:hover { color: #173d31; border-color: #91ad96; background: #e9f0e6; }
.nav nav .destination-switch a.selected:hover { color: #fff; border-color: #bd4128; background: #bd4128; }
.nav nav .destination-switch a:focus-visible { outline: 3px solid #f2bb5f; outline-offset: 2px; }
@media (max-width: 999px) {
  .nav nav .destination-switch { display: inline-flex; width: auto; flex: 0 0 auto; align-items: center; gap: 4px; padding: 4px; margin: 0 5px 0 0; border-width: 2px; border-radius: 13px; }
  .destination-switch::before { display: none; }
  .nav nav .destination-switch a { min-height: 40px; padding: 0 13px; border-radius: 9px; font-size: 13px; }
}

@media (max-width: 999px) {
  .quick-buy { padding: 12px; }
}
@media (max-width: 999px) {
  body { padding-left: 0; }
  header { position: sticky; inset: 0 auto auto; z-index: 30; width: 100%; height: auto; border: 0; border-bottom: 1px solid #e7e8e2; }
  .nav.wrap { width: calc(100% - 32px); height: 64px; max-width: none; margin: auto; padding: 0; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; }
  .nav nav { margin-top: 0; }
  .nav nav a { min-height: 0; padding: 0; border-radius: 0; font-size: 10px; }
  .nav nav a.active { color: var(--orange); background: transparent; }
  .quick-buy-item > a { padding: 8px; font-size: 9px; }
}

/* Mobile navigation: destination picker on its own row, with large primary tabs below. */
@media (max-width: 999px) {
  html { scroll-padding-top: 132px; }
  .nav.wrap {
    display: block;
    width: 100%;
    height: auto;
    padding: 9px 14px 11px;
  }
  .nav.wrap > .brand,
  .nav.wrap > .city-pill { display: none; }
  .nav nav {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 7px;
    overflow: visible;
  }
  .nav nav .destination-switch {
    display: grid;
    width: 100%;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin: 0;
    padding: 4px;
    border: 1px solid #d7e1d3;
    border-radius: 13px;
    background: #edf2eb;
  }
  .nav nav .destination-switch::before { display: none; }
  .nav nav .destination-switch a {
    display: flex;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #355847;
    background: transparent;
    font-size: 15px;
    font-weight: 900;
  }
  .nav nav .destination-switch a.selected {
    color: #fff;
    border-color: #285642;
    background: #285642;
    box-shadow: 0 3px 9px #203b3028;
  }
  .nav nav > a {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 9px 5px;
    border: 1px solid #d7e1d3;
    border-radius: 12px;
    color: #355847;
    background: #fff;
    box-shadow: 0 3px 9px #203b300d;
    font-size: 14px;
    font-weight: 850;
    white-space: nowrap;
  }
  .nav nav > a.active {
    color: #fff;
    border-color: #d95032;
    background: #d95032;
    box-shadow: 0 4px 10px #d9503230;
  }
  .nav nav > a.mobile-nav-hidden,
  .nav nav > .text-btn { display: none; }
  .nav nav > a.mobile-nav-planner { order: 4; grid-column: 1 / 2; }
  .nav nav > a.mobile-nav-booking {
    display: flex;
    order: 5;
    grid-column: 2 / -1;
    min-height: 48px;
    padding: 10px 14px;
    border: 1px solid #285642;
    border-radius: 12px;
    color: #fff;
    background: #285642;
    box-shadow: 0 4px 10px #203b3028;
    font-size: 14px;
    font-weight: 900;
    white-space: nowrap;
  }
  .nav nav > a.mobile-nav-booking.active {
    border-color: #d95032;
    background: #d95032;
    box-shadow: 0 4px 10px #d9503230;
  }
}

/* Six travel sections share two rows below the destination picker. */
@media (max-width: 999px) {
  html { scroll-padding-top: 190px; }
  .nav nav > a.mobile-nav-planner,
  .nk-header nav > a.mobile-nav-planner { order: 4; grid-column: 1; }
  .nav nav > a.mobile-nav-shopping,
  .nk-header nav > a.mobile-nav-shopping { order: 5; grid-column: 2; }
  .nav nav > a.mobile-nav-booking,
  .nk-header nav > a.mobile-nav-booking {
    order: 6;
    grid-column: 3;
    min-width: 0;
    min-height: 48px;
    padding: 7px 6px;
    white-space: normal;
    word-break: keep-all;
    text-align: center;
    font-size: 12px;
    line-height: 1.45;
  }
}