/*
 Theme Name:   Kava Child
 Theme URI:    https://crocoblock.com/kava/
 Description:  Kava Child Theme
 Author:       CORNQ
 Author URI:   http://cornq.com
 Template:     kava
 Version:      1.0.0
*/

/* Import Kava parent theme styles */
@import url("../kava/style.css");

/* Add your custom styles below */
/* ========================================
   VALTECH DESIGN SYSTEM
   CSS global para Kava Child / style.css
   Mantiene compatibilidad con clases existentes
   y añade utilidades visuales reutilizables.
======================================== */


/* ========================================
   VARIABLES GLOBALES
======================================== */

:root{
	--vt-bg:#07080d;
	--vt-bg2:#0b0d14;
	--vt-panel:#10131c;
	--vt-card:#121620;
	--vt-text:#f7f8fb;
	--vt-muted:#a8afbd;
	--vt-line:rgba(255,255,255,.11);
	--vt-accent:#86a8ff;
	--vt-accent2:#91f3d1;
	--vt-white:#fff;
	--vt-dark:#090b10;
}


/* ========================================
   FONDOS
   Compatibilidad:
   vt-section / vt-section--*
   Utilidades nuevas:
   vt-bg-*
======================================== */

.vt-section,
.vt-bg-dark{
	background:var(--vt-bg);
}

.vt-section--alt,
.vt-bg-dark-alt{
	background:var(--vt-bg2);
}

.vt-section--light,
.vt-bg-light{
	background:#f3f5f9;
}

.vt-section--cta,
.vt-bg-cta{
	background:
		linear-gradient(
			135deg,
			#101523 0%,
			#080a10 55%,
			#101726 100%
		);
}


/* ========================================
   HERO / FONDO CON CUADRÍCULA
   Compatibilidad:
   vt-hero
   Utilidad nueva:
   vt-hero-bg
======================================== */

.vt-hero,
.vt-hero-bg{
	position:relative;
	isolation:isolate;
	overflow:hidden;
	background:
		radial-gradient(
			circle at 75% 25%,
			rgba(100,137,255,.22),
			transparent 28%
		),
		radial-gradient(
			circle at 22% 88%,
			rgba(83,226,186,.12),
			transparent 24%
		),
		#07080d;
}

.vt-hero:before,
.vt-hero-bg:before{
	content:"";
	position:absolute;
	inset:0;
	z-index:-1;
	pointer-events:none;
	opacity:.32;
	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:48px 48px;
	mask-image:linear-gradient(to bottom,black,transparent 88%);
	-webkit-mask-image:linear-gradient(to bottom,black,transparent 88%);
}


/* ========================================
   GLASS / BLUR
======================================== */

.vt-blur{
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.12);
	backdrop-filter:blur(18px);
	-webkit-backdrop-filter:blur(18px);
}

.vt-glass{
	background:
		linear-gradient(
			180deg,
			rgba(255,255,255,.08),
			rgba(255,255,255,.035)
		);
	border:1px solid rgba(255,255,255,.12);
	box-shadow:0 20px 60px rgba(0,0,0,.18);
	backdrop-filter:blur(20px) saturate(140%);
	-webkit-backdrop-filter:blur(20px) saturate(140%);
}

.vt-blur-bg{
	position:relative;
	isolation:isolate;
	overflow:hidden;
}

.vt-blur-bg:before{
	content:"";
	position:absolute;
	inset:-40px;
	z-index:-1;
	pointer-events:none;
	background:
		radial-gradient(
			circle at 25% 30%,
			rgba(90,120,255,.35),
			transparent 35%
		),
		radial-gradient(
			circle at 75% 70%,
			rgba(70,220,180,.25),
			transparent 35%
		);
	filter:blur(55px);
	transform:scale(1.1);
}


/* ========================================
   TARJETAS
======================================== */

.vt-card{
	position:relative;
	isolation:isolate;
	border:1px solid var(--vt-line);
	border-radius:1.45rem;
	background:
		linear-gradient(
			180deg,
			rgba(255,255,255,.055),
			rgba(255,255,255,.025)
		);
	overflow:hidden;
	transition:
		transform .28s ease,
		border-color .28s ease,
		background .28s ease;
}

.vt-card:after{
	content:"";
	position:absolute;
	width:180px;
	height:180px;
	right:-80px;
	bottom:-90px;
	z-index:-1;
	border-radius:50%;
	pointer-events:none;
	background:
		radial-gradient(
			circle,
			rgba(121,153,255,.24),
			transparent 68%
		);
	transition:transform .35s ease;
}

.vt-card:hover{
	transform:translateY(-6px);
	border-color:rgba(255,255,255,.23);
	background:
		linear-gradient(
			180deg,
			rgba(255,255,255,.075),
			rgba(255,255,255,.035)
		);
}

