:root{
  --brand-50:#f0fdfa;
  --brand-100:#ccfbf1;
  --brand-500:#14b8a6;
  --brand-600:#0d9488;
  --brand-700:#0f766e;
  --ink:#1e293b;
  --muted:#64748b;
  --line:#e2e8f0;
  --bg:#f8fafc;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
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.55;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }

/* Componentes reutilizables (mismo espíritu que la Fasis App) */
.f-card{
  border-radius:1.25rem;
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.06);
}
.f-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  border-radius:1rem; font-weight:800; cursor:pointer; border:0;
  transition:transform .05s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  text-decoration:none;
}
.f-btn:active{ transform:translateY(1px); }
.f-btn-primary{
  background:linear-gradient(135deg,var(--brand-500),var(--brand-600));
  color:#fff; box-shadow:0 8px 20px rgba(13,148,136,.28);
}
.f-btn-primary:hover{ background:linear-gradient(135deg,var(--brand-600),var(--brand-700)); }
.f-btn-ghost{
  background:#fff; color:var(--ink); border:1px solid var(--line);
}
.f-btn-ghost:hover{ background:var(--brand-50); border-color:var(--brand-100); color:var(--brand-700); }
.f-input{
  width:100%; border:1px solid var(--line); border-radius:1rem;
  background:#fff; color:var(--ink); outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.f-input:focus{
  border-color:var(--brand-500);
  box-shadow:0 0 0 4px rgba(20,184,166,.15);
}
.f-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.35rem .7rem; border-radius:999px; font-size:.8rem; font-weight:700;
  background:var(--brand-50); color:var(--brand-700);
}

/* Hero */
.hero{
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(20,184,166,.18), transparent 60%),
    radial-gradient(900px 400px at 0% 10%, rgba(13,148,136,.12), transparent 55%),
    #ffffff;
}
.brand-badge{
  width:44px; height:44px; border-radius:14px;
  background:linear-gradient(135deg,var(--brand-500),var(--brand-600));
  color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px rgba(13,148,136,.35);
}

/* Utilidades pequeñas */
.section{ max-width:1120px; margin:0 auto; padding:0 1.25rem; }
.grad-text{
  background:linear-gradient(135deg,var(--brand-600),var(--brand-500));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.card-hover{ transition:transform .18s ease, box-shadow .18s ease; }
.card-hover:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(15,23,42,.10); }
.map-embed{ width:100%; height:340px; border:0; border-radius:1.25rem; }

/* Header sticky */
.site-header{
  position:sticky; top:0; z-index:50;
  backdrop-filter:saturate(160%) blur(8px);
  background:rgba(255,255,255,.85);
  border-bottom:1px solid var(--line);
}

/* Mensajes de formulario */
.form-ok{ color:var(--brand-700); font-weight:700; }
.form-err{ color:#e11d48; font-weight:600; }

@media (max-width:640px){
  .map-embed{ height:260px; }
}
