/* =====================================================
WRAPPER
===================================================== */

.bt-potencial-wrap{
max-width:900px;
margin:0 auto;
padding:10px 0 40px;
}

/* =====================================================
TITULO
===================================================== */

.bt-potencial-title{
margin-bottom:30px;
}

.bt-potencial-title h2{
margin-bottom:8px;
font-size:32px;
font-weight:600;
color:#121E29;
}

.bt-potencial-title p{
margin:0;
font-size:15px;
color:#7A8CA3;
}

/* =====================================================
PROGRESS
===================================================== */

.bt-progress{
display:flex;
align-items:center;
gap:12px;
margin:20px 0 30px;
}

.bt-progress-step{
width:36px;
height:36px;
border-radius:50%;
border:2px solid #E8EEF6;
display:flex;
align-items:center;
justify-content:center;
font-weight:600;
font-size:14px;
color:#7A8CA3;
background:white;
transition:all .2s ease;
}

.bt-progress-step.is-active{
border-color:#1E5BD7;
color:#1E5BD7;
}

.bt-progress-step.is-done{
background:#1E5BD7;
border-color:#1E5BD7;
color:white;
}

.bt-progress-line{
flex:1;
height:2px;
background:#E8EEF6;
}

/* =====================================================
STEP
===================================================== */

.bt-step{
display:none;
}

.bt-step.is-active{
display:block;
}

/* =====================================================
CARD
===================================================== */

.bt-step-card{
background:white;
border:1px solid #E8EEF6;
border-radius:10px;
padding:28px;
box-shadow:0 4px 10px rgba(0,0,0,0.05);
}

/* =====================================================
TITULO PREGUNTA
===================================================== */

.bt-step-title{
margin:0 0 12px;
font-size:22px;
font-weight:600;
color:#121E29;
}

.bt-step-subtitle{
margin:0 0 14px;
font-size:15px;
color:#7A8CA3;
font-style:italic;
}

.bt-step-definition{
margin:0 0 24px;
font-size:14px;
color:#7A8CA3;
line-height:1.6;
}

/* =====================================================
OPCIONES
===================================================== */

.bt-options{
display:flex;
flex-direction:column;
gap:12px;
margin-bottom:25px;
}

.bt-option{
display:block;
border:1px solid #E8EEF6;
border-radius:8px;
padding:14px 16px;
cursor:pointer;
transition:all .2s ease;
background:white;
}

.bt-option:hover{
border-color:#1E5BD7;
background:#FAFBFD;
}

.bt-option input[type="radio"]{
display:none;
}

.bt-option-text{
font-size:14px;
line-height:1.5;
color:#121E29;
}

.bt-option.is-selected{
border-color:#1E5BD7;
background:#F4F7FF;
}

/* =====================================================
BOTONES
===================================================== */

.bt-nav{
margin-top:15px;
}

.bt-btn-row{
display:flex;
gap:10px;
}

.bt-btn{
border:none;
border-radius:6px;
padding:10px 18px;
font-size:14px;
font-weight:500;
cursor:pointer;
background:#1E5BD7;
color:white;
transition:all .2s ease;
}

.bt-btn:hover{
background:#1748ad;
color:#ffffff;
}

.bt-btn-full{
width:100%;
}

.bt-btn-half{
flex:1;
}

/* =====================================================
STEP COUNTER
===================================================== */

.bt-step-counter{
margin-top:12px;
font-size:13px;
color:#7A8CA3;
}

/* =====================================================
ERROR
===================================================== */

.bt-inline-error{
display:none;
margin-bottom:18px;
padding:12px;
border-left:4px solid #d63638;
background:#fff0f0;
font-size:14px;
}

.bt-inline-error.is-visible{
display:block;
}

/* =====================================================
RESULT TABLE
===================================================== */

.bt-result-table{
width:100%;
border-collapse:collapse;
margin-top:20px;
}

.bt-result-table th,
.bt-result-table td{
border:1px solid #E8EEF6;
padding:12px;
font-size:14px;
}

.bt-result-table th{
background:#FAFBFD;
font-weight:600;
}

.bt-result-total{
background:#F4F7FF;
font-size:16px;
font-weight:600;
}

/* =====================================================
DAFO
===================================================== */

.bt-dafo{
margin-top:50px;
}

.bt-dafo-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
}

.bt-dafo-box{
background:white;
border:1px solid #E8EEF6;
border-radius:10px;
padding:20px;
}

.bt-dafo-box h3{
margin-top:0;
margin-bottom:12px;
font-size:16px;
}

.bt-dafo-box ul{
margin:0;
padding-left:18px;
}

.bt-dafo-box li{
margin-bottom:6px;
}

/* =====================================================
RESPONSIVE
===================================================== */

@media (max-width:768px){

.bt-step-card{
padding:20px;
}

.bt-btn-row{
flex-direction:column;
}

.bt-dafo-grid{
grid-template-columns:1fr;
}

.bt-progress{
flex-wrap:wrap;
}

}