
:root{
  --canvas:#f2efe9; --surface:#ffffff; --ink:#2d2d2d; --meta:#6b6560;
  --accent:#c22026; --accent-dark:#8f1319; --rule:#d9d9d9; --tint:#c19595;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Verdana,Geneva,"DejaVu Sans",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink);font:15.5px/1.62 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-dark);text-decoration:underline}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent-dark);outline-offset:2px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:20;background:var(--surface);padding:8px 12px;border:2px solid var(--accent)}
.shell{max-width:1080px;margin:0 auto;padding:0 18px}

/* masthead */
.masthead{background:var(--surface);border-bottom:1px solid var(--rule)}
.utility{background:#2d2d2d;color:#f2efe9;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.utility .shell{display:flex;gap:16px;align-items:center;justify-content:space-between;padding-top:7px;padding-bottom:7px;flex-wrap:wrap}
.utility .era{font-weight:700;color:#fff}
.utility .strap{color:#d9d3ca}
.brandrow .shell{display:flex;align-items:center;gap:26px;padding-top:20px;padding-bottom:20px;flex-wrap:wrap}
.wordmark{display:block}
.wordmark img{width:240px;height:auto}
.brandtitle{margin:0;font-size:0;line-height:0}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.descriptor{margin:0;font:italic 20px/1.3 var(--serif);color:var(--meta)}
.catbar{background:var(--surface);border-bottom:3px solid var(--accent)}
.catbar ul{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.catbar a{display:block;padding:12px 9px;font-size:11.5px;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;color:var(--ink);border-bottom:2px solid transparent}
.catbar a:hover{color:var(--accent);border-bottom-color:var(--accent);text-decoration:none}

/* grid */
.grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:34px;
  background:var(--surface);padding:30px 22px 40px;border-left:1px solid var(--rule);border-right:1px solid var(--rule)}
.stream{min-width:0}

/* ribbon */
.ribbon{display:inline-block;font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:#fff;background:var(--accent);padding:5px 9px;margin:0 0 8px -8px;position:relative}
.ribbon::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:2px;background:var(--tint)}
.r-buyers-resources{background:#c22026}
.r-sellers-resources{background:#37576b}
.r-mortgage-resources{background:#5c4b51}
.r-home-renovation-resources{background:#7a5c2e}
.r-how-to-resources{background:#2f6b62}
.r-working-with-a-realtor{background:#4a5d3a}

/* section rules */
.rule{display:flex;align-items:baseline;gap:14px;margin:0 0 16px;font:700 19px/1.3 var(--serif);
  border-bottom:1px solid var(--rule);padding-bottom:7px}
.rule span{border-bottom:2px solid var(--accent);padding-bottom:7px;margin-bottom:-8px}
.rule .allink{margin-left:auto;font:400 12px/1 var(--sans);text-transform:uppercase;letter-spacing:.05em}

/* mosaic */
.mosaic{margin:0 0 34px}
.mgrid{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:auto auto;gap:16px;align-items:start}
.panel.big{grid-row:1 / span 2}
.panel img{width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--rule)}
.panel.big img{aspect-ratio:4/3}
.panel .ptext{padding-top:10px}
.panel.big h3{font:700 26px/1.24 var(--serif);margin:0 0 6px}
.panel.small h3{font:700 19px/1.28 var(--serif);margin:0 0 6px}
.panel.small img{aspect-ratio:3/2}
.panel h3 a{color:var(--ink)}
.panel h3 a:hover{color:var(--accent)}
.panel.small .excerpt{font-size:13.5px}

/* meta */
.meta{margin:0 0 8px;font-size:12.5px;color:var(--meta)}
.meta .by{margin-left:6px}
.excerpt{margin:0;color:var(--ink)}

/* rows */
.catsec{margin:0 0 34px}
.rows{display:flex;flex-direction:column}
.row{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--rule)}
.row:first-child{padding-top:0}
.thumb{flex:0 0 150px}
.thumb img{width:150px;height:100px;object-fit:cover;border:1px solid var(--rule)}
.datetile{width:150px;height:100px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;color:#fff;line-height:1.05;font-family:var(--serif)}
.dt-d{font-size:34px;font-weight:700}
.dt-m{font:700 12px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;margin:5px 0 3px}
.dt-y{font:400 12px/1 var(--sans);letter-spacing:.08em;opacity:.85}
.rm{white-space:nowrap;font-weight:700;font-size:12.5px}
.rowtext{min-width:0}
.row h3{font:700 22px/1.26 var(--serif);margin:0 0 6px}
.row h3 a{color:var(--ink)}
.row h3 a:hover{color:var(--accent)}
.row .excerpt{font-size:14px}

/* resource box */
.resourcebox{border:1px solid var(--rule);border-top:3px solid var(--accent);background:#fbf9f6;padding:20px 22px}
.resourcebox h2{margin:0 0 8px;font:700 19px/1.3 var(--serif)}
.resourcebox>p{margin:0 0 14px;font-size:14px;color:var(--meta)}
.rescats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
.rescats li{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;
  border-bottom:1px solid var(--rule);padding-bottom:8px}
.rescats .ribbon{margin:0}
.rescats .count{color:var(--meta);font-size:12px;margin-left:auto}
.allarticles{margin:16px 0 0;font-weight:700;font-size:13.5px}

/* rail */
.rail{min-width:0}
.widget{border:1px solid var(--rule);background:#fbf9f6;padding:16px 18px;margin:0 0 20px}
.widget h2{margin:0 0 12px;font:700 15px/1.3 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  border-bottom:2px solid var(--accent);padding-bottom:7px}
.widget.author img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--rule);margin-bottom:12px}
.widget p{margin:0 0 10px;font-size:13.5px;color:var(--meta)}
.widget .more{margin:0;font-weight:700}
.linklist{list-style:none;margin:0;padding:0}
.linklist li{display:flex;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--rule);font-size:13.5px}
.linklist li:last-child{border-bottom:0}
.linklist .count,.linklist .d{margin-left:auto;color:var(--meta);font-size:12px;white-space:nowrap}
.taglist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.taglist a{display:inline-block;font-size:12px;border:1px solid var(--rule);padding:4px 8px;color:var(--meta)}
.taglist a:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}

/* post */
.post{min-width:0;max-width:720px}
.posthead{margin:0 0 14px}
.post h1{font:700 30px/1.24 var(--serif);margin:0 0 8px}
.lead img{width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--rule)}
.lead{margin:0 0 20px}
.body{max-width:690px}
.body p{margin:0 0 15px}
.body h3{font:700 19px/1.3 var(--serif);margin:24px 0 10px}
.body ul,.body ol{margin:0 0 15px;padding-left:22px}
.body li{margin:0 0 7px}
.body blockquote{margin:0 0 15px;padding:2px 0 2px 16px;border-left:3px solid var(--accent);color:var(--meta)}
.portrait{margin:0 0 20px;max-width:360px}
.portrait img{border:1px solid var(--rule)}
.lede{font:italic 17px/1.5 var(--serif);color:var(--meta);margin:0 0 20px}
.testimonial{margin:0 0 26px;padding:0 0 20px;border-bottom:1px solid var(--rule)}
.testimonial p{margin:0 0 12px;font:16px/1.6 var(--serif)}
.testimonial cite{font:700 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);font-style:normal}
.tagrow{margin:22px 0 0;font-size:12.5px;color:var(--meta);border-top:1px solid var(--rule);padding-top:12px}
.prevnext{display:flex;gap:16px;margin:18px 0 0;border-top:1px solid var(--rule);padding-top:14px;flex-wrap:wrap}
.prevnext a{flex:1 1 240px;font:700 14px/1.35 var(--serif);color:var(--ink)}
.prevnext a:hover{color:var(--accent)}
.prevnext span{display:block;font:400 11px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;
  color:var(--meta);margin-bottom:5px}
.prevnext .next{text-align:right}
.related{margin:30px 0 0}
.archhead{margin:0 0 20px}
.archhead h1{font:700 30px/1.24 var(--serif);margin:0 0 6px;border-bottom:2px solid var(--accent);
  padding-bottom:9px;display:inline-block}
.archintro{margin:8px 0 0;font-size:13.5px;color:var(--meta)}

/* footer */
.sitefoot{background:#2d2d2d;color:#d9d3ca;margin-top:0;padding:34px 0 22px;font-size:13px}
.fcols{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.sitefoot h2{margin:0 0 12px;font:700 12px/1 var(--sans);letter-spacing:.07em;text-transform:uppercase;
  color:#fff;border-bottom:1px solid #4a4a4a;padding-bottom:8px}
.sitefoot ul{list-style:none;margin:0;padding:0}
.sitefoot li{padding:5px 0}
.sitefoot a{color:#d9d3ca}
.sitefoot a:hover{color:#fff}
.identity{margin:26px 0 0;padding-top:14px;border-top:1px solid #4a4a4a;font-size:11.5px;color:#9a938c}

@media (max-width:1120px){.grid{padding-left:16px;padding-right:16px}}
@media (max-width:780px){
  .grid{grid-template-columns:1fr;gap:26px}
  .stream{display:contents}
  .stream>div[data-polish-module]{display:contents}
  .mosaic{order:1}
  .catsec:first-of-type{order:2}
  .rail{order:3}
  .catsec:last-of-type{order:4}
  .resourcebox{order:5}
  .mgrid{grid-template-columns:1fr}
  .panel.big{grid-row:auto}
  .panel.small{display:flex;gap:14px}
  .panel.small .pimg{flex:0 0 96px}
  .panel.small img{width:96px;height:64px;aspect-ratio:auto}
  .wordmark img{width:180px}
  .descriptor{font-size:17px}
  .brandrow .shell{padding-top:14px;padding-bottom:14px;gap:14px}
  .catbar a{padding:7px 8px;font-size:11px}
  .fcols{grid-template-columns:1fr;gap:0}
  .sitefoot section{border-bottom:1px solid #4a4a4a;padding-bottom:14px;margin-bottom:14px}
  .rescats{grid-template-columns:1fr}
}
@media (max-width:480px){
  body{font-size:16px}
  .grid{padding:20px 14px 30px;border-left:0;border-right:0}
  .row{flex-direction:column;gap:10px}
  .thumb,.thumb img{width:100%;flex:none}
  .thumb img{height:auto;aspect-ratio:3/2}
  .row h3{font-size:20px}
  .excerpt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .post h1,.archhead h1{font-size:24px}
  .panel.big h3{font-size:21px}
  .wordmark img{width:150px}
  .ribbon::after{height:1px}
  .lead{margin-left:-14px;margin-right:-14px}
  .lead img{border-left:0;border-right:0}
  .prevnext .next{text-align:left}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
