/* Agile Realty brand: Montserrat; navy #16274A, blue #1A70BE, accent #3164B8, red #BD2227, slate #5A6B85, mist #F4F7FB, line #E3E9F1 */
:root{
  --paper:#FFFFFF; --mist:#F4F7FB; --ink:#16274A; --ink-2:#3A4A66; --ink-3:#5A6B85; --rule:#E3E9F1;
  --brand:#16274A; --blue:#1A70BE; --blue-soft:#E7F0FA; --accent:#3164B8; --red:#BD2227; --red-soft:#FBE9EA;
  --good:#2F7D4A; --warn:#B7791F; --panel:#FFFFFF;
  --survey:var(--blue); --survey-soft:var(--blue-soft); --creek:var(--accent); --creek-soft:#E6ECF8;
  --ridge:var(--good); --ridge-soft:#E3F2E8; --flag:var(--red); --flag-soft:var(--red-soft);
  --sans:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; --serif:var(--sans);
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ color-scheme:dark;
  --paper:#0E182C; --mist:#15223B; --ink:#EAF0F8; --ink-2:#C3CDDC; --ink-3:#8E9CB3; --rule:#24324D; --panel:#15223B;
  --blue:#5AA2E6; --blue-soft:#18304F; --accent:#7C9CE0; --red:#E2585D; --red-soft:#3A1A20; --good:#6CC28A; --warn:#E0A84A;
  --creek-soft:#1B2A4A; --ridge-soft:#173326; } }
:root[data-theme="dark"]{ color-scheme:dark;
  --paper:#0E182C; --mist:#15223B; --ink:#EAF0F8; --ink-2:#C3CDDC; --ink-3:#8E9CB3; --rule:#24324D; --panel:#15223B;
  --blue:#5AA2E6; --blue-soft:#18304F; --accent:#7C9CE0; --red:#E2585D; --red-soft:#3A1A20; --good:#6CC28A; --warn:#E0A84A;
  --creek-soft:#1B2A4A; --ridge-soft:#173326; }
*{box-sizing:inherit}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 56px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15.5px;line-height:1.65}
a{color:var(--blue)}
h1,h2,h3{font-family:var(--sans);line-height:1.2;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(26px,4.2vw,40px);font-weight:700} h2{font-size:clamp(20px,2.8vw,26px);font-weight:700} h3{font-size:17px;font-weight:600}
p{margin:0 0 1em;max-width:70ch}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* brand bar */
.brandbar{background:var(--paper);border-bottom:1px solid var(--rule)}
.brandbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.brandbar a.logo{display:block;line-height:0}
.brandbar img{height:42px;width:auto}
.brandbar .logo-dark{display:none}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .brandbar .logo-light{display:none} :root:not([data-theme="light"]) .brandbar .logo-dark{display:block} }
:root[data-theme="dark"] .brandbar .logo-light{display:none} :root[data-theme="dark"] .brandbar .logo-dark{display:block}
.brandbar .tag{font-size:12px;font-weight:600;color:var(--ink-3);text-align:right}

