:root {
  --paper: #f1ede6;
  --ink: #282521;
  --muted: #6e6861;
  --line: #d1c9bd;
  --dark: #282521;
  --max: 1120px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.7;
}
h1, h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  line-height: 1.08;
}
h1 { font-size: clamp(2.7rem, 6vw, 4.8rem); }
h2 { font-size: clamp(2rem, 4vw, 3rem); }
p { color: var(--muted); }
a { color: inherit; }

.site-header {
  position: absolute;
  inset: 28px 0 auto;
  z-index: 30;
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: transparent;
  pointer-events: none;
}
.brand {
  display: block;
  padding: 14px 18px;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(241,237,230,.9);
  box-shadow: 0 12px 32px rgba(0,0,0,.16);
  backdrop-filter: blur(8px);
  pointer-events: auto;
}
.brand img {
  display: block;
  width: clamp(210px, 20vw, 320px);
  height: auto;
}

.hero {
  position: relative;
  height: min(720px, 75vh);
  min-height: 560px;
  overflow: hidden;
  background: #37332f;
}
.hero-slide, .hero-slide img, .hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero-slide img { object-fit: cover; }
.hero-shade {
  background: linear-gradient(90deg, rgba(28,25,22,.72), rgba(28,25,22,.3)), rgba(81,74,66,.18);
}
.hero-copy {
  position: absolute;
  left: max(7vw, 40px);
  bottom: 10%;
  color: #fff;
}
.hero-copy span, .eyebrow {
  text-transform: uppercase;
  letter-spacing: .2em;
  font-size: .78rem;
}
.hero-copy h1 { margin-top: 20px; font-size: clamp(3rem, 7vw, 6rem); }
.section-shell { width: min(var(--max), calc(100% - 48px)); margin: auto; }
.intro { padding: 100px 0; }
.intro h2 { margin: 25px 0; }
.rule { height: 1px; margin: 30px 0; background: var(--line); }
.intro > p { max-width: 850px; font-size: 1.05rem; }
.article-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 22px;
  padding-bottom: 4px;
  border-bottom: 1px solid currentColor;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .78rem;
}
.article-link span { transition: transform .2s ease; }
.article-link:hover span,
.article-link:focus-visible span { transform: translateX(4px); }
.booking-callout { padding: 0 24px 90px; }
.booking-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  padding: 38px 44px;
  border: 1px solid rgba(40,37,33,.2);
  background: var(--dark);
  color: var(--paper);
}
.booking-card .eyebrow { margin: 0 0 10px; color: #ead685; }
.booking-card h2 { margin: 0; color: var(--paper); font-size: clamp(2rem, 4vw, 2.8rem); }
.booking-card-copy > p:last-child { margin: 9px 0 0; color: #c6c0b8; }
.booking-call-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 54px;
  padding: 0 22px;
  background: #ead685;
  color: var(--ink);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background .2s ease, transform .2s ease;
}
.booking-call-button:hover { background: #f2e3a8; transform: translateY(-2px); }
.phone-icon { width: 18px; height: 18px; flex: 0 0 auto; }
.booking-call-button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.testimonials { padding: 90px 0 110px; border-top: 1px solid var(--line); }
.centered { text-align: center; }
.rating-summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin: 30px auto 0;
}
.rating-number {
  font: 400 clamp(2.8rem, 6vw, 4.2rem)/1 Georgia, "Times New Roman", serif;
}
.rating-stars {
  color: #c99a2e;
  letter-spacing: .12em;
  font-size: 1.25rem;
  line-height: 1;
}
.rating-summary p { margin: 7px 0 0; font-size: .9rem; }
.google-wordmark { color: #4285f4; font-weight: 700; }
.testimonial-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 55px;
}
.testimonial-grid article {
  padding: 30px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.22);
}
.review-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.stars { color: #c99a2e; letter-spacing: .12em; font-size: .9rem; }
.stars span { color: #c9c2b8; }
.review-age { color: #918b83; font-size: .78rem; white-space: nowrap; }
.testimonial-grid strong {
  display: block;
  margin-top: 25px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.testimonial-grid small {
  display: block;
  margin-top: 3px;
  color: #918b83;
  font-size: .76rem;
}

.vacation-notice {
  padding: 16px 24px;
  background: #e3ca72;
  color: var(--ink);
  text-align: center;
}
.vacation-notice strong { font-family: Georgia, serif; }
.vacation-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(28,25,22,.6);
  backdrop-filter: blur(3px);
  animation: overlay-in .25s ease;
}
.vacation-modal {
  position: relative;
  width: min(540px, 100%);
  padding: 58px 48px 46px;
  border: 1px solid rgba(40,37,33,.22);
  background: #ead685;
  box-shadow: 0 24px 70px rgba(0,0,0,.28);
  color: var(--ink);
  text-align: center;
  animation: modal-in .35s ease;
}
.vacation-modal::before {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  margin: 0 auto 26px;
  background: var(--ink);
}
.vacation-modal .eyebrow { display: block; margin-bottom: 18px; color: #5e552f; }
.vacation-modal h2 { font-size: clamp(2rem, 7vw, 3.2rem); }
.vacation-modal p { margin: 20px auto 30px; color: #4b452f; font-size: 1.05rem; }
.vacation-close {
  position: absolute;
  top: 12px;
  right: 15px;
  width: 42px;
  height: 42px;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 1.8rem;
  cursor: pointer;
}
.vacation-button {
  padding: 13px 25px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .75rem;
  cursor: pointer;
}
.vacation-button:hover, .vacation-button:focus-visible { background: #474238; }
.vacation-overlay.closing { opacity: 0; transition: opacity .2s ease; }
body.modal-open { overflow: hidden; }
@keyframes overlay-in { from { opacity: 0; } }
@keyframes modal-in { from { opacity: 0; transform: translateY(18px) scale(.98); } }

.site-footer { padding: 65px max(30px, 5vw) 0; background: var(--dark); color: #ddd; }
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: 50px;
  max-width: 1250px;
  margin: auto;
  padding-bottom: 55px;
}
.footer-logo img {
  display: block;
  width: 230px;
  height: auto;
  padding: 12px 15px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(241,237,230,.94);
}
.footer-logo p { max-width: 230px; }
.site-footer h3 {
  color: #8f8982;
  text-transform: uppercase;
  letter-spacing: .18em;
  font: 400 .8rem Arial, sans-serif;
}
.site-footer p, .site-footer a {
  margin: 5px 0;
  color: #c6c0b8;
  text-decoration: none;
}
.site-footer a.footer-address { text-decoration: underline; text-decoration-color: #8f8982; text-underline-offset: 4px; }
.site-footer a.footer-address:hover, .site-footer a.footer-address:focus-visible { color: #fff; }
.site-footer a[href^="tel:"] {
  text-decoration: underline;
  text-decoration-color: #8f8982;
  text-underline-offset: 4px;
}
.site-footer a[href^="tel:"]:hover,
.site-footer a[href^="tel:"]:focus-visible { color: #fff; }
.opening-hours { display: grid; gap: 5px; margin: 0; }
.opening-hours div { display: grid; grid-template-columns: 1fr max-content; gap: 18px; }
.opening-hours dt, .opening-hours dd { margin: 0; color: #c6c0b8; font-size: .95rem; }
.copyright {
  padding: 22px;
  border-top: 1px solid #48443f;
  color: #817b74;
  text-align: center;
  letter-spacing: .08em;
  font-size: .8rem;
}

@media (max-width: 760px) {
  .site-header { inset: 18px 0 auto; min-height: 165px; padding: 12px; }
  .brand img { width: 190px; }
  .hero { height: 68vh; min-height: 500px; }
  .hero-copy { left: 24px; right: 24px; bottom: 14%; }
  .section-shell { width: min(100% - 36px, var(--max)); }
  .intro { padding: 70px 0; }
  .testimonial-grid { grid-template-columns: 1fr; }
  .booking-callout { padding: 0 18px 70px; }
  .booking-card { align-items: flex-start; flex-direction: column; gap: 24px; padding: 30px 24px; }
  .booking-call-button { width: 100%; }
  .vacation-modal { padding: 50px 24px 36px; }
  .footer-grid { grid-template-columns: 1fr; gap: 24px; }
  .footer-logo img { width: 205px; }
  .site-footer { padding-top: 45px; }
}
