/* Free shop scorecard — light brand, more pop (one green palette) */
:root{
  --bg:#F3F8F5;
  --bg2:#E7F3EC;
  --card:#ffffff;
  --text:#12151A;
  --muted:#5A6570;
  --brand:#0B6E4F;
  --brand2:#095C42;
  --brand-deep:#074C38;
  --brand-soft:#D8F0E4;
  --brand-soft2:#EAF7F1;
  --border:#D5E5DC;
  --input:#F7FBF9;
  --shadow:0 10px 28px rgba(11,110,79,.10), 0 2px 6px rgba(18,21,26,.06);
  --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
body{
  margin:0;font-family:var(--font);color:var(--text);line-height:1.5;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(900px 420px at 50% -10%, color-mix(in srgb, var(--brand) 18%, transparent), transparent 60%),
    linear-gradient(180deg, var(--bg2), var(--bg) 38%, #FAFBFC);
}
.demo-banner{
  background:linear-gradient(90deg, var(--brand-deep), var(--brand) 55%, #0F8A61);
  color:#fff;text-align:center;padding:.65rem 1rem;
  font-size:.8rem;font-weight:800;letter-spacing:.01em;
  box-shadow:0 4px 14px rgba(11,110,79,.25);
}
.wrap{width:min(440px,calc(100% - 1.5rem));margin:0 auto;padding:1.15rem 0 1.25rem}
h1{font-size:1.5rem;margin:.35rem 0 .45rem;letter-spacing:-.03em;color:var(--text);font-weight:850}
.sub{color:var(--muted);margin:0 0 1.15rem;font-size:.95rem}
.card{
  position:relative;background:var(--card);border-radius:18px;padding:1.25rem 1.2rem 1.3rem;
  margin-bottom:1rem;border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden;
}
.card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:5px;
  background:linear-gradient(90deg, var(--brand-deep), var(--brand), #1AA87A);
}
label{display:block;font-weight:700;margin:.75rem 0 .35rem;font-size:.9rem;color:var(--text)}
input,textarea{
  width:100%;min-height:50px;border-radius:12px;border:1.5px solid var(--border);
  background:var(--input);color:var(--text);padding:.75rem .9rem;font:inherit;
  transition:border-color .15s, box-shadow .15s, background .15s;
}
input:hover,textarea:hover{border-color:color-mix(in srgb,var(--brand) 35%,var(--border))}
input:focus-visible,textarea:focus-visible,.choice:focus-visible{
  outline:none;border-color:var(--brand);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 22%,#fff);
  background:#fff;
}
.choices{display:grid;gap:.55rem;margin:.55rem 0 1rem}
.choice{
  display:block;width:100%;text-align:left;min-height:52px;padding:.85rem 1rem;border-radius:14px;
  border:1.5px solid var(--border);background:#fff;color:var(--text);font:inherit;font-weight:700;cursor:pointer;
  box-shadow:0 1px 2px rgba(18,21,26,.04);transition:border-color .15s, background .15s, transform .12s, box-shadow .15s;
}
.choice:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--border));transform:translateY(-1px);box-shadow:0 6px 14px rgba(11,110,79,.08)}
.choice.selected{
  border-color:var(--brand);background:linear-gradient(180deg, #fff, var(--brand-soft2));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,#fff), 0 8px 18px rgba(11,110,79,.12);
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:52px;
  border-radius:999px;border:0;font:inherit;font-weight:850;cursor:pointer;margin-top:.85rem;
  transition:transform .12s, filter .12s, box-shadow .15s;
}
.btn-primary{
  background:linear-gradient(180deg, #12966A, var(--brand) 55%, var(--brand2));
  color:#fff;box-shadow:0 10px 22px rgba(11,110,79,.28), inset 0 1px 0 rgba(255,255,255,.25);
}
.btn-primary:hover{filter:brightness(1.03);transform:translateY(-1px)}
.btn-ghost{background:#fff;color:var(--text);border:1.5px solid var(--border);margin-top:.55rem}
.btn-ghost:hover{border-color:color-mix(in srgb,var(--brand) 40%,var(--border));background:var(--brand-soft2)}
.step-dot{display:flex;gap:.4rem;margin:0 0 1.05rem}
.step-dot span{
  height:8px;flex:1;border-radius:99px;background:rgba(11,110,79,.12);
  box-shadow:inset 0 1px 2px rgba(18,21,26,.06);
}
.step-dot span.on{
  background:linear-gradient(90deg, var(--brand), #1AA87A);
  box-shadow:0 2px 8px rgba(11,110,79,.35);
}
.hidden{display:none!important}
.score-big{
  display:inline-flex;align-items:baseline;gap:.35rem;
  font-size:2.75rem;font-weight:900;letter-spacing:-.04em;color:var(--brand);
  background:linear-gradient(180deg, var(--brand-soft), var(--brand-soft2));
  border:1px solid color-mix(in srgb,var(--brand) 22%,var(--border));
  border-radius:18px;padding:.55rem 1rem .45rem;margin:.35rem 0;
  box-shadow:0 8px 20px rgba(11,110,79,.12);
}
.muted{color:var(--muted);font-size:.88rem}
.chip{
  display:inline-block;background:var(--brand-soft);color:var(--brand-deep);
  padding:.4rem .7rem;border-radius:999px;margin:.2rem .25rem .2rem 0;
  font-size:.82rem;font-weight:750;border:1px solid color-mix(in srgb,var(--brand) 18%,transparent);
}
.check{display:flex;gap:.6rem;align-items:flex-start;margin:1rem 0;font-size:.9rem}
.check input{width:20px;height:20px;min-height:20px;margin-top:.15rem;flex:0 0 auto;accent-color:var(--brand)}
.consent{font-size:.78rem;color:var(--muted);margin:.25rem 0 0 1.8rem}
pre{background:#F0F7F3;color:var(--text);padding:.85rem;border-radius:12px;overflow:auto;font-size:.72rem;max-height:220px;border:1px solid var(--border)}
.plan-card{
  border:1.5px solid var(--border);border-radius:14px;padding:1rem 1.05rem;margin:.55rem 0;cursor:pointer;background:#fff;
  box-shadow:0 1px 2px rgba(18,21,26,.04);transition:border-color .15s, box-shadow .15s, transform .12s;
}
.plan-card:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--brand) 40%,var(--border))}
.plan-card.selected{
  border-color:var(--brand);background:linear-gradient(180deg,#fff,var(--brand-soft2));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 16%,#fff), 0 8px 18px rgba(11,110,79,.12);
}
.plan-card strong{display:block;font-size:1.05rem}
.no-share{font-size:.82rem;color:var(--muted);margin:.85rem 0 .35rem;line-height:1.35}

/* Eyebrow for first screen */
#step-preamble h1::before{
  content:"Free audit";display:block;font-size:.72rem;font-weight:850;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brand);margin-bottom:.35rem;
}

html.embed body{
  background:
    radial-gradient(800px 360px at 50% -8%, color-mix(in srgb, var(--brand) 16%, transparent), transparent 62%),
    #F6FAF8;
}
html.embed .demo-banner{border-radius:0}

html.embed .wrap{padding-bottom:.9rem}
html.embed .card{margin-bottom:0}

/* services checklist */
.svc-list{display:grid;gap:.4rem;margin:.4rem 0 .8rem}
@media(min-width:560px){.svc-list{grid-template-columns:1fr 1fr}}
.svc-item{display:flex!important;align-items:center;gap:.5rem;margin:0!important;padding:.55rem .65rem;border:1.5px solid #d6e5da;border-radius:10px;background:#fff;font-weight:500!important;font-size:.9rem;cursor:pointer}
.svc-item input{width:1.05rem;height:1.05rem;margin:0;flex:none;accent-color:#1f7a4d}
.svc-item:has(input:checked){border-color:#1f7a4d;background:#eaf6ef}

.svc-item .big{margin-left:auto;font-size:.68rem;font-weight:700;color:#1f7a4d;background:#eaf6ef;border:1px solid #cfe7d8;border-radius:999px;padding:.1rem .45rem;white-space:nowrap}
