/* PARKS-1: the national park pages and the gorilla trekking page, dressed in the site's own design.
   Everything is scoped to body.pg-park, so no other page is affected. Uses the site's own colours and fonts (css/style.css). */

body.pg-park{ background:var(--c-ivory); --clay:var(--c-gold); --clay-dark:var(--c-gold-deep); }
.pg-park [id]{ scroll-margin-top:150px; }

/* ---------- Hero (the site's .page-hero, plus this page's buttons) ---------- */
.pg-park .page-hero .container{ padding-top:56px; }
.pg-park .page-hero .breadcrumb{ position:relative; z-index:2; padding:0 0 22px; color:rgba(255,255,255,.75); }
.pg-park .page-hero .breadcrumb a{ color:rgba(255,255,255,.75); }
.pg-park .page-hero .breadcrumb a:hover{ color:var(--c-gold-light); }
.pg-park .page-hero .breadcrumb span:last-child{ color:#fff; }
.pg-park .page-hero h1{ max-width:21ch; }
.pg-park .page-hero .lede a{ color:var(--c-gold-light); text-decoration:underline; text-underline-offset:3px; }
.pg-park .page-hero .lede{ color:rgba(247,242,233,.9); max-width:64ch; margin-top:22px; }
.pg-park .pg-hero-cta{ display:flex; gap:14px; flex-wrap:wrap; margin-top:30px; position:relative; z-index:2; }
.pg-park .page-hero .page-meta{ margin-top:34px; }
.pg-park .pg-trust{ position:relative; z-index:2; margin-top:18px; max-width:60ch; font-size:.88rem; color:rgba(247,242,233,.78); }
.pg-park .site-footer [data-i18n]{ opacity:1; }

/* ---------- Sticky page menu ---------- */
.pg-toc{ position:sticky; top:84px; z-index:90; background:rgba(255,253,249,.96); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--c-line); }
.pg-toc .container{ display:flex; gap:6px; overflow-x:auto; padding-top:12px; padding-bottom:12px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.pg-toc .container::-webkit-scrollbar{ display:none; }
.pg-toc a{ flex:0 0 auto; padding:8px 16px; border-radius:999px; font-size:.8rem; font-weight:600; color:var(--c-forest); white-space:nowrap; border:1px solid transparent; transition:background .25s,border-color .25s; }
.pg-toc a:hover{ background:var(--c-sand); border-color:var(--c-sand-deep); }
.pg-toc a.pg-toc-safaris{ background:var(--c-gold); color:var(--c-forest); }
.pg-toc a.pg-toc-safaris:hover{ background:var(--c-gold-deep); color:#fff; border-color:transparent; }

/* ---------- Safaris to this park (tours + lodges) ---------- */
.pg-safaris{ background:var(--c-sand); }
.pg-safaris .section-head,.pg-related .section-head{ flex-direction:column; align-items:flex-start; gap:0; }
.pg-safaris .section-head{ margin-bottom:44px; }
.pg-safaris .section-head h2{ max-width:20ch; }
.pg-safaris .section-head .lede{ margin-top:14px; max-width:62ch; }
.pg-sub{ font-family:var(--font-display); font-weight:500; font-size:1.55rem; color:var(--c-forest); margin:0 0 22px; letter-spacing:-.01em; }
.pg-grid + .pg-sub,.pg-card.is-note + .pg-sub{ margin-top:60px; }
.pg-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.pg-grid.pg-c1{ grid-template-columns:minmax(0,560px); }
.pg-grid.pg-c2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.pg-grid.pg-c4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.pg-card{ display:flex; flex-direction:column; gap:10px; background:#fff; border:1px solid var(--c-line); border-radius:var(--radius-md); padding:26px 26px 22px; color:var(--c-charcoal); transition:border-color .3s,box-shadow .3s,transform .3s var(--ease); }
a.pg-card:hover{ border-color:var(--c-gold); box-shadow:var(--shadow-soft); transform:translateY(-3px); }
.pg-card .pg-tag{ font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--c-gold-deep); }
.pg-card b{ font-family:var(--font-display); font-weight:500; font-size:1.22rem; line-height:1.25; color:var(--c-forest); }
.pg-card .pg-desc{ font-size:.9rem; line-height:1.55; color:var(--c-charcoal-soft); flex:1; }
.pg-card em{ font-style:normal; font-weight:700; font-size:.85rem; color:var(--c-teal); }
.pg-card.is-note{ background:transparent; border-style:dashed; flex-direction:row; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap; }
.pg-card.is-note > div{ display:flex; flex-direction:column; gap:8px; max-width:70ch; }

.pg-callout{ display:grid; grid-template-columns:1fr auto; gap:28px; align-items:center; background:var(--c-forest); color:#fff; border-radius:var(--radius-lg); padding:40px 44px; margin-top:60px; }
.pg-callout h3{ color:#fff; font-size:clamp(1.4rem,2.2vw,1.9rem); margin-bottom:10px; }
.pg-callout p{ color:rgba(247,242,233,.85); max-width:62ch; }
.pg-callout .pg-callout-actions{ display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- The practical guide (the page's original content, restyled) ---------- */
.pg-guide{ background:var(--c-ivory); color:var(--c-charcoal); font-size:1.02rem; line-height:1.72; }
.pg-guide section{ padding:84px 0; }
.pg-guide .wrap.pg-guide-head{ padding-top:92px; padding-bottom:0; }
.pg-guide .pg-guide-head h2{ max-width:26ch; }
.pg-guide .pg-guide-head .lede{ margin-top:14px; max-width:66ch; }
.pg-guide .pg-guide-head + section{ padding-top:44px; }
.pg-guide section.alt{ background:var(--c-sand); }
.pg-guide .wrap{ max-width:1080px; margin:0 auto; padding:0 32px; }
.pg-guide .wrap[style]{ max-width:1080px !important; }
.pg-guide h2{ font-size:clamp(1.9rem,3.2vw,2.7rem); margin:0 0 .5em; }
.pg-guide h3{ font-size:1.38rem; margin:1.6em 0 .5em; }
.pg-guide h4{ font-size:1.1rem; margin:0 0 .4em; }
.pg-guide p{ margin:0 0 1.15em; max-width:74ch; }
.pg-guide .kicker{ display:inline-flex; align-items:center; gap:10px; font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; color:var(--c-gold-deep); margin-bottom:16px; }
.pg-guide .kicker::before{ content:''; width:28px; height:1px; background:var(--c-gold-deep); }
.pg-guide .section-intro{ max-width:68ch; color:var(--c-charcoal-soft); margin-bottom:28px; }
.pg-guide ul,.pg-guide ol{ margin:0 0 1.15em; padding-left:1.35em; max-width:74ch; }
.pg-guide ul{ list-style:disc; }
.pg-guide ol{ list-style:decimal; }
.pg-guide li{ margin-bottom:.45em; }
.pg-guide ul.check{ list-style:none; padding:0; margin:16px 0; }
.pg-guide ul.check li{ position:relative; padding-left:26px; margin-bottom:10px; }
.pg-guide ul.check li::before{ content:"—"; position:absolute; left:0; color:var(--c-gold-deep); font-weight:700; }
.pg-guide strong{ color:var(--c-forest); }
.pg-guide a:not(.btn):not(.pg-card){ color:var(--c-teal); text-decoration:underline; text-decoration-color:rgba(15,110,106,.35); text-underline-offset:3px; transition:color .2s,text-decoration-color .2s; }
.pg-guide a:not(.btn):not(.pg-card):hover{ color:var(--c-gold-deep); text-decoration-color:currentColor; }
.pg-guide a[style]{ color:var(--c-gold-deep) !important; font-weight:600; }

/* buttons that sit inside the old content */
.pg-guide .btn-clay,.pg-park .btn-clay{ background:var(--c-gold); color:var(--c-forest); display:inline-flex; align-items:center; justify-content:center; padding:14px 30px; border-radius:999px; font-weight:600; font-size:.92rem; letter-spacing:.02em; text-decoration:none; transition:all .35s var(--ease); }
.pg-guide .btn-clay:hover,.pg-park .btn-clay:hover{ background:var(--c-gold-deep); color:#fff; transform:translateY(-2px); box-shadow:var(--shadow-soft); }
.pg-guide .btn-outline{ border:1.5px solid var(--c-forest); color:var(--c-forest); padding:13px 28px; border-radius:999px; font-weight:600; font-size:.92rem; text-decoration:none; display:inline-flex; }

/* tables */
.pg-guide table{ width:100%; border-collapse:collapse; margin:18px 0 8px; font-size:.92rem; }
.pg-guide caption{ text-align:left; font-size:.82rem; color:var(--c-charcoal-soft); margin-bottom:10px; }
.pg-guide th,.pg-guide td{ text-align:left; padding:12px 14px; border-bottom:1px solid var(--c-line); vertical-align:top; }
.pg-guide th{ font-family:var(--font-body); font-weight:800; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--c-gold-deep); border-bottom:2px solid var(--c-forest); background:transparent; }
.pg-guide .table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--c-line); border-radius:var(--radius-md); padding:8px 10px; margin:18px 0 8px; }
.pg-guide .table-scroll table{ margin:0; min-width:520px; }
.pg-guide tbody tr:last-child td{ border-bottom:none; }
.pg-guide td.peak-name{ font-family:var(--font-display); font-size:1.02rem; color:var(--c-forest); }

/* cards used in the old content */
.pg-guide .sector-card,.pg-guide .wildlife-item,.pg-guide .tier,.pg-guide .combo,.pg-guide .who-card,.pg-guide .pkg-card,.pg-guide .month{ background:#fff; border:1px solid var(--c-line); border-radius:var(--radius-md); }
.pg-guide section:not(.alt) .sector-card,.pg-guide section:not(.alt) .wildlife-item,.pg-guide section:not(.alt) .tier,.pg-guide section:not(.alt) .combo,.pg-guide section:not(.alt) .who-card,.pg-guide section:not(.alt) .pkg-card,.pg-guide section:not(.alt) .month{ background:var(--c-sand); border-color:var(--c-sand-deep); }
.pg-guide .sectors{ display:grid; grid-template-columns:1fr; gap:22px; }
.pg-guide .sector-card{ border-left:4px solid var(--c-teal); padding:28px 30px 24px; }
.pg-guide .sector-card h3{ font-size:1.35rem; margin:0 0 .4em; display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.pg-guide .sector-card .tag{ font-family:var(--font-body); font-size:.7rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--c-gold-deep); border:1px solid var(--c-gold-deep); border-radius:999px; padding:3px 12px; }
.pg-guide .sector-card .meta{ display:flex; gap:22px; flex-wrap:wrap; font-size:.86rem; color:var(--c-charcoal-soft); margin:12px 0 16px; padding-bottom:16px; border-bottom:1px solid var(--c-line); }
.pg-guide .sector-card .meta strong{ display:block; font-size:.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--c-gold-deep); }

.pg-guide .wildlife-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:22px; }
.pg-guide .wildlife-item{ padding:18px 20px; }
.pg-guide .wildlife-item .w-name{ font-family:var(--font-display); font-size:1.08rem; color:var(--c-forest); margin-bottom:4px; }
.pg-guide .wildlife-item p{ font-size:.88rem; margin:0; color:var(--c-charcoal-soft); }

.pg-guide .stay-tiers{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:22px; }
.pg-guide .tier{ padding:24px; }
.pg-guide .tier .price{ font-family:var(--font-display); font-size:1.2rem; color:var(--c-forest); margin-bottom:6px; }

.pg-guide .combo-list{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:22px; }
.pg-guide .combo{ padding:22px 24px; }
.pg-guide .combo .dist{ font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--c-gold-deep); }
.pg-guide .combo a.cta{ display:inline-block; margin-top:10px; font-size:.85rem; font-weight:700; }

.pg-guide .who-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:22px; }
.pg-guide .who-card{ padding:24px 26px; }
.pg-guide .who-card p{ font-size:.92rem; margin:0; color:var(--c-charcoal-soft); }
.pg-guide .pkg-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:22px; }
.pg-guide .pkg-card{ padding:24px 26px; }
.pg-guide .pkg-card .pkg-days{ font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--c-gold-deep); }
.pg-guide .pkg-card h4{ font-size:1.2rem; margin:6px 0 8px; }
.pg-guide .pkg-card p{ font-size:.9rem; margin:0 0 8px; color:var(--c-charcoal-soft); }
.pg-guide .pkg-card .pkg-for{ font-size:.82rem; font-style:italic; opacity:.8; }

