/* Institucional: rojo, verde y blanco */ :root{ --verde:#3fa535; --rojo:#ec0202; --gris:#f5f5f700; --texto:#2b2b2b; } *{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;color:var(--texto);background:transparent} a{color:var(--rojo);text-decoration:none} .container{max-width:1100px;margin:0 auto;padding:0 16px} .topbar{background:var(--rojo);color:#fff;font-size:.95rem} .header-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0} .brand img{height:60px} .nav a{margin:0 10px;color:var(--verde);font-weight:700} .hero{background:transparent;color:var(--texto);padding:48px 0} .hero-grid{display:flex;align-items:center;justify-content:space-between} .hero-copy h1{font-size:clamp(26px,4vw,40px);margin:0 0 8px} .hero-copy .lead{font-size:1.1rem} .hero-badge img{height:140px} .section{padding:42px 0} .section.alt{background:var(--gris)} h2{margin-top:0;color:var(--verde)} .calc{background:#76c929;border:1px solid #e6e6e6;border-radius:12px;padding:16px;box-shadow:0 6px 16px rgba(0,0,0,.06)} input[type=range]{width:100%} .grid-3{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:10px} .grid-2{display:grid;grid-template-columns:repeat(3,1fr);gap:12px} .res-box{background:#fafafa;padding:10px;border-radius:10px;border:1px solid #eee;align-content: center;text-align: center;} .res-label{font-size:1.2rem;color:#666} .res-value{font-size:1.4rem;font-weight:800} .res-value2{font-size:1rem;font-weight:800} .res-value3{font-size:1.4rem;font-weight:800;-webkit-text-fill-color:#76c929;} .res-value4{font-size:.9rem;font-weight:600;-webkit-text-fill-color:#000000;} .actions{margin-top:12px} .btn{display:inline-block;background:var(--rojo);color:#fff;padding:10px 16px;border-radius:10px;font-weight:700} .btn-primary{background:var(--rojo)} .muted{color:#666} table{border-collapse:collapse;width:100%;margin-top:18px;background:#fff} th,td{padding:10px;border-bottom:1px solid #eee;text-align:right} th{background:#fafafa;text-align:center} td:first-child, th:first-child{text-align:center} .lead-form input, .lead-form select{width:100%;padding:10px;border:1px solid #ec0202;border-radius:10px; text-transform: uppercase;} .lead-form button{margin-top:10px} .msg{margin-top:10px;font-weight:700} .footer{background:#ec0202;color:#fff;text-align:center;padding:06px 08px;font-size:.95rem} .mobile-dock{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:2px solid var(--rojo);display:none;justify-content:space-around;padding:8px 4px;z-index:999} .mobile-dock a{color:var(--rojo);font-weight:800} @media (max-width:820px){ .grid-3{grid-template-columns:1fr} .grid-2{grid-template-columns:1fr} .nav{display:none} .mobile-dock{display:flex} } /* Fondo responsivo en */ html, body { height: 100%; } body{ background-image: url('assets/img/bg-mobile.webp'); background-size: cover; background-repeat: no-repeat; background-position: center top; /* Si en iOS ves “parallax” raro, comenta la línea de abajo */ background-attachment: fixed; } @media (min-width: 768px){ body{ background-image: url('assets/img/bg-desktop.webp'); background-position: left top; } } /* Logo Money Móvil (superior izquierda) */ .mm-fixed-logo{ position: fixed; top: 12px; left: 12px; width: clamp(110px, 16vw, 220px); z-index: 10000; pointer-events: auto; cursor: pointer; /* Sello 35 años fijo */ .mm-fixed-35{ position: fixed; top: 12px; right: 12px; width: clamp(64px, 12vw, 120px); z-index: 10000; pointer-events: none; user-select: none; } #preguntas h1 { font-size: 30px; font-weight: 400; letter-spacing: 1px; padding-left: 70px; padding-top: 40px; padding-bottom: 10px; } #preguntas p { font-size: 18px; font-weight: 300; letter-spacing: 1px; padding-left: 100px; padding-bottom: 30px; } #preguntasmoneymovil { margin-top: 30px; } #preguntasmoneymovil h1 { font-size: 45px; font-weight: 400; color:#7ebc42; letter-spacing: 2px; padding-left: 50px; margin-bottom: 10px; } #preguntasmoneymovil p { font-size: 20px; color:#000; font-weight: 300; padding-left: 50px; margin-bottom: 30px; } #p1 { padding-left: 90px; background-color: #e9e9e9; margin-bottom: 10px; } #p1 img { float: right; padding-top: 15px; } #p1 h1 { color: #000; font-size: 16px; font-weight: 500; letter-spacing: 1px; } #r1 p, #r2 p, #r3 p, #r4 p, #r5 p, #r6 p, #r7 p, #r8 p, #r9 p { color: #000; font-size: 13px; font-weight: 300; letter-spacing: 1px; margin-left: 50px; margin-bottom: 20px; margin-top: 10px; } /* Botón WhatsApp flotante */ .mm-wa{ position: fixed; bottom: 18px; right: 18px; z-index: 10000; display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 9999px; background: #25D366; box-shadow: 0 10px 20px rgba(0,0,0,.18); text-decoration: none; } .mm-wa svg{ width: 32px; height: 32px; fill: #fff; } @media (max-width:480px){ .mm-wa{ width:54px; height:54px; } .mm-wa svg{ width:28px; height:28px; } }