/* 1. IMPORTACIÓN DE FUENTES */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
/* 2. REGLAS GENERALES */
section.pb_cover {
max-width: 100vw;
min-height: 100%;
}
.btn {
white-space: inherit;
padding: 6px 12px;
}
body, body *:not([class*="fa-"]):not([class*="bi-"]) {
font-family: "Poppins", sans-serif !important;
}
.js-form-step-2 .primary-text,
.js-form-step-2 .text-white,
.js-form-step-2 .descriptor {
color: #fff !important;
}
.form-lp {
border-radius: 5px !important;
}
#js-block-1 .age p,
#js-block-1 h1.text-above-fields,
#js-block-2 h1.text-above-fields,
#js-block-2 span{
color: #fff !important;
}
.main-text {
font-size: 2rem !important;
}
#form-body .font-weight-bold {
font-weight: 500 !important;
}
.btn, .btn:hover, .btn:visited,
a.btn:hover, a.btn:link, a.btn:visited {
text-decoration: none !important;
color: #fff;
}
h2 {
font-weight: 700;
color: #1A3A2A;
margin-bottom: 15px;
}
p {
color: #5A6B5E;
}
/* 3. LABELS / BADGES */
.label-success, .label-default {
font-size: 1.2rem !important;
font-weight: bold;
border-radius: 50px;
padding: 20px;
display: inline-block;
margin-bottom: 15px;
box-shadow: rgba(0,0,0,0.1) 0 4px 12px !important;
}
@media (max-width: 1024px) {
.js-form-step-2 {margin-top:40px;}
.big-icon {font-size: 2rem !important;}
.step-box .panel-body {min-height: 100px !important;height: 100%;}
.panel-default {margin-bottom: 20px;}
}
.big-icon,
.label-success .big-icon,
.label-success i,
.label-default .big-icon,
.label-default i {
font-size: 1.2rem;
}
.label-default {
background-color: #fff !important;
color: #2D7A4C !important;
}
.label-success {
background-color: #2D7A4C !important;
color: #fff !important;
}
.label-success i {
margin-right: 5px;
}
/* 4. STEPS / ETAPAS */
.step-card {
background: linear-gradient(to bottom right, #E8F5E9, #fff);
border-radius: 20px;
padding: 30px 20px 20px;
position: relative;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
transition: all .3s ease;
margin-bottom: 30px;
}
.step-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 20px rgba(0,0,0,0.15);
border: 2px solid #2D7A4C;
}
.step-number {
position: absolute;
top: -20px;
left: 20px;
width: 48px;
height: 48px;
border-radius: 50%;
background-color: #2D7A4C;
color: #fff;
font-weight: 700;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.step-card i {
font-size: 40px;
color: #2D7A4C;
margin-bottom: 15px;
}
.step-card h3 {
font-size: 20px;
font-weight: 700;
margin-bottom: 10px;
}
.step-card p {
font-size: 14px;
margin: 0;
}
.step-note {
font-size: 12px;
font-style: italic;
color: #5A6B5E;
margin-top: 5px;
text-align: center;
}
/* 5. ADVANTAGES / BENEFICIOS */
.advantage-card {
background-color: #fff;
border-radius: 20px;
padding: 30px 20px;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
transition: all .3s ease;
border-top-width: 4px;
border-top-style: solid;
margin-bottom: 30px;
}
.advantage-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}
.advantage-icon {
width: 64px;
height: 64px;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 20px;
margin-bottom: 15px;
box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.advantage-card h3 {
font-size: 22px;
font-weight: 700;
margin-bottom: 10px;
}
.advantage-card p {
font-size: 14px;
line-height: 1.5;
}
.features-grid {
margin-top: 50px;
}
.feature-box {
background: #fff;
border-radius: 12px;
padding: 25px 15px;
margin-bottom: 30px;
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
transition: all 0.3s ease;
}
.feature-box:hover {
transform: scale(1.05);
box-shadow: 0 4px 14px rgba(0,0,0,0.15);
}
.feature-box i {
color: #2D7A4C;
margin-bottom: 10px;
}
.feature-box h4 {
font-weight: 600;
color: #1A3A2A;
margin-bottom: 5px;
}
.feature-box p {
color: #5A6B5E;
font-size: 13px;
margin-bottom: 0;
}
.big-icon {font-size: 2rem !important; font-weight: bold;}
/* 6. FAQ */
.panel-group .panel {
margin-bottom: auto;
border-radius: inherit;
padding: 0;
}
.faq-icon {
font-size: 1.2em;
}
.panel-default {
border-radius: 20px;
overflow: hidden;
border: none;
padding: 0;
margin-bottom: 15px;
box-shadow: 0 2px 6px rgba(0,0,0,0.05);
transition: all .3s ease;
}
.panel-default:hover {
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.panel-heading {
background-color: #E8F5E9 !important;
padding: 15px 20px;
cursor: pointer;
border: none;
}
.panel-title a {
font-weight: 600;
color: #1A3A2A !important;
display: block;
text-decoration: none;
border: 0;
}
.panel-title a.collapsed {
color: #1A3A2A;
border: 0;
}
.panel-body {
background-color: #E8F5E9 !important;
padding: 20px;
color: #5A6B5E;
font-size: 14px;
line-height: 1.5;
}
.step-box .panel-body {
min-height: 240px;
}
.advantage-box .panel-body {
min-height: 200px;
}
/* FIN EXTRA.CSS */