/* ================================================================
   HERO v2 — luxury editorial (kn-hero: tour-detail / rental / activity)
   Taller, serif display, quiet metadata line
   ================================================================ */
.kn-hero {
    position: relative; height: 68vh; min-height: 480px; max-height: 700px;
    overflow: hidden; display: flex; align-items: flex-end;
}
.kn-hero-bg {
    position: absolute; inset: 0;
    background-size: cover; background-position: center 40%;
    transform: scale(1.04);
    transition: transform 9s var(--ease-out);
}
.kn-hero.loaded .kn-hero-bg { transform: scale(1); }
.kn-hero-bg::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(10,9,8,0.78) 0%, rgba(10,9,8,0.28) 45%, rgba(10,9,8,0.18) 100%);
}
.kn-hero-content {
    position: relative; z-index: 2;
    width: 100%; max-width: var(--container); margin: 0 auto;
    padding: 0 48px 64px;
}
.kn-hero-badge {
    display: inline-flex; align-items: center; gap: 12px;
    font-family: var(--font-body); font-size: 10.5px; font-weight: 600;
    color: var(--kn-amber-light); letter-spacing: var(--ls-kicker); text-transform: uppercase;
    background: none; border: none; padding: 0;
    margin-bottom: 18px;
}
.kn-hero-badge::before { content: ''; width: 32px; height: 1px; background: var(--kn-amber-light); opacity: 0.7; }
.kn-hero h1 {
    font-size: var(--fs-hero);
    color: var(--kn-white); line-height: 1.14;
    margin-bottom: 16px; letter-spacing: -0.01em;
    font-family: var(--font-display);
}
.kn-hero-sub {
    font-family: var(--font-kr); font-size: 16px; font-weight: 300;
    color: rgba(255,255,255,0.72); line-height: 1.8;
    max-width: 560px;
}

/* Next-departure widget — hairline luxury capsule */
.kn-hero-departure {
    display: inline-flex; align-items: center; gap: 14px;
    margin-top: 28px; padding: 11px 20px;
    background: rgba(22,17,12,0.35);
    border: 1px solid rgba(255,255,255,0.22);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-radius: var(--radius-full); color: #fff;
    font-family: var(--font-kr); font-size: 13.5px; font-weight: 300;
    letter-spacing: 0.02em;
}
.kn-hero-departure .dep-date { font-weight: 600; }
.kn-hero-departure .dep-pax { color: rgba(255,255,255,0.85); font-variant-numeric: tabular-nums; }
.kn-hero-departure .dep-status {
    padding: 4px 12px; border-radius: 999px;
    font-size: 11.5px; font-weight: 600; letter-spacing: 0.02em;
}
.kn-hero-departure .dep-status.status-모집중     { background: rgba(232,165,71,0.92); color: #1a120a; }
.kn-hero-departure .dep-status.status-마감임박   {
    background: #E67E22; color: #fff;
    animation: pulseMarginClose 1.6s ease-in-out infinite;
}
.kn-hero-departure .dep-status.status-출발확정   { background: #2E9E5E; color: #fff; }
.kn-hero-departure .dep-status.status-마감       { background: rgba(255,255,255,0.25); color: rgba(255,255,255,0.65); }
.kn-hero-departure .dep-status.status-출발완료   { background: rgba(255,255,255,0.15); color: rgba(255,255,255,0.5); }
@keyframes pulseMarginClose {
    0%, 100% { box-shadow: 0 0 0 0 rgba(230,126,34,0.55); }
    50%      { box-shadow: 0 0 0 8px rgba(230,126,34,0); }
}
