body{
margin:0;
font-family:Arial,sans-serif;
background:#0b1d52;
}

.pagina{
max-width:950px;
margin:auto;
background:white;
min-height:100vh;
padding:25px;
}

.contenido{
max-width:720px;
margin:auto;
}

h1{
text-align:center;
color:#1d4ed8;
font-size:34px;
margin-bottom:30px;
}

h2{
font-size:26px;
margin-top:28px;
margin-bottom:15px;
}

label{
display:block;
font-size:18px;
font-weight:bold;
margin-top:15px;
}

input,select{
width:100%;
padding:14px;
font-size:19px;
margin-top:8px;
border:1px solid #ccc;
border-radius:6px;
box-sizing:border-box;
}

button{
width:100%;
padding:16px;
margin-top:25px;
font-size:22px;
background:#2563eb;
color:white;
border:none;
border-radius:6px;
cursor:pointer;
}

button:hover{
background:#1d4ed8;
}

#resultado{
margin-top:28px;
background:transparent;
box-shadow:none;
border:none;
outline:none;
color:#1b5e20;
font-size:34px;
font-weight:bold;
text-align:center;
padding:8px 0;
}

#detalle{
margin-top:28px;
font-size:19px;
line-height:1.9;
}

canvas{
display:block;
max-width:340px;
margin:35px auto;
}

.faq{
margin-top:35px;
}

.faq h2{
text-align:center;
font-size:34px;
}

details{
padding:12px 0;
border-bottom:1px solid #eee;
font-size:19px;
}

summary{
cursor:pointer;
font-weight:bold;
}

details p{
margin-top:10px;
line-height:1.6;
color:#444;
}

@media(max-width:768px){

.pagina{
padding:15px;
}

h1{
font-size:28px;
}

#resultado{
font-size:28px;
}

button{
font-size:20px;
}

}

.faq details {
background: #f8f9fb;
padding: 12px;
border-radius: 8px;
margin-bottom: 10px;
border: 1px solid #ddd;
}

.faq summary {
font-weight: bold;
color: #0077ff;
cursor: pointer;
}

.faq p {
margin-top: 8px;
color: #444;
}

/* ✅ FOOTER ARREGLADO */

footer{
background:#0b1d52;
padding:18px;
text-align:center;
margin-top:40px;
}

footer a{
color:white;
text-decoration:none;
font-size:16px;
}

footer a:hover{
text-decoration:underline;
}