/* ==== qnet.net — site layer (element-ID bound) ====
   IDs measured on qnetglobal1stg 2026-09-22 (footer = rb-etemplate 38112 "Footer-03").
   Never reuse these IDs on another install.

   Footer palette = fleet standard (§8k, the navy/orange draft), COLOUR ONLY: layout, radii,
   spacing and padding stay Elementor's.
   Measured before: ground rgb(18,20,24), links #4c627c on it = 2.9:1 (fails AA), headings #F8702E.
   After:           ground #0E1726, links #A9B6C6 = 8.7:1, headings #F8702E = 6.3:1, hover #fff = 18:1.

   NOTE: this site carries NO fleet button standard, by decision — qnet.net is the reference and its
   own buttons define it. Nothing here touches buttons or the header. */
:root{
  --qn-ft-navy:#0E1726;
  --qn-ft-orange:#F8702E;
  --qn-ft-mute:#A9B6C6;
}

/* ground: the outer footer container */
.footer-wrap .elementor-element-2540589{ background-color:var(--qn-ft-navy) !important; }

/* the link / notice panels: a touch lighter than the ground, hairline instead of none */
.footer-wrap .elementor-element-a5828b9,
.footer-wrap .elementor-element-7e1583c,
.footer-wrap .elementor-element-9cb19b2,
.footer-wrap .elementor-element-11c2e4e{
  background-color:rgba(255,255,255,.045) !important;
  border:1px solid rgba(255,255,255,.09) !important;
}

.footer-wrap .elementor-heading-title{ color:var(--qn-ft-orange) !important; letter-spacing:.01em; }
.footer-wrap a{ color:var(--qn-ft-mute) !important; transition:color .2s ease; }
.footer-wrap a:hover,
.footer-wrap a:focus-visible{ color:#fff !important; }
.footer-wrap p,
.footer-wrap li,
.footer-wrap .elementor-widget-text-editor,
.footer-wrap .elementor-widget-text-editor p,
.footer-wrap .elementor-icon-list-text,
.footer-wrap .rb-copyright{ color:var(--qn-ft-mute); }

/* social icons read as links on the navy ground */
.footer-wrap .elementor-social-icon,
.footer-wrap .elementor-icon{ color:var(--qn-ft-mute) !important; }
.footer-wrap .elementor-social-icon:hover,
.footer-wrap .elementor-icon:hover{ color:#fff !important; }

/* ---------- archive filter ----------
   "Uncategorized" is not an editorial category; the fleet rule hides it from the pills
   (§9c). The 71 posts that live only there still need re-filing — an editorial task. */
.elementor-widget-taxonomy-filter .e-filter-item[data-filter="uncategorized"]{ display:none !important; }

/* ---------- Category filter → pills (fleet look, from africa.qnet.net) ----------
   The widget ships unstyled; these are the fleet's chip rules, with qnet.net's own accent.
   Label inherits the theme's text colour, so it is legible in light AND dark by construction;
   only the active pill is a fixed pair.
   Measured: white on #F8702E = 3.21:1 — that is the fleet's deliberate look (Africa made the same
   call), but it is below AA for this text size. Switching the active label to ink #141414 gives
   6.45:1 — applied 2026-09-22 (Damien's call). */
.elementor-widget-taxonomy-filter{ margin-top:clamp(18px,3vw,32px); }
.elementor-widget-taxonomy-filter .e-filter{
  display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; margin:0 auto;
}
.elementor-widget-taxonomy-filter .e-filter-item{
  appearance:none;
  display:inline-flex; align-items:center; justify-content:center;
  color:inherit;
  border:none;
  background:rgba(128,128,128,.12);
  font-size:.92rem; font-weight:500; line-height:1;
  /* Optical centring is font-specific: the fleet value (.48/.76) was measured on Encode Sans
     Condensed, which sits low. qnet.net sets these pills in Roboto, whose ink is already centred
     in the em-box, so that shift pushed the label upwards. Symmetric padding is correct here. */
  /* Optical centring, measured on the rendered pill (37px tall, Roboto Condensed):
     symmetric padding put the ink 2px high (8 above / 10 below); +2px overshot the other way
     (10/8); +1px lands it centred (9/9). */
  padding:.688em 1.05em .552em;
  border-radius:999px; cursor:pointer; white-space:nowrap;
  transition:background-color .16s ease;
}
.elementor-widget-taxonomy-filter .e-filter-item:hover{ background:rgba(128,128,128,.22); }
.elementor-widget-taxonomy-filter .e-filter-item[aria-pressed="true"]{
  background:#F8702E; color:#141414; font-weight:600;   /* ink on orange 6.45:1 (white was 3.21:1) — approved 2026-09-22 */
}
.elementor-widget-taxonomy-filter .e-filter-item:focus-visible{ outline:2px solid #F8702E; outline-offset:2px; }

/* Mobile: one swipeable row instead of a ragged wrap */
@media (max-width:640px){
  .elementor-widget-taxonomy-filter .e-filter{
    flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; padding-inline:16px;
  }
  .elementor-widget-taxonomy-filter .e-filter::-webkit-scrollbar{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  .elementor-widget-taxonomy-filter .e-filter-item{ transition:none; }
}

/* ---------- Retagged list titles keep their utility size (2026-09-23) ----------
   qnet-heading-semantics rewrites sidebar/related <h5|h4 class="entry-title"> to <h2 class="h5 entry-title">
   for the outline. Foxiz 2.7.9 added `h2.entry-title{font-size:var(--title-size,var(--h2-fsize))}` (0,1,1),
   which beats `.h5` (0,1,0): the sidebar "Latest News" titles rendered at 30 px (Damien, go-live 23 Sep).
   Two classes + tag (0,2,1) give the utility size back — exactly what the original h5/h4 rendered. */
h2.entry-title.h5, h2.entry-title.h5 > a { font-size: var(--h5-fsize, 16px); }
h2.entry-title.h4, h2.entry-title.h4 > a { font-size: var(--h4-fsize, 18px); }
h2.entry-title.h6, h2.entry-title.h6 > a { font-size: var(--h6-fsize, 14px); }