#page-hiker{ background:#FFFCF7; font-family:'Nunito',system-ui,sans-serif; padding-top:0 !important; padding-bottom:100px; }
/* "hkx-" prefix: clear of the -card/-tile/-tag/badge/pill/metric/stat-/-fill/hero traps */
.hkx-top{ position:relative; width:100%; padding:0 !important; }
.hkx-banner img{ width:100%; height:auto; display:block; aspect-ratio:2/1; object-fit:cover; }
.hkx-back{
  position:absolute; top:18px; left:18px; z-index:5;
  background:#243447; border:none; color:#fff !important; -webkit-text-fill-color:#fff !important;
  padding:10px 16px; border-radius:999px; font:inherit; font-weight:700; font-size:1rem;
  cursor:pointer; min-height:44px;
}
.hkx-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.hkx-wrap{ max-width:1240px; margin:0 auto; padding:22px 20px; }
#page-hiker h1.hkx-h1{ font-family:'Playfair Display',serif; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
#page-hiker h2.hkx-h2{
  font-family:'Playfair Display',serif; font-size:clamp(1.45rem,2.7vw,1.95rem); margin:0 0 4px;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-hiker h3.hkx-h3{
  font-family:'Playfair Display',serif; font-size:1.2rem; margin:0 0 6px;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
.hkx-sub{ font-size:1rem; line-height:1.65; margin:0 0 18px; color:#78766c !important; -webkit-text-fill-color:#78766c !important; }
.hkx-note{ font-size:1rem; line-height:1.6; color:#8d8a7e !important; -webkit-text-fill-color:#8d8a7e !important; }
.hkx-cta{ display:flex; gap:10px; flex-wrap:wrap; margin:16px 0 6px; }
.hkx-btn{
  background:#243447; border:2px solid #243447; border-radius:999px;
  padding:13px 24px; min-height:48px; font:inherit; font-weight:800; font-size:1rem;
  color:#fff !important; -webkit-text-fill-color:#fff !important; cursor:pointer;
}
.hkx-btn:hover{ background:#31465F; }
.hkx-btn--soft{ background:#fff; border-color:#EAE2D4; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.hkx-btn--soft:hover{ border-color:#7d9e77; background:#FBF6EC; }
.hkx-btn--sage{ background:#5E7E57; border-color:#5E7E57; color:#fff !important; -webkit-text-fill-color:#fff !important; }
.hkx-btn--sm{ padding:9px 16px; min-height:44px; font-size:1rem; }
.hkx-btn--big{ min-height:60px; font-size:1.1rem; padding:16px 30px; }   /* outdoor use, gloved hands */
.hkx-btn:focus-visible,.hkx-back:focus-visible,.hkx-nb:focus-visible,.hkx-qa:focus-visible,
.hkx-sum:focus-visible,.hkx-tc:focus-visible,.hkx-sw:focus-visible,.hkx-chip:focus-visible{
  outline:3px solid #CF9E3F; outline-offset:3px;
}
.hkx-sums{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:26px; }
.hkx-sum{
  background:#fff; border:1px solid #EAE2D4; border-radius:24px; padding:20px; text-align:left;
  font:inherit; cursor:pointer; display:flex; flex-direction:column; gap:6px;
  box-shadow:0 5px 18px rgba(51,64,47,.04);
}
.hkx-sum:hover{ border-color:#7d9e77; }
.hkx-sum svg{ width:24px; height:24px; stroke:#5E7E57; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.hkx-sum .lb{ font-size:1rem; font-weight:800; color:#8d8a7e !important; -webkit-text-fill-color:#8d8a7e !important; }
.hkx-sum .big{
  font-family:'Playfair Display',serif; font-size:1.8rem; line-height:1.1; font-variant-numeric:tabular-nums;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
.hkx-sum .small{ font-size:1rem; line-height:1.6; color:#5b5950 !important; -webkit-text-fill-color:#5b5950 !important; }
.hkx-qas{ display:grid; grid-template-columns:repeat(auto-fill,minmax(255px,1fr)); gap:14px; margin-bottom:28px; }
.hkx-qa{
  background:#fff; border:1px solid #EAE2D4; border-radius:24px; padding:20px;
  display:flex; flex-direction:column; gap:8px; text-align:left; font:inherit; cursor:pointer;
}
.hkx-qa:hover{ border-color:#7d9e77; transform:translateY(-2px); }
.hkx-qa svg{ width:26px; height:26px; stroke:#5E7E57; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.hkx-qa p{ margin:0; font-size:1rem; line-height:1.6; color:#5b5950 !important; -webkit-text-fill-color:#5b5950 !important; }
.hkx-qa .go{ margin-top:auto; font-weight:800; font-size:1rem; color:#5E7E57 !important; -webkit-text-fill-color:#5E7E57 !important; }
.hkx-panel{ background:#fff; border:1px solid #EAE2D4; border-radius:26px; padding:22px; margin-bottom:20px; }
.hkx-ph{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.hkx-tc{
  background:#fff; border:1px solid #EAE2D4; border-radius:24px; padding:20px; margin-bottom:14px;
  display:flex; flex-direction:column; gap:8px; text-align:left; width:100%; font:inherit; cursor:pointer;
}
.hkx-tc:hover{ border-color:#7d9e77; }
.hkx-tc b{ font-size:1.12rem; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.hkx-facts{ display:flex; gap:8px; flex-wrap:wrap; }
.hkx-fact{
  font-size:1rem; border-radius:12px; padding:5px 11px; background:#F4F1E8;
  color:#5b5950 !important; -webkit-text-fill-color:#5b5950 !important;
}
/* difficulty never relies on colour alone — the word is always there */
.hkx-fact.d-Easy{ background:#EAF1E4; color:#41603a !important; -webkit-text-fill-color:#41603a !important; }
.hkx-fact.d-Moderate{ background:#FBF1DC; color:#7a5f28 !important; -webkit-text-fill-color:#7a5f28 !important; }
.hkx-fact.d-Difficult{ background:#F7E4DC; color:#8f4526 !important; -webkit-text-fill-color:#8f4526 !important; }
.hkx-chip{
  background:#fff; border:1.5px solid #EAE2D4; border-radius:999px; padding:9px 15px; min-height:44px;
  font:inherit; font-weight:700; font-size:1rem; cursor:pointer;
  color:#5b7fa6 !important; -webkit-text-fill-color:#5b7fa6 !important;
}
.hkx-chip.on{ background:#243447; border-color:#243447; color:#fff !important; -webkit-text-fill-color:#fff !important; }
.hkx-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.hkx-warn{
  background:#FBF1DC; border:1px solid #E8D9AE; border-radius:16px; padding:14px 16px; margin:14px 0;
  font-size:1rem; line-height:1.6; color:#7a5f28 !important; -webkit-text-fill-color:#7a5f28 !important;
}
.hkx-danger{
  background:#F7E4DC; border:1px solid #EBC9B8; border-radius:16px; padding:14px 16px; margin:14px 0;
  font-size:1rem; line-height:1.6; color:#8f4526 !important; -webkit-text-fill-color:#8f4526 !important;
}
.hkx-empty{
  background:#FBF6EC; border:1px dashed #EAE2D4; border-radius:20px; padding:30px; text-align:center;
  font-size:1rem; line-height:1.7; color:#78766c !important; -webkit-text-fill-color:#78766c !important;
}
.hkx-item{ display:flex; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid #F4F1E8; flex-wrap:wrap; }
.hkx-item:last-child{ border-bottom:none; }
.hkx-item b{ color:#243447 !important; -webkit-text-fill-color:#243447 !important; font-size:1.05rem; }
.hkx-item .sub{ font-size:1rem; color:#6f6d64 !important; -webkit-text-fill-color:#6f6d64 !important; line-height:1.55; }
.hkx-nav{ display:flex; gap:8px; overflow-x:auto; padding-bottom:6px; margin-bottom:18px; }
.hkx-nb{
  flex:none; background:#fff; border:1.5px solid #EAE2D4; border-radius:999px; padding:10px 18px;
  min-height:44px; font:inherit; font-weight:700; font-size:1rem; cursor:pointer;
  color:#5b7fa6 !important; -webkit-text-fill-color:#5b7fa6 !important;
}
.hkx-nb.on{ background:#243447; border-color:#243447; color:#fff !important; -webkit-text-fill-color:#fff !important; }
.hkx-check{ display:flex; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid #F4F1E8; }
.hkx-check:last-child{ border-bottom:none; }
.hkx-check input{ width:24px; height:24px; flex:none; accent-color:#5E7E57; }
.hkx-check label{ font-size:1rem; color:#2b2b2b !important; -webkit-text-fill-color:#2b2b2b !important; cursor:pointer; flex:1; }
.hkx-sw{ position:relative; width:56px; height:44px; border:none; background:none; cursor:pointer; flex:none; }
.hkx-sw::before{ content:''; position:absolute; top:11px; left:0; width:52px; height:22px; border-radius:999px; background:#DDD7C8; transition:background .18s; }
.hkx-sw::after{ content:''; position:absolute; top:13px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:transform .18s; box-shadow:0 1px 4px rgba(0,0,0,.2); }
.hkx-sw[aria-checked="true"]::before{ background:#7d9e77; }
.hkx-sw[aria-checked="true"]::after{ transform:translateX(30px); }
.hkx-tog{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid #F4F1E8; }
.hkx-tog:last-child{ border-bottom:none; }
.hkx-tog span{ font-size:1rem; font-weight:700; line-height:1.5; color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.hkx-lock{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  background:#FBF1DC; border:1px solid #E8D9AE; border-radius:18px; padding:16px 18px; margin:0 0 14px;
}
.hkx-lock b{ color:#243447 !important; -webkit-text-fill-color:#243447 !important; font-size:1rem; }
.hkx-lock p{ margin:4px 0 0; font-size:1rem; line-height:1.6; color:#7a5f28 !important; -webkit-text-fill-color:#7a5f28 !important; }
.hkx-live{
  background:#243447; border-radius:26px; padding:26px; text-align:center; margin-bottom:18px;
}
.hkx-live .num{
  font-family:'Playfair Display',serif; font-size:clamp(2.4rem,7vw,3.6rem); line-height:1.05;
  color:#fff !important; -webkit-text-fill-color:#fff !important; font-variant-numeric:tabular-nums;
}
.hkx-live .lb{ font-size:1rem; font-weight:700; color:#cdd7e0 !important; -webkit-text-fill-color:#cdd7e0 !important; }
.hkx-live-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:14px; margin:16px 0; }
.hkx-mob{
  position:fixed; left:0; right:0; bottom:0; z-index:900; display:none;
  background:#fff; border-top:1px solid #EAE2D4;
  padding:6px 8px calc(6px + env(safe-area-inset-bottom));
  justify-content:space-around; align-items:center;
}
.hkx-mb{
  background:none; border:none; font:inherit; font-size:.84rem; font-weight:700; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:3px; min-width:56px; min-height:52px; padding:5px;
  color:#78766c !important; -webkit-text-fill-color:#78766c !important;
}
.hkx-mb.on{ color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.hkx-mb svg{ width:21px; height:21px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.hkx-fab{
  background:#5E7E57; border:none; border-radius:50%; width:58px; height:58px; display:grid; place-items:center;
  cursor:pointer; margin-top:-18px; box-shadow:0 8px 20px rgba(94,126,87,.34);
}
.hkx-fab svg{ width:26px; height:26px; stroke:#fff; stroke-width:2.2; fill:none; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:760px){
  .hkx-mob{ display:flex; }
  .hkx-cta{ flex-direction:column; }
  .hkx-cta .hkx-btn{ width:100%; }
  .hkx-wrap{ padding:18px 14px; }
}
/* the site's form-label style renders at 11.5px — far too small to read outdoors,
   and under the 16px floor. Lifted inside the Hiker only. */
#page-hiker label{ font-size:1rem !important; line-height:1.5; }

@media (prefers-reduced-motion:reduce){
  .hkx-qa:hover{ transform:none; }
  .hkx-sw::before,.hkx-sw::after{ transition:none !important; }
}