:root{
  --vida-deep: #00513C;
  --vida-base: #026C4B;
  --vida-accent: #2FB668;
  --vida-dark: #003828;
  --vida-white: #FFFFFF;
  --vida-line: #1A7A5E;
  --vida-muted: #7FABA0;
  --vida-salmon: #F5C6CB;
  --teens:#2FB668;
  --jovenes:#4F9DFF;
  --jadultos:#F59E0B;
  --adultos:#C084FC;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Poppins', sans-serif;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,0.04), transparent 40%),
    var(--vida-deep);
  color:var(--vida-white);
  min-height:100vh;
  line-height:1.55;
}
.bg-glow{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(ellipse 600px 400px at 50% 20%, rgba(255,255,255,0.06), transparent 70%),
    radial-gradient(ellipse 400px 300px at 80% 80%, rgba(47,182,104,0.04), transparent 60%);
}
.wrap{position:relative;z-index:10;max-width:720px;margin:0 auto;padding:0 16px 40px;}
header{text-align:center;padding:42px 0 28px;}
header .eyebrow{
  display:inline-block;
  background:var(--vida-white);
  color:var(--vida-deep);
  padding:5px 14px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
  transform:rotate(-1.5deg);
}
header h1{
  font-size:clamp(38px,9vw,62px);
  font-weight:800;
  letter-spacing:3px;
  margin-top:14px;
  line-height:0.95;
}
header p{
  margin-top:14px;
  font-size:15px;
  color:var(--vida-muted);
  max-width:460px;
  margin-left:auto;
  margin-right:auto;
}
.cat{margin-top:32px;}
.cat-title{
  font-size:13px;
  font-weight:700;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--vida-muted);
  display:flex;align-items:center;gap:10px;
  padding-bottom:8px;
  border-bottom:1.5px solid var(--vida-line);
  margin-bottom:14px;
}
.dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;}
.cat[data-c="teens"]   .dot{background:var(--teens);}
.cat[data-c="jovenes"] .dot{background:var(--jovenes);}
.cat[data-c="jadultos"] .dot{background:var(--jadultos);}
.cat[data-c="adultos"] .dot{background:var(--adultos);}
.subcat{
  font-size:12px;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--jadultos);
  margin-top:20px;
  margin-bottom:8px;
}
.card{
  background:var(--vida-dark);
  border:1px solid var(--vida-line);
  border-left:5px solid var(--vida-line);
  border-radius:14px;
  padding:18px 20px;
  margin-top:12px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.cat[data-c="teens"]   .card{border-left-color:var(--teens);}
.cat[data-c="jovenes"] .card{border-left-color:var(--jovenes);}
.cat[data-c="jadultos"] .card{border-left-color:var(--jadultos);}
.cat[data-c="adultos"] .card{border-left-color:var(--adultos);}
.card h3{font-size:1.15rem;font-weight:700;letter-spacing:.3px;margin-bottom:6px;}
.card p{font-size:.92rem;margin-top:5px;color:rgba(255,255,255,.85);}
.card b{color:var(--vida-accent);font-weight:600;}
.wa{
  display:inline-block;
  margin-top:14px;
  background:var(--vida-white);
  color:var(--vida-deep);
  text-decoration:none;
  font-weight:700;
  font-size:13px;
  letter-spacing:.5px;
  padding:11px 20px;
  border-radius:8px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.wa:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.3);}
.url{
  display:block;
  margin-top:8px;
  font-size:.75rem;
  color:var(--vida-muted);
  word-break:break-all;
  text-decoration:none;
}
.url:hover{text-decoration:underline;}
.maps{color:var(--vida-accent);font-weight:600;text-decoration:underline;}
footer{
  text-align:center;
  margin-top:48px;
  padding-top:24px;
  border-top:1px solid var(--vida-line);
  font-size:12px;
  color:var(--vida-muted);
  letter-spacing:1px;
}
.filter{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
  margin:24px 0 10px;
}
.filter button{
  font-family:'Poppins', sans-serif;
  font-size:12px;
  font-weight:600;
  background:transparent;
  border:1.5px solid var(--vida-line);
  color:var(--vida-white);
  padding:8px 14px;
  border-radius:20px;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.filter button:hover,.filter button.active{border-color:var(--vida-white);background:rgba(255,255,255,.08);}
@media (prefers-reduced-motion: reduce){*{transition:none !important;}}