html,body{margin:0;background:#f8fafc;color:#1e293b;font-family:'Outfit',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-text-size-adjust:100%}
.ec-head{background:#fff;border-bottom:1px solid #e2e8f0;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top))}
.ec-head .in{max-width:760px;margin:0 auto;display:flex;align-items:center}
.ec-head img{height:34px;width:auto;display:block}
.ec-wrap{max-width:760px;margin:0 auto;padding:4px 16px 24px}
.ec-ns{padding:16px;background:#fff;border:1px solid #e2e8f0;border-radius:12px}
.ec-foot{text-align:center;font-size:12px;color:#94a3b8;padding:16px 16px calc(20px + env(safe-area-inset-bottom))}

/* 1.8.0 standalone page: Google rating line and the section under the tool (how it works, who it is for, questions) */
.ec-trust{text-align:center;margin:14px 0 4px;font-size:14px;color:#64748b}
.ec-trust a{color:inherit;text-decoration:none}
.ec-trust a:hover b,.ec-trust a:focus-visible b{text-decoration:underline}
.ec-trust .st{color:#d4a853;letter-spacing:1px}
.ec-trust b{color:#033f60}
.ec-seo{margin:28px 0 8px;padding:24px 22px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;line-height:1.6}
.ec-seo h2{font-family:'Libre Baskerville',Georgia,serif;font-weight:400;font-size:21px;line-height:1.3;color:#01243a;margin:26px 0 10px}
.ec-seo h2:first-child{margin-top:0}
.ec-seo p{margin:0 0 10px;color:#334155}
.ec-steps{margin:0 0 6px;padding:0;list-style:none;counter-reset:ec}
.ec-steps li{counter-increment:ec;position:relative;padding:4px 0 10px 40px;color:#334155}
.ec-steps li::before{content:counter(ec);position:absolute;left:0;top:2px;width:26px;height:26px;border-radius:50%;background:#033f60;color:#fff;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
.ec-faq details{border-top:1px solid #e2e8f0}
.ec-faq details:last-child{border-bottom:1px solid #e2e8f0}
.ec-faq summary{cursor:pointer;list-style:none;padding:14px 32px 14px 0;font-weight:600;color:#01243a;position:relative}
.ec-faq summary::-webkit-details-marker{display:none}
.ec-faq summary::after{content:'+';position:absolute;right:4px;top:12px;font-size:20px;font-weight:400;color:#064d75}
.ec-faq details[open] summary::after{content:'\2212'}
.ec-faq summary:focus-visible{outline:2px solid #064d75;outline-offset:2px;border-radius:4px}
.ec-faq details p{padding:0 0 14px}
@media (max-width:520px){.ec-seo{padding:20px 16px}.ec-seo h2{font-size:19px}}

/* 1.8.1 the section under the tool matches the tool width (640px) */
.ec-seo{max-width:640px;margin-left:auto;margin-right:auto;box-sizing:border-box}

/* 1.8.3 the tool always fills the first screen, so the reviews line and the section below stay below the fold instead of jumping as screens change */
#hb-assess{min-height:calc(100vh - 60px)}
@supports (height:100svh){#hb-assess{min-height:calc(100svh - 60px)}}

/* 1.8.4 Google reviews line in the homepage style sits right under the tool; the version moves to the page footer; the first screen is held by the tool plus the reviews line */
.ec-fold{min-height:calc(100vh - 60px)}
@supports (height:100svh){.ec-fold{min-height:calc(100svh - 60px)}}
.ec-fold #hb-assess{min-height:0}
.ec-fold .hba-ver{display:none}
.ec-grev{text-align:center;margin:28px 0 8px}
.ec-grev .in{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#64748b;letter-spacing:.4px}
.ec-grev svg{width:16px;height:16px;flex:none}
.ec-grev a{color:#b45309;text-decoration:none;letter-spacing:1px}
.ec-grev a:hover,.ec-grev a:focus-visible{text-decoration:underline}
.ec-grev .rt{font-size:12px}
.ec-ver{margin:6px 0 0;font-size:11px;color:#94a3b8}

/* 1.8.5 no jump while loading: the reviews line waits until the tool has drawn (its top margin used to push the whole page down 28px until the tool appeared); footer text darkened to pass the contrast check (4.55:1) */
#hb-assess:empty~.ec-grev{display:none}
.ec-foot,.ec-ver{color:#64748b}

/* 1.8.6 reviews block styled like the status page footer: "Health Bridge" name, thin fading line, reviews line 20% smaller */
.ec-grev .ec-bn{display:block;font-family:'Libre Baskerville',Georgia,serif;font-size:16px;font-weight:600;color:#64748b;line-height:1.3}
.ec-grev .ec-sep{display:block;width:220px;max-width:70%;height:1.5px;margin:10px auto 8px;background:linear-gradient(90deg,transparent,rgba(3,63,96,.15) 20%,rgba(3,63,96,.15) 80%,transparent)}
.ec-grev .in{font-size:9.6px;gap:5px}
.ec-grev svg{width:13px;height:13px}
.ec-grev .rt{font-size:9.6px}

/* 1.8.7 chosen variant: line, gold diamond, line; "Health Bridge" 10% smaller */
.ec-grev .ec-bn{font-size:14.4px}
.ec-grev .ec-sep{display:flex;align-items:center;justify-content:center;gap:8px;width:auto;max-width:none;height:auto;margin:9px auto 7px;background:none}
.ec-grev .ec-sep::before,.ec-grev .ec-sep::after{content:"";width:80px;height:1px;background:linear-gradient(90deg,transparent,rgba(3,63,96,.2))}
.ec-grev .ec-sep::after{background:linear-gradient(90deg,rgba(3,63,96,.2),transparent)}
.ec-grev .ec-sep i{display:block;width:6px;height:6px;background:#d4a853;transform:rotate(45deg);flex:none}

/* 1.8.8 the name and reviews block sits at the bottom of the first screen and stays put as the tool's screens change height */
.ec-fold{display:flex;flex-direction:column}
.ec-grev{margin:auto 0 0;padding:28px 0 22px}