/* Cayman Exquisite Excursions – styles.css
   Palette: Tropical Green (#0c9), Deep Green (#087f6d), Orange (#f7951e), Sand (#fff7ec)
   Typography: system-ui stack for performance.
*/
:root{
  --green:#0c9;
  --green-deep:#087f6d;
  --orange:#f7951e;
  --ink:#0e1b1b;
  --sand:#fff7ec;
  --bg:#ffffff;
  --muted:#f3f5f4;
  --radius:16px;
}
*{box-sizing:border-box}
html{color-scheme:light}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
}
.container{max-width:1100px; margin:0 auto; padding:0 1rem}
/* Header / Nav */
header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid #e8eceb}
.nav{display:flex; align-items:center; justify-content:space-between; padding:.75rem 0}
.logo{display:flex; align-items:center; gap:.5rem; text-decoration:none; color:inherit}
.logo img{width:36px; height:36px; border-radius:8px}
.brand{font-weight:800; letter-spacing:.2px}
nav ul{list-style:none; display:flex; gap:.75rem; margin:0; padding:0}
nav a{display:inline-block; padding:.5rem .75rem; text-decoration:none; color:#154; border-radius:10px}
nav a:hover, nav a[aria-current="page"]{background:var(--muted)}
.menu-btn{display:none; border:0; background:transparent; font-size:1.25rem; padding:.5rem .5rem; border-radius:10px}
/* Hero */
.hero{background:linear-gradient(135deg, #e6fffa, #ffffff); border-bottom:1px solid #e8eceb}
.hero .wrap{display:grid; grid-template-columns:1fr; gap:1rem; padding:3rem 0}
.hero h1{font-size:clamp(1.8rem, 3.2vw + 1rem, 3rem); line-height:1.15; margin:0}
.hero p{font-size:1.1rem; margin:.5rem 0 1.25rem}
.badges{display:flex; flex-wrap:wrap; gap:.5rem}
.badge{background:var(--sand); border:1px solid #fde7c8; padding:.4rem .6rem; border-radius:999px; font-weight:600}
.cta{display:flex; gap:.75rem; flex-wrap:wrap}
.button{appearance:none; border:0; padding:.8rem 1rem; border-radius:12px; font-weight:700; cursor:pointer; text-decoration:none; display:inline-block}
.button.primary{background:var(--green-deep); color:#fff}
.button.secondary{background:#e8f8f5; color:var(--green-deep)}
.button.primary:hover{filter:brightness(.95)}
/* Sections */
.section{padding:2.5rem 0}
.section h2{font-size:1.6rem; margin:0 0 .75rem}
.grid{display:grid; gap:1rem}
.grid.cards{grid-template-columns:repeat(auto-fill, minmax(240px,1fr))}
.card{background:#fff; border:1px solid #e8eceb; border-radius:var(--radius); padding:1rem}
.card h3{margin:.2rem 0 .4rem; font-size:1.1rem}
.kicker{color:var(--green-deep); font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.8rem}
.muted{color:#4a6; font-size:.95rem}
.faq details{background:#fff; border:1px solid #e8eceb; border-radius:12px; padding:.75rem 1rem}
.faq details+details{margin-top:.5rem}
.faq summary{cursor:pointer; font-weight:700}
/* Footer */
footer{border-top:1px solid #e8eceb; background:#fafdfc}
footer .cols{display:grid; grid-template-columns:1fr; gap:1rem; padding:1.5rem 0}
.footer-brand{display:flex; align-items:center; gap:.5rem}
.small{font-size:.9rem; color:#476}
/* Gallery */
.gallery{grid-template-columns:repeat(auto-fill, minmax(220px,1fr))}
.tile{border:1px solid #e8eceb; border-radius:14px; overflow:hidden; background:linear-gradient(180deg,#fff,#f8fffd)}
.tile .title{padding:.75rem 1rem; font-weight:700}
.tile .desc{padding:0 1rem 1rem; color:#476}
.tile .image{aspect-ratio:4/3; display:block; width:100%; background:var(--muted)}
/* Contact */
.contact-block{display:grid; gap:1rem}
.contact-item{display:flex; gap:.75rem; align-items:center; padding:.75rem 1rem; border:1px solid #e8eceb; background:#fff; border-radius:12px}
.contact-item b{font-size:1.05rem}
/* Responsive */
@media (min-width: 820px){
  .hero .wrap{grid-template-columns:1.1fr .9fr; align-items:center}
  .hero .art{justify-self:end}
  footer .cols{grid-template-columns:2fr 1fr}
}
@media (max-width: 720px){
  nav ul{display:none}
  .menu-btn{display:block}
  nav.open ul{display:flex; flex-direction:column; background:#fff; position:absolute; left:0; right:0; top:56px; padding:1rem; border-bottom:1px solid #e8eceb}
}