/* ── Reset & Base ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html {
  font-size: 16.25px;   /* base — all rem values derive from this */
  scroll-behavior: smooth;
}
body {
  font-family: 'Helvetica Neue', Arial, sans-serif;
  font-size: 1rem;
  color: #333;
  background: #fff;
}
a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }

/* ── Colour Tokens ────────────────────────────────────── */
:root {
  --blue-dark: #043e6b;
  --blue-mid:  #025291;
  --red:       #e84a36;
  --red-hover: #c93620;
  --grey-bg:   #f9f9f9;
  --text-card: #555;
}

/* ── Top Contact Bar ──────────────────────────────────── */
.top-bar {
  background: #fff;
  padding: 10px 40px;
  display: flex;
  align-items: center;
  gap: 30px;
  border-bottom: 1px solid #eee;
}
/* Logo lives in the top bar; margin-right: auto pushes phones to the right */
.top-bar .logo-area { flex-shrink: 0; margin-right: auto; }
.top-bar .logo-area img { height: 65px; width: auto; }

.top-bar .location {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.862rem;   /* 14px — below min, but this is not a p/a element */
  color: #043e6b;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.top-bar .location span.phone {
  font-size: 1.108rem;   /* 18px */
  font-weight: 700;
  color: #025291;
}

/* ── Navigation ───────────────────────────────────────── */
.navbar {
  background: var(--blue-mid);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 40px;
  position: sticky;
  top: 0;
  z-index: 1000;
}

.nav-links {
  display: flex;
  align-items: stretch;
  list-style: none;
  height: 60px;
}
/* <a> inside nav — minimum 1rem */
.nav-links li a {
  display: flex;
  align-items: center;
  padding: 0 16px;
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.3px;
  height: 100%;
  transition: background 0.2s;
  white-space: nowrap;
}
.nav-links li a:hover,
.nav-links li a.active { background: var(--blue-dark); }

.btn-book {
  background: var(--red) !important;
  color: #fff !important;
  padding: 0 22px !important;
  font-weight: 700 !important;
  letter-spacing: 1px;
  font-size: 1rem !important;
  transition: background 0.2s !important;
}
.btn-book:hover { background: var(--red-hover) !important; }

.nav-toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
}
.nav-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background: #fff;
  margin: 5px 0;
  transition: 0.3s;
}

/* ── Footer ───────────────────────────────────────────── */
footer {
  background: var(--red);
  padding: 55px 60px;
  color: #fff;
}
.footer-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}
.footer-nav h3,
.footer-contact h3 {
  font-size: 0.8rem;     /* h3, not a p/a element */
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 18px;
  opacity: 0.85;
}
.footer-nav ul { list-style: none; }
.footer-nav ul li { margin-bottom: 10px; }
/* <a> — minimum 1rem */
.footer-nav ul li a { color: #fff; font-size: 1rem; opacity: 0.9; transition: opacity 0.2s; }
.footer-nav ul li a:hover { opacity: 1; text-decoration: underline; }
/* <p> — minimum 1rem */
.footer-contact p { font-size: 1rem; line-height: 1.7; opacity: 0.9; margin-bottom: 6px; }
.footer-contact a { color: #fff; }
.footer-contact .location-block { margin-bottom: 18px; }

.copyright {
  background: #fff;
  padding: 14px 40px;
}
/* <p> — minimum 1rem */
.copyright p { font-size: 1rem; color: var(--blue-mid); }

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 900px) {
  .footer-inner { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .navbar { padding: 0 20px; justify-content: flex-end; }
  .nav-toggle { display: block; }
  .nav-links {
    display: none;
    flex-direction: column;
    position: absolute;
    top: 60px;
    left: 0; right: 0;
    background: var(--blue-mid);
    height: auto;
    z-index: 999;
  }
  .nav-links.open { display: flex; }
  .nav-links li a { padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,0.1); }
  .top-bar { padding: 8px 20px; gap: 12px; flex-wrap: wrap; }
  .top-bar .logo-area img { height: 50px; }
  footer { padding: 40px 24px; }
}
