/* ==================================================================
   BADA Freedive — Editorial Design System
   Single source of truth. No legacy overrides. No !important.

   Aesthetic: Cinematic luxury minimal. Aman Resorts meets film poster.
   Fonts: Bodoni Moda (headings), Space Grotesk (body), Noto Sans/Serif KR
   Colors: Ocean deep (#0a0e1a), Ocean (#1A5276), Sand (#FDFBF7), White
   ================================================================== */

/* ------------------------------------------------------------------
   0. RESET & FOUNDATIONS
   ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
}

body {
  font-family: 'Space Grotesk', -apple-system, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
  color: #1a1a1a;
  background: #ffffff;
  overflow-x: hidden;
}

img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { cursor: pointer; background: none; border: none; font: inherit; color: inherit; }

/* Selection */
::selection { background: rgba(26,82,118,0.15); color: #0a0e1a; }

/* ------------------------------------------------------------------
   1. DESIGN TOKENS
   ------------------------------------------------------------------ */
:root {
  /* Color palette */
  --ocean-900: #0a0e1a;
  --ocean-800: #0F1B2D;
  --ocean-700: #132B42;
  --ocean-600: #164466;
  --ocean-500: #1A5276;
  --ocean-400: #2471A3;
  --ocean-300: #5DADE2;
  --ocean-200: #AED6F1;
  --ocean-100: #D6EAF8;

  --sand-50: #FDFBF7;
  --sand-100: #F7F2E8;
  --sand-200: #EDE4D0;

  --white: #ffffff;
  --gray-50: #F9FAFB;
  --gray-100: #F3F4F6;
  --gray-200: #E5E7EB;
  --gray-300: #D1D5DB;
  --gray-400: #9CA3AF;
  --gray-500: #6B7280;
  --gray-600: #4B5563;
  --gray-700: #374151;
  --gray-800: #1F2937;
  --gray-900: #111827;

  /* Typography scale */
  --font-heading: 'Bodoni Moda', 'Playfair Display', Georgia, serif;
  --font-body: 'Space Grotesk', -apple-system, sans-serif;
  --font-korean: 'Noto Sans KR', sans-serif;
  --font-korean-serif: 'Noto Serif KR', serif;

  /* Spacing scale */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 10rem;

  /* Transitions */
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --duration-fast: 200ms;
  --duration-mid: 320ms;
  --duration-slow: 600ms;
}

/* ------------------------------------------------------------------
   2. TYPOGRAPHY
   ------------------------------------------------------------------ */
.font-heading { font-family: var(--font-heading); }
.font-heading.italic, .font-heading[class*="italic"] { font-style: italic; }
.italic { font-style: italic; }

/* Editorial type scale */
.editorial-display {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(3rem, 7vw, 6.5rem);
  letter-spacing: -0.03em;
  line-height: 0.95;
  font-variation-settings: 'opsz' 72;
}

.editorial-display-sm {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  letter-spacing: -0.02em;
  line-height: 1.02;
  font-variation-settings: 'opsz' 56;
}

.editorial-h2 {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(2.25rem, 5vw, 4rem);
  line-height: 1;
  letter-spacing: -0.02em;
  font-variation-settings: 'opsz' 48;
}

.editorial-pullquote {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.375rem, 2.4vw, 2.125rem);
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.editorial-pullquote-sm {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.15rem, 1.9vw, 1.625rem);
  line-height: 1.3;
  letter-spacing: -0.008em;
}

/* ------------------------------------------------------------------
   3. LAYOUT UTILITIES
   ------------------------------------------------------------------ */
.grid-cols-12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.col-span-5  { grid-column: span 5 / span 5; }
.col-span-6  { grid-column: span 6 / span 6; }
.col-span-12 { grid-column: span 12 / span 12; }

@media (min-width: 1024px) {
  .lg\:col-span-5  { grid-column: span 5 / span 5; }
  .lg\:col-span-6  { grid-column: span 6 / span 6; }
  .lg\:col-span-12 { grid-column: span 12 / span 12; }
  .lg\:col-start-7 { grid-column-start: 7; }
  .lg\:col-start-8 { grid-column-start: 8; }
  .lg\:pt-16 { padding-top: 4rem; }
  .lg\:pt-20 { padding-top: 5rem; }
  .lg\:gap-20 { gap: 5rem; }
  .lg\:px-16 { padding-left: 4rem; padding-right: 4rem; }
  .lg\:py-48 { padding-top: 12rem; padding-bottom: 12rem; }
  .lg\:py-56 { padding-top: 14rem; padding-bottom: 14rem; }
  .lg\:mb-24 { margin-bottom: 6rem; }
}

@media (min-width: 768px) {
  .md\:col-span-1 { grid-column: span 1 / span 1; }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 640px) {
  .sm\:px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }
  .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
  .sm\:py-40 { padding-top: 10rem; padding-bottom: 10rem; }
  .sm\:py-44 { padding-top: 11rem; padding-bottom: 11rem; }
  .sm\:flex-row { flex-direction: row; }
  .sm\:gap-10 { gap: 2.5rem; }
}

/* Max-width containers */
.max-w-\[1400px\] { max-width: 1400px; }
.max-w-\[1200px\] { max-width: 1200px; }
.max-w-\[1100px\] { max-width: 1100px; }
.max-w-\[1000px\] { max-width: 1000px; }
.max-w-\[760px\]  { max-width: 760px; }
.max-w-7xl { max-width: 80rem; }

/* Sizing */
.min-h-screen { min-height: 100vh; }
.min-h-\[88vh\]  { min-height: 88vh; }
.min-h-\[95vh\]  { min-height: 95vh; }
.w-full { width: 100%; }
.h-full { height: 100%; }
.h-12 { height: 3rem; }
.h-20 { height: 5rem; }
.h-px { height: 1px; }
.w-auto { width: auto; }
.w-4 { width: 1rem; }
.w-5 { width: 1.25rem; }
.w-6 { width: 1.5rem; }
.h-4 { height: 1rem; }
.h-5 { height: 1.25rem; }
.h-6 { height: 1.5rem; }
.w-12 { width: 3rem; }

/* Display & positioning */
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.top-0 { top: 0; }
.left-0 { left: 0; }
.right-0 { right: 0; }
.block { display: block; }
.inline-block { display: inline-block; }
.inline-flex { display: inline-flex; }
.flex { display: flex; }
.grid { display: grid; }
.hidden { display: none; }
.overflow-hidden { overflow: hidden; }

/* Flexbox */
.items-center { align-items: center; }
.items-start { align-items: start; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-1 { flex: 1; }

/* Gaps */
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-10 { gap: 2.5rem; }
.gap-12 { gap: 3rem; }

/* Spacing */
.mx-auto { margin-left: auto; margin-right: auto; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.p-2 { padding: 0.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }
.mb-20 { margin-bottom: 5rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-8 { margin-top: 2rem; }
.mt-12 { margin-top: 3rem; }
.mt-14 { margin-top: 3.5rem; }
.mt-20 { margin-top: 5rem; }
.my-12 { margin-top: 3rem; margin-bottom: 3rem; }
.pt-8 { padding-top: 2rem; }
.pt-12 { padding-top: 3rem; }
.pb-6 { padding-bottom: 1.5rem; }
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-5 > * + * { margin-top: 1.25rem; }

/* Typography utilities */
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-\[10px\] { font-size: 10px; line-height: 1.5; }
.text-\[10\.5px\] { font-size: 10.5px; line-height: 1.5; }
.text-\[11px\] { font-size: 11px; line-height: 1.5; }
.text-\[17px\] { font-size: 17px; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.leading-relaxed { line-height: 1.625; }
.leading-loose { line-height: 2; }
.leading-\[0\.95\] { line-height: 0.95; }
.leading-\[0\.98\] { line-height: 0.98; }
.leading-\[1\.02\] { line-height: 1.02; }
.leading-\[1\.2\]  { line-height: 1.2; }
.tracking-\[0\.15em\] { letter-spacing: 0.15em; }
.tracking-\[0\.18em\] { letter-spacing: 0.18em; }
.tracking-\[0\.2em\]  { letter-spacing: 0.2em; }
.tracking-\[0\.22em\] { letter-spacing: 0.22em; }
.tracking-\[0\.25em\] { letter-spacing: 0.25em; }
.tracking-\[0\.28em\] { letter-spacing: 0.28em; }
.tracking-\[0\.3em\]  { letter-spacing: 0.3em; }
.uppercase { text-transform: uppercase; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* Colors */
.text-white { color: #ffffff; }
.text-gray-500 { color: var(--gray-500); }
.text-gray-600 { color: var(--gray-600); }
.text-gray-700 { color: var(--gray-700); }
.text-gray-900 { color: var(--gray-900); }
.text-ocean-200 { color: var(--ocean-200); }
.text-ocean-300 { color: var(--ocean-300); }
.text-ocean-500 { color: var(--ocean-500); }
.bg-white { background-color: #ffffff; }
.bg-sand-50 { background-color: var(--sand-50); }
.bg-sand-100 { background-color: var(--sand-100); }
.bg-gray-50 { background-color: var(--gray-50); }

/* Object-fit */
.object-cover { object-fit: cover; }

/* Z-index */
.z-10 { z-index: 10; }
.z-50 { z-index: 50; }

/* Borders */
.border-t { border-top: 1px solid; }
.border-ocean-700 { border-color: var(--ocean-700); }
.border-white\/10 { border-color: rgba(255,255,255,0.1); }
.rounded { border-radius: 0.25rem; }

/* Transitions */
.transition-colors { transition: color var(--duration-fast) ease, background-color var(--duration-fast) ease, border-color var(--duration-fast) ease; }
.transition-all { transition: all 300ms ease; }
.duration-300 { transition-duration: 300ms; }

/* Hover utilities */
.hover\:text-white:hover { color: #ffffff; }

/* Pointer & selection */
.pointer-events-none { pointer-events: none; }
.user-select-none { user-select: none; }

/* Grid columns */
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }

/* Responsive display */
@media (min-width: 1024px) {
  .lg\:flex { display: flex; }
  .lg\:hidden { display: none; }
  .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; }
}
@media (max-width: 1023px) {
  .lg\:flex { display: none; }
  /* .lg:hidden does NOT force display at small viewports — that would
     override the .hidden toggle class used by the mobile menu. */
}

/* ------------------------------------------------------------------
   4. SCROLL PROGRESS INDICATOR
   ------------------------------------------------------------------ */
.scroll-indicator {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  z-index: 100;
  background: transparent;
}
.scroll-indicator-fill {
  height: 100%;
  width: 0%;
  background: var(--ocean-500);
  opacity: 0.6;
  transition: width 80ms linear;
}

/* ------------------------------------------------------------------
   5. NAVIGATION
   ------------------------------------------------------------------ */
#main-nav {
  transition: background var(--duration-mid) ease, box-shadow var(--duration-mid) ease;
}

/* Transparent state (over hero) */
#main-nav .nav-link { color: rgba(255,255,255,0.85); transition: color var(--duration-fast) ease; }
#main-nav .nav-link:hover { color: #ffffff; }
#main-nav .nav-logo-white { display: block; }
#main-nav .nav-logo-color { display: none; }

/* Scrolled / solid state */
#main-nav.nav-scrolled {
  background: rgba(255,255,255,0.97);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(26,82,118,0.08);
}
#main-nav.nav-scrolled .nav-link { color: var(--gray-700); }
#main-nav.nav-scrolled .nav-link:hover { color: var(--ocean-500); }
#main-nav.nav-scrolled .nav-logo-white { display: none; }
#main-nav.nav-scrolled .nav-logo-color { display: block; }

/* Nav CTA button */
#main-nav .btn-primary {
  padding: 0.6rem 1.4rem;
  font-size: 0.8125rem;
}

/* Mobile menu */
#mobile-menu {
  background: var(--white);
  box-shadow: 0 16px 48px rgba(0,0,0,0.12);
}

/* ------------------------------------------------------------------
   6. BUTTONS & LINKS
   ------------------------------------------------------------------ */
.btn-primary,
a.btn-primary,
button.btn-primary {
  display: inline-block;
  background: var(--ocean-500);
  color: #ffffff;
  border: 1px solid var(--ocean-500);
  border-radius: 2px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.9375rem;
  letter-spacing: 0.02em;
  padding: 0.9rem 2.2rem;
  transition: background var(--duration-fast) ease, transform var(--duration-fast) ease;
}
.btn-primary:hover {
  background: #0F3A52;
  border-color: #0F3A52;
}

.editorial-link {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  font-size: 0.9375rem;
  color: var(--ocean-500);
  font-weight: 500;
  border-bottom: 1px solid rgba(26,82,118,0.3);
  padding-bottom: 0.2rem;
  transition: border-color var(--duration-fast) ease, gap var(--duration-mid) ease;
}
.editorial-link:hover { border-color: var(--ocean-500); gap: 0.8rem; }
.editorial-link--light { color: #ffffff; border-color: rgba(255,255,255,0.4); }
.editorial-link--light:hover { border-color: #ffffff; }
.editorial-link__arrow {
  font-size: 1.05rem;
  line-height: 1;
  transition: transform var(--duration-mid) ease;
}
.editorial-link:hover .editorial-link__arrow { transform: translateX(3px); }

/* ------------------------------------------------------------------
   7. EDITORIAL SECTION BASE
   ------------------------------------------------------------------ */
.editorial-section {
  padding-top: clamp(6rem, 12vw, 12rem);
  padding-bottom: clamp(6rem, 12vw, 12rem);
}

.editorial-eyebrow {
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  margin-bottom: 2rem;
  font-weight: 500;
}

.hairline-rule {
  width: 56px;
  height: 1px;
  background: rgba(26,82,118,0.18);
}
.hairline-light { background: rgba(255,255,255,0.2); }

/* ------------------------------------------------------------------
   8. HERO — cinematic film-poster composition
   ------------------------------------------------------------------ */
.hero-cinematic {
  color: #ffffff;
  background: var(--ocean-900);
}

/* Video/image background gradient */
.hero-bg-layer {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg,
      rgba(10,14,26,0.2) 0%,
      rgba(10,14,26,0.02) 25%,
      rgba(10,14,26,0.35) 65%,
      rgba(10,14,26,0.88) 100%),
    radial-gradient(ellipse at 50% 110%, rgba(10,14,26,0.5) 0%, transparent 65%);
}

/* Top-right establishing stamp */
.hero-stamp {
  position: absolute;
  top: 7rem;
  right: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 10px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  z-index: 10;
  font-variant-numeric: tabular-nums;
}
.hero-stamp__rule { width: 28px; height: 1px; background: rgba(255,255,255,0.3); display: block; }
@media (min-width: 640px) { .hero-stamp { top: 7rem; right: 2.5rem; } }
@media (min-width: 1024px) { .hero-stamp { top: 8rem; right: 4rem; } }

/* Lower-left content cluster */
.hero-content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(5rem, 10vh, 9rem);
  z-index: 10;
  max-width: 820px;
}
@media (min-width: 640px) { .hero-content { left: 2.5rem; right: 2.5rem; } }
@media (min-width: 1024px) { .hero-content { left: 4rem; right: auto; bottom: clamp(6rem, 12vh, 11rem); } }

.hero-kicker {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  margin-bottom: 2rem;
  font-weight: 500;
  display: inline-block;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}

.hero-headline {
  color: #ffffff;
  margin-bottom: 2rem;
  text-shadow: 0 2px 40px rgba(0,0,0,0.5);
}
.hero-line { display: block; }
.hero-line + .hero-line { padding-left: 0.12em; }

.hero-subtitle {
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  color: rgba(255,255,255,0.85);
  font-weight: 300;
  line-height: 1.55;
  letter-spacing: 0.005em;
  max-width: 28rem;
  margin-bottom: 2.75rem;
  text-shadow: 0 1px 24px rgba(0,0,0,0.4);
}

.hero-actions {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.hero-sep { color: rgba(255,255,255,0.3); font-size: 14px; }
.hero-text-link {
  color: rgba(255,255,255,0.78);
  font-size: 0.9375rem;
  font-weight: 400;
  letter-spacing: 0.01em;
  border-bottom: 1px solid rgba(255,255,255,0.35);
  padding-bottom: 0.2rem;
  transition: color var(--duration-fast) ease, border-color var(--duration-fast) ease;
}
.hero-text-link:hover { color: #ffffff; border-color: #ffffff; }

/* Scroll hint */
.hero-scroll-hint {
  position: absolute;
  right: 1.5rem;
  bottom: 2.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 10px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  z-index: 10;
}
.hero-scroll-hint__line {
  display: block;
  width: 44px;
  height: 1px;
  background: rgba(255,255,255,0.25);
  animation: scroll-pulse 3s ease-in-out infinite;
}
@keyframes scroll-pulse {
  0%, 100% { transform: scaleX(1); opacity: 0.25; }
  50%      { transform: scaleX(1.4); opacity: 0.65; }
}
@media (min-width: 640px) { .hero-scroll-hint { right: 2.5rem; } }
@media (min-width: 1024px) { .hero-scroll-hint { right: 4rem; } }

/* ------------------------------------------------------------------
   9. MINSEO / FOUNDER SECTION
   ------------------------------------------------------------------ */
.minseo-section {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #FAFAF8 0%, var(--sand-50) 60%, var(--sand-100) 100%);
}
.minseo-section > * { position: relative; z-index: 1; }

/* 바다 watermark */
.bada-mark {
  position: absolute;
  font-family: var(--font-korean);
  font-weight: 200;
  color: rgba(26,82,118,0.04);
  pointer-events: none;
  user-select: none;
  line-height: 1;
  letter-spacing: -0.02em;
  font-size: clamp(10rem, 18vw, 16rem);
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
  z-index: 0;
  white-space: nowrap;
}
@media (max-width: 1024px) {
  .bada-mark {
    font-size: clamp(6rem, 22vw, 11rem);
    top: auto;
    bottom: 2rem;
    right: 1rem;
    transform: none;
  }
}

/* Founder figure */
.founder-figure {
  position: relative;
  margin-top: clamp(0rem, 6vw, 6rem);
}
.founder-figure::before {
  content: '';
  position: absolute;
  top: -2rem;
  left: -2rem;
  right: 2rem;
  bottom: 2rem;
  background: rgba(26,82,118,0.04);
  z-index: -1;
}
@media (min-width: 1024px) {
  .founder-figure::before { top: -3rem; left: -3rem; right: 3rem; bottom: 3rem; }
}

.founder-img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  filter: contrast(1.04) saturate(0.95);
  display: block;
}
.founder-figure::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10,14,26,0) 55%, rgba(10,14,26,0.3) 100%);
  pointer-events: none;
}

