/* ============================================================
   Project Cost Estimator
   ============================================================ */
.est-grid{display:grid;grid-template-columns:1.32fr .9fr;gap:clamp(1.6rem,3vw,2.6rem);align-items:start}
@media(max-width:880px){.est-grid{grid-template-columns:1fr}}

.est-form fieldset{border:0;margin:0 0 1.9rem;padding:0}
.est-form legend{font-family:var(--display);font-weight:700;font-size:var(--fs-md);letter-spacing:-.01em}
.est-q-sub{font-size:var(--fs-sm);color:var(--ink-3);margin:.15rem 0 1rem}
.opt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
@media(max-width:540px){.opt-grid{grid-template-columns:1fr}}
.opt{position:relative;display:block;cursor:pointer}
.opt input{position:absolute;inset:0;opacity:0;cursor:pointer}
.opt .opt-card{display:flex;gap:.75rem;align-items:flex-start;padding:1rem 1.1rem;border:1.5px solid var(--line);border-radius:var(--r);background:var(--card);transition:border-color .18s,background .18s;height:100%}
.opt .opt-ic{width:34px;height:34px;border-radius:8px;background:var(--paper-2);color:var(--ink-2);display:grid;place-items:center;flex-shrink:0;transition:background .18s,color .18s}
.opt .opt-ic svg{width:19px;height:19px}
.opt .opt-t{display:block;font-weight:600;font-size:var(--fs-sm);line-height:1.2}
.opt .opt-d{display:block;font-size:var(--fs-xs);color:var(--ink-3);margin-top:2px;line-height:1.3}
.opt input:checked + .opt-card{border-color:var(--accent);background:var(--accent-050)}
.opt input:checked + .opt-card .opt-ic{background:var(--accent);color:#fff}
.opt input:focus-visible + .opt-card{outline:2.5px solid var(--accent);outline-offset:2px}

/* result panel */
.est-result{position:sticky;top:90px;background:var(--navy);color:var(--on-navy);border-radius:var(--r-xl);padding:clamp(1.6rem,2.8vw,2.1rem);box-shadow:var(--sh-3);overflow:hidden}
.est-toggle{display:inline-flex;background:rgba(255,255,255,.08);border:1px solid var(--line-navy);border-radius:var(--r-pill);padding:.25rem;margin-bottom:1.4rem}
.est-toggle button{padding:.42rem .95rem;border-radius:var(--r-pill);font-size:var(--fs-xs);font-weight:600;color:var(--on-navy-mute);transition:background .2s,color .2s}
.est-toggle button.on{background:#fff;color:var(--navy)}
.er-plan{font-family:var(--label);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:var(--fs-xs);color:#9fc0ff;margin-bottom:.55rem}
.er-price{font-family:var(--display);font-weight:800;font-size:clamp(2.5rem,6vw,3.3rem);line-height:1;color:#fff;letter-spacing:-.03em}
.er-price small{font-size:var(--fs-md);font-weight:500;color:var(--on-navy-mute);letter-spacing:0}
.er-billed{font-size:var(--fs-sm);color:var(--on-navy-mute);margin-top:.45rem}
.er-save{display:inline-block;margin-top:.6rem;background:var(--good);color:#fff;font-size:var(--fs-xs);font-weight:700;padding:.22rem .65rem;border-radius:var(--r-pill)}
.er-breakdown{margin-top:.75rem;font-size:var(--fs-xs);color:var(--on-navy-mute)}
.er-setup{margin-top:1.1rem;padding-top:1.1rem;border-top:1px solid var(--line-navy);font-size:var(--fs-sm);color:var(--on-navy)}
.er-setup b{color:#fff}
.er-inc{margin:1.1rem 0 1.3rem;display:flex;flex-direction:column;gap:.5rem}
.er-inc li{display:flex;gap:.5rem;font-size:var(--fs-sm);color:var(--on-navy)}
.er-inc li svg{width:16px;height:16px;color:#4ad6b4;flex-shrink:0;margin-top:3px}
.est-result .btn{width:100%;justify-content:center}
.er-note{font-size:var(--fs-xs);color:var(--on-navy-mute);margin-top:.9rem;text-align:center}
.er-flash{animation:erflash .4s var(--ease)}
@keyframes erflash{0%{transform:scale(.985)}100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.er-flash{animation:none}}

/* Save / email this estimate — integrated tool footer, sits directly under the grid */
.est-save{margin-top:clamp(1.1rem,2.2vw,1.7rem);display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.3rem,3vw,2.4rem);align-items:center;background:var(--accent-050);border:1.5px solid rgba(31,84,224,.18);border-radius:var(--r-lg);padding:clamp(1.3rem,2.8vw,1.9rem)}
@media(max-width:760px){.est-save{grid-template-columns:1fr;gap:1.15rem}}
.est-save-head{display:flex;gap:.9rem;align-items:flex-start}
.ess-ic{width:40px;height:40px;border-radius:10px;background:var(--accent);color:#fff;display:grid;place-items:center;flex-shrink:0}
.ess-ic svg{width:20px;height:20px}
.est-save-head h3{font-family:var(--display);font-weight:700;font-size:var(--fs-md);letter-spacing:-.01em;line-height:1.2}
.est-save-head p{font-size:var(--fs-sm);color:var(--ink-2);margin-top:.3rem;max-width:40ch}
.est-save-form{display:flex;flex-direction:column;gap:.7rem}
.est-save-form .ee-fields{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
@media(max-width:460px){.est-save-form .ee-fields{grid-template-columns:1fr}}
.est-save-form input[type=text],.est-save-form input[type=email]{width:100%;padding:.74rem .9rem;border:1.5px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);font-size:var(--fs-base)}
.est-save-form input::placeholder{color:var(--ink-3)}
.est-save-form input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-050)}
.est-save-form .btn{align-self:flex-start}
.est-save-form .btn svg{width:16px;height:16px}
.est-save .ee-status{font-size:var(--fs-sm);font-weight:600;margin:0;min-height:1.1em}
.est-save .ee-status.ok{color:var(--good)}
.est-save .ee-status.err{color:var(--bad)}
.est-save .ee-fine{font-size:var(--fs-xs);color:var(--ink-3);margin:0}
.est-save .ee-fine a{color:var(--accent-ink);text-decoration:underline}
