*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg:      #080c12;
  --bg2:     #0b1019;
  --bg3:     #0f1520;
  --surface: #131d2a;
  --cyan:    #3dd9d6;
  --cyan2:   #5ef0e8;
  --teal:    #2bb5b0;
  --blue:    #2d7dd2;
  --blue2:   #4a9eff;
  --green:   #4fffb0;
  --text:    #e8f4f8;
  --text2:   #7a9ab0;
  --text3:   #3a5468;
  --border:  rgba(61,217,214,0.10);
  --border2: rgba(61,217,214,0.20);
  --glow:    rgba(61,217,214,0.12);
  --r:       14px;
  --r2:      20px;
}
html { scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; background: var(--bg); color: var(--text); line-height: 1.6; overflow-x: hidden; }
body::before { content:''; position:fixed; inset:0; pointer-events:none; z-index:998; opacity:.35; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E"); }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:200; padding:18px 52px; display:flex; align-items:center; justify-content:space-between; background:rgba(8,12,18,0.85); backdrop-filter:blur(24px); border-bottom:1px solid var(--border); }
.nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-logo img { height:36px; width:auto; }
.nav-logo-text { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:17px; letter-spacing:.16em; color:var(--text); text-transform:uppercase; line-height:1.05; display:flex; flex-direction:column; }
.nav-logo-text em { font-style:normal; font-weight:500; font-size:9px; letter-spacing:.34em; color:var(--cyan2); }
.nav-links { display:flex; gap:36px; list-style:none; }
.nav-links a { color:var(--text2); text-decoration:none; font-size:14px; transition:color .2s; }
.nav-links a:hover { color:var(--cyan2); }
.nav-cta { background:linear-gradient(135deg,var(--teal),var(--blue)); color:#fff!important; padding:10px 24px; border-radius:100px; font-weight:500!important; font-size:14px!important; box-shadow:0 0 20px rgba(61,217,214,.2); transition:box-shadow .2s,transform .2s!important; }
.nav-cta:hover { box-shadow:0 0 36px rgba(61,217,214,.4); transform:translateY(-1px); }

/* HERO */
.hero { min-height:100vh; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; text-align:left; padding:130px clamp(24px,8vw,96px) 80px; position:relative; overflow:hidden;
  background:var(--bg) url("../assets/portada.jpg") center right/cover no-repeat; }
.hero::before { content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(100deg,var(--bg) 0%,rgba(8,12,18,.94) 32%,rgba(8,12,18,.65) 52%,rgba(8,12,18,.25) 72%,transparent 100%); }
.hero-glow-1 { position:absolute; top:-10%; left:50%; transform:translateX(-50%); width:700px; height:400px; background:radial-gradient(ellipse,rgba(61,217,214,.09) 0%,transparent 65%); pointer-events:none; }
.hero-glow-2 { position:absolute; bottom:10%; right:5%; width:400px; height:300px; background:radial-gradient(ellipse,rgba(74,158,255,.07) 0%,transparent 65%); pointer-events:none; }
.hero-content { position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; }
.hero-logo { margin-bottom:64px; animation:fadeUp .9s ease both; display:flex; flex-direction:column; align-items:center; gap:32px; }
.hero-logo img { height:clamp(300px,44vw,520px); width:auto; filter:drop-shadow(0 0 34px rgba(61,217,214,.5)) drop-shadow(0 0 12px rgba(79,255,176,.3)); }
.hero-logo-tag { font-family:'Space Grotesk',sans-serif; font-weight:500; font-size:clamp(30px,4vw,40px); letter-spacing:.5em; text-transform:uppercase; color:var(--cyan2); padding-left:.5em; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; background:rgba(61,217,214,.07); border:1px solid rgba(61,217,214,.22); border-radius:100px; padding:6px 18px; font-size:13px; color:var(--cyan2); margin-bottom:28px; animation:fadeUp .8s .1s ease both; }
.badge-dot { width:6px; height:6px; background:var(--cyan); border-radius:50%; animation:pulse 2.5s ease-in-out infinite; box-shadow:0 0 8px var(--cyan); }
h1 { font-family:'Chakra Petch',sans-serif; font-size:clamp(28px,4.2vw,52px); font-weight:700; line-height:1.12; letter-spacing:-.01em; max-width:640px; animation:fadeUp .8s .15s ease both; }
h1 .g { background:linear-gradient(135deg,var(--cyan2),var(--blue2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero-sub { font-size:18px; color:var(--text2); max-width:500px; margin:22px 0 0; font-weight:300; line-height:1.75; animation:fadeUp .8s .2s ease both; }
.hero-actions { display:flex; gap:14px; margin-top:44px; flex-wrap:wrap; justify-content:flex-start; animation:fadeUp .8s .28s ease both; }
.btn-primary { background:linear-gradient(135deg,var(--teal),var(--blue)); color:#fff; padding:14px 34px; border-radius:100px; font-weight:600; font-size:15px; text-decoration:none; box-shadow:0 0 32px rgba(61,217,214,.25); transition:transform .2s,box-shadow .2s; }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 0 52px rgba(61,217,214,.45); }
.btn-secondary { background:transparent; color:var(--text); padding:14px 34px; border-radius:100px; font-weight:500; font-size:15px; text-decoration:none; border:1px solid var(--border2); transition:border-color .2s,background .2s; }
.btn-secondary:hover { border-color:rgba(61,217,214,.4); background:rgba(61,217,214,.04); }
.hero-signature { margin-top:28px; font-family:'Space Grotesk',sans-serif; font-size:13px; letter-spacing:.04em; color:var(--text3); animation:fadeUp .8s .34s ease both; }
.scroll-hint { position:absolute; bottom:36px; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:8px; animation:fadeUp .8s .6s ease both; }
.scroll-hint span { font-size:11px; color:var(--text3); letter-spacing:.1em; text-transform:uppercase; }
.scroll-line { width:1px; height:40px; background:linear-gradient(to bottom,var(--cyan),transparent); animation:scrollPulse 2s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100%{opacity:.3} 50%{opacity:1} }

/* STATS */
.stats-band { padding:0 24px; margin-bottom:100px; }
.stats-inner { max-width:900px; margin:0 auto; display:flex; border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; background:var(--bg2); box-shadow:0 0 60px rgba(61,217,214,.04); }
.stat { flex:1; padding:30px 32px; border-right:1px solid var(--border); text-align:center; transition:background .3s; }
.stat:last-child { border-right:none; }
.stat:hover { background:rgba(61,217,214,.03); }
.stat-num { font-family:'Space Grotesk',sans-serif; font-size:38px; font-weight:700; background:linear-gradient(135deg,var(--cyan2),var(--blue2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; line-height:1; }
.stat-label { font-size:13px; color:var(--text2); margin-top:6px; }

/* SHARED */
section { padding:100px 24px; position:relative; }
.container { max-width:1100px; margin:0 auto; }
.section-label { font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--cyan); margin-bottom:14px; }
h2 { font-family:'Space Grotesk',sans-serif; font-size:clamp(30px,4vw,50px); font-weight:700; letter-spacing:-.02em; line-height:1.1; max-width:560px; }
.section-desc { color:var(--text2); font-size:17px; max-width:440px; margin-top:16px; font-weight:300; line-height:1.7; }

/* PROBLEMS */
.problems-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:56px; gap:40px; flex-wrap:wrap; }
.problems-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; }
.problem-card { background:var(--bg2); padding:42px; transition:background .3s; position:relative; overflow:hidden; }
.problem-card::before { content:''; position:absolute; top:0; left:0; width:3px; height:0; background:linear-gradient(to bottom,var(--cyan),var(--blue)); transition:height .4s ease; }
.problem-card:hover { background:var(--bg3); }
.problem-card:hover::before { height:100%; }
.problem-icon { width:46px; height:46px; border-radius:12px; background:rgba(61,217,214,.06); border:1px solid var(--border2); display:flex; align-items:center; justify-content:center; font-size:21px; margin-bottom:22px; }
.problem-card h3 { font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; margin-bottom:10px; }
.problem-card p { font-size:15px; color:var(--text2); line-height:1.65; font-weight:300; }

/* SOLUTIONS */
.solutions { background:var(--bg2); }
.solutions-header { text-align:left; margin-bottom:64px; }
.solutions-header h2 { margin:0; text-align:left; }
.solutions-header .section-desc { margin:16px 0 0; text-align:left; }
.solutions-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.solution-card { background:var(--bg3); border:1px solid var(--border); border-radius:var(--r2); padding:36px 30px; transition:border-color .3s,transform .3s,box-shadow .3s; position:relative; overflow:hidden; }
.solution-card::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%,var(--glow),transparent 60%); opacity:0; transition:opacity .4s; }
.solution-card:hover { border-color:rgba(61,217,214,.3); transform:translateY(-5px); box-shadow:0 16px 48px rgba(0,0,0,.3); }
.solution-card:hover::after { opacity:1; }
.solution-card.featured { background:linear-gradient(145deg,rgba(61,217,214,.08),rgba(74,158,255,.05)); border-color:rgba(61,217,214,.28); }
.solution-num { font-family:'Space Grotesk',sans-serif; font-size:11px; font-weight:700; color:var(--cyan); letter-spacing:.12em; margin-bottom:18px; }
.solution-card h3 { font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:600; margin-bottom:12px; }
.solution-card p { font-size:14px; color:var(--text2); line-height:1.7; font-weight:300; }
.solution-tag { display:inline-block; margin-top:20px; font-size:12px; color:var(--cyan); background:rgba(61,217,214,.08); border:1px solid rgba(61,217,214,.2); padding:4px 12px; border-radius:100px; }

/* PROCESS */
.process-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.steps { display:flex; flex-direction:column; }
.step { display:flex; gap:24px; padding:30px 0; border-bottom:1px solid var(--border); cursor:pointer; }
.step:first-child { padding-top:0; }
.step:last-child { border-bottom:none; }
.step-num { font-family:'Space Grotesk',sans-serif; font-size:13px; font-weight:700; color:var(--text3); min-width:28px; padding-top:2px; transition:color .3s; }
.step.active .step-num { color:var(--cyan); }
.step-content h3 { font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; margin-bottom:8px; }
.step-content p { font-size:14px; color:var(--text2); line-height:1.65; font-weight:300; }
.process-visual { background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2); padding:48px; display:flex; flex-direction:column; gap:22px; min-height:340px; justify-content:center; position:relative; overflow:hidden; margin-top:6cm; }
.process-visual::before { content:''; position:absolute; top:-40px; right:-40px; width:200px; height:200px; background:radial-gradient(circle,var(--glow),transparent 70%); pointer-events:none; }
.pv-label { font-size:11px; color:var(--text3); letter-spacing:.1em; text-transform:uppercase; margin-bottom:4px; }
.pv-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; }
.pv-metric { font-size:13px; color:var(--text2); }
.pv-value { font-family:'Space Grotesk',sans-serif; font-size:13px; color:var(--cyan2); font-weight:600; }
.pv-bar { height:5px; border-radius:100px; background:var(--surface); overflow:hidden; }
.pv-bar-fill { height:100%; border-radius:100px; background:linear-gradient(90deg,var(--teal),var(--blue2)); transition:width .9s cubic-bezier(.4,0,.2,1); }

/* TESTIMONIALS */
.testimonials { background:var(--bg2); }
.testimonials-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:56px; flex-wrap:wrap; gap:24px; }
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.testimonial-card { background:var(--bg3); border:1px solid var(--border); border-radius:var(--r2); padding:36px; transition:border-color .3s,transform .3s; }
.testimonial-card:hover { border-color:var(--border2); transform:translateY(-3px); }
.stars { color:var(--cyan); font-size:13px; margin-bottom:20px; letter-spacing:3px; }
.testimonial-card blockquote { font-size:15px; color:var(--text); line-height:1.72; font-weight:300; font-style:italic; margin-bottom:28px; }
.testimonial-author { display:flex; align-items:center; gap:12px; }
.author-avatar { width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:700; color:#080c12; }
.author-name { font-size:14px; font-weight:500; margin-bottom:2px; }
.author-role { font-size:12px; color:var(--text3); }

/* FAQ */
.faq-layout { display:grid; grid-template-columns:1fr 1.6fr; gap:80px; align-items:start; }
.faq-sticky { position:sticky; top:100px; }
.faq-list { display:flex; flex-direction:column; }
.faq-item { border-bottom:1px solid var(--border); overflow:hidden; }
.faq-q { width:100%; background:none; border:none; color:var(--text); font-family:'DM Sans',sans-serif; font-size:16px; font-weight:400; text-align:left; padding:24px 0; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; transition:color .2s; }
.faq-q:hover { color:var(--cyan2); }
.faq-icon { width:22px; height:22px; border-radius:50%; border:1px solid var(--border2); display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--text2); flex-shrink:0; transition:transform .3s,border-color .3s,color .3s; }
.faq-item.open .faq-icon { transform:rotate(45deg); border-color:var(--cyan); color:var(--cyan); }
.faq-a { max-height:0; overflow:hidden; transition:max-height .4s ease; }
.faq-a p { font-size:15px; color:var(--text2); line-height:1.7; padding-bottom:24px; font-weight:300; }