.founder-caption {
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 10.5px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
}
.founder-caption__rule {
  flex: 1;
  height: 1px;
  background: rgba(26,82,118,0.18);
  max-width: 5rem;
}

.founder-quote {
  border-left: 1px solid rgba(26,82,118,0.12);
  padding: 0.5rem 0 0.5rem 1.75rem;
  margin: 3.5rem 0;
}
.founder-quote p,
.founder-quote .editorial-pullquote-sm {
  font-size: clamp(1.3rem, 2.2vw, 1.875rem);
  line-height: 1.5;
  letter-spacing: -0.008em;
  color: rgba(26,82,118,0.88);
}

/* ------------------------------------------------------------------
   10. SAIL ROCK — cinematic signature moment
   ------------------------------------------------------------------ */
.signature-section {
  background: var(--ocean-900);
  position: relative;
  min-height: 100vh;
  color: #ffffff;
}

.signature-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform 1800ms var(--ease-out);
}
.signature-section a:hover .signature-img { transform: scale(1.04); }

.signature-bg-gradient {
  background: linear-gradient(
    95deg,
    rgba(10,14,26,0.92) 0%,
    rgba(10,14,26,0.58) 42%,
    rgba(10,14,26,0.12) 72%,
    rgba(10,14,26,0.25) 100%
  );
}

.signature-vignette {
  background:
    linear-gradient(180deg,
      rgba(10,14,26,1) 0%,
      rgba(10,14,26,0.6) 8%,
      transparent 22%,
      transparent 68%,
      rgba(10,14,26,0.85) 100%);
  pointer-events: none;
}

.signature-stamp {
  position: absolute;
  top: 3rem;
  right: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 10px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  z-index: 10;
  font-variant-numeric: tabular-nums;
}
.signature-stamp__rule {
  display: block;
  width: 44px;
  height: 1px;
  background: rgba(255,255,255,0.3);
}
@media (min-width: 640px) { .signature-stamp { top: 4rem; right: 2.5rem; } }
@media (min-width: 1024px) { .signature-stamp { top: 5rem; right: 4rem; } }

.signature-content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 640px;
  z-index: 10;
}
@media (min-width: 640px) { .signature-content { left: 2.5rem; bottom: clamp(5rem, 10vh, 8rem); } }
@media (min-width: 1024px) { .signature-content { left: 4rem; right: auto; bottom: clamp(6rem, 12vh, 10rem); } }

.signature-headline {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(3rem, 6.5vw, 6rem);
  letter-spacing: -0.03em;
  line-height: 0.95;
  color: #ffffff;
  margin-bottom: 2rem;
  font-variation-settings: 'opsz' 72;
  text-shadow: 0 2px 40px rgba(0,0,0,0.5);
}

.signature-body {
  font-size: clamp(1rem, 1.25vw, 1.125rem);
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  font-weight: 300;
  max-width: 34rem;
  margin-bottom: 2.75rem;
}

.signature-meta {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2.25rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(255,255,255,0.18);
}
.signature-price {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
  color: #ffffff;
  letter-spacing: -0.015em;
}
.signature-meta__rule {
  width: 24px;
  height: 1px;
  background: rgba(255,255,255,0.25);
  display: block;
}
.signature-meta__label {
  font-size: 10px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
}
.signature-cta {
  font-size: 0.875rem;
  letter-spacing: 0.02em;
}

/* ------------------------------------------------------------------
   11. DAYS LIST
   ------------------------------------------------------------------ */
.days-list {
  position: relative;
  border-top: 1px solid rgba(26,82,118,0.12);
  list-style: none;
  padding: 0;
  margin: 0;
}

.days-list__item {
  position: relative;
  border-bottom: 1px solid rgba(26,82,118,0.12);
  transition: opacity 400ms ease;
}
.days-list:hover .days-list__item { opacity: 0.45; }
.days-list:hover .days-list__item:hover { opacity: 1; }

.days-list__row {
  position: relative;
  display: grid;
  grid-template-columns: 80px minmax(210px, 260px) 1fr 130px 28px;
  align-items: center;
  gap: 1.75rem;
  padding: 3.25rem 0;
  color: inherit;
  transition: padding-left var(--duration-mid) ease;
}
.days-list__row:hover { padding-left: 1rem; }

.days-list__number,
.days-list__name,
.days-list__desc,
.days-list__price,
.days-list__arrow {
  position: relative;
  z-index: 2;
}

.days-list__number {
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.35);
  transition: letter-spacing 300ms ease, color 300ms ease;
}
.days-list__name {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: clamp(1.375rem, 2.4vw, 2rem);
  color: var(--ocean-500);
  letter-spacing: -0.015em;
  line-height: 1;
  white-space: nowrap;
  word-break: keep-all;
  overflow: hidden;
}
.days-list__desc {
  font-size: 0.9375rem;
  color: var(--gray-600);
  line-height: 1.55;
}
.days-list__price {
  font-size: 0.9375rem;
  color: var(--ocean-500);
  text-align: right;
  letter-spacing: 0.01em;
  font-feature-settings: 'tnum';
  font-weight: 500;
}
.days-list__arrow {
  color: rgba(26,82,118,0.35);
  font-size: 1.1rem;
  text-align: right;
  transition: transform 300ms ease, color 300ms ease;
}

/* Hover states */
.days-list__item:hover .days-list__number { letter-spacing: 0.32em; color: rgba(26,82,118,0.7); }
.days-list__item:hover .days-list__name { color: #0F3A52; }
.days-list__item:hover .days-list__arrow { transform: translateX(4px); color: var(--ocean-500); }

/* Preview image on hover */
.days-list__preview {
  position: absolute;
  top: 50%;
  right: 7rem;
  transform: translateY(-50%) translateX(20px);
  width: 480px;
  height: 280px;
  object-fit: cover;
  opacity: 0;
  filter: brightness(0.92) saturate(0.95);
  transition: opacity 250ms ease, transform var(--duration-mid) var(--ease-out);
  pointer-events: none;
  z-index: 5;
  box-shadow: 0 24px 64px rgba(0,0,0,0.3), 0 8px 24px rgba(0,0,0,0.2);
  border-radius: 2px;
}
.days-list__item:hover .days-list__preview {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

@media (max-width: 1200px) {
  .days-list__preview { display: none; }
}

@media (max-width: 900px) {
  .days-list__row {
    grid-template-columns: 56px 1fr auto;
    grid-template-areas:
      "num name price"
      "num desc arrow";
    gap: 0.35rem 1rem;
    padding: 1.75rem 0;
  }
  .days-list__number { grid-area: num; align-self: start; padding-top: 0.35rem; }
  .days-list__name   { grid-area: name; font-size: 1.5rem; }
  .days-list__desc   { grid-area: desc; font-size: 0.875rem; margin-top: 0.25rem; }
  .days-list__price  { grid-area: price; font-size: 0.875rem; }
  .days-list__arrow  { grid-area: arrow; align-self: end; }
  .days-list__row:hover { padding-left: 0; }
}

/* ------------------------------------------------------------------
   12. TRIP CARDS — visual grid replacing the directory list
   ------------------------------------------------------------------ */
.trip-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

/* Large cards: top row */
.trip-card--large {
  grid-column: span 1;
}

/* Small cards: bottom row, 3 across */
.trip-card:not(.trip-card--large) {
  /* auto-placed into bottom row */
}

.trip-card {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 3px;
  aspect-ratio: 3 / 2;
}
.trip-card--large {
  aspect-ratio: 4 / 3;
}

.trip-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 800ms var(--ease-out);
}
.trip-card:hover .trip-card__img {
  transform: scale(1.06);
}

.trip-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
    rgba(10,14,26,0) 30%,
    rgba(10,14,26,0.55) 70%,
    rgba(10,14,26,0.85) 100%);
  transition: background var(--duration-mid) ease;
}
.trip-card:hover .trip-card__overlay {
  background: linear-gradient(180deg,
    rgba(10,14,26,0) 20%,
    rgba(10,14,26,0.5) 60%,
    rgba(10,14,26,0.88) 100%);
}

.trip-card__content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 2rem;
  z-index: 2;
  color: #ffffff;
}
.trip-card--large .trip-card__content {
  padding: 2.5rem;
}

.trip-card__number {
  display: block;
  font-size: 10px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-bottom: 0.75rem;
}

.trip-card__name {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
  letter-spacing: -0.015em;
  line-height: 1;
  margin-bottom: 0.75rem;
}
.trip-card:not(.trip-card--large) .trip-card__name {
  font-size: clamp(1.25rem, 2vw, 1.75rem);
}

.trip-card__desc {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.7);
  line-height: 1.5;
  max-width: 26rem;
  margin-bottom: 1rem;
}

.trip-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,0.15);
}

.trip-card__price {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 1.125rem;
  color: rgba(255,255,255,0.9);
  letter-spacing: -0.01em;
}

.trip-card__arrow {
  color: rgba(255,255,255,0.4);
  font-size: 1.1rem;
  transition: transform 300ms ease, color 300ms ease;
}
.trip-card:hover .trip-card__arrow {
  transform: translateX(4px);
  color: #ffffff;
}

/* Responsive: stack on mobile */
@media (max-width: 768px) {
  .trip-grid {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
  .trip-card { aspect-ratio: 16 / 10; }
  .trip-card--large { aspect-ratio: 16 / 10; }
}

/* Desktop: 2 top, 3 bottom */
@media (min-width: 769px) {
  .trip-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
  }
  .trip-card--large:nth-child(1) { grid-column: 1 / 4; }
  .trip-card--large:nth-child(2) { grid-column: 4 / 7; }
  .trip-card:not(.trip-card--large):nth-child(3) { grid-column: 1 / 3; }
  .trip-card:not(.trip-card--large):nth-child(4) { grid-column: 3 / 5; }
  .trip-card:not(.trip-card--large):nth-child(5) { grid-column: 5 / 7; }
}

/* ------------------------------------------------------------------
   12b. SINGLE QUOTE — editorial layout
   ------------------------------------------------------------------ */
.quote-section {
  padding-top: clamp(4rem, 8vw, 8rem);
  padding-bottom: clamp(4rem, 8vw, 8rem);
  background: var(--sand-50);
}

.quote-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 768px) {
  .quote-layout {
    grid-template-columns: 1fr 1fr;
    gap: clamp(3rem, 6vw, 6rem);
  }
}

.quote-image-col { position: relative; }

.quote-image {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 2px;
  filter: contrast(1.03) saturate(0.95);
}

.quote-block { position: relative; }

.quote-mark {
  width: 40px;
  height: 32px;
  color: rgba(26,82,118,0.1);
  margin-bottom: 2rem;
}

.quote-text {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.5rem, 2.8vw, 2.25rem);
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: var(--ocean-500);
  margin-bottom: 2.5rem;
}

.quote-footer { margin-bottom: 3rem; }

.quote-author {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--gray-900);
  margin-bottom: 0.35rem;
}

.quote-origin {
  font-size: 10px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
}

.quote-review-link { margin-top: 0; }

.editorial-link--dark {
  color: var(--ocean-500);
  border-color: rgba(26,82,118,0.3);
}
.editorial-link--dark:hover {
  border-color: var(--ocean-500);
}

/* ------------------------------------------------------------------
   13. FINAL CTA — cinematic closing
   ------------------------------------------------------------------ */
.final-cta-section {
  position: relative;
  overflow: hidden;
  min-height: 95vh;
  background: var(--ocean-900);
  color: #ffffff;
}
.final-cta-section img {
  transform: scale(1.02);
  filter: contrast(1.02);
}

.final-cta-overlay {
  background:
    linear-gradient(105deg,
      rgba(10,14,26,0.92) 0%,
      rgba(10,14,26,0.75) 45%,
      rgba(10,14,26,0.5) 100%),
    linear-gradient(180deg,
      rgba(10,14,26,0.3) 0%,
      transparent 30%,
      rgba(10,14,26,0.75) 100%);
}

.final-cta-mark {
  position: absolute;
  right: -0.06em;
  bottom: -0.14em;
  font-family: var(--font-korean);
  font-weight: 200;
  color: rgba(255,255,255,0.06);
  font-size: clamp(14rem, 32vw, 34rem);
  line-height: 0.82;
  pointer-events: none;
  user-select: none;
  z-index: 1;
  white-space: nowrap;
  letter-spacing: -0.04em;
}

.final-cta-content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 640px;
  z-index: 10;
}
@media (min-width: 640px) { .final-cta-content { left: 2.5rem; bottom: clamp(5rem, 10vh, 8rem); } }
@media (min-width: 1024px) { .final-cta-content { left: 4rem; right: auto; bottom: clamp(6rem, 12vh, 10rem); } }

.final-cta-kicker {
  font-size: 11px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  font-weight: 500;
  margin-bottom: 2rem;
  display: inline-block;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}

.final-cta-headline {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(2.75rem, 6vw, 5.25rem);
  letter-spacing: -0.025em;
  line-height: 1;
  margin-bottom: 2rem;
  text-shadow: 0 2px 40px rgba(0,0,0,0.5);
}

.final-cta-body {
  font-size: clamp(1rem, 1.25vw, 1.125rem);
  color: rgba(255,255,255,0.75);
  font-weight: 300;
  line-height: 1.6;
  max-width: 32rem;
  margin-bottom: 2.75rem;
}

.final-cta-actions {
  display: flex;
  align-items: center;
  gap: 1.75rem;
  flex-wrap: wrap;
  margin-bottom: 2.75rem;
}

.final-cta-link {
  color: rgba(255,255,255,0.78);
  font-size: 0.9375rem;
  font-weight: 400;
  letter-spacing: 0.01em;
  border-bottom: 1px solid rgba(255,255,255,0.35);
  padding-bottom: 0.2rem;
  transition: color var(--duration-fast) ease, border-color var(--duration-fast) ease;
}
.final-cta-link:hover { color: #ffffff; border-color: #ffffff; }

.final-cta-trust {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  line-height: 1.8;
}

/* ------------------------------------------------------------------
   14. FOOTER
   ------------------------------------------------------------------ */
footer.bg-ocean-900 {
  background: var(--ocean-900);
  color: #ffffff;
}
footer .font-heading {
  font-family: var(--font-heading);
}

/* ------------------------------------------------------------------
   15. REVEAL ANIMATIONS
   Elements are visible by default. Animation is additive.
   ------------------------------------------------------------------ */
.reveal {
  opacity: 1;
  transform: translateY(0);
  transition: opacity var(--duration-slow) ease, transform var(--duration-slow) var(--ease-out);
}
.reveal.reveal--hidden {
  opacity: 0;
  transform: translateY(32px);
}

.reveal-delay-1 { transition-delay: 120ms; }
.reveal-delay-2 { transition-delay: 240ms; }
.reveal-delay-3 { transition-delay: 360ms; }
.reveal-delay-4 { transition-delay: 480ms; }

.reveal-dramatic {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 800ms ease, transform 800ms var(--ease-out);
}
.reveal-dramatic.reveal--hidden {
  opacity: 0;
  transform: translateY(48px);
}

/* ------------------------------------------------------------------
   16. FILM GRAIN TEXTURE (subtle, cinematic)
   ------------------------------------------------------------------ */
.hero-cinematic::after,
.signature-section::after,
.final-cta-section::after {
  content: '';
  position: absolute;
  inset: 0;
  opacity: 0.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
  pointer-events: none;
  z-index: 2;
  mix-blend-mode: overlay;
}

/* ------------------------------------------------------------------
   17. RESPONSIVE HELPERS
   ------------------------------------------------------------------ */
@media (max-width: 639px) {
  .hero-content { bottom: 4rem; }
  .hero-headline { font-size: 2.75rem; }
  .signature-headline { font-size: 2.75rem; }
  .final-cta-headline { font-size: 2.5rem; }
}

/* Shadow */
.shadow-xl { box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1); }

