/*! Curb Appeal Grader v1.2.0 — Broker Brink · The SRQ Premier Team · Bright Realty.
   Palette: navy #0D2E52, blue #124275, sky #6EC1E4 (primary buttons), gold #FAC857 (accents only).
   Sized by its container (not the viewport), so it fits Elementor / Gutenberg columns. */
.cag{
  --cag-navy:#0D2E52; --cag-blue:#124275; --cag-sky:#6EC1E4; --cag-gold:#FAC857;
  --cag-ice:#F2F5FF; --cag-mist:#EEF7FB; --cag-body:#54595F; --cag-ink:#16202b;
  --cag-border:#dbe3ea; --cag-err:#b3261e;
  --cag-display:var(--bbh-display,var(--font-display,"Poppins","Segoe UI",system-ui,sans-serif));
  --cag-ui:var(--bbh-ui,var(--font-ui,"Montserrat","Segoe UI",system-ui,sans-serif));
  --cag-btnfont:var(--bbh-btnfont,"Open Sans","Segoe UI",system-ui,sans-serif);
  display:block; width:100%; max-width:720px; margin:0 auto; container-type:inline-size;
  font-family:var(--cag-ui); color:var(--cag-body); font-size:16px; line-height:1.55; text-align:left;
}
.cag *,.cag *::before,.cag *::after{box-sizing:border-box}
.cag .cag__card{position:relative; background:#fff; border:1px solid var(--cag-border); border-radius:12px; overflow:hidden; box-shadow:0 4px 18px rgba(13,46,82,.07)}

/* Header: light, compact, text wordmark + gold rule. Hide with header="no". */
.cag .cag__head{padding:20px 22px 16px; border-bottom:1px solid var(--cag-border); background:#fff}
.cag .cag__brand{display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px; margin:0 0 12px}
.cag .cag__wordmark{font-family:var(--cag-display); font-weight:700; font-size:15px; letter-spacing:.14em; text-transform:uppercase; color:var(--cag-navy); line-height:1.2}
.cag .cag__logo{display:block; height:28px; width:auto; max-width:60%}
.cag .cag__team{font-size:12px; font-weight:500; color:var(--cag-body); letter-spacing:.02em}
.cag .cag__title{margin:0; padding:0 0 10px; font-family:var(--cag-display); font-weight:700; font-size:clamp(21px,5.2cqi,27px); line-height:1.2; color:var(--cag-navy); position:relative}
.cag .cag__title::after{content:""; position:absolute; left:0; bottom:0; width:48px; height:3px; border-radius:2px; background:var(--cag-gold)}
.cag .cag__eyebrow{margin:8px 0 0; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--cag-blue)}

.cag .cag__progress{height:5px; background:var(--cag-mist)}
.cag .cag__progress span{display:block; height:100%; background:var(--cag-blue); transition:width .3s cubic-bezier(.4,0,.2,1)}
.cag .cag__body{padding:20px}
@container (min-width:560px){.cag .cag__body{padding:28px 32px}.cag .cag__head{padding:22px 32px 18px}}

.cag .cag__h{display:block; margin:0 0 6px; font-family:var(--cag-display); font-weight:600; font-size:clamp(18px,4.6cqi,22px); line-height:1.3; color:var(--cag-navy); outline:none}
.cag .cag__sub{margin:0 0 18px}
.cag .cag__count{display:block; margin-bottom:6px; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--cag-blue)}
.cag .cag__fs{border:0; margin:0; padding:0; min-width:0}
.cag .cag__legend{padding:0; margin:0 0 14px; width:100%; border:0}
.cag .cag__field{margin-bottom:14px}
.cag .cag__field label,.cag .cag__label{display:block; margin:0 0 6px; font-weight:600; font-size:14px; color:var(--cag-navy)}
.cag .cag__opt{font-weight:400; color:var(--cag-body)}
.cag.cag .cag__field input[type=text],.cag.cag .cag__field input[type=email],.cag.cag .cag__field input[type=tel],.cag.cag .cag__field select{
  display:block; width:100%; max-width:none; min-height:48px; padding:12px 14px; font:inherit; font-size:16px; color:var(--cag-ink);
  background:#fff; border:1px solid #b9c4cf; border-radius:8px; box-shadow:none; margin:0}
.cag.cag .cag__field input:focus,.cag.cag .cag__field select:focus{border-color:var(--cag-blue); outline:3px solid rgba(18,66,117,.22); outline-offset:0}
.cag.cag .cag__field input[aria-invalid=true]{border-color:var(--cag-err)}
.cag .cag__err{margin:6px 0 0; color:var(--cag-err); font-size:14px; font-weight:500}
.cag .cag__places{margin-bottom:14px}
.cag .cag__places gmp-place-autocomplete{width:100%}

.cag .cag__opts{display:grid; gap:8px}
.cag .cag__opt-card{position:relative; display:flex; align-items:center; gap:12px; min-height:52px; margin:0; padding:12px 14px; border:1.5px solid var(--cag-border); border-radius:8px; cursor:pointer; background:#fff; color:var(--cag-ink); font-weight:500; font-size:15px; line-height:1.4; transition:border-color .2s,background .2s}
.cag .cag__opt-card:hover{border-color:var(--cag-sky); background:var(--cag-mist)}
.cag .cag__opt-card input{flex:0 0 auto; width:20px; height:20px; margin:0; accent-color:var(--cag-blue)}
.cag .cag__opt-card:has(input:checked){border-color:var(--cag-blue); background:var(--cag-mist); box-shadow:inset 0 0 0 1px var(--cag-blue)}
.cag .cag__opt-card:has(input:focus-visible){outline:3px solid var(--cag-blue); outline-offset:2px}
.cag .cag__nav{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:20px}

/* Buttons: sky with navy text (7:1 contrast), matching the site's .bbh-btn--sky. */
.cag .cag__btn{display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 24px; margin:0; border:2px solid var(--cag-sky); border-radius:8px; background:var(--cag-sky); color:var(--cag-navy) !important; font-family:var(--cag-btnfont); font-size:15px; font-weight:700; letter-spacing:.01em; text-transform:none; line-height:1.3; text-decoration:none !important; box-shadow:none; cursor:pointer; transition:background .2s,border-color .2s,color .2s}
.cag .cag__btn:hover{background:var(--cag-navy); border-color:var(--cag-navy); color:#fff !important}
.cag .cag__btn:focus-visible,.cag .cag__link:focus-visible,.cag a:focus-visible{outline:3px solid var(--cag-blue); outline-offset:3px}
.cag .cag__btn[disabled]{opacity:.65; cursor:wait}
.cag .cag__btn--ghost{background:transparent; border-color:var(--cag-border); color:var(--cag-navy) !important}
.cag .cag__btn--ghost:hover{background:var(--cag-ice); border-color:var(--cag-blue); color:var(--cag-navy) !important}
.cag .cag__hp{position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden}
.cag .cag__live{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* Results */
.cag .cag__gradebox{display:flex; gap:18px; align-items:center; margin-bottom:18px}
.cag .cag__grade{flex:0 0 auto; display:grid; place-items:center; width:84px; height:84px; border-radius:50%; font-family:var(--cag-display); font-weight:700; font-size:46px; line-height:1; color:#fff; background:var(--cag-navy); box-shadow:0 0 0 4px #fff,0 0 0 7px var(--cag-gold)}
.cag .cag__gradebox>div:last-child{flex:1; min-width:0}
.cag .cag__score{margin:0 0 6px; overflow-wrap:anywhere}
.cag .cag__score strong{font-family:var(--cag-display); font-size:21px; color:var(--cag-navy)}
.cag .cag__meter{height:8px; border-radius:8px; background:var(--cag-mist); overflow:hidden}
.cag .cag__meter span{display:block; height:100%; background:var(--cag-blue)}
.cag .cag__blurb{margin:8px 0 0; font-weight:600; color:var(--cag-navy)}
.cag .cag__lead{margin:0 0 18px; padding:14px 16px; background:var(--cag-ice); border-left:4px solid var(--cag-gold); border-radius:0 8px 8px 0; color:var(--cag-ink)}
.cag .cag__fixh{margin:0 0 10px; font-family:var(--cag-display); font-size:18px; font-weight:600; color:var(--cag-navy)}
.cag .cag__fixes{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.cag .cag__fix{display:flex; gap:12px; margin:0; padding:14px; border:1px solid var(--cag-border); border-radius:8px}
.cag .cag__fixn{flex:0 0 30px; height:30px; display:grid; place-items:center; border-radius:50%; background:var(--cag-blue); color:#fff; font-weight:700; font-size:14px}
.cag .cag__fix h4{margin:2px 0 4px; font-family:var(--cag-display); font-size:16px; font-weight:600; color:var(--cag-navy)}
.cag .cag__fix p{margin:0 0 6px; font-size:15px}
.cag .cag__cost{font-size:13px !important; color:var(--cag-blue)}
.cag .cag__note{margin:14px 0 0; font-size:13px}
.cag .cag__cta{margin-top:22px; padding:20px; text-align:center; border-radius:10px; background:var(--cag-navy); color:#fff; border-top:3px solid var(--cag-gold)}
.cag .cag__cta p{margin:0 0 14px; color:#fff}
.cag .cag__call{margin:12px 0 0 !important; font-size:14px}
.cag .cag__call a{color:var(--cag-sky); font-weight:600; text-decoration:underline; overflow-wrap:anywhere}
.cag .cag__disclosure{margin:12px 0 0; font-size:12px; line-height:1.5; text-align:center; color:var(--cag-body)}
.cag .cag__retake{text-align:center; margin:12px 0 0}
.cag .cag__link{background:none; border:0; padding:4px; margin:0; font:inherit; font-size:14px; color:var(--cag-blue); text-decoration:underline; cursor:pointer; box-shadow:none}
.cag .cag__link:hover{background:none; color:var(--cag-navy)}
.cag .cag__fine{margin:12px 0 0; font-size:12px; line-height:1.5; color:var(--cag-body)}
.cag .cag__fine a{color:var(--cag-blue)}
.cag .cag__places .cag__link{margin-top:6px; padding-left:0}
.cag [hidden]{display:none !important}
@media (prefers-reduced-motion:reduce){.cag *{transition:none !important}}
