/* MFWR blog — shared styles. Tokens mirror book.html so the site reads as one piece. */
:root{
  --teal-800:#155e75; --teal-700:#0e7490; --teal-600:#0891b2; --teal-50:#ecfeff;
  --ink-900:#0f172a; --ink-700:#334155; --ink-500:#64748b; --ink-300:#cbd5e1;
  --ink-100:#f1f5f9; --ink-50:#f8fafc;
  --amber-700:#b45309; --amber-50:#fffbeb; --amber-200:#fde68a;
  --green-900:#065f46; --green-50:#ecfdf5; --green-200:#a7f3d0;
  --shadow-md:0 8px 24px rgba(15,23,42,.08), 0 2px 6px rgba(15,23,42,.04);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Hanken Grotesk',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink-900);background:var(--ink-50);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--teal-700);text-decoration:none}
a:hover{text-decoration:underline}

a.topbar{display:flex;align-items:center;justify-content:center;gap:9px;padding:13px 24px;background:#fff;border-bottom:1px solid var(--ink-100);font-weight:800;letter-spacing:-.01em;font-size:15.5px;color:var(--teal-800)}
a.topbar:hover{text-decoration:none}
a.topbar svg{width:21px;height:21px;display:block}

.wrap{max-width:680px;margin:0 auto;padding:34px 22px 12px}
.crumb{display:inline-block;font-size:14px;font-weight:600;margin:0 0 16px}
.meta{font-size:13px;color:var(--ink-500);margin:0 0 10px}
.eyebrow{display:inline-block;font-size:13px;font-weight:800;letter-spacing:.02em;color:var(--teal-700);background:var(--teal-50);border:1px solid #bae6fd;border-radius:999px;padding:5px 13px;margin:0 0 14px}
h1{font-family:'Fraunces','Source Serif 4',Georgia,serif;font-weight:700;font-size:31px;line-height:1.14;letter-spacing:-.02em;margin:0 0 12px}
.sub{font-size:16.5px;color:var(--ink-700);margin:0 0 24px}
.post h2{font-family:'Fraunces','Source Serif 4',Georgia,serif;font-weight:700;font-size:22px;line-height:1.2;letter-spacing:-.01em;margin:30px 0 10px}
.post p{font-size:15.5px;color:var(--ink-700);margin:0 0 14px}
.post p b,.post li b{color:var(--ink-900)}
.post ol,.post ul{padding-left:22px;color:var(--ink-700);font-size:15.5px;margin:0 0 14px}
.post li{margin:0 0 8px}

/* Big number moment (visual-first: one stat carries the section) */
.bigstat{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--ink-100);border-radius:16px;box-shadow:var(--shadow-md);padding:16px 18px;margin:16px 0}
.bigstat .n{font-family:'Fraunces','Source Serif 4',Georgia,serif;font-weight:700;font-size:46px;line-height:1;color:var(--teal-800);white-space:nowrap}
.bigstat .cap{font-size:14px;color:var(--ink-700);line-height:1.5}

/* Two-sided comparison */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.duo .side{background:#fff;border:1px solid var(--ink-100);border-radius:14px;padding:13px 14px}
.duo .side.good{border-color:var(--green-200);background:var(--green-50)}
.duo .side.bad{border-color:var(--amber-200);background:var(--amber-50)}
.duo .side h3{margin:0 0 6px;font-size:14.5px;line-height:1.3}
.duo .side.good h3{color:var(--green-900)}
.duo .side.bad h3{color:var(--amber-700)}
.duo .side p{font-size:13.5px;color:var(--ink-700);margin:0;line-height:1.5}

/* Icon cards (same shape as book.html .checks) */
.checks{list-style:none;margin:14px 0;padding:0;display:grid;grid-template-columns:1fr;gap:10px}
.checks li{display:flex;gap:11px;align-items:flex-start;background:#fff;border:1px solid var(--ink-100);border-radius:12px;padding:12px 13px}
.checks .ic{flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:var(--teal-50);display:flex;align-items:center;justify-content:center;font-size:17px}
.checks b{display:block;font-size:14.5px;color:var(--ink-900);line-height:1.3}
.checks span{display:block;font-size:13.5px;color:var(--ink-500);line-height:1.5;margin-top:2px}

/* Option cards (pitcher / RO / whole-home) */
.opt{background:#fff;border:1px solid var(--ink-100);border-radius:16px;box-shadow:var(--shadow-md);padding:16px 17px;margin:14px 0}
.opt .opt-h{display:flex;align-items:center;gap:10px;margin:0 0 4px}
.opt .opt-h .ic{font-size:22px}
.opt .opt-h h3{font-family:'Fraunces','Source Serif 4',Georgia,serif;font-size:18.5px;margin:0;line-height:1.2}
.opt .bestfor{font-size:13px;font-weight:700;color:var(--teal-700);margin:0 0 10px}
.opt .row{display:flex;gap:9px;font-size:14px;color:var(--ink-700);line-height:1.5;margin:0 0 7px}
.opt .row .k{flex:0 0 18px;font-weight:800}
.opt .row .k.yes{color:#16a34a}
.opt .row .k.no{color:var(--amber-700)}

/* Callouts */
.tipbox{background:var(--teal-50);border:1px dashed var(--teal-600);border-radius:14px;padding:13px 15px;font-size:14.5px;color:var(--ink-700);margin:14px 0}
.warnbox{background:var(--amber-50);border:1px solid var(--amber-200);border-radius:14px;padding:13px 15px;font-size:14.5px;color:var(--ink-700);margin:14px 0}
.warnbox b,.tipbox b{color:var(--ink-900)}

/* Booking CTA — bottom of every page */
.ctacard{background:#fff;border:2px solid var(--teal-600);border-radius:18px;box-shadow:var(--shadow-md);padding:20px 20px 16px;margin:34px 0 8px;text-align:center}
.ctacard .ctabadge{display:inline-flex;align-items:baseline;gap:6px;background:var(--green-50);border:1px solid var(--green-200);color:var(--green-900);border-radius:999px;padding:6px 13px;font-weight:700;font-size:13.5px;margin:0 0 10px}
.ctacard h2{font-family:'Fraunces','Source Serif 4',Georgia,serif;font-size:22px;margin:0 0 8px;line-height:1.2}
.ctacard p{font-size:14.5px;color:var(--ink-700);margin:0 0 14px;line-height:1.55}
.btn{display:block;width:100%;background:var(--teal-700);color:#fff;font-weight:800;font-size:16px;border:none;border-radius:13px;padding:15px 18px;text-align:center}
.btn:hover{background:var(--teal-800);text-decoration:none}
.ctafine{font-size:13px;color:var(--ink-500);margin:10px 0 0}
.ctafine b{color:var(--ink-700);white-space:nowrap}
.getreport{text-align:center;font-size:14.5px;margin:14px 0 0}

/* Blog index list */
.postcard{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid var(--ink-100);border-radius:14px;padding:14px 15px;margin:0 0 10px;color:inherit;box-shadow:var(--shadow-md)}
.postcard:hover{text-decoration:none;border-color:var(--teal-600);background:var(--teal-50)}
.pc-ic{flex:0 0 auto;width:42px;height:42px;border-radius:10px;background:var(--teal-50);display:flex;align-items:center;justify-content:center;font-size:20px}
.postcard:hover .pc-ic{background:#fff}
.pc-tx b{display:block;font-family:'Fraunces','Source Serif 4',Georgia,serif;font-size:16.5px;font-weight:700;color:var(--ink-900);line-height:1.25}
.pc-tx span{display:block;font-size:13.5px;color:var(--ink-500);line-height:1.45;margin-top:3px}
.pc-arrow{flex:0 0 auto;margin-left:auto;font-weight:800;color:var(--teal-700);font-size:18px}

footer.site{background:var(--ink-900);color:#cbd5e1;font-size:12.5px;padding:26px 24px 40px;text-align:center;line-height:1.7;margin-top:34px}
footer.site .lic{color:#e2e8f0;font-weight:600;text-decoration:underline;text-decoration-color:#64748b;text-underline-offset:2px}

@media (max-width:560px){
  h1{font-size:26px}
  .wrap{padding:26px 18px 10px}
  .duo{grid-template-columns:1fr}
  .bigstat .n{font-size:38px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