/* FORM */
.form-section { background:var(--bg3); padding:100px 24px; }
.form-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:80px; align-items:center; max-width:1100px; margin:0 auto; }
.form-features { display:flex; flex-direction:column; gap:16px; margin-top:36px; }
.form-feature { display:flex; align-items:center; gap:12px; font-size:14px; color:var(--text2); }
.form-feature-icon { width:28px; height:28px; border-radius:8px; background:rgba(61,217,214,.07); border:1px solid var(--border2); display:flex; align-items:center; justify-content:center; font-size:13px; flex-shrink:0; color:var(--cyan); }

.contact-direct { display:flex; flex-direction:column; gap:14px; margin-top:32px; padding-top:28px; border-top:1px solid var(--border); }
.contact-direct-label { font-size:11px; color:var(--text3); text-transform:uppercase; letter-spacing:.08em; }
.contact-link { text-decoration:none; transition:color .2s; }
.contact-link:hover { color:var(--cyan2); }
.contact-link:hover .form-feature-icon { border-color:rgba(61,217,214,.4); background:rgba(61,217,214,.12); }
.contact-form { background:var(--bg2); border:1px solid var(--border2); border-radius:24px; padding:48px; position:relative; overflow:hidden; box-shadow:0 0 60px rgba(61,217,214,.05); }
.contact-form::before { content:''; position:absolute; top:-60px; right:-60px; width:220px; height:220px; background:radial-gradient(circle,var(--glow),transparent 70%); pointer-events:none; }
.form-title { font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; margin-bottom:8px; }
.form-subtitle { font-size:14px; color:var(--text2); margin-bottom:32px; font-weight:300; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { display:flex; flex-direction:column; gap:6px; }
.field.full { grid-column:1/-1; }
.field label { font-size:12px; color:var(--text2); letter-spacing:.04em; font-weight:500; }
.field input,.field textarea { background:rgba(61,217,214,.03); border:1px solid var(--border2); border-radius:10px; padding:13px 16px; color:var(--text); font-family:'DM Sans',sans-serif; font-size:15px; outline:none; transition:border-color .2s,background .2s,box-shadow .2s; }
.field input::placeholder,.field textarea::placeholder { color:var(--text3); }
.field input:focus,.field textarea:focus { border-color:rgba(61,217,214,.5); background:rgba(61,217,214,.04); box-shadow:0 0 0 3px rgba(61,217,214,.07); }
.field textarea { resize:vertical; min-height:110px; }
.wa-btn { display:block; text-align:center; text-decoration:none; }
.form-submit { margin-top:24px; width:100%; padding:15px; background:linear-gradient(135deg,var(--teal),var(--blue)); color:#fff; border:none; border-radius:100px; font-family:'DM Sans',sans-serif; font-size:15px; font-weight:600; cursor:pointer; transition:transform .2s,box-shadow .2s,opacity .2s; box-shadow:0 0 32px rgba(61,217,214,.2); }
.form-submit:hover { transform:translateY(-2px); box-shadow:0 0 52px rgba(61,217,214,.4); }
.form-submit:disabled { opacity:.5; cursor:not-allowed; transform:none; }
.form-msg { margin-top:16px; padding:14px 18px; border-radius:10px; font-size:14px; display:none; text-align:center; }
.form-msg.success { background:rgba(61,217,214,.08); border:1px solid rgba(61,217,214,.25); color:var(--cyan2); display:block; }
.form-msg.error { background:rgba(200,60,60,.1); border:1px solid rgba(200,60,60,.25); color:#f08080; display:block; }

/* FOOTER */
footer { background:var(--bg2); border-top:1px solid var(--border); padding:40px 24px; }
.footer-inner { max-width:1100px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.footer-logo { display:flex; align-items:center; gap:10px; }
.footer-logo img { height:28px; width:auto; opacity:.7; }
.footer-logo-text { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:13px; letter-spacing:.14em; color:var(--text2); text-transform:uppercase; }
.footer-copy { font-size:13px; color:var(--text3); margin-top:2px; padding-left:38px; }
.footer-links { display:flex; gap:28px; flex-wrap:wrap; }
.footer-links a { font-size:13px; color:var(--text3); text-decoration:none; transition:color .2s; }
.footer-links a:hover { color:var(--text2); }

@keyframes fadeUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.8)} }
.reveal { opacity:0; transform:translateY(36px); transition:opacity .75s ease,transform .75s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-left { opacity:0; transform:translateX(-36px); transition:opacity .75s ease,transform .75s ease; }
.reveal-left.visible { opacity:1; transform:translateX(0); }
.reveal-right { opacity:0; transform:translateX(36px); transition:opacity .75s ease,transform .75s ease; }
.reveal-right.visible { opacity:1; transform:translateX(0); }

@media(max-width:768px){
  nav { padding:16px 20px; }
  .nav-links { display:none; }
  .stats-inner { flex-direction:column; }
  .stat { border-right:none; border-bottom:1px solid var(--border); }
  .stat:last-child { border-bottom:none; }
  .problems-grid,.solutions-grid,.testimonials-grid { grid-template-columns:1fr; }
  .process-layout,.faq-layout,.form-layout { grid-template-columns:1fr; gap:48px; }
  .faq-sticky { position:static; }
  .form-grid { grid-template-columns:1fr; }
  .contact-form { padding:32px 24px; }
  h1 { font-size:32px; }
  .hero-logo img { height:200px; }
}