/* Hope look for /archaeology (The Bible Was Here). Builds on hope-guides.css.
   The map keeps the shared sepia tile wash. Pins get a 44px hit area (the
   coloured dot stays small), and every card and drawer names its category in
   text. The drawer sits outside <main>, so it gets the Hope font here. */

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

/* Hero as one white card */
body.hope-guide .ark-hero { max-width: 1120px; margin: 0 auto; padding: var(--nav-clear) 20px 6px; text-align: left; }
body.hope-guide .ark-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 .ark-hero .gh-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--hg-primary); }
body.hope-guide .ark-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 .ark-hero .gh-lede { font-size: 18px; font-style: normal; font-weight: 600; color: var(--hg-body); }
body.hope-guide .ark-hero .gh-intro p { font-size: 16.5px; line-height: 1.65; color: var(--hg-muted); }
body.hope-guide .ark-hero .gh-stat { font-size: 14px; color: var(--hg-muted); letter-spacing: 0; text-transform: none; }
body.hope-guide .ark-hero .gh-stat b { color: var(--hg-text); }
body.hope-guide .ark-hero .gh-frame { border-radius: var(--hg-radius-sm); border-color: var(--hg-border); box-shadow: none; }
body.hope-guide .ark-hero .gh-frame::after { display: none; }
body.hope-guide .ark-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 .ark-hint { text-align: left; font-size: 15px; color: var(--hg-muted); padding: 0; }

/* Filters */
body.hope-guide .ark-filters { justify-content: flex-start; max-width: none; margin-top: 16px; }
body.hope-guide .ark-filter { min-height: 44px; font-size: 14.5px; font-weight: 600; letter-spacing: 0; border: 1px solid var(--hg-border-strong); background: var(--hg-surface); color: var(--hg-text); padding: 8px 16px; }
body.hope-guide .ark-filter:hover { border-color: var(--hg-primary); }
body.hope-guide .ark-filter.is-active { background: var(--hg-primary); border-color: var(--hg-primary); color: #fff; }
body.hope-guide .ark-filter.is-active .ark-filter-dot { background: #fff; }

/* Map: white frame; 44px tap targets on every pin */
body.hope-guide .ark-map-inner { border: 1px solid var(--hg-border); border-radius: var(--hg-radius); box-shadow: var(--hg-shadow); }
body.hope-guide .ark-map-inner .leaflet-container { font-family: var(--hg-font); }
body.hope-guide .ark-map-inner .leaflet-control-attribution { font-size: 12px; background: rgba(255, 255, 255, 0.9); color: var(--hg-muted); }
body.hope-guide .ark-map-inner .leaflet-bar { border: 1px solid var(--hg-border-strong); box-shadow: var(--hg-shadow-sm); border-radius: 10px; overflow: hidden; }
body.hope-guide .ark-map-inner .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 .ark-map-inner .leaflet-bar a:hover { background: var(--hg-primary-soft); color: var(--hg-primary); }
body.hope-guide .ark-map-inner .leaflet-tooltip { font-family: var(--hg-font); font-size: 14px; font-weight: 700; letter-spacing: 0; color: var(--hg-text); background: var(--hg-surface); border: 1px solid var(--hg-border-strong); border-radius: 8px; box-shadow: var(--hg-shadow-sm); }
body.hope-guide .ark-map-inner .leaflet-tooltip-top::before { border-top-color: var(--hg-border-strong); }
body.hope-guide .ark-mk { display: flex !important; align-items: center; justify-content: center; }
body.hope-guide .ark-mk-dot { width: 20px; height: 20px; border: 3px solid #fff; box-shadow: 0 1px 5px rgba(17, 24, 39, 0.45); }
body.hope-guide .ark-mk:focus-visible { outline: 3px solid var(--hg-primary); outline-offset: -4px; border-radius: 50%; }
body.hope-guide .ark-pin { padding: 12px; min-width: 44px; min-height: 44px; }
body.hope-guide .ark-pin-dot { width: 20px; height: 20px; border: 3px solid #fff; }
body.hope-guide .ark-map-empty { background: var(--hg-surface); border: 1px dashed var(--hg-border-strong); color: var(--hg-primary); }
body.hope-guide .ark-map-empty p { color: var(--hg-muted); }

/* Cards */
body.hope-guide .ark-card { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius-sm); box-shadow: var(--hg-shadow-sm); }
body.hope-guide .ark-card:hover { transform: translateY(-2px); border-color: var(--hg-primary); box-shadow: 0 8px 22px rgba(58, 87, 232, 0.12); }
body.hope-guide .ark-card-body { padding: 16px 18px 18px; }
body.hope-guide .ark-card-cat { 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); border-radius: 999px; padding: 3px 10px; display: inline-flex; align-items: center; gap: 7px; margin-bottom: 8px; }
body.hope-guide .ark-card-cat::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--pc, var(--hg-primary)); flex: 0 0 auto; }
body.hope-guide .ark-card-name { font-size: 19px !important; font-weight: 800; color: var(--hg-text) !important; line-height: 1.25; }
body.hope-guide .ark-card-site { font-size: 14px; font-style: normal; color: var(--hg-faint); }
body.hope-guide .ark-card-summary { font-size: 15.5px; line-height: 1.55; color: var(--hg-body); }