/* Opacity */
.opacity-40 { opacity: 0.4; }
.opacity-80 { opacity: 0.8; }
.group:hover .group-hover\:opacity-100 { opacity: 1; }
.transition-opacity { transition: opacity var(--duration-fast) ease; }

/* Print */
@media print {
  .scroll-indicator,
  #main-nav,
  .hero-scroll-hint,
  .hero-stamp,
  .signature-stamp { display: none; }
}

/* ------------------------------------------------------------------
   18. CUSTOM SCROLLBAR (subtle)
   ------------------------------------------------------------------ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(26,82,118,0.2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(26,82,118,0.35); }

/* ==================================================================
   TRIP DETAIL PAGES — editorial composition
   ================================================================== */

/* Hero */
.trip-hero {
  position: relative;
  min-height: 85vh;
  color: #ffffff;
  background: var(--ocean-900);
}
.trip-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.trip-hero__gradient {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(95deg, rgba(10,14,26,0.88) 0%, rgba(10,14,26,0.55) 45%, rgba(10,14,26,0.2) 75%, rgba(10,14,26,0.45) 100%),
    linear-gradient(180deg, rgba(10,14,26,0.5) 0%, transparent 18%, transparent 65%, rgba(10,14,26,0.75) 100%);
}
.trip-hero__stamp {
  position: absolute;
  top: 7rem;
  right: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  z-index: 10;
  font-variant-numeric: tabular-nums;
}
.trip-hero__stamp-rule {
  display: block;
  width: 40px;
  height: 1px;
  background: rgba(255,255,255,0.35);
}
.trip-hero__coords {
  display: inline-block;
  padding-left: 0.9rem;
  margin-left: 0.25rem;
  border-left: 1px solid rgba(255,255,255,0.25);
  color: rgba(255,255,255,0.5);
}
@media (min-width: 640px) { .trip-hero__stamp { top: 8rem; right: 2.5rem; } }
@media (min-width: 1024px) { .trip-hero__stamp { top: 8rem; right: 4rem; } }

.trip-hero__content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 680px;
  z-index: 10;
}
@media (min-width: 640px) { .trip-hero__content { left: 2.5rem; } }
@media (min-width: 1024px) { .trip-hero__content { left: 4rem; right: auto; bottom: clamp(5rem, 10vh, 8rem); } }

.trip-hero__kicker {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  margin-bottom: 1.5rem;
  font-weight: 500;
  display: inline-block;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.25);
}
.trip-hero__headline {
  font-size: clamp(2.75rem, 6.2vw, 5.5rem);
  letter-spacing: -0.03em;
  line-height: 0.95;
  margin-bottom: 2rem;
  font-weight: 400;
  text-shadow: 0 2px 32px rgba(0,0,0,0.45);
}
.trip-hero__meta {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid rgba(255,255,255,0.22);
}
.trip-hero__price {
  font-size: clamp(1.5rem, 2.4vw, 2.125rem);
  letter-spacing: -0.015em;
}
.trip-hero__rule {
  display: block;
  width: 20px;
  height: 1px;
  background: rgba(255,255,255,0.3);
}
.trip-hero__per-guest {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}
.trip-hero__actions {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.trip-hero__text-link {
  color: rgba(255,255,255,0.85);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(255,255,255,0.4);
  padding-bottom: 0.2rem;
  transition: color 200ms ease, border-color 200ms ease;
}
.trip-hero__text-link:hover { color: #ffffff; border-color: #ffffff; }

/* Editorial about-the-day section */
.trip-editorial { padding: clamp(5rem, 10vw, 10rem) 0; background: #ffffff; }
.trip-editorial__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 900px) {
  .trip-editorial__inner {
    grid-template-columns: minmax(220px, 1fr) 2fr;
    gap: 5rem;
    padding: 0 2.5rem;
  }
}
.trip-editorial__lede .editorial-eyebrow { margin-bottom: 1.5rem; }
.trip-editorial__body {
  font-size: clamp(1.1rem, 1.3vw, 1.25rem);
  line-height: 1.65;
  color: #374151;
  max-width: 42rem;
}

/* Highlights */
.trip-highlights { padding: clamp(5rem, 10vw, 10rem) 0; background: #FDFBF7; }
.trip-highlights__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 768px) { .trip-highlights__inner { padding: 0 2.5rem; } }
.trip-highlights__head { margin-bottom: 4rem; max-width: 600px; }
.trip-highlights__list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.trip-highlights__item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: baseline;
  gap: 2rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid rgba(26,82,118,0.15);
}
.trip-highlights__num {
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.4);
  font-variant-numeric: tabular-nums;
}
.trip-highlights__text {
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  line-height: 1.5;
  color: #374151;
}

/* Aboard + Shaped for */
.trip-aboard { padding: clamp(5rem, 10vw, 10rem) 0; background: #ffffff; }
.trip-aboard__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4rem;
}
@media (min-width: 900px) {
  .trip-aboard__inner {
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    padding: 0 2.5rem;
  }
}
.trip-aboard__col .editorial-eyebrow { margin-bottom: 1.25rem; }
.trip-aboard__col .editorial-h2 { margin-bottom: 2rem; color: #1A5276; }
.trip-aboard__list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.trip-aboard__list li {
  padding: 1rem 0;
  border-bottom: 1px solid rgba(26,82,118,0.1);
  color: #374151;
  font-size: 0.95rem;
  line-height: 1.5;
}
.trip-aboard__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 2.5rem;
}
.trip-aboard__tag {
  display: inline-block;
  padding: 0.4rem 0.9rem;
  border: 1px solid rgba(26,82,118,0.25);
  border-radius: 2px;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #1A5276;
}
.trip-aboard__logistics { display: grid; gap: 1.5rem; }
.trip-aboard__label {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  margin-bottom: 0.35rem;
}
.trip-aboard__value { color: #1A5276; font-size: 0.9375rem; line-height: 1.5; }

/* Gallery */
.trip-gallery { padding: clamp(5rem, 10vw, 10rem) 0; background: #FDFBF7; }
.trip-gallery__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 768px) { .trip-gallery__inner { padding: 0 2.5rem; } }
.trip-gallery .editorial-eyebrow { margin-bottom: 1rem; }
.trip-gallery__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
@media (min-width: 640px) {
  .trip-gallery__grid { grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
}
@media (min-width: 1024px) {
  .trip-gallery__grid { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
  .trip-gallery__figure--0 { grid-row: span 2; }
}
.trip-gallery__figure { margin: 0; overflow: hidden; }
.trip-gallery__img {
  width: 100%;
  height: 100%;
  min-height: 240px;
  object-fit: cover;
  display: block;
  transition: transform 900ms cubic-bezier(.2,.8,.2,1);
}
.trip-gallery__figure--0 .trip-gallery__img { min-height: 500px; }
.trip-gallery__figure:hover .trip-gallery__img { transform: scale(1.03); }

/* Final CTA */
.trip-final-cta {
  background: var(--ocean-900);
  color: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
  position: relative;
  overflow: hidden;
}
.trip-final-cta::before {
  content: "바다";
  position: absolute;
  right: -0.08em;
  bottom: -0.2em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 200;
  color: rgba(255,255,255,0.05);
  font-size: clamp(12rem, 22vw, 22rem);
  line-height: 1;
  pointer-events: none;
  z-index: 1;
  white-space: nowrap;
  letter-spacing: -0.04em;
}
.trip-final-cta__inner {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 640px) { .trip-final-cta__inner { padding: 0 2.5rem; } }
.trip-final-cta__headline {
  font-size: clamp(2.25rem, 4.8vw, 4rem);
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 1rem 0 1.5rem;
  text-shadow: 0 2px 32px rgba(0,0,0,0.5);
  font-weight: 400;
}
.trip-final-cta__body {
  color: rgba(255,255,255,0.8);
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  font-weight: 300;
  line-height: 1.55;
  max-width: 32rem;
  margin-bottom: 2.5rem;
}
.trip-final-cta__actions {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
}
.trip-final-cta__link {
  color: rgba(255,255,255,0.85);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(255,255,255,0.4);
  padding-bottom: 0.2rem;
  transition: color 200ms ease, border-color 200ms ease;
}
.trip-final-cta__link:hover { color: #ffffff; border-color: #ffffff; }
.trip-final-cta__price {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1.5rem 0;
  border-top: 1px solid rgba(255,255,255,0.15);
  border-bottom: 1px solid rgba(255,255,255,0.15);
  margin-bottom: 1.75rem;
}
.trip-final-cta__price > span:first-child {
  font-size: clamp(1.5rem, 2.2vw, 2rem);
  letter-spacing: -0.015em;
}
.trip-final-cta__price-meta {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}
.trip-final-cta__trust {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  line-height: 1.6;
}

/* Other days section on trip page */
.trip-other-days { padding: clamp(5rem, 10vw, 10rem) 0; background: #ffffff; }
.trip-other-days__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 768px) { .trip-other-days__inner { padding: 0 2.5rem; } }
.trip-other-days .editorial-eyebrow { margin-bottom: 2.5rem; }


/* Two-Day Crossing — day one / day two structure */
.crossing-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 900px) {
  .crossing-grid { grid-template-columns: 1fr 1fr; gap: 5rem; }
}
.crossing-day__label {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  padding-bottom: 0.6rem;
  border-bottom: 1px solid rgba(26,82,118,0.2);
  margin-bottom: 1.5rem;
  display: inline-block;
}
.crossing-day__title {
  font-size: clamp(1.75rem, 3vw, 2.75rem);
  letter-spacing: -0.02em;
  line-height: 1;
  color: #1A5276;
  margin-bottom: 1.5rem;
  font-weight: 400;
}
.crossing-day__body {
  color: #374151;
  font-size: 1rem;
  line-height: 1.65;
}


/* ==================================================================
   REVIEWS PAGE
   ================================================================== */
.reviews-hero {
  background: #FDFBF7;
  padding: clamp(7rem, 14vw, 12rem) 1.5rem clamp(5rem, 10vw, 8rem);
}
.reviews-hero__inner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}
.reviews-hero__eyebrow { margin-bottom: 1.5rem; }
.reviews-hero__headline {
  font-size: clamp(2.5rem, 6vw, 5rem);
  letter-spacing: -0.025em;
  line-height: 1;
  color: #1A5276;
  margin-bottom: 2rem;
  font-weight: 400;
}
.reviews-hero__sub {
  font-size: clamp(1rem, 1.3vw, 1.25rem);
  color: #374151;
  max-width: 560px;
  margin: 0 auto 2.5rem;
  line-height: 1.5;
}
.reviews-hero__google {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1.5rem;
  border: 1px solid rgba(26,82,118,0.2);
  border-radius: 2px;
  color: #1A5276;
  font-size: 0.9375rem;
  transition: border-color 200ms ease;
}
.reviews-hero__google:hover { border-color: #1A5276; }
.reviews-hero__arrow { transition: transform 200ms ease; }
.reviews-hero__google:hover .reviews-hero__arrow { transform: translateX(4px); }

.reviews-grid-section { background: #ffffff; padding: clamp(5rem, 10vw, 10rem) 0; }
.reviews-grid-section__inner { max-width: 1300px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .reviews-grid-section__inner { padding: 0 2.5rem; } }

.reviews-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 768px) { .reviews-grid { grid-template-columns: repeat(2, 1fr); gap: 2.5rem; } }
@media (min-width: 1100px) { .reviews-grid { grid-template-columns: repeat(3, 1fr); gap: 3rem; } }

.review-card {
  padding: 2rem 0;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.review-card__rating {
  color: #1A5276;
  letter-spacing: 0.25em;
  font-size: 0.75rem;
  margin-bottom: 1.25rem;
}
.review-card__quote {
  color: #1A5276;
  font-size: clamp(1rem, 1.15vw, 1.125rem);
  line-height: 1.5;
  letter-spacing: -0.008em;
  margin-bottom: 1.75rem;
}
.review-card__name {
  font-size: 0.875rem;
  color: #1A5276;
  font-weight: 500;
  margin-bottom: 0.4rem;
}
.review-card__meta {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
}

.reviews-more {
  text-align: center;
  margin-top: 4rem;
  padding-top: 3rem;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.reviews-more__link {
  display: inline-flex;
  align-items: baseline;
  gap: 0.6rem;
  color: #1A5276;
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(26,82,118,0.3);
  padding-bottom: 0.2rem;
  transition: border-color 200ms ease, gap 260ms ease;
}
.reviews-more__link:hover { border-color: #1A5276; gap: 0.8rem; }

.reviews-trust {
  background: #FDFBF7;
  padding: clamp(4rem, 8vw, 7rem) 0;
}
.reviews-trust__inner { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem; }
.reviews-trust__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}
@media (min-width: 768px) { .reviews-trust__grid { grid-template-columns: repeat(4, 1fr); gap: 3rem; } }
.reviews-trust__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  margin-bottom: 0.75rem;
}
.reviews-trust__value {
  font-size: clamp(1.5rem, 2.2vw, 2rem);
  color: #1A5276;
  letter-spacing: -0.015em;
  line-height: 1;
  font-weight: 400;
}

/* ==================================================================
   SAFETY PAGE
   ================================================================== */
.safety-hero {
  background: #FDFBF7;
  padding: clamp(7rem, 14vw, 12rem) 1.5rem clamp(4rem, 8vw, 7rem);
  position: relative;
  overflow: hidden;
}
.safety-hero__inner { max-width: 900px; margin: 0 auto; }
.safety-hero__headline {
  font-size: clamp(2.5rem, 5.5vw, 4.5rem);
  letter-spacing: -0.025em;
  line-height: 1;
  color: #1A5276;
  margin: 1.5rem 0;
  font-weight: 400;
}
.safety-hero__sub {
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  color: #374151;
  max-width: 38rem;
  line-height: 1.55;
}

.safety-body {
  background: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
}
.safety-body__inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 768px) { .safety-body__inner { padding: 0 2.5rem; } }
.safety-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 2rem;
  padding: 2.5rem 0;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.safety-item:last-child { border-bottom: 1px solid rgba(26,82,118,0.15); }
.safety-item__num {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.4);
  font-variant-numeric: tabular-nums;
  padding-top: 0.35rem;
}
.safety-item__title {
  font-size: clamp(1.375rem, 2vw, 1.75rem);
  letter-spacing: -0.015em;
  line-height: 1.05;
  color: #1A5276;
  margin-bottom: 1rem;
  font-weight: 400;
}
.safety-item__body p {
  color: #374151;
  font-size: 1rem;
  line-height: 1.6;
}


/* Anchor-high (Two-Day Crossing on homepage) */
.anchor-high {
  display: block;
  margin-top: 3rem;
  padding: 2.5rem;
  background: linear-gradient(135deg, #0a0e1a 0%, #1A5276 100%);
  border-radius: 2px;
  color: #ffffff;
  position: relative;
  overflow: hidden;
  transition: transform 400ms cubic-bezier(.2,.8,.2,1);
}
.anchor-high:hover { transform: translateY(-3px); }
.anchor-high::before {
  content: "바다";
  position: absolute;
  right: 1rem;
  bottom: -0.5rem;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 200;
  font-size: clamp(8rem, 14vw, 14rem);
  color: rgba(255,255,255,0.05);
  line-height: 0.9;
  letter-spacing: -0.04em;
  pointer-events: none;
  white-space: nowrap;
}
.anchor-high__inner {
  position: relative;
  z-index: 2;
  max-width: 600px;
}
.anchor-high__label {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 1.25rem;
  display: inline-block;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.25);
}
.anchor-high__title {
  font-size: clamp(1.75rem, 3vw, 2.625rem);
  letter-spacing: -0.025em;
  line-height: 1.05;
  margin-bottom: 1rem;
  color: #ffffff;
}
.anchor-high__desc {
  color: rgba(255,255,255,0.78);
  font-size: 1rem;
  line-height: 1.5;
  margin-bottom: 1.75rem;
  max-width: 32rem;
}
.anchor-high__meta {
  display: flex;
  align-items: baseline;
  gap: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.18);
}
.anchor-high__price {
  font-size: clamp(1.25rem, 1.8vw, 1.625rem);
  letter-spacing: -0.015em;
}
.anchor-high__arrow {
  margin-left: auto;
  font-size: 1.25rem;
  transition: transform 300ms ease;
}
.anchor-high:hover .anchor-high__arrow { transform: translateX(6px); }

@media (min-width: 768px) {
  .anchor-high { padding: 3.5rem 4rem; }
}


/* ==================================================================
   T1–T4 UPGRADE PASS
   ================================================================== */

/* --- T2: Warm accent token + design system extension --- */
:root {
  --sand-deep: #C9A36A;
  --sand-warm: #D4B886;
  --sand-light: #F1EBDD;
  --hairline-fine: rgba(26, 82, 118, 0.10);
  --hairline-soft: rgba(26, 82, 118, 0.18);
  --hairline-strong: rgba(26, 82, 118, 0.35);
}
.text-accent { color: var(--sand-deep) !important; }
.bg-accent { background: var(--sand-deep); }

/* --- T1: Image grade pass — applied site-wide for visual cohesion --- */
.trip-hero__img,
.signature-img,
.founder-img,
.trip-card__img,
.trip-gallery__img,
.dest-card__img,
.gallery-item img,
.review-card img,
.trip-final-cta img,
.final-cta-section > div > img,
.testimonial-bg,
.breath-image,
section[data-nav-transparent] video,
section[data-nav-transparent] img:not(.nav-logo-white):not(.nav-logo-color) {
  filter: contrast(1.04) saturate(0.88) brightness(0.96);
}

/* Dark-section images get a slight shadow lift */
.signature-section .signature-img,
.testimonial-bg,
.trip-final-cta::before,
.final-cta-section img {
  filter: contrast(1.06) saturate(0.85) brightness(0.92);
}

/* --- T2: Custom selection color --- */
::selection {
  background: rgba(26, 82, 118, 0.18);
  color: #0a0e1a;
}

/* --- T3: Custom cursor on interactive image surfaces --- */
.signature-section a,
.dest-signature,
.founder-figure,
.trip-card,
.gallery-item,
.trip-gallery__figure,
.days-list__row {
  cursor: pointer;
}

/* --- T2: Brand mark — thin wave glyph as section delimiter --- */
.brand-mark {
  display: block;
  width: 36px;
  height: 14px;
  margin: 0 auto;
  color: var(--ocean-500);
  opacity: 0.4;
}
.brand-mark--center {
  margin: clamp(3rem, 6vw, 5rem) auto;
}
.brand-mark--light { color: rgba(255, 255, 255, 0.45); }

/* --- T2: Breath image (atmospheric section divider) --- */
.breath-section {
  position: relative;
  width: 100%;
  height: clamp(50vh, 60vh, 600px);
  overflow: hidden;
  background: var(--ocean-900);
}
.breath-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.breath-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg,
      rgba(10,14,26,0.25) 0%,
      transparent 30%,
      transparent 70%,
      rgba(10,14,26,0.45) 100%);
  pointer-events: none;
}
.breath-caption {
  position: absolute;
  bottom: 1.75rem;
  left: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  z-index: 2;
}
.breath-caption__rule {
  display: block;
  width: 28px;
  height: 1px;
  background: rgba(255,255,255,0.35);
}
@media (min-width: 640px) { .breath-caption { left: 2.5rem; bottom: 2rem; } }
@media (min-width: 1024px) { .breath-caption { left: 4rem; } }

