/* 전 페이지에서 함께 쓰는 색상, 헤더, 카드 스타일 */
:root{
  --font-display:'Playfair Display','Pretendard',sans-serif;
  --font-body:'Pretendard',sans-serif;
  --serif:var(--font-display);
  --sans:var(--font-body);
  --tp-navy:#071420;
  --tp-ink:#10202b;
  --tp-muted:#6e7b84;
  --tp-paper:#f6f2ea;
  --tp-white:#fffaf2;
  --tp-line:rgba(13,30,40,.12);
  --tp-shadow:0 22px 70px rgba(5,20,30,.14);
  --tp-radius-lg:34px;
  --tp-radius-md:22px;
  --tp-max:1600px;
}
html{scroll-behavior:smooth;}
body{overflow-x:hidden;font-family:var(--font-body);}
button,input,select,textarea{font-family:var(--font-body);}
img{max-width:100%;display:block;}
.site-header,.community-header,.journey-header,.detail-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:1000;
  border-bottom:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.site-header .header-journey,.community-header .header-journey,
.journey-header .header-journey,.detail-header .header-journey,
.header-journey.is-active{background:transparent!important;}
.site-header a,.community-header a,.journey-header a,.detail-header a,
.site-header button,.community-header button,.journey-header button,.detail-header button{position:relative;z-index:2;}
main{isolation:isolate;}
.hero-title{letter-spacing:-.06em;line-height:.86;}
.hero-description,.community-hero>p,.journey-hero>p{line-height:1.65;}
.brand{white-space:nowrap;}
.brand-pin{box-shadow:0 0 0 7px rgba(255,255,255,.14);}
[data-reveal]{will-change:transform,opacity;}
button,a{touch-action:manipulation;}
button{font-family:inherit;}
/* 콘텐츠가 흩어져 보이지 않도록 공통 컨테이너 폭 통일 */
.feed-section,.journey-content,.detail-section,.destination-section,.editorial-section{max-width:var(--tp-max);margin-inline:auto;}
/* 카드 결 통일 */
.destination-card,.community-card,.post-card,.journey-card,.info-card,.video-card,
.trip-ready-card,.budget-card,.route-card,.city-card,.spot-card{
  border-radius:var(--tp-radius-md);
  box-shadow:var(--tp-shadow);
}
/* 링크/버튼 hover 공통 */
.header-journey,.journey-open,.submit-pin,.destination-link,.board-action,.cta-button{
  transition:transform .25s ease,opacity .25s ease,background .25s ease,color .25s ease;
}
.header-journey:hover,.journey-open:hover,.submit-pin:hover,.destination-link:hover,.board-action:hover,.cta-button:hover{transform:translateY(-2px);}
.header-journey:hover { transform: none; }
.header-journey span { transition: color .25s ease,filter .25s ease,transform .25s ease; }
.header-journey:hover span {
  color: #ff5364;
  filter: drop-shadow(0 0 6px rgba(255,83,100,.55));
  transform: scale(1.12);
}
.header-login{
  width:40px;
  height:40px;
  margin-left:10px;
  padding:0;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  transition:color .25s ease,transform .25s ease;
}
.header-login svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.header-login:hover{color:#72cbff;transform:translateY(-1px)}

/* The menu toggle is only useful when navigation collapses on small screens. */
@media (min-width: 781px) {
  .site-header .menu-button,
  .detail-header .menu-button,
  .community-header .menu-button,
  .journey-header .menu-button { display: none; }
}

/* Collapse the primary navigation before the header starts to feel crowded. */
@media (max-width: 780px) {
  .site-header.global-header > .header-journey{margin-left:auto}

  .site-header.global-header .menu-button {
    display: block;
    flex: 0 0 36px;
    margin-left: 18px;
  }

  .site-header.global-header nav {
    position: absolute;
    top: calc(100% - 8px);
    right: clamp(18px, 4.2vw, 68px);
    width: min(260px, calc(100vw - 36px));
    margin: 0;
    padding: 16px 22px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 12px;
    background: rgba(2,13,22,.97);
    box-shadow: 0 20px 50px rgba(0,0,0,.32);
  }

  .menu-open .site-header.global-header nav { display: flex; }
  .site-header.global-header nav a { padding: 13px 0; }
  .site-header.global-header nav .drawer-only{
    width:100%;
    min-height:44px;
    padding:13px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border:0;
    border-top:1px solid rgba(255,255,255,.1);
    background:transparent;
    color:rgba(255,255,255,.78);
    font-size:11px;
    font-weight:600;
    letter-spacing:.07em;
    text-align:left;
    cursor:pointer;
  }
  .site-header.global-header nav .drawer-only{display:none}
  .site-header.global-header nav .drawer-journey span{color:#72cbff;font-size:14px}

  .site-header.global-header.is-on-light nav {
    border-color: rgba(7,26,41,.12);
    background: rgba(255,255,255,.97);
    box-shadow: 0 20px 50px rgba(7,26,41,.16);
  }
  .site-header.global-header.is-on-light nav .drawer-only{
    border-top-color:rgba(7,26,41,.1);
    color:#071a29;
  }
}

.drawer-only{display:none}

@media(max-width:450px){
  .site-header.global-header > .header-journey,
  .site-header.global-header > .subpage-search-trigger,
  .site-header.global-header > .header-login{
    display:none;
  }

  .site-header.global-header .brand{margin-right:auto}
  .site-header.global-header nav .drawer-only:not([hidden]){display:flex}
  .site-header.global-header nav .drawer-only[hidden]{display:none}
}
/* 홈 화면 */
.hero-copy .hero-description{max-width:360px;}
.hero-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
/* 지도/핀 클릭 영역이 오버레이에 막히지 않도록 */
#pin-layer,.country-shortcuts,.flat-map-view,.view-switch,.zoom-control,.journey-panel{pointer-events:auto;}
.flight-decoration{pointer-events:none;}
.country-transition{pointer-events:none;}
.country-transition.show{pointer-events:auto;}
/* 숨은 명소 카드 */
.masonry-grid{align-items:stretch;}
.feed-toolbar{
  position:relative;
  top:auto;
  border-bottom:0;
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.filter-list button,.personal-filters button{white-space:nowrap;}
/* My Journey를 보드처럼 보이게 */
.journey-board-head,.board-overview{border:1px solid var(--tp-line);}
.journey-empty a{display:inline-flex;align-items:center;justify-content:center;}
/* 작은 화면 */
@media (max-width: 1024px){
  .site-header,.community-header,.journey-header,.detail-header{padding-inline:22px;}
  nav{gap:18px;}
  .hero-title{font-size:clamp(58px,13vw,118px)!important;}
  .country-shortcuts{max-width:calc(100vw - 40px);}
}
@media (max-width: 720px){
  .site-header nav,.community-header nav,.journey-header nav,.detail-header nav{display:none;}
  .header-journey{font-size:11px;}
  .hero-copy{left:24px!important;right:24px!important;}
  .journey-panel{display:none!important;}
  .view-switch{left:24px!important;right:auto!important;}
  .country-shortcuts{left:24px!important;right:24px!important;bottom:24px!important;}
  .flat-map-view{padding:90px 24px 40px!important;}
}

/* 문의 페이지 */
.contact-grid-section .feed-toolbar,.contact-form-section .feed-toolbar{align-items:end;}
.contact-guide-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
.contact-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.7fr);gap:28px;align-items:start;}
.contact-form{padding:28px;background:#fff;}
.contact-form label{display:grid;gap:8px;margin-bottom:16px;color:var(--tp-muted);font-size:11px;text-transform:uppercase;letter-spacing:.12em;}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid var(--tp-line);border-radius:16px;padding:14px 15px;background:#fff;color:var(--tp-ink);font:inherit;text-transform:none;letter-spacing:0;}
.contact-form textarea{resize:vertical;min-height:130px;}
.form-note{margin-top:12px;color:var(--tp-muted);font-size:12px;}
.contact-side-card{padding:0;overflow:hidden;background:#fff;}
.contact-side-card .post-body + .post-body{border-top:1px solid var(--tp-line);}
.faq-toggle{width:100%;padding:14px 0;border:0;border-bottom:1px solid var(--tp-line);background:transparent;text-align:left;font:inherit;color:var(--tp-ink);cursor:pointer;}
.faq-answer{display:none;margin:12px 0 18px;color:var(--tp-muted);line-height:1.65;}
.faq-answer.open{display:block;}
.toast-message{position:fixed;right:28px;bottom:28px;z-index:2000;padding:14px 18px;border-radius:999px;background:#071420;color:#fff;box-shadow:var(--tp-shadow);opacity:0;transform:translateY(10px);transition:.25s ease;}
.toast-message.show{opacity:1;transform:translateY(0);}
@media (max-width:1024px){.contact-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.contact-layout{grid-template-columns:1fr;}}
@media (max-width:720px){.contact-guide-grid{grid-template-columns:1fr;}.toast-message{left:20px;right:20px;bottom:20px;text-align:center;}}

/* 상세 페이지 하단 저장 안내 */
.journey-cta-section{padding-top:clamp(40px,6vw,90px);padding-bottom:clamp(60px,8vw,120px)}
.journey-cta-card{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.04)}
.journey-cta-card p{max-width:560px;margin:0;color:inherit;line-height:1.8}
@media(max-width:760px){.journey-cta-card{display:block}.journey-cta-card .post-action{display:inline-block;margin-top:18px}}

/* Switch only the header ink when it moves from a dark hero onto a light section. */
.site-header.global-header.is-on-light{
  background:transparent!important;
  border-bottom-color:rgba(7,26,41,.1)!important;
  box-shadow:none!important;
  color:#071a29!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.site-header.global-header.is-on-light .brand,
.site-header.global-header.is-on-light .subpage-search-trigger,
.site-header.global-header.is-on-light .header-login,
.site-header.global-header.is-on-light .menu-button{
  color:#071a29!important;
  text-shadow:none!important;
}
.site-header.global-header.is-on-light nav a{
  color:#071a29;
  text-shadow:none;
}
.site-header.global-header.is-on-light .header-journey{
  border-color:rgba(7,26,41,.25)!important;
  background:rgba(255,255,255,.7)!important;
  color:#071a29!important;
  text-shadow:none!important;
}
.site-header.global-header.is-on-light .header-login{
  background:transparent!important;
}
@media(max-width:760px){.header-login{width:34px;height:34px;margin-left:6px}.header-login svg{width:24px;height:24px}}

/* Global header underline: animate on hover and persist on the current page. */
.site-header.global-header nav a {
  position: relative;
}

.site-header.global-header nav a::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 3px;
  left: 0;
  height: 1px;
  background: #e7c28e;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .3s ease;
}

.site-header.global-header nav a:hover::after,
.site-header.global-header nav a:focus-visible::after,
.site-header.global-header nav a.active::after,
.site-header.global-header nav a[aria-current='page']::after {
  transform: scaleX(1);
  transform-origin: center;
}

.site-header.global-header nav a.active::after,
.site-header.global-header nav a[aria-current='page']::after {
  background: #72cbff;
}

.site-header.global-header .brand.active::after,
.site-header.global-header .brand[aria-current='page']::after {
  transform: scaleX(1);
  transform-origin: center;
}

/* Drawer actions use the same animated underline language as navigation links. */
.site-header.global-header nav .drawer-search,
.site-header.global-header nav .drawer-login{
  position:relative;
}
.site-header.global-header nav .drawer-search::after,
.site-header.global-header nav .drawer-login::after{
  content:'';
  position:absolute;
  right:0;
  bottom:3px;
  left:0;
  height:1px;
  background:#e7c28e;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .3s ease;
}
.site-header.global-header nav .drawer-search:hover::after,
.site-header.global-header nav .drawer-search:focus-visible::after,
.site-header.global-header nav .drawer-login:hover::after,
.site-header.global-header nav .drawer-login:focus-visible::after{
  transform:scaleX(1);
}
body.search-open .site-header.global-header nav .drawer-search::after,
body.login-open .site-header.global-header nav .drawer-login::after{
  background:#72cbff;
  height:2px;
  transform:scaleX(1);
}
.signup-page .site-header.global-header nav .drawer-login::after{
  height:2px;
  background:#72cbff;
  transform:scaleX(1);
}

/* Search and login icons keep a blue underline while they live in the header. */
.site-header.global-header > .subpage-search-trigger::after,
.site-header.global-header > .header-login::after{
  content:'';
  position:absolute;
  right:4px;
  bottom:0;
  left:4px;
  height:1px;
  background:#72cbff;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .3s ease;
}
.site-header.global-header > .subpage-search-trigger:hover::after,
.site-header.global-header > .subpage-search-trigger:focus-visible::after,
.site-header.global-header > .header-login:hover::after,
.site-header.global-header > .header-login:focus-visible::after{
  transform:scaleX(1);
}

/* Unified card hover, based on the featured destination cards. */
.city-card,
.hidden-card,
.hidden-spot-card,
.journey-card,
.traveler-pick-card{
  transform-origin:center;
  transition:transform .36s cubic-bezier(.2,.7,.2,1),
             box-shadow .36s cubic-bezier(.2,.7,.2,1),
             border-color .36s ease;
  will-change:transform;
}

@media(hover:hover) and (pointer:fine){
  .city-card:hover,
  .hidden-card:hover,
  .hidden-spot-card:hover,
  .journey-card:hover,
  .traveler-pick-card:hover{
    z-index:2;
    transform:translateY(-4px) scale(1.02) !important;
    border-color:rgba(20,92,126,.2);
    box-shadow:0 26px 64px rgba(6,26,45,.18) !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .city-card,
  .hidden-card,
  .hidden-spot-card,
  .journey-card,
  .traveler-pick-card{transition:none;will-change:auto}

  .city-card:hover,
  .hidden-card:hover,
  .hidden-spot-card:hover,
  .journey-card:hover,
  .traveler-pick-card:hover{transform:none !important}
}

@media(max-width:760px){
  .destination-page .city-cards{
    display:grid;
    grid-template-columns:1fr;
    overflow:visible;
    scroll-snap-type:none;
    padding-bottom:0;
  }
  .destination-page .city-card{min-width:0;scroll-snap-align:none}
}

/* 작은 서브 페이지의 히어로 높이 */
.contact-hero,
.journey-hero,
.hidden-hero,
.signup-hero{
  height:610px;
  min-height:610px;
}

@media(max-width:760px){
  .contact-hero,
  .journey-hero,
  .hidden-hero,
  .signup-hero{
    height:510px;
    min-height:510px;
  }

  input:not([type='checkbox']):not([type='radio']),
  textarea,
  select{
    font-size:16px !important;
  }
}
