/* Mount Kilimanjaro Guide - site header.
   Light theme: white bar and white mega panel, so it stays legible on
   uncalibrated screens. Green is rationed to the Book button, the open nav
   item, the current page and the featured card hover.
   Radius: interactive 10px, cards 14px. Loaded at priority 999 so the theme's
   global button rules cannot repaint it. */
.mkg-header{
--bg:#FFFFFF;--surface:#F6F8F5;--surface-2:#F6F8F5;
--ink:#151C17;--muted:#57625B;--label:#57625B;
--line:#E3E8E3;--line-2:#E3E8E3;
--green:#00860B;--green-dk:#006608;
--bar:76px;--rail:56px;
--r-btn:10px;--r-card:14px;
--ease:cubic-bezier(.16,1,.3,1);
--font:"Bricolage Grotesque",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.mkg-header,.mkg-header *,.mkg-header *::before,.mkg-header *::after{box-sizing:border-box}

/* Hard reset: the theme styles every <button> on the page. */
.mkg-header button{
  -webkit-appearance:none;appearance:none;
  background:none;background-color:transparent;border:0;outline:0;
  padding:0;margin:0;box-shadow:none;
  font:inherit;color:inherit;line-height:1;
  text-transform:none;letter-spacing:normal;border-radius:0;
  cursor:pointer;min-height:0;min-width:0;
}
.mkg-header button:hover,.mkg-header button:focus{background:none;background-color:transparent;box-shadow:none}

/* Do NOT touch body's overflow. Hello Elementor sets body{overflow-x:clip} and
   this site genuinely needs it: some sections overflow horizontally, and
   releasing the clip makes the document wider than the viewport, which makes
   mobile Safari zoom the whole page out. Learned the hard way.

   Fixed rather than sticky, with .mkg-spacer reserving the height the header no
   longer occupies in flow. header.js carries a watchdog that falls back to
   sticky if a browser refuses to honour fixed here. */
.mkg-header{
  position:fixed;top:0;left:0;right:0;z-index:9999;
  font-family:var(--font);-webkit-font-smoothing:antialiased;
  background:var(--bg);
  border-bottom:1px solid var(--line);
  transition:box-shadow .3s var(--ease);
}
.mkg-header.is-stuck{box-shadow:0 12px 28px -22px rgba(21,28,23,.45)}
.mkg-spacer{height:77px}
/* Watchdog fallback: if a browser will not honour fixed here, header.js adds
   this class and the header pins via sticky instead, which is in-flow, so the
   spacer is no longer needed. */
.mkg-header.mkg-pin-sticky{position:sticky;left:auto;right:auto}
.mkg-header.mkg-pin-sticky + .mkg-spacer{display:none}
.mkg-sentinel{position:absolute;top:0;left:0;width:1px;height:1px;pointer-events:none}

/* Keep clear of the WordPress admin bar, which is only fixed above 782px. */
@media screen and (min-width:783px){
  body.admin-bar .mkg-header{top:32px}
}

/* ---- bar ---- */
.mkg-header .mkg-bar{max-width:1320px;margin:0 auto;padding:0 26px;height:var(--bar);display:flex;align-items:center;gap:34px}
.mkg-header .mkg-brand{display:flex;align-items:center;flex:0 0 auto;line-height:0}
.mkg-header .mkg-brand img{height:38px;width:auto;display:block}
.mkg-header .mkg-nav{flex:1 1 auto;display:flex;justify-content:flex-end}
.mkg-header .mkg-menu{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0}
.mkg-header .mkg-item{position:static}
.mkg-header .mkg-row{position:relative;display:inline-flex;align-items:center}
.mkg-header .mkg-top{
  display:inline-flex;align-items:center;padding:26px 0;
  color:var(--ink);text-decoration:none;
  font-size:15px;font-weight:600;letter-spacing:-.004em;white-space:nowrap;
  transition:color .2s var(--ease);
}
.mkg-header .mkg-row::after{
  content:"";position:absolute;left:0;right:14px;bottom:0;height:2px;border-radius:2px 2px 0 0;
  background:var(--green);transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--ease);
}
.mkg-header .mkg-item.is-open .mkg-row::after,
.mkg-header .mkg-row:has(.mkg-top[aria-current="page"])::after{transform:scaleX(1)}
.mkg-header .mkg-top:hover,.mkg-header .mkg-item.is-open .mkg-top{color:var(--green)}
.mkg-header .mkg-top[aria-current="page"]{color:var(--green)}

