/* Shared editorial refinements: restrained, asymmetrical, and image-led. */
::selection{background:#72cbff;color:#061a2d}.site-header,.community-header,.detail-header{letter-spacing:.01em}.brand{position:relative}.brand::after{content:'';position:absolute;left:0;bottom:-7px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.2,.7,.2,1)}.brand:hover::after{transform:scaleX(1);transform-origin:left}.eyebrow,.destination-region,.community-hero>div:first-child>p{font-weight:500}.primary-button,.destination-copy>a{position:relative;overflow:hidden}.primary-button::before,.destination-copy>a::before{content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;background:rgba(114,203,255,.08);transform:translateY(102%);transition:transform .4s cubic-bezier(.2,.7,.2,1)}.primary-button:hover::before,.destination-copy>a:hover::before{transform:none}.section-heading{position:relative;padding-top:18px}.section-heading::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,#89a9ba 0 8%,#d7e4eb 8%)}.city-card::after,.feed-card .post-image::after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 35%,rgba(255,255,255,.13),transparent 65%);transform:translateX(-120%);transition:transform .9s ease;pointer-events:none}.city-card:hover::after,.feed-card:hover .post-image::after{transform:translateX(120%)}
@media(max-width:760px){.section-heading{padding-top:14px}}
/* 전체 사이트 공통 폰트 */
:root {
  --sans: "Pretendard", "Noto Sans KR", sans-serif;
  --serif: "Playfair Display", serif;
}

body,
button,
input,
select,
textarea {
  font-family: "Pretendard", "Noto Sans KR", sans-serif;
}

.hero-title {
  font-family: "Playfair Display", serif;
}

/* The pin belongs to the identity; saved items use the heart language. */
.brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
}

.brand-pin {
  position: relative;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  display: inline-block;
  border-radius: 50% 50% 50% 0;
  background: #72cbff;
  box-shadow: 0 0 0 4px rgba(114, 203, 255, .1);
  transform: rotate(-45deg);
}

.brand-pin::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 5px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #061a2d;
}

/* 기본 마우스 사용: 지연되는 원형 커서는 사용하지 않습니다. */
html,
body,
a,
button,
input,
select,
textarea {
  cursor: auto;
}

a,
button,
label,
select {
  cursor: pointer;
}

.cursor-dot,
.cursor-ring,
.globe-cursor {
  display: none !important;
}

/* Primary saved-items entry: intentionally larger than secondary navigation. */
.header-journey {
  min-height: 40px;
  margin-left: 24px;
  padding: 0 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 22px;
  background: rgba(3, 17, 27, .24);
  color: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  backdrop-filter: blur(12px);
}

.header-journey span {
  color: #72cbff;
  font-size: 15px;
  line-height: 1;
}

.community-header .header-journey {
  border-color: #b9d3e1;
  background: #fff;
  color: #17384c;
}

.community-header .liked-filter,
.community-header .saved-filter,
.feed-toolbar .liked-filter,
.feed-toolbar .saved-filter {
  min-height: 36px;
  padding: 9px 14px;
  font-size: 11px;
  font-weight: 600;
}