/* season grid */
.pg-guide .months{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:22px; }
.pg-guide .month{ padding:14px 10px; text-align:center; font-size:.8rem; }
.pg-guide .month .mn{ font-weight:800; font-size:.82rem; color:var(--c-forest); }
.pg-guide .month .badge{ display:block; margin-top:6px; font-size:.68rem; line-height:1.3; color:var(--c-charcoal-soft); }
.pg-guide .month.dry,.pg-guide .month.cross{ border-color:var(--c-gold); background:rgba(196,149,74,.14); }
.pg-guide .month.calve{ border-color:var(--c-teal); background:rgba(15,110,106,.1); }
.pg-guide .legend{ display:flex; gap:20px; margin-top:16px; flex-wrap:wrap; font-size:.8rem; color:var(--c-charcoal-soft); }
.pg-guide .legend span{ display:inline-flex; align-items:center; gap:8px; }
.pg-guide .swatch{ width:12px; height:12px; display:inline-block; border-radius:3px; }
.pg-guide .sw-cross{ background:rgba(196,149,74,.5); border:1px solid var(--c-gold); }
.pg-guide .sw-calve{ background:rgba(15,110,106,.45); border:1px solid var(--c-teal); }

/* packing lists, altitude zones */
.pg-guide .pack-grid{ display:grid; grid-template-columns:1fr 1fr; gap:30px; margin-top:20px; }
.pg-guide .pack-cols{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:24px; margin-top:22px; }
.pg-guide .pack-grid h4,.pg-guide .pack-cols h4{ font-family:var(--font-body); font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--c-gold-deep); margin-bottom:10px; }
.pg-guide .zone-track{ display:flex; flex-direction:column; margin-top:24px; border-left:3px solid var(--c-gold); }
.pg-guide .zone{ position:relative; padding:18px 0 18px 26px; border-bottom:1px dashed var(--c-line); }
.pg-guide .zone:last-child{ border-bottom:none; }
.pg-guide .zone::before{ content:""; position:absolute; left:-9px; top:25px; width:15px; height:15px; border-radius:50%; background:var(--c-gold); border:3px solid var(--c-ivory); }
.pg-guide section.alt .zone::before{ border-color:var(--c-sand); }
.pg-guide .zone .z-alt{ font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--c-gold-deep); margin-bottom:2px; }
.pg-guide .zone h4{ font-size:1.12rem; }
.pg-guide .zone p{ font-size:.92rem; margin:0; color:var(--c-charcoal-soft); }

