@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --navy:#173250;
  --navy-dark:#0d1f33;
  --gold:#c8a44d;
  --gold-light:#e2c273;
  --cream:#faf7f1;
  --ink:#20262e;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;color:var(--ink);background:#fff}
h1,h2,h3,.font-display{font-family:'Playfair Display',serif}

.text-navy{color:var(--navy)}
.bg-navy{background-color:var(--navy)}
.bg-navy-dark{background-color:var(--navy-dark)}
.text-gold{color:var(--gold)}
.bg-gold{background-color:var(--gold)}
.bg-cream{background-color:var(--cream)}
.border-gold{border-color:var(--gold)}

.btn-gold{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:var(--gold);color:var(--navy-dark);font-weight:600;
  padding:.85rem 1.75rem;border-radius:2px;letter-spacing:.03em;
  text-transform:uppercase;font-size:.8rem;transition:background .2s ease;
  min-height:44px;
}
.btn-gold:hover{background:var(--gold-light)}

.btn-outline{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:transparent;color:#fff;font-weight:600;
  padding:.8rem 1.7rem;border-radius:2px;letter-spacing:.03em;
  text-transform:uppercase;font-size:.8rem;border:1px solid rgba(255,255,255,.6);
  transition:all .2s ease;min-height:44px;
}
.btn-outline:hover{background:rgba(255,255,255,.12)}

.section-title{position:relative;padding-bottom:1rem;margin-bottom:2rem}
.section-title::after{
  content:'';position:absolute;left:0;bottom:0;width:56px;height:2px;background:var(--gold);
}
.section-title.center::after{left:50%;transform:translateX(-50%)}

.nav-link{position:relative;padding:.25rem 0;font-size:.85rem;letter-spacing:.02em}
.nav-link::after{
  content:'';position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--gold);
  transition:width .2s ease;
}
.nav-link:hover::after,.nav-link.active::after{width:100%}
.nav-link.active{color:var(--gold)}

.card-room{transition:transform .3s ease,box-shadow .3s ease}
.card-room:hover{transform:translateY(-4px);box-shadow:0 20px 40px -20px rgba(23,50,80,.35)}

.top-bar a{transition:color .15s ease}
.top-bar a:hover{color:var(--gold)}

@media(max-width:767px){
  .hero-title{font-size:2.1rem !important}
}

@keyframes kenburns{
  0%{transform:scale(1.12) translate(0,0)}
  100%{transform:scale(1) translate(-1%,-1%)}
}
.hero-kenburns{
  animation:kenburns 18s ease-out forwards;
  will-change:transform;
}
@media(prefers-reduced-motion:reduce){
  .hero-kenburns{animation:none}
}

[hidden]{display:none!important}

.sketch-medallion{
  border-radius:50%;
  border:3px solid var(--gold);
  box-shadow:0 12px 28px -12px rgba(23,50,80,.45);
  object-fit:cover;
  background:var(--cream);
}