@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=DM+Sans:wght@400;500;600;700&display=swap');

.cgb-app{
  --g:#00841c; --g-dark:#056619; --g-deep:#08381a;
  --ink:#16261b; --soft:#4a5a4f; --cream:#f5f3e8; --card:#fff;
  --line:rgba(8,56,26,.14); --radius:16px;
  --disp:'Fraunces',Georgia,serif; --body:'DM Sans',system-ui,sans-serif;
  font-family:var(--body); color:var(--ink); max-width:760px; margin:0 auto;
}
.cgb-app *{box-sizing:border-box}
.cgb-loading{padding:60px 0;text-align:center;color:var(--soft)}

/* progress */
.cgb-prog{display:flex;gap:8px;margin-bottom:28px}
.cgb-prog .seg{height:6px;flex:1;border-radius:999px;background:rgba(8,56,26,.12)}
.cgb-prog .seg.on{background:var(--g)}
.cgb-stepname{font-family:var(--disp);font-weight:600;font-size:1.7rem;line-height:1.1;letter-spacing:-.01em;margin:0 0 6px}
.cgb-stepsub{color:var(--soft);margin:0 0 24px;font-size:1.02rem}

/* service cards */
.cgb-opts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.cgb-opts{grid-template-columns:1fr}}
.cgb-opt{position:relative;border:1.5px solid var(--line);border-radius:var(--radius);padding:18px 18px 18px 50px;cursor:pointer;background:var(--card);transition:.18s}
.cgb-opt:hover{border-color:var(--g)}
.cgb-opt.sel{border-color:var(--g);background:rgba(0,132,28,.05);box-shadow:0 0 0 1px var(--g) inset}
.cgb-opt .tick{position:absolute;left:16px;top:18px;width:22px;height:22px;border-radius:6px;border:1.5px solid var(--line);display:grid;place-items:center}
.cgb-opt.sel .tick{background:var(--g);border-color:var(--g)}
.cgb-opt.sel .tick:after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);margin-top:-2px}
.cgb-opt h4{margin:0 0 3px;font-family:var(--disp);font-weight:600;font-size:1.12rem}
.cgb-opt p{margin:0;color:var(--soft);font-size:.9rem}
.cgb-opt .price{display:block;margin-top:8px;font-weight:600;color:var(--g-dark);font-size:.92rem}

/* pill selects (size/frequency/slots) */
.cgb-pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.cgb-pill{border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:11px 20px;cursor:pointer;font-weight:500;font-family:var(--body);font-size:.97rem;transition:.18s}
.cgb-pill:hover{border-color:var(--g)}
.cgb-pill.sel{background:var(--g);border-color:var(--g);color:#fff}
.cgb-fieldlabel{font-weight:600;margin:22px 0 10px;font-size:1.02rem}
.cgb-fieldlabel:first-child{margin-top:0}

/* date + slots */
.cgb-date{padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;font-family:var(--body);font-size:1rem;width:100%;max-width:280px}
.cgb-slots{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.cgb-noslots{color:var(--soft);margin-top:14px}

/* estimate */
.cgb-est{background:var(--g-deep);color:#fff;border-radius:var(--radius);padding:28px;text-align:center;margin-bottom:18px}
.cgb-est .big{font-family:var(--disp);font-weight:600;font-size:2.6rem;line-height:1;margin:6px 0}
.cgb-est small{color:#bff0c4;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;font-weight:600}
.cgb-summary{border:1px solid var(--line);border-radius:var(--radius);padding:6px 20px;margin-bottom:18px}
.cgb-summary .row{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.cgb-summary .row:last-child{border-bottom:0}
.cgb-summary .row span:first-child{color:var(--soft)}
.cgb-summary .row span:last-child{font-weight:600;text-align:right}
.cgb-disc{font-size:.86rem;color:var(--soft);background:rgba(216,162,63,.1);border:1px solid rgba(216,162,63,.3);border-radius:12px;padding:13px 16px}

/* form */
.cgb-form{display:grid;gap:15px}
.cgb-form .two{display:grid;grid-template-columns:1fr 1fr;gap:15px}
@media(max-width:560px){.cgb-form .two{grid-template-columns:1fr}}
.cgb-form label{display:block;font-weight:600;font-size:.9rem;margin-bottom:6px}
.cgb-form input,.cgb-form textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:11px;font-family:var(--body);font-size:1rem}
.cgb-form input:focus,.cgb-form textarea:focus{outline:0;border-color:var(--g)}
.cgb-hp{position:absolute;left:-9999px}

/* nav buttons */
.cgb-nav{display:flex;justify-content:space-between;align-items:center;margin-top:26px;gap:14px}
.cgb-btn{font-family:var(--body);font-weight:600;font-size:1rem;padding:13px 26px;border-radius:999px;border:0;cursor:pointer;transition:.18s}
.cgb-btn-primary{background:var(--g);color:#fff}
.cgb-btn-primary:hover{background:var(--g-dark)}
.cgb-btn-primary:disabled{opacity:.45;cursor:not-allowed}
.cgb-btn-back{background:transparent;color:var(--soft)}
.cgb-btn-back:hover{color:var(--ink)}
.cgb-runest{font-weight:600;color:var(--g-dark)}

/* confirmation */
.cgb-done{text-align:center;padding:20px 0}
.cgb-done .ico{width:74px;height:74px;border-radius:50%;background:rgba(0,132,28,.12);display:grid;place-items:center;margin:0 auto 20px}
.cgb-done .ico:after{content:"";width:20px;height:34px;border:solid var(--g);border-width:0 5px 5px 0;transform:rotate(45deg);margin-top:-6px}
.cgb-done h2{font-family:var(--disp);font-weight:600;font-size:2rem;margin:0 0 10px}
.cgb-done p{color:var(--soft);max-width:30em;margin:0 auto 8px}
.cgb-done .ref{display:inline-block;margin-top:14px;background:var(--cream);border:1px solid var(--line);border-radius:10px;padding:10px 18px;font-weight:600}
.cgb-err{color:#b3261e;background:#fdeceb;border:1px solid #f3c2bf;border-radius:11px;padding:12px 15px;margin-top:14px;font-size:.94rem}