/* --- T3: Optical sizing dynamic (Bodoni opsz axis) --- */
.editorial-display { font-variation-settings: 'opsz' 96; }
.editorial-display-sm { font-variation-settings: 'opsz' 72; }
.editorial-h2 { font-variation-settings: 'opsz' 56; }
.editorial-pullquote { font-variation-settings: 'opsz' 36; }
.editorial-pullquote-sm { font-variation-settings: 'opsz' 28; }
.days-list__name { font-variation-settings: 'opsz' 32; }
.signature-headline { font-variation-settings: 'opsz' 96; }
.signature-price { font-variation-settings: 'opsz' 36; }
.trip-hero__headline { font-variation-settings: 'opsz' 96; }
.trip-hero__price { font-variation-settings: 'opsz' 32; }
.trip-final-cta__headline { font-variation-settings: 'opsz' 72; }
.crossing-day__title { font-variation-settings: 'opsz' 56; }
.review-card__quote { font-variation-settings: 'opsz' 24; }
.safety-item__title { font-variation-settings: 'opsz' 36; }
.reviews-hero__headline { font-variation-settings: 'opsz' 96; }
.reviews-trust__value { font-variation-settings: 'opsz' 36; }
.anchor-high__title { font-variation-settings: 'opsz' 56; }
.safety-hero__headline { font-variation-settings: 'opsz' 96; }
.final-cta-headline { font-variation-settings: 'opsz' 72; }

/* --- T1: Mobile compositions for cinematic sections --- */
@media (max-width: 767px) {

  /* Hero — split composition: image full + content stacked from middle */
  .hero-cinematic { min-height: 100vh; }
  .hero-content {
    bottom: clamp(3rem, 8vh, 5rem) !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
  }
  .hero-stamp {
    top: 5.5rem !important;
    right: 1.25rem !important;
    font-size: 9px !important;
    letter-spacing: 0.28em !important;
  }
  .hero-stamp__rule { width: 18px !important; }
  .hero-kicker {
    font-size: 10px !important;
    letter-spacing: 0.28em !important;
    margin-bottom: 1.25rem !important;
  }
  .editorial-display {
    font-size: clamp(2.25rem, 12vw, 3.5rem) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.025em !important;
  }
  .hero-subtitle {
    font-size: 0.9375rem !important;
    margin-bottom: 1.75rem !important;
  }
  .hero-actions { gap: 1rem !important; }
  .hero-text-link { font-size: 0.875rem !important; }
  .hero-scroll-hint {
    bottom: 1.5rem !important;
    right: 1.25rem !important;
  }

  /* Hero ground gradient stronger on mobile for better text legibility */
  .hero-bg-layer {
    background:
      linear-gradient(180deg,
        rgba(10,14,26,0.4) 0%,
        rgba(10,14,26,0.15) 30%,
        rgba(10,14,26,0.6) 65%,
        rgba(10,14,26,0.95) 100%) !important;
  }

  /* Sail Rock mobile composition */
  .signature-section { min-height: 100vh; }
  .signature-content {
    bottom: clamp(3rem, 8vh, 5rem) !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
  }
  .signature-headline {
    font-size: clamp(2.25rem, 11vw, 3.25rem) !important;
    line-height: 0.95 !important;
  }
  .signature-body {
    font-size: 0.9375rem !important;
    margin-bottom: 1.75rem !important;
  }
  .signature-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
    padding-bottom: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }
  .signature-meta__rule { display: none; }
  .signature-stamp {
    top: 5.5rem !important;
    right: 1.25rem !important;
    font-size: 9px !important;
    letter-spacing: 0.28em !important;
  }
  .signature-bg-gradient {
    background:
      linear-gradient(180deg,
        rgba(10,14,26,0.5) 0%,
        rgba(10,14,26,0.25) 35%,
        rgba(10,14,26,0.65) 70%,
        rgba(10,14,26,0.95) 100%) !important;
  }

  /* Final CTA mobile */
  .final-cta-section { min-height: 90vh; }
  .final-cta-content {
    bottom: clamp(3rem, 8vh, 5rem) !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
  }
  .final-cta-headline {
    font-size: clamp(2rem, 9vw, 3rem) !important;
    line-height: 1 !important;
  }
  .final-cta-mark {
    font-size: clamp(10rem, 50vw, 18rem) !important;
    right: -0.05em !important;
    bottom: -0.1em !important;
  }
  .final-cta-overlay {
    background:
      linear-gradient(180deg,
        rgba(10,14,26,0.55) 0%,
        rgba(10,14,26,0.7) 50%,
        rgba(10,14,26,0.92) 100%) !important;
  }

  /* Trip hero mobile */
  .trip-hero { min-height: 95vh; }
  .trip-hero__content {
    bottom: clamp(3rem, 8vh, 5rem) !important;
    left: 1.25rem !important;
    right: 1.25rem !important;
  }
  .trip-hero__headline {
    font-size: clamp(2.25rem, 11vw, 3.25rem) !important;
  }
  .trip-hero__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .trip-hero__rule { display: none; }
  .trip-hero__stamp {
    top: 5.5rem !important;
    right: 1.25rem !important;
    font-size: 9px !important;
    flex-wrap: wrap;
    max-width: 60%;
    justify-content: flex-end;
  }
  .trip-hero__coords { padding-left: 0.75rem; margin-left: 0; border-left: 1px solid rgba(255,255,255,0.25); }
  .trip-hero__gradient {
    background:
      linear-gradient(180deg,
        rgba(10,14,26,0.5) 0%,
        rgba(10,14,26,0.25) 35%,
        rgba(10,14,26,0.7) 70%,
        rgba(10,14,26,0.92) 100%) !important;
  }
}

/* --- T2: View Transitions API for smooth page navigation --- */
@view-transition { navigation: auto; }
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 320ms;
  animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1);
}
::view-transition-old(root) { animation-name: fade-out-soft; }
::view-transition-new(root) { animation-name: fade-in-soft; }
@keyframes fade-out-soft {
  to { opacity: 0; }
}
@keyframes fade-in-soft {
  from { opacity: 0; }
}

/* --- T2: Warm accent applied at moments of human emphasis --- */
.bada-mark { color: rgba(201, 163, 106, 0.12); } /* Subtle warm tone instead of cold ocean */
.signature-day-tag {
  display: inline-block;
  padding: 0.4rem 0.9rem;
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-deep);
  border: 1px solid var(--sand-deep);
  border-radius: 2px;
}
.founder-name-mark {
  color: var(--sand-deep);
  font-style: italic;
  font-family: 'Bodoni Moda', serif;
}

/* --- T3: Reviews page — editorial spread, not card grid --- */
.reviews-editorial {
  background: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
}
.reviews-editorial__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 768px) { .reviews-editorial__inner { padding: 0 2.5rem; } }

.reviews-editorial__featured {
  text-align: center;
  margin-bottom: clamp(4rem, 8vw, 7rem);
  padding-bottom: clamp(4rem, 8vw, 6rem);
  border-bottom: 1px solid var(--hairline-soft);
}
.reviews-editorial__featured-quote {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-weight: 400;
  font-variation-settings: 'opsz' 56;
  font-size: clamp(1.625rem, 3vw, 2.5rem);
  letter-spacing: -0.015em;
  line-height: 1.3;
  color: var(--ocean-500);
  max-width: 900px;
  margin: 0 auto 2rem;
}
.reviews-editorial__featured-attr {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.reviews-editorial__featured-name {
  color: var(--sand-deep);
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 1.25rem;
}
.reviews-editorial__featured-meta {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
}

.reviews-columns {
  column-count: 1;
  column-gap: 3rem;
}
@media (min-width: 768px) { .reviews-columns { column-count: 2; } }
@media (min-width: 1100px) { .reviews-columns { column-count: 3; } }

.reviews-column-item {
  break-inside: avoid;
  margin-bottom: 2.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid var(--hairline-fine);
}
.reviews-column-item:last-child { border-bottom: none; }
.reviews-column-item__quote {
  font-family: 'Space Grotesk', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.1875rem;
  line-height: 1.65;
  color: #1A1F2E;
  margin-bottom: 1.5rem;
  letter-spacing: -0.005em;
}
.reviews-column-item__name {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-weight: 500;
  color: var(--sand-deep);
  font-size: 1.125rem;
  margin-bottom: 0.5rem;
}
.reviews-column-item__meta {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.65);
}


/* ==================================================================
   EDITORIAL FOOTER — replaces legacy Tailwind footer
   ================================================================== */
.editorial-footer {
  position: relative;
  background: #0a0e1a;
  color: rgba(255,255,255,0.85);
  padding: clamp(4rem, 8vw, 7rem) 1.5rem clamp(2rem, 4vw, 3rem);
  overflow: hidden;
}
.editorial-footer__mark {
  position: absolute;
  right: -0.05em;
  bottom: -0.18em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 200;
  color: rgba(201, 163, 106, 0.06);
  font-size: clamp(8rem, 18vw, 18rem);
  line-height: 0.85;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.editorial-footer__inner {
  position: relative;
  z-index: 1;
  max-width: 1300px;
  margin: 0 auto;
}
@media (min-width: 768px) { .editorial-footer { padding-left: 2.5rem; padding-right: 2.5rem; } }
@media (min-width: 1024px) { .editorial-footer { padding-left: 4rem; padding-right: 4rem; } }

.editorial-footer__signature {
  text-align: center;
  margin-bottom: clamp(3.5rem, 7vw, 5.5rem);
  padding-bottom: clamp(2.5rem, 5vw, 4rem);
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.editorial-footer__line {
  font-size: clamp(1.25rem, 2.2vw, 1.75rem);
  font-variation-settings: 'opsz' 32;
  color: #ffffff;
  letter-spacing: -0.012em;
  margin-bottom: 1.75rem;
  font-weight: 400;
}

.editorial-footer__columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  margin-bottom: clamp(3rem, 6vw, 5rem);
}
@media (min-width: 768px) {
  .editorial-footer__columns { grid-template-columns: repeat(3, 1fr); gap: 4rem; }
}

.editorial-footer__col-label {
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  margin-bottom: 1.5rem;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.editorial-footer__list { list-style: none; padding: 0; margin: 0; }
.editorial-footer__list li { margin-bottom: 0.85rem; }
.editorial-footer__list a {
  color: rgba(255,255,255,0.7);
  font-size: 0.9375rem;
  text-decoration: none;
  transition: color 200ms ease;
}
.editorial-footer__list a:hover { color: #ffffff; }
.editorial-footer__highlight {
  color: var(--sand-deep) !important;
  font-style: italic;
  font-family: 'Bodoni Moda', serif;
}
.editorial-footer__highlight:hover { color: var(--sand-warm) !important; }

.editorial-footer__trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem 1.5rem;
  padding: 1.75rem 0;
  border-top: 1px solid rgba(255,255,255,0.1);
  border-bottom: 1px solid rgba(255,255,255,0.1);
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-bottom: 1.75rem;
}
.editorial-footer__trust-sep { color: rgba(255,255,255,0.2); }

.editorial-footer__bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  font-size: 11px;
  color: rgba(255,255,255,0.4);
  letter-spacing: 0.05em;
}
@media (min-width: 768px) {
  .editorial-footer__bottom { flex-direction: row; justify-content: space-between; }
}
.editorial-footer__legal { display: flex; gap: 1.5rem; }
.editorial-footer__legal a {
  color: rgba(255,255,255,0.4);
  text-decoration: none;
  transition: color 200ms ease;
}
.editorial-footer__legal a:hover { color: rgba(255,255,255,0.85); }


/* --- T4: Hero audio toggle (subtle, off by default) --- */
.hero-audio-toggle {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  background: rgba(10,14,26,0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 28px;
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: rgba(255,255,255,0.85);
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 200ms ease, border-color 200ms ease;
}
.hero-audio-toggle:hover {
  background: rgba(10,14,26,0.6);
  border-color: rgba(255,255,255,0.32);
}
.hero-audio-toggle__icon { width: 14px; height: 14px; }
@media (max-width: 767px) {
  .hero-audio-toggle {
    bottom: 1.5rem;
    padding: 0.4rem 0.85rem;
  }
  .hero-audio-toggle__label { display: none; }
}

/* --- T1: Section padding nudges to space breath images well --- */
.breath-section + .signature-section,
.breath-section + .quote-section,
.breath-section + .testimonial-section { margin-top: 0; }


/* ==================================================================
   MODERN EXPRESSIVE PASS — striking moves for today's standards
   ================================================================== */

/* --- Faster, more expressive reveal curves --- */
.reveal--hidden {
  opacity: 0;
  transform: translateY(32px) scale(0.995);
  transition: opacity 600ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Kinetic hero headline — character-by-character reveal */
.kinetic-line {
  display: block;
  overflow: hidden;
}
.kinetic-line .kinetic-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.3em);
  animation: kinetic-in 1000ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  padding-right: 0.2em;
}
.kinetic-line .kinetic-word:last-child { padding-right: 0; }
@keyframes kinetic-in {
  to { opacity: 1; transform: translateY(0); }
}

/* Staggered animation delay for kinetic type */
.kinetic-line .kinetic-word:nth-child(1) { animation-delay: 60ms; }
.kinetic-line .kinetic-word:nth-child(2) { animation-delay: 150ms; }
.kinetic-line .kinetic-word:nth-child(3) { animation-delay: 240ms; }
.kinetic-line .kinetic-word:nth-child(4) { animation-delay: 330ms; }
.kinetic-line .kinetic-word:nth-child(5) { animation-delay: 420ms; }
.kinetic-line + .kinetic-line .kinetic-word:nth-child(1) { animation-delay: 500ms; }
.kinetic-line + .kinetic-line .kinetic-word:nth-child(2) { animation-delay: 580ms; }
.kinetic-line + .kinetic-line .kinetic-word:nth-child(3) { animation-delay: 660ms; }

/* Hero kicker + subtitle + actions cascade after headline */
.hero-kicker {
  opacity: 0;
  animation: fade-up 800ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 900ms;
}
.hero-subtitle {
  opacity: 0;
  animation: fade-up 800ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 1050ms;
}
.hero-actions {
  opacity: 0;
  animation: fade-up 800ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 1200ms;
}
.hero-stamp, .hero-scroll-hint, .hero-audio-toggle {
  opacity: 0;
  animation: fade-in 1200ms ease forwards;
  animation-delay: 1400ms;
}
@keyframes fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fade-in {
  to { opacity: 1; }
}

/* Hero video scroll-linked zoom (handled in JS but CSS baseline) */
.hero-cinematic video { transform-origin: center center; will-change: transform; }

/* Type that breaks the grid — headline extends beyond container on wide viewports */
@media (min-width: 1400px) {
  .hero-cinematic .hero-headline { margin-left: -0.08em; }
  .signature-headline { margin-left: -0.08em; }
  .trip-hero__headline { margin-left: -0.08em; }
}

/* ==================================================================
   SCROLLYTELLING SEQUENCE — pinned photography moments
   ================================================================== */
.scrollytell {
  position: relative;
  background: #0a0e1a;
}
.scrollytell__frame {
  position: relative;
  height: 100vh;
  overflow: hidden;
}
.scrollytell__frame img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.scrollytell__frame::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg,
      rgba(10,14,26,1) 0%,
      rgba(10,14,26,0.55) 12%,
      rgba(10,14,26,0.2) 32%,
      rgba(10,14,26,0.2) 60%,
      rgba(10,14,26,0.55) 82%,
      rgba(10,14,26,1) 100%);
  z-index: 1;
}
/* Only the first frame keeps a softer top (it meets the light Minseo section above). */
.scrollytell__frame:first-child::before {
  background:
    linear-gradient(180deg,
      rgba(10,14,26,0.5) 0%,
      rgba(10,14,26,0.2) 30%,
      rgba(10,14,26,0.2) 60%,
      rgba(10,14,26,0.55) 82%,
      rgba(10,14,26,1) 100%);
}
.scrollytell__content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(3rem, 6vw, 6rem) clamp(1.5rem, 4vw, 4rem);
  z-index: 2;
  color: #ffffff;
}
.scrollytell__chapter {
  font-size: 11px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.scrollytell__chapter-rule { display: block; width: 36px; height: 1px; background: rgba(255,255,255,0.45); }
.scrollytell__headline {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 96;
  font-weight: 400;
  font-size: clamp(2.75rem, 8vw, 7rem);
  letter-spacing: -0.035em;
  line-height: 0.95;
  margin-bottom: 1.5rem;
  max-width: 900px;
  text-shadow: 0 2px 40px rgba(0,0,0,0.5);
}
.scrollytell__body {
  font-size: clamp(0.95rem, 1.1vw, 1.125rem);
  line-height: 1.55;
  color: rgba(255,255,255,0.8);
  max-width: 40rem;
  font-weight: 300;
}

/* Alternating positioning for rhythm */
.scrollytell__frame:nth-child(even) .scrollytell__content {
  justify-content: flex-start;
  padding-top: clamp(6rem, 14vw, 12rem);
}
.scrollytell__frame:nth-child(even) .scrollytell__content .scrollytell__headline,
.scrollytell__frame:nth-child(even) .scrollytell__content .scrollytell__body {
  margin-left: auto;
  text-align: right;
}

/* ==================================================================
   HORIZONTAL SCROLL GALLERY — signature modern move
   ================================================================== */
.hscroll-gallery {
  background: #FDFBF7;
  padding: clamp(5rem, 10vw, 10rem) 0;
  overflow: hidden;
}
.hscroll-gallery__head {
  max-width: 1200px;
  margin: 0 auto clamp(3rem, 6vw, 5rem);
  padding: 0 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 2rem;
  flex-wrap: wrap;
}
@media (min-width: 768px) { .hscroll-gallery__head { padding: 0 2.5rem; } }
.hscroll-gallery__head-left h2 {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 72;
  font-weight: 400;
  font-size: clamp(2.25rem, 5vw, 4rem);
  line-height: 0.98;
  letter-spacing: -0.025em;
  color: var(--ocean-500);
  margin-top: 1rem;
}
.hscroll-gallery__count {
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  font-variant-numeric: tabular-nums;
}

.hscroll-track {
  display: flex;
  gap: 1.5rem;
  padding: 0 1.5rem;
  overflow-x: auto;
  /* No scroll-snap here — mandatory snap causes Chrome to capture vertical
     wheel events and trap the user. Drag + trackpad swipe work without it. */
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  cursor: grab;
}
.hscroll-track::-webkit-scrollbar { display: none; }
.hscroll-track:active { cursor: grabbing; }
@media (min-width: 768px) { .hscroll-track { padding: 0 2.5rem; gap: 2rem; } }
@media (min-width: 1024px) { .hscroll-track { padding: 0 4rem; } }

.hscroll-item {
  flex: 0 0 auto;
  width: 75vw;
  max-width: 520px;
  /* scroll-snap removed to avoid trapping wheel events */
  position: relative;
}
.hscroll-item:first-child { margin-left: 0; }
@media (min-width: 768px) { .hscroll-item { width: 45vw; max-width: 620px; } }
@media (min-width: 1400px) { .hscroll-item { width: 36vw; max-width: 680px; } }

.hscroll-item__img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
}
.hscroll-item__caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 1rem;
  margin-top: 1rem;
  border-top: 1px solid var(--hairline-soft);
  font-size: 10px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.55);
}
.hscroll-item__number {
  font-variant-numeric: tabular-nums;
  color: rgba(26,82,118,0.4);
}

