/* ============== Base / Reset ============== */
* { box-sizing: border-box; }
:root{
  --ink:#121212;
  --muted:#61646b;
  --line:#e9e9ee;
  --bg:#ffffff;
  --brand:#ffb700;
  --brand-strong:#ff9800;
  --card:#ffffff;
  --shadow: 0 8px 24px rgba(0,0,0,.08);
}

html { font-size: 16px; }
@media (max-width: 480px){ html{ font-size: 15px; } }
body{
  margin:0; color:var(--ink); background:var(--bg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering: optimizeLegibility;
}

:focus-visible{ outline: 3px solid var(--brand); outline-offset: 2px; }
.container{ width:min(1100px,92%); margin:0 auto; }

/* ============== Header / Nav ============== */
.site-header{
  position: sticky; top:0; z-index: 50;
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
  transition: padding .2s ease, background .2s ease, box-shadow .2s ease;
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding:.7rem 0; }
.brand{ display:flex; align-items:center; gap:.6rem; color:inherit; text-decoration:none; }
.logo{ width:64px; height:64px; border-radius:14px; object-fit:cover; }
.brand span{ font-size: clamp(1.1rem, 1rem + 1vw, 1.75rem); font-weight: 800; letter-spacing:.2px; }

.menu{ display:flex; gap:1.2rem; list-style:none; margin:0; padding:0; }
.menu a{ color:inherit; text-decoration:none; font-weight:600; }
.menu a:hover{ color:var(--brand-strong); }

.btn{ display:inline-block; border-radius:12px; padding:.7rem 1rem;
  text-decoration:none; font-weight:700; border:1px solid #111; background:#f7f7f8; color:#111;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn.small{ padding:.55rem .8rem; }
.btn.primary{ background:var(--brand); border-color:transparent; color:#111;
  box-shadow: 0 4px 16px rgba(255,183,0,.35); }
.btn.primary:hover{ background:var(--brand-strong); transform: translateY(-1px); }

#menuBtn{ display:none; border:1px solid var(--line); background:#fff; padding:.45rem .7rem; border-radius:10px; }

@media (max-width: 800px){
  #menuBtn{ display:inline-block; }
  .menu{
    display:none; position:absolute; right:4%; top:64px; padding:.8rem 1rem;
    background:#fff; border:1px solid var(--line); border-radius:14px; flex-direction:column; gap:.8rem;
    box-shadow: var(--shadow);
  }
  .menu.open{ display:flex; }
}

/* ============== Sections / Typography ============== */
.section{ padding: clamp(1.2rem, 3vw, 2.2rem) 0; }
.section h2{ font-size: clamp(1.4rem, .8rem + 2.2vw, 2.1rem); margin:.2rem 0 1rem; font-weight: 900; letter-spacing:.2px; }
p{ color:var(--muted); }

/* ============== Grid ============== */
.grid3{ display:grid; gap:1rem; grid-template-columns: repeat(3, 1fr); }
.grid2{ display:grid; gap:1rem; grid-template-columns: 1fr 1fr; }
@media (max-width: 900px){ .grid3{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px){ .grid3, .grid2{ grid-template-columns: 1fr; } }

/* ============== Cards ============== */
.card{
  background:var(--card);
  border: 1px solid rgba(0,0,0,.04);
  border-radius: 18px;
  padding: clamp(1rem, .8rem + 1vw, 1.4rem);
  box-shadow: var(--shadow);
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover{ transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.12); }
.card h3{ margin:.2rem 0 .5rem; color:#111; }
.card ul{ margin:.2rem 0 0; padding-left: 1.1rem; }
.card li{ margin:.25rem 0; color:#34363c; }

/* ============== Providers ============== */
.providers .provider{ display:grid; grid-template-columns: 72px 1fr; gap:1rem; align-items:center; }
.avatar{ width:72px; height:72px; border-radius:50%; background: linear-gradient(135deg,#fff,#efefef); box-shadow: 0 6px 18px rgba(0,0,0,.08); }

/* ============== Forms ============== */
.form{ display:grid; gap: clamp(.7rem, .5rem + .8vw, 1rem); }
.form label{ display:grid; gap:.35rem; font-weight:700; color:#111; }
input, textarea{
  width:100%; padding:.8rem .9rem; border:1px solid #d3d6dc; border-radius:12px; font:inherit;
  background:#fff; transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, textarea:focus{ border-color: var(--brand-strong); box-shadow: 0 0 0 4px rgba(255,152,0,.15); }
button.btn{ cursor:pointer; }

/* ============== Map ============== */
.map-embed iframe{ width:100%; height:280px; border:0; border-radius:16px; box-shadow: var(--shadow); }

/* ============== Footer ============== */
.site-footer{ background:#fbfbfc; border-top:1px solid var(--line); margin-top: clamp(1.2rem, 2vw, 2rem); padding:1.2rem 0; text-align:center; }
.tiny{ font-size:.92rem; color:#6b7280; }

/* ============== Reveal on scroll ============== */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease; will-change: opacity, transform; }
.reveal.show { opacity: 1; transform: none; }
.reveal-up    { transform: translateY(18px); }
.reveal-left  { transform: translateX(-18px); }
.reveal-right { transform: translateX(18px); }
.reveal-up.show, .reveal-left.show, .reveal-right.show { transform: none; }
.reveal-stagger > * { opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease; }
.reveal-stagger.show > * { opacity: 1; transform: none; }
.reveal-stagger.show > *:nth-child(1){ transition-delay: .05s; }
.reveal-stagger.show > *:nth-child(2){ transition-delay: .12s; }
.reveal-stagger.show > *:nth-child(3){ transition-delay: .18s; }
.reveal-stagger.show > *:nth-child(4){ transition-delay: .24s; }
.reveal-stagger.show > *:nth-child(5){ transition-delay: .30s; }

/* ============== Header shrink on scroll ============== */
.site-header.shrink .nav { padding: .45rem 0; }
.site-header.shrink .logo { width: 56px; height: 56px; }
.site-header.shrink .brand span { font-size: clamp(1rem, .9rem + .8vw, 1.5rem); }

/* ============== Sticky CTA (mobile) ============== */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;display:none;gap:.6rem;justify-content:center;padding:.6rem;background:rgba(255,255,255,.95);border-top:1px solid #eee;z-index:60}
.sticky-cta .btn-call,.sticky-cta .btn-book{flex:1;max-width:360px;text-align:center;padding:.9rem 1rem;border-radius:12px;font-weight:800;text-decoration:none}
.sticky-cta .btn-call{background:#111;color:#fff}
.sticky-cta .btn-book{background:var(--brand);color:#111}
@media(max-width:800px){.sticky-cta{display:flex}}
body{padding-bottom:72px;}

/* ============== Skip link (a11y) ============== */
.skip-link{position:absolute;left:-9999px;top:auto}
.skip-link:focus{left:8px;top:8px;background:#fff;padding:.5rem;border:2px solid #000;z-index:100}

/* ============== Motion preferences ============== */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
  .reveal, .reveal-stagger > * { opacity:1 !important; transform:none !important; }
}