/* Mobile safe area: full-bleed backgrounds stay full width, content gets 20px. */
@media (max-width: 760px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  img,
  video,
  svg {
    max-width: 100%;
  }

  .site-header,
  .detail-header,
  .community-header,
  .journey-header,
  footer {
    padding-left: 20px;
    padding-right: 20px;
  }

  .site-header .header-journey,
  .detail-header .header-journey,
  .community-header .header-journey {
    min-height: 36px;
    margin-left: auto;
    padding: 0 13px;
    font-size: 10px;
  }

  .site-header .menu-button,
  .detail-header .back-link,
  .community-header .header-actions {
    margin-left: 12px;
  }

  .hero-copy,
  .destination-copy {
    left: 20px;
    right: 20px;
    max-width: calc(100% - 40px);
  }

  .community-hero,
  .journey-hero,
  .flat-map-view,
  .content-section,
  .community-section,
  .like-section,
  .course-section,
  .currency-calculator {
    padding-left: 20px;
    padding-right: 20px;
  }

  .feed-section,
  .journey-content {
    padding-left: 20px;
    padding-right: 20px;
  }

  .feed-toolbar,
  .journey-toolbar {
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .country-shortcuts {
    left: 20px;
    right: 20px;
  }

  .city-card {
    min-width: calc(100vw - 40px);
  }

  .comment-panel,
  .modal-backdrop {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* One persistent global header across home and every subpage. */
.site-header,.detail-header,.community-header,.journey-header{position:fixed;z-index:880;top:0;left:0;width:100%;height:88px;padding:0 clamp(24px,4.2vw,68px);display:flex;align-items:center;border:0;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(2,13,22,.94),rgba(2,13,22,.72));color:#fff;backdrop-filter:blur(16px)}
.site-header .brand,.detail-header .brand,.community-header .brand,.journey-header .brand{color:#fff;font:500 20px var(--serif);letter-spacing:.09em}
.site-header nav,.detail-header nav,.community-header nav,.journey-header nav{margin-left:auto;display:flex;align-items:center;gap:38px}
.site-header nav a,.detail-header nav a,.community-header nav a,.journey-header nav a{position:relative;padding:10px 0;color:rgba(255,255,255,.78);font-size:11px;font-weight:600;letter-spacing:.07em}
.site-header nav a:hover,.detail-header nav a:hover,.community-header nav a:hover,.journey-header nav a:hover,.site-header nav a.active,.detail-header nav a.active,.community-header nav a.active,.journey-header nav a.active{color:#fff}
.site-header nav a.active::after,.detail-header nav a.active::after,.community-header nav a.active::after,.journey-header nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:#72cbff}
.site-header .header-journey,.detail-header .header-journey,.community-header .header-journey,.journey-header .header-journey{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff}
.header-journey.is-active{border-color:#72cbff;background:rgba(114,203,255,.16)}
.site-header .menu-button,.detail-header .menu-button,.community-header .menu-button,.journey-header .menu-button{width:34px;margin-left:28px;padding:5px 2px;border:0;background:none;color:#fff}
.site-header .menu-button span,.detail-header .menu-button span,.community-header .menu-button span,.journey-header .menu-button span{display:block;height:1px;margin:7px 0;background:currentColor;transition:transform .25s}
.feed-toolbar{top:88px}
@media(max-width:760px){.site-header,.detail-header,.community-header,.journey-header{height:72px;padding:0 18px}.site-header .brand,.detail-header .brand,.community-header .brand,.journey-header .brand{font-size:17px}.site-header nav,.detail-header nav,.community-header nav,.journey-header nav{position:absolute;top:64px;right:14px;width:190px;padding:13px 18px;display:none;flex-direction:column;align-items:stretch;gap:2px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(2,13,22,.97);box-shadow:0 18px 45px rgba(0,0,0,.3)}.menu-open .site-header nav,.menu-open .detail-header nav,.menu-open .community-header nav,.menu-open .journey-header nav{display:flex}.site-header nav a,.detail-header nav a,.community-header nav a,.journey-header nav a{padding:11px 0;font-size:11px}.site-header .header-journey,.detail-header .header-journey,.community-header .header-journey,.journey-header .header-journey{margin-left:auto}.site-header .menu-button,.detail-header .menu-button,.community-header .menu-button,.journey-header .menu-button{margin-left:10px}}
@media(max-width:760px){.feed-toolbar{top:72px}}

/* The home header floats over the globe instead of covering the map with a solid bar. */
.site-header{
  border-bottom:0;
  background:linear-gradient(180deg,rgba(2,13,22,.68) 0%,rgba(2,13,22,.22) 68%,transparent 100%);
  backdrop-filter:none;
}
.map-mode .site-header{
  border-bottom:0;
  background:linear-gradient(180deg,rgba(242,240,233,.92) 0%,rgba(242,240,233,.55) 68%,transparent 100%);
  color:#17262d;
}
.map-mode .site-header .brand,
.map-mode .site-header nav a,
.map-mode .site-header .menu-button{color:#17262d;text-shadow:none}
.map-mode .site-header .header-journey{
  border-color:rgba(23,38,45,.24);
  background:rgba(255,255,255,.58);
  color:#17262d;
}