/* hero */
.mast{background:#16274A;color:#fff;padding:34px 0 30px;border-bottom:4px solid #BD2227}
.mast .kicker{color:#9FC3EA;font-size:13px;font-weight:600;margin-bottom:8px}
.mast h1{color:#fff}
.mast p{color:#D5DEEC;margin-top:10px}
.who{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--ink-2);padding:10px 0;border-bottom:1px solid var(--rule)}

.btn{appearance:none;border:1px solid var(--brand);background:var(--brand);color:#fff;font:600 15px var(--sans);padding:11px 18px;border-radius:6px;cursor:pointer}
.btn:hover{background:var(--blue);border-color:var(--blue)}
.btn.ghost{background:none;color:var(--ink);border-color:var(--rule);padding:6px 12px;font-size:13px}
.btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .btn:not(.ghost){background:var(--blue);border-color:var(--blue)} }

.gate{max-width:540px;margin:48px auto;padding:28px;background:var(--mist);border:1px solid var(--rule);border-top:4px solid var(--blue);border-radius:0}
.gate h2{margin-bottom:8px}
.gate p{color:var(--ink-2);font-size:15px}
.gate .msg{font-size:14px;color:var(--ink-2);margin-top:12px;min-height:1.5em}
.gate .msg.bad{color:var(--red)}

.summary{padding:28px 0 8px}
.summary .call{font-size:24px;font-weight:700;color:var(--brand);margin:6px 0 8px}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .summary .call{color:var(--ink)} }
.summary .lede{color:var(--ink-2)}
.oneline{border-left:4px solid var(--red);background:var(--mist);padding:10px 16px;margin:18px 0 0;color:var(--ink);font-weight:600}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px 24px;padding:16px 18px;background:var(--mist);border:1px solid var(--rule);margin:16px 0 22px}
.fact b{display:block;font-size:21px;font-weight:700;color:var(--ink)}
.fact span{color:var(--ink-3);font-size:12.5px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:28px}
@media (max-width:760px){.grid2{grid-template-columns:1fr}}
.block h3{margin-bottom:8px}
ul.tight{margin:0;padding-left:18px;color:var(--ink-2)} ul.tight li{margin-bottom:7px}
ul.tight b{color:var(--ink)}
.pro li::marker{color:var(--good)} .con li::marker{color:var(--red)}
.note{background:var(--mist);border:1px solid var(--rule);border-left:4px solid var(--blue);padding:12px 16px;margin:18px 0;color:var(--ink-2)}
.note b{color:var(--ink)}
.note.red{border-left-color:var(--red)} .note.green{border-left-color:var(--good)} .note.blue{border-left-color:var(--accent)}
table{width:100%;border-collapse:collapse;font-size:13.5px;margin:8px 0 18px}
th{text-align:left;font-weight:600;color:#fff;background:#16274A;padding:8px}
td{padding:8px;border-bottom:1px solid var(--rule);color:var(--ink-2);vertical-align:top}
tr:nth-child(even) td{background:var(--mist)}
td.n,th.n{text-align:right;white-space:nowrap} td.n{color:var(--ink);font-weight:500}
tr.total td{font-weight:700;color:var(--ink);border-top:2px solid var(--brand);background:var(--blue-soft)}
.scroll{overflow-x:auto}
.calc{background:var(--mist);border:1px solid var(--rule);border-top:4px solid var(--blue);padding:16px 18px;margin:18px 0}
.calc h3{margin-bottom:10px}
.calc label{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--ink-2);margin:8px 0}
.calc input[type=range]{flex:1;accent-color:var(--blue)}
.calc output{min-width:84px;text-align:right;font-weight:600;color:var(--ink)}
.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 20px;margin-top:12px}
.readout div b{display:block;font-size:20px;font-weight:700}
.readout div span{font-size:12px;color:var(--ink-3)}
.good{color:var(--good)} .warn{color:var(--warn)} .bad{color:var(--red)}
.diagram{margin:14px 0 6px;background:#fff;border:1px solid var(--rule);padding:8px} .diagram svg{width:100%;height:auto;display:block}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--ink-2);margin-bottom:18px}
.legend i{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px}
.toc{display:flex;gap:2px;overflow-x:auto;border-bottom:1px solid var(--rule);position:sticky;top:env(safe-area-inset-top,0px);background:var(--paper);z-index:5}
.toc a{color:var(--ink-2);text-decoration:none;padding:12px 12px 10px;border-bottom:3px solid transparent;white-space:nowrap;font-size:13.5px;font-weight:600}
.toc a:hover{color:var(--ink);border-bottom-color:var(--red)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--paper);z-index:6}
section.part{padding:24px 0 8px;scroll-margin-top:60px}
section.part > h2{padding-bottom:8px;margin-bottom:12px;border-bottom:2px solid var(--rule)}

/* footer, matches agilerealtync.com */
footer{background:#16274A;color:#C9D4E5;margin-top:48px;padding:28px 0 36px;font-size:12.5px}
footer .f-in{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap}
footer img.flogo{height:40px;width:auto;flex:0 0 auto}
footer .legal{flex:1;min-width:260px;line-height:1.7}
footer .legal strong{color:#fff}
footer a{color:#9FC3EA}
footer .sources{border-top:1px solid #2A3D63;margin-top:14px;padding-top:12px;color:#9AA9C2}
footer .badges{display:flex;align-items:center;gap:8px;margin-top:10px;color:#fff}
footer .eho-mark{width:28px;height:28px}
footer .lbl{font-size:10.5px;line-height:1.2;text-transform:none}

.deals{list-style:none;padding:0;margin:24px 0}
.deals li{border-left:4px solid var(--blue);background:var(--mist);padding:14px 18px;margin-bottom:12px}
.deals .where{color:var(--ink-3);font-size:13px}
.deals a{font-size:20px;font-weight:700;text-decoration:none;color:var(--ink)}
.deals a:hover{color:var(--blue)}
@media (max-width:560px){ .brandbar .tag{display:none} .brandbar img{height:36px} }