/* Closing note */
body.hope-guide .ark-note { max-width: 1080px; text-align: left; background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius-sm); box-shadow: var(--hg-shadow-sm); padding: 16px 20px; }
body.hope-guide .ark-note b { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--hg-primary); }
body.hope-guide .ark-note p { font-size: 16px; color: var(--hg-muted); }

/* Drawer (outside main) */
body.hope-guide .ark-scrim { background: rgba(17, 24, 39, 0.45); }
body.hope-guide .ark-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 .ark-drawer * { font-family: var(--hg-font) !important; }
body.hope-guide .ark-drawer :is(h2, h3, h4) { font-variant: normal; }
body.hope-guide .ark-drawer :focus-visible { outline: 3px solid var(--hg-primary) !important; outline-offset: 2px; }
body.hope-guide .ark-drawer-head { background: none; border-bottom: 1px solid var(--hg-border); border-top: 4px solid var(--pc, var(--hg-primary)); }
body.hope-guide .ark-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 .ark-drawer-close:hover { color: var(--hg-text); background: var(--hg-surface-2); }
body.hope-guide .ark-drawer-cat { 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); border-radius: 999px; padding: 3px 10px; display: inline-flex; align-items: center; gap: 7px; }
body.hope-guide .ark-drawer-cat::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--pc, var(--hg-primary)); }
body.hope-guide .ark-drawer-name { font-size: 22px !important; font-weight: 800; color: var(--hg-text) !important; line-height: 1.25; text-transform: none; padding-right: 40px; margin-top: 8px; }
body.hope-guide .ark-drawer-meta { font-size: 14px; font-style: normal; color: var(--hg-faint); }
body.hope-guide .ark-gal-main { border-color: var(--hg-border); border-radius: 10px; background: var(--hg-surface-2); }
body.hope-guide .ark-gal-cap { font-size: 13.5px; font-style: normal; color: var(--hg-muted); }
body.hope-guide .ark-gal-thumb { width: 60px; height: 60px; border-radius: 8px; }
body.hope-guide .ark-gal-thumb.is-active { border-color: var(--hg-primary); }
body.hope-guide .ark-drawer-lead { font-size: 17px; line-height: 1.6; color: var(--hg-text); }
body.hope-guide .ark-drawer-p { font-size: 16px; line-height: 1.65; color: var(--hg-body); }
body.hope-guide .ark-drawer h3 { font-size: 13px !important; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--hg-primary) !important; }
body.hope-guide .ark-callout { background: var(--hg-primary-soft); border-left: 4px solid var(--hg-primary); border-radius: 0 10px 10px 0; }
body.hope-guide .ark-callout .lbl { font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; color: var(--hg-primary); }
body.hope-guide .ark-callout p { color: var(--hg-text); }
body.hope-guide .ark-drawer-row { font-size: 15px; color: var(--hg-body); border-top-color: var(--hg-border); }
body.hope-guide .ark-drawer-row .k { font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--hg-text); }
body.hope-guide .ark-drawer-link { min-height: 44px; font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--hg-primary); background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: 10px; }
body.hope-guide .ark-drawer-link:hover { background: var(--hg-primary-soft); border-color: var(--hg-primary); color: var(--hg-primary); }
body.hope-guide .ark-drawer-link i, body.hope-guide .ark-drawer-link svg { color: var(--hg-primary); }
/* Claim-strength panel inside the drawer: readable labels */
body.hope-guide .ark-drawer .cs-panel { background: var(--hg-surface-2); border-color: var(--hg-border); border-radius: 10px; }
body.hope-guide .ark-drawer :is(.cs-label, .cs-sub-label) { font-size: 12.5px; font-weight: 700; letter-spacing: 0.06em; color: var(--hg-text); }
body.hope-guide .ark-drawer .cs-how { font-size: 13.5px; color: var(--hg-primary); }

/* Phones: art panel goes, tool starts sooner */
@media (max-width: 720px) {
  body.hope-guide .ark-hero { padding-left: 16px; padding-right: 16px; }
  body.hope-guide .ark-hero .gh-hero { padding: 20px 18px; }
  body.hope-guide .ark-hero .gh-art { display: none; }
  body.hope-guide .ark-hero .gh-intro p + p { display: none; }
  body.hope-guide .ark-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
  body.hope-guide .ark-filter { flex: 0 0 auto; }
  body.hope-guide .ark-map, body.hope-guide .ark-list { padding: 0 16px; }
  body.hope-guide .ark-list { grid-template-columns: 1fr; }
  body.hope-guide .ark-note { margin-left: 16px; margin-right: 16px; }
}
