/* Deedlio agent websites (build plan step 6). Phone-first; colors and fonts come from the site's theme (render.js sets
   --navy, --navy-dark, --royal, --sky, --font-head, --font-body). WCAG 2.2 AA: text contrast >= 4.5:1, 44 px targets,
   visible focus, reduced motion respected. Search and property pages laid out the way Zillow's are (Mike, Oct 10). */
:root{--ink:#1E3D60;--text:#22313f;--muted:#4A5559;--line:#E2E5E1;--panel:#F4F6F3;--bg:#FFFFFF;--ok:#1E5631;--okbg:#DDF0E3;--radius:12px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 var(--font-body);padding-bottom:72px;overflow-wrap:break-word}
@media (min-width:900px){body{padding-bottom:0}}
img{max-width:100%;display:block}
a{color:#2F5F99}a:hover{color:var(--navy)}
h1,h2,h3{font-family:var(--font-head);color:var(--ink);line-height:1.2;margin:0 0 .5em}
h1{font-size:clamp(26px,5vw,40px);font-weight:600}h2{font-size:clamp(21px,3.4vw,28px);font-weight:600}h3{font-size:18px;font-weight:600}
p{margin:0 0 .8em}
:focus-visible{outline:3px solid var(--royal);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:#fff;color:var(--ink);padding:10px 14px;border-radius:8px;font-weight:700}
.skip:focus{left:8px}
.wrap{max-width:1240px;margin:0 auto;padding:0 16px}
.wrap-wide{max-width:1600px;margin:0 auto;padding:0 16px}
.narrow{max-width:760px}
.section{padding-top:28px;padding-bottom:12px}
.section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px}
.muted{color:var(--muted)}.small{font-size:14px}
.eyebrow{margin:0 0 4px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--royal)}
.eyebrow.on-dark{color:#DCE9F5}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border:2px solid var(--royal);background:var(--royal);color:#fff;border-radius:10px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.btn-line{background:#fff;color:var(--navy);border-color:var(--navy)}.btn-line:hover{background:var(--panel);color:var(--navy)}
.btn-big{min-height:52px;font-size:17px;width:100%}
.btn[disabled]{opacity:.6;cursor:progress}
.preview-bar{margin:0;background:#FFF3C4;color:#5A4500;text-align:center;font-size:14px;padding:8px 16px;font-weight:600}

/* header */
.site-header{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.header-row{display:flex;align-items:center;gap:12px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--font-head);font-weight:600;font-size:19px;margin-right:auto}
.brand img{height:44px;width:auto}
.monogram{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:10px;background:var(--navy);color:#fff;font-weight:700;letter-spacing:.02em}
.main-nav{display:none}
.main-nav ul,.menu ul{list-style:none;margin:0;padding:0}
.main-nav ul{display:flex;gap:4px}
.main-nav a,.menu a{display:flex;align-items:center;min-height:44px;padding:0 12px;text-decoration:none;color:var(--ink);font-weight:600;border-radius:8px}
.main-nav a:hover,.main-nav a[aria-current=page]{background:var(--panel)}
.header-call{display:none}
.menu{position:relative}
.menu summary{list-style:none;display:grid;place-items:center;width:44px;height:44px;border-radius:8px;cursor:pointer;color:var(--ink)}
.menu summary::-webkit-details-marker{display:none}
.menu[open] nav{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);min-width:220px;padding:8px}
@media (min-width:900px){.main-nav{display:block}.header-call{display:inline-flex}.menu{display:none}}

/* hero (home) */
.hero{position:relative;background:var(--navy-dark);color:#fff;overflow:hidden}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-empty{background:var(--navy-dark)}
.hero::after{content:"";position:absolute;inset:0;background:rgba(10,26,40,.55)}
.hero-inner{position:relative;z-index:1;padding-top:40px;padding-bottom:36px}
.hero h1{color:#fff;max-width:820px}
.smart-search label{display:block;font-weight:600;margin-bottom:6px}
.hero .smart-search label{color:#DCE9F5}
.smart-row{display:flex;gap:8px;background:#fff;border:2px solid var(--royal);border-radius:12px;padding:4px;max-width:760px}
.smart-row input{flex:1;min-width:0;min-height:44px;border:0;font:inherit;font-size:17px;padding:0 10px;color:var(--text);background:transparent}
.smart-row input:focus-visible{outline:none}.smart-row:focus-within{outline:3px solid var(--sky);outline-offset:2px}
.chips{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips a,.chips.plain li{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid #C9CFCC;border-radius:999px;background:#fff;color:var(--ink);text-decoration:none;font-weight:600;font-size:15px}
.chips.on-dark a{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.5);color:#fff}
.value-cta{background:var(--panel);border-radius:16px;padding:24px 20px;margin-top:24px;margin-bottom:24px}

/* cards */
.cards{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:16px;grid-template-columns:1fr}
/* phone: a row of new homes swipes sideways (Zillow-style); from 600 px it becomes a grid */
@media (max-width:599px){.grid-4{grid-auto-flow:column;grid-auto-columns:82%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;margin-right:-16px;padding-right:16px}.grid-4>li{scroll-snap-align:start}}
@media (min-width:600px){.grid-2,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card article{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;height:100%;display:flex;flex-direction:column}
.card:hover article,.card.hot article{box-shadow:0 6px 20px rgba(30,61,96,.16)}
.card-photo{position:relative;display:block;aspect-ratio:4/3;background:#D7DEDC}
.card-photo img{width:100%;height:100%;object-fit:cover}
.no-photo{display:grid;place-items:center;height:100%;color:var(--muted);font-size:14px}
.badge{position:absolute;left:10px;top:10px;background:#fff;color:var(--ink);font-size:13px;font-weight:700;padding:3px 10px;border-radius:999px}
.card-body{padding:10px 14px 14px;display:flex;flex-direction:column;gap:2px}
.card-price{margin:0;font-size:22px;font-weight:700;color:var(--ink)}
.card-facts{margin:0;font-size:15px}.card-type{color:var(--muted)}
.card-addr{margin:0;font:inherit;font-size:15px;font-weight:500}.card-addr a{color:var(--text);text-decoration:none}.card-addr a:hover{text-decoration:underline}
.card-addr a::after{content:"";position:absolute;inset:0}.card article{position:relative}
.card-water{margin:4px 0 0;font-size:14px;color:#1E4A63;font-weight:600}
.card-pool{margin:4px 0 0;font-size:14px;color:#22313f}
.mention{margin:4px 0 0;align-self:flex-start;font-size:13px;background:#EEF0EE;border:1px solid #C9CFCC;border-radius:6px;padding:1px 8px}
.card-office{margin:6px 0 0;font-size:12.5px;color:var(--muted)}

/* expert box */
.expert{display:flex;gap:16px;align-items:flex-start;border:1px solid var(--line);border-radius:16px;padding:20px;background:#fff;margin:24px 0}
.expert-photo{flex:0 0 auto;width:84px;height:84px;border-radius:999px;object-fit:cover;object-position:center top;background:var(--panel)}
.expert-body{flex:1;min-width:0}
.expert-name{font-size:21px;margin:0 0 2px}
.creds{list-style:none;margin:10px 0;padding:0;display:flex;flex-direction:column;gap:4px}
.creds li{position:relative;padding-left:22px}
.creds li::before{content:"";position:absolute;left:4px;top:.55em;width:9px;height:9px;border-radius:2px;background:var(--royal)}
.expert-bio{color:var(--text)}
.expert-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
@media (max-width:480px){.expert{flex-direction:column}.expert-actions .btn{flex:1}}

/* footer + phone bar */
.site-footer{background:var(--navy-dark);color:#DCE6E9;margin-top:40px;padding:28px 0 20px;font-size:14px}
.site-footer a{color:#fff}
.footer-grid{display:flex;flex-wrap:wrap;gap:20px 48px;justify-content:space-between}
.footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px}
.footer-grid nav a{display:inline-flex;min-height:44px;align-items:center}
.footer-name{font-weight:700;color:#fff;margin:0}
.eho{display:flex;align-items:center;gap:6px}
.disclaimer{font-size:12.5px;color:var(--muted);margin-top:16px}
/* smart search loading meter (search-meter.js): decorative, aria-hidden; the status line speaks for it */
.search-meter{margin:8px 0 2px}
.search-meter-track{height:4px;border-radius:2px;background:#E3E9F0;overflow:hidden}
.search-meter-fill{height:100%;background:var(--royal);transform-origin:left center;transform:scaleX(0);transition:transform .25s ease-out}
.search-meter.done .search-meter-fill{transition-duration:.15s}
.search-meter-msg{font-size:13.5px;color:var(--muted);margin:6px 0 0;min-height:1.45em;transition:opacity .15s}
.search-meter-msg.swap{opacity:0}
@media (prefers-reduced-motion:reduce){.search-meter-fill,.search-meter-msg{transition:none}}
.site-footer .disclaimer{color:#C9D6DE}
.powered{margin:12px 0 0;font-size:12.5px;color:#C9D6DE}
.phone-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line)}
.phone-bar a{display:flex;align-items:center;justify-content:center;min-height:48px;border:2px solid var(--royal);border-radius:10px;font-weight:700;text-decoration:none;color:var(--navy)}
.phone-bar a:first-child{background:var(--royal);color:#fff}
@media (min-width:900px){.phone-bar{display:none}}

/* search page (Zillow-style: filters across the top, map + list side by side on wide screens) */
.page-homes .site-footer{margin-top:0}
.search-top{border-bottom:1px solid var(--line);background:#fff;padding:10px 0}
.smart-search.compact .smart-row{max-width:none}
.filter-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;align-items:center}
.filter{position:relative}
.filter summary{list-style:none;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid #8A9599;border-radius:10px;font-weight:600;cursor:pointer;background:#fff;color:var(--ink)}
.filter summary::-webkit-details-marker{display:none}
.filter summary::after{content:"";width:8px;height:8px;margin-left:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.filter[open] summary{border-color:var(--royal);box-shadow:0 0 0 1px var(--royal)}
.filter-pop{position:absolute;z-index:25;top:50px;left:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.14);padding:14px;width:min(300px,calc(100vw - 32px));display:flex;flex-direction:column;gap:6px}
.filter-pop.wide{width:min(360px,calc(100vw - 32px))}
.filter-pop label,.lead-form label,.tour label,.pay-grid label{font-weight:600;font-size:15px}
select,input[type=number],input[type=text],input[type=email],input[type=tel],input:not([type]),textarea{min-height:44px;border:1px solid #8A9599;border-radius:8px;padding:0 10px;font:inherit;background:#fff;color:var(--text);width:100%}
textarea{padding:10px}
fieldset{border:0;margin:0;padding:0}legend{font-weight:700;margin-bottom:4px}
.check{display:flex;align-items:center;gap:8px;min-height:44px;font-weight:500!important}
.check input{width:20px;height:20px;flex:0 0 auto}
.sort{width:auto;margin-left:auto}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.tag{display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:0 4px 0 14px;background:#EAF1FA;border:1px solid var(--royal);border-radius:999px;font-size:14px;font-weight:600;color:var(--ink)}
.tag button{width:32px;height:32px;border:0;background:transparent;border-radius:999px;font:inherit;font-size:18px;color:var(--ink);cursor:pointer}
.tag button:hover{background:#D5E3F4}
.tag.words{background:#F1F1EF;border-color:#8A9599}
.note{margin:10px 0 0;background:#FFF6E0;border:1px solid #E9C46A;border-radius:8px;padding:8px 12px;font-size:14px}
.search-body{display:block}
.map-pane{display:none;position:relative}
.map-pane.open{display:block;position:fixed;inset:64px 0 72px;z-index:15;background:#DDE7E2}
.map{width:100%;height:100%;min-height:300px;background:#DDE7E2}
.map-tools{position:absolute;left:12px;top:12px;z-index:5;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.map-tools .check{background:#fff;border-radius:10px;padding:0 12px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.results{padding:16px}
.results-head h1{font-size:22px;margin:0}
.more-row{text-align:center;margin:20px 0}
.map-toggle{position:fixed;left:50%;transform:translateX(-50%);bottom:84px;z-index:16;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.pin{border:2px solid #fff;background:var(--royal);color:#fff;font:700 13px var(--font-body);padding:4px 8px;border-radius:999px;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.pin.hot,.pin:hover{background:var(--navy-dark);z-index:3}
.map-pop{font:14px/1.4 var(--font-body);min-width:200px}.map-pop img{width:100%;height:110px;object-fit:cover;border-radius:6px;margin-bottom:6px}
@media (min-width:1000px){
  .search-body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(560px,1fr);height:calc(100vh - 64px - var(--top-h,170px))}
  .map-pane{display:block;position:relative;inset:auto;height:100%}
  .results{overflow:auto;height:100%;padding:16px 20px}
  .map-toggle{display:none}
}

/* property page (Zillow-style: photo collage, details on the left, contact card on the right) */
.pd-top{padding-top:12px;padding-bottom:8px}.back{display:inline-flex;align-items:center;min-height:44px;font-weight:600}
.gallery{position:relative;display:grid;gap:6px;grid-template-columns:1fr;border-radius:16px;overflow:hidden}
.gallery button{padding:0;border:0;background:#D7DEDC;cursor:zoom-in;display:block}
.gallery button img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.gallery .g-1,.gallery .g-2,.gallery .g-3,.gallery .g-4{display:none}
.gallery .see-all{position:absolute;right:12px;bottom:12px;cursor:pointer;background:#fff;color:var(--ink);border-color:#fff}
.gallery.empty{min-height:200px;display:grid;place-items:center;background:var(--panel)}
@media (min-width:760px){
  .gallery{grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px}
  .gallery .g-0{grid-row:span 2}.gallery .g-1,.gallery .g-2,.gallery .g-3,.gallery .g-4{display:block}
  .gallery button img{aspect-ratio:auto}
}
@media (min-width:1100px){.gallery{grid-template-rows:240px 240px}}
.photo-dialog{width:min(1100px,100vw);max-width:100vw;max-height:100vh;height:100vh;margin:0 auto;border:0;padding:0;background:#fff}
.photo-dialog::backdrop{background:rgba(0,0,0,.6)}
.photo-dialog-head{position:sticky;top:0;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-bottom:1px solid var(--line);z-index:2}
.photo-dialog-head h2{font-size:18px;margin:0}
.photo-list{list-style:none;margin:0;padding:12px 16px;display:grid;gap:10px}
.photo-list img{width:100%;border-radius:8px}
.pd-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;margin-top:20px}
.pd-grid>*,.search-body>*{min-width:0}
@media (min-width:1000px){.pd-grid{grid-template-columns:minmax(0,1fr) 380px;gap:40px}.pd-side{position:sticky;top:84px;align-self:start}}
.status-pill{display:inline-block;font-size:13px;font-weight:700;background:var(--okbg);color:var(--ok);padding:3px 10px;border-radius:999px;margin:0 0 6px}
.pd-price{font-size:clamp(30px,6vw,40px);font-weight:700;color:var(--ink);margin:0;line-height:1.1}
.pd-facts{font-size:18px;margin:4px 0}
.pd-addr{font-size:19px;font-weight:500;font-family:var(--font-body);margin:0 0 4px}
.pd-est{margin:0 0 4px}.pd-office{font-size:14px;color:var(--muted)}
.overview{list-style:none;margin:16px 0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.overview li{background:var(--panel);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column}
.overview span{font-size:13px;color:var(--muted)}
.water-box{background:#EAF3F8;border-radius:14px;padding:16px 18px;margin:16px 0}
.water-box h2{font-size:20px}
.remarks{white-space:pre-line}
.facts h3{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
.facts dl{margin:0;display:grid;gap:4px 24px;grid-template-columns:minmax(0,1fr)}
@media (min-width:700px){.facts dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
.facts dl div{display:flex;gap:8px;padding:4px 0;min-width:0}.facts dt{font-weight:600;flex:0 0 45%;overflow-wrap:anywhere}.facts dd{margin:0;min-width:0;overflow-wrap:anywhere}
.pd-map{height:260px;border-radius:14px;background:#DDE7E2;overflow:hidden}
.payment{background:var(--panel);border-radius:16px;padding:18px;margin:24px 0}
.pay-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.pay-grid div{display:flex;flex-direction:column;gap:4px}
.pay-total{font-size:22px;margin:14px 0 6px}.pay-total span{font-weight:700;color:var(--ink)}
.pay-note{font-size:14px;color:var(--muted)}
.pd-side .expert{margin-top:0;flex-direction:column}
.tour{display:flex;flex-direction:column;gap:6px;margin-top:8px;border-top:1px solid var(--line);padding-top:14px}
.tour h2{font-size:19px}
.days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.day{position:relative}.day input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.day span{display:grid;place-items:center;min-height:52px;padding:4px;border:1px solid #8A9599;border-radius:10px;font-size:13px;text-align:center;line-height:1.2}
.day input:checked+span{border:2px solid var(--royal);background:#EAF1FA;font-weight:700}
.day input:focus-visible+span{outline:3px solid var(--royal);outline-offset:2px}
.lead-form{display:flex;flex-direction:column;gap:6px;margin:16px 0;max-width:520px}
.req{font-weight:400;color:var(--muted);font-size:14px}
.form-note{background:#FFF6E0;border:1px solid #E9C46A;border-radius:8px;padding:8px 12px;font-size:14px}
.lead{font-size:18px}
.links{display:flex;flex-wrap:wrap;gap:8px 20px;padding-left:18px}
/* phone: filters in one tight row, sort beside them; the quick-contact bar fits three buttons */
@media (max-width:599px){
  .filter-row{gap:6px}.filter summary{padding:0 10px;font-size:15px}.filter summary::after{margin-left:6px}
  .sort{margin-left:0;flex:1 1 120px;font-size:15px}
  .phone-bar a{font-size:15px;line-height:1.15;text-align:center;padding:0 4px}
  .filter-pop{position:fixed;left:16px;right:16px;top:auto;width:auto}
}
/* step 7: forms that send, the save / alert dialogs */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status:empty{display:none}
.form-status{margin:8px 0 0;padding:10px 12px;border-radius:8px;font-size:15px;background:var(--panel)}
.form-status.ok{background:var(--okbg);color:var(--ok);font-weight:600}
.form-status.err{background:#FDECEC;color:#8A1C1C;font-weight:600}
.pd-price-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.save-btn{gap:6px}.save-btn[aria-pressed=true]{background:#EAF1FA}
.results-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}.results-head h1{margin-right:auto}
.results-head #status{flex-basis:100%;margin:0}
.small-dialog{border:0;border-radius:16px;padding:20px;width:min(460px,calc(100vw - 32px));box-shadow:0 20px 60px rgba(0,0,0,.25)}
.small-dialog::backdrop{background:rgba(0,0,0,.45)}
.small-dialog .lead-form{margin:0}
.dlg-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.alert-label{background:var(--panel);border-radius:8px;padding:8px 12px;font-weight:600}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* text-message consent (a long label: box at the top, words wrap beside it) and the privacy policy (Mike, Oct 11) */
.check.consent-sms{align-items:flex-start;font-size:14px;line-height:1.45;color:var(--text);padding:8px 0}
.check.consent-sms input{margin-top:2px}
.policy h2{margin-top:1.4em}
.policy ul{padding-left:1.2em}
.policy li{margin-bottom:.4em}

/* WCAG 2.2 2.4.11 Focus Not Obscured (go-live check, Oct 11): the sticky header (64 px), and on phones the fixed bottom bar
   (about 70 px) plus the search page's Map button above it, must never cover the control that has keyboard focus - when
   focus moves the page scrolls it clear of them. Desktop has only the header. */
html{scroll-padding-top:80px;scroll-padding-bottom:140px}
@media (min-width:900px){html{scroll-padding-bottom:16px}}

/* Cloudflare Turnstile (lead forms): no space at all unless Cloudflare shows this visitor its check */
.ts-slot:empty{display:none}
.ts-slot{margin:6px 0;max-width:100%;overflow:hidden}