:root{
  --vit-azul:#0096c7;
  --vit-azul-osc:#023047;
  --vit-turquesa:#2bdbe3;
  --vit-gris:#6b7a86;
  --vit-borde:#e6ebef;
  --vit-fondo:#f5f8fa;
  --vit-radio:18px;
  --vit-sombra:0 10px 30px rgba(2,48,71,.08);
  --vit-sombra-alta:0 18px 46px rgba(2,48,71,.16);
}

body{ background:var(--vit-fondo); }

.vit-wrap{ max-width:1180px; margin:0 auto; padding:0 18px; }

/* ---------- HERO ---------- */
.vit-hero{
  position:relative;
  padding:148px 0 100px;
  background:
    radial-gradient(1100px 550px at 18% -15%, rgba(43,219,227,.28), transparent 60%),
    radial-gradient(900px 500px at 88% -5%, rgba(255,0,153,.20), transparent 62%),
    radial-gradient(700px 400px at 50% 110%, rgba(0,150,199,.22), transparent 65%),
    linear-gradient(180deg,#000000 0%, #04070a 55%, #000000 100%);
  color:#fff;
  overflow:hidden;
}
.vit-hero::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:radial-gradient(circle at 50% 20%, black, transparent 70%);
  pointer-events:none;
}
.vit-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:70px;
  background:var(--vit-fondo);
  clip-path:ellipse(75% 100% at 50% 100%);
}
.vit-hero__inner{ position:relative; z-index:2; text-align:center; }
.vit-hero h1{
  font-size:clamp(1.9rem,4.6vw,3.2rem);
  font-weight:800; line-height:1.12; margin:0 0 12px; letter-spacing:-.02em;
}
.vit-hero h1 span{
  background:linear-gradient(90deg,var(--vit-turquesa),#8bf3ff 45%,#ff2e9e 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 22px rgba(43,219,227,.35));
}
.vit-hero p.vit-lead{
  font-size:clamp(.98rem,1.6vw,1.12rem);
  color:#cfe6f2; margin:0 auto 28px; max-width:640px;
}

/* ---------- BUSCADOR ---------- */
.vit-search{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-radius:24px; padding:14px;
  max-width:820px; margin:0 auto;
  box-shadow:0 0 0 1px rgba(255,255,255,.05), 0 25px 70px rgba(0,0,0,.55), 0 0 90px rgba(0,150,199,.25);
}
.vit-search__row{ display:flex; align-items:center; gap:8px; }
.vit-search__field{
  flex:1 1 auto; display:flex; align-items:center; gap:10px;
  background:#fff; border-radius:16px; padding:6px 8px 6px 16px; min-width:0;
}
.vit-search__field svg{ flex:0 0 auto; fill:var(--vit-gris); width:20px; height:20px; }
.vit-search__field input{
  flex:1 1 auto; border:0; outline:0; background:transparent;
  font-size:16px; color:#12222c; padding:13px 0; min-width:0;
}
.vit-search__field input::placeholder{ color:#9bacb8; }

.vit-btn{
  border:0; cursor:pointer; border-radius:14px; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.vit-btn:active{ transform:translateY(1px); }
.vit-btn--go{
  background:linear-gradient(135deg,var(--vit-azul),#00b4d8);
  color:#fff; padding:15px 26px; font-size:15px;
}
.vit-btn--go:hover{ box-shadow:0 8px 22px rgba(0,180,216,.45); color:#fff; }
.vit-btn--mic{
  background:#fff; width:52px; height:52px; border-radius:16px; flex:0 0 auto;
}
.vit-btn--mic svg{ width:22px; height:22px; fill:var(--vit-azul); }
.vit-btn--mic.vit-grabando{
  background:#e63946; animation:vitPulso 1.15s infinite;
}
.vit-btn--mic.vit-grabando svg{ fill:#fff; }
@keyframes vitPulso{
  0%{ box-shadow:0 0 0 0 rgba(230,57,70,.65); }
  70%{ box-shadow:0 0 0 16px rgba(230,57,70,0); }
  100%{ box-shadow:0 0 0 0 rgba(230,57,70,0); }
}

.vit-search__hint{
  color:#bcd9e8; font-size:12.5px; text-align:center; margin:12px 4px 2px; min-height:18px;
}
.vit-search__hint b{ color:#fff; }

/* chips de categorías */
.vit-chips{ display:flex; flex-wrap:wrap; gap:9px; justify-content:center; margin-top:24px; }
.vit-chip{
  background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.25);
  color:#fff; text-decoration:none; padding:9px 17px; border-radius:999px;
  font-size:13.5px; font-weight:600; transition:.18s;
}
.vit-chip:hover{ background:#fff; color:var(--vit-azul-osc); text-decoration:none; }
.vit-chip--map{ background:linear-gradient(135deg,var(--vit-turquesa),#00b4d8); border-color:transparent; color:#01303f; }

/* ---------- RESULTADOS ---------- */
.vit-resultados{ max-width:1180px; margin:0 auto; padding:0 18px; }
.vit-resultados__caja{
  background:#fff; border-radius:var(--vit-radio); box-shadow:var(--vit-sombra);
  padding:20px; margin-top:-28px; position:relative; z-index:5; display:none;
}
.vit-resultados__caja.vit-activo{ display:block; }
.vit-resultados__head{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:14px; flex-wrap:wrap;
}
.vit-resultados__head h3{ font-size:1.05rem; font-weight:800; color:var(--vit-azul-osc); margin:0; }
.vit-cerrar{
  background:var(--vit-fondo); border:0; border-radius:10px; cursor:pointer;
  padding:7px 13px; font-size:13px; color:var(--vit-gris); font-weight:600;
}

/* ---------- GRID DE TARJETAS ---------- */
.vit-grid{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fill,minmax(255px,1fr));
}
.vit-card{
  background:#fff; border:1px solid var(--vit-borde); border-radius:var(--vit-radio);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .2s ease, box-shadow .2s ease;
}
.vit-card:hover{ transform:translateY(-4px); box-shadow:var(--vit-sombra-alta); }
.vit-card__img{ position:relative; aspect-ratio:4/3; background:#dde6ec; overflow:hidden; }
.vit-card__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.vit-card__tag{
  position:absolute; top:10px; left:10px;
  background:rgba(2,48,71,.86); color:#fff; font-size:11px; font-weight:700;
  padding:5px 11px; border-radius:999px; letter-spacing:.02em;
}
.vit-card__body{ padding:14px 15px 16px; display:flex; flex-direction:column; gap:7px; flex:1; }
.vit-card__precio{ font-size:1.15rem; font-weight:800; color:var(--vit-azul-osc); }
.vit-card__titulo{
  font-size:.95rem; font-weight:700; color:#1a2b36; margin:0; line-height:1.3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.vit-card__desc{
  font-size:.83rem; color:var(--vit-gris); line-height:1.45; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.vit-card__cod{ font-size:11.5px; color:#9bacb8; font-weight:600; }
.vit-card__acciones{ display:flex; gap:8px; margin-top:auto; padding-top:10px; }
.vit-card__acciones a{
  flex:1; text-align:center; text-decoration:none; font-size:12.5px; font-weight:700;
  padding:9px 6px; border-radius:11px; transition:.15s;
}
.vit-a-ver{ background:var(--vit-azul); color:#fff; }
.vit-a-ver:hover{ background:#0080ab; color:#fff; }
.vit-a-wa{ background:#e8fbf6; color:#0b7a5f; border:1px solid #b9eede; }
.vit-a-wa:hover{ background:#25d366; color:#fff; }

/* estados */
.vit-estado{
  text-align:center; padding:26px 14px; color:var(--vit-gris); font-size:14.5px; font-weight:600;
}
.vit-spinner{
  width:30px; height:30px; margin:0 auto 12px; border-radius:50%;
  border:3px solid var(--vit-borde); border-top-color:var(--vit-azul);
  animation:vitGirar .8s linear infinite;
}
@keyframes vitGirar{ to{ transform:rotate(360deg); } }

/* ---------- SECCIONES ---------- */
.vit-seccion{ padding:52px 0 10px; }
.vit-seccion__head{ text-align:center; margin-bottom:26px; }
.vit-seccion__head h2{
  font-size:clamp(1.4rem,3vw,2rem); font-weight:800; color:var(--vit-azul-osc); margin:0 0 8px;
}
.vit-seccion__head p{ color:var(--vit-gris); margin:0; font-size:.96rem; }

.vit-ventajas{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.vit-ventaja{
  background:#fff; border:1px solid var(--vit-borde); border-radius:var(--vit-radio);
  padding:24px 20px; text-align:center;
}
.vit-ventaja__ico{
  width:52px; height:52px; margin:0 auto 14px; border-radius:15px;
  background:linear-gradient(135deg,rgba(0,150,199,.14),rgba(43,219,227,.22));
  display:flex; align-items:center; justify-content:center; font-size:24px;
}
.vit-ventaja h4{ font-size:1rem; font-weight:800; color:var(--vit-azul-osc); margin:0 0 6px; }
.vit-ventaja p{ font-size:.86rem; color:var(--vit-gris); margin:0; line-height:1.5; }

/* CTA */
.vit-cta{
  margin:56px auto 40px; max-width:1180px;
  background:linear-gradient(135deg,var(--vit-azul-osc),#015b86);
  border-radius:26px; padding:42px 30px; text-align:center; color:#fff;
}
.vit-cta h2{ font-size:clamp(1.35rem,3vw,1.9rem); font-weight:800; margin:0 0 10px; }
.vit-cta p{ color:#cfe6f2; margin:0 auto 22px; max-width:560px; font-size:.96rem; }
.vit-cta a{
  display:inline-block; background:#25d366; color:#fff; text-decoration:none;
  font-weight:800; padding:14px 30px; border-radius:14px; font-size:15px;
}
.vit-cta a:hover{ background:#1eb857; color:#fff; }

@media (max-width:600px){
  .vit-hero{ padding:118px 0 130px; }
  .vit-search{ padding:11px; border-radius:20px; }
  .vit-search__row{ flex-wrap:wrap; }
  .vit-search__field{ order:1; width:100%; }
  .vit-btn--mic{ order:2; }
  .vit-btn--go{ order:3; flex:1; padding:14px 18px; }
  .vit-grid{ grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; }
  .vit-card__body{ padding:11px 12px 13px; }
  .vit-card__acciones{ flex-direction:column; }
}