/* ---------- Flight-path progress ---------- */
.journey{max-width:760px; margin:16px auto 0; padding:0 20px;}
.journey-track{position:relative; height:28px;}
.journey-line{position:absolute; top:13px; left:14px; right:14px; height:2px; background-image:linear-gradient(to right, #9FD1E8 0 6px, transparent 6px 12px); background-size:12px 2px; background-repeat:repeat-x;}
.journey-line-fill{position:absolute; top:13px; left:14px; height:2px; background:var(--sky-mida); transition:width .45s ease; border-radius:2px;}
.journey-plane{position:absolute; top:3px; width:20px; height:20px; transform:translateX(-50%); transition:left .45s ease; filter:drop-shadow(0 2px 4px rgba(0,0,0,.15));}
.journey-steps{display:flex; justify-content:space-between; margin: 4px 0 20px;}
.journey-step{font-family:'JetBrains Mono',monospace; font-size:11px; font-weight: 700; color:#5C7C8C; width:14px; text-align:center;}
.journey-step.active{color:#034aa7; font-size: 11px; font-weight:700;}
.journey-step.done{color:#2E8FC4; font-size: 11px; font-weight:600;}

/* ---------- Screens ---------- */
.screen{display:none; animation:fadeUp .4s ease;}
.screen.active{display:block;}
@keyframes fadeUp{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);}}
@media (prefers-reduced-motion: reduce){
  .screen{animation:none;}
  .journey-line-fill,.journey-plane{transition:none;}
}

.saf-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:'Work Sans',sans-serif; font-weight:600; font-size:16px;
  padding:15px 30px; border-radius:14px; border:none; cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  text-decoration:none;
}
.saf-btn:active{transform:scale(0.98);}
.saf-btn-primary{background:var(--green); color:#fff;}
.saf-btn:focus-visible{outline:3px solid #4FA8D8; outline-offset:2px;}

/* ---------- Question card ---------- */
.q-card{background:#FFFFFF; border-radius:20px; box-shadow:0 10px 30px rgba(15,70,95,0.10); padding:9px 20px; margin-top:12px;}
.q-step{font-family:'JetBrains Mono',monospace; font-size:11px; color:#034aa7; font-weight:600; letter-spacing:.08em; margin-bottom:6px;}
.q-title{font-size:clamp(17px,3.4vw,20px); margin-bottom:12px; line-height:1.28;}
.q-panel{display:none;}
.q-panel.active{display:block; animation:fadeUp .3s ease;}

.option{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  width:100%; height:100%; text-align:left; background:#E1F1F9; border:2px solid transparent;
  border-radius:12px; padding:11px 14px; cursor:pointer; font-family:'Work Sans',sans-serif;
  font-size:14px; font-weight:500; color:#0B3245; transition:all .15s ease;
}
.option:hover{background:#CDE9F5; border-color:#9FD1E8;}
.option.selected{background:#fff; border-color:var(--sky-mida);}
.option .check{width:18px; height:18px; border-radius:50%; border:2px solid #9FD1E8; flex-shrink:0; display:flex; align-items:center; justify-content:center;}
.option.selected .check{border-color:var(--sky-mida); background:var(--sky-mida);}
.option.selected .check::after{content:''; width:7px; height:7px; border-radius:50%; background:#fff;}
.option-sub{display:block; font-size:11.5px; color:#5C7C8C; font-weight:400; margin-top:2px;}

.q-nav{display:flex; justify-content:space-between; align-items:center; margin-top:12px;}
.link-back{font-size:14px; color:#5C7C8C; background:none; border:none; cursor:pointer; font-family:'Work Sans',sans-serif; font-weight:600; padding:8px 4px;}
.link-back:hover{color:#1B4B66;}
.link-back:disabled{opacity:0; pointer-events:none;}

/* ---------- Results Modal ---------- */
.screen#results-screen.active{
display:flex;
position:fixed;
inset:0;
z-index:99999;
background:rgba(11,50,69,0.55);
align-items:center;
justify-content:center;
padding:16px;
}

.results-modal{
background:#F7FBFD;
border-radius:20px;
width:100%;
max-width:1140px;
max-height:92vh;
overflow-y:auto;
padding:22px 16px 18px;
position:relative;
box-shadow:0 30px 70px rgba(0,0,0,.35);
}

.modal-close{
position:absolute; top:14px; right:16px;
width:32px; height:32px; border-radius:50%;
border:none; background:#E1F1F9; color:#1B4B66;
font-size:16px; line-height:1; cursor:pointer;
}
.modal-close:hover{background:#CDE9F5;}

#results-screen h2,
#results-screen h3{font-size:clamp(24px,5vw,30px); margin-bottom:6px;}
.results-sub{color:#5C7C8C; font-size:15px; margin-bottom:20px; line-height:1.55;}

/* 3-across compact grid */
#planList{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
margin-top:14px;
}


/* ----------Icon Code ----------*/

.opt-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:#cfdde6;color:#034aa7;flex-shrink:0;border:1px solid #c5dff8;}
.opt-icon .material-symbols-outlined{font-size:16px;}
.opt-body{display:flex;flex-direction:column;}
.ins-card-badge.med{background:#009688;color:#fff;}
.ins-card-badge.trip{background:#6a86b1;color:#fff;}

/* ---------- Plan cards (compact, modal-only) ---------- */

.plan-card.best{border-color:var(--sky-mida); box-shadow:0 10px 26px rgba(255,139,103,0.18);}

.best-badge{
display:none; position:absolute; top:0; right:0; background:var(--primary-light); color:#fff;
font-size:8px; font-weight:600; letter-spacing:.06em; padding:4px 10px; border-radius:0 0 0 14px;
}
.plan-card.best .best-badge{display:block;}

.plan-top{padding:8px 10px 10px;}
.plan-head{display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:6px;}
.plan-name1{font-size:15px; margin-bottom:1px; font-weight: 600;}
.plan-insurer{font-size:10px; color:#5C7C8C; text-transform:uppercase; letter-spacing:.05em; font-weight: 500;}


.stat-grid{
  margin:10px 0 2px;
  padding:10px 8px;
  background:#E1F1F9;
  border-radius:12px;
}
.stat{text-align:center; padding:0 2px;}
.stat .v{
  font-size:12.5px;
  font-weight:600;
  color:#0B3245;
  white-space:normal;      /* was nowrap — let long values wrap */
  line-height:1.25;
  min-height:2.5em;         /* reserves 2 lines so short/long values still align at the bottom */
  display:flex;
  align-items:center;
  justify-content:center;
}
.stat .k{
  font-size:9.5px;
  font-weight:700;
  color:#5C7C8C;
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-top:3px;
  white-space:nowrap;       /* keep labels on one line */
}

@media (max-width: 991px){
  .stat .k{ font-size:8.5px; }
  .stat .v{ font-size:11.5px; }
}

.why{margin:10px 0 0;}
.why-title{font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:#2E8FC4; font-weight:700; margin-bottom:4px;}


.plan-bottom{
display:flex; flex-direction:row; align-items:center; gap:6px;
padding:10px 14px; margin-top:auto;
border-top:1.5px dashed #C7E3EF; background:#FBFEFF;
}
.plan-bottom .saf-btn{padding:8px 10px; font-size:12.5px; min-width:0; flex:0 0 auto; width:auto;}
.saf-btn-outline{background:#fff; color:#1B4B66; border:1.5px solid #9FD1E8;}
.saf-btn-outline:hover{background:#E1F1F9;}
.plan-bottom .saf-btn-primary{
margin-left:auto;
background:var(--green); color:#fff;
}

/* ---------- Footer / disclaimer ---------- */
.results-footer{margin-top:16px; text-align:center;}
.results-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:16px;}
.results-actions .btn{padding:10px 20px; font-size:13.5px;}

/* ---------- Mobile fallback ---------- */
@media (max-width:900px){
#planList{grid-template-columns:1fr;}
}

.results-actions {
display: flex; 
gap: 12px; 
justify-content: center; 
flex-wrap: wrap; 
margin-bottom: 16px;
}

.results-actions .btn {
padding: 10px 20px; 
font-size: 13.5px;
}

.plan-article .pa-header {
    border-left: 3px solid var(--sky);
}
