/* Base */
*{box-sizing:border-box}
body{margin:0;background:#f4f6f8;color:#111;font-family:'Inter',system-ui,Arial,sans-serif;}

/* Top contact bar */
.top-contact{background:#eee;text-align:center;padding:8px 10px;font-size:14px;color:#333}

/* Header + nav: desktop default */
header{background:#003366;color:#fff;padding:20px;display:flex;justify-content:space-between;align-items:center}
header h1{margin:0;color:#FFD700}

nav{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
nav a,.dropdown-toggle{display:inline-flex;align-items:center;line-height:1;padding:8px 12px;font-weight:600;color:#FFD700;text-decoration:none;transition:color .25s,background-color .25s;border-radius:4px}
nav a:hover,.dropdown-toggle:hover{color:#003366;background:#FFD700}

/* Dropdown */
.dropdown{position:relative}
.dropdown-content{position:absolute;top:100%;left:0;background:#003366;border-radius:6px;min-width:220px;padding:6px 0;display:none;box-shadow:0 10px 30px rgba(0,0,0,.15);z-index:20}
.dropdown-content a{display:block;color:#FFD700;padding:10px 14px}
.dropdown-content a:hover{color:#fff;background:rgba(255,255,255,.1)}
.dropdown .show{display:block}

/* Buttons */
.btn,.cta-button{background:#FFD700;color:#003366;font-weight:700;padding:12px 24px;text-decoration:none;border-radius:8px;display:inline-block}
.btn:hover{background:#e6c200}

/* Hero with image */



/* Cards for services */
.services-cards{max-width:1100px;margin:40px auto;padding:0 16px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.services-cards .card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.services-cards img{width:100%;height:190px;object-fit:cover;display:block}
.services-cards h3{margin:14px 16px 6px}
.services-cards p{margin:0 16px 10px;color:#444}
.services-cards .link{margin:0 16px 16px;display:inline-block;font-weight:600}

/* Gallery */
.gallery{max-width:1100px;margin:40px auto 20px;padding:0 16px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}

/* Footer */
footer{text-align:center;padding:20px;background:#003366;color:#fff}
footer p{margin:6px 0}
footer p:first-child{color:#FFD700}

/* Hybrid mobile layout */
@media (max-width:900px){.services-cards{grid-template-columns:1fr 1fr}.gallery{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.services-cards{grid-template-columns:1fr}.gallery{grid-template-columns:1fr}}
@media (max-width:768px){
  header{flex-direction:column;align-items:center;gap:10px}
  nav{justify-content:center;gap:16px}
  .dropdown-content{position:relative;top:auto;left:auto;min-width:100%;box-shadow:none}
}


/* Page container for inner pages */
.page, .page-content, .container-narrow {
  max-width: 1000px;
  margin: 30px auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  padding: 28px 24px;
}

/* --- HERO: vertically & horizontally centered --- */
.hero-section{
  background-color:#6f7780; /* neutral grey card; replace with image if desired */
  color:#fff;
  text-align:center;
  padding: 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 320px;       /* controls hero height */
  border-radius:14px;
  margin:24px auto 16px;
  max-width: 1100px;
}
.hero-content{max-width:620px}
.hero-content h2{font-size:2rem;margin:0 0 10px}
.hero-content p{font-size:1.1rem;margin:0 0 20px}
.hero-content .btn{background:#FFD700;color:#003366;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:700}
.hero-content .btn:hover{background:#e6c200}

/* tighten hero */
.hero-section{
  background:#6f7780;
  color:#fff;
  margin:24px auto 16px;
  border-radius:14px;
  max-width:1100px;
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.hero-inner{max-width:640px;text-align:center}
.hero-inner h2{margin:0 0 10px;font-size:2rem}
.hero-inner p{margin:0 0 20px;font-size:1.1rem}

/* === Universal Book-Now widget === */
.book-cta {
  max-width: 1100px;
  margin: 28px auto 20px;
  padding: 18px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  display: grid;
  gap: 12px;
}
.book-cta h3 { margin: 0; color: #003366; }
.book-rows { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.book-rows .row {
  display: flex; gap: 10px; align-items: center;
}
.book-rows select, .book-rows .cta-button {
  height: 42px;
  padding: 0 14px;
  border-radius: 8px;
  border: 1px solid #d9e2f1;
}
.book-rows select {
  background: #f7faff; color: #0a243b;
}
.book-rows .cta-button {
  display: inline-flex; align-items: center; justify-content: center;
  border: none;
}
.book-cta .help { margin: 0; color: #445; font-size: 14px; }
.book-cta .help a { color: #003366; text-decoration: underline; }
@media (max-width: 600px){
  .book-rows { flex-direction: column; align-items: stretch; }
  .book-rows .row, .book-rows .cta-button { width: 100%; }
}