/* ==================================================================
   PURE-BLACK CONTRAST MOMENT — single-line unexpected punch
   ================================================================== */
.contrast-moment {
  position: relative;
  background: #000000;
  padding: clamp(8rem, 20vw, 18rem) 1.5rem;
  overflow: hidden;
  text-align: center;
}
@media (min-width: 768px) { .contrast-moment { padding-left: 2.5rem; padding-right: 2.5rem; } }
.contrast-moment::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 50%, rgba(26,82,118,0.18) 0%, transparent 65%);
  pointer-events: none;
}
.contrast-moment__text {
  position: relative;
  z-index: 1;
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 96;
  font-weight: 400;
  color: #ffffff;
  font-size: clamp(2.5rem, 9vw, 8rem);
  letter-spacing: -0.04em;
  line-height: 0.95;
  max-width: 1400px;
  margin: 0 auto;
}
.contrast-moment__period {
  color: var(--sand-deep);
}
.contrast-moment__sub {
  position: relative;
  z-index: 1;
  margin-top: clamp(2rem, 4vw, 3rem);
  font-size: 10px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ==================================================================
   IMAGE-DOMINANT DAYS LIST — redesigned as visual index
   ================================================================== */
.visual-index {
  background: #0a0e1a;
  color: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0 0;
  position: relative;
  overflow: hidden;
}
.visual-index__head {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1.5rem clamp(4rem, 8vw, 7rem);
}
@media (min-width: 768px) { .visual-index__head { padding-left: 2.5rem; padding-right: 2.5rem; } }
@media (min-width: 1024px) { .visual-index__head { padding-left: 4rem; padding-right: 4rem; } }

.visual-index__head h2 {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 96;
  font-weight: 400;
  font-size: clamp(2.75rem, 6vw, 5.75rem);
  letter-spacing: -0.03em;
  line-height: 0.95;
  margin-top: 1rem;
}
.visual-index__head .editorial-eyebrow { color: rgba(255,255,255,0.55); }

.visual-index__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 1.25vw, 1.25rem);
  padding: 0 clamp(0.75rem, 1.25vw, 1.25rem) clamp(0.75rem, 1.25vw, 1.25rem);
  position: relative;
}
@media (min-width: 900px) {
  .visual-index__grid { grid-template-columns: 1fr 1fr; }
}
.visual-index__item {
  position: relative;
  min-height: clamp(360px, 50vw, 520px);
  overflow: hidden;
  display: block;
  text-decoration: none;
  color: inherit;
  border-right: 1px solid rgba(255,255,255,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.visual-index__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1500ms cubic-bezier(0.22, 1, 0.36, 1);
  filter: brightness(0.55) saturate(0.85);
}
.visual-index__item:hover .visual-index__img {
  transform: scale(1.06);
  filter: brightness(0.8) saturate(1);
}
.visual-index__content {
  position: absolute;
  left: clamp(1.5rem, 3vw, 3rem);
  right: clamp(1.5rem, 3vw, 3rem);
  bottom: clamp(2rem, 4vw, 3rem);
  z-index: 2;
}
.visual-index__num {
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 1rem;
  display: inline-block;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid rgba(255,255,255,0.25);
}
.visual-index__name {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 72;
  font-weight: 400;
  font-size: clamp(2rem, 4vw, 3.5rem);
  letter-spacing: -0.02em;
  line-height: 0.95;
  margin-bottom: 0.75rem;
  color: #ffffff;
}
.visual-index__meta {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
}
.visual-index__price {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  color: var(--sand-warm);
  font-size: 1.125rem;
  letter-spacing: -0.01em;
  text-transform: none;
}
.visual-index__arrow {
  color: rgba(255,255,255,0.4);
  font-size: 1rem;
  transition: transform 350ms ease, color 350ms ease;
}
.visual-index__item:hover .visual-index__arrow {
  color: #ffffff;
  transform: translateX(6px);
}


/* ==================================================================
   ABOUT PAGE — cinematic rebuild
   ================================================================== */
.about-hero {
  position: relative;
  min-height: 88vh;
  color: #ffffff;
  background: var(--ocean-900);
  overflow: hidden;
}
.about-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-hero__gradient {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(95deg, rgba(10,14,26,0.85) 0%, rgba(10,14,26,0.5) 45%, rgba(10,14,26,0.2) 75%, rgba(10,14,26,0.4) 100%),
    linear-gradient(180deg, rgba(10,14,26,0.45) 0%, transparent 20%, transparent 65%, rgba(10,14,26,0.75) 100%);
}
.about-hero__stamp {
  position: absolute;
  top: 7rem;
  right: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  z-index: 10;
}
.about-hero__stamp-rule { display: block; width: 40px; height: 1px; background: rgba(255,255,255,0.35); }
@media (min-width: 640px) { .about-hero__stamp { top: 8rem; right: 2.5rem; } }
@media (min-width: 1024px) { .about-hero__stamp { right: 4rem; } }
.about-hero__content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 680px;
  z-index: 10;
}
@media (min-width: 640px) { .about-hero__content { left: 2.5rem; } }
@media (min-width: 1024px) { .about-hero__content { left: 4rem; right: auto; bottom: clamp(5rem, 10vh, 8rem); } }
.about-hero__kicker {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin-bottom: 1.5rem;
  display: inline-block;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.25);
}
.about-hero__headline {
  font-size: clamp(3.5rem, 9vw, 8rem);
  letter-spacing: -0.035em;
  line-height: 0.95;
  margin-bottom: 2rem;
  font-weight: 400;
  font-variation-settings: 'opsz' 96;
  text-shadow: 0 2px 40px rgba(0,0,0,0.45);
}
.about-hero__sub {
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  color: rgba(255,255,255,0.85);
  font-weight: 300;
  line-height: 1.5;
  max-width: 36rem;
}

/* About ritual section */
.about-ritual {
  background: #FDFBF7;
  padding: clamp(5rem, 10vw, 10rem) 0;
  position: relative;
  overflow: hidden;
}
.about-ritual__inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 1.5rem;
  text-align: center;
}
@media (min-width: 768px) { .about-ritual__inner { padding: 0 2.5rem; } }
.about-ritual .editorial-eyebrow { margin-bottom: 1.5rem; }
.about-ritual__headline {
  font-size: clamp(2.25rem, 5vw, 4rem);
  font-variation-settings: 'opsz' 72;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--ocean-500);
  margin-bottom: 3rem;
  font-weight: 400;
}
.about-ritual__body p {
  font-size: clamp(1.1rem, 1.4vw, 1.3rem);
  line-height: 1.55;
  color: #374151;
  margin-bottom: 1.5rem;
  max-width: 32rem;
  margin-left: auto;
  margin-right: auto;
}
.about-ritual__mark {
  margin-top: 3rem;
  color: var(--sand-deep);
}

/* About credentials */
.about-credentials {
  background: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
}
.about-credentials__inner { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .about-credentials__inner { padding: 0 2.5rem; } }
.about-credentials__head { margin-bottom: 4rem; max-width: 600px; }
.about-credentials__list { list-style: none; padding: 0; margin: 0; border-top: 1px solid rgba(26,82,118,0.15); }
.about-credentials__item {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 2rem;
  padding: 2.5rem 0;
  border-bottom: 1px solid rgba(26,82,118,0.15);
  align-items: baseline;
}
.about-credentials__num {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.4);
  font-variant-numeric: tabular-nums;
}
.about-credentials__title {
  font-size: clamp(1.5rem, 2.2vw, 1.875rem);
  font-variation-settings: 'opsz' 36;
  letter-spacing: -0.015em;
  color: var(--ocean-500);
  margin-bottom: 0.9rem;
  font-weight: 400;
  line-height: 1.05;
}
.about-credentials__body p { color: #374151; font-size: 1rem; line-height: 1.6; max-width: 36rem; }

/* About philosophy */
.about-philosophy {
  background: var(--ocean-900);
  color: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
  position: relative;
  overflow: hidden;
}
.about-philosophy::before {
  content: "바다";
  position: absolute;
  right: -0.05em;
  bottom: -0.2em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 200;
  color: rgba(201,163,106,0.05);
  font-size: clamp(10rem, 20vw, 20rem);
  line-height: 0.85;
  pointer-events: none;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.about-philosophy__inner {
  position: relative;
  z-index: 2;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}
@media (min-width: 900px) {
  .about-philosophy__inner { grid-template-columns: minmax(220px, 1fr) 2fr; gap: 5rem; padding: 0 2.5rem; }
}
.about-philosophy__lede .editorial-eyebrow { color: rgba(255,255,255,0.6); margin-bottom: 1.5rem; }
.about-philosophy__lede .editorial-h2 { color: #ffffff; }
.about-philosophy__body p {
  color: rgba(255,255,255,0.82);
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  line-height: 1.6;
  margin-bottom: 1.5rem;
  font-weight: 300;
  max-width: 40rem;
}

/* About CTA */
.about-cta {
  background: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
  background: linear-gradient(135deg, #0a0e1a 0%, #1A5276 100%);
  color: #ffffff;
  position: relative;
  overflow: hidden;
}
.about-cta__inner {
  max-width: 700px;
  margin: 0 auto;
  padding: 0 1.5rem;
  text-align: center;
}
.about-cta__headline {
  font-size: clamp(2.25rem, 5vw, 4rem);
  font-variation-settings: 'opsz' 72;
  letter-spacing: -0.025em;
  line-height: 1;
  color: #ffffff;
  margin: 1rem 0 1.5rem;
  font-weight: 400;
}
.about-cta__body {
  color: rgba(255,255,255,0.78);
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  line-height: 1.55;
  margin-bottom: 2.5rem;
}
.about-cta__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  flex-wrap: wrap;
}
.about-cta__link {
  color: rgba(255,255,255,0.85);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(255,255,255,0.4);
  padding-bottom: 0.2rem;
  transition: color 200ms ease, border-color 200ms ease;
}
.about-cta__link:hover { color: #ffffff; border-color: #ffffff; }

/* ==================================================================
   RITUAL CALLOUT (homepage Minseo section)
   ================================================================== */
.ritual-callout {
  margin-top: 2.5rem;
  padding: 1.75rem 2rem;
  background: rgba(201, 163, 106, 0.08);
  border-left: 2px solid var(--sand-deep);
  position: relative;
}
.ritual-callout__label {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--sand-deep);
  margin-bottom: 0.9rem;
  font-weight: 500;
}
.ritual-callout__text {
  color: #374151;
  font-size: 0.9375rem;
  line-height: 1.55;
}

/* ==================================================================
   YOUR-DAY PAGE
   ================================================================== */
.your-day-hero {
  position: relative;
  min-height: 80vh;
  color: #ffffff;
  background: var(--ocean-900);
  overflow: hidden;
}
.your-day-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.your-day-hero__gradient {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(95deg, rgba(10,14,26,0.85) 0%, rgba(10,14,26,0.55) 45%, rgba(10,14,26,0.25) 75%, rgba(10,14,26,0.4) 100%),
    linear-gradient(180deg, rgba(10,14,26,0.4) 0%, transparent 25%, rgba(10,14,26,0.6) 100%);
}
.your-day-hero__stamp {
  position: absolute;
  top: 7rem;
  right: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  z-index: 10;
}
.your-day-hero__stamp-rule { display: block; width: 40px; height: 1px; background: rgba(255,255,255,0.35); }
@media (min-width: 640px) { .your-day-hero__stamp { top: 8rem; right: 2.5rem; } }
@media (min-width: 1024px) { .your-day-hero__stamp { right: 4rem; } }
.your-day-hero__content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 680px;
  z-index: 10;
}
@media (min-width: 640px) { .your-day-hero__content { left: 2.5rem; } }
@media (min-width: 1024px) { .your-day-hero__content { left: 4rem; right: auto; bottom: clamp(5rem, 10vh, 8rem); } }
.your-day-hero__kicker {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin-bottom: 1.5rem;
  display: inline-block;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.25);
}
.your-day-hero__headline {
  font-size: clamp(2.75rem, 7vw, 6rem);
  letter-spacing: -0.03em;
  line-height: 0.95;
  margin-bottom: 2rem;
  font-weight: 400;
  font-variation-settings: 'opsz' 80;
  text-shadow: 0 2px 32px rgba(0,0,0,0.45);
}
.your-day-hero__sub {
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  color: rgba(255,255,255,0.82);
  font-weight: 300;
  line-height: 1.55;
  max-width: 34rem;
}

/* Day timeline */
.day-timeline {
  background: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
}
.day-timeline__inner { max-width: 1000px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .day-timeline__inner { padding: 0 2.5rem; } }
.day-timeline__head { margin-bottom: 4rem; max-width: 600px; }
.day-timeline__list { list-style: none; padding: 0; margin: 0; border-top: 1px solid rgba(26,82,118,0.15); }
.day-timeline__item {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 2rem;
  padding: 2.5rem 0;
  border-bottom: 1px solid rgba(26,82,118,0.15);
  align-items: baseline;
}
@media (max-width: 600px) { .day-timeline__item { grid-template-columns: 70px 1fr; gap: 1.25rem; } }
.day-timeline__item--accent { background: linear-gradient(90deg, rgba(201,163,106,0.06), transparent); padding-left: 1rem; padding-right: 1rem; margin-left: -1rem; margin-right: -1rem; }
.day-timeline__item--accent .day-timeline__time { color: var(--sand-deep); }
.day-timeline__time {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 18;
  font-weight: 500;
  font-size: clamp(1.25rem, 2vw, 1.625rem);
  letter-spacing: -0.01em;
  color: var(--ocean-500);
  font-variant-numeric: tabular-nums;
  padding-top: 0.3rem;
}
.day-timeline__title {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 18;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  letter-spacing: -0.01em;
  color: var(--ocean-500);
  margin-bottom: 0.75rem;
  font-weight: 500;
  line-height: 1.15;
}
.day-timeline__body p {
  color: #1A1F2E;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.0625rem;
  line-height: 1.7;
  font-weight: 400;
}

/* Day essentials */
.day-essentials {
  background: #FDFBF7;
  padding: clamp(5rem, 10vw, 10rem) 0;
}
.day-essentials__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3.5rem;
}
@media (min-width: 768px) { .day-essentials__inner { grid-template-columns: 1fr 1fr; gap: 5rem; padding: 0 2.5rem; } }
.day-essentials__list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.day-essentials__list li {
  padding: 1rem 0;
  border-bottom: 1px solid rgba(26,82,118,0.1);
  color: #374151;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* Day weather */
.day-weather {
  background: #ffffff;
  padding: clamp(4rem, 8vw, 8rem) 0;
}
.day-weather__inner {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 1.5rem;
  text-align: center;
}
.day-weather .editorial-eyebrow { margin-bottom: 1.5rem; }
.day-weather__headline {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-variation-settings: 'opsz' 48;
  letter-spacing: -0.02em;
  color: var(--ocean-500);
  margin-bottom: 2rem;
  line-height: 1.1;
  font-weight: 400;
}
.day-weather__body {
  color: #374151;
  font-size: 1.0625rem;
  line-height: 1.65;
}

/* Day contact note */
.day-contact-note {
  background: #FDFBF7;
  padding: clamp(5rem, 10vw, 10rem) 0;
}
.day-contact-note__inner {
  max-width: 700px;
  margin: 0 auto;
  padding: 0 1.5rem;
  text-align: center;
}
.day-contact-note__headline {
  font-size: clamp(2rem, 4vw, 3rem);
  font-variation-settings: 'opsz' 48;
  letter-spacing: -0.02em;
  color: var(--ocean-500);
  margin: 1rem 0 1.5rem;
  line-height: 1;
  font-weight: 400;
}
.day-contact-note__body {
  color: #374151;
  font-size: 1.0625rem;
  line-height: 1.6;
  margin-bottom: 2.5rem;
}
.day-contact-note__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  flex-wrap: wrap;
}
.day-contact-note__link {
  color: var(--ocean-500);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(26,82,118,0.35);
  padding-bottom: 0.2rem;
  transition: border-color 200ms ease;
}
.day-contact-note__link:hover { border-color: var(--ocean-500); }

