:root {
  --cream: #fbf7ee;
  --paper: #fffdf8;
  --gold: #c79a3b;
  --gold-bright: #f0cf79;
  --gold-deep: #8f651f;
  --wine: #5b2430;
  --wine-dark: #35141d;
  --ink: #241b18;
  --muted: #766963;
  --line: rgba(143, 101, 31, .22);
  --shadow: 0 24px 70px rgba(66, 35, 12, .12);
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Inter", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 80% 5%, rgba(240,207,121,.20), transparent 25%),
    radial-gradient(circle at 10% 45%, rgba(199,154,59,.08), transparent 28%),
    var(--cream);
  font-family: var(--sans);
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.gold-dust {
  position: fixed; inset: 0; pointer-events: none; opacity: .28; z-index: 0;
  background-image:
    radial-gradient(circle, rgba(199,154,59,.45) 1px, transparent 1.5px),
    radial-gradient(circle, rgba(143,101,31,.22) 1px, transparent 1.5px);
  background-size: 44px 44px, 67px 67px;
  background-position: 0 0, 19px 24px;
  mask-image: linear-gradient(to bottom, #000, transparent 75%);
}

.topbar {
  height: 82px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 5vw; position: relative; z-index: 10;
  border-bottom: 1px solid var(--line);
  background: rgba(251,247,238,.72); backdrop-filter: blur(16px);
}
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark, .footer-mark {
  width: 40px; height: 40px; display:grid; place-items:center;
  border: 1px solid var(--gold); border-radius: 50%;
  font-family: var(--serif); font-size: 25px; color: var(--gold-deep);
}
.brand strong { display:block; font-size: 14px; letter-spacing: .22em; }
.brand small { display:block; margin-top:2px; font-size:8px; letter-spacing:.16em; color:var(--muted); }
.top-call {
  border-bottom: 1px solid var(--gold); padding-bottom: 4px;
  font-size: 12px; letter-spacing:.08em; text-transform:uppercase;
}
.top-call span { color: var(--gold-deep); }

.hero {
  min-height: 700px; padding: 72px 7vw 90px; display:grid;
  grid-template-columns: 1.03fr .97fr; gap: 6vw; align-items:center;
  position: relative; z-index:1;
}
.hero-glow {
  position:absolute; width:520px; height:520px; border-radius:50%;
  background: radial-gradient(circle, rgba(240,207,121,.30), transparent 68%);
  left:-160px; top:60px; pointer-events:none;
}
.hero-copy { max-width: 720px; }
.festival-pill {
  display:inline-flex; align-items:center; gap:10px; padding:8px 14px;
  border:1px solid rgba(199,154,59,.42); color:var(--gold-deep);
  background:rgba(255,253,248,.72); border-radius:999px; font-size:10px;
  letter-spacing:.18em; font-weight:700;
}
.eyebrow, .section-kicker {
  color: var(--gold-deep); letter-spacing:.24em; font-size:10px; font-weight:700;
}
.eyebrow { margin: 38px 0 10px; }
h1,h2,h3,p { margin-top:0; }
h1 {
  font-family:var(--serif); font-weight:600; font-size:clamp(55px, 6.4vw, 91px);
  line-height:.87; letter-spacing:-.035em; margin-bottom:25px;
}
h1 em, h2 em { color:var(--gold-deep); font-style:italic; }
.hero-text {
  max-width: 600px; font-size:15px; line-height:1.8; color:var(--muted);
}
.hero-text strong { color:var(--wine); }
.hero-actions { display:flex; gap:12px; margin:32px 0 24px; flex-wrap:wrap; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:13px;
  min-height:48px; padding:0 22px; border-radius:999px; font-size:11px;
  letter-spacing:.13em; text-transform:uppercase; font-weight:700;
  transition:.25s ease; cursor:pointer;
}
.btn-gold {
  color:#3d2810; background:linear-gradient(135deg,#f5d98b,#b9852d);
  box-shadow:0 12px 28px rgba(143,101,31,.22);
}
.btn-gold:hover { transform:translateY(-2px); box-shadow:0 16px 32px rgba(143,101,31,.30); }
.btn-ghost { border:1px solid var(--line); background:rgba(255,255,255,.55); }
.btn-ghost:hover { border-color:var(--gold); }
.trust-row { display:flex; gap:20px; flex-wrap:wrap; font-size:10px; color:var(--muted); }
.trust-row span::first-letter { color:var(--gold-deep); }

.hero-art { position:relative; max-width:560px; width:100%; justify-self:end; }
.art-frame {
  position:relative; aspect-ratio: 4/5; overflow:hidden;
  border:1px solid rgba(199,154,59,.6); padding:10px;
  background:linear-gradient(145deg,#fff7df,#7d5520);
  box-shadow: var(--shadow);
  clip-path: polygon(4% 0,96% 0,100% 4%,100% 96%,96% 100%,4% 100%,0 96%,0 4%);
}
.art-frame::before {
  content:""; position:absolute; inset:16px; z-index:2; border:1px solid rgba(255,236,177,.55);
  pointer-events:none;
}
.art-frame img { width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.96) contrast(1.03); }
.art-frame::after {
  content:""; position:absolute; inset:10px; background:
  linear-gradient(180deg, rgba(44,13,8,.05), rgba(44,13,8,.40));
  pointer-events:none;
}
.art-shine {
  position:absolute; inset:-40% -80%; z-index:3;
  background:linear-gradient(110deg,transparent 44%,rgba(255,245,190,.32) 50%,transparent 56%);
  transform:rotate(8deg); animation: shine 7s ease-in-out infinite;
}
@keyframes shine { 0%,55%{transform:translateX(-20%) rotate(8deg)} 75%,100%{transform:translateX(75%) rotate(8deg)} }
.art-caption {
  position:absolute; bottom:26px; left:0; right:0; z-index:4; text-align:center;
  color:#fff1bd; font-family:var(--serif); font-size:22px; text-shadow:0 2px 12px #24100a;
}
.floating-badge {
  position:absolute; right:-26px; bottom:40px; z-index:5; width:128px; height:128px;
  display:grid; place-items:center; text-align:center; border-radius:50%;
  background:var(--wine); color:#f7dda0; border:1px solid #e8c976;
  box-shadow:0 18px 45px rgba(53,20,29,.28); transform:rotate(7deg);
}
.floating-badge span { display:block; font-size:10px; letter-spacing:.22em; }
.floating-badge strong { font-family:var(--serif); font-size:20px; line-height:.85; }

.offer-section { position:relative; z-index:1; padding:110px 7vw; background:rgba(255,253,248,.68); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-heading { text-align:center; max-width:700px; margin:0 auto 46px; }
.section-heading h2, .booking-intro h2, .closing h2 {
  font-family:var(--serif); font-size:clamp(43px,5vw,72px); line-height:.9; font-weight:600;
  letter-spacing:-.03em; margin:10px 0 14px;
}
.section-heading p { color:var(--muted); font-size:14px; }

.offer-card {
  max-width:1100px; margin:auto; padding:38px; display:grid; grid-template-columns:auto 1fr auto;
  gap:30px; align-items:center; border:1px solid var(--line); background:var(--paper);
  box-shadow:var(--shadow); position:relative; overflow:hidden;
}
.offer-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:linear-gradient(#f4d47f,#a97624); }
.offer-symbol {
  width:64px; height:64px; border:1px solid var(--gold); border-radius:50%;
  display:grid; place-items:center; color:var(--gold-deep); font-size:24px;
}
.offer-label { font-size:9px; letter-spacing:.22em; font-weight:700; color:var(--gold-deep); }
.offer-main h3 { font-family:var(--serif); font-size:39px; line-height:.94; margin:8px 0 12px; }
.offer-main h3 span { color:var(--wine); }
.offer-main p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; max-width:610px; }
.pay-range { text-align:right; min-width:180px; }
.pay-range small { display:block; color:var(--muted); font-size:9px; letter-spacing:.18em; }
.pay-range strong { display:block; font-family:var(--serif); color:var(--wine); font-size:30px; margin:4px 0; }
.pay-range span { font-size:9px; color:var(--muted); }
.mini-grid { max-width:1100px; margin:24px auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.mini-card { border-top:1px solid var(--line); padding:24px 5px; }
.mini-no { color:var(--gold-deep); font-size:9px; letter-spacing:.2em; }
.mini-card h3 { font-family:var(--serif); font-size:25px; margin:9px 0 5px; }
.mini-card p { color:var(--muted); font-size:12px; line-height:1.6; margin:0; }

.booking-section {
  position:relative; z-index:1; padding:120px 7vw; display:grid; grid-template-columns:.82fr 1.18fr;
  gap:8vw; max-width:1300px; margin:auto;
}
.booking-intro { padding-top:20px; }
.booking-intro h2 { margin-top:10px; }
.booking-intro > p { color:var(--muted); font-size:14px; line-height:1.7; max-width:420px; }
.contact-note {
  display:flex; gap:14px; padding:18px; margin-top:36px; max-width:440px;
  background:#fffaf0; border:1px solid var(--line);
}
.note-icon { color:var(--gold-deep); font-size:19px; }
.contact-note strong { font-size:12px; }
.contact-note p { color:var(--muted); font-size:11px; line-height:1.5; margin:4px 0 0; }

.booking-form {
  background:var(--paper); border:1px solid var(--line); padding:32px; box-shadow:var(--shadow);
}
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.booking-form label { display:block; margin-bottom:17px; }
.booking-form label > span { display:block; margin-bottom:7px; color:#554a44; font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; }
.booking-form b { color:#a33b45; }
.booking-form input, .booking-form select, .booking-form textarea {
  width:100%; border:1px solid #dfd3c4; background:#fffdfa; outline:none; color:var(--ink);
  border-radius:8px; padding:13px 14px; font-size:13px; transition:.2s;
}
.booking-form textarea { resize:vertical; min-height:105px; }
.booking-form input:focus, .booking-form select:focus, .booking-form textarea:focus {
  border-color:var(--gold); box-shadow:0 0 0 3px rgba(199,154,59,.10);
}
.hidden-field { display:none !important; }
.submit-btn {
  width:100%; border:0; border-radius:8px; padding:15px 18px; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center;
  background:var(--wine); color:#fff8eb; transition:.25s;
}
.submit-btn:hover { transform:translateY(-1px); background:#471a25; }
.submit-btn span { font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.submit-btn strong { font-size:11px; color:#f1d384; }
.form-footnote { font-size:9px; color:#91847b; text-align:center; margin:14px 0 0; }

.closing {
  background: linear-gradient(135deg, #08162e, #152d50 50%, #08162e);
  color: #fff5dc;
  padding: 110px 7vw;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.closing::before {
  content:""; position:absolute; width:500px; height:500px; border-radius:50%; left:50%; top:50%;
  transform:translate(-50%,-50%); border:1px solid rgba(240,207,121,.22);
  box-shadow:0 0 0 35px rgba(240,207,121,.04), 0 0 0 70px rgba(240,207,121,.03);
}
.closing-inner { position:relative; z-index:1; }
.lotus { color:#f1d384; font-size:22px; }
.closing h2 { margin:20px 0 15px; }
.closing h2 em { color:#f1d384; }
.closing p { color:#dfc9bc; font-size:12px; }

.footer {
  position:relative; z-index:2; background:#261117; color:#d7c5bd;
  padding:28px 7vw; display:flex; align-items:center; gap:30px; flex-wrap:wrap;
}
.footer-brand { display:flex; align-items:center; gap:10px; margin-right:auto; }
.footer-brand strong { display:block; color:#f4d98b; letter-spacing:.2em; font-size:13px; }
.footer-brand span:not(.footer-mark) { display:block; font-size:8px; letter-spacing:.15em; margin-top:3px; color:#9c8179; }
.footer-details { display:flex; gap:18px; flex-wrap:wrap; align-items:center; justify-content:center; font-size:9px; }
.footer-details a:hover { color:#f4d98b; }
.footer-copy { width:100%; text-align:center; font-size:8px; color:#765e59; padding-top:15px; border-top:1px solid rgba(255,255,255,.07); }

.offer-modal { position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center; padding:20px; }
.offer-modal.show { display:flex; }
.modal-backdrop { position:absolute; inset:0; background:rgba(28,12,16,.68); backdrop-filter:blur(9px); }
.modal-card {
  position:relative; z-index:1; max-width:840px; width:100%; background:var(--paper);
  display:grid; grid-template-columns:.82fr 1.18fr; overflow:hidden;
  border:1px solid rgba(240,207,121,.8); box-shadow:0 30px 100px rgba(0,0,0,.35);
  animation:modalIn .35s ease both;
}
@keyframes modalIn { from{opacity:0;transform:translateY(20px) scale(.98)} to{opacity:1;transform:none} }
.modal-close {
  position:absolute; right:13px; top:10px; z-index:5; width:36px; height:36px; border-radius:50%;
  border:1px solid rgba(255,255,255,.45); background:rgba(0,0,0,.25); color:white; cursor:pointer; font-size:24px;
}
.modal-art { min-height:470px; background:#3b171e; }
.modal-art img { width:100%; height:100%; object-fit:cover; display:block; }
.modal-content { padding:60px 48px; display:flex; flex-direction:column; justify-content:center; }
.modal-kicker { color:var(--gold-deep); font-size:9px; letter-spacing:.2em; font-weight:700; }
.modal-content h2 { font-family:var(--serif); font-size:65px; line-height:.85; margin:15px 0 20px; }
.modal-content h2 em { color:var(--wine); }
.modal-content p { color:var(--muted); font-size:14px; line-height:1.7; }
.modal-content p strong { color:var(--wine); }
.modal-content .btn { align-self:flex-start; margin-top:10px; }

@media (max-width: 900px) {
  .hero { grid-template-columns:1fr; padding-top:50px; }
  .hero-art { justify-self:center; max-width:520px; }
  .booking-section { grid-template-columns:1fr; gap:45px; padding-top:80px; }
  .offer-card { grid-template-columns:auto 1fr; }
  .pay-range { grid-column:2; text-align:left; }
  .modal-card { grid-template-columns:1fr; max-width:500px; }
  .modal-art { min-height:260px; max-height:300px; }
  .modal-content { padding:34px; }
  .modal-content h2 { font-size:55px; }
}
@media (max-width: 620px) {
  .topbar { padding:0 5%; height:70px; }
  .top-call { font-size:9px; }
  .hero, .offer-section, .booking-section { padding-left:5%; padding-right:5%; }
  h1 { font-size:55px; }
  .hero-text { font-size:13px; }
  .trust-row { gap:10px; flex-direction:column; }
  .floating-badge { width:100px; height:100px; right:-8px; bottom:20px; }
  .floating-badge strong { font-size:16px; }
  .offer-section { padding-top:80px; padding-bottom:80px; }
  .offer-card { padding:28px 22px; grid-template-columns:1fr; gap:16px; }
  .pay-range { grid-column:auto; }
  .mini-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; gap:0; }
  .booking-form { padding:22px; }
  .footer { padding-left:5%; padding-right:5%; }
  .footer-details { justify-content:flex-start; }
  .modal-content h2 { font-size:49px; }
}
/* Navy blue footer */
.footer {
  background: #08162e;
}

/* Navy blue booking button */
.submit-btn {
  background: #152d50;
}

.submit-btn:hover {
  background: #08162e;
}