/* caret: a hairline chevron, never a box */
.mkg-header button.mkg-disc{
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;margin-left:6px;flex:0 0 auto;
  color:var(--label);
  transition:color .2s var(--ease),transform .3s var(--ease);
}
.mkg-header button.mkg-disc svg{width:9px;height:9px;display:block}
.mkg-header .mkg-item.is-open button.mkg-disc{color:var(--green);transform:rotate(180deg)}
.mkg-header .mkg-row:hover button.mkg-disc{color:var(--green)}

.mkg-header .mkg-cta{
  flex:0 0 auto;display:inline-flex;align-items:center;
  background:var(--green);color:#fff;text-decoration:none;
  font-size:14.5px;font-weight:700;letter-spacing:.005em;
  padding:12px 24px;border-radius:var(--r-btn);white-space:nowrap;
  transition:background-color .2s var(--ease),transform .15s var(--ease);
}
.mkg-header .mkg-cta:hover,.mkg-header .mkg-cta:focus-visible{background:var(--green-dk);color:#fff;transform:translateY(-1px)}
.mkg-header .mkg-cta:active{transform:translateY(0)}

/* ---- mega panel ---- */
.mkg-header .mkg-panel{
  position:absolute;left:0;right:0;top:100%;
  background:var(--bg);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  box-shadow:0 26px 44px -30px rgba(21,28,23,.4);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .24s var(--ease),transform .24s var(--ease),visibility .24s;
}
.mkg-header .mkg-item.is-open>.mkg-panel{opacity:1;visibility:visible;transform:translateY(0)}
.mkg-header .mkg-panel-inner{
  max-width:1320px;margin:0 auto;padding:32px 26px 36px;
  display:grid;gap:34px;align-items:start;
  grid-template-columns:284px minmax(0,1fr);
}
.mkg-header .mkg-cols{display:grid;gap:24px 30px;align-items:start;grid-template-columns:repeat(auto-fit,minmax(164px,1fr))}

/* featured preview: photograph with its own scrim, so white type sits on the image */
.mkg-header .mkg-feature{
  position:relative;display:block;text-decoration:none;overflow:hidden;
  border-radius:var(--r-card);background:var(--surface);border:1px solid var(--line);
}
.mkg-header .mkg-feature-media{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--surface-2)}
.mkg-header .mkg-feature-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease),opacity .28s var(--ease)}
.mkg-header .mkg-feature-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(9,12,10,.93) 2%,rgba(9,12,10,.55) 40%,rgba(9,12,10,.04) 96%);
}
.mkg-header .mkg-feature:hover .mkg-feature-img{transform:scale(1.045)}
.mkg-header .mkg-feature-body{position:absolute;left:0;right:0;bottom:0;padding:22px}
.mkg-header .mkg-feature-meta{display:block;font-size:12.5px;font-weight:500;color:rgba(255,255,255,.82);margin-bottom:6px;min-height:1em}
.mkg-header .mkg-feature-title{display:block;font-size:22px;font-weight:700;line-height:1.15;color:#fff;letter-spacing:-.02em;padding-right:50px}
.mkg-header .mkg-feature-go{
  position:absolute;right:22px;bottom:22px;
  width:36px;height:36px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);color:#fff;
  transition:background-color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);
}
.mkg-header .mkg-feature-go svg{width:14px;height:14px}
.mkg-header .mkg-feature:hover .mkg-feature-go{background:var(--green);border-color:var(--green);transform:translateX(3px)}

