﻿:root{
  --bg-900: #fff8ec;
  --brand-navy: #06284f;
  --brand-navy-700: #0c3768;
  --brand-gold: #b9862c;
  --brand-gold-600: #d0a24a;
  --brand-gold-dark: #7d5416;
  --brand-ivory: #fff8ec;
  --brand-cream: #f3e7d3;
  --brand-white: #ffffff;
  --ink: var(--brand-navy);
  --muted-ink: #5b6470;
  --panel: rgba(255, 252, 246, 0.9);
  --brand-gradient: linear-gradient(135deg, #f4db9c 0%, var(--brand-gold) 45%, #8a5c18 100%);
  --accent: var(--brand-gold);
}

body{
  background:
    radial-gradient(circle at top left, rgba(185, 134, 44, 0.14), transparent 32rem),
    linear-gradient(180deg, var(--brand-ivory), #f7eddd 48%, var(--brand-cream));
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

.brand-gradient,
.gold-gradient{
  background: var(--brand-gradient) !important;
  color: var(--brand-navy) !important;
  box-shadow: 0 14px 32px rgba(125, 84, 22, 0.24);
}

.brand-accent{ color: var(--brand-gold) !important; }
.brand-gradient:hover,
.gold-gradient:hover{
  transform: translateY(-2px) scale(1.01);
  transition: all .25s ease;
  filter: saturate(1.06) brightness(1.02);
}

nav{
  background: rgba(255, 248, 236, 0.94) !important;
  color: var(--brand-navy);
  border-bottom: 1px solid rgba(185, 134, 44, 0.24) !important;
  box-shadow: 0 12px 36px rgba(6, 40, 79, 0.08);
}

nav .max-w-7xl{
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

.site-brand{
  display: inline-flex;
  align-items: center;
  min-width: 0;
  text-decoration: none;
}

.site-logo{
  height: clamp(46px, 5vw, 64px);
  width: auto;
  max-width: min(220px, 46vw);
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 6px 12px rgba(6, 40, 79, 0.12));
}

.footer-brand-logo{
  width: min(260px, 100%);
  height: auto;
  display: block;
  object-fit: contain;
  margin-bottom: 1.25rem;
}

nav h1,
nav > div > a:first-child{ color: var(--brand-navy) !important; }
nav a{ color: var(--brand-navy) !important; line-height: 1.2; }
nav .hidden a{ position: relative; font-weight: 700; }
nav .hidden a::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 3px;
  border-radius: 999px;
  background: var(--brand-gold);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.25s ease;
}
nav .hidden a:hover,
nav #mobile-menu a:hover{ color: var(--brand-gold-dark) !important; }
nav .hidden a:hover::after{ transform: scaleX(1); }
nav .brand-gradient,
nav .gold-gradient{ color: var(--brand-navy) !important; }

.glass{
  background: linear-gradient(180deg, var(--panel), rgba(243, 231, 211, 0.72)) !important;
  border: 1px solid rgba(185, 134, 44, 0.24) !important;
  box-shadow: 0 18px 46px rgba(6, 40, 79, 0.1);
}

.accent-bg-gold{ background: linear-gradient(180deg, rgba(185, 134, 44, 0.12), transparent); }

.text-yellow-400,
.hover\:text-yellow-400:hover{ color: var(--brand-gold) !important; }
.bg-yellow-400,
.hover\:bg-yellow-400:hover{ background-color: var(--brand-gold) !important; }
.bg-yellow-500{ background-color: var(--brand-gold) !important; }
.from-yellow-500{
  --tw-gradient-from: rgba(185, 134, 44, 0.34) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgba(185, 134, 44, 0) var(--tw-gradient-to-position) !important;
}
.to-yellow-500{ --tw-gradient-to: rgba(6, 40, 79, 0.18) var(--tw-gradient-to-position) !important; }
.accent-yellow-400{ accent-color: var(--brand-gold) !important; }

.bg-black,
.bg-\[\#f2f2f2\]{ background-color: var(--brand-ivory) !important; }
.text-white{ color: var(--brand-navy) !important; }
.text-black{ color: var(--brand-navy) !important; }
.text-gray-300,
.text-gray-400,
.text-gray-500{ color: var(--muted-ink) !important; }
.border-white\/10,
.border-white\/15,
.border-white\/20{ border-color: rgba(185, 134, 44, 0.24) !important; }
.bg-white\/5,
.bg-black\/30,
.bg-black\/70,
.bg-black\/80,
.bg-black\/90{ background-color: rgba(255, 248, 236, 0.72) !important; }
.placeholder\:text-gray-500::placeholder{ color: rgba(91, 100, 112, 0.72) !important; }

.hero-bg{
  padding-top: clamp(6.5rem, 11vw, 8.5rem);
}

.hero-bg,
.booking-bg,
[class*="bg-[url"]{ color: #fff; }
.hero-bg .text-white,
.booking-bg .text-white,
[class*="bg-[url"] .text-white{ color: #fff !important; }
.hero-bg .text-gray-300,
.hero-bg .text-gray-400,
.booking-bg .text-gray-300,
.booking-bg .text-gray-400,
[class*="bg-[url"] .text-gray-300,
[class*="bg-[url"] .text-gray-400{ color: rgba(255, 255, 255, 0.86) !important; }
.hero-bg .glass,
.booking-bg .glass,
[class*="bg-[url"] .glass{ background: rgba(6, 40, 79, 0.62) !important; border-color: rgba(244, 219, 156, 0.28) !important; }

footer{
  background:
    linear-gradient(180deg, rgba(255, 248, 236, 0.94), rgba(243, 231, 211, 0.98)) !important;
  border-top-color: rgba(185, 134, 44, 0.26) !important;
}

input,
textarea,
select{
  color: var(--brand-navy) !important;
}

.hero-slider{ position: relative; }
.hero-slider .hero-track{ position: relative; overflow: hidden; height: 500px; border-radius: 30px; }
.hero-slide{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s ease-in-out; }
.hero-slide.active{ opacity: 1; }
.slider-prev, .slider-next{ position: absolute; top: 50%; transform: translateY(-50%); background: rgba(6,40,79,0.74); color: #fff; border-radius: 9999px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: 1px solid rgba(244, 219, 156, 0.45); }
.slider-prev{ left: 10px; }
.slider-next{ right: 10px; }
.slider-dots{ position: absolute; left: 50%; transform: translateX(-50%); bottom: 12px; display: flex; gap: 8px; }
.slider-dot{ width: 10px; height: 10px; border-radius: 9999px; background: rgba(255,255,255,0.34); cursor: pointer; }
.slider-dot.active{ background: var(--brand-gold-600); }

@media (max-width: 767px){
  .site-logo{ height: 46px; width: auto; max-width: 58vw; }
  .hero-bg{ padding-top: 6rem; }
  .hero-slider .hero-track{ height: 320px; }
  .slider-prev, .slider-next{ width: 36px; height: 36px; }
}