.vt-card:hover:after{
	transform:scale(1.2);
}

.vt-card-light,
.vt-section--light .vt-solution,
.vt-bg-light .vt-solution{
	background:#fff;
	border:1px solid rgba(10,12,17,.08);
	box-shadow:0 18px 55px rgba(18,30,62,.06);
	transition:
		transform .28s ease,
		border-color .28s ease,
		box-shadow .28s ease;
}

.vt-card-light:hover,
.vt-section--light .vt-solution:hover,
.vt-bg-light .vt-solution:hover{
	transform:translateY(-6px);
	border-color:rgba(28,61,146,.2);
	box-shadow:0 22px 65px rgba(18,30,62,.1);
}


/* ========================================
   CTA GLASS
   Compatibilidad:
   vt-cta-box
======================================== */

.vt-cta-box{
	border:1px solid rgba(255,255,255,.12);
	border-radius:2rem;
	background:rgba(255,255,255,.045);
	box-shadow:0 20px 70px rgba(0,0,0,.12);
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
}


/* ========================================
   BORDES
======================================== */

.vt-border{
	border:1px solid var(--vt-line);
}

.vt-border-top,
.vt-pillar,
.vt-process,
.vt-footer-mini{
	border-top:1px solid var(--vt-line);
}

.vt-border-bottom{
	border-bottom:1px solid var(--vt-line);
}

.vt-border-soft{
	border:1px solid rgba(255,255,255,.07);
}

.vt-border-strong{
	border:1px solid rgba(255,255,255,.20);
}

.vt-gradient-border{
	border:1px solid transparent;
	background:
		linear-gradient(var(--vt-bg),var(--vt-bg)) padding-box,
		linear-gradient(
			135deg,
			rgba(134,168,255,.65),
			rgba(145,243,209,.35),
			rgba(255,255,255,.08)
		) border-box;
}


/* ========================================
   GLOWS
======================================== */

.vt-glow{
	box-shadow:
		0 0 40px rgba(100,137,255,.10),
		0 20px 60px rgba(0,0,0,.16);
}

.vt-glow-blue{
	box-shadow:
		0 0 60px rgba(100,137,255,.18),
		0 20px 60px rgba(0,0,0,.18);
}

.vt-glow-green{
	box-shadow:
		0 0 60px rgba(83,226,186,.14),
		0 20px 60px rgba(0,0,0,.18);
}


/* ========================================
   HOVER EFFECTS
======================================== */

.vt-hover-lift{
	transition:transform .25s ease;
}

.vt-hover-lift:hover{
	transform:translateY(-6px);
}

.vt-hover-scale{
	transition:transform .25s ease;
}

.vt-hover-scale:hover{
	transform:scale(1.025);
}

.vt-hover-border{
	transition:border-color .25s ease;
}

.vt-hover-border:hover{
	border-color:rgba(255,255,255,.25);
}

.vt-hover-bright{
	transition:filter .25s ease;
}

.vt-hover-bright:hover{
	filter:brightness(1.08);
}


/* ========================================
   BOTONES ELEMENTOR
======================================== */

.vt-btn-primary .elementor-button{
	background:#fff;
	color:#090b10;
	border-radius:999px;
	transition:
		transform .22s ease,
		background .22s ease;
}

.vt-btn-primary .elementor-button:hover{
	transform:translateY(-2px);
	background:#dfe6ff;
}

.vt-btn-secondary .elementor-button{
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.14);
	color:#fff;
	border-radius:999px;
	transition:
		transform .22s ease,
		background .22s ease,
		border-color .22s ease;
}

.vt-btn-secondary .elementor-button:hover{
	transform:translateY(-2px);
	background:rgba(255,255,255,.10);
	border-color:rgba(255,255,255,.28);
}


/* ========================================
   EFECTOS ESPECIALES
======================================== */

.vt-soft-overlay{
	position:relative;
	isolation:isolate;
	overflow:hidden;
}

.vt-soft-overlay:before{
	content:"";
	position:absolute;
	inset:0;
	z-index:-1;
	pointer-events:none;
	background:
		linear-gradient(
			180deg,
			rgba(255,255,255,.04),
			transparent 45%,
			rgba(0,0,0,.08)
		);
}

.vt-noise{
	position:relative;
	isolation:isolate;
	overflow:hidden;
}

.vt-noise:after{
	content:"";
	position:absolute;
	inset:0;
	z-index:-1;
	pointer-events:none;
	opacity:.035;
	background-image:
		url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
}


/* ========================================
   CLASE DE PRUEBA
   Úsala temporalmente para confirmar que
   Elementor está leyendo el style.css.
======================================== */

.vt-test{
	background:#d40000!important;
	border:5px solid #ffd400!important;
}