/* ==================================================================
   GIFT PAGE
   ================================================================== */
.gift-hero {
  position: relative;
  min-height: 90vh;
  color: #ffffff;
  background: var(--ocean-900);
  overflow: hidden;
}
.gift-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gift-hero__gradient {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(95deg, rgba(10,14,26,0.88) 0%, rgba(10,14,26,0.55) 45%, rgba(10,14,26,0.25) 75%, rgba(10,14,26,0.45) 100%),
    linear-gradient(180deg, rgba(10,14,26,0.4) 0%, transparent 22%, rgba(10,14,26,0.7) 100%);
}
.gift-hero__stamp {
  position: absolute;
  top: 7rem;
  right: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--sand-warm);
  z-index: 10;
}
.gift-hero__stamp-rule { display: block; width: 40px; height: 1px; background: rgba(201,163,106,0.5); }
@media (min-width: 640px) { .gift-hero__stamp { top: 8rem; right: 2.5rem; } }
@media (min-width: 1024px) { .gift-hero__stamp { right: 4rem; } }
.gift-hero__content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 720px;
  z-index: 10;
}
@media (min-width: 640px) { .gift-hero__content { left: 2.5rem; } }
@media (min-width: 1024px) { .gift-hero__content { left: 4rem; right: auto; bottom: clamp(5rem, 10vh, 8rem); } }
.gift-hero__kicker {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-warm);
  margin-bottom: 1.5rem;
  display: inline-block;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(201,163,106,0.45);
}
.gift-hero__headline {
  font-size: clamp(3rem, 8vw, 7rem);
  letter-spacing: -0.035em;
  line-height: 0.95;
  margin-bottom: 2rem;
  font-weight: 400;
  font-variation-settings: 'opsz' 96;
  color: #ffffff;
  text-shadow: 0 2px 40px rgba(0,0,0,0.45);
}
.gift-hero__sub {
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  color: rgba(255,255,255,0.82);
  font-weight: 300;
  line-height: 1.5;
  margin-bottom: 2.5rem;
  max-width: 40rem;
}
.gift-hero__actions { display: flex; align-items: center; gap: 1.75rem; flex-wrap: wrap; }
.gift-hero__text-link {
  color: rgba(255,255,255,0.85);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(255,255,255,0.4);
  padding-bottom: 0.2rem;
}
.gift-hero__text-link:hover { color: #ffffff; border-color: #ffffff; }

.gift-how { background: #FDFBF7; padding: clamp(5rem, 10vw, 10rem) 0; }
.gift-how__inner { max-width: 1000px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .gift-how__inner { padding: 0 2.5rem; } }
.gift-how__head { margin-bottom: 4rem; }
.gift-how__list { list-style: none; padding: 0; margin: 0; border-top: 1px solid rgba(26,82,118,0.15); }
.gift-how__item {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 2rem;
  padding: 2.5rem 0;
  border-bottom: 1px solid rgba(26,82,118,0.15);
  align-items: baseline;
}
.gift-how__num {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-deep);
  font-variant-numeric: tabular-nums;
}
.gift-how__title {
  font-size: clamp(1.375rem, 2.2vw, 1.75rem);
  font-variation-settings: 'opsz' 32;
  letter-spacing: -0.015em;
  color: var(--ocean-500);
  margin-bottom: 1rem;
  line-height: 1.1;
  font-weight: 400;
}
.gift-how__body p { color: #374151; font-size: 1rem; line-height: 1.6; max-width: 36rem; }

.gift-options { background: #ffffff; padding: clamp(5rem, 10vw, 10rem) 0; }
.gift-options__inner { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .gift-options__inner { padding: 0 2.5rem; } }
.gift-options__head { margin-bottom: 3.5rem; }
.gift-options__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 768px) { .gift-options__grid { grid-template-columns: repeat(2, 1fr); gap: 2.5rem; } }
.gift-option {
  padding: 2.25rem 2rem;
  border: 1px solid rgba(26,82,118,0.15);
  position: relative;
  transition: border-color 300ms ease, transform 300ms ease;
}
.gift-option:hover { border-color: var(--sand-deep); transform: translateY(-2px); }
.gift-option__tag {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--sand-deep);
  margin-bottom: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(201,163,106,0.25);
  display: inline-block;
}
.gift-option__name {
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-variation-settings: 'opsz' 36;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--ocean-500);
  margin-bottom: 1rem;
  font-weight: 400;
}
.gift-option__desc {
  color: #374151;
  font-size: 0.9375rem;
  line-height: 1.55;
  margin-bottom: 1.5rem;
}
.gift-option__price {
  font-size: 1.125rem;
  font-variation-settings: 'opsz' 24;
  color: var(--ocean-500);
  letter-spacing: -0.01em;
  padding-top: 1rem;
  border-top: 1px solid rgba(26,82,118,0.12);
}

.gift-delivery { background: #FDFBF7; padding: clamp(5rem, 10vw, 10rem) 0; }
.gift-delivery__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4rem;
}
@media (min-width: 900px) { .gift-delivery__inner { grid-template-columns: 1fr 1fr; gap: 5rem; padding: 0 2.5rem; } }
.gift-delivery__body { color: #374151; font-size: 1rem; line-height: 1.65; margin-bottom: 1.25rem; }

.gift-final-cta {
  background: linear-gradient(135deg, #0a0e1a 0%, #1A5276 100%);
  color: #ffffff;
  padding: clamp(5rem, 10vw, 10rem) 0;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.gift-final-cta::before {
  content: "바다";
  position: absolute;
  right: -0.05em;
  bottom: -0.18em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 200;
  color: rgba(201,163,106,0.06);
  font-size: clamp(10rem, 22vw, 22rem);
  line-height: 0.85;
  pointer-events: none;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.gift-final-cta__inner {
  position: relative;
  z-index: 2;
  max-width: 700px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.gift-final-cta__headline {
  font-size: clamp(2.25rem, 5vw, 4rem);
  font-variation-settings: 'opsz' 72;
  letter-spacing: -0.025em;
  line-height: 1;
  margin: 1rem 0 1.5rem;
  font-weight: 400;
  color: #ffffff;
}
.gift-final-cta__body {
  color: rgba(255,255,255,0.78);
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  line-height: 1.55;
  margin-bottom: 2.5rem;
}
.gift-final-cta__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}
.gift-final-cta__link {
  color: rgba(255,255,255,0.85);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(255,255,255,0.4);
  padding-bottom: 0.2rem;
}
.gift-final-cta__link:hover { color: #ffffff; border-color: #ffffff; }
.gift-final-cta__trust {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  line-height: 1.6;
}

/* ==================================================================
   JOURNAL INDEX + ESSAY
   ================================================================== */
.journal-hero {
  background: #FDFBF7;
  padding: clamp(8rem, 16vw, 14rem) 1.5rem clamp(5rem, 10vw, 8rem);
  position: relative;
  overflow: hidden;
}
.journal-hero::before {
  content: "";
  position: absolute;
  top: 60%;
  right: -5rem;
  transform: translateY(-50%);
  width: 240px;
  height: 240px;
  border: 1px solid rgba(26,82,118,0.08);
  border-radius: 50%;
}
.journal-hero__inner { max-width: 1100px; margin: 0 auto; position: relative; z-index: 1; }
@media (min-width: 768px) { .journal-hero { padding-left: 2.5rem; padding-right: 2.5rem; } }
.journal-hero__headline {
  font-size: clamp(3rem, 7vw, 6rem);
  font-variation-settings: 'opsz' 96;
  letter-spacing: -0.035em;
  line-height: 0.95;
  color: var(--ocean-500);
  margin: 1rem 0 1.5rem;
  font-weight: 400;
}
.journal-hero__sub {
  color: #374151;
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  line-height: 1.55;
  max-width: 34rem;
}

.journal-featured { background: #ffffff; padding: clamp(4rem, 8vw, 8rem) 0; }
.journal-featured__link { display: block; }
.journal-featured__inner {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: center;
}
@media (min-width: 900px) { .journal-featured__inner { grid-template-columns: 1.2fr 1fr; gap: 4rem; padding: 0 2.5rem; } }
.journal-featured__image { overflow: hidden; aspect-ratio: 4/3; }
.journal-featured__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1200ms cubic-bezier(.2,.8,.2,1); }
.journal-featured__link:hover .journal-featured__image img { transform: scale(1.04); }
.journal-featured__issue {
  font-size: 10px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--sand-deep);
  margin-bottom: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(201,163,106,0.3);
  display: inline-block;
}
.journal-featured__title {
  font-size: clamp(2rem, 4vw, 3rem);
  font-variation-settings: 'opsz' 56;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--ocean-500);
  margin-bottom: 1.5rem;
  font-weight: 400;
  transition: color 300ms ease;
}
.journal-featured__link:hover .journal-featured__title { color: var(--ocean-600); }
.journal-featured__excerpt {
  color: #374151;
  font-size: 1rem;
  line-height: 1.65;
  margin-bottom: 1.75rem;
  max-width: 34rem;
}
.journal-featured__read {
  color: var(--ocean-500);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(26,82,118,0.35);
  padding-bottom: 0.2rem;
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
}
.journal-featured__read .arrow { transition: transform 300ms ease; }
.journal-featured__link:hover .journal-featured__read .arrow { transform: translateX(4px); }

.journal-archive { background: #FDFBF7; padding: clamp(5rem, 10vw, 10rem) 0; }
.journal-archive__inner { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .journal-archive__inner { padding: 0 2.5rem; } }
.journal-archive__head { margin-bottom: 4rem; max-width: 600px; }
.journal-archive__sub { color: #374151; font-size: 1rem; line-height: 1.55; margin-top: 1rem; max-width: 34rem; }
.journal-archive__list { list-style: none; padding: 0; margin: 0; border-top: 1px solid rgba(26,82,118,0.15); }
.journal-archive__item { border-bottom: 1px solid rgba(26,82,118,0.15); }
.journal-archive__item a {
  display: grid;
  grid-template-columns: 70px 1fr 160px 28px;
  gap: 1.5rem;
  align-items: baseline;
  padding: 1.75rem 0;
  color: inherit;
  text-decoration: none;
  transition: padding-left 300ms ease;
}
.journal-archive__item a:hover { padding-left: 0.75rem; }
@media (max-width: 700px) {
  .journal-archive__item a { grid-template-columns: 50px 1fr auto; grid-template-areas: "num title arrow" "num meta meta"; gap: 0.35rem 1rem; }
  .journal-archive__number { grid-area: num; }
  .journal-archive__title { grid-area: title; }
  .journal-archive__meta { grid-area: meta; }
  .journal-archive__arrow { grid-area: arrow; }
}
.journal-archive__number {
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.4);
  font-variant-numeric: tabular-nums;
}
.journal-archive__title {
  font-size: clamp(1.05rem, 1.6vw, 1.375rem);
  font-variation-settings: 'opsz' 24;
  color: var(--ocean-500);
  letter-spacing: -0.015em;
  line-height: 1.2;
}
.journal-archive__meta {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  text-align: right;
}
@media (max-width: 700px) { .journal-archive__meta { text-align: left; } }
.journal-archive__arrow { color: rgba(26,82,118,0.4); font-size: 1rem; text-align: right; transition: transform 300ms ease, color 300ms ease; }
.journal-archive__item a:hover .journal-archive__arrow { transform: translateX(4px); color: var(--ocean-500); }

/* Essay page */
.essay-hero {
  position: relative;
  min-height: 92vh;
  color: #ffffff;
  background: var(--ocean-900);
  overflow: hidden;
}
.essay-hero__image { position: absolute; inset: 0; }
.essay-hero__image img { width: 100%; height: 100%; object-fit: cover; }
.essay-hero__gradient {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10,14,26,0.3) 0%, transparent 25%, rgba(10,14,26,0.5) 70%, rgba(10,14,26,0.85) 100%);
}
.essay-hero__content {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: clamp(4rem, 8vh, 7rem);
  max-width: 900px;
  z-index: 10;
}
@media (min-width: 640px) { .essay-hero__content { left: 2.5rem; } }
@media (min-width: 1024px) { .essay-hero__content { left: 4rem; bottom: clamp(5rem, 10vh, 8rem); } }
.essay-hero__kicker {
  font-size: 11px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--sand-warm);
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(201,163,106,0.5);
  display: inline-block;
}
.essay-hero__headline {
  font-size: clamp(2.75rem, 8vw, 7rem);
  letter-spacing: -0.035em;
  line-height: 0.95;
  margin-bottom: 2rem;
  font-weight: 400;
  font-variation-settings: 'opsz' 96;
  text-shadow: 0 2px 40px rgba(0,0,0,0.5);
}
.essay-hero__meta {
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}

.essay { background: #FDFBF7; padding: clamp(5rem, 10vw, 10rem) 0; }
.essay__inner { max-width: 720px; margin: 0 auto; padding: 0 1.5rem; }
@media (min-width: 768px) { .essay__inner { padding: 0 2.5rem; } }
.essay__lede {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 32;
  font-size: clamp(1.25rem, 2vw, 1.625rem);
  line-height: 1.45;
  color: var(--ocean-500);
  margin-bottom: 2.5rem;
  letter-spacing: -0.01em;
}
.essay p {
  color: #1A1F2E;
  font-size: 1.1875rem;
  line-height: 1.8;
  margin-bottom: 1.65rem;
  font-weight: 400;
  font-family: 'Space Grotesk', sans-serif;
}
.essay__subhead {
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-variation-settings: 'opsz' 36;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--ocean-500);
  margin: 3.5rem 0 1.5rem;
  font-weight: 400;
}
.essay__figure {
  margin: 3rem 0;
}
.essay__figure img { width: 100%; display: block; }
.essay__figure figcaption {
  margin-top: 1rem;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
  padding-top: 0.75rem;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.essay__signature {
  margin-top: 4rem;
  padding-top: 2.5rem;
  border-top: 1px solid rgba(26,82,118,0.15);
}
.essay__signature-name {
  font-size: 1.5rem;
  font-variation-settings: 'opsz' 32;
  color: var(--sand-deep);
  margin-bottom: 0.5rem;
  letter-spacing: -0.01em;
}
.essay__signature-meta {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.5);
}

.essay-footer-nav { background: #ffffff; padding: 2.5rem 0; border-top: 1px solid rgba(26,82,118,0.1); }
.essay-footer-nav__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
@media (min-width: 768px) { .essay-footer-nav__inner { padding: 0 2.5rem; } }
.essay-footer-nav__back, .essay-footer-nav__next {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  color: var(--ocean-500);
  font-size: 0.9375rem;
  border-bottom: 1px solid rgba(26,82,118,0.3);
  padding-bottom: 0.2rem;
  transition: border-color 200ms ease, gap 260ms ease;
}
.essay-footer-nav__back:hover, .essay-footer-nav__next:hover { border-color: var(--ocean-500); gap: 0.8rem; }
.essay-footer-nav__next { color: var(--sand-deep); border-color: rgba(201,163,106,0.5); }
.essay-footer-nav__next:hover { border-color: var(--sand-deep); }

/* ==================================================================
   TRIP SCARCITY
   ================================================================== */
.trip-scarcity {
  margin: 1.5rem 0 2rem;
  padding: 1.25rem 1.5rem;
  background: rgba(201, 163, 106, 0.1);
  border-left: 2px solid var(--sand-deep);
  max-width: 34rem;
}
.trip-scarcity__label {
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--sand-warm);
  margin-bottom: 0.9rem;
  font-weight: 500;
}
.trip-scarcity__dates {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1rem;
  margin-bottom: 0.75rem;
}
.trip-scarcity__date {
  color: #ffffff;
  font-size: 0.9375rem;
  font-variant-numeric: tabular-nums;
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 20;
}
.trip-scarcity__note {
  font-size: 10px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
}

/* ==================================================================
   MOBILE BOOKING BAR
   ================================================================== */
.mobile-book-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 60;
  background: rgba(10, 14, 26, 0.96);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 0.75rem 1rem;
  transform: translateY(100%);
  transition: transform 350ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}
