/* Guide pages (lake homes, buyers, moving here). Loaded after site.css. */

.top.sub .wrap{grid-template-columns:1fr;max-width:860px}
.top.sub .topo{--focus:30% 40%}
.crumbs{font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--onplum-dim);margin:0 0 22px}
.crumbs a{color:var(--onplum);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);
  display:inline-block;padding-block:10px}
.crumbs a:hover{color:#fff}
.top.sub .lede{max-width:56ch}
.top.sub .byline{margin-top:32px;justify-content:flex-start}

.guide{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.guide.alt{background:var(--card)}
.guide .wrap{position:relative;z-index:1;padding-block:clamp(40px,6vw,64px);max-width:860px}
.guide h2{font-size:clamp(24px,3.6vw,34px);margin-top:12px}
.guide h3{margin-top:30px;font-size:20px;letter-spacing:.02em}
.prose p{margin-top:14px;color:var(--muted);font-size:17px;line-height:1.65;max-width:66ch}
.prose p:first-child{margin-top:18px}
.prose b{color:var(--ink);font-weight:600}
.prose a,.checklist a{color:var(--ink);text-decoration-color:var(--pink);text-underline-offset:3px}
.guide .contour{--at:40% 50%;--zoom:auto 170%}
.guide.g2 .contour{--at:86% 30%}
.guide.g3 .contour{--at:56% 80%}
.guide.g4 .contour{--at:18% 12%}

.checklist{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:16px}
.checklist li{position:relative;padding-left:20px;color:var(--muted);font-size:16.5px;line-height:1.55;max-width:66ch}
.checklist li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;background:var(--pink)}
.checklist b{color:var(--ink);font-weight:600}

.steps{counter-reset:step;list-style:none;padding:0;margin:24px 0 0;display:grid;gap:20px}
.steps li{counter-increment:step;position:relative;padding-left:50px;color:var(--muted);font-size:16.5px;line-height:1.55;max-width:66ch}
.steps li::before{content:counter(step);position:absolute;left:0;top:0;width:34px;height:34px;display:grid;place-items:center;
  background:var(--plum);color:#fff;font-family:var(--display);font-weight:500;font-size:17px}
.steps b{display:block;color:var(--ink);font-family:var(--display);font-weight:600;text-transform:uppercase;
  letter-spacing:.03em;font-size:16px;margin-bottom:4px}

.callout{margin-top:28px;border-left:4px solid var(--pink);padding:6px 0 6px 20px;font-size:17px;line-height:1.6;color:var(--ink);max-width:62ch}
.fineprint{margin-top:18px;font-size:14px;color:var(--muted);max-width:66ch}

.related{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:26px}
.related a{background:var(--paper);padding:22px;text-decoration:none;display:block}
.related a b{display:block;font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:18px;color:var(--ink)}
.related a span{display:block;margin-top:6px;color:var(--muted);font-size:15px;line-height:1.5}
.related a:hover b,.related a:focus-visible b{color:var(--pink)}
.related a:focus-visible{outline:2px solid var(--pink);outline-offset:-2px}

.cta-band h2{max-width:20ch}
.cta-band .cta{margin-top:26px}

@media (max-width:760px){
  .top.sub .byline{justify-content:flex-start}
}