
/* ========== Base, Colors, Typography ========== */
:root{
  --bg:#0B1216;
  --surface:#0E1B22;
  --card:#13232C;
  --text:#EAF2F6;
  --muted:#9FB3BF;
  --primary:#1BE3C7;
  --primary-10:#102926;
  --accent:#32A6FF;
  --success:#21C88C;
  --danger:#FF6A55;
  --shadow:0 10px 30px rgba(0,0,0,.25);
}
*,
*::before,
*::after{{box-sizing:border-box;}}

/* Mandatory rule: prevent text caret on UI elements */
*:not(input):not(textarea):not(select):not([contenteditable="true"]){{
  cursor: default;
  user-select: none;
}}
input, textarea, select, [contenteditable="true"]{{
  cursor: text;
  user-select: text;
}}

html, body{height:100%;}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji';
  background: linear-gradient(180deg, var(--bg), #0E161B 40%, #0B1216 100%);
  color:var(--text);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:var(--primary); text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%; height:auto; display:block;}

.container{width:min(1160px, 92%); margin-inline:auto;}
.center{text-align:center;}

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;padding:.5rem 1rem;background:#000;color:#fff;z-index:9999;}

/* Header */
.site-header{
  position:sticky; top:0; z-index:1000; backdrop-filter: blur(10px);
  background: rgba(14,27,34,.65); border-bottom:1px solid rgba(255,255,255,.06);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem 0;}
.brand{display:flex; align-items:center; gap:.6rem; font-weight:800; letter-spacing:.2px; color:#fff;}
.nav-toggle{display:none;}
.menu{display:flex; gap:1rem; list-style:none; margin:0; padding:0;}
.menu a{display:block; padding:.5rem .6rem; border-radius:.6rem;}
.menu a:hover{background:rgba(255,255,255,.06); text-decoration:none;}
.header-cta{display:flex; gap:.5rem; align-items:center;}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.75rem 1rem; border-radius:.75rem; background:var(--primary); color:#071417; 
  border:1px solid rgba(0,0,0,.15); box-shadow: var(--shadow); font-weight:700;}
.btn:hover{text-decoration:none; filter:brightness(.96);}
.btn-outline{background:transparent; color:var(--text); border:1px solid rgba(255,255,255,.25); box-shadow:none;}
.btn-lg{padding:1rem 1.15rem; font-size:1.05rem;}
.btn-sm{padding:.5rem .75rem; font-size:.95rem;}

/* Hero */
.hero{padding: clamp(2rem, 4vw, 4rem) 0; background: radial-gradient(1200px 600px at 75% -10%, var(--primary-10), transparent 60%);}
.hero-inner{display:grid; grid-template-columns: 1.2fr 1fr; gap:2rem; align-items:center;}
.lead{color:var(--text); opacity:.95; font-size:1.1rem;}
.usp{margin:.75rem 0 0 0; padding-left:1.25rem;}
.usp li{margin:.25rem 0;}

/* Sections */
section{padding: clamp(2rem, 4vw, 4rem) 0; border-top:1px solid rgba(255,255,255,.06);}
h1,h2,h3{line-height:1.2; margin:.2em 0 .4em;}
h1{font-size: clamp(1.8rem, 3vw, 2.6rem);}
h2{font-size: clamp(1.5rem, 2.4vw, 2rem);}
h3{font-size: clamp(1.2rem, 1.8vw, 1.35rem);}
.muted{color:var(--muted);}

/* Cards & grids */
.card{background:var(--card); border:1px solid rgba(255,255,255,.06); border-radius:1rem; padding:1rem; box-shadow:var(--shadow);}
.grid-2{display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:1rem;}
.grid-3{display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:1rem;}
.list-check{padding-left:1.25rem;}
.list-check li{margin:.3rem 0;}

/* Pricing */
.pricing-cards{display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; align-items:stretch;}
.price-card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:1.1rem; padding:1rem; position:relative;}
.price-card .price{font-size:1.4rem; font-weight:800; color:#fff;}
.price-card .badge{position:absolute; top:.8rem; right:.8rem; background:var(--accent); color:#00121A; padding:.25rem .5rem; border-radius:.5rem; font-weight:700; font-size:.8rem;}
.price-card.featured{outline:2px solid var(--primary);}
.price-table summary{cursor:pointer; margin:.5rem 0 1rem;}
.price-table table{width:100%; border-collapse:collapse; font-size:.95rem;}
.price-table th, .price-table td{border-bottom:1px dashed rgba(255,255,255,.12); padding:.6rem .4rem; text-align:left;}

/* Calc */
.calc-form{display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap:.6rem; align-items:end;}
.calc-form label{display:flex; flex-direction:column; gap:.25rem;}
.calc-form select, .calc-form input, .form input, .form textarea, .form select{padding:.6rem .7rem; border-radius:.6rem; border:1px solid rgba(255,255,255,.15); background:#0E171C; color:var(--text);}
.calc-form output{font-weight:800; background:#0E171C; padding:.6rem .7rem; border-radius:.6rem;}

/* Booking / Forms */
.form{display:grid; gap:.75rem;}
.form .grid-2{grid-template-columns: repeat(2, 1fr); gap:.75rem;}
.form-actions{display:flex; gap:.6rem; align-items:center;}

/* Map / Zones */
.list-zones{padding-left:1.25rem;}
.map img{border-radius:1rem; border:1px solid rgba(255,255,255,.08); box-shadow:var(--shadow);}

/* Reviews */
.reviews-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem;}
.review{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:1rem; padding:1rem;}
.review blockquote{margin:0; font-style:italic;}

/* FAQ */
details{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:.8rem; padding:.5rem .8rem; margin:.5rem 0;}
summary{font-weight:700;}

/* Footer */
.site-footer{border-top:1px solid rgba(255,255,255,.08); padding:1rem 0;}

/* Sticky bottom CTA (mobile-first) */
.sticky-cta{
  position:sticky; bottom:0; display:none; gap:.5rem; justify-content:center;
  padding:.5rem; background:rgba(14,27,34,.85); backdrop-filter: blur(10px); border-top:1px solid rgba(255,255,255,.08);
}

/* Responsive */
@media (max-width: 960px){
  .hero-inner{grid-template-columns: 1fr;}
  .grid-3{grid-template-columns: 1fr;}
  .grid-2{grid-template-columns: 1fr;}
  .pricing-cards{grid-template-columns: 1fr; }
  .calc-form{grid-template-columns: 1fr;}
  .menu{display:none; position:absolute; right:1rem; top:64px; flex-direction:column; background:var(--surface); padding:.5rem; border:1px solid rgba(255,255,255,.12); border-radius:.6rem;}
  .nav-toggle{display:inline-flex; padding:.5rem .75rem; border-radius:.6rem; border:1px solid rgba(255,255,255,.2); background:transparent; color:var(--text);}
  .sticky-cta{display:flex;}
}
