*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --navy: #0a2540;
  --body: #425466;
  --muted: #6b7c93;
  --light: #8898aa;
  --border: #e6ebf1;
  --bg: #f6f9fc;
  --white: #ffffff;
  --purple: #635bff;
  --purple2: #7c3aed;
  --purple-light: #eeeeff;
}
html { scroll-behavior: smooth; }
body { font-family: Verdana, Geneva, Tahoma, sans-serif; background: var(--white); color: var(--body); -webkit-font-smoothing: antialiased; line-height: 1.6; }
h1,h2,h3,h4,h5 { font-family: Verdana, Geneva, Tahoma, sans-serif; color: var(--navy); line-height: 1.2; }
a { text-decoration: none; }
img { display: block; max-width: 100%; }

@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes floatX { 0%,100%{transform:translateX(0) translateY(0)} 50%{transform:translateX(18px) translateY(-14px)} }
@keyframes floatY { 0%,100%{transform:translateX(0) translateY(0)} 50%{transform:translateX(-14px) translateY(20px)} }
.fade-up { animation: fadeUp .6s ease both; }
.d1{animation-delay:.1s} .d2{animation-delay:.24s} .d3{animation-delay:.38s}

/* BUTTONS */
.btn-p { display:inline-flex;align-items:center;gap:.5rem;background:var(--purple);color:#fff;border:none;padding:.8rem 1.75rem;border-radius:6px;font-family:Verdana,sans-serif;font-size:.8rem;font-weight:700;cursor:pointer;transition:all .22s; text-decoration:none; }
.btn-p:hover { background:#5851ea;transform:translateY(-2px);box-shadow:0 8px 28px rgba(99,91,255,.35); color:#fff; }
.btn-o { display:inline-flex;align-items:center;gap:.5rem;background:transparent;color:var(--navy);border:1.5px solid var(--border);padding:.8rem 1.75rem;border-radius:6px;font-family:Verdana,sans-serif;font-size:.8rem;font-weight:700;cursor:pointer;transition:all .22s; text-decoration:none; }
.btn-o:hover { border-color:#aab7c4;background:var(--bg);transform:translateY(-2px); }
.btn-ghost { display:inline-flex;align-items:center;gap:.4rem;background:none;border:none;color:var(--purple);font-family:Verdana,sans-serif;font-size:.8rem;font-weight:700;cursor:pointer;padding:.3rem 0;transition:gap .2s; text-decoration:none; }
.btn-ghost:hover { gap:.65rem; }

/* UTILITIES */
.chip { display:inline-block;padding:.3rem .9rem;border-radius:4px;background:var(--purple-light);color:var(--purple2);font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase; }
.gt { background:linear-gradient(135deg,#635bff 0%,#7795f8 50%,#4da3ff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.card { background:var(--white);border:1.5px solid var(--border);border-radius:12px;padding:1.75rem;transition:all .28s; }
.card:hover { border-color:#c4c9ff;box-shadow:0 12px 40px rgba(99,91,255,.12);transform:translateY(-4px); }
.divider { height:1px;background:var(--border); }
.sec { padding:5.5rem 1.5rem; }
.cont { max-width:1140px;margin:0 auto; }
.grid3 { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem; }
.grid4 { display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem; }
.g2col { display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:4rem;align-items:center; }

/* NAV */
.nav { position:fixed;top:0;left:0;right:0;z-index:999;padding:.9rem 2rem;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.93);backdrop-filter:blur(20px);border-bottom:1px solid var(--border); }
.nav-logo { display:flex;align-items:center;gap:.6rem;text-decoration:none;background:transparent;border:none;padding:0; }
.nav-logo-img { height: 38px; width: auto; display: block; background: transparent; }
.footer-logo-img { height: 38px; width: auto; display: block; margin-bottom: .75rem; background: #fff; padding: 6px 10px; border-radius: 8px; }

.nav-links { display:flex;align-items:center;gap:2rem; }
.nav-link { color:var(--body);font-size:.8rem;font-weight:400;cursor:pointer;transition:color .2s; text-decoration:none; }
.nav-link:hover, .nav-link.active { color:var(--purple);font-weight:700; }
.nav-actions { display:flex;align-items:center;gap:.75rem; }
.btn-clientes { display:inline-flex;align-items:center;gap:.4rem;background:transparent;color:var(--navy);border:1.5px solid var(--border);padding:.65rem 1.2rem;border-radius:6px;font-family:Verdana,sans-serif;font-size:.78rem;font-weight:700;cursor:pointer;text-decoration:none;transition:all .22s; }
.btn-clientes:hover { border-color:#aab7c4;background:var(--bg); color:var(--navy); }

/* DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { color:var(--body);font-size:.8rem;cursor:pointer;transition:color .2s;display:flex;align-items:center;gap:.3rem;padding:.2rem 0; background:none;border:none;font-family:Verdana,sans-serif; }
.nav-dropdown-trigger:hover { color:var(--purple); }
.nav-dropdown-panel { display:none;position:absolute;top:100%;left:0;padding-top:.5rem;z-index:300;min-width:220px; }
.nav-dropdown-panel-inner { background:#fff;border:1.5px solid var(--border);border-radius:10px;padding:.4rem;box-shadow:0 16px 48px rgba(10,37,64,.12); }
.nav-dropdown:hover .nav-dropdown-panel,
.nav-dropdown-panel:hover { display:block; }
.nav-dropdown-item { padding:.65rem .9rem;border-radius:6px;color:var(--body);cursor:pointer;font-size:.78rem;display:flex;align-items:center;gap:.6rem;transition:all .15s; text-decoration:none; }
.nav-dropdown-item:hover { background:var(--bg);color:var(--purple); }

/* HERO MESH */
.hero-mesh { position:absolute;inset:0;overflow:hidden;pointer-events:none; }
.blob { position:absolute;border-radius:50%;filter:blur(72px);opacity:.25; }
.b1 { width:560px;height:560px;background:radial-gradient(circle,#7c5cfc,transparent 70%);top:-200px;left:-100px;animation:floatX 9s ease-in-out infinite; }
.b2 { width:440px;height:440px;background:radial-gradient(circle,#4da3ff,transparent 70%);top:-100px;right:3%;animation:floatY 11s ease-in-out infinite; }
.b3 { width:380px;height:380px;background:radial-gradient(circle,#ff80ab,transparent 70%);bottom:-80px;left:28%;animation:floatX 13s ease-in-out infinite reverse; }
.b4 { width:320px;height:320px;background:radial-gradient(circle,#11efe3,transparent 70%);bottom:-50px;right:8%;animation:floatY 10s ease-in-out infinite reverse; }

/* FOOTER */
footer { background:var(--navy);padding:4rem 1.5rem 2rem; }
.footer-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:2.5rem;margin-bottom:3rem; }
.footer-heading { color:#fff;font-size:.7rem;font-weight:700;margin-bottom:1rem;text-transform:uppercase;letter-spacing:.06em; }
.footer-link { color:#6b7c93;font-size:.78rem;margin-bottom:.4rem;cursor:pointer;transition:color .15s;display:block;text-decoration:none; }
.footer-link:hover { color:#fff; }
.footer-bottom { height:1px;background:rgba(255,255,255,.08);margin-bottom:1.5rem; }
.footer-copy { display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem; }
.footer-copy p { color:#425466;font-size:.72rem; }

/* STATS */
.stats-bar { background:#fff;padding:2rem 1.5rem;border-bottom:1px solid var(--border); }
.stats-bar .grid4 > div { text-align:center;padding:1rem; }
.stat-num { font-size:2rem;font-weight:700;background:linear-gradient(135deg,#635bff,#4da3ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.3rem; }
.stat-lbl { color:var(--muted);font-size:.72rem; }

/* CLIENTS */
.clients-bar { background:var(--bg);padding:1.75rem 1.5rem;border-bottom:1px solid var(--border); }
.clients-bar p { text-align:center;color:var(--light);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1.4rem; }
.clients-list { display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem 2.5rem;align-items:center; }
.clients-list span { color:#aab7c4;font-weight:700;font-size:.82rem; }

/* TESTIMONIALS */
.testi-card { background:var(--bg);border:1.5px solid var(--border);border-radius:12px;padding:1.75rem; }
.stars { color:#f59e0b;font-size:.82rem;margin-bottom:1rem; }
.testi-quote { color:var(--body);line-height:1.85;margin-bottom:1.4rem;font-size:.8rem; }
.testi-footer { border-top:1px solid var(--border);padding-top:1rem; }
.testi-name { color:var(--navy);font-weight:700;font-size:.82rem; }
.testi-role { color:var(--muted);font-size:.72rem; }

/* CTA BANNER */
.cta-banner { background:linear-gradient(135deg,#0a2540 0%,#1a3a6c 100%);border-radius:20px;padding:4.5rem 2rem;text-align:center;position:relative;overflow:hidden; }
.cta-banner h2 { color:#fff;font-size:clamp(1.8rem,3vw,2.6rem);margin-bottom:1rem;position:relative;z-index:1; }
.cta-banner p { color:#8898aa;margin-bottom:2rem;font-size:.875rem;position:relative;z-index:1; }
.cta-banner .btn-row { display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;position:relative;z-index:1; }
.cta-blob1 { position:absolute;width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,rgba(99,91,255,.4),transparent 70%);top:-120px;right:5%;filter:blur(40px); }
.cta-blob2 { position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(77,163,255,.3),transparent 70%);bottom:-80px;left:8%;filter:blur(40px); }
.btn-banner-o { display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.1);color:#fff;border:1.5px solid rgba(255,255,255,.2);padding:.8rem 1.75rem;border-radius:6px;font-family:Verdana,sans-serif;font-size:.8rem;font-weight:700;cursor:pointer;transition:all .22s;text-decoration:none; }
.btn-banner-o:hover { background:rgba(255,255,255,.18);color:#fff; }

/* PROCESS */
.process-step { display:flex;gap:1.25rem;padding:1.25rem;border-radius:10px;transition:background .2s; }
.process-step:hover { background:#f0f4ff; }
.step-num { min-width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#635bff,#7795f8);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.82rem;color:white;flex-shrink:0; }
.step-title { font-size:.85rem;font-weight:700;margin-bottom:.28rem;color:var(--navy); }
.step-desc { color:var(--body);font-size:.78rem;line-height:1.75; }

/* PLAN CARDS */
.plans-row { display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem; }
.plan-card { padding:1rem 1.5rem;border-radius:10px;border:1.5px solid var(--border);background:var(--bg);text-align:center;min-width:165px;cursor:default;transition:all .22s; }
.plan-card.popular { border-color:var(--purple);background:rgba(99,91,255,.055); }
.plan-card .popular-badge { font-size:.65rem;color:var(--purple2);margin-bottom:.22rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em; }
.plan-card p { color:var(--navy);font-weight:700;font-size:.82rem; }

/* PORTFOLIO */
.project-card { background:var(--bg);border:1.5px solid var(--border);border-radius:16px;overflow:hidden;display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));transition:all .28s; }
.project-card:hover { box-shadow:0 12px 40px rgba(10,37,64,.08);transform:translateY(-3px); }
.project-card img { width:100%;height:100%;min-height:200px;object-fit:cover; }
.project-info { padding:1.75rem; }
.project-tags { display:flex;gap:.5rem;margin-bottom:.85rem;flex-wrap:wrap; }
.project-tag { padding:.2rem .65rem;border-radius:4px;font-size:.7rem;font-weight:700; }
.project-title { font-size:1rem;font-weight:700;margin-bottom:.6rem;color:var(--navy); }
.project-desc { color:var(--body);font-size:.78rem;line-height:1.8;margin-bottom:1rem; }
.tech-tags { display:flex;flex-wrap:wrap;gap:.4rem; }
.tech-tag { padding:.18rem .6rem;border-radius:4px;background:#fff;border:1px solid var(--border);color:var(--muted);font-size:.7rem;font-weight:700; }

/* FORMS */
.form-card { background:#fff;border:1.5px solid var(--border);border-radius:16px;padding:2.25rem;box-shadow:0 12px 40px rgba(10,37,64,.07); }
label { display:block;color:var(--body);font-size:.75rem;font-weight:700;margin-bottom:.4rem; }
input, textarea, select { background:var(--white);border:1.5px solid var(--border);border-radius:6px;color:var(--navy);padding:.75rem 1rem;width:100%;font-family:Verdana,sans-serif;font-size:.78rem;outline:none;transition:all .2s; }
input:focus, textarea:focus, select:focus { border-color:var(--purple);box-shadow:0 0 0 3px rgba(99,91,255,.12); }
input::placeholder, textarea::placeholder { color:#aab7c4; }
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem; }
.form-group { margin-bottom:1rem; }
.contact-info-card { display:flex;gap:1rem;margin-bottom:1rem;padding:1.1rem;border-radius:10px;background:#fff;border:1.5px solid var(--border);transition:all .22s; }
.contact-info-card:hover { border-color:var(--purple);box-shadow:0 6px 20px rgba(99,91,255,.1); }
.ci-label { color:var(--muted);font-size:.7rem;margin-bottom:.1rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700; }
.ci-val { color:var(--navy);font-weight:700;font-size:.85rem;margin-bottom:.08rem; }
.ci-sub { color:var(--muted);font-size:.72rem; }
.btn-wa { display:flex;align-items:center;justify-content:center;gap:.65rem;background:#25d366;color:white;border-radius:10px;padding:.95rem;text-decoration:none;font-weight:700;font-size:.8rem;font-family:Verdana,sans-serif;margin-top:1.25rem;transition:all .22s; }
.btn-wa:hover { transform:translateY(-2px);box-shadow:0 8px 24px rgba(37,211,102,.3);color:white; }

/* WA FLOAT */
.wa-float { position:fixed;bottom:1.75rem;right:1.75rem;z-index:1000;width:52px;height:52px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(37,211,102,.38);text-decoration:none;transition:transform .2s; }
.wa-float:hover { transform:scale(1.1); }

/* WAVE */
.wave-divider { display:block;width:100%;margin-bottom:-2px;position:absolute;bottom:0;left:0; }

/* WAVE ANIMATION (Three.js) */
#wave-animation { position:absolute;bottom:-8%;left:-4%;right:-4%;height:72%;pointer-events:none;z-index:0; }
#wave-animation canvas { display:block;width:100% !important;height:100% !important; }

/* HERO SECTIONS */
.hero-light { min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden;background:linear-gradient(160deg,#f0f4ff 0%,#fafbff 45%,#f6f9fc 100%); }
.hero-light-inner { padding:8rem 1.5rem 6rem;position:relative;z-index:1;text-align:center;width:100%;display:flex;flex-direction:column;align-items:center; }

/* HERO VIDEO */
.hero-video { min-height:100vh;display:flex;align-items:center;position:relative;overflow:hidden; }
.hero-video__bg { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0; }
.hero-video__overlay { position:absolute;inset:0;background:linear-gradient(160deg,rgba(10,37,64,.72) 0%,rgba(10,37,64,.55) 50%,rgba(30,60,110,.65) 100%);z-index:1; }
.hero-video__inner { padding:8rem 1.5rem 6rem;position:relative;z-index:2;width:100%;display:flex;flex-direction:column;align-items:center; }
.chip--light { background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.25); }
.btn-o--light { color:#fff;border-color:rgba(255,255,255,.35); }
.btn-o--light:hover { background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.6); }
.page-hero { min-height:62vh;display:flex;align-items:center;position:relative;overflow:hidden;background:linear-gradient(160deg,#f0f4ff,#fafbff);padding-top:7rem; }
.page-hero-inner { padding:2rem 1.5rem 5rem;position:relative;z-index:1;width:100%; }
.page-hero-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:3rem;align-items:center; }
.page-hero img { width:100%;height:330px;object-fit:cover;border-radius:16px;border:1.5px solid var(--border);box-shadow:0 24px 60px rgba(10,37,64,.12); }
.page-hero h1 { font-size:clamp(1.9rem,4.5vw,3.2rem);font-weight:700;margin-bottom:1.25rem; }
.page-hero p { font-size:.9rem;color:var(--body);line-height:1.9;margin-bottom:2rem; }

/* TEAM */
.team-img { width:72px;height:72px;border-radius:50%;object-fit:cover;margin:0 auto 1rem;border:3px solid #e6ebf1;display:block; }

/* SUCCESS MSG */
.success-msg { text-align:center;padding:2.5rem 0; }
.success-icon { font-size:3rem;margin-bottom:1rem; }

/* RELATED */
.related-row { display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center; }

/* HAMBURGER */
.nav-burger { display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:.4rem;width:36px;height:36px; }
.nav-burger span { display:block;height:2px;border-radius:2px;background:var(--navy);transition:all .25s; }
.nav-burger--open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-burger--open span:nth-child(2) { opacity:0; }
.nav-burger--open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* MOBILE MENU */
.nav-mobile { display:none;position:fixed;top:61px;left:0;right:0;bottom:0;background:#fff;z-index:998;overflow-y:auto;padding:1rem 1.5rem 2rem;flex-direction:column;border-top:1px solid var(--border); }
.nav-mobile--open { display:flex; }
.nav-mobile-link { padding:.85rem 0;font-size:.9rem;font-weight:600;color:var(--navy);border-bottom:1px solid var(--border);text-decoration:none;transition:color .15s; }
.nav-mobile-link:hover, .nav-mobile-link.active { color:var(--purple); }
.nav-mobile-link--sub { padding-left:1rem;font-weight:400;color:var(--body);font-size:.85rem; }
.nav-mobile-section { padding:.85rem 0 .4rem;font-size:.7rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em; }
.nav-mobile-footer { display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem; }

@media(max-width:768px) {
  .nav-links, .nav-actions { display:none; }
  .nav-burger { display:flex; }
  .sec { padding:3.5rem 1rem; }
  .g2col { gap:2rem; }
  .form-row { grid-template-columns:1fr; }
  .page-hero-grid { grid-template-columns:1fr; }
}
