@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
  --bg:#020a16;
  --bg2:#06152e;
  --panel:rgba(7,25,49,.78);
  --panel2:rgba(4,17,35,.9);
  --blue:#087cf4;
  --cyan:#00d9ff;
  --red:#f32943;
  --white:#f7fbff;
  --muted:#a9bbd0;
  --line:rgba(0,174,255,.30);
  --line2:rgba(255,255,255,.10);
  --shadow:0 25px 80px rgba(0,0,0,.42);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Arial,sans-serif;
  color:var(--white);
  background:
    radial-gradient(circle at 12% 12%,rgba(0,128,255,.12),transparent 30%),
    radial-gradient(circle at 85% 55%,rgba(0,210,255,.08),transparent 28%),
    var(--bg);
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.32;
  background-image:linear-gradient(rgba(0,184,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(0,184,255,.035) 1px,transparent 1px);
  background-size:60px 60px;z-index:-1;
}
a{text-decoration:none;color:inherit}

.topbar{
  position:sticky;top:0;z-index:50;height:74px;padding:8px 4.5vw;
  display:flex;align-items:center;gap:25px;
  background:rgba(1,8,18,.91);backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(0,185,255,.22);
}
.brand img{width:185px;height:54px;object-fit:contain}
.topbar nav{margin-left:auto;display:flex;gap:22px;color:#dce8f8;font-size:12px;font-weight:600}
.topbar nav a:hover{color:#fff;text-shadow:0 0 14px rgba(0,205,255,.6)}
.nav-cta{margin-left:5px}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:12px;padding:13px 21px;font-weight:800;
  transition:.2s;cursor:pointer;border:1px solid transparent;font:inherit
}
.btn:hover{transform:translateY(-2px)}
.btn-blue{
  color:#fff;background:linear-gradient(135deg,#0677f5,#08caff);
  box-shadow:0 0 24px rgba(0,170,255,.32)
}
.btn-red{
  color:#fff;background:linear-gradient(135deg,#ed1f3d,#ff4257);
  box-shadow:0 0 28px rgba(243,41,67,.34)
}
.btn-glass{
  color:#fff;background:rgba(0,15,32,.48);
  border-color:rgba(0,196,255,.42);backdrop-filter:blur(10px)
}

.hero{
  min-height:660px;position:relative;display:flex;align-items:center;
  overflow:hidden;
  background-image:url('assets/somos-impulsa-hero.png');
  background-size:cover;background-position:center;
}
.hero:after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(1,8,19,.98) 0%,rgba(2,12,28,.90) 34%,rgba(2,12,28,.30) 70%,rgba(2,12,28,.08) 100%),
    linear-gradient(0deg,rgba(2,9,20,.78),transparent 35%,rgba(0,18,38,.15));
}
.hero-content{position:relative;z-index:2;width:min(650px,88%);margin-left:5.5vw;padding:78px 0}
.eyebrow{font-size:12px;letter-spacing:4px;font-weight:800;color:var(--cyan)}
.hero h1{
  font-size:clamp(52px,7vw,86px);line-height:.92;margin:16px 0 20px;
  font-weight:900;letter-spacing:-3px;text-transform:uppercase
}
.hero h1 span{color:var(--cyan)}
.lead{font-size:18px;line-height:1.55;color:#e5edf7;max-width:620px}
.hero-actions{display:flex;gap:12px;margin:26px 0 10px;flex-wrap:wrap}
.micro{font-size:11px;color:#9fb1c8}

.social-strip{
  display:flex;justify-content:space-between;align-items:center;
  padding:15px 5.5vw;background:#031328;color:#e8f2ff;
  border-top:1px solid rgba(0,193,255,.16);border-bottom:1px solid rgba(0,193,255,.18)
}
.social-actions{display:flex;gap:9px}
.social-actions a{
  padding:8px 12px;border:1px solid rgba(0,194,255,.35);border-radius:10px;
  color:#82e8ff;font-weight:700;font-size:12px;background:rgba(0,150,255,.05)
}

.section{padding:82px 5.5vw;position:relative}
.section.dark{
  background:
    radial-gradient(circle at 50% 10%,rgba(0,111,255,.13),transparent 40%),
    #031023;
  border-top:1px solid rgba(0,180,255,.16);
  border-bottom:1px solid rgba(0,180,255,.16)
}
.section-head{max-width:820px;margin-bottom:38px}
.section-head>span{font-size:11px;letter-spacing:3px;color:var(--cyan);font-weight:900}
.section-head h2{font-size:clamp(32px,4vw,50px);line-height:1.04;margin:11px 0}
.section-head p{font-size:16px;color:var(--muted);line-height:1.6}
.section-head:after{
  content:"";display:block;width:58px;height:4px;margin-top:18px;
  background:linear-gradient(90deg,var(--cyan),transparent);border-radius:4px
}

.cards{display:grid;gap:15px}
.cards.six{grid-template-columns:repeat(3,1fr)}
.cards article{
  position:relative;padding:25px;border:1px solid rgba(0,180,255,.32);
  border-radius:16px;background:linear-gradient(145deg,rgba(7,33,64,.76),rgba(2,15,31,.85));
  box-shadow:inset 0 0 28px rgba(0,135,255,.035);overflow:hidden
}
.cards article:before{
  content:"";position:absolute;left:0;top:0;width:100%;height:2px;
  background:linear-gradient(90deg,var(--cyan),transparent)
}
.cards article b{color:#00caff;font-size:12px}
.cards h3{margin:12px 0 7px;font-size:18px}
.cards p{color:#a9bbd0;line-height:1.5;margin:0;font-size:13px}

.steps{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.steps div{
  text-align:center;border:1px solid rgba(0,184,255,.28);border-radius:16px;
  padding:20px 10px;background:rgba(3,23,47,.64);position:relative
}
.steps div:after{
  content:"";position:absolute;top:37px;right:-14px;width:16px;height:1px;
  background:#00cfff
}
.steps div:last-child:after{display:none}
.steps i{
  display:inline-flex;width:45px;height:45px;border-radius:50%;
  align-items:center;justify-content:center;font-style:normal;
  color:#fff;font-weight:900;border:1px solid #00cfff;
  box-shadow:0 0 18px rgba(0,205,255,.35);background:#041d3a
}
.steps h3{font-size:13px;margin:13px 0 6px}
.steps p{font-size:11px;color:#9fb1c8;line-height:1.45}

.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:start}
.two-col h2{font-size:42px;margin:10px 0 22px}
.checks{padding:0;list-style:none;display:grid;gap:12px}
.checks li{padding-left:29px;position:relative;color:#dbe8f6;font-size:14px;line-height:1.5}
.checks li:before{
  content:"✓";position:absolute;left:0;width:19px;height:19px;
  border-radius:50%;display:grid;place-items:center;background:#09b96d;
  color:#fff;font-size:12px;font-weight:900
}
.notice{
  background:linear-gradient(145deg,rgba(4,26,51,.85),rgba(2,14,29,.95));
  border:1px solid rgba(0,187,255,.30);border-radius:18px;padding:27px;
  box-shadow:var(--shadow)
}
.notice h3{margin-top:0}
.notice p{color:#a9bbd0;line-height:1.6;font-size:13px}
.notice hr{border:0;border-top:1px solid rgba(255,255,255,.1);margin:22px 0}

.case-banner{
  margin:0;padding:55px 5.5vw;background:
  linear-gradient(90deg,rgba(2,11,25,.98),rgba(4,36,69,.75)),
  url('assets/somos-impulsa-hero.png') center/cover;
  border-top:1px solid rgba(0,200,255,.2);border-bottom:1px solid rgba(0,200,255,.2);
  color:#fff;display:flex;align-items:center;justify-content:space-between;gap:30px
}
.case-banner span{color:#00cfff;font-weight:900;letter-spacing:3px;font-size:11px}
.case-banner h2{font-size:38px;margin:10px 0}
.case-banner p{color:#b8c8dc;max-width:650px}

.form-section{
  background:
    radial-gradient(circle at 50% 0,rgba(0,128,255,.13),transparent 45%),
    #020b18
}
form{
  background:linear-gradient(145deg,rgba(7,28,54,.96),rgba(2,13,27,.98));
  border:1px solid rgba(0,190,255,.35);border-radius:20px;padding:32px;
  box-shadow:0 30px 90px rgba(0,0,0,.45);max-width:1100px
}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}
label{font-size:12px;font-weight:700;color:#d7e5f4}
label input,label select,label textarea{
  display:block;width:100%;margin-top:7px;padding:13px 14px;
  border:1px solid rgba(120,168,210,.22);border-radius:10px;
  background:rgba(1,12,25,.85);font:inherit;font-size:13px;
  color:#fff;outline:none
}
label input:focus,label select:focus,label textarea:focus{
  border-color:#00caff;box-shadow:0 0 0 3px rgba(0,202,255,.09)
}
label select option{background:#06152e;color:#fff}
textarea{min-height:105px;resize:vertical}
.full{grid-column:1/-1}
.consents{display:grid;gap:11px;margin-top:5px;padding-top:10px;border-top:1px solid rgba(255,255,255,.08)}
.checkline{display:flex;gap:10px;align-items:flex-start;font-weight:500;line-height:1.45;color:#b8c8dc}
.checkline input{width:17px;height:17px;margin:0;flex:0 0 auto}
.submit{margin-top:23px;min-width:220px}
.form-status{min-height:22px;font-weight:700}
.privacy-note{font-size:10px;color:#7388a2}

.honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}

.faq{max-width:900px}
.faq details{border-bottom:1px solid rgba(255,255,255,.13);padding:18px 0}
.faq summary{cursor:pointer;font-weight:800}
.faq p{color:#aebdd1;line-height:1.6;font-size:13px}

.final-cta{
  padding:90px 5vw;text-align:center;
  background:radial-gradient(circle at center,rgba(0,133,255,.18),transparent 55%),#020a16
}
.final-cta h2{font-size:clamp(32px,4vw,54px);margin:0 0 27px}

footer{
  background:#010711;color:#879db7;padding:28px 5.5vw;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  font-size:12px;border-top:1px solid rgba(0,180,255,.17)
}
footer img{width:180px;height:50px;object-fit:contain}

@media(max-width:1000px){
  .topbar{height:auto;padding:9px 18px;flex-wrap:wrap}
  .topbar nav{order:3;width:100%;overflow:auto;gap:17px;padding:4px 0}
  .nav-cta{margin-left:auto}
  .hero{min-height:690px}
  .hero-content{margin-left:5vw}
  .cards.six{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(3,1fr)}
  .steps div:after{display:none}
  .two-col{grid-template-columns:1fr}
}
@media(max-width:640px){
  .brand img{width:165px}
  .topbar nav{font-size:11px}
  .hero{min-height:730px;background-position:62% center}
  .hero-content{width:88%;margin:0 auto;padding-top:50px}
  .hero h1{font-size:51px;letter-spacing:-2px}
  .lead{font-size:15px}
  .cards.six,.steps,.two-col,.form-grid{grid-template-columns:1fr}
  .section{padding:64px 5vw}
  .case-banner{padding:38px 5vw;flex-direction:column;align-items:flex-start}
  .case-banner h2{font-size:30px}
  .form-grid .full{grid-column:auto}
  form{padding:21px;border-radius:17px}
  .social-strip{padding:17px 5vw;flex-direction:column;align-items:flex-start;gap:12px}
  footer{flex-direction:column;align-items:flex-start}
}

.hero-kicker{font-size:21px;font-weight:900;letter-spacing:.3px;margin:-5px 0 10px;color:#fff}
.hero-kicker span{color:#00d9ff}.hero-kicker b{color:#f32943}
