/* :::::::::::::::::: RESET :::::::::::::::::: */
* {margin:0; padding:0; box-sizing:border-box; font-family:Arial, sans-serif;}

/* :::::::::::::::::: COLORES BASE :::::::::::::::::: */
:root {
--bg-main:#0b0f1a;
--bg-secondary:#111827;
--card:#1f2937;
--border:#2d3748;
--text:#e5e7eb;
--text-soft:#9ca3af;
--primary:#2bb3ff;
--accent:#ff3b3b;
}

/* :::::::::::::::::: BODY :::::::::::::::::: */
body {background:radial-gradient(circle at top,#1a2a4f,#0b0f1a); color:var(--text); overflow-x:hidden;}

/* :::::::::::::::::: CONTENEDOR :::::::::::::::::: */
.container {width:90%; max-width:1200px; margin:auto;}

/* :::::::::::::::::: HEADER :::::::::::::::::: */
.header {position:fixed; top:0; left:0; width:100%; z-index:1000; /* background:rgba(74, 78, 83, 0.64); */ backdrop-filter:blur(8px);}
/* .header {position:fixed; top:0; left:0; width:100%; z-index:1000; background:rgba(5,7,13,0.85); backdrop-filter:blur(8px);} */

.header-container {width:90%; max-width:1200px; margin:auto; display:flex; align-items:center; justify-content:space-between; padding:12px 0;}
.logo img {height:110px;padding-top:30px}
.header-cta {background:linear-gradient(90deg,var(--accent),#ff0000); padding:10px 18px; border-radius:6px; color:#fff; text-decoration:none; font-weight:bold; font-size:14px;}
.spacer {height:70px;}

/* :::::::::::::::::: HERO :::::::::::::::::: */
.hero {min-height:100vh; display:flex; align-items:center; background:radial-gradient(circle at top,#1a2a4f,#000); padding:40px 0;}
.hero-content {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.hero-text {max-width:600px;}
.hero-text h1 {font-size:48px; line-height:1.2; margin-bottom:20px;}
.hero-text p {margin:20px 0; font-size:18px; color:var(--text-soft);}

/* :::::::::::::::::: LISTA :::::::::::::::::: */
/* .lista {margin:20px 0;}
.lista li {margin:10px 0; font-size:18px; list-style:none;}
.lista li::before {content:"✔"; color:var(--accent); margin-right:10px;} */

/* :::::::::::::::::: BOTONES :::::::::::::::::: */
.btn {display:inline-block; background:linear-gradient(90deg,var(--accent),#ff0000); padding:14px 28px; border-radius:8px; text-decoration:none; color:#fff; font-weight:bold; font-size:16px; margin-top:20px; transition:0.3s;}
.btn:hover {transform:scale(1.05); box-shadow:0 0 15px rgba(255,59,59,0.5);}

/* :::::::::::::::::: SECCIONES :::::::::::::::::: */
.seccion {padding:80px 0; text-align:center; border-top:1px solid rgba(255,255,255,0.05);}
.seccion h2 {font-size:32px; margin-bottom:20px;}
.seccion p {color:var(--text-soft); max-width:700px; margin:auto;}

/* :::::::::::::::::: GRID :::::::::::::::::: */
.grid {display:flex; flex-wrap:wrap; gap:20px; margin-top:40px; justify-content:center;}








/* :::::::::::::::::: CARDS :::::::::::::::::: */
.card {flex:1; background:var(--card); padding:25px; border-radius:14px; min-width:250px; max-width:700px; border:1px solid var(--border); box-shadow:0 10px 30px rgba(0,0,0,0.3); transition:0.3s;}
.card:hover {transform:translateY(-6px); border-color:var(--primary);}
.card h3 {color:var(--text); margin-bottom:10px;}
.card p {margin:15px auto 0 auto; color:var(--text-soft); font-size:14px; width:90%;}

/* :::::::::::::::::: PRICING :::::::::::::::::: */
.pricing {display:flex; flex-wrap:wrap; gap:20px; margin-top:40px; justify-content:center;}
.plan{flex:1;background:var(--card);padding:30px;border-radius:16px;min-width:250px;max-width:280px;text-align:center;border:1px solid var(--border);transition:0.3s;position:relative;display:flex;flex-direction:column;}

/* .plan {flex:1; background:var(--card); padding:30px; border-radius:16px; min-width:250px; max-width:280px; text-align:center; border:1px solid var(--border); transition:0.3s; position:relative;} */
.plan:hover {transform:translateY(-8px);}
.plan h3 {font-size:22px; margin-bottom:10px; color:var(--text);}
.plan .precio {font-size:22px; color:var(--primary); margin:15px 0; font-weight:bold;}
.plan ul {list-style:none; margin:20px 0;}
.plan ul li {margin:10px 0; color:var(--text-soft);}
.plan ul li::before {content:"✔"; color:var(--accent); margin-right:8px;}
.plan .btn {width:100%;}

/* :::::::::::::::::: PLAN DESTACADO :::::::::::::::::: */
.plan.destacado {border:2px solid var(--accent); box-shadow:0 0 25px rgba(255,59,59,0.3);}
.plan.destacado::before {content:"MÁS ELEGIDO"; position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:var(--accent); padding:6px 16px; font-size:12px; border-radius:20px; color:#fff;}

/* :::::::::::::::::: FORM :::::::::::::::::: */
.form {max-width:400px; margin:40px auto;}
.form input {width:100%; padding:15px; margin:10px 0; border:1px solid var(--border); border-radius:6px; background:#0b0f1a; color:#fff;}
.form button {width:100%;}

/* :::::::::::::::::: FOOTER :::::::::::::::::: */
.footer {padding:40px 0; text-align:center; background:#05070d; font-size:14px; color:#888;}

/* :::::::::::::::::: RESPONSIVE :::::::::::::::::: */
@media(max-width:768px){
.hero-text h1 {font-size:32px;}
.hero-content {flex-direction:column; text-align:center;}
.plan.destacado {transform:none;}
}

/* :::::::::::::::::: HERO FULL :::::::::::::::::: */
.hero-full {position:relative; min-height:100vh; background:url('https://www.wolftur.com.ar/img/hero-wolftur.png') no-repeat center center/cover; display:flex; align-items:center;}

/* :::::::::::::::::: OVERLAY :::::::::::::::::: */
.overlay {position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(90deg, rgba(11,15,26,0.95) 30%, rgba(11,15,26,0.6) 60%, rgba(11,15,26,0.2) 100%);}

/* :::::::::::::::::: CONTENIDO :::::::::::::::::: */
.hero-content {position:relative; z-index:2; width:90%; max-width:1200px; margin:auto;}

/* :::::::::::::::::: TEXTO :::::::::::::::::: */
.hero-text {max-width:600px;}
.hero-text h1 {font-size:48px; line-height:1.2; margin-bottom:20px;}
.hero-text p {margin:20px 0; font-size:18px; color:#ccc;}

/* :::::::::::::::::: COLORES :::::::::::::::::: */
.azul {color:#2bb3ff;}
.rojo {color:#ff3b3b;}

/* :::::::::::::::::: LISTA :::::::::::::::::: */
.lista {margin:25px 0;}
.lista li {margin:12px 0; font-size:18px; list-style:none; color:var(--text);}
.lista li::before {content:"✔"; color:#ff3b3b; margin-right:10px;}

/* :::::::::::::::::: MOCKUP HERO :::::::::::::::::: */
.mockup-flyer {background:linear-gradient(135deg,#111827,#1a2a4f); border-radius:16px; padding:40px; max-width:350px; margin:auto; text-align:left; box-shadow:0 25px 60px rgba(0,0,0,0.6); border:1px solid rgba(255,255,255,0.05); position:relative; overflow:hidden; animation:flotar 5s ease-in-out infinite;}
.mockup-flyer::before {content:""; position:absolute; width:200px; height:200px; background:radial-gradient(circle,#2bb3ff55,transparent); top:-50px; right:-50px;}
.mockup-flyer h3 {font-size:22px; color:#2bb3ff; margin-bottom:15px;}
.mockup-flyer p {font-size:18px; color:#e5e7eb; line-height:1.4;}

/* :::::::::::::::::: ANIMACION :::::::::::::::::: */
@keyframes flotar {
0% {transform:translateY(0);}
50% {transform:translateY(-10px);}
100% {transform:translateY(0);}
}

/* :::::::::::::::::: NAV :::::::::::::::::: */
.nav {display:flex; justify-content:center; gap:30px; padding:5px 0; background:rgba(5,7,13,0.85); backdrop-filter:blur(8px); border-bottom:1px solid rgba(255,255,255,0.05); position:fixed; top:0; left:0; width:100%; z-index:1000;}

/* :::::::::::::::::: LINKS :::::::::::::::::: */
.nav a {color:#e5e7eb; text-decoration:none; font-size:16px; font-weight:500; position:relative; padding:5px 0; transition:0.3s;}

/* :::::::::::::::::: HOVER EFECTO LINEA :::::::::::::::::: */
.nav a::after {content:""; position:absolute; left:0; bottom:-5px; width:0%; height:2px; background:linear-gradient(90deg,#2bb3ff,#ff3b3b); transition:0.3s;}
.nav a:hover::after {width:100%;}

/* :::::::::::::::::: HOVER COLOR :::::::::::::::::: */
.nav a:hover {color:#ffffff;}

/* :::::::::::::::::: ACTIVE (OPCIONAL) :::::::::::::::::: */
.nav a.active {color:#2bb3ff;}
.nav a.active::after {width:100%;}

/* :::::::::::::::::: RESPONSIVE :::::::::::::::::: */
@media(max-width:768px){
.nav {gap:15px; padding:10px 0;}
.nav a {font-size:14px;}
}

/* :::::::::::::::::: HEADER CONTAINER :::::::::::::::::: */
.header-container {display:flex; align-items:center; justify-content:space-between;}

/* :::::::::::::::::: NAV CENTRADO :::::::::::::::::: */
.nav {display:flex; gap:30px;}

/* :::::::::::::::::: BLOQUE DERECHO :::::::::::::::::: */
.header-right {display:flex; align-items:center; gap:15px;}

/* :::::::::::::::::: WHATSAPP HEADER :::::::::::::::::: */
.whatsapp-header {display:flex; align-items:center; gap:8px; color:#25D366; text-decoration:none; font-size:14px; font-weight:500; transition:0.3s;}

/* :::::::::::::::::: ICONO :::::::::::::::::: */
.whatsapp-header i {font-size:18px;}

/* :::::::::::::::::: HOVER :::::::::::::::::: */
.whatsapp-header:hover {color:#ffffff;}

/* :::::::::::::::::: RESPONSIVE :::::::::::::::::: */
@media(max-width:768px){
.nav {display:none;} /* opcional si después haces hamburguesa */
.whatsapp-header span {display:none;}
}

/* :::::::::::::::::: PLAN PROMO :::::::::::::::::: */
.plan.promo {position:relative;}

/* :::::::::::::::::: BADGE VERDE :::::::::::::::::: */
.plan.promo::before {content:"30 DÍAS GRATIS";position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#25D366,#1ebe5d);color:#fff;padding:7px 18px;font-size:12px;font-weight:bold;border-radius:20px;box-shadow:0 0 12px rgba(37,211,102,0.5);letter-spacing:0.5px;white-space:nowrap;border:#1ebe5d solid 2px;}

/* :::::::::::::::::: PLAN BASE :::::::::::::::::: */
.plan {border:1px solid rgba(255, 255, 255, 0.185);}

/* :::::::::::::::::: PLAN PROMO BORDE :::::::::::::::::: */
.plan.promo {
border:2px solid #25D366;
box-shadow:0 0 20px rgba(37,211,102,0.25);
}

/* :::::::::::::::::: HOVER :::::::::::::::::: */
.plan.promo:hover {
box-shadow:0 0 30px rgba(37,211,102,0.4);
}

/* :::::::::::::::::: HOVER :::::::::::::::::: */
.plan.promo:hover::before {
filter:brightness(1.1);
}

/* :::::::::::::::::: PLAN SUBTITULO :::::::::::::::::: */
.plan-sub {font-size:13px; color:var(--text-soft); margin-bottom:10px;}


/* :::::::::::::::::: HAMBURGUESA :::::::::::::::::: */
.menu-toggle {display:none; font-size:24px; cursor:pointer; color:#fff;}

/* :::::::::::::::::: MOBILE :::::::::::::::::: */
@media(max-width:768px){

/* oculto menu normal */
.nav {display:none;}

/* oculto numero */
.whatsapp-header span {display:none;}

/* oculto botón grande (opcional) */
.header-cta {display:none;}

/* muestro hamburguesa */
.menu-toggle {display:block;}

}

/* :::::::::::::::::: NAV MOBILE :::::::::::::::::: */
@media(max-width:768px){

.nav {display:none;flex-direction:column;position:absolute;top:100%;left:0;width:100%;background:#0b0f1a;padding:15px 0;gap:10px;text-align:center;border-top:1px solid rgba(255,255,255,0.08);}

/* :::::::::::::::::: ACTIVO :::::::::::::::::: */
.nav.active {
display:flex;
}

/* :::::::::::::::::: LINKS :::::::::::::::::: */
.nav a {
padding:10px 0;
font-size:16px;
}

/* :::::::::::::::::: HOVER :::::::::::::::::: */
.nav a:hover {
background:rgba(255,255,255,0.05);
}

}

.whatsapp-header svg {width:22px; height:22px;}

/* :::::::::::::::::: WHATSAPP WIDGET :::::::::::::::::: */
#wa-widget {position:fixed; bottom:20px; right:20px; z-index:2000;}

/* :::::::::::::::::: BURBUJA :::::::::::::::::: */
#wa-bubble {width:60px; height:60px; background:#25D366; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 5px 15px rgba(0,0,0,0.3);}

#wa-bubble img {width:30px; height:30px;}

/* :::::::::::::::::: MINI CHAT :::::::::::::::::: */
#wa-mini-chat {display:none; position:absolute; bottom:70px; right:0; width:260px; background:#111827; padding:15px; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,0.5); border:1px solid rgba(255,255,255,0.08);}

#wa-mini-chat p {font-size:14px; margin-bottom:10px; color:#e5e7eb;}

#wa-mini-chat textarea {width:100%; height:70px; border:none; border-radius:6px; padding:10px; resize:none; background:#0b0f1a; color:#fff; margin-bottom:10px;}

#wa-mini-chat button {width:100%; padding:10px; border:none; border-radius:6px; background:linear-gradient(90deg,#25D366,#1ebe5d); color:#fff; font-weight:bold; cursor:pointer;}

/* :::::::::::::::::: ACTIVO :::::::::::::::::: */
#wa-widget.active #wa-mini-chat {display:block;}


/* :::::::::::::::::: MOBILE :::::::::::::::::: */
@media(max-width:768px){

#wa-widget {bottom:15px; right:15px;}

#wa-mini-chat {width:220px;}

}

/* :::::::::::::::::: FORM CAMPOS :::::::::::::::::: */
.form input,.form textarea {width:100%;padding:15px;margin:10px 0;border:1px solid var(--border);border-radius:6px;background:#0b0f1a;color:#fff;box-sizing:border-box;}

/* :::::::::::::::::: TEXTAREA :::::::::::::::::: */
.form textarea {resize:none;min-height:120px;}

/* :::::::::::::::::: GRID :::::::::::::::::: */
.testimonios-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:25px;}

/* :::::::::::::::::: CARD TESTIMONIO :::::::::::::::::: */
.testimonio {background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:25px;position:relative;transition:0.3s;display:flex;flex-direction:column;justify-content:space-between;height:100%;}

/* :::::::::::::::::: TEXTO FLEX :::::::::::::::::: */
.testimonio p {flex-grow:1;font-size:16px;line-height:1.4;margin-bottom:15px;color:var(--text);font-style:italic;}

/* :::::::::::::::::: BOTÓN MAS INFO :::::::::::::::::: */
/* .btn-mas-info {background:transparent;border:1px solid #1e88e5;color:#1e88e5;padding:10px 14px;font-size:13px;font-weight:600;letter-spacing:0.3px;cursor:pointer;transition:all .2s ease;width:100%;text-align:center;margin-top:12px;box-sizing:border-box;} */

.btn-mas-info{background:transparent;border:1px solid #1e88e5;color:#1e88e5;padding:10px 14px;font-size:13px;font-weight:600;letter-spacing:0.3px;cursor:pointer;transition:all .2s ease;width:100%;text-align:center;margin-top:auto;box-sizing:border-box;}


/* :::::::::::::::::: BOTÓN HOVER :::::::::::::::::: */
.btn-mas-info:hover {background:#1e88e5;color:#fff;}

/* :::::::::::::::::: BOTÓN ACTIVO :::::::::::::::::: */
.btn-mas-info.active {background:#1565c0;border-color:#1565c0;color:#fff;}

/* :::::::::::::::::: MODAL OVERLAY :::::::::::::::::: */
.modal-plan {position:fixed;inset:0;display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:9999;background:rgba(255,255,255,0.06);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);}

/* :::::::::::::::::: MODAL ACTIVO :::::::::::::::::: */
.modal-plan.active {opacity:1;pointer-events:auto;}

/* :::::::::::::::::: MODAL CONTENT :::::::::::::::::: */
.modal-content {width:100%;max-width:700px;background:#2d3748;color:#fff;border-radius:16px;padding:20px;transform:translateY(20px) scale(0.98);transition:transform .35s ease,opacity .35s ease;box-shadow:0 20px 60px rgba(0,0,0,0.25);}

/* :::::::::::::::::: MODAL ENTRADA :::::::::::::::::: */
.modal-plan.active .modal-content {transform:translateY(0) scale(1);}

/* :::::::::::::::::: MODAL HEADER :::::::::::::::::: */
.modal-header {display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}

/* :::::::::::::::::: MODAL CLOSE :::::::::::::::::: */
.modal-close {background:none;border:none;color:#fff;font-size:18px;cursor:pointer;}

/* :::::::::::::::::: GRID FEATURES :::::::::::::::::: */
.features-grid {display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:15px;}

/* :::::::::::::::::: FEATURE ITEM :::::::::::::::::: */
.feature-item {background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:10px;padding:12px;font-size:14px;line-height:1.4;}

/* :::::::::::::::::: MOBILE :::::::::::::::::: */
@media (max-width:768px){.features-grid {grid-template-columns:1fr;}}