:root {
  --maxw: 1120px;
  --radius: 14px;
  --gap: 16px;
  --elev: 14px;
}

@media (prefers-color-scheme: light) {
  :root { --bg: #fafafa; --card: #ffffff; --txt: #111; --muted:#555; --line:#eee; --cta:#0f62fe; }
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #0b0b0c; --card: #121214; --txt: #f3f3f4; --muted:#b6b6b9; --line:#222; --cta:#5aa2ff; }
}

* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:var(--bg); color:var(--txt); font:16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 56px 20px; }
h1,h2,h3 { margin: 0 0 12px; line-height: 1.2; }
p { margin: 0 0 12px; color: var(--muted); }

/* Header */
.site-header { position: sticky; top:0; z-index:999; backdrop-filter: blur(8px);
  background: color-mix(in oklab, var(--bg) 70%, transparent); border-bottom:1px solid var(--line); }
.site-header .brand { display:flex; align-items:center; gap:10px; padding:10px 16px; }
.logo { height:34px; width:auto; }

.nav { display:flex; align-items:center; gap:14px; padding:10px 16px; justify-content:flex-end; }
.nav a { text-decoration:none; color:var(--txt); opacity:.85; }
.nav a:hover { opacity:1; }
.chip { border:1px solid var(--line); background:var(--card); color:var(--txt); padding:6px 10px; border-radius:999px; cursor:pointer; }

/* Hero */
.hero { position:relative; min-height: 72vh; display:grid; }
.hero-media { position:absolute; inset:0; background-size:cover; background-position:center;
  filter: saturate(1.05) contrast(1.05) brightness(.95); }
/* Scrim para legibilidad sobre fotos claras */
.hero-scrim { position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35) 40%, rgba(255,255,255,.55)); }
/* Caja de texto más arriba del borde inferior */
.hero-copy { position:relative; align-self:end; max-width: var(--maxw); margin: 0 auto;
  padding: 6vh 20px; margin-bottom: 10vh; }  /* <- levanta la caja */
@media (max-width: 900px){ .hero-copy { margin-bottom: 12vh; } }

/* Cards & sections */
.card { background:var(--card); border:1px solid var(--line); border-radius: var(--radius); padding: 14px;
  box-shadow: 0 var(--elev) 40px -24px rgba(0,0,0,.12); }
.cta { display:inline-block; margin-top:12px; background:var(--cta); color:#fff; text-decoration:none; padding:12px 18px; border-radius:12px; border:0; cursor:pointer; }

.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: var(--gap); }
.card img { width:100%; height:180px; object-fit:cover; border-radius:10px; margin-bottom:10px; }
.card h3 { margin: 4px 0 6px; }

.grid-list { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:10px; padding-left: 18px; }
.two-col { display:grid; grid-template-columns: 1.1fr .9fr; gap:var(--gap); }
.two-col img { width:100%; border-radius:12px; border:1px solid var(--line); }
@media (max-width: 900px){ .two-col { grid-template-columns: 1fr; } }

.gallery { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: var(--gap); }
.gallery img { width:100%; height:180px; object-fit:cover; border-radius:12px; border:1px solid var(--line); }

.contact form { display:grid; gap:10px; max-width:560px; }
.contact label { display:grid; gap:6px; }
.contact input, .contact textarea { width:100%; padding:12px; border-radius:10px; border:1px solid var(--line); background:var(--card); color:var(--txt); }
.contact .contact-meta { margin-top:16px; color:var(--muted); }

.site-footer { border-top:1px solid var(--line); padding:20px; text-align:center; color:var(--muted); }

/* WhatsApp floating button */
.wa-float{position:fixed;right:18px;bottom:18px;background:#2bb741;color:#fff;
  padding:12px 14px;border-radius:999px;text-decoration:none;font-weight:600;
  box-shadow:0 10px 30px rgba(0,0,0,.25);z-index:1000}
.wa-float:hover{filter:brightness(1.05)}

.map-wrap{margin-top:16px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}