/* === TOKENS === */
:root{
  --paper:#f6f1e6;
  --ink:#2b2620;
  --ink-soft: rgba(43,38,32,0.72);
  --ink-faint: rgba(43,38,32,0.14);
  --lake:#7c9885;
  --lake-2:#e9c9a3;
  --font-display: 'Cormorant Garamond', serif;
  --font-body: 'Albert Sans', sans-serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--font-body);
  font-weight:300;
  color: var(--ink);
  background: var(--paper);
  line-height:1.6;
}
a{ color:inherit; }

/* === HERO === */
.hero{
  min-height:88vh;
  display:flex; flex-direction:column;
  background: linear-gradient(180deg, #f6f1e6 0%, #f0e6d2 100%);
}
.nav{
  display:flex; justify-content:space-between; align-items:center;
  padding: 1.8rem clamp(1.5rem, 5vw, 3.5rem);
}
.logo{
  font-family: var(--font-display);
  font-size:1.4rem; font-weight:600;
  text-decoration:none;
  letter-spacing:0.04em;
}
.nav-link{ font-size:0.85rem; letter-spacing:0.06em; text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:2px; }

.hero-content{
  flex:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
  padding: 2rem clamp(1.2rem, 6vw, 3rem) 4rem;
}
.kicker{ font-size:0.85rem; letter-spacing:0.32em; text-transform:uppercase; color: var(--ink-soft); margin-bottom:1.2rem; }
.hero h1{
  font-family: var(--font-display); font-weight:500;
  font-size: clamp(2.4rem, 7vw, 4.6rem);
  line-height:1.1;
  max-width:18ch;
}
.hero h1 i{ font-style:italic; }
.hero .sub{
  margin-top:1.5rem;
  max-width:52ch;
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  color: var(--ink-soft);
}
.hero .note{
  margin-top:1.4rem;
  font-family: var(--font-display);
  font-style:italic;
  color: var(--ink-soft);
  font-size:1.05rem;
}

/* === DESTINATIONS === */
.destinations{
  display:flex;
  justify-content:center;
  padding: 0 clamp(1.2rem, 6vw, 3.5rem) clamp(4rem, 8vw, 6rem);
}
.dest-card{
  background: var(--paper);
  border: 1px solid var(--ink-faint);
  text-decoration:none;
  color: inherit;
  display:flex; flex-direction:column;
  max-width: 680px;
  width:100%;
  transition: transform .35s ease;
}
.dest-card:hover{ transform: translateY(-4px); }
.dest-visual{
  aspect-ratio: 16/9;
}
.dest-card.lake .dest-visual{
  background: linear-gradient(155deg, var(--lake) 0%, var(--lake-2) 70%, #f4e6c8 100%);
}
.dest-body{ padding: clamp(1.8rem, 4vw, 3rem); flex:1; display:flex; flex-direction:column; }
.dest-region{ font-size:0.75rem; letter-spacing:0.24em; text-transform:uppercase; color: var(--ink-soft); }
.dest-body h2{
  font-family: var(--font-display); font-weight:500;
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  margin: 0.5rem 0 1rem;
}
.dest-body p{ color: var(--ink-soft); font-size:0.98rem; flex:1; }
.dest-cta{ margin-top:1.4rem; font-size:0.85rem; letter-spacing:0.04em; }

/* === FOOTER === */
.footer{
  background: var(--ink);
  color: var(--paper);
  text-align:center;
  padding: clamp(2.5rem, 5vw, 3.5rem) 1.5rem;
}
.footer-brand{ font-family: var(--font-display); font-size:1.2rem; letter-spacing:0.1em; }
.footer-tag{ margin-top:0.5rem; font-size:0.85rem; opacity:0.75; }
.footer-copy{ margin-top:1.2rem; font-size:0.72rem; opacity:0.5; }

/* === REVEAL === */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .8s ease, transform .8s ease; }
.reveal.in-view{ opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
}