/* Pre-results question and leave survey. Shared by the homepage and calculator pages. */
.funnel-modal{
  position:fixed; inset:0; z-index:140;
  display:flex; align-items:flex-end; justify-content:center;
  padding:16px;
  opacity:0; pointer-events:none;
  transition:opacity .2s ease;
}
.funnel-modal.open{ opacity:1; pointer-events:auto; }
.funnel-backdrop{
  position:absolute; inset:0;
  background:rgba(10,16,14,0.55);
}
.funnel-panel{
  position:relative;
  width:min(440px, 100%);
  max-height:min(92vh, 760px);
  overflow:auto;
  background:#fff;
  border-radius:28px;
  padding:28px 22px 22px;
  box-shadow:0 24px 60px -20px rgba(10,16,14,0.45);
}
.funnel-modal.open .funnel-panel{ animation:funnel-in .22s ease; }
@keyframes funnel-in{
  from{ transform:translateY(12px); opacity:0.6; }
  to{ transform:none; opacity:1; }
}
.funnel-top{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:8px;
}
.funnel-step{
  font-family:'IBM Plex Mono', ui-monospace, monospace;
  font-size:12px; font-weight:600; letter-spacing:0.08em;
  text-transform:uppercase; color:#698279;
}
.funnel-close{
  width:36px; height:36px; border-radius:50%;
  border:1px solid rgba(31,54,46,0.14);
  background:#fff; color:#1F362E; cursor:pointer;
  display:grid; place-items:center;
  margin-left:auto;
}
.funnel-close svg{ width:16px; height:16px; }
.funnel-panel h2{
  font-family:'Space Grotesk', 'Inter', sans-serif;
  font-size:28px; line-height:1.15; letter-spacing:-0.03em;
  margin:8px 0 8px; color:#0a0a0a;
}
.funnel-sub{
  margin:0 0 18px; color:#6b6b6b; font-size:15px; line-height:1.45;
}
.hl-calc{
  background:#c8f5c4;
  color:#14532d;
  border-radius:8px;
  padding:0 0.28em;
}
.usage-options{ display:flex; flex-direction:column; gap:10px; }
.usage-option{
  display:flex; align-items:center; gap:14px;
  width:100%; text-align:left;
  border:none; border-radius:16px;
  padding:16px 16px;
  background:#ececee; color:#111;
  font-weight:650; font-size:16px; cursor:pointer;
  font-family:'Inter', system-ui, sans-serif;
}
.usage-option.selected{ background:#e0e0e3; }
.usage-dot{
  width:24px; height:24px; border-radius:50%;
  border:2px solid #c8c8cc; background:#fff;
  display:grid; place-items:center; flex-shrink:0;
}
.usage-option.selected .usage-dot{
  background:#111; border-color:#111;
}
.usage-option.selected .usage-dot::after{
  content:'';
  width:10px; height:6px;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(-45deg) translate(1px, -1px);
}
.usage-continue{
  margin-top:18px; width:100%;
  border:none; border-radius:14px;
  background:#1F362E; color:#fff;
  font-weight:700; font-size:17px;
  padding:16px 18px; cursor:pointer;
  font-family:'Inter', system-ui, sans-serif;
}
.usage-continue:disabled{ opacity:0.45; cursor:default; }
.leave-options{ display:flex; flex-direction:column; gap:8px; }
.leave-option{
  width:100%; text-align:left;
  border:1px solid rgba(31,54,46,0.1);
  background:#f4f7f5; color:#0a0a0a;
  border-radius:14px; padding:14px 16px;
  font-weight:650; font-size:15.5px; cursor:pointer;
  font-family:'Inter', system-ui, sans-serif;
}
.leave-option:hover{ background:#e7f6e4; border-color:#b7e4b0; }
@media (min-width:720px){
  .funnel-modal{ align-items:center; }
}