:root { --navy:#071c2b; --navy-2:#0b3046; --blue:#2563eb; --gold:#e7c67d; --gold-dark:#a77b3f; --muted:#667785; --text:#162231; --line:#dce4ea; --soft:#f4f7f8; --white:#fff; --shadow:0 26px 60px rgba(1,13,24,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:"DM Sans", Arial, sans-serif; color:var(--text); background:#fff; }
a { color:inherit; text-decoration:none; }
svg { display:block; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.container { width:min(1180px, calc(100% - 40px)); margin-inline:auto; }
.site-header { position:absolute; z-index:20; inset-inline:0; top:0; padding:24px 0; color:#fff; }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:12px; font-family:"Manrope", sans-serif; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(231,198,125,.45); color:var(--gold); background:rgba(255,255,255,.04); }
.brand-mark svg { width:28px; height:28px; }
.brand-copy { display:flex; flex-direction:column; line-height:1; letter-spacing:.08em; text-transform:uppercase; }
.brand-copy strong { font-size:15px; }
.brand-copy small { margin-top:4px; color:var(--gold); font-size:10px; font-weight:700; }
.main-nav { display:flex; align-items:center; gap:28px; color:rgba(255,255,255,.82); font-size:14px; font-weight:700; }
.nav-cta { padding:12px 18px; border:1px solid rgba(255,255,255,.2); border-radius:999px; color:#fff; }
.menu-toggle { display:none; border:0; background:transparent; color:#fff; }
.hero { position:relative; overflow:hidden; min-height:860px; padding:136px 0 90px; color:#fff; background:radial-gradient(circle at 70% 16%, #164762 0, #0b2b3f 34%, #061c2c 74%); }
.hero-grid { position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.09) 1px, transparent 1px); background-size:70px 70px; }
.hero-orbit { position:absolute; border:1px solid rgba(231,198,125,.15); border-radius:50%; }
.orbit-one { width:620px; height:620px; right:-120px; top:30px; }
.orbit-two { width:420px; height:420px; right:110px; top:170px; }
.hero-content { position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .9fr; gap:70px; align-items:center; }
.eyebrow { display:flex; align-items:center; gap:14px; color:var(--gold-dark); font:800 13px/1 "Manrope", sans-serif; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow span { width:32px; height:2px; background:currentColor; }
.eyebrow.light { color:var(--gold); }
h1,h2,h3,p { margin-top:0; }
.hero h1 { margin:28px 0 24px; font:400 clamp(62px, 9vw, 118px)/.98 "Manrope", sans-serif; letter-spacing:-.075em; }
.hero h1 em { display:block; color:var(--gold); font-style:normal; }
.hero-lead { max-width:720px; color:rgba(255,255,255,.72); font-size:22px; line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:38px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:28px; min-height:58px; padding:0 26px; border:0; border-radius:4px; cursor:pointer; font-weight:800; font-size:16px; transition:.2s; }
.button-primary { min-width:250px; color:#fff; background:var(--blue); box-shadow:0 14px 30px rgba(37,99,235,.28); }
.button-primary:hover { transform:translateY(-2px); background:#1d4ed8; }
.button-dark { color:#fff; background:var(--navy); }
.button-card { width:100%; color:#fff; background:var(--navy); }
.text-link { display:inline-flex; align-items:center; gap:12px; color:rgba(255,255,255,.82); font-weight:800; }
.text-link.dark { color:var(--navy); }
.play { width:40px; height:40px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.32); border-radius:50%; font-size:11px; }
.simulation-card { position:relative; padding:42px 44px 26px; color:var(--text); background:#fff; border-top:4px solid var(--gold); box-shadow:var(--shadow); }
.card-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; padding-bottom:24px; border-bottom:1px solid var(--line); margin-bottom:24px; }
.card-kicker { color:var(--blue); font:800 13px/1 "Manrope", sans-serif; letter-spacing:.18em; }
.card-heading h2 { margin:14px 0 0; font:800 28px/1.2 "Manrope", sans-serif; }
.lock { width:46px; height:46px; display:grid; place-items:center; color:var(--blue); background:#eef4ff; border-radius:50%; }
label { display:block; margin:0 0 10px; color:#5a6875; font-weight:800; }
input,select { width:100%; height:58px; border:1px solid #d7e0e6; background:#fff; color:#22313d; padding:0 18px; font:500 18px "DM Sans", sans-serif; outline:none; border-radius:2px; }
input:focus,select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
select { appearance:none; }
.select-wrap { position:relative; }
.select-wrap::after { content:"⌄"; position:absolute; right:18px; top:50%; transform:translateY(-56%); color:#8a97a1; pointer-events:none; }
.money-input { display:flex; align-items:center; height:58px; border:1px solid #d7e0e6; background:#fff; }
.money-input:focus-within { border-color:var(--blue); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.money-input span { padding-left:18px; color:#8b97a2; font-weight:700; }
.money-input input { border:0; height:56px; box-shadow:none; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.simulation-card > label, .simulation-card > input, .form-row { margin-bottom:20px; }
.website-field { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.privacy-note { margin:18px 0 0; text-align:center; color:#94a3ad; font-size:13px; }
.privacy-note span { color:var(--blue); }
.form-success { margin-top:14px; min-height:20px; text-align:center; font-weight:800; }
.form-success.ok { color:#138a43; }
.form-success.error { color:#b42318; }
.hero-bottom { position:absolute; left:-5%; right:-5%; bottom:-45px; height:100px; background:#fff; transform:rotate(-2deg); }
.trust-strip { padding:70px 0 34px; background:#fff; }
.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); }
.trust-grid > div { padding:28px; display:flex; gap:18px; border-right:1px solid var(--line); }
.trust-grid > div:last-child { border-right:0; }
.trust-number { color:var(--gold-dark); font-weight:900; }
.section { padding:96px 0; }
.section-heading { margin-bottom:44px; }
.section-heading.split { display:grid; grid-template-columns:1fr .8fr; gap:40px; align-items:end; }
.section-heading.centered { max-width:760px; margin-inline:auto; text-align:center; }
.section-heading.centered .eyebrow { justify-content:center; }
h2 { font:800 clamp(34px, 4.2vw, 58px)/1.05 "Manrope", sans-serif; letter-spacing:-.04em; }
h3 { font:800 22px/1.2 "Manrope", sans-serif; }
p { color:var(--muted); line-height:1.7; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.step-card,.possibility-grid article { padding:34px; border:1px solid var(--line); background:#fff; }
.step-card.featured { background:var(--navy); color:#fff; border-color:var(--navy); }
.step-card.featured p { color:rgba(255,255,255,.72); }
.step-index,.possibility-grid span { color:var(--gold-dark); font-weight:900; }
.step-icon { width:58px; height:58px; display:grid; place-items:center; margin:22px 0; color:var(--blue); background:#eef4ff; border-radius:50%; }
.step-icon svg { width:32px; height:32px; }
.why { background:var(--soft); }
.why-grid { display:grid; grid-template-columns:.9fr 1fr; gap:70px; align-items:center; }
.visual-panel { position:relative; padding:30px; background:var(--navy); color:#fff; box-shadow:var(--shadow); }
.visual-panel svg { width:100%; color:var(--gold); }
.visual-panel .area { fill:rgba(231,198,125,.12); stroke:none; }
.visual-panel .line { stroke:var(--gold); stroke-width:4; }
.seal circle { fill:rgba(255,255,255,.06); stroke:var(--gold); }
.seal path { stroke:var(--gold); stroke-width:8; }
.seal text { fill:var(--gold); stroke:none; font:800 13px "Manrope", sans-serif; letter-spacing:.18em; }
.visual-caption { position:absolute; left:30px; bottom:30px; }
.visual-caption span { color:var(--gold); font-size:12px; font-weight:900; letter-spacing:.18em; }
.visual-caption strong { display:block; margin-top:8px; font-size:24px; line-height:1.2; }
.why-intro { font-size:18px; }
.benefit-list { display:grid; gap:16px; margin:28px 0 34px; }
.benefit-list article { display:grid; grid-template-columns:44px 1fr; gap:16px; padding:20px; background:#fff; border:1px solid var(--line); }
.benefit-list article span { color:var(--gold-dark); font-weight:900; }
.possibility-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.faq { background:#fff; }
.faq-grid { display:grid; grid-template-columns:.75fr 1fr; gap:60px; }
.faq-item { border-bottom:1px solid var(--line); }
.faq-item button { width:100%; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:24px 0; border:0; background:transparent; cursor:pointer; color:var(--text); font:800 19px "Manrope", sans-serif; text-align:left; }
.faq-answer { display:none; padding-bottom:22px; }
.faq-item.open .faq-answer { display:block; }
.final-cta { padding:84px 0; color:#fff; background:var(--navy); }
.cta-inner { display:grid; grid-template-columns:1fr .7fr; gap:50px; align-items:center; }
.cta-inner p { color:rgba(255,255,255,.72); }
footer { background:#061620; color:#fff; padding:48px 0 28px; }
.footer-top { display:grid; grid-template-columns:.7fr 1fr .8fr; gap:28px; align-items:center; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.12); }
.footer-top p { color:rgba(255,255,255,.68); margin:0; }
.footer-contact small { display:block; color:var(--gold); font-weight:900; letter-spacing:.18em; }
.footer-contact a { display:block; margin-top:8px; font-weight:800; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-top:24px; color:rgba(255,255,255,.6); font-size:14px; }
.footer-bottom p { margin:0; color:inherit; }
.footer-bottom div { display:flex; gap:22px; }
.whatsapp-float { position:fixed; z-index:50; isolation:isolate; right:28px; bottom:28px; width:62px; height:62px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#25d366; box-shadow:0 12px 30px rgba(0,0,0,.24); transition:transform .2s,box-shadow .2s,background .2s; }
.whatsapp-float::before { content:""; position:absolute; z-index:-1; inset:-2px; border:2px solid rgba(78,255,143,.9); border-radius:50%; background:rgba(37,211,102,.58); box-shadow:0 0 18px rgba(37,211,102,.55); pointer-events:none; animation:whatsapp-pulse 1.65s ease-out infinite; }
.whatsapp-float:hover { transform:translateY(-4px) scale(1.03); background:#20bd5a; box-shadow:0 16px 38px rgba(0,0,0,.3); }
.whatsapp-float svg { width:33px; height:33px; fill:currentColor; stroke:none; }
.whatsapp-tooltip { position:absolute; right:76px; padding:9px 12px; border-radius:3px; color:#fff; background:var(--navy); font-size:12px; font-weight:600; white-space:nowrap; opacity:0; transform:translateX(6px); pointer-events:none; transition:opacity .2s,transform .2s; }
.whatsapp-tooltip::after { content:""; position:absolute; right:-5px; top:50%; width:10px; height:10px; background:var(--navy); transform:translateY(-50%) rotate(45deg); }
.whatsapp-float:hover .whatsapp-tooltip,.whatsapp-float:focus-visible .whatsapp-tooltip { opacity:1; transform:translateX(0); }
@keyframes whatsapp-pulse { 0% { transform:scale(1); opacity:.95; } 55% { transform:scale(1.65); opacity:.35; } 100% { transform:scale(1.95); opacity:0; } }
@media (max-width:980px) {
  .site-header { position:relative; background:var(--navy); }
  .menu-toggle { display:grid; gap:6px; }
  .menu-toggle span { width:24px; height:2px; background:#fff; }
  .main-nav { display:none; position:absolute; left:20px; right:20px; top:82px; flex-direction:column; align-items:flex-start; padding:22px; background:#092234; border:1px solid rgba(255,255,255,.12); }
  .main-nav.open { display:flex; }
  .hero { padding-top:60px; min-height:auto; }
  .hero-content,.why-grid,.faq-grid,.cta-inner,.section-heading.split,.footer-top { grid-template-columns:1fr; }
  .hero h1 { font-size:64px; }
  .steps,.possibility-grid,.trust-grid { grid-template-columns:1fr; }
  .trust-grid > div { border-right:0; border-bottom:1px solid var(--line); }
  .trust-grid > div:last-child { border-bottom:0; }
}
@media (max-width:640px) {
  .container { width:min(100% - 28px, 1180px); }
  .hero h1 { font-size:54px; }
  .hero-lead { font-size:18px; }
  .simulation-card { padding:30px 22px 22px; }
  .form-row { grid-template-columns:1fr; gap:0; }
  .hero-actions,.footer-bottom { flex-direction:column; align-items:flex-start; }
  .whatsapp-float { right:18px; bottom:18px; width:56px; height:56px; }
  .whatsapp-float svg { width:30px; height:30px; }
  .whatsapp-tooltip { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  * { scroll-behavior:auto !important; transition:none !important; }
  .whatsapp-float::before { animation:none; }
}