/* link columns */
.mkg-header .mkg-col{min-width:0}
.mkg-header .mkg-col-title{
  display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--label);text-decoration:none;
  padding-bottom:11px;margin-bottom:11px;border-bottom:1px solid var(--line);
}
.mkg-header a.mkg-col-title:hover{color:var(--green)}
.mkg-header .mkg-links{list-style:none;margin:0;padding:0}
.mkg-header .mkg-links a{
  display:block;padding:9px 11px;margin:0 0 1px -11px;border-radius:var(--r-btn);
  text-decoration:none;transition:background-color .18s var(--ease);
}
.mkg-header .mkg-link-name{display:block;font-size:14.5px;font-weight:600;color:var(--ink);line-height:1.3;transition:color .18s var(--ease)}
.mkg-header .mkg-link-meta{display:block;font-size:12px;font-weight:400;color:var(--muted);line-height:1.35;margin-top:3px}
.mkg-header .mkg-links a:hover,.mkg-header .mkg-links a:focus-visible{background:var(--surface)}
.mkg-header .mkg-links a:hover .mkg-link-name{color:var(--green)}
.mkg-header .mkg-links a[aria-current="page"] .mkg-link-name{color:var(--green)}

.mkg-header a:focus-visible,.mkg-header button:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:4px}

.mkg-header .mkg-rail{display:none}
.mkg-scrim{display:none}

/* ---- mobile: chip rail, no hamburger ---- */
@media (max-width:1024px){
.mkg-header{--bar:54px;--rail:48px}
/* bar 54 + rail 48 + 1px border */
.mkg-spacer{height:103px}
.mkg-header .mkg-bar{padding:0 14px;gap:10px}
.mkg-header .mkg-brand{flex:1 1 auto;min-width:0}
.mkg-header .mkg-brand img{height:28px}
.mkg-header .mkg-cta{flex:0 0 auto;font-size:13px;font-weight:700;padding:9px 15px}
.mkg-header .mkg-nav{width:0;height:0;overflow:visible;flex:0 0 0}
.mkg-header .mkg-menu{display:block}
.mkg-header .mkg-row{display:none}

.mkg-header .mkg-rail{display:block;border-top:1px solid var(--line);height:var(--rail);background:var(--bg)}
.mkg-header .mkg-rail-track{
  display:flex;gap:7px;align-items:center;height:100%;padding:0 14px;
  overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.mkg-header .mkg-rail-track::-webkit-scrollbar{display:none}
.mkg-header .mkg-chip,.mkg-header button.mkg-chip{
  flex:0 0 auto;scroll-snap-align:start;display:inline-flex;align-items:center;gap:7px;
  padding:8px 13px;border-radius:var(--r-btn);
  background:var(--surface);border:1px solid var(--line-2);
  color:var(--ink);font-family:var(--font);font-size:13px;font-weight:600;line-height:1;
  text-decoration:none;white-space:nowrap;
  transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);
}
.mkg-header button.mkg-chip svg{width:9px;height:9px;opacity:.6;transition:transform .25s var(--ease)}
.mkg-header button.mkg-chip[aria-expanded="true"]{background:var(--green);border-color:var(--green);color:#fff}
.mkg-header button.mkg-chip[aria-expanded="true"] svg{transform:rotate(180deg);opacity:1}

.mkg-header .mkg-panel{
  max-height:calc(100dvh - var(--bar) - var(--rail));
  overflow-y:auto;overscroll-behavior:contain;box-shadow:0 20px 34px -26px rgba(21,28,23,.45);
}
.mkg-header .mkg-panel-inner{grid-template-columns:1fr;padding:18px 16px 28px;gap:22px;max-width:none}
.mkg-header .mkg-cols{grid-template-columns:1fr;gap:16px}
.mkg-header .mkg-feature-media{aspect-ratio:16/9}
.mkg-header .mkg-feature-title{font-size:20px}
.mkg-header .mkg-links a{padding:12px 11px}
.mkg-header .mkg-link-name{font-size:15.5px}

.mkg-scrim{
  display:block;position:fixed;inset:0;z-index:9998;
  background:rgba(21,28,23,.42);opacity:0;visibility:hidden;
  transition:opacity .28s var(--ease),visibility .28s;
}
.mkg-scrim.is-open{opacity:1;visibility:visible}
}

@media (min-width:1025px){.mkg-header .mkg-rail{display:none}}

@media (prefers-reduced-motion:reduce){
.mkg-header,.mkg-header *,.mkg-scrim{transition-duration:.01ms!important;animation-duration:.01ms!important}
.mkg-header .mkg-feature:hover .mkg-feature-img{transform:none}
}