.mobile-book-bar--visible { transform: translateY(0); }
.mobile-book-bar__inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  max-width: 600px;
  margin: 0 auto;
}
.mobile-book-bar__price {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.mobile-book-bar__value {
  color: #ffffff;
  font-size: 1.125rem;
  font-variation-settings: 'opsz' 24;
  letter-spacing: -0.015em;
  line-height: 1.1;
}
.mobile-book-bar__meta {
  font-size: 9.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-top: 0.2rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mobile-book-bar__cta {
  padding: 0.65rem 1.25rem !important;
  font-size: 0.8125rem !important;
  white-space: nowrap;
}

/* Only show on mobile, only after scroll */
.mobile-book-bar { display: none; }
@media (max-width: 900px) {
  .mobile-book-bar { display: block; }
  /* Give page a little padding at the bottom when bar is visible */
  body.has-mobile-bar { padding-bottom: 5rem; }
}

/* ==================================================================
   FOOTER LEAD-MAGNET STRIP
   ================================================================== */
.editorial-footer__leadmagnet {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  align-items: flex-start;
  justify-content: space-between;
  margin: clamp(2.5rem, 4vw, 3.5rem) 0;
  padding: clamp(1.75rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.25rem);
  background: rgba(201,163,106,0.06);
  border: 1px solid rgba(201,163,106,0.2);
}
@media (min-width: 768px) {
  .editorial-footer__leadmagnet {
    flex-direction: row;
    align-items: center;
    gap: 2rem;
  }
}
.editorial-footer__lm-head {
  color: rgba(255,255,255,0.92);
  font-size: clamp(1.125rem, 1.7vw, 1.375rem);
  line-height: 1.25;
  letter-spacing: -0.015em;
  margin: 0.45rem 0 0;
  max-width: 480px;
}

/* Visible focus rings for a11y (removed-default was hurting accessibility score) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--sand-deep);
  outline-offset: 2px;
}

/* ==================================================================
   TOOLS PAGE — cinematic editorial library
   ================================================================== */
.tools-hero {
  position: relative;
  min-height: 92vh;
  overflow: hidden;
  background: #0a0e1a;
  color: #fff;
  display: flex;
  align-items: flex-end;
}
.tools-hero__bg { position: absolute; inset: 0; }
.tools-hero__bg img {
  width: 100%; height: 100%; object-fit: cover;
  filter: contrast(1.06) saturate(0.85) brightness(0.78);
}
.tools-hero__gradient {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(10,14,26,0.75) 0%, rgba(10,14,26,0.25) 30%, rgba(10,14,26,0.4) 60%, rgba(10,14,26,0.96) 100%);
}
.tools-hero__vignette {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 30% 90%, transparent 30%, rgba(10,14,26,0.6) 100%);
  pointer-events: none;
}
.tools-hero__mark {
  position: absolute;
  right: -0.05em; bottom: -0.18em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 300;
  color: rgba(201,163,106,0.07);
  font-size: clamp(10rem, 22vw, 22rem);
  line-height: 0.85;
  letter-spacing: -0.04em;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  z-index: 1;
}
.tools-hero__stamp {
  position: absolute;
  top: clamp(8rem, 12vw, 10rem);
  right: clamp(1.5rem, 4vw, 4rem);
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 10px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}
.tools-hero__stamp-rule { display: block; width: 36px; height: 1px; background: rgba(255,255,255,0.45); }
.tools-hero__content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 clamp(1.5rem, 4vw, 4rem) clamp(4rem, 7vw, 6rem);
}
.tools-hero__kicker {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-warm);
  margin-bottom: 1.5rem;
  font-weight: 500;
}
.tools-hero__headline {
  font-size: clamp(3.5rem, 9vw, 8rem);
  font-variation-settings: 'opsz' 96;
  letter-spacing: -0.04em;
  line-height: 0.92;
  color: #fff;
  margin: 0 0 2rem;
  text-shadow: 0 2px 60px rgba(0,0,0,0.6);
}
.tools-hero__sub {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.0625rem, 1.4vw, 1.25rem);
  line-height: 1.7;
  color: rgba(255,255,255,0.82);
  max-width: 620px;
  font-weight: 400;
  margin: 0 0 2.5rem;
}
.tools-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  border-top: 1px solid rgba(255,255,255,0.18);
  padding-top: 1.5rem;
  max-width: 620px;
}
.tools-hero__meta-num {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 1.5rem;
  letter-spacing: normal;
  text-transform: none;
  color: var(--sand-warm);
  margin-right: 0.4rem;
  vertical-align: -0.15em;
}
.tools-hero__meta-rule { width: 24px; height: 1px; background: rgba(255,255,255,0.3); }

/* ===== Featured tool ===== */
.tools-featured {
  background: #FDFBF7;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem clamp(3rem, 6vw, 5rem);
}
.tools-featured__inner { max-width: 1200px; margin: 0 auto; }
.tools-featured__link {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
  text-decoration: none;
  color: inherit;
  background: #fff;
  padding: clamp(2.5rem, 5vw, 4rem);
  border: 1px solid var(--hairline-soft);
  position: relative;
  transition: border-color 0.5s ease, transform 0.6s var(--ease-out);
}
@media (min-width: 900px) {
  .tools-featured__link { grid-template-columns: 280px 1fr; padding: clamp(3rem, 5vw, 4.5rem); }
}
.tools-featured__link:hover { border-color: var(--sand-deep); }
.tools-featured__art {
  color: var(--ocean-500);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
  transition: transform 1.2s var(--ease-out);
}
.tools-featured__circle {
  width: 100%; height: auto;
  animation: tools-pulse 6s ease-in-out infinite;
}
@keyframes tools-pulse {
  0%, 100% { opacity: 0.85; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.03); }
}
.tools-featured__link:hover .tools-featured__art { transform: scale(1.04); }
.tools-featured__eyebrow {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-deep);
  margin: 0 0 1rem;
  font-weight: 500;
}
.tools-featured__name {
  font-size: clamp(2rem, 4vw, 3rem);
  font-variation-settings: 'opsz' 56;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--ocean-500);
  margin: 0 0 1.25rem;
}
.tools-featured__desc {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.0625rem;
  line-height: 1.7;
  color: #1A1F2E;
  margin: 0 0 1.75rem;
  max-width: 580px;
}
.tools-featured__cta {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 1.125rem;
  color: var(--sand-deep);
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  transition: gap 0.35s ease;
}
.tools-featured__link:hover .tools-featured__cta { gap: 1rem; }

/* ===== Chaptered tool list ===== */
.tools-chapter {
  background: #FDFBF7;
  padding: clamp(3rem, 6vw, 5rem) 1.5rem;
}
.tools-chapter:nth-child(odd of .tools-chapter) { background: #fff; }
.tools-chapter__inner { max-width: 1200px; margin: 0 auto; }
.tools-chapter__head {
  max-width: 720px;
  margin: 0 auto clamp(2.5rem, 4vw, 3.5rem);
  text-align: center;
  position: relative;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--hairline-soft);
}
.tools-chapter__roman {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-deep);
  font-style: normal;
  margin-bottom: 1rem;
}
.tools-chapter__title {
  font-size: clamp(2.25rem, 4.5vw, 3.5rem);
  font-variation-settings: 'opsz' 56;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--ocean-500);
  margin: 0 0 1rem;
}
.tools-chapter__kicker {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.95rem;
  color: rgba(26,82,118,0.6);
  font-weight: 400;
  letter-spacing: 0.02em;
}
.tools-chapter__list {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--hairline-soft);
}
.tool-row {
  display: grid;
  grid-template-columns: 70px 1fr auto auto;
  gap: 1.5rem;
  align-items: baseline;
  padding: 1.85rem 1rem;
  border-bottom: 1px solid var(--hairline-soft);
  text-decoration: none;
  color: inherit;
  transition: background 0.4s ease, padding-left 0.4s ease;
  position: relative;
}
.tool-row:hover { background: #fff; padding-left: 1.5rem; }
.tools-chapter:nth-child(odd of .tools-chapter) .tool-row:hover { background: #FDFBF7; }
.tool-row__num {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 32;
  font-size: 1.0625rem;
  color: var(--sand-deep);
  letter-spacing: 0.02em;
  font-weight: 500;
}
.tool-row__main { min-width: 0; }
.tool-row__name {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 28;
  font-weight: 500;
  font-size: clamp(1.375rem, 2vw, 1.625rem);
  letter-spacing: -0.015em;
  line-height: 1.15;
  color: var(--ocean-500);
  margin: 0 0 0.5rem;
}
.tool-row__desc {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: rgba(26,31,46,0.72);
  margin: 0;
  font-weight: 400;
  max-width: 60ch;
}
.tool-row__time {
  font-size: 10px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.55);
  font-weight: 500;
  white-space: nowrap;
}
.tool-row__arrow {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 1.25rem;
  color: var(--sand-deep);
  transition: transform 0.4s ease;
}
.tool-row:hover .tool-row__arrow { transform: translateX(6px); }
@media (max-width: 640px) {
  .tool-row {
    grid-template-columns: 50px 1fr auto;
    gap: 1rem;
    padding: 1.5rem 0.5rem;
  }
  .tool-row__time { display: none; }
  .tool-row__name { font-size: 1.25rem; }
  .tool-row:hover { padding-left: 0.75rem; }
}

/* ===== "Why" pull quote ===== */
.tools-why {
  background: #0a0e1a;
  color: #fff;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem;
  position: relative;
  overflow: hidden;
}
.tools-why__inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 2;
}
.tools-why__inner .editorial-eyebrow {
  color: rgba(255,255,255,0.55);
  margin-bottom: 2rem;
  display: inline-block;
}
.tools-why__body {
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-variation-settings: 'opsz' 36;
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: rgba(255,255,255,0.92);
  margin: 0 0 2rem;
}
.tools-why__attr {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  color: var(--sand-warm);
  font-size: 1.125rem;
  margin: 0;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .hero-cinematic video { display: none; }
  .blog-card:hover .blog-card__image img,
  .days-list__preview,
  .signature-section a:hover .signature-img,
  .tool-card:hover,
  .contact-card:hover,
  .gallery-masonry__item:hover img { transform: none !important; }
}


/* ==================================================================
   TRIPS INDEX — editorial
   ================================================================== */
.trips-index-hero {
  position: relative;
  overflow: hidden;
  background: #0a0e1a;
  color: #fff;
  padding: clamp(9rem, 14vw, 13rem) 1.5rem clamp(5rem, 8vw, 7rem);
}
.trips-index-hero__mark {
  position: absolute;
  right: -0.05em;
  bottom: -0.18em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 200;
  color: rgba(201,163,106,0.07);
  font-size: clamp(9rem, 18vw, 18rem);
  line-height: 0.85;
  letter-spacing: -0.04em;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.trips-index-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto;
}
.trips-index-hero__headline {
  font-size: clamp(3rem, 7.5vw, 6.5rem);
  font-variation-settings: 'opsz' 72;
  letter-spacing: -0.035em;
  line-height: 0.95;
  color: #fff;
  margin: 1.25rem 0 2rem;
  max-width: 900px;
}
.trips-index-hero__sub {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.0625rem, 1.35vw, 1.25rem);
  line-height: 1.65;
  color: rgba(255,255,255,0.78);
  max-width: 620px;
}

.trips-index-list {
  background: #FDFBF7;
  padding: clamp(4rem, 8vw, 7rem) 1.5rem;
}
.trips-index-list__inner {
  max-width: 1300px;
  margin: 0 auto;
}
.days-list__item--signature .days-list__badge {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-style: normal;
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--sand-deep);
  margin-left: 0.5rem;
  vertical-align: 0.18em;
}

.trips-index-included {
  background: #fff;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem;
}
.trips-index-included__inner {
  max-width: 1100px;
  margin: 0 auto;
}
.trips-index-included__head {
  max-width: 640px;
  margin: 0 auto clamp(3rem, 5vw, 4.5rem);
  text-align: center;
}
.trips-index-included__head .editorial-h2 {
  margin-top: 1rem;
}
.trips-index-included__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--hairline-soft);
}
@media (min-width: 768px) {
  .trips-index-included__list { grid-template-columns: 1fr 1fr; }
}
.trips-index-included__list li {
  display: flex;
  gap: 1.75rem;
  align-items: flex-start;
  padding: 2rem 1.25rem;
  border-bottom: 1px solid var(--hairline-soft);
}
@media (min-width: 768px) {
  .trips-index-included__list li:nth-child(odd) { border-right: 1px solid var(--hairline-soft); }
}
.trips-index-included__num {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 48;
  font-size: 2rem;
  color: var(--sand-deep);
  line-height: 1;
  flex-shrink: 0;
  min-width: 2.5rem;
}
.trips-index-included__name {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 500;
  font-size: 1.0625rem;
  color: #1A1F2E;
  margin: 0 0 0.4rem;
  letter-spacing: -0.005em;
}
.trips-index-included__desc {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: rgba(26,31,46,0.72);
  margin: 0;
}

/* ==================================================================
   BODY TEXT WEIGHT FIX — bump 300 → 400 on body copy contexts
   ================================================================== */
.hero-subtitle,
.signature-body,
.final-cta-body,
.trip-final-cta__body,
.scrollytell__body,
.about-hero__sub,
.about-philosophy__body p,
.your-day-hero__sub,
.gift-hero__sub { font-weight: 400 !important; }

/* ==================================================================
   PAGE HERO — unified editorial hero for utility pages
   (contact, faq, blog, tools, safety header)
   ================================================================== */
.page-hero {
  position: relative;
  overflow: hidden;
  background: #0a0e1a;
  color: #fff;
  padding: clamp(8rem, 13vw, 12rem) 1.5rem clamp(4rem, 7vw, 6rem);
}
.page-hero__mark {
  position: absolute;
  right: -0.05em;
  bottom: -0.18em;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 300;
  color: rgba(201,163,106,0.07);
  font-size: clamp(8rem, 17vw, 17rem);
  line-height: 0.85;
  letter-spacing: -0.04em;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.page-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto;
}
.page-hero__eyebrow {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-bottom: 1.25rem;
  font-weight: 500;
}
.page-hero__headline {
  font-size: clamp(2.75rem, 6.5vw, 5.5rem);
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 72;
  letter-spacing: -0.035em;
  line-height: 0.98;
  color: #fff;
  margin: 0 0 1.75rem;
  max-width: 900px;
}
.page-hero__sub {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(1.0625rem, 1.3vw, 1.1875rem);
  line-height: 1.65;
  color: rgba(255,255,255,0.78);
  font-weight: 400;
  max-width: 620px;
  margin: 0;
}

/* ==================================================================
   CONTACT — editorial channel cards
   ================================================================== */
