/* MovePath — clean route-map style, mobile-first. */
:root {
  --ink: #20302e;
  --teal: #0e4f4a;
  --teal-dark: #09332f;
  --accent: #c96f2e;
  --accent-dark: #a5571f;
  --paper: #faf7f1;
  --card: #ffffff;
  --line: #ddd3c0;
  --muted: #5f6f6a;
  --good: #1e6b3a;
  --good-bg: #eef6ee;
  --bad: #9c2b1e;
  --bad-bg: #fbf0ec;
  --warn-bg: #fdf3e0;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6; font-size: 17px;
}
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; color: var(--teal); line-height: 1.25; }
h1 { font-size: 1.9rem; margin: 0.4em 0 0.3em; }
h2 { font-size: 1.35rem; margin: 1.4em 0 0.4em; border-bottom: 2px solid var(--line); padding-bottom: 0.2em; }
h3 { font-size: 1.1rem; margin: 1.1em 0 0.3em; }
a { color: var(--teal); text-decoration-color: var(--accent); text-underline-offset: 2px; }
a:hover { color: var(--accent-dark); }
.wrap { max-width: 880px; margin: 0 auto; padding: 0 18px 40px; }

header.site { background: var(--teal); color: #fff; padding: 14px 0 10px; }
header.site .wrap { padding-bottom: 0; }
.brand { font-family: Georgia, serif; font-size: 1.35rem; font-weight: bold; color: #fff; text-decoration: none; }
.brand span { color: #f0b27a; }
.tagline { color: #cfe0dc; font-size: 0.9rem; margin: 2px 0 10px; }
nav.tools { display: flex; flex-wrap: wrap; gap: 4px 14px; padding-bottom: 12px; }
nav.tools a { color: #eaf3f1; font-size: 0.92rem; text-decoration: none; padding: 3px 2px; }
nav.tools a:hover, nav.tools a[aria-current="page"] { color: #f0b27a; text-decoration: underline; }

.lede { font-size: 1.08rem; color: #33473f; }
.card {
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 20px; margin: 18px 0; box-shadow: 0 1px 3px rgba(32, 48, 46, 0.06);
}
fieldset { border: 0; padding: 0; margin: 0; }
.field { margin-bottom: 14px; }
label { display: block; font-weight: 600; margin-bottom: 4px; font-size: 0.98rem; }
.hint { font-weight: 400; color: var(--muted); font-size: 0.88rem; display: block; }
input[type="number"], select {
  width: 100%; max-width: 360px; padding: 10px 12px; font-size: 1rem;
  border: 1px solid #b9c4bf; border-radius: 6px; background: #fff; color: var(--ink);
}
input[type="number"]:focus, select:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.inline { display: flex; gap: 10px; flex-wrap: wrap; }
.inline .field { flex: 1 1 200px; }
button.plan {
  background: var(--teal); color: #fff; border: 0; border-radius: 6px;
  font-size: 1.05rem; font-weight: 600; padding: 12px 26px; cursor: pointer; margin-top: 4px;
}
button.plan:hover { background: var(--accent-dark); }

.grid { display: grid; grid-template-columns: 1fr; gap: 14px; margin: 18px 0; }
@media (min-width: 640px) { .grid { grid-template-columns: 1fr 1fr; } }
.tool-card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; }
.tool-card h3 { margin-top: 0; }
.tool-card p { margin: 0.3em 0 0; color: #33473f; font-size: 0.97rem; }

.callout { background: var(--warn-bg); border-left: 4px solid var(--accent); padding: 12px 16px; margin: 16px 0; border-radius: 0 8px 8px 0; }
.example { background: #edf4f2; border-left: 4px solid var(--teal); padding: 12px 16px; margin: 16px 0; border-radius: 0 8px 8px 0; }
.disclaimer { background: #f4efe4; border: 1px solid var(--line); border-radius: 8px; padding: 12px 16px; font-size: 0.92rem; color: #4c5a55; margin: 18px 0; }

/* Planner report */
.report { margin-top: 22px; }
.report:empty { display: none; }
.verdict { display: inline-block; font-weight: 700; font-size: 0.82rem; letter-spacing: 0.04em; text-transform: uppercase; border-radius: 20px; padding: 2px 12px; vertical-align: middle; }
.verdict.meets { background: var(--good-bg); color: var(--good); border: 1px solid var(--good); }
.verdict.short { background: var(--bad-bg); color: var(--bad); border: 1px solid var(--bad); }
.verdict.info { background: #eef2f5; color: var(--teal); border: 1px solid var(--teal); }
.pathway { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; margin: 14px 0; }
.pathway h3 { margin-top: 0; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.pathway .req { font-size: 0.95rem; color: #33473f; }
table.numbers { border-collapse: collapse; width: 100%; margin: 12px 0; font-size: 0.95rem; }
table.numbers th, table.numbers td { border: 1px solid var(--line); padding: 6px 9px; text-align: right; }
table.numbers th { background: #f0e8d8; color: var(--teal); }
table.numbers td:first-child, table.numbers th:first-child { text-align: left; }
.scroll-x { overflow-x: auto; }
ol.steps li, ul.docs li { margin: 0.35em 0; }
.src { font-size: 0.85rem; color: var(--muted); }
.src a { color: var(--muted); }

details.faq { border: 1px solid var(--line); border-radius: 8px; background: var(--card); padding: 10px 16px; margin: 10px 0; }
details.faq summary { font-weight: 600; cursor: pointer; color: var(--teal); }
details.faq p { margin: 0.5em 0 0.3em; }

footer.site { border-top: 2px solid var(--line); margin-top: 34px; padding-top: 16px; color: var(--muted); font-size: 0.88rem; }
footer.site nav { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-bottom: 10px; }
.small { font-size: 0.9rem; color: var(--muted); }

/* --- MovePath v2: verdict-first report, glance, fallback, freshness --- */
div.verdict {
  display: block; text-transform: none; letter-spacing: normal; font-weight: 400;
  background: var(--teal); color: #fff; border-radius: 10px; padding: 18px 20px; margin: 20px 0 6px;
}
div.verdict h2 { color: #fff; border: 0; margin: 0 0 6px; font-size: 1.45rem; }
.checked-line { color: #cfe0dc; font-size: 0.9rem; margin: 0; }
.badge { display: inline-block; font-weight: 700; font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; border-radius: 20px; padding: 2px 11px; vertical-align: middle; white-space: nowrap; }
.badge.good { background: var(--good-bg); color: var(--good); border: 1px solid var(--good); }
.badge.bad { background: var(--bad-bg); color: var(--bad); border: 1px solid var(--bad); }
.badge.info { background: #eef2f5; color: var(--teal); border: 1px solid var(--teal); }
.pathway h4 { margin: 0 0 6px; font-size: 1.08rem; color: var(--teal); display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.reqline { font-size: 1.02rem; }
.verdict-line { background: #f7f2e7; border-radius: 6px; padding: 8px 12px; }
.fresh { font-size: 0.85rem; color: var(--muted); margin: 8px 0 0; }
.stale { background: var(--warn-bg); border: 1px dashed var(--accent); border-radius: 6px; padding: 8px 12px; font-size: 0.95rem; margin: 8px 0 0; }
.fees { font-size: 0.95rem; }
.door-links { font-size: 0.95rem; }
.glance { background: #edf4f2; border: 1px solid var(--teal); border-radius: 10px; padding: 16px 20px; margin: 16px 0; }
.glance h3 { margin-top: 0; }
.glance-big { font-size: 1.12rem; }
.glance ul { margin: 8px 0; padding-left: 20px; }
.col-contrast { background: var(--warn-bg); border-left: 4px solid var(--accent); padding: 10px 14px; border-radius: 0 8px 8px 0; }
.muted { color: var(--muted); }
.step-meta { display: inline-block; font-size: 0.85rem; color: var(--muted); background: #f4efe4; border-radius: 4px; padding: 0 7px; margin-left: 6px; white-space: nowrap; }
.leaving { background: #fdf6ec; border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 8px; padding: 12px 16px; margin: 14px 0; }
.leaving h4 { margin-top: 0; color: var(--accent-dark); }
.fallback { background: var(--good-bg); border: 1px solid var(--good); border-radius: 10px; padding: 14px 20px; margin: 18px 0; }
.fallback h3 { color: var(--good); border: 0; margin-top: 4px; }
.qualify-list { list-style: none; padding: 0; }
.qualify-list li { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px; margin: 8px 0; }
.qualify-list li.q-yes { border-left: 5px solid var(--good); }
.qualify-list li.q-no { border-left: 5px solid var(--bad); }
.report-actions button, button.ghost {
  background: #fff; color: var(--teal); border: 1px solid var(--teal); border-radius: 6px;
  font-size: 0.98rem; font-weight: 600; padding: 9px 18px; cursor: pointer; margin-right: 8px;
}
.report-actions button:hover, button.ghost:hover { background: var(--teal); color: #fff; }
button.qualify { background: var(--accent); }
button.qualify:hover { background: var(--accent-dark); }
.dest-grid { display: grid; grid-template-columns: 1fr; gap: 14px; margin: 18px 0; }
@media (min-width: 640px) { .dest-grid { grid-template-columns: 1fr 1fr 1fr; } }
@media print {
  header.site, nav.tools, .card form, #planner-card, .report-actions, footer.site nav, .no-print { display: none !important; }
  body { background: #fff; font-size: 12pt; }
  .wrap { max-width: 100%; }
  div.verdict { background: #fff; color: #000; border: 2px solid #000; }
  div.verdict h2 { color: #000; }
  .checked-line { color: #333; }
  .pathway, .glance, .fallback, .leaving { break-inside: avoid; }
  a { color: #000; text-decoration: none; }
}

/* --- Fantasy layer + monetization slots --- */
.report-hero, .guide-hero { width: 100%; border-radius: 10px; margin: 12px 0 4px; aspect-ratio: 16/7; object-fit: cover; }
.dream-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 20px 0; }
@media (min-width: 640px) { .dream-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) { .dream-grid { grid-template-columns: 1fr 1fr 1fr; } }
.dream-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(32,48,46,0.08); }
.dream-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.dream-card .dc-body { padding: 12px 16px 16px; }
.dream-card h3 { margin: 0 0 4px; }
.dream-card .dc-line { color: #33473f; font-size: 0.97rem; margin: 0 0 8px; }
.dream-card .dc-nums { font-size: 0.92rem; color: var(--muted); margin: 0 0 10px; }
.dream-card .dc-nums strong { color: var(--teal); }
.vignette { font-style: italic; color: #33473f; background: #fdf8ee; border-left: 4px solid var(--accent); padding: 12px 16px; border-radius: 0 8px 8px 0; margin: 14px 0; }
.anchor-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.anchor-chip { background: #edf4f2; border: 1px solid var(--teal); color: var(--teal-dark); border-radius: 20px; padding: 5px 14px; font-size: 0.93rem; font-weight: 600; }
.ad-slot { border: 1.5px dashed #c9bda3; border-radius: 8px; color: #9a8c6e; text-align: center; padding: 18px 10px; font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase; margin: 18px 0; background: #fbf9f4; }
.services { background: #f7f2e7; border: 1px solid var(--line); border-radius: 8px; padding: 10px 16px; margin: 14px 0; }
.services-title { font-weight: 700; color: var(--accent-dark); margin: 0 0 4px; font-size: 0.92rem; text-transform: uppercase; letter-spacing: 0.04em; }
.services ul { margin: 0; padding-left: 18px; }
.email-capture { background: var(--teal); color: #fff; border-radius: 10px; padding: 18px 20px; margin: 20px 0; }
.email-capture h4 { color: #fff; margin: 0 0 4px; font-size: 1.1rem; }
.email-capture p { margin: 0 0 10px; color: #eaf3f1; }
.email-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.email-form label { color: #fff; font-size: 0.9rem; }
.email-form input { display: block; margin-top: 4px; padding: 9px 12px; border-radius: 6px; border: 0; font-size: 1rem; }
.email-form button { background: var(--accent); color: #fff; border: 0; border-radius: 6px; padding: 10px 20px; font-weight: 700; cursor: pointer; }
.email-form button:hover { background: var(--accent-dark); }
.small { font-size: 0.85rem; }
@media print { .email-capture, .services, .ad-slot, .pwa-install { display: none !important; } .report-hero { display: none !important; } }

/* --- PWA install affordance (slim bar, only when the browser offers install) --- */
.pwa-install {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 14px; z-index: 60;
  width: min(560px, calc(100% - 24px));
  background: var(--teal); color: #fff; border-radius: 10px;
  box-shadow: 0 6px 24px rgba(9, 51, 47, 0.35);
  padding: 10px 12px; display: flex; align-items: center; gap: 10px; font-size: 0.92rem;
}
.pwa-install p { margin: 0; flex: 1; color: #eaf3f1; }
.pwa-install .pwa-go {
  background: var(--accent); color: #fff; border: 0; border-radius: 6px;
  padding: 8px 14px; font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.pwa-install .pwa-go:hover { background: var(--accent-dark); }
.pwa-install .pwa-x {
  background: transparent; color: #cfe0dc; border: 0; font-size: 1.1rem;
  line-height: 1; cursor: pointer; padding: 6px;
}