/* Spottable shared piece - PASSED on Bluegum 21 Oct (qa_text 0, a11y PASS, LH desktop 98 / mobile 97). Copy in with tools/use_shared.py; never re-hand-build. */
/* hero checklist additions (house rule: 10-point hero) */
.ticks{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;font-size:14.5px;font-weight:600;color:rgba(255,255,255,.9)}
.ticks li{display:flex;align-items:center;gap:8px}
.ticks i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(126,197,58,.25);color:var(--leaf-light)}
.ticks i svg{width:12px;height:12px;stroke-width:3}
.hero .cta{margin-top:30px}
.proof{display:flex;align-items:center;flex-wrap:wrap;gap:14px 22px;margin-top:22px}
.thumbs{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:600;color:rgba(255,255,255,.85)}
.thumbs span{display:flex}
.thumbs img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #fff;margin-left:-10px}
.thumbs img:first-child{margin-left:0}
.thumbs a{text-decoration:underline;text-underline-offset:3px;padding:4px 0}
.rate{display:flex;align-items:center;gap:10px;padding:7px 14px 7px 8px;border-radius:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);font-size:12.5px;color:rgba(255,255,255,.88)}
.rate b{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#fff;color:#1a5c0a;font-size:14px;font-weight:800}
.rate .st{color:#ffcf5a;letter-spacing:1px}
/* pop-up quote form (checklist point 2; point 9 = the short form, one tap from the hero) */
dialog.qd{margin:auto;width:min(460px,calc(100vw - 24px));padding:0;border:0;border-radius:24px;box-shadow:0 40px 100px rgba(10,31,4,.4);color:var(--ink)}
dialog.qd::backdrop{background:rgba(10,31,4,.55);backdrop-filter:blur(4px)}
dialog.qd[open]{animation:qdIn .45s var(--ease)}
.qd form{padding:34px 32px 30px}
.qd .x{position:absolute;right:14px;top:14px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--forest)}
.qd .x svg{rotate:45deg}
.qd .full{display:block;margin-top:12px;text-align:center;font-size:13px;font-weight:600;color:var(--leaf-ink);text-decoration:underline;text-underline-offset:3px;padding:4px 0}
@keyframes qdIn{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}