/* questions and answers */
.pg-guide .faq{ border-top:1px solid var(--c-line); }
.pg-guide .faq-item{ border-bottom:1px solid var(--c-line); padding:22px 0; }
.pg-guide .faq-item h3{ font-family:var(--font-body); font-size:1.04rem; font-weight:700; color:var(--c-forest); margin:0 0 8px; letter-spacing:0; }
.pg-guide .faq-item p{ margin:0; color:var(--c-charcoal-soft); }
.pg-guide blockquote{ border-left:3px solid var(--c-gold); margin:26px 0; padding:4px 0 4px 24px; font-family:var(--font-display); font-style:italic; font-size:1.18rem; color:var(--c-forest); }

/* the dark band the gorilla page has in the middle of its content */
.pg-guide .mid-cta{ background:var(--c-forest); color:#fff; padding:56px 0; text-align:center; }
.pg-guide .mid-cta p{ max-width:60ch; margin:0 auto 20px; color:rgba(247,242,233,.88); }
.pg-guide .mid-cta h2,.pg-guide .mid-cta h3{ color:#fff; }

/* ---------- More to read and plan (links to the Journal guide, neighbouring parks, the country) ---------- */
.pg-related{ background:var(--c-ivory); padding:96px 0 84px; border-top:1px solid var(--c-sand-deep); }
.pg-related .section-head{ margin-bottom:40px; }
.pg-related .pg-sub{ margin:0 0 18px; font-size:1.25rem; }
.pg-related .pg-grid + .pg-sub{ margin-top:46px; }
.pg-related .pg-card{ background:var(--c-sand); border-color:var(--c-sand-deep); }
.pg-related-links{ display:flex; flex-wrap:wrap; gap:10px 14px; margin-top:6px; }
.pg-related-links a{ display:inline-flex; align-items:center; padding:10px 18px; border-radius:999px; border:1.5px solid var(--c-line); background:#fff; font-size:.86rem; font-weight:600; color:var(--c-forest); transition:border-color .25s,background .25s; }
.pg-related-links a:hover{ border-color:var(--c-gold); background:var(--c-sand); }

/* ---------- Closing band and the small print ---------- */
.pg-cta{ background:var(--c-forest); color:#fff; padding:96px 0; text-align:center; }
.pg-cta .container{ max-width:880px; }
.pg-cta .eyebrow{ justify-content:center; }
.pg-cta h2{ color:#fff; margin:0 auto 18px; font-size:clamp(2rem,3.6vw,3rem); max-width:22ch; }
.pg-cta p{ color:rgba(247,242,233,.86); margin:0 auto 32px; max-width:60ch; font-size:1.05rem; }
.pg-cta .pg-cta-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.pg-note{ background:var(--c-ivory); padding:34px 0 56px; border-top:1px solid var(--c-sand-deep); }
.pg-note p{ max-width:92ch; font-size:.82rem; line-height:1.65; color:var(--c-charcoal-soft); }

/* ---------- Small screens ---------- */
@media(max-width:980px){
  .pg-grid,.pg-grid.pg-c4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pg-guide .wildlife-grid,.pg-guide .stay-tiers,.pg-guide .pack-cols{ grid-template-columns:1fr 1fr; }
  .pg-callout{ grid-template-columns:1fr; padding:34px 28px; }
}
@media(max-width:760px){
  .pg-park .page-hero .container{ padding-top:40px; }
  .pg-guide section{ padding:60px 0; }
  .pg-guide .wrap{ padding:0 22px; }
  .pg-guide .who-grid,.pg-guide .pkg-grid,.pg-guide .combo-list,.pg-guide .pack-grid{ grid-template-columns:1fr; }
  .pg-guide .months{ grid-template-columns:repeat(3,1fr); }
  .pg-guide .sector-card{ padding:22px 20px; }
  .pg-related{ padding:64px 0 56px; }
  .pg-cta{ padding:68px 0; }
}
@media(max-width:640px){
  .pg-toc{ top:71px; }
  .pg-park [id]{ scroll-margin-top:140px; }
}
@media(max-width:560px){
  .pg-guide .wildlife-grid,.pg-guide .stay-tiers,.pg-guide .pack-cols{ grid-template-columns:1fr; }
  .pg-grid,.pg-grid.pg-c2,.pg-grid.pg-c4,.pg-grid.pg-c1{ grid-template-columns:minmax(0,1fr); }
}
