.eligibility-section{
padding:54px 0 70px;
background:
linear-gradient(135deg, rgba(255, 122, 19, .10), rgba(37, 99, 235, .10)),
#f4f7fb;
}

.eligibility-hero{
max-width:860px;
margin:0 auto 24px;
text-align:center;
}

.eligibility-hero span{
display:inline-flex;
padding:8px 14px;
border:1px solid #ffd4a6;
border-radius:999px;
background:#fff7ed;
color:#b45309;
font-weight:800;
font-size:13px;
}

.eligibility-hero .page-title{
margin:0 0 10px;
font-size:clamp(30px, 4vw, 48px);
line-height:1.08;
color:#07152f;
}

.eligibility-hero p{
margin:0 auto;
max-width:720px;
color:#52627a;
font-size:16px;
line-height:1.6;
}

.eligibility-card{
display:grid;
grid-template-columns:minmax(320px, 430px) 1fr;
gap:26px;
background:rgba(255,255,255,.94);
padding:26px;
border:1px solid #d8e6f7;
border-radius:24px;
box-shadow:0 24px 70px rgba(15,23,42,.10);
}

.form-side{
display:flex;
flex-direction:column;
gap:10px;
}

.form-side label{
color:#0f2547;
font-weight:800;
font-size:13px;
}

.form-side input,
.form-side select{
min-height:44px;
padding:10px 12px;
border:1px solid #cfe0f4;
border-radius:12px;
background:#fff;
color:#07152f;
font-size:14px;
outline:none;
}

.form-side input:focus,
.form-side select:focus{
border-color:#2563eb;
box-shadow:0 0 0 4px rgba(37,99,235,.10);
}

.form-side input:disabled{
background:#eef2f7;
color:#64748b;
cursor:not-allowed;
}

.eligibility-checkline{
display:flex !important;
align-items:center;
gap:10px;
padding:11px 12px;
border:1px solid #d8e6f7;
border-radius:12px;
background:#f8fbff;
font-size:13px;
}

.eligibility-checkline input{
width:16px !important;
height:16px !important;
min-height:16px !important;
padding:0 !important;
}

