/* =========================================================================
   VIRTUALISIMO - Estilos
   -------------------------------------------------------------------------
   COLORES DE LA MARCA (tomados de tu logo). Para cambiar toda la paleta,
   solo edita estos valores de aquí abajo:
   ========================================================================= */
:root{
	--vs-amarillo:      #FFB000;  /* amarillo/dorado del logo */
	--vs-amarillo-osc:  #E89A00;
	--vs-rojo:          #E51E25;  /* rojo del logo */
	--vs-rojo-osc:      #C1141A;
	--vs-oscuro:        #2B2B2B;  /* gris oscuro del texto */
	--vs-gris:          #6B6B6B;
	--vs-gris-claro:    #EDEDED;
	--vs-fondo:         #FAFAFA;
	--vs-blanco:        #FFFFFF;
	--vs-acento:        #1E88A8;  /* azul-petróleo complementario (enlaces/detalles) */
	--vs-wa:            #25D366;  /* verde WhatsApp */

	--vs-radio:         14px;
	--vs-sombra:        0 6px 20px rgba(0,0,0,.08);
	--vs-sombra-hover:  0 10px 28px rgba(0,0,0,.14);
	--vs-fuente:        -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

/* ------------------------- Botones ------------------------- */
.vs-btn{
	display:inline-block;
	padding:11px 22px;
	border:none;
	border-radius:999px;
	font-family:var(--vs-fuente);
	font-weight:700;
	font-size:15px;
	line-height:1;
	text-decoration:none;
	cursor:pointer;
	transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
	color:#fff;
}
.vs-btn:hover{ transform:translateY(-2px); }
.vs-btn--red{ background:var(--vs-rojo); }
.vs-btn--red:hover{ background:var(--vs-rojo-osc); color:#fff; }
.vs-btn--yellow{ background:var(--vs-amarillo); color:var(--vs-oscuro); }
.vs-btn--yellow:hover{ background:var(--vs-amarillo-osc); color:var(--vs-oscuro); }
.vs-btn--wa{ background:var(--vs-wa); }
.vs-btn--wa:hover{ background:#1EB955; color:#fff; }
.vs-btn--grande{ padding:15px 34px; font-size:17px; }

/* ------------------------- Rejilla de tarjetas ------------------------- */
.vs-grid{
	display:grid;
	grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
	gap:22px;
}

/* ------------------------- Tarjeta ------------------------- */
.vs-card{
	background:var(--vs-blanco);
	border:1px solid var(--vs-gris-claro);
	border-radius:var(--vs-radio);
	box-shadow:var(--vs-sombra);
	overflow:hidden;
	display:flex;
	flex-direction:column;
	transition:transform .15s ease, box-shadow .15s ease;
}
.vs-card:hover{ transform:translateY(-4px); box-shadow:var(--vs-sombra-hover); }
.vs-card__logo{
	background:linear-gradient(135deg,#fff 0%,#fff7e6 100%);
	aspect-ratio:16/10;
	display:flex;align-items:center;justify-content:center;
	padding:16px;
	border-bottom:3px solid var(--vs-amarillo);
}
.vs-logo-img{ max-width:100%; max-height:130px; height:auto; object-fit:contain; }
.vs-card__body{ padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px; }
.vs-card__cat{
	align-self:flex-start;
	background:var(--vs-amarillo);
	color:var(--vs-oscuro);
	font-size:11px; font-weight:700;
	text-transform:uppercase; letter-spacing:.4px;
	padding:3px 10px; border-radius:999px;
}
.vs-card__title{ margin:2px 0 0; font-size:18px; color:var(--vs-oscuro); font-family:var(--vs-fuente); }
.vs-card__loc, .vs-card__tel{ margin:0; font-size:14px; color:var(--vs-gris); }
.vs-card__tel a{ color:var(--vs-acento); text-decoration:none; }
.vs-card .vs-btn{ margin-top:10px; align-self:flex-start; }

/* ------------------------- Buscador ------------------------- */
.vs-buscador{ font-family:var(--vs-fuente); }
.vs-buscador__form{
	background:var(--vs-blanco);
	border-radius:var(--vs-radio);
	box-shadow:var(--vs-sombra);
	padding:18px;
	margin-bottom:26px;
	border-top:4px solid var(--vs-rojo);
}
.vs-buscador__row{ display:flex; gap:10px; margin-bottom:12px; }
.vs-buscador__q{
	flex:1;
	padding:13px 16px;
	border:2px solid var(--vs-gris-claro);
	border-radius:999px;
	font-size:16px;
}
.vs-buscador__q:focus{ outline:none; border-color:var(--vs-amarillo); }
.vs-buscador__filtros{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(150px,1fr));
	gap:10px;
}
.vs-select, .vs-form select, .vs-form input, .vs-form textarea{
	width:100%;
	padding:11px 12px;
	border:2px solid var(--vs-gris-claro);
	border-radius:10px;
	font-size:15px;
	background:#fff;
	font-family:var(--vs-fuente);
	color:var(--vs-oscuro);
}
.vs-select:focus{ outline:none; border-color:var(--vs-amarillo); }
.vs-resultados__conteo{ color:var(--vs-gris); font-size:14px; margin:0 0 14px; }
.vs-vacio{ background:#fff; border:1px dashed var(--vs-gris-claro); border-radius:var(--vs-radio); padding:30px; text-align:center; color:var(--vs-gris); }

/* ------------------------- Paginación ------------------------- */
.vs-paginacion{ margin-top:26px; display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.vs-paginacion .page-numbers{
	padding:8px 13px; border-radius:8px; text-decoration:none;
	background:#fff; border:1px solid var(--vs-gris-claro); color:var(--vs-oscuro);
}
.vs-paginacion .page-numbers.current{ background:var(--vs-rojo); color:#fff; border-color:var(--vs-rojo); }

/* ------------------------- Planes ------------------------- */
.vs-planes{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(250px,1fr));
	gap:22px;
	align-items:stretch;
	font-family:var(--vs-fuente);
}
.vs-plan{
	position:relative;
	background:#fff;
	border:2px solid var(--vs-gris-claro);
	border-radius:var(--vs-radio);
	padding:28px 24px;
	display:flex; flex-direction:column;
	box-shadow:var(--vs-sombra);
}
.vs-plan--destacado{ border-color:var(--vs-amarillo); transform:scale(1.03); }
.vs-plan__badge{
	position:absolute; top:-13px; left:50%; transform:translateX(-50%);
	background:var(--vs-rojo); color:#fff; font-size:12px; font-weight:700;
	padding:5px 14px; border-radius:999px;
}
.vs-plan__nombre{ font-size:24px; margin:0 0 6px; color:var(--vs-oscuro); }
.vs-plan__precio{ font-size:30px; font-weight:800; color:var(--vs-rojo); margin:4px 0 6px; line-height:1.1; }
.vs-plan__periodo{ font-size:14px; font-weight:600; color:var(--vs-gris); }
.vs-plan__desc{ color:var(--vs-gris); margin:0 0 16px; font-size:15px; }
.vs-plan__items{ list-style:none; padding:0; margin:0 0 22px; flex:1; }
.vs-plan__items li{ padding:8px 0 8px 26px; position:relative; border-bottom:1px solid var(--vs-gris-claro); font-size:15px; }
.vs-plan__items li:before{ content:"✔"; position:absolute; left:0; color:var(--vs-wa); font-weight:700; }
.vs-plan__cta{ text-align:center; }

/* ------------------------- Formulario de registro ------------------------- */
.vs-form-wrap{ font-family:var(--vs-fuente); max-width:820px; margin:0 auto; }
.vs-form{ background:#fff; border-radius:var(--vs-radio); box-shadow:var(--vs-sombra); padding:26px; border-top:4px solid var(--vs-amarillo); }
.vs-form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:20px; }
.vs-form__field{ display:flex; flex-direction:column; gap:6px; }
.vs-form__field > span{ font-weight:600; font-size:14px; color:var(--vs-oscuro); }
.vs-form__field--full{ grid-column:1 / -1; }
.vs-form__field--check{ flex-direction:row; align-items:center; gap:10px; }
.vs-form__field--check span{ font-weight:400; }

/* Caja de clasificación de aspirantes ("¿Cómo te describes?") */
.vs-perfil-box{ grid-column:1 / -1; background:#fff8ec; border:1px solid #ffe1a8; border-radius:14px; padding:18px 20px; }
.vs-perfil-box .vs-perfil-tit{ display:block; font-weight:700; font-size:15px; color:var(--vs-oscuro); margin-bottom:14px; }
.vs-perfil-box .vs-perfil-tit em{ font-weight:400; color:#8a7a5a; font-style:normal; }
.vs-perfil-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px 26px; }
.vs-perfil-opt{ display:flex !important; flex-direction:row !important; align-items:flex-start; justify-content:flex-start !important; text-align:left; gap:11px; margin:0; font-weight:400; color:var(--vs-oscuro); cursor:pointer; }
.vs-perfil-opt input[type=checkbox]{ flex:0 0 auto; width:19px; height:19px; margin:1px 0 0; }
.vs-perfil-opt > span{ flex:1; font-weight:400; font-size:15px; line-height:1.3; }
.vs-perfil-otro{ grid-column:1 / -1; align-items:center; }
.vs-perfil-otro .vs-perfil-otro-lbl{ flex:0 0 auto; font-weight:600; }
.vs-perfil-otro input[type=text]{ flex:1; padding:8px 10px; }
@media (max-width:560px){ .vs-perfil-grid{ grid-template-columns:1fr; } }

/* Caja de consentimiento ("Acepto...") — mismo estilo que la de perfil */
.vs-consent{ grid-column:1 / -1; display:flex !important; flex-direction:row !important; align-items:flex-start; gap:12px; background:#fff8ec; border:1px solid #ffe1a8; border-radius:14px; padding:16px 18px; }
.vs-consent input[type=checkbox]{ flex:0 0 auto; width:19px; height:19px; margin:2px 0 0; }
.vs-consent > span{ flex:1; font-weight:400; font-size:14.5px; line-height:1.5; color:var(--vs-oscuro); }
.vs-consent a{ color:#c1141a; font-weight:600; text-decoration:underline; }
.vs-aviso{ padding:14px 18px; border-radius:10px; margin-bottom:18px; }
.vs-aviso--ok{ background:#e7f8ee; color:#166b39; border:1px solid #b6e6c8; }
.vs-aviso--error{ background:#fdecec; color:#8a1a1f; border:1px solid #f5c2c4; }
.vs-aviso ul{ margin:8px 0 0; padding-left:20px; }
.vs-form__sep{ border-top:2px dashed var(--vs-gris-claro); padding-top:14px; margin-top:6px; color:var(--vs-oscuro); }
.vs-vitrina__redes{ margin-top:14px; display:flex; gap:14px; }
.vs-vitrina__redes a{ color:var(--vs-acento); font-weight:600; text-decoration:none; }

/* ------------------------- Footer legal ------------------------- */
.vs-footer{ background:var(--vs-oscuro); color:#fff; font-family:var(--vs-fuente); margin-top:40px; }
.vs-footer__in{ max-width:1100px; margin:0 auto; padding:22px 16px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.vs-footer__marca{ font-size:13px; color:#e6e6e6; }
.vs-footer__links{ display:flex; gap:18px; flex-wrap:wrap; }
.vs-footer__links a{ color:#fff; text-decoration:none; font-size:14px; font-weight:600; }
.vs-footer__links a:hover{ color:var(--vs-amarillo); }
@media (max-width:600px){ .vs-footer__in{ flex-direction:column; text-align:center; } .vs-footer__links{ justify-content:center; } }

/* ------------------------- Vitrina (landing) ------------------------- */
.vs-vitrina{ max-width:960px; margin:0 auto; padding:24px 16px 60px; font-family:var(--vs-fuente); }
.vs-vitrina__hero{
	display:flex; gap:26px; align-items:center; flex-wrap:wrap;
	background:linear-gradient(135deg,#fff 0%,#fff7e6 100%);
	border-radius:var(--vs-radio); padding:28px; box-shadow:var(--vs-sombra);
	border-left:6px solid var(--vs-rojo);
}
.vs-vitrina__logo{ flex:0 0 200px; max-width:200px; }
.vs-vitrina__logo .vs-logo-img{ max-height:180px; }
.vs-vitrina__enc{ flex:1; min-width:240px; }
.vs-badge{ display:inline-block; background:var(--vs-amarillo); color:var(--vs-oscuro); font-size:12px; font-weight:700; text-transform:uppercase; padding:4px 12px; border-radius:999px; }
.vs-vitrina__titulo{ margin:10px 0 6px; font-size:32px; color:var(--vs-oscuro); }
.vs-vitrina__loc, .vs-vitrina__dir{ margin:2px 0; color:var(--vs-gris); }
.vs-vitrina__acciones{ margin-top:16px; display:flex; gap:10px; flex-wrap:wrap; }
.vs-vitrina__contenido{ margin-top:30px; line-height:1.7; color:var(--vs-oscuro); }
.vs-vitrina__pie{ margin-top:40px; }
.vs-volver{ color:var(--vs-acento); text-decoration:none; font-weight:600; }

/* ------------------------- Archivo ------------------------- */
.vs-archivo{ max-width:1100px; margin:0 auto; padding:24px 16px; }
.vs-archivo__titulo{ font-family:var(--vs-fuente); color:var(--vs-oscuro); margin-bottom:20px; }

/* ------------------------- Responsive ------------------------- */
@media (max-width:600px){
	.vs-buscador__row{ flex-direction:column; }
	.vs-buscador__q{ width:100%; }
	.vs-form__grid{ grid-template-columns:1fr; }
	.vs-vitrina__hero{ flex-direction:column; text-align:center; }
	.vs-vitrina__logo{ margin:0 auto; }
	.vs-plan--destacado{ transform:none; }
}

/* ============================================================= *
   PORTADA (página de inicio)
   ============================================================= */
.vs-portada{ --vs-titulo:'Poppins',var(--vs-fuente); color:var(--vs-oscuro); }
.vs-portada section{ box-sizing:border-box; }

/* Hero */
.vs-hero{
	background:
	  linear-gradient(135deg, rgba(43,43,43,.85) 0%, rgba(58,42,18,.68) 45%, rgba(122,20,24,.80) 100%),
	  url('../img/hero.jpg') center/cover no-repeat;
	border-radius:22px;
	padding:76px 26px;
	text-align:center;
	color:#fff;
	position:relative;
	overflow:hidden;
}
.vs-hero__in{ max-width:760px; margin:0 auto; position:relative; z-index:1; }
.vs-hero__eyebrow{ display:inline-block; background:rgba(255,255,255,.15); color:#fff; font-weight:700; font-size:12px; letter-spacing:1px; text-transform:uppercase; padding:6px 14px; border-radius:999px; }
.vs-hero__titulo{ font-family:var(--vs-titulo); font-size:clamp(30px,5vw,52px); font-weight:800; line-height:1.05; margin:16px 0 10px; text-wrap:balance; }
.vs-hero__sub{ font-size:18px; color:#f2e9e9; margin:0 auto 26px; max-width:560px; line-height:1.5; }
.vs-hero__buscador{ display:flex; gap:8px; background:#fff; padding:8px; border-radius:999px; box-shadow:0 16px 40px rgba(0,0,0,.3); max-width:620px; margin:0 auto 18px; }
.vs-hero__q{ flex:1; border:none; outline:none; padding:12px 18px; font-size:16px; border-radius:999px; color:var(--vs-oscuro); background:transparent; }
.vs-hero__btn{ white-space:nowrap; }
.vs-hero__ctas{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.vs-btn--ghost{ background:transparent; color:#fff; border:2px solid rgba(255,255,255,.6); }
.vs-btn--ghost:hover{ background:#fff; color:var(--vs-oscuro); }

/* Stats */
.vs-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:-34px auto 10px; max-width:760px; position:relative; z-index:2; }
.vs-stat{ background:#fff; border:1px solid var(--vs-gris-claro); border-radius:14px; padding:18px 10px; text-align:center; box-shadow:var(--vs-sombra); }
.vs-stat__num{ display:block; font-family:var(--vs-titulo); font-size:30px; font-weight:800; color:var(--vs-rojo); }
.vs-stat__lbl{ display:block; font-size:13px; color:var(--vs-gris); margin-top:2px; }

/* Secciones */
.vs-seccion{ margin:56px auto 0; max-width:1100px; }
.vs-seccion__titulo{ font-family:var(--vs-titulo); font-size:clamp(24px,3.2vw,34px); font-weight:800; text-align:center; margin:0 0 6px; text-wrap:balance; }
.vs-seccion__sub{ text-align:center; color:var(--vs-gris); margin:0 0 26px; }
.vs-seccion__cta{ text-align:center; margin-top:26px; }

/* Categorías */
.vs-cats{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:16px; }
.vs-cat{ display:flex; flex-direction:column; align-items:center; gap:10px; text-decoration:none; background:#fff; border:1px solid var(--vs-gris-claro); border-radius:16px; padding:24px 14px; transition:transform .15s, box-shadow .15s, border-color .15s; }
.vs-cat:hover{ transform:translateY(-4px); box-shadow:var(--vs-sombra-hover); border-color:var(--vs-amarillo); }
.vs-cat__icono{ font-size:40px; line-height:1; }
.vs-cat__nombre{ font-weight:700; color:var(--vs-oscuro); text-align:center; font-size:15px; }

/* Cómo funciona */
.vs-pasos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.vs-paso{ background:#fff; border:1px solid var(--vs-gris-claro); border-radius:16px; padding:26px 22px; text-align:center; }
.vs-paso__n{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:50%; background:var(--vs-amarillo); color:var(--vs-oscuro); font-family:var(--vs-titulo); font-weight:800; font-size:20px; margin-bottom:12px; }
.vs-paso h3{ font-family:var(--vs-titulo); margin:0 0 6px; font-size:19px; }
.vs-paso p{ color:var(--vs-gris); margin:0; font-size:15px; line-height:1.5; }

/* Empresarios */
.vs-empresarios{ margin:64px auto 0; max-width:1100px; background:linear-gradient(135deg,#fff 0%,#fff7e6 100%); border:1px solid var(--vs-gris-claro); border-left:6px solid var(--vs-rojo); border-radius:22px; overflow:hidden; }
.vs-empresarios__in{ display:grid; grid-template-columns:1.3fr 1fr; gap:20px; align-items:center; padding:36px; }
.vs-empresarios__texto h2{ font-family:var(--vs-titulo); font-size:clamp(22px,3vw,30px); font-weight:800; margin:0 0 10px; }
.vs-empresarios__texto p{ color:var(--vs-gris); margin:0 0 16px; line-height:1.6; }
.vs-beneficios{ list-style:none; padding:0; margin:0 0 22px; display:grid; gap:8px; }
.vs-beneficios li{ padding-left:28px; position:relative; font-weight:600; }
.vs-beneficios li:before{ content:"✔"; position:absolute; left:0; color:var(--vs-wa); font-weight:800; }
.vs-empresarios__arte{ text-align:center; }
.vs-arte-emoji{ font-size:90px; }
.vs-arte-badges{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; max-width:220px; margin:14px auto 0; }
.vs-arte-badges span{ background:#fff; border:1px solid var(--vs-gris-claro); border-radius:14px; padding:12px; font-size:28px; box-shadow:var(--vs-sombra); }

@media (max-width:760px){
	.vs-empresarios__in{ grid-template-columns:1fr; text-align:center; }
	.vs-beneficios li{ text-align:left; }
	.vs-hero__buscador{ flex-direction:column; border-radius:18px; }
	.vs-hero__q{ text-align:center; }
	.vs-stats{ grid-template-columns:1fr; margin-top:-20px; }
}

/* Tarjeta de categoría con FOTO */
.vs-cat--foto{
	position:relative;
	min-height:160px;
	justify-content:flex-end;
	align-items:flex-start;
	padding:16px;
	background-size:cover;
	background-position:center;
	border:none;
	overflow:hidden;
}
.vs-cat--foto .vs-cat__nombre{ color:#fff; text-align:left; font-size:17px; text-shadow:0 1px 6px rgba(0,0,0,.5); }
.vs-cat--foto:hover{ border:none; }

/* Casilla "Otra (escribir)" en los formularios */
.vs-nuevo{ margin-top:8px; border-color:var(--vs-amarillo) !important; }

/* Bono de descuento en la página de Planes */
.vs-bono{ max-width:520px; margin:0 auto 26px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; background:#fff; border:1px dashed var(--vs-amarillo); border-radius:12px; padding:12px 14px; }
.vs-bono input{ flex:1; min-width:180px; padding:11px 14px; border:2px solid var(--vs-gris-claro); border-radius:999px; font-size:15px; }
.vs-bono #vs-bono-msg{ font-size:14px; font-weight:600; width:100%; }
.vs-plan__pagar{ margin-top:10px; }

/* Sección de pago dentro del formulario de registro */
.vs-pago-registro{ max-width:820px; margin:22px auto 0; background:#fff7e6; border:1px solid var(--vs-amarillo); border-radius:var(--vs-radio); padding:20px 24px; }
.vs-pago-registro h3{ margin:0 0 4px; font-size:20px; color:var(--vs-oscuro); }
.vs-pago-registro p{ margin:0 0 14px; color:var(--vs-gris); font-size:14px; }
.vs-pago-registro .vs-bono{ margin:0 0 14px; }

/* ======================================================================= *
 *  DISEÑOS DE VITRINA POR TIPO (Negocios / Servicios / Profesiones)
 * ======================================================================= */

/* Bloques de sección reutilizables dentro de una Vitrina */
.vs-bloque{ margin-top:34px; }
.vs-bloque__titulo{ font-family:var(--vs-fuente); font-size:22px; font-weight:700; color:var(--vs-oscuro); margin:0 0 14px; padding-bottom:8px; border-bottom:2px solid var(--vs-gris-claro); }

/* ---- Diseño NEGOCIOS: tarjetas de horario y formas de pago ---- */
.vs-info-cards{ margin-top:22px; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.vs-info-card{ display:flex; gap:14px; align-items:flex-start; background:#fff; border:1px solid var(--vs-gris-claro); border-left:5px solid var(--vs-amarillo); border-radius:var(--vs-radio); padding:16px 18px; box-shadow:var(--vs-sombra); }
.vs-info-card__ico{ font-size:26px; line-height:1; }
.vs-info-card strong{ display:block; color:var(--vs-oscuro); margin-bottom:2px; }
.vs-info-card p{ margin:0; color:var(--vs-gris); }

/* ---- Diseño SERVICIOS: acento azul ---- */
.vs-vit--servicios .vs-vitrina__hero{ border-left-color:var(--vs-acento); }
.vs-badge--azul{ background:var(--vs-acento); color:#fff; }
.vs-btn--azul{ background:var(--vs-acento); }
.vs-btn--azul:hover{ background:#17708b; color:#fff; }
.vs-vit--servicios .vs-bloque__titulo{ border-bottom-color:var(--vs-acento); }
.vs-servicios-lista{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px 20px; }
.vs-servicios-lista li{ position:relative; padding:10px 10px 10px 34px; background:#fff; border:1px solid var(--vs-gris-claro); border-radius:10px; color:var(--vs-oscuro); }
.vs-servicios-lista li:before{ content:"✔"; position:absolute; left:12px; top:10px; color:var(--vs-wa); font-weight:800; }
.vs-cobertura p{ background:#eef7fa; border:1px solid #cfe8f0; border-radius:var(--vs-radio); padding:14px 18px; color:var(--vs-oscuro); margin:0; }
.vs-cta-final{ margin-top:40px; text-align:center; background:linear-gradient(135deg,#fff 0%,#eef7fa 100%); border:1px solid #cfe8f0; border-radius:22px; padding:34px 20px; }
.vs-cta-final h2{ font-family:var(--vs-fuente); font-size:24px; color:var(--vs-oscuro); margin:0 0 16px; }

/* ---- Diseño PROFESIONES: perfil centrado ---- */
.vs-vit--profesiones{ max-width:760px; }
.vs-perfil__hero{ text-align:center; background:var(--vs-blanco); border-radius:var(--vs-radio); padding:34px 24px; box-shadow:var(--vs-sombra); border-top:6px solid var(--vs-rojo); }
.vs-perfil__foto{ width:150px; height:150px; margin:0 auto 16px; border-radius:50%; overflow:hidden; border:5px solid var(--vs-amarillo); box-shadow:var(--vs-sombra); background:#fff; }
.vs-perfil__foto .vs-logo-img{ width:100%; height:100%; object-fit:cover; max-height:none; }
.vs-perfil__nombre{ font-family:var(--vs-fuente); font-size:30px; color:var(--vs-oscuro); margin:6px 0 10px; }
.vs-badge--pro{ background:var(--vs-acento); color:#fff; font-size:13px; }
.vs-perfil__datos{ margin:16px 0 0; display:flex; gap:10px 20px; flex-wrap:wrap; justify-content:center; }
.vs-perfil__dato{ color:var(--vs-gris); font-weight:600; font-size:15px; }
.vs-perfil__acciones{ justify-content:center; margin-top:20px; }
.vs-perfil__redes{ justify-content:center; }
.vs-perfil__ubic{ text-align:center; }
.vs-perfil__ubic p{ color:var(--vs-gris); margin:0 0 14px; }

/* ---- Galería de imágenes de la Vitrina ---- */
.vs-galeria__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; }
.vs-galeria__item{ display:block; border-radius:var(--vs-radio); overflow:hidden; box-shadow:var(--vs-sombra); aspect-ratio:4/3; background:var(--vs-gris-claro); }
.vs-galeria__item img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s; }
.vs-galeria__item:hover img{ transform:scale(1.06); }

/* ---- Mapa incrustado de la Vitrina ---- */
.vs-mapa__dir{ color:var(--vs-gris); margin:0 0 12px; }
.vs-mapa__marco{ border-radius:var(--vs-radio); overflow:hidden; box-shadow:var(--vs-sombra); border:1px solid var(--vs-gris-claro); }
.vs-mapa__marco iframe{ display:block; width:100%; }
.vs-perfil__comollegar{ text-align:center; margin-top:16px; }

/* Aviso bajo el botón de registro con pago y nota del bono */
.vs-pago-aviso{ margin:12px 0 0; color:var(--vs-gris); font-size:14px; }
.vs-bono-nota{ margin:12px 0 0; color:var(--vs-gris); font-size:13px; }

/* ======================================================================= *
 *  VITRINA COMPLETA (plantilla single del establecimiento)
 *  El color --marca lo inyecta la plantilla, tomado del logo del negocio.
 * ======================================================================= */
.vs-viv{--viv-soft:#f6f8f8;--viv-ink:#243230;--viv-muted:#6a7b78;--viv-line:#e6ecea;max-width:940px;margin:0 auto;padding:8px 16px 60px;font-family:var(--vs-fuente);color:var(--viv-ink);line-height:1.65}
.vs-viv *{box-sizing:border-box}
.vs-viv h1,.vs-viv h2{font-family:'Poppins',var(--vs-fuente);line-height:1.15}

.vs-viv-hero{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;padding:44px 22px 40px;border-radius:22px;position:relative;overflow:hidden;background:radial-gradient(120% 90% at 12% 0%, color-mix(in srgb, var(--marca) 22%, transparent), transparent 55%),radial-gradient(120% 95% at 100% 5%, color-mix(in srgb, var(--marca) 15%, transparent), transparent 52%),var(--viv-soft);border:1px solid var(--viv-line)}
.vs-viv-logo{width:128px;height:128px;border-radius:50%;background:#fff;border:5px solid var(--marca);box-shadow:0 14px 34px rgba(0,0,0,.14);display:grid;place-items:center;overflow:hidden}
.vs-viv-logo img{width:100%;height:100%;object-fit:contain;padding:12px;max-height:none}
.vs-viv-chip{font-family:'Poppins',var(--vs-fuente);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--marca-btn);padding:5px 14px;border-radius:999px}
.vs-viv-nombre{font-size:clamp(28px,5vw,42px);font-weight:800;margin:6px 0 0;color:var(--viv-ink)}
.vs-viv-tag{max-width:56ch;color:var(--viv-muted);font-size:17px;margin:0}
.vs-viv-ubic{color:var(--viv-muted);margin:0;font-weight:600}
.vs-viv-cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px}

.vs-viv-btn{display:inline-flex;align-items:center;gap:8px;font-family:'Poppins',var(--vs-fuente);font-weight:700;font-size:16px;text-decoration:none;padding:14px 26px;border-radius:999px;transition:transform .15s,background .15s;cursor:pointer}
.vs-viv-btn:hover{transform:translateY(-2px)}
.vs-viv-btn--marca{background:var(--marca-btn);color:#fff}
.vs-viv-btn--marca:hover{background:var(--marca-osc);color:#fff}
.vs-viv-btn--wa{background:#25D366;color:#fff}
.vs-viv-btn--wa:hover{color:#fff}
.vs-viv-btn--blanco{background:#fff;color:var(--marca-osc)}

.vs-viv-sec{padding:42px 4px}
.vs-viv-eyebrow{font-family:'Poppins',var(--vs-fuente);font-weight:700;font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--marca-btn);margin:0 0 6px}
.vs-viv-titulo{font-size:clamp(22px,3.4vw,30px);font-weight:800;margin:0 0 16px;color:var(--viv-ink)}
.vs-viv-texto{font-size:17px;color:var(--viv-ink)}
.vs-viv-texto p{margin:0 0 12px}

.vs-viv-galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.vs-viv-obra{display:block;aspect-ratio:1;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.10);background:var(--viv-soft)}
.vs-viv-obra img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.vs-viv-obra:hover img{transform:scale(1.06)}

.vs-viv-videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.vs-viv-video{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.10);background:#000}
.vs-viv-video iframe,.vs-viv-video video{position:absolute;inset:0;width:100%;height:100%;border:0}

.vs-viv-faq{display:flex;flex-direction:column;gap:12px}
.vs-viv-faq details{background:#fff;border:1px solid var(--viv-line);border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.06);overflow:hidden}
.vs-viv-faq summary{list-style:none;cursor:pointer;padding:17px 20px;font-family:'Poppins',var(--vs-fuente);font-weight:700;font-size:16px;color:var(--viv-ink);display:flex;justify-content:space-between;align-items:center;gap:12px}
.vs-viv-faq summary::-webkit-details-marker{display:none}
.vs-viv-faq summary::after{content:"+";font-size:24px;color:var(--marca-btn);line-height:1;transition:transform .2s}
.vs-viv-faq details[open] summary::after{transform:rotate(45deg)}
.vs-viv-faq details p{margin:0;padding:0 20px 18px;color:var(--viv-muted);font-size:15.5px}

/* Horario de atención */
.vs-viv-horario{list-style:none;margin:0 auto;padding:0;max-width:440px}
.vs-viv-horario li{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 6px;border-bottom:1px dashed var(--viv-line)}
.vs-viv-horario li:last-child{border-bottom:none}
.vs-viv-hdia{font-weight:700;color:var(--viv-ink)}
.vs-viv-hval{color:var(--viv-muted);text-align:right}
.vs-viv-pagos{margin:16px 0 0;text-align:center;color:var(--viv-ink);font-size:15.5px}

.vs-viv-contacto{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.vs-viv-card{display:flex;gap:13px;align-items:center;background:#fff;border:1px solid var(--viv-line);border-radius:14px;padding:18px;box-shadow:0 6px 18px rgba(0,0,0,.06);text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s}
.vs-viv-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,.12)}
.vs-viv-ico{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;font-size:20px;flex:0 0 auto}
.vs-viv-card small{display:block;color:var(--viv-muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.vs-viv-card b{font-family:'Poppins',var(--vs-fuente);font-size:15px;word-break:break-word}

.vs-viv-redes{display:flex;gap:13px;flex-wrap:wrap}
.vs-viv-red{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;background:#fff;border:1px solid var(--viv-line);box-shadow:0 6px 16px rgba(0,0,0,.07);transition:transform .15s}
.vs-viv-red:hover{transform:translateY(-3px)}
.vs-viv-red svg{width:26px;height:26px}

.vs-viv-dir{color:var(--viv-muted);margin:0 0 14px}
.vs-viv-mapa{border-radius:16px;overflow:hidden;border:1px solid var(--viv-line);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.vs-viv-mapa iframe{display:block;width:100%}

.vs-viv-final{margin-top:18px;text-align:center;border-radius:22px;padding:40px 22px;background:linear-gradient(135deg,var(--marca-btn),var(--marca-osc));color:#fff}
.vs-viv-final h2{color:#fff;font-size:clamp(22px,3.6vw,30px);font-weight:800;margin:0 0 18px}

.vs-viv-pie{margin-top:34px;text-align:center}
.vs-viv-volver{color:var(--marca-btn);text-decoration:none;font-weight:700}

@media (max-width:600px){
  .vs-viv-hero{padding:34px 16px 32px}
  .vs-viv-sec{padding:32px 2px}
}

/* ======= "Trabaja con nosotros" (reclutar asesores) ======= */
.vs-trabaja-intro{max-width:820px;margin:0 auto 26px;font-family:var(--vs-fuente)}
.vs-trabaja-intro h2{font-family:'Poppins',var(--vs-fuente);font-size:clamp(23px,4vw,32px);font-weight:800;color:var(--vs-oscuro);margin:0 0 10px;text-wrap:balance}
.vs-trabaja-intro > p{color:var(--vs-gris);font-size:17px;margin:0}
.vs-trabaja-intro h3{font-family:'Poppins',var(--vs-fuente);font-weight:800;font-size:20px;margin:24px 0 8px;color:var(--vs-oscuro)}
.vs-trabaja-benes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:20px 0}
.vs-trabaja-bene{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--vs-gris-claro);border-left:5px solid var(--vs-amarillo);border-radius:12px;padding:16px;box-shadow:var(--vs-sombra)}
.vs-trabaja-bene span{font-size:26px;line-height:1;flex:0 0 auto}
.vs-trabaja-bene strong{color:var(--vs-oscuro)}
.vs-trabaja-pasos{color:var(--vs-oscuro);font-size:16px;line-height:1.7;padding-left:22px;margin:0}
.vs-trabaja-pasos li{margin:4px 0}
