/* Hope look for /nt-explorer. Builds on hope-guides.css. The journeys map keeps
   the shared sepia tile wash (style.css) inside a white frame; the tabs become a
   one-row segmented control; cards and drawer go white with dark ink. */

body.hope-guide .nt-page { color: var(--hg-text); font-family: var(--hg-font); }

/* Hero as one white card */
body.hope-guide .nt-hero { max-width: 1120px; margin: 0 auto; padding: var(--nav-clear) 20px 6px; text-align: left; }
body.hope-guide .nt-hero .gh-hero { max-width: none; background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius); box-shadow: var(--hg-shadow); padding: 28px 32px; }
body.hope-guide .nt-hero .gh-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--hg-primary); }
body.hope-guide .nt-hero .gh-title { font-weight: 800; font-size: clamp(30px, 4.4vw, 42px); letter-spacing: -0.01em; line-height: 1.12; background: none; -webkit-text-fill-color: currentColor; color: var(--hg-text) !important; }
body.hope-guide .nt-hero .gh-lede { font-size: 18px; font-style: normal; font-weight: 600; color: var(--hg-body); }
body.hope-guide .nt-hero .gh-intro p { font-size: 16.5px; line-height: 1.65; color: var(--hg-muted); }
body.hope-guide .nt-hero .gh-stat { font-size: 14px; color: var(--hg-muted); letter-spacing: 0; text-transform: none; }
body.hope-guide .nt-hero .gh-stat b { color: var(--hg-text); }
body.hope-guide .nt-hero .gh-frame { border-radius: var(--hg-radius-sm); border-color: var(--hg-border); box-shadow: none; }
body.hope-guide .nt-hero .gh-frame::after { display: none; }
body.hope-guide .nt-hero .gh-art-cap { font-size: 13px; font-weight: 700; color: var(--hg-text); background: var(--hg-surface); border: 1px solid var(--hg-border); font-style: normal; letter-spacing: 0; text-transform: none; }
body.hope-guide .nt-hint { text-align: left; font-size: 15px; color: var(--hg-muted); padding: 0; max-width: none; }

/* Tabs: segmented control */
body.hope-guide .nt-tabs { display: flex; justify-content: flex-start; width: max-content; max-width: 100%; margin-top: 18px; background: var(--hg-primary-soft); border: 0; border-radius: 12px; padding: 4px; gap: 4px; }
body.hope-guide .nt-tab { min-height: 44px; font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--hg-primary); border-radius: 9px; padding: 10px 16px; white-space: nowrap; flex: 0 0 auto; }
body.hope-guide .nt-tab:hover { background: rgba(58, 87, 232, 0.08); }
body.hope-guide .nt-tab.is-active { background: var(--hg-primary); color: #fff; font-weight: 700; }

body.hope-guide .nt-content { max-width: 1120px; }

/* Cards */
body.hope-guide .nt-card { background: var(--hg-surface); border: 1px solid var(--hg-border); border-top: 4px solid var(--cc, var(--hg-primary)); border-radius: var(--hg-radius-sm); box-shadow: var(--hg-shadow-sm); padding: 18px 20px; }
body.hope-guide .nt-card:hover { transform: translateY(-2px); border-color: var(--hg-primary); border-top-color: var(--cc, var(--hg-primary)); box-shadow: 0 8px 22px rgba(58, 87, 232, 0.12); }
body.hope-guide .nt-card-theme { font-size: 12.5px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--hg-text); background: var(--hg-surface-2); border: 1px solid var(--hg-border); display: inline-flex; align-items: center; gap: 7px; }
body.hope-guide .nt-card-theme::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--cc, var(--hg-primary)); flex: 0 0 auto; }
body.hope-guide .nt-card-name { font-size: 19px !important; font-weight: 800; color: var(--hg-text) !important; line-height: 1.25; }
body.hope-guide .nt-card--gospel .nt-card-name { font-size: 24px !important; }
body.hope-guide .nt-card-ref { font-size: 14px; font-style: normal; color: var(--hg-faint); }
body.hope-guide .nt-card-text, body.hope-guide .nt-card-portrait { font-size: 15.5px; line-height: 1.55; color: var(--hg-body); }
body.hope-guide .nt-card-symbol { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--hg-muted); }
body.hope-guide .nt-card-date { font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--hg-muted); }