.coapplicant-box{
display:grid;
gap:9px;
margin-top:8px;
padding:14px;
border:1px dashed #f6b36f;
border-radius:16px;
background:linear-gradient(135deg, #fffaf4, #f4f8ff);
}

.coapplicant-box h3{
margin:0 0 4px;
font-size:15px;
color:#07152f;
}

.coapplicant-box small{
color:#64748b;
font-weight:700;
}

.check-btn{
margin-top:12px;
min-height:48px;
border:0;
border-radius:14px;
background:linear-gradient(135deg, #0b3c6f, #2563eb);
color:#fff;
font-weight:900;
font-size:15px;
cursor:pointer;
box-shadow:0 14px 28px rgba(37,99,235,.22);
}

.result-side{
text-align:center;
padding:8px 4px;
}

.result-side h2{
margin:8px 0 6px;
font-size:clamp(34px, 5vw, 56px);
line-height:1;
color:#0b3c6f;
}

.result-side .sub{
margin:0;
color:#64748b;
font-weight:800;
}

.metrics{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;
margin:24px 0;
}

.metric-box{
padding:14px 10px;
border:1px solid #d8e6f7;
border-radius:16px;
background:linear-gradient(135deg, #ffffff, #f4f8ff);
box-shadow:0 12px 28px rgba(15,23,42,.05);
}

.metric-box span{
display:block;
font-size:18px;
font-weight:900;
color:#0b3c6f;
}

.metric-box p{
margin:7px 0 0;
color:#64748b;
font-size:12px;
font-weight:700;
}

.gauge-wrap{
height:150px;
position:relative;
width:min(300px, 80vw);
margin:22px auto;
}

.gauge-wrap canvas{
width:100% !important;
height:100% !important;
}

.gauge-center{
position:absolute;
top:54%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
}

.gauge-center span{
font-size:28px;
font-weight:900;
color:#0b3c6f;
}

.gauge-center p{
margin:4px 0 0;
color:#64748b;
font-size:12px;
font-weight:800;
}

.eligibility-breakdown{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
margin:14px auto 16px;
max-width:620px;
}

.eligibility-breakdown div{
padding:12px;
border:1px solid #d8e6f7;
border-radius:14px;
background:#fff;
}

.eligibility-breakdown span{
display:block;
color:#64748b;
font-size:12px;
font-weight:800;
}

.eligibility-breakdown strong{
display:block;
margin-top:5px;
color:#07152f;
font-size:16px;
}

.note{
max-width:720px;
margin:0 auto;
padding:12px 14px;
border:1px solid #fed7aa;
border-radius:14px;
background:#fff7ed;
color:#6b3a0a;
font-size:13px;
line-height:1.5;
}

.loan-recommend{
margin-top:24px;
text-align:center;
}

.loan-recommend h3{
margin:0 0 12px;
font-size:22px;
color:#07152f;
}

.recommend-card{
background:linear-gradient(135deg, #f4f8ff, #fff7ed);
padding:22px;
border:1px solid #d8e6f7;
border-radius:18px;
box-shadow:0 14px 36px rgba(15,23,42,.06);
}

.recommend-card h2{
color:#0b3c6f;
font-size:26px;
margin:0 0 8px;
}

.recommend-card p{
margin:0 auto;
max-width:660px;
color:#52627a;
line-height:1.55;
}

.eligibility-actions{
display:flex;
justify-content:center;
align-items:center;
gap:12px;
flex-wrap:wrap;
margin-top:16px;
}

.eligibilityapply-btn,
.eligibilitypdf-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:44px;
padding:11px 22px;
border-radius:999px;
text-decoration:none;
font-weight:900;
cursor:pointer;
}

.eligibilityapply-btn{
background:linear-gradient(135deg, #0b3c6f, #2563eb);
color:#fff;
}

.eligibilitypdf-btn{
border:1px solid #ffb366;
background:linear-gradient(135deg, #fff7ed, #ffe5c2);
color:#0b3c6f;
}

.eligibilityapply-btn.disabled,
.eligibilitypdf-btn.disabled{
pointer-events:none;
opacity:.5;
cursor:not-allowed;
}

@media(max-width:900px){
.eligibility-card{
grid-template-columns:1fr;
}

.metrics{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}

@media(max-width:700px){
html,
body{
overflow-x:hidden;
}

.eligibility-section{
padding:28px 10px 58px;
}

.eligibility-hero{
text-align:left;
margin-bottom:18px;
}

.eligibility-hero .page-title{
font-size:28px;
}

.eligibility-hero p{
font-size:13px;
}

.eligibility-card{
width:100%;
max-width:100%;
box-sizing:border-box;
gap:18px;
padding:16px;
border-radius:18px;
overflow:hidden;
}

.form-side,
.result-side{
width:100%;
min-width:0;
}

.form-side{
display:grid;
grid-template-columns:1fr;
gap:8px;
}

.form-side label{
font-size:12px;
}

.form-side input,
.form-side select,
.form-side button{
width:100%;
max-width:100%;
box-sizing:border-box;
font-size:12px;
}

.result-side h2{
font-size:30px;
overflow-wrap:anywhere;
}

.metrics{
grid-template-columns:1fr;
gap:8px;
margin:18px 0;
}

.metric-box{
padding:12px;
}

.metric-box span{
font-size:16px;
}

.gauge-wrap{
width:min(230px, 76vw);
height:122px;
margin:18px auto;
}

.gauge-center span{
font-size:22px;
}

.gauge-center p{
font-size:11px;
}

.eligibility-breakdown{
grid-template-columns:1fr;
}

.loan-recommend{
margin-top:18px;
}

.recommend-card{
padding:16px;
}

.recommend-card h2{
font-size:22px;
}

.eligibility-actions{
display:grid;
grid-template-columns:1fr;
}

.eligibilityapply-btn,
.eligibilitypdf-btn{
width:100%;
box-sizing:border-box;
padding:12px 16px;
}
}

/* Compact density pass: normal zoom should feel close to the previous 80% browser zoom. */
.eligibility-section{
padding:30px 0 44px !important;
}

.eligibility-hero{
margin-bottom:16px !important;
}

.eligibility-hero .page-title{
font-size:clamp(26px, 3.2vw, 38px) !important;
}

.eligibility-card{
grid-template-columns:minmax(280px, 360px) minmax(0, 1fr) !important;
gap:18px !important;
padding:18px !important;
border-radius:18px !important;
box-shadow:0 16px 42px rgba(15,23,42,.08) !important;
}

.form-side{
gap:7px !important;
}

.form-side label{
font-size:11.5px !important;
}

.form-side input,
.form-side select{
min-height:36px !important;
padding:7px 10px !important;
border-radius:10px !important;
font-size:12px !important;
}

.eligibility-checkline{
padding:8px 10px !important;
border-radius:10px !important;
font-size:11.5px !important;
}

.coapplicant-box{
gap:7px !important;
margin-top:5px !important;
padding:10px !important;
border-radius:12px !important;
}

.coapplicant-box h3{
font-size:13px !important;
}

.check-btn{
min-height:38px !important;
margin-top:8px !important;
border-radius:11px !important;
font-size:12.5px !important;
}

.result-side h2{
font-size:clamp(26px, 3.4vw, 38px) !important;
}

.result-side .sub{
font-size:12px !important;
}

.metrics{
gap:8px !important;
margin:14px 0 !important;
}

.metric-box{
padding:9px 8px !important;
border-radius:12px !important;
}

.metric-box span{
font-size:14px !important;
}

.metric-box p{
font-size:10px !important;
margin-top:5px !important;
}

.gauge-wrap{
width:min(230px, 70vw) !important;
height:112px !important;
margin:12px auto !important;
}

.gauge-center span{
font-size:20px !important;
}

.gauge-center p{
font-size:10px !important;
}

.eligibility-breakdown{
gap:7px !important;
margin:8px auto 10px !important;
}

.eligibility-breakdown div{
padding:8px !important;
border-radius:11px !important;
}

.eligibility-breakdown span{
font-size:10px !important;
}

.eligibility-breakdown strong{
font-size:13px !important;
}

.note{
padding:9px 11px !important;
border-radius:11px !important;
font-size:11px !important;
}

.loan-recommend{
margin-top:14px !important;
}

.loan-recommend h3{
font-size:17px !important;
margin-bottom:8px !important;
}

.recommend-card{
padding:14px !important;
border-radius:14px !important;
}

.recommend-card h2{
font-size:19px !important;
}

.recommend-card p{
font-size:12px !important;
line-height:1.45 !important;
}

.eligibility-actions{
gap:8px !important;
margin-top:12px !important;
}

.eligibilityapply-btn,
.eligibilitypdf-btn{
min-height:36px !important;
padding:8px 16px !important;
font-size:12px !important;
}

@media(max-width:900px){
.eligibility-card{
grid-template-columns:1fr !important;
}
}

@media(max-width:700px){
.eligibility-section{
padding:18px 8px 42px !important;
}

.eligibility-hero .page-title{
font-size:24px !important;
}

.eligibility-card{
gap:13px !important;
padding:12px !important;
border-radius:15px !important;
}

.metrics{
grid-template-columns:1fr !important;
}

.gauge-wrap{
width:min(210px, 72vw) !important;
height:108px !important;
}
}