.contact-channels {
  background: #FDFBF7;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem;
}
.contact-channels__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.contact-channels__head {
  text-align: center;
  margin-bottom: clamp(3rem, 5vw, 4.5rem);
}
.contact-channels__head .editorial-h2 { margin-top: 1rem; }
.contact-channels__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 1px solid var(--hairline-soft);
}
@media (min-width: 640px) { .contact-channels__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .contact-channels__grid { grid-template-columns: repeat(4, 1fr); } }

.contact-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 260px;
  padding: 2.5rem 2rem 2.25rem;
  border-bottom: 1px solid var(--hairline-soft);
  background: transparent;
  transition: background 0.5s ease;
  text-decoration: none;
  color: inherit;
  position: relative;
}
@media (min-width: 640px) {
  .contact-card:nth-child(2n+1) { border-right: 1px solid var(--hairline-soft); }
}
@media (min-width: 1024px) {
  .contact-card { border-right: 1px solid var(--hairline-soft); }
  .contact-card:nth-child(2n+1) { border-right: 1px solid var(--hairline-soft); }
  .contact-card:last-child { border-right: none; }
}
.contact-card:hover { background: #fff; }
.contact-card__num {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 48;
  font-size: 1.625rem;
  color: var(--sand-deep);
  line-height: 1;
  margin-bottom: 2rem;
}
.contact-card__name {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: clamp(1.5rem, 2vw, 1.875rem);
  font-variation-settings: 'opsz' 36;
  color: var(--ocean-500);
  letter-spacing: -0.015em;
  margin: 0 0 0.6rem;
  line-height: 1.1;
}
.contact-card__value {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1rem;
  color: #1A1F2E;
  font-weight: 500;
  margin: 0 0 0.5rem;
  letter-spacing: -0.005em;
  word-break: break-word;
}
.contact-card__note {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.6);
  margin: 0;
  font-weight: 500;
}
.contact-card__arrow {
  position: absolute;
  top: 2.5rem;
  right: 2rem;
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 1.25rem;
  color: var(--sand-deep);
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.contact-card:hover .contact-card__arrow { opacity: 1; transform: translateX(0); }

.contact-map {
  background: #fff;
  padding: clamp(4rem, 7vw, 6rem) 1.5rem;
}
.contact-map__inner {
  max-width: 1200px;
  margin: 0 auto;
}
.contact-map__head {
  max-width: 620px;
  margin: 0 auto clamp(2rem, 4vw, 3rem);
  text-align: center;
}
.contact-map__body {
  color: rgba(26,31,46,0.72);
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.0625rem;
  line-height: 1.65;
  margin-top: 1rem;
}
.contact-map__frame {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 24px 60px -30px rgba(10,14,26,0.35);
  aspect-ratio: 16 / 9;
  border: 1px solid var(--hairline-soft);
}
.contact-map__frame iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ==================================================================
   FAQ — editorial accordion
   ================================================================== */
.faq-section {
  background: #FDFBF7;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem;
}
.faq-section__inner {
  max-width: 860px;
  margin: 0 auto;
}
.faq-list {
  border-top: 1px solid rgba(26,82,118,0.18);
}
.faq-item {
  border-bottom: 1px solid rgba(26,82,118,0.18);
}
.faq-item__button {
  width: 100%;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2rem;
  background: transparent;
  border: 0;
  padding: 1.85rem 0.5rem 1.85rem 0;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  transition: padding 0.3s ease;
}
.faq-item__button:hover { padding-left: 0.75rem; }
.faq-item__num {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  color: var(--sand-deep);
  font-size: 0.9375rem;
  letter-spacing: 0.02em;
  min-width: 2.75rem;
  opacity: 0.85;
}
.faq-item__q {
  flex: 1;
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 32;
  font-size: clamp(1.25rem, 1.8vw, 1.5rem);
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: var(--ocean-500);
  margin: 0;
}
.faq-item__icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  color: var(--sand-deep);
  transition: transform 0.35s cubic-bezier(.22,.61,.36,1);
  margin-top: 0.35rem;
}
.faq-item.is-open .faq-item__icon { transform: rotate(45deg); }
.faq-item__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.45s cubic-bezier(.22,.61,.36,1);
}
.faq-item.is-open .faq-item__answer { max-height: 600px; }
.faq-item__answer-inner {
  padding: 0 3.5rem 2rem 3.25rem;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.0625rem;
  line-height: 1.75;
  color: #1A1F2E;
  font-weight: 400;
}
@media (max-width: 600px) {
  .faq-item__answer-inner { padding-left: 0; padding-right: 0; }
  .faq-item__button { gap: 1rem; }
}

.faq-footer {
  margin-top: clamp(4rem, 7vw, 6rem);
  text-align: center;
}
.faq-footer p {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 1.5rem;
  color: var(--ocean-500);
  margin: 0 0 2rem;
  letter-spacing: -0.01em;
}
.faq-footer__actions {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
  justify-content: center;
}
@media (min-width: 600px) { .faq-footer__actions { flex-direction: row; gap: 1.5rem; } }

/* ==================================================================
   BLOG INDEX — editorial archive
   ================================================================== */
.blog-archive {
  background: #FDFBF7;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem;
}
.blog-archive__inner {
  max-width: 1300px;
  margin: 0 auto;
}
.blog-archive__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: clamp(3rem, 5vw, 4.5rem);
  border-bottom: 1px solid rgba(26,82,118,0.15);
  padding-bottom: 1.5rem;
  flex-wrap: wrap;
  gap: 1rem;
}
.blog-archive__count {
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.6);
}
.blog-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem 2.5rem;
}
@media (min-width: 768px) { .blog-grid { grid-template-columns: 1fr 1fr; gap: 4rem 2.5rem; } }
@media (min-width: 1100px) { .blog-grid { grid-template-columns: 1fr 1fr 1fr; gap: 4.5rem 3rem; } }

.blog-card {
  display: block;
  text-decoration: none;
  color: inherit;
}
.blog-card__image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  margin-bottom: 1.5rem;
  background: #e9e2d4;
}
.blog-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 1.2s cubic-bezier(.22,.61,.36,1), filter 1.2s ease;
  filter: contrast(1.04) saturate(0.88) brightness(0.96);
}
.blog-card:hover .blog-card__image img { transform: scale(1.04); }
.blog-card__category {
  position: absolute;
  top: 1rem;
  left: 1rem;
  font-size: 10px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #fff;
  background: rgba(10,14,26,0.55);
  backdrop-filter: blur(6px);
  padding: 0.45rem 0.8rem;
  font-weight: 500;
}
.blog-card__meta {
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.6);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.blog-card__meta-sep { opacity: 0.5; }
.blog-card__title {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 36;
  font-size: clamp(1.375rem, 1.9vw, 1.625rem);
  letter-spacing: -0.015em;
  line-height: 1.2;
  color: var(--ocean-500);
  margin: 0 0 0.85rem;
  transition: color 0.35s ease;
}
.blog-card:hover .blog-card__title { color: var(--sand-deep); }
.blog-card__excerpt {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: rgba(26,31,46,0.72);
  margin: 0 0 1rem;
  font-weight: 400;
}
.blog-card__readmore {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 0.9375rem;
  color: var(--sand-deep);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.blog-card__readmore .arrow { transition: transform 0.35s ease; }
.blog-card:hover .blog-card__readmore .arrow { transform: translateX(4px); }

/* ==================================================================
   BLOG ARTICLE PROSE — full typographic system
   ================================================================== */
.prose,
.prose-lg,
.prose.prose-lg {
  font-family: 'Space Grotesk', sans-serif;
  color: #1A1F2E;
  font-size: 1.1875rem;
  line-height: 1.8;
  font-weight: 400;
}
.prose > * + * { margin-top: 1.65rem; }
.prose p {
  margin: 0;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.1875rem;
  line-height: 1.8;
  color: #1A1F2E;
  font-weight: 400;
}
.prose p + p { margin-top: 1.65rem; }
.prose p strong,
.prose li strong { font-weight: 600; color: var(--ocean-500); }
.prose p em,
.prose li em { font-style: italic; }
.prose a {
  color: var(--sand-deep);
  text-decoration: none;
  border-bottom: 1px solid rgba(201,163,106,0.4);
  transition: border-color 0.25s ease, color 0.25s ease;
}
.prose a:hover { color: var(--ocean-500); border-bottom-color: var(--ocean-500); }
.prose h1,
.prose h2,
.prose h3,
.prose h4 {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  color: var(--ocean-500);
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 3.25rem 0 1.1rem;
  font-weight: 400;
}
.prose h2 {
  font-size: clamp(1.75rem, 2.7vw, 2.375rem);
  font-variation-settings: 'opsz' 40;
  padding-top: 0.5rem;
  position: relative;
}
.prose h2::before {
  content: "";
  position: absolute;
  top: -0.75rem;
  left: 0;
  width: 2.5rem;
  height: 1px;
  background: var(--sand-deep);
}
.prose h3 {
  font-size: clamp(1.375rem, 2vw, 1.625rem);
  font-variation-settings: 'opsz' 28;
  margin-top: 2.5rem;
}
.prose h4 {
  font-size: 1.25rem;
  font-variation-settings: 'opsz' 20;
  margin-top: 2rem;
}
.prose ul,
.prose ol {
  margin: 1.65rem 0;
  padding-left: 1.5rem;
  list-style: none;
}
.prose ul li,
.prose ol li {
  position: relative;
  padding-left: 1.25rem;
  margin-bottom: 0.85rem;
  font-size: 1.1875rem;
  line-height: 1.75;
}
.prose ul li::before {
  content: "·";
  position: absolute;
  left: 0;
  top: -0.25rem;
  color: var(--sand-deep);
  font-size: 2rem;
  line-height: 1;
  font-family: 'Bodoni Moda', serif;
}
.prose ol { counter-reset: ol-counter; }
.prose ol li { counter-increment: ol-counter; }
.prose ol li::before {
  content: counter(ol-counter, decimal-leading-zero) ".";
  position: absolute;
  left: -1.5rem;
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  color: var(--sand-deep);
  font-size: 0.95rem;
}
.prose blockquote {
  margin: 2.5rem 0;
  padding: 0 0 0 1.75rem;
  border-left: 2px solid var(--sand-deep);
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  line-height: 1.45;
  color: var(--ocean-500);
  letter-spacing: -0.01em;
}
.prose blockquote p { font-family: inherit; font-size: inherit; line-height: inherit; color: inherit; font-style: inherit; }
.prose img {
  width: 100%;
  height: auto;
  margin: 2.5rem 0;
  display: block;
  filter: contrast(1.04) saturate(0.88) brightness(0.96);
}
.prose figure { margin: 2.5rem 0; }
.prose figure img { margin: 0; }
.prose figcaption {
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(26,82,118,0.15);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.6);
}
.prose hr {
  border: 0;
  height: 1px;
  background: rgba(26,82,118,0.15);
  margin: 3.5rem 0;
}
.prose code {
  font-family: 'Space Grotesk', monospace;
  background: rgba(201,163,106,0.12);
  padding: 0.1em 0.4em;
  font-size: 0.95em;
  border-radius: 2px;
}
.prose table {
  width: 100%;
  border-collapse: collapse;
  margin: 2.5rem 0;
  font-size: 0.9375rem;
}
.prose th,
.prose td {
  text-align: left;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid rgba(26,82,118,0.12);
}
.prose th {
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(26,82,118,0.65);
  font-weight: 500;
}

/* Blog article wrapper: place article in warm paper */
.blog-article-body {
  background: #FDFBF7;
  padding: clamp(4rem, 8vw, 7rem) 1.5rem clamp(5rem, 9vw, 8rem);
}
.blog-article-body .prose {
  max-width: 720px;
  margin: 0 auto;
}
/* Existing article blocks across blog/ still use max-w-3xl + py-12 Tailwind wrapper.
   Make them read like the essay: warm paper bg + centered prose. */
article:has(> .prose) {
  background: #FDFBF7;
  padding-top: clamp(3rem, 7vw, 6rem) !important;
  padding-bottom: clamp(4rem, 8vw, 7rem) !important;
}
article > .prose { max-width: 720px; margin: 0 auto; }
/* Fallback for browsers without :has() — relies on body-level class if present */
body { background: #ffffff; }

/* Blog article hero refinement */
.blog-hero-editorial {
  position: relative;
  overflow: hidden;
}
.blog-hero-editorial__image {
  aspect-ratio: 21 / 9;
  width: 100%;
  overflow: hidden;
}
.blog-hero-editorial__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.04) saturate(0.88) brightness(0.9);
}
.blog-hero-editorial__gradient {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(10,14,26,0.85) 0%, rgba(10,14,26,0.35) 45%, transparent 100%);
  pointer-events: none;
}
.blog-hero-editorial__content {
  position: absolute;
  inset: auto 0 0 0;
  padding: clamp(2.5rem, 6vw, 5rem) 1.5rem clamp(2.5rem, 5vw, 4rem);
}
.blog-hero-editorial__inner {
  max-width: 900px;
  margin: 0 auto;
}
.blog-hero-editorial__category {
  display: inline-block;
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sand-warm);
  margin-bottom: 1.25rem;
  font-weight: 500;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(201,163,106,0.5);
}
.blog-hero-editorial__title {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 72;
  font-size: clamp(2rem, 5vw, 3.75rem);
  letter-spacing: -0.03em;
  line-height: 1.02;
  color: #fff;
  margin: 0 0 1.5rem;
  max-width: 820px;
}
.blog-hero-editorial__meta {
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.72);
  display: flex;
  gap: 1rem;
  align-items: center;
  font-weight: 500;
}
.blog-hero-editorial__meta-sep { opacity: 0.5; }

/* ==================================================================
   TOOLS — editorial grid
   ================================================================== */
.tools-section {
  background: #FDFBF7;
  padding: clamp(5rem, 9vw, 8rem) 1.5rem;
}
.tools-section__inner {
  max-width: 1300px;
  margin: 0 auto;
}
.tools-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 1px solid rgba(26,82,118,0.15);
}
@media (min-width: 640px) { .tools-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .tools-grid { grid-template-columns: 1fr 1fr 1fr; } }
.tool-card {
  display: flex;
  flex-direction: column;
  padding: 2.5rem 2rem;
  min-height: 280px;
  border-bottom: 1px solid rgba(26,82,118,0.15);
  text-decoration: none;
  color: inherit;
  transition: background 0.5s ease;
  position: relative;
}
@media (min-width: 640px) {
  .tool-card:nth-child(2n+1) { border-right: 1px solid rgba(26,82,118,0.15); }
}
@media (min-width: 1024px) {
  .tool-card { border-right: 1px solid rgba(26,82,118,0.15); }
  .tool-card:nth-child(3n) { border-right: none; }
  .tool-card:nth-child(2n+1) { border-right: 1px solid rgba(26,82,118,0.15); }
}
.tool-card:hover { background: #fff; }
.tool-card__num {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 32;
  color: var(--sand-deep);
  font-size: 1rem;
  margin-bottom: 2rem;
  letter-spacing: 0.05em;
}
.tool-card__title {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-variation-settings: 'opsz' 36;
  font-size: clamp(1.375rem, 1.9vw, 1.625rem);
  color: var(--ocean-500);
  letter-spacing: -0.015em;
  line-height: 1.2;
  margin: 0 0 0.85rem;
}
.tool-card__desc {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: rgba(26,31,46,0.72);
  margin: 0 0 1.5rem;
  font-weight: 400;
  flex: 1;
}
.tool-card__arrow {
  font-family: 'Bodoni Moda', serif;
  font-style: italic;
  font-size: 0.9375rem;
  color: var(--sand-deep);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: gap 0.35s ease;
}
.tool-card:hover .tool-card__arrow { gap: 0.85rem; }

/* ==================================================================
   GALLERY — refined figure treatment
   ================================================================== */
.gallery-section {
  background: #FDFBF7;
  padding: clamp(4rem, 8vw, 7rem) 1.5rem;
}
.gallery-section__inner {
  max-width: 1400px;
  margin: 0 auto;
}
.gallery-masonry {
  column-count: 1;
  column-gap: 1.25rem;
}
@media (min-width: 640px) { .gallery-masonry { column-count: 2; column-gap: 1.5rem; } }
@media (min-width: 1100px) { .gallery-masonry { column-count: 3; column-gap: 1.75rem; } }
.gallery-masonry__item {
  break-inside: avoid;
  margin-bottom: 1.5rem;
  cursor: zoom-in;
  overflow: hidden;
  background: #e9e2d4;
}
@media (min-width: 1100px) { .gallery-masonry__item { margin-bottom: 1.75rem; } }
.gallery-masonry__item img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 1s cubic-bezier(.22,.61,.36,1), filter 0.6s ease;
  filter: contrast(1.04) saturate(0.88) brightness(0.96);
}
.gallery-masonry__item:hover img { transform: scale(1.03); filter: contrast(1.08) saturate(0.95) brightness(1); }

/* ==================================================================
   REVIEWS — further readability anchor
   ================================================================== */
.reviews-column-item__quote {
  font-size: 1.1875rem;
  line-height: 1.7;
  color: #14202e;
  font-weight: 450;
}
.reviews-editorial__featured-quote {
  color: var(--ocean-500);
}