/* Journeys map: white frame; the sepia tile wash from style.css stays */
body.hope-guide .nt-map { border: 1px solid var(--hg-border); border-radius: var(--hg-radius); box-shadow: var(--hg-shadow); }
body.hope-guide .nt-map.leaflet-container, body.hope-guide .nt-map .leaflet-container { font-family: var(--hg-font); }
body.hope-guide .nt-map .leaflet-control-attribution { font-size: 12px; background: rgba(255, 255, 255, 0.9); color: var(--hg-muted); }
body.hope-guide .nt-map .leaflet-bar { border: 1px solid var(--hg-border-strong); box-shadow: var(--hg-shadow-sm); border-radius: 10px; overflow: hidden; }
body.hope-guide .nt-map .leaflet-bar a { width: 40px; height: 40px; line-height: 40px; color: var(--hg-text); background: var(--hg-surface); border-bottom-color: var(--hg-border); }
body.hope-guide .nt-map .leaflet-bar a:hover { background: var(--hg-primary-soft); color: var(--hg-primary); }
body.hope-guide .nt-map .leaflet-tooltip { font-family: var(--hg-font); font-size: 14px; font-weight: 700; color: var(--hg-text); background: var(--hg-surface); border: 1px solid var(--hg-border-strong); border-radius: 8px; box-shadow: var(--hg-shadow-sm); }

/* Journey rows */
body.hope-guide .nt-journey { background: var(--hg-surface); border: 1px solid var(--hg-border); border-left: 4px solid var(--jc, var(--hg-primary)); border-radius: var(--hg-radius-sm); box-shadow: var(--hg-shadow-sm); padding: 18px 20px; }
body.hope-guide .nt-journey:hover { transform: translateY(-2px); border-color: var(--hg-primary); border-left-color: var(--jc, var(--hg-primary)); box-shadow: 0 8px 22px rgba(58, 87, 232, 0.12); }
body.hope-guide .nt-journey-num { font-size: 18px; font-weight: 800; color: #fff; box-shadow: none; }
body.hope-guide .nt-journey-stops { font-size: 14.5px; color: var(--hg-muted); }

/* Drawer (outside main) */
body.hope-guide .nt-scrim { background: rgba(17, 24, 39, 0.45); }
body.hope-guide .nt-drawer { background: var(--hg-surface); border-left: 0; box-shadow: -16px 0 46px rgba(17, 24, 39, 0.18); font-family: var(--hg-font); color: var(--hg-text); }
body.hope-guide .nt-drawer * { font-family: var(--hg-font) !important; }
body.hope-guide .nt-drawer :is(h2, h3, h4) { font-variant: normal; }
body.hope-guide .nt-drawer :focus-visible { outline: 3px solid var(--hg-primary) !important; outline-offset: 2px; }
body.hope-guide .nt-drawer-head { background: none; border-bottom: 1px solid var(--hg-border); }
body.hope-guide .nt-drawer-close { min-width: 44px; min-height: 44px; display: grid; place-items: center; top: 10px; right: 10px; border-radius: 10px; color: var(--hg-faint); }
body.hope-guide .nt-drawer-close:hover { color: var(--hg-text); background: var(--hg-surface-2); }
body.hope-guide .nt-drawer-name { font-size: 22px !important; font-weight: 800; color: var(--hg-text) !important; line-height: 1.25; text-transform: none; padding-right: 40px; }
body.hope-guide .nt-drawer-meta { font-size: 13.5px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--hg-muted); }
body.hope-guide .nt-drawer-theme { font-size: 13px; font-weight: 700; color: var(--hg-text); background: var(--hg-surface-2); border: 1px solid var(--hg-border); }
body.hope-guide .nt-drawer-lead { font-size: 17px; line-height: 1.6; color: var(--hg-text); }
body.hope-guide .nt-drawer-p { font-size: 16px; line-height: 1.65; color: var(--hg-body); }
body.hope-guide .nt-drawer h3 { font-size: 13px !important; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--hg-primary) !important; }
body.hope-guide .nt-drawer-row { font-size: 15px; color: var(--hg-body); border-top-color: var(--hg-border); }
body.hope-guide .nt-drawer-row .k { font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--hg-text); }

@media (max-width: 720px) {
  body.hope-guide .nt-hero { padding-left: 16px; padding-right: 16px; }
  body.hope-guide .nt-hero .gh-hero { padding: 20px 18px; }
  body.hope-guide .nt-hero .gh-art { display: none; }
  body.hope-guide .nt-tabs { width: 100%; justify-content: flex-start; }
  body.hope-guide .nt-hero .gh-intro p + p { display: none; }
  body.hope-guide .nt-tab { padding: 10px 12px; font-size: 14.5px; }
  body.hope-guide .nt-content { padding: 0 16px; }
  body.hope-guide .nt-grid--parables, body.hope-guide .nt-grid--gospels { grid-template-columns: 1fr; }
}