/* =====================================================================
   crcgs.css — the shared CRCGS design kit (redesign SPEC §2; CRCGS Website Design Guide).
   ---------------------------------------------------------------------
   One look for every CRCGS site:
     • the Knowledge Hub loads it as its foundation (layouts/hub.php, <body class="ck …">);
     • Country Profiles loads it AFTER app.css + v5.css when site.php 'chrome' is 'crcgs'
       (layouts/base.php, <body class="v5 ck">); section 9 then re-points Country Profiles'
       own tokens to the kit, so its pages take the new look without per-page edits.
   Every colour, font and size that matters is a --ck- token in section 1 — use var(--ck-…)
   below, never a raw hex. Kit classes start with ck- so nothing collides with Country
   Profiles' cp-*, .nav or v5 rules. Element defaults (section 3) sit inside :where(), so
   they never outrank a page's own rule.
   Contrast: --ck-blue and --ck-orange are FILLS and rules only; for text on white use
   --ck-blue-text / --ck-orange-text (both AA).
   Sections: 1 tokens · 2 fonts · 3 base · 4 header · 5 drawer (phones) · 6 footer ·
             7 components · 8 forms · 9 Country Profiles on the kit · 10 reduced motion
   ===================================================================== */

/* ---- 1. Tokens ---- */
:root{
  /* The design guide's palette */
  --ck-navy:#03045E;          /* top bar, footer, heading accent, primary buttons */
  --ck-navy-deep:#02033F;     /* footer bottom strip, pressed states */
  --ck-blue:#00B4D8;          /* hover pill, highlights, rules — fill only */
  --ck-blue-text:#0077B6;     /* links and blue text (AA on white) */
  --ck-orange:#FF9F1C;        /* primary CTA fill (navy text on it) — fill only */
  --ck-orange-text:#9A5800;   /* orange text on white, if ever needed (AA) */
  --ck-light:#E6F6FB;         /* light section backgrounds */
  --ck-cream:#FFF8F0;         /* content cards */
  --ck-neutral:#F1F5F9;       /* cards, forms, page ground */
  --ck-text:#1F2937;          /* body text */
  --ck-muted:#4B5563;         /* secondary text (AA) */
  --ck-line:#E2E8F0;          /* hairlines */
  --ck-pink:#FCEEF3;          /* Knowledge Hub section — shade NOT final (owner pending); keep it this one token */
  --ck-white:#FFFFFF;

  /* Working shades of the palette (states, text on navy, form lines) */
  --ck-blue-text-deep:#006BA6; /* links and blue text on the tinted grounds (pink, neutral, light, cream): AA there (5.1–5.5:1);
                                  --ck-blue-text is AA on white only (4.3–4.4:1 on those). Section 7 swaps it in. */
  --ck-line-strong:#CBD5E1;   /* hairlines that must show on --ck-neutral (decorative) */
  --ck-input-line:#7B8798;    /* text-field borders: 3:1 against white (3.65) and the light grounds (3.3), as a field's edge must be */
  --ck-orange-hover:#F28C00;  /* primary CTA hover (navy text on it stays AA) */
  --ck-blue-pale:#CCF0F7;     /* a soft blue wash (chips on hover, selected rows) */
  --ck-on-navy:#E8EAF6;       /* body text on navy (AA) */
  --ck-on-navy-muted:#B9BEDF; /* secondary text on navy (AA) */
  --ck-on-navy-line:rgba(255,255,255,.45);   /* outlines on navy (Register, social circles) */
  --ck-on-navy-rule:rgba(255,255,255,.14);   /* hairlines on navy */
  --ck-on-navy-hover:rgba(255,255,255,.12);  /* hover wash on navy */
  --ck-danger:#B42318;        /* form errors (AA) */
  --ck-success:#1F7A4C;       /* confirmations (AA) */
  --ck-alert:#A32424;         /* the staging banner's stripes */
  --ck-alert-deep:#8A1C1C;
  --ck-scrim:rgba(2,3,63,.55);               /* behind the phone menu */
  --ck-focus-halo:rgba(0,180,216,.35);       /* soft ring around the focus outline */

  /* Type */
  --ck-font-head:"Spectral", Georgia, "Times New Roman", serif;   /* headings: 400 / 600 / 700 */
  --ck-font-body:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Space, shape, depth, motion */
  --ck-space-1:4px; --ck-space-2:8px; --ck-space-3:12px; --ck-space-4:16px; --ck-space-5:24px;
  --ck-space-6:32px; --ck-space-7:48px; --ck-space-8:64px; --ck-space-9:96px;
  --ck-radius:10px;
  --ck-radius-sm:6px;
  --ck-radius-pill:999px;
  --ck-shadow:0 1px 2px rgba(3,4,94,.06), 0 6px 20px rgba(3,4,94,.07);
  --ck-shadow-lg:0 2px 6px rgba(3,4,94,.08), 0 18px 44px rgba(3,4,94,.16);
  --ck-shadow-head:0 2px 14px rgba(3,4,94,.10);
  --ck-seal-glow:drop-shadow(0 4px 14px rgba(2,3,63,.3));
  --ck-wrap:1200px;
  --ck-gutter:24px;
  --ck-header-h:170px;        /* the header's height; crcgs.js sets the real value */
  --ck-sticky-top:var(--ck-header-h);   /* where sticky page parts stop: below the header, or 0 while it is hidden */
  --ck-dur:180ms;
  --ck-dur-slow:300ms;
  --ck-ease:cubic-bezier(.2,.7,.2,1);
}
html.ck-head-hidden{--ck-sticky-top:0px}
@media (max-width:640px){
  :root{--ck-gutter:16px}
}

/* ---- 2. Fonts (self-hosted, latin; see assets/fonts/README.txt) ---- */
@font-face{font-family:"Inter";src:url("/assets/fonts/inter-latin-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url("/assets/fonts/spectral-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url("/assets/fonts/spectral-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Spectral";src:url("/assets/fonts/spectral-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url("/assets/fonts/spectral-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ---- 3. Base: element defaults (zero specificity — any page rule wins) ---- */
:where(*,*::before,*::after){box-sizing:border-box}
:where(html){-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip;
  scroll-padding-top:calc(var(--ck-sticky-top) + var(--ck-space-4))}
:where(body.ck){margin:0;background:var(--ck-white);color:var(--ck-text);font-family:var(--ck-font-body);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
:where(body.ck) :where(h1,h2,h3,h4,h5,h6){font-family:var(--ck-font-head);color:var(--ck-navy);line-height:1.2;
  margin:0 0 .5em;font-weight:700;letter-spacing:-.01em;text-wrap:balance}
:where(body.ck) :where(h1){font-size:clamp(2rem,1.55rem + 1.9vw,2.875rem)}
:where(body.ck) :where(h2){font-size:clamp(1.5rem,1.3rem + .9vw,2rem)}
:where(body.ck) :where(h3){font-size:1.3rem;font-weight:600}
:where(body.ck) :where(h4,h5,h6){font-size:1.075rem;font-weight:600}
:where(body.ck) :where(p,ul,ol,dl,blockquote,figure,table){margin:0 0 1em}
:where(body.ck) :where(a){color:var(--ck-blue-text);text-underline-offset:.16em;text-decoration-thickness:1px}
:where(body.ck) :where(a:hover){color:var(--ck-navy)}
:where(body.ck) :where(img,svg,video,canvas){max-width:100%;height:auto}
:where(body.ck) :where(button,input,select,textarea){font:inherit;color:inherit}
:where(body.ck) :where(strong,b){font-weight:600}
:where(body.ck) :focus-visible{outline:3px solid var(--ck-navy);outline-offset:2px;box-shadow:0 0 0 6px var(--ck-focus-halo)}
:where(body.ck) ::selection{background:var(--ck-blue-pale);color:var(--ck-navy)}

.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--ck-navy);color:var(--ck-white);padding:var(--ck-space-2) var(--ck-space-4)}
.skip-link:focus{left:0}
.ck .review-banner{background:var(--ck-orange-text);color:var(--ck-white);text-align:center;padding:var(--ck-space-2) var(--ck-space-4);font-size:14px;line-height:1.45}
.env-banner{background:repeating-linear-gradient(-45deg,var(--ck-alert-deep) 0 14px,var(--ck-alert) 14px 28px);color:var(--ck-white);text-align:center;
  padding:.55rem 1rem;font-size:.95rem;font-weight:700;letter-spacing:.02em;position:relative;z-index:1000}
.env-banner span{font-weight:400}

.ck-wrap{max-width:var(--ck-wrap);margin:0 auto;padding:0 var(--ck-gutter)}

/* ---- 4. Header: navy top bar · white main row · this site's menu row ----
   Sticky. crcgs.js hides it on scroll down (html.ck-head-hidden) and brings it back on
   scroll up; it is never hidden while focus is in it or the phone menu is open. */
.ck-head{position:sticky;top:0;z-index:40;background:var(--ck-white);transition:top var(--ck-dur-slow) var(--ck-ease),box-shadow var(--ck-dur) ease}
html.ck-head-hidden .ck-head{top:calc(-1 * var(--ck-header-h) - 8px)}
html.ck-scrolled .ck-head{box-shadow:var(--ck-shadow-head)}
/* Short screens — a phone on its side, or a page zoomed to 300–400% (1280 × 1024 at 400% is 320 × 256):
   the header scrolls away with the page instead of staying on screen, where it covered half of it, and
   sticky page parts (Country Profiles' tab bar, section 9) stop at the very top. */
@media (max-height:500px){
  .ck-head,html.ck-head-hidden .ck-head{position:relative;top:0}
  :root,html.ck-head-hidden{--ck-sticky-top:0px}
}

/* 1. Top bar (navy): organisation name · search · Login / Register or Account */
.ck .ck-top{background:var(--ck-navy);color:var(--ck-white);font-family:var(--ck-font-body)}
.ck-top__in{display:flex;align-items:center;gap:var(--ck-space-4);min-height:44px;padding-top:4px;padding-bottom:4px}
.ck .ck-top__org{color:var(--ck-white);text-decoration:none;font-size:14px;font-weight:500;letter-spacing:.01em;line-height:1.3;min-width:0}
.ck .ck-top__org:hover{color:var(--ck-white);text-decoration:underline}
.ck-top__tools{margin-left:auto;display:flex;align-items:center;gap:var(--ck-space-1);flex:0 0 auto}
.ck .ck-top__link{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 var(--ck-space-3);border:1px solid transparent;border-radius:var(--ck-radius-pill);
  background:none;color:var(--ck-white);font:500 14px/1 var(--ck-font-body);text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:background-color var(--ck-dur) ease,color var(--ck-dur) ease,border-color var(--ck-dur) ease}
.ck .ck-top__link:hover{background:var(--ck-on-navy-hover);color:var(--ck-white)}
.ck .ck-top__register{border-color:var(--ck-on-navy-line);margin-left:var(--ck-space-1)}
.ck .ck-top__register:hover{background:var(--ck-white);border-color:var(--ck-white);color:var(--ck-navy)}
.ck .ck-top :focus-visible,.ck .ck-footer :focus-visible{outline-color:var(--ck-orange);box-shadow:none}

/* Search: a white field on the navy bar that widens while in use; on narrower screens
   crcgs.js folds it into the magnifier button and opens it across the bar. */
.ck-search{position:relative;display:flex;align-items:center;margin-right:var(--ck-space-2)}
.ck .ck-search__input{width:13.5rem;height:34px;margin:0;padding:0 38px 0 15px;border:1px solid var(--ck-white);border-radius:var(--ck-radius-pill);
  background:var(--ck-white);color:var(--ck-text);font:400 14px var(--ck-font-body);transition:width var(--ck-dur-slow) var(--ck-ease)}
.ck .ck-search__input::placeholder{color:var(--ck-muted);opacity:1}
.ck .ck-search__input:focus-visible{outline:3px solid var(--ck-orange);outline-offset:1px;box-shadow:none}
.ck-search:focus-within .ck-search__input{width:20rem}
.ck-search__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}   /* one way to clear: the field, not a second cross */
.ck .ck-search__go,.ck .ck-search__toggle{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer}
.ck .ck-search__toggle{display:none}   /* shown by crcgs.js on narrower screens */
.ck .ck-search__go{position:absolute;right:2px;top:50%;transform:translateY(-50%);color:var(--ck-navy)}
.ck .ck-search__go:hover{background:var(--ck-light)}
.ck .ck-search__go:focus-visible{outline:3px solid var(--ck-orange);outline-offset:0}
.ck .ck-search__toggle{color:var(--ck-white);width:36px;height:36px}
.ck .ck-search__toggle:hover{background:var(--ck-on-navy-hover)}
.ck-i-open,.ck-i-close{display:inline-flex}
.ck-i-close,.ck-search__toggle[aria-expanded="true"] .ck-i-open{display:none}
.ck-search__toggle[aria-expanded="true"] .ck-i-close{display:inline-flex}
.ck .ck-search .search-suggest{left:auto;right:0;width:min(28rem,calc(100vw - 2 * var(--ck-gutter)));z-index:60;color:var(--ck-text)}

/* Account menu (signed in): a button that opens Profile / Admin panel / Log out */
.ck-account{position:relative}
.ck-caret{transition:transform var(--ck-dur) ease}
.ck-account.is-open .ck-caret{transform:rotate(180deg)}
.ck-account__menu{position:absolute;right:0;top:100%;z-index:60;display:none;min-width:210px;margin-top:6px;padding:6px;
  background:var(--ck-white);border:1px solid var(--ck-line);border-radius:var(--ck-radius);box-shadow:var(--ck-shadow-lg)}
.ck-account.is-open .ck-account__menu,
.ck-account:not(.is-ready):focus-within .ck-account__menu{display:block}   /* without JavaScript: opens while in use */
.ck .ck-account__menu a,.ck .ck-account__menu button{display:block;width:100%;margin:0;padding:10px 12px;border:0;border-radius:var(--ck-radius-sm);
  background:none;color:var(--ck-text);font:500 14px/1.3 var(--ck-font-body);text-align:left;text-decoration:none;cursor:pointer}
.ck .ck-account__menu a:hover,.ck .ck-account__menu button:hover{background:var(--ck-light);color:var(--ck-navy)}
.ck .ck-account__menu :focus-visible{outline:3px solid var(--ck-navy);outline-offset:-3px;box-shadow:none}
.ck-account__menu form{margin:4px 0 0;padding-top:4px;border-top:1px solid var(--ck-line)}

/* 2. Main row (white): seal + wordmark · the umbrella menu */
.ck-main{background:var(--ck-white);border-bottom:1px solid var(--ck-line)}
.ck-main__in{display:flex;align-items:center;gap:var(--ck-space-5);min-height:70px}
.ck .ck-brand{display:inline-flex;align-items:center;gap:var(--ck-space-3);flex:0 0 auto;color:var(--ck-navy);text-decoration:none}
.ck-brand__seal{display:block;width:44px;height:44px}
.ck-brand__word{font:700 26px/1 var(--ck-font-head);letter-spacing:.03em;color:var(--ck-navy)}
.ck-nav{margin-left:auto}
.ck-nav__head,.ck-nav__label,.ck-nav__group{display:none}   /* the phone menu's parts (section 5) */
.ck .ck-nav ul{list-style:none;margin:0;padding:0}

/* The umbrella menu and its "selector" pill: hovering, or focusing, an item slides a blue
   pill under it; at rest the pill sits on this site's item. Without JavaScript each item
   shows the same pill on hover and the current one keeps it. */
.ck-umbrella{position:relative}
.ck-umbrella__list{display:flex;align-items:center;gap:var(--ck-space-1)}
.ck .ck-umbrella__link{position:relative;z-index:1;display:block;padding:10px 16px;border-radius:var(--ck-radius-pill);
  color:var(--ck-text);font:500 15px/1.2 var(--ck-font-body);text-decoration:none;white-space:nowrap;
  transition:background-color var(--ck-dur) ease,color var(--ck-dur) ease}
.ck .ck-umbrella__link:hover,.ck .ck-umbrella__link[aria-current]{background:var(--ck-blue);color:var(--ck-navy)}
.ck .ck-umbrella__link[aria-current]{font-weight:600}
.ck .ck-umbrella.is-ready .ck-umbrella__link{background:transparent}
.ck .ck-umbrella.is-ready .ck-umbrella__link.is-under-pill{color:var(--ck-navy)}
.ck-umbrella__pill{position:absolute;z-index:0;top:0;left:0;width:0;height:100%;border-radius:var(--ck-radius-pill);background:var(--ck-blue);
  opacity:0;pointer-events:none;transform:translateX(0);
  transition:transform var(--ck-dur-slow) var(--ck-ease),width var(--ck-dur-slow) var(--ck-ease),opacity var(--ck-dur) ease}
.ck-umbrella__pill.is-on{opacity:1}
.ck-umbrella__pill.is-instant{transition:none}

/* 3. This site's menu row (light blue): its name, then its sections */
.ck .ck-subnav{background:var(--ck-light);border-bottom:1px solid var(--ck-line);font-family:var(--ck-font-body)}
.ck-subnav__in{display:flex;align-items:center;gap:var(--ck-space-4);min-height:46px}
.ck .ck-subnav__title{flex:0 0 auto;padding-right:var(--ck-space-4);border-right:1px solid var(--ck-line-strong);
  color:var(--ck-navy);font:700 16px/1.2 var(--ck-font-head);text-decoration:none;white-space:nowrap}
.ck .ck-subnav__title:hover{color:var(--ck-blue-text)}
.ck .ck-subnav__list{display:flex;align-items:center;gap:2px;min-width:0;margin:0;padding:4px 0;list-style:none;overflow-x:auto;scrollbar-width:none}
.ck-subnav__list::-webkit-scrollbar{display:none}
.ck .ck-subnav__link{display:block;padding:7px 12px;border-radius:var(--ck-radius-pill);color:var(--ck-text);
  font:500 14px/1.2 var(--ck-font-body);text-decoration:none;white-space:nowrap;transition:background-color var(--ck-dur) ease,color var(--ck-dur) ease}
.ck .ck-subnav__link:hover{background:var(--ck-white);color:var(--ck-navy)}
.ck .ck-subnav__link[aria-current]{background:var(--ck-white);color:var(--ck-navy);font-weight:600;box-shadow:inset 0 0 0 1px var(--ck-blue)}

.ck-burger{display:none}

/* Smaller laptops: the field no longer widens. Tablets and phones: it folds into the magnifier
   button (crcgs.js) and opens across the top bar. html.ck-js is set before the page is drawn
   (crcgs-early.js), so the folded bar is there from the first frame; the button carries `hidden`
   in the page only for the no-JavaScript case, where the field stays open. */
@media (max-width:1100px){
  .ck-search:focus-within .ck-search__input{width:13.5rem}
}
@media (max-width:900px){
  .ck-js .ck .ck-search__toggle{display:grid}
  .ck-js .ck .ck-search:not(.is-open) .ck-search__input,
  .ck-js .ck .ck-search:not(.is-open) .ck-search__go{display:none}
  .ck-js .ck .ck-search.is-open{position:absolute;left:var(--ck-gutter);right:var(--ck-gutter);top:0;bottom:0;z-index:5;display:flex;align-items:center;gap:var(--ck-space-2);margin:0;background:var(--ck-navy)}
  .ck-js .ck .ck-search.is-open .ck-search__input,.ck-js .ck .ck-search.is-open:focus-within .ck-search__input{flex:1 1 auto;width:auto;min-width:0}
  .ck-js .ck .ck-search.is-open .ck-search__toggle{order:2;flex:0 0 auto}
  .ck-js .ck .ck-search.is-open .ck-search__go{right:calc(36px + var(--ck-space-2) + 2px)}
  .ck-js .ck .ck-search.is-open .search-suggest{left:0;right:0;width:auto;top:calc(100% - 2px)}
  .ck-js .ck-top__in{position:relative}
}

/* ---- 5. Phones and small tablets: one drawer holds both menus (and Login / Register) ----
   The drawer needs crcgs.js, so it is drawn only under html.ck-js (set before the page is drawn,
   crcgs-early.js). Without JavaScript the menus stay in the page instead (end of this section). */
@media (max-width:900px){
  .ck-js .ck .ck-burger{display:inline-grid;place-items:center;margin-left:auto;width:44px;height:44px;padding:0;border:1px solid var(--ck-line);
    border-radius:var(--ck-radius-sm);background:var(--ck-white);color:var(--ck-navy);cursor:pointer}
  .ck-js .ck .ck-burger:hover{background:var(--ck-light)}
  .ck-main__in{min-height:64px}
  .ck-js .ck-subnav{display:none}
  .ck-js .ck .ck-nav{position:fixed;top:0;right:0;bottom:0;z-index:70;width:min(86vw,360px);margin:0;padding:0 0 var(--ck-space-6);overflow-y:auto;overscroll-behavior:contain;
    background:var(--ck-white);box-shadow:var(--ck-shadow-lg);transform:translateX(100%);visibility:hidden;
    transition:transform var(--ck-dur-slow) var(--ck-ease),visibility 0s linear var(--ck-dur-slow)}
  .ck-js .ck .ck-nav.open{transform:none;visibility:visible;transition:transform var(--ck-dur-slow) var(--ck-ease)}
  .ck-js .ck-nav__head{display:flex;align-items:center;justify-content:space-between;min-height:64px;padding:0 var(--ck-space-3) 0 var(--ck-space-5);
    background:var(--ck-navy);color:var(--ck-white)}
  .ck-nav__title{font:700 20px/1 var(--ck-font-head)}
  .ck .ck-nav__close{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:var(--ck-radius-sm);background:none;color:var(--ck-white);cursor:pointer}
  .ck .ck-nav__close:hover{background:var(--ck-on-navy-hover)}
  .ck .ck-nav__close:focus-visible{outline-color:var(--ck-orange);box-shadow:none}
  .ck-js .ck-nav__group{display:block}
  .ck-js .ck .ck-nav__label{display:block;margin:var(--ck-space-5) var(--ck-space-5) var(--ck-space-2);color:var(--ck-muted);
    font:600 12px/1.2 var(--ck-font-body);letter-spacing:.12em;text-transform:uppercase}
  .ck-js .ck-umbrella__list{display:block}
  .ck-umbrella__pill{display:none}
  .ck-js .ck .ck-umbrella__link,.ck-js .ck .ck-nav__list a{display:block;margin:0 var(--ck-space-3);padding:12px var(--ck-space-3);border-radius:var(--ck-radius-sm);
    color:var(--ck-text);font:500 16px/1.3 var(--ck-font-body);text-decoration:none}
  .ck-js .ck .ck-umbrella.is-ready .ck-umbrella__link,.ck-js .ck .ck-umbrella__link{background:transparent}
  .ck-js .ck .ck-umbrella__link:hover,.ck-js .ck .ck-nav__list a:hover{background:var(--ck-light);color:var(--ck-navy)}
  .ck-js .ck .ck-umbrella.is-ready .ck-umbrella__link[aria-current],.ck-js .ck .ck-umbrella__link[aria-current],.ck-js .ck .ck-nav__list a[aria-current]{
    background:var(--ck-light);color:var(--ck-navy);font-weight:600;box-shadow:inset 3px 0 0 var(--ck-blue)}
  .ck-js .ck .ck-nav__group{border-top:1px solid var(--ck-line);margin-top:var(--ck-space-4)}
  .ck-backdrop{position:fixed;inset:0;z-index:65;background:var(--ck-scrim);opacity:0;transition:opacity var(--ck-dur-slow) ease}
  .ck-backdrop.show{opacity:1}
  html.ck-drawer-open{overflow:hidden}
  html.ck-drawer-open .ck-head{z-index:90}   /* the drawer above the feedback button and tooltips */
  /* Without JavaScript: no drawer and no menu button. The umbrella menu wraps under the logo, this
     site's menu row stays below it, and the top bar may take two lines (the search stays open). */
  html:not(.ck-js) .ck-main__in{flex-wrap:wrap;column-gap:var(--ck-space-3);padding-top:var(--ck-space-3);padding-bottom:var(--ck-space-2)}
  html:not(.ck-js) .ck-nav{flex:1 1 100%;margin:0}
  html:not(.ck-js) .ck-umbrella__list{flex-wrap:wrap}
  html:not(.ck-js) .ck .ck-umbrella__link{padding:8px 12px}
  html:not(.ck-js) .ck-top__in{flex-wrap:wrap}
}
@media (min-width:901px){
  .ck-backdrop{display:none}
}
@media (max-width:600px){
  .ck .ck-top__org{font-size:12.5px}
  .ck .ck-top__link{padding:0 9px}
  .ck .ck-top__text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .ck-js .ck .ck-top__register{display:none}       /* in the menu drawer instead (without JavaScript it stays here) */
  .ck-search{margin-right:0}
  .ck .ck-brand__word{font-size:23px}
  .ck-brand__seal{width:40px;height:40px}
}
@media (min-width:601px){
  .ck .ck-nav__group.ck-nav__account{display:none}   /* Login / Register stay in the top bar */
}

/* ---- 6. Footer (navy) ---- */
.ck .ck-footer{position:relative;margin-top:var(--ck-space-9);background:var(--ck-navy);color:var(--ck-on-navy);font:400 14px/1.6 var(--ck-font-body)}
.ck-footer__seal{position:relative;z-index:1;display:flex;justify-content:center}   /* above a page's last section when the seal reaches into it */
.ck-footer__seal img{display:block;width:112px;height:112px;margin-top:-56px;object-fit:contain;filter:var(--ck-seal-glow)}
.ck-footer__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3.2fr);gap:var(--ck-space-7);padding-top:var(--ck-space-5);padding-bottom:var(--ck-space-7)}
.ck .ck-footer__org{margin:0;color:var(--ck-white);font:700 21px/1.3 var(--ck-font-head);max-width:22ch}
.ck .ck-footer__short{margin:var(--ck-space-2) 0 var(--ck-space-4);color:var(--ck-orange);font:600 11px/1 var(--ck-font-body);letter-spacing:.32em}
.ck .ck-footer__about{margin:0;max-width:36ch;color:var(--ck-on-navy-muted)}
.ck .ck-footer__social{display:flex;gap:10px;margin:var(--ck-space-5) 0 0;padding:0;list-style:none}
.ck .ck-footer__social a{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--ck-on-navy-line);border-radius:50%;color:var(--ck-white);
  transition:background-color var(--ck-dur) ease,color var(--ck-dur) ease,border-color var(--ck-dur) ease}
.ck .ck-footer__social a:hover{background:var(--ck-orange);border-color:var(--ck-orange);color:var(--ck-navy)}
.ck-footer__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:var(--ck-space-6) var(--ck-space-5)}
.ck .ck-footer__title{margin:0 0 var(--ck-space-4);color:var(--ck-orange);font:600 12px/1.3 var(--ck-font-body);letter-spacing:.14em;text-transform:uppercase}
.ck .ck-footer__col ul{margin:0;padding:0;list-style:none}
.ck .ck-footer__col li{margin:0 0 10px}
.ck .ck-footer__col a,.ck .ck-footer__legal a{color:var(--ck-on-navy);text-decoration:none}
.ck .ck-footer__col a:hover,.ck .ck-footer__legal a:hover{color:var(--ck-white);text-decoration:underline}
.ck .ck-footer__note{margin:0;padding:var(--ck-space-4) 0;border-top:1px solid var(--ck-on-navy-rule);color:var(--ck-on-navy-muted);font-size:12.5px;line-height:1.6}
.ck-footer__bottom{background:var(--ck-navy-deep)}
.ck-footer__bottom-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--ck-space-2) var(--ck-space-5);
  padding-top:var(--ck-space-4);padding-bottom:var(--ck-space-4);font-size:13px}
.ck .ck-footer__copy{margin:0;color:var(--ck-on-navy-muted)}
.ck-footer__legal{display:flex;gap:var(--ck-space-5)}
@media (max-width:900px){
  .ck-footer__top{grid-template-columns:1fr;gap:var(--ck-space-6)}
}
@media (max-width:600px){
  .ck-footer__cols{grid-template-columns:1fr 1fr}
}

/* ---- 7. Components ---- */
.ck-section{padding:var(--ck-space-8) 0}
.ck-section--light{background:var(--ck-light)}
.ck-section--pink{background:var(--ck-pink)}
.ck-section--neutral{background:var(--ck-neutral)}
.ck-section--navy{background:var(--ck-navy);color:var(--ck-on-navy)}
.ck .ck-section--navy :where(h1,h2,h3,h4){color:var(--ck-white)}
.ck .ck-section--navy a:not(.ck-btn){color:var(--ck-white)}
.ck .ck-section--navy :focus-visible{outline-color:var(--ck-orange);box-shadow:none}
/* On the tinted grounds the blue text goes one step deeper (review R3-04): re-pointing the token on
   the ground reaches every link, .ck-link, eyebrow and chip inside it. #0077B6 stays on white. */
.ck-section--light,.ck-section--pink,.ck-section--neutral,.ck .ck-subnav,.ck .ck-card--cream,.ck .ck-card--neutral,
.ck .ck-empty,.ck .empty-state,.ck .ck-form-note,.ck .ck-prose blockquote,.ck .ck-prose th{--ck-blue-text:var(--ck-blue-text-deep)}
.ck-section__head{max-width:46rem;margin:0 0 var(--ck-space-6)}
.ck .ck-eyebrow{display:block;margin:0 0 var(--ck-space-2);color:var(--ck-blue-text);font:600 13px/1.3 var(--ck-font-body);letter-spacing:.12em;text-transform:uppercase}
.ck-section--navy .ck-eyebrow{color:var(--ck-blue)}
.ck .ck-lead{font-size:1.125rem;line-height:1.65;color:var(--ck-muted)}
@media (max-width:640px){ .ck-section{padding:var(--ck-space-7) 0} }

/* Buttons: primary = orange with navy text; secondary = navy with white text; ghost = outline */
.ck .ck-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ck-space-2);min-height:46px;padding:0 var(--ck-space-5);
  border:2px solid transparent;border-radius:var(--ck-radius-sm);font:600 15px/1.2 var(--ck-font-body);text-decoration:none;cursor:pointer;
  transition:background-color var(--ck-dur) ease,color var(--ck-dur) ease,border-color var(--ck-dur) ease,transform var(--ck-dur) ease,box-shadow var(--ck-dur) ease}
.ck .ck-btn:hover{transform:translateY(-1px);box-shadow:var(--ck-shadow)}
.ck .ck-btn:active{transform:none;box-shadow:none}
.ck .ck-btn--primary{background:var(--ck-orange);color:var(--ck-navy)}
.ck .ck-btn--primary:hover{background:var(--ck-orange-hover);color:var(--ck-navy)}
.ck .ck-btn--secondary{background:var(--ck-navy);color:var(--ck-white)}
.ck .ck-btn--secondary:hover{background:var(--ck-navy-deep);color:var(--ck-white)}
.ck .ck-btn--ghost{background:transparent;border-color:var(--ck-navy);color:var(--ck-navy)}
.ck .ck-btn--ghost:hover{background:var(--ck-navy);color:var(--ck-white)}
.ck .ck-section--navy .ck-btn--ghost{border-color:var(--ck-white);color:var(--ck-white)}
.ck .ck-section--navy .ck-btn--ghost:hover{background:var(--ck-white);color:var(--ck-navy)}
.ck .ck-btn--small{min-height:36px;padding:0 var(--ck-space-4);font-size:14px}
.ck .ck-btn svg{flex:0 0 auto}
.ck .ck-link{display:inline-flex;align-items:center;gap:6px;color:var(--ck-blue-text);font-weight:600;text-decoration:none}
.ck .ck-link::after{content:"→";transition:transform var(--ck-dur) ease}
.ck .ck-link:hover{color:var(--ck-navy);text-decoration:underline}
.ck .ck-link:hover::after{transform:translateX(3px)}

/* Cards, chips, tags, badges */
.ck .ck-card{display:block;padding:var(--ck-space-5);background:var(--ck-white);border:1px solid var(--ck-line);border-radius:var(--ck-radius);
  box-shadow:var(--ck-shadow);color:inherit;text-decoration:none;transition:transform var(--ck-dur) ease,box-shadow var(--ck-dur) ease,border-color var(--ck-dur) ease}
.ck .ck-card--cream{background:var(--ck-cream)}
.ck .ck-card--neutral{background:var(--ck-neutral);box-shadow:none}
.ck a.ck-card:hover,.ck .ck-card--link:hover{transform:translateY(-3px);box-shadow:var(--ck-shadow-lg);border-color:var(--ck-line-strong)}
.ck .ck-card :where(h2,h3){margin-top:0}
.ck .ck-chip,.ck .ck-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:var(--ck-radius-pill);background:var(--ck-light);
  color:var(--ck-navy);font:500 13px/1.4 var(--ck-font-body);text-decoration:none;white-space:nowrap}
.ck a.ck-chip:hover,.ck a.ck-tag:hover{background:var(--ck-blue);color:var(--ck-navy)}
.ck .ck-chip[aria-current],.ck .ck-chip.is-active{background:var(--ck-navy);color:var(--ck-white)}
.ck .ck-badge{display:inline-block;padding:3px 8px;border-radius:4px;background:var(--ck-navy);color:var(--ck-white);
  font:600 11px/1.3 var(--ck-font-body);letter-spacing:.07em;text-transform:uppercase;vertical-align:middle}
.ck .ck-badge--orange{background:var(--ck-orange);color:var(--ck-navy)}
.ck .ck-badge--light{background:var(--ck-light);color:var(--ck-navy)}
.ck .ck-meta{color:var(--ck-muted);font-size:14px}

/* Article typography: a 68-character measure, Spectral headings, Inter text */
.ck .ck-prose{max-width:68ch;font-size:17px;line-height:1.75;color:var(--ck-text)}
.ck .ck-prose > :first-child{margin-top:0}
.ck .ck-prose :where(h2){margin:2em 0 .6em;font:700 1.65rem/1.25 var(--ck-font-head);color:var(--ck-navy)}
.ck .ck-prose :where(h3){margin:1.7em 0 .5em;font:600 1.3rem/1.3 var(--ck-font-head);color:var(--ck-navy)}
.ck .ck-prose :where(h4){margin:1.5em 0 .4em;font:600 1.1rem/1.35 var(--ck-font-head);color:var(--ck-navy)}
.ck .ck-prose :where(p){margin:0 0 1.15em}
.ck .ck-prose :where(ul,ol){margin:0 0 1.15em;padding-left:1.4em}
.ck .ck-prose :where(li){margin:0 0 .45em}
.ck .ck-prose :where(li::marker){color:var(--ck-blue-text)}
.ck .ck-prose :where(a){color:var(--ck-blue-text);text-decoration:underline}
.ck .ck-prose :where(blockquote){margin:1.6em 0;padding:var(--ck-space-4) var(--ck-space-5);border-left:4px solid var(--ck-blue);
  background:var(--ck-light);border-radius:0 var(--ck-radius-sm) var(--ck-radius-sm) 0;font-family:var(--ck-font-head);font-size:1.12em;color:var(--ck-navy)}
.ck .ck-prose :where(blockquote p:last-child){margin-bottom:0}
.ck .ck-prose :where(figure){margin:1.8em 0}
.ck .ck-prose :where(img){display:block;border-radius:var(--ck-radius-sm)}
.ck .ck-prose :where(figcaption){margin-top:var(--ck-space-2);color:var(--ck-muted);font-size:14px;line-height:1.5}
.ck .ck-prose :where(hr){margin:2.2em 0;border:0;border-top:1px solid var(--ck-line)}
.ck .ck-prose :where(table){width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
.ck .ck-prose :where(th,td){padding:10px 12px;border-bottom:1px solid var(--ck-line);text-align:left;vertical-align:top}
.ck .ck-prose :where(th){background:var(--ck-neutral);color:var(--ck-navy);font-weight:600}
.ck .ck-prose :where(mark){background:var(--ck-blue-pale);color:inherit;padding:0 .15em}

/* Empty state, breadcrumb, paging */
.ck .ck-empty,.ck .empty-state{padding:var(--ck-space-7) var(--ck-space-5);text-align:center;color:var(--ck-muted);background:var(--ck-neutral);
  border:1px dashed var(--ck-line-strong);border-radius:var(--ck-radius)}
.ck .ck-empty :where(p),.ck .empty-state :where(p){margin:var(--ck-space-2) 0}
.ck .empty-state svg{color:var(--ck-line-strong)}
.ck .empty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--ck-space-4)}
.ck .ck-breadcrumb{margin:var(--ck-space-5) 0 var(--ck-space-4);font-size:14px;color:var(--ck-muted)}
.ck .ck-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:2px 0;margin:0;padding:0;list-style:none}
.ck .ck-breadcrumb li + li::before{content:"›";margin:0 var(--ck-space-2);color:var(--ck-line-strong)}
.ck .ck-breadcrumb a{color:var(--ck-muted);text-decoration:none}
.ck .ck-breadcrumb a:hover{color:var(--ck-blue-text);text-decoration:underline}
.ck .ck-breadcrumb [aria-current]{color:var(--ck-text)}
.ck .pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--ck-space-2) var(--ck-space-5);margin:var(--ck-space-6) 0;font-size:14px}
.ck .pager p{margin:0}
.ck .pager-count,.ck .pager-size{color:var(--ck-muted);font-variant-numeric:tabular-nums}
.ck .pager-count strong{color:var(--ck-text)}
.ck .pager-pages{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.ck .pager-pages a,.ck .pager-pages span{display:inline-block;min-width:38px;padding:7px 11px;border:1px solid var(--ck-line-strong);border-radius:var(--ck-radius-pill);
  background:var(--ck-white);color:var(--ck-navy);text-align:center;text-decoration:none;font-variant-numeric:tabular-nums}
.ck .pager-pages a:hover{border-color:var(--ck-navy);background:var(--ck-light)}
.ck .pager-pages span[aria-current="page"]{background:var(--ck-navy);border-color:var(--ck-navy);color:var(--ck-white);font-weight:600}
.ck .pager-pages span[aria-disabled="true"]{color:var(--ck-muted);opacity:.6}
.ck .pager-pages .pager-gap{border-color:transparent;background:transparent;min-width:1rem;padding-inline:2px}
.ck .pager-size a,.ck .pager-size span{margin:0 3px}
.ck .pager-size span[aria-current="true"]{color:var(--ck-navy);font-weight:700}

/* Touch screens: every tap target at least 44 × 44px (review R3-07; the brief's size, WCAG 2.5.5).
   Mouse layouts are unchanged. Links inside running text (breadcrumbs, sentences) are left as text. */
@media (pointer:coarse){
  .ck-top__in{padding-top:0;padding-bottom:0}
  .ck .ck-top__org{display:inline-flex;align-items:center;min-height:44px}
  .ck .ck-top__link{min-height:44px;min-width:44px;justify-content:center}
  .ck .ck-search__toggle{width:44px;height:44px}
  .ck .ck-search__input{height:44px}
  .ck .ck-search__go{width:40px;height:40px}
  .ck .ck-account__menu a,.ck .ck-account__menu button{padding-top:13px;padding-bottom:13px}
  .ck .ck-brand{min-height:44px}
  .ck .ck-umbrella__link,html:not(.ck-js) .ck .ck-umbrella__link{padding-top:13px;padding-bottom:13px}
  .ck .ck-subnav__link{padding-top:13px;padding-bottom:13px}
  .ck .ck-footer__col li{margin:0}
  .ck .ck-footer__col a,.ck .ck-footer__legal a{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
  .ck .ck-footer__social a{width:44px;height:44px}
  .ck .ck-btn--small{min-height:44px}
  .ck .ck-link,.ck a.ck-chip,.ck a.ck-tag{min-height:44px}
  .ck .pager-pages a,.ck .pager-pages span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
}

/* Grid helpers: columns that fold on smaller screens */
.ck-grid{display:grid;gap:var(--ck-space-5)}
.ck-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ck-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ck-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ck-grid--auto{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr))}
@media (max-width:1024px){ .ck-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))} .ck-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .ck-grid--2,.ck-grid--3,.ck-grid--4{grid-template-columns:minmax(0,1fr)} }

/* ---- 8. Forms ---- */
.ck .ck-field{margin:0 0 var(--ck-space-5)}
.ck .ck-label{display:block;margin:0 0 6px;color:var(--ck-text);font:600 14px/1.4 var(--ck-font-body)}
.ck .ck-hint{display:block;margin:4px 0 0;color:var(--ck-muted);font-size:13.5px;line-height:1.5}
.ck .ck-input,.ck .ck-select,.ck .ck-textarea{display:block;width:100%;margin:0;padding:11px 14px;border:1px solid var(--ck-input-line);border-radius:8px;
  background:var(--ck-white);color:var(--ck-text);font:400 15px/1.4 var(--ck-font-body);transition:border-color var(--ck-dur) ease,box-shadow var(--ck-dur) ease}
.ck .ck-textarea{min-height:9rem;resize:vertical;line-height:1.55}
.ck .ck-select{appearance:none;padding-right:40px;
  background-image:linear-gradient(45deg,transparent 50%,var(--ck-navy) 50%),linear-gradient(135deg,var(--ck-navy) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.ck .ck-input:hover,.ck .ck-select:hover,.ck .ck-textarea:hover{border-color:var(--ck-muted)}
.ck .ck-input:focus-visible,.ck .ck-select:focus-visible,.ck .ck-textarea:focus-visible{outline:2px solid var(--ck-navy);outline-offset:0;border-color:var(--ck-navy);box-shadow:0 0 0 5px var(--ck-focus-halo)}
.ck .ck-input::placeholder,.ck .ck-textarea::placeholder{color:var(--ck-muted);opacity:1}
.ck .ck-input[aria-invalid="true"],.ck .ck-select[aria-invalid="true"],.ck .ck-textarea[aria-invalid="true"]{border-color:var(--ck-danger)}
.ck .ck-check{display:flex;align-items:flex-start;gap:10px;margin:0 0 var(--ck-space-3);font-size:15px;line-height:1.45;cursor:pointer}
.ck .ck-check input{flex:0 0 auto;width:18px;height:18px;margin:2px 0 0;accent-color:var(--ck-navy)}
.ck .ck-form-error{display:flex;gap:8px;margin:6px 0 0;color:var(--ck-danger);font-size:14px;font-weight:500;line-height:1.45}
.ck .ck-form-error::before{content:"!";flex:0 0 auto;display:grid;place-items:center;width:18px;height:18px;margin-top:1px;border-radius:50%;
  background:var(--ck-danger);color:var(--ck-white);font-size:12px;font-weight:700;line-height:1}
.ck .ck-form-note{padding:var(--ck-space-3) var(--ck-space-4);border-radius:var(--ck-radius-sm);background:var(--ck-light);color:var(--ck-navy);font-size:15px}
.ck .ck-form-note--error{background:var(--ck-cream);color:var(--ck-danger);box-shadow:inset 3px 0 0 var(--ck-danger)}
.ck .ck-form-note--success{color:var(--ck-success);box-shadow:inset 3px 0 0 var(--ck-success)}

/* ---- 9. Country Profiles on the kit (body.v5.ck) ----
   Country Profiles' pages are styled by v5.css through its own tokens (app.css :root). Here
   those tokens point at the kit's, so every page takes the CRCGS palette and fonts at once.
   Values set in Admin → Settings → Colours / Fonts are overridden under the kit: the design
   guide fixes the palette. Enforcement orange (--orange) and success green keep their
   meaning and colour. */
body.ck{
  --navy:var(--ck-navy);
  --navy-2:var(--ck-blue-text);     /* link hover */
  --navy-mid:var(--ck-navy);
  --navy-deep:var(--ck-navy-deep);
  --gold:var(--ck-orange);          /* accent fills and rules */
  --gold-light:var(--ck-orange);
  --gold-pale:var(--ck-cream);
  --gold-text:var(--ck-orange-text);
  --ink:var(--ck-text);
  --text:var(--ck-text);
  --slate:var(--ck-muted);
  --dim:var(--ck-muted);
  --muted:var(--ck-muted);
  --dim2:var(--ck-muted);
  --border:var(--ck-line-strong);
  --line-2:var(--ck-line-strong);
  --border-light:var(--ck-line);
  --line:var(--ck-line);
  --chip:var(--ck-neutral);
  --pearl:var(--ck-neutral);
  --cream:var(--ck-cream);
  --off-white:var(--ck-neutral);
  --wash:var(--ck-neutral);
  --tint:var(--ck-light);
  --tint-2:var(--ck-blue-pale);
  --color-band:var(--ck-neutral);
  --color-card-border:var(--ck-line);
  --color-card-border-hover:var(--ck-line-strong);
  --color-terracotta:var(--ck-blue);
  --font-display:var(--ck-font-head);
  --font-body:var(--ck-font-body);
  --font-label:var(--ck-font-body);
}
/* One page width: Country Profiles' blocks (.wrap on the home and country pages, .container on
   the others) line up with the header and footer */
body.v5.ck .wrap,body.v5.ck .container{max-width:var(--ck-wrap);padding:0 var(--ck-gutter)}
/* Buttons and whole-card links read as buttons and cards, not underlined text */
body.v5.ck .hp-btn,body.v5.ck a.hp-feat{text-decoration:none}
body.v5.ck .hp-btn-gold:hover{background:var(--ck-orange-hover)}
/* On navy panels: links in the kit's blue, focus rings in orange (v5 wrote its gold here as hex) */
body.v5.ck .dark a,body.v5.ck .dark .sh .more{color:var(--ck-blue)}
body.v5.ck .dark :focus-visible,body.v5.ck .hp-cov-dark :focus-visible{outline-color:var(--ck-orange)}
/* Sticky parts stop below the header — or at the top while it is hidden */
body.v5.ck .ptabs{top:var(--ck-sticky-top);transition:top var(--ck-dur-slow) var(--ck-ease)}
body.v5.ck .rail{top:calc(var(--ck-sticky-top) + 16px);transition:top var(--ck-dur-slow) var(--ck-ease)}
@media (min-width:768px){
  body.v5.ck .data-table thead th{top:calc(var(--ck-sticky-top) + 4px);transition:top var(--ck-dur-slow) var(--ck-ease)}
  body.v5.ck .ptabs ~ .wrap .data-table thead th{top:calc(var(--ck-sticky-top) + 49px)}
}
/* Short or zoomed screens (see section 4): the tab bar scrolls with the page too */
@media (max-height:500px){
  body.v5.ck .ptabs{position:static}
  body.v5.ck .ptabs ~ .wrap .data-table thead th{top:calc(var(--ck-sticky-top) + 4px)}
}

/* ---- 10. Reduced motion: nothing slides, fades or grows ---- */
@media (prefers-reduced-motion:reduce){
  .ck-head,.ck-umbrella__pill,.ck-umbrella__link,.ck-subnav__link,.ck-search__input,.ck-caret,.ck-nav,.ck-backdrop,
  .ck-btn,.ck-card,.ck-link::after,.ck-footer__social a,body.v5.ck .ptabs,body.v5.ck .rail,body.v5.ck .data-table thead th{transition:none !important}
  .ck .ck-btn:hover,.ck a.ck-card:hover,.ck .ck-card--link:hover{transform:none}
  .ck-search:focus-within .ck-search__input{width:13.5rem}
}

/* ---------- Team review 2026-10-18 (h3): the account menu ----------
   The account menu (signed in) is a <details> disclosure since the team review, so it opens and closes
   without JavaScript too (partials/crcgs/header.php; crcgs.js section 4 adds Escape, the arrow keys
   and closing on a click elsewhere). It lists the reader's name, Profile, Reading list (the Knowledge
   Hub), Settings, the team's links (Admin panel, Add post) and Log out. These rules come after the
   older button rules in section 4 and win over them: open = [open], never "open while focused". */
.ck details.ck-account > summary{list-style:none;user-select:none}
.ck details.ck-account > summary::-webkit-details-marker{display:none}
.ck details.ck-account > summary::marker{content:""}
.ck details.ck-account:not([open]) > .ck-account__menu{display:none}
.ck details.ck-account[open] > .ck-account__menu{display:block}
.ck details.ck-account[open] > summary{background:var(--ck-on-navy-hover)}
.ck details.ck-account[open] .ck-caret{transform:rotate(180deg)}
.ck .ck-account__menu{min-width:230px;max-width:min(320px,calc(100vw - 2 * var(--ck-gutter)))}
.ck .ck-account__who{margin:0 0 4px;padding:8px 12px 10px;border-bottom:1px solid var(--ck-line);color:var(--ck-navy);
  font:600 14px/1.35 var(--ck-font-body);overflow-wrap:anywhere}
.ck .ck-account__menu a[aria-current="page"]{background:var(--ck-light);color:var(--ck-navy);font-weight:600;box-shadow:inset 3px 0 0 var(--ck-blue)}
.ck .ck-account__staff{margin:4px 0 0;padding-top:4px;border-top:1px solid var(--ck-line)}
@media (pointer:coarse){
  .ck .ck-account__menu a,.ck .ck-account__menu button{min-height:44px}
}

/* ---------- Team review 2026-10-18 (h1): the CRCGS hand cursor ---------- */
/* Design guide: "the custom hand-like … cursor …, but keep it subtle and ensure ordinary interaction
   remains usable"; team: keep the hand, no pencil. On the public pages under the kit (body.ck: the
   Knowledge Hub, and Country Profiles on the kit — never the admin, never Country Profiles' v5 look),
   with a mouse or trackpad only, links, buttons and the other things you click show the CRCGS hand
   (assets/img/cursor-hand.svg: brand navy with a white outline, the fingertip is the hotspot; the @2x
   picture for sharp screens). A browser that cannot show it shows the usual pointer. Text fields and
   menus keep their own cursors, nothing disabled takes the hand, the globe keeps its grab hand while
   dragged, and no pencil cursor is used anywhere. A cursor picture cannot move in today's browsers, so
   the hand is still: subtle, as the guide asks. */
@media (hover:hover) and (pointer:fine){
  body.ck :is(a[href],button,[role="button"],summary,label.ck-check,
    input[type="checkbox"],input[type="radio"],input[type="submit"],input[type="button"],input[type="reset"],input[type="file"],input[type="image"]):not(:disabled):not([aria-disabled="true"]):not(.is-disabled),
  body.ck .gl:not(.is-dragging) .gl__canvas.is-over{
    cursor:url("/assets/img/cursor-hand.svg") 8 1,pointer;
    cursor:-webkit-image-set(url("/assets/img/cursor-hand.svg") 1x,url("/assets/img/cursor-hand@2x.png") 2x) 8 1,pointer;
    cursor:image-set(url("/assets/img/cursor-hand.svg") 1x,url("/assets/img/cursor-hand@2x.png") 2x) 8 1,pointer;
  }
}

/* ---------- Team review round 2 (m1): the footer's Account column for a reader who is logged in ----------
   The column then lists the header's account menu (partials/crcgs/footer.php, SiteMenu::accountMenu()), and
   Log out is the header's POST form with the session's token: its button looks like the links around it. */
.ck .ck-footer__logout{margin:0}
.ck .ck-footer__logout button{margin:0;padding:0;border:0;background:none;color:var(--ck-on-navy);font:inherit;line-height:inherit;text-align:left;cursor:pointer}
.ck .ck-footer__logout button:hover{color:var(--ck-white);text-decoration:underline}
@media (pointer:coarse){
  .ck .ck-footer__logout button{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
}

/* ---------- Search across both sites: the header's suggestions and Country Profiles' search page 2026-10-20 ---------- */
/* The header's suggestions on BOTH sites (crcgs-search.js; moved here from hub-feeds.css, .hub-suggest renamed .ck-suggest):
   .ck-suggest, the listbox under the search field — __site (a site's name), __group / __label (a kind), __opt (an
   option: __title, __meta; .is-active = the one the arrow keys chose), __all ("See all results"). */
.ck .ck-search .ck-suggest{position:absolute;top:calc(100% + 6px);right:0;z-index:60;width:min(30rem,calc(100vw - 2 * var(--ck-gutter)));
  max-height:min(76vh,40rem);overflow-y:auto;overscroll-behavior:contain;padding:var(--ck-space-2) 0;border:1px solid var(--ck-line-strong);
  border-radius:var(--ck-radius);background:var(--ck-white);box-shadow:var(--ck-shadow-lg);color:var(--ck-text);text-align:left}
.ck .ck-search .ck-suggest[hidden]{display:none}
.ck .ck-suggest__site{margin:var(--ck-space-2) 0 0;padding:var(--ck-space-2) var(--ck-space-4) 2px;color:var(--ck-navy);
  font:700 13px/1.3 var(--ck-font-body);letter-spacing:.08em;text-transform:uppercase}
.ck .ck-suggest__site:first-child{margin-top:0}
.ck .ck-suggest__group{padding:2px 0 var(--ck-space-1)}
.ck .ck-suggest__label{padding:6px var(--ck-space-4) 2px;color:var(--ck-muted);font:600 12px/1.3 var(--ck-font-body)}
.ck .ck-suggest__opt{display:block;padding:7px var(--ck-space-4);color:var(--ck-text);text-decoration:none;line-height:1.35}
.ck .ck-suggest__opt:hover,.ck .ck-suggest__opt.is-active{background:var(--ck-light)}
.ck .ck-suggest__opt.is-active{box-shadow:inset 3px 0 0 var(--ck-navy)}
.ck .ck-suggest__title{display:block;color:var(--ck-navy);font-weight:600;font-size:14px}
.ck .ck-suggest__meta{display:block;color:var(--ck-muted);font-size:12.5px}
.ck .ck-suggest__all{margin-top:var(--ck-space-1);border-top:1px solid var(--ck-line)}
.ck .ck-suggest__all .ck-suggest__title{color:var(--ck-blue-text-deep)}   /* AA on white and on the chosen row's light ground */
/* Country Profiles' /search (pages/search.php): the Knowledge Hub's results under their own heading, after Country Profiles' own. */
.ck .cp-hub{margin:var(--ck-space-7) 0 var(--ck-space-6)}
.ck .cp-hub__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--ck-space-2) var(--ck-space-5);
  margin:0 0 var(--ck-space-5);padding:0 0 var(--ck-space-3);border-bottom:3px solid var(--ck-navy)}
.ck .cp-hub__title{margin:0;color:var(--ck-navy);font:700 clamp(1.5rem,1.3rem + .8vw,2rem)/1.2 var(--ck-font-head)}
.ck .cp-hub__sum{margin:0;color:var(--ck-muted);font-size:15px}
.ck .cp-hub__sum a,.ck .cp-hub__more a{color:var(--ck-blue-text);font-weight:600}
.ck .cp-hub__group{margin:0 0 var(--ck-space-6)}
.ck .cp-hub__kind{margin:0 0 var(--ck-space-3);color:var(--ck-navy);font:600 1.25rem/1.3 var(--ck-font-head)}
.ck .cp-hub__count{color:var(--ck-muted);font:500 .8em var(--ck-font-body)}
.ck .cp-hub__hit{display:block}
.ck .cp-hub__link{color:var(--ck-navy);font-weight:600;overflow-wrap:anywhere}
.ck .cp-hub__away{display:inline-block;margin-left:4px;font-size:.8em;text-decoration:none}
.ck .cp-hub__meta{display:block;margin:2px 0 0;color:var(--ck-muted);font-size:14px}
.ck .cp-hub__text{margin:4px 0 0;max-width:52rem;color:var(--ck-text);font-size:14.5px;line-height:1.5}
.ck .cp-hub__more{margin:var(--ck-space-3) 0 0}
.ck .cp-hub__note{margin:0 0 var(--ck-space-5);padding:var(--ck-space-4) var(--ck-space-5);border-radius:var(--ck-radius);background:var(--ck-neutral);color:var(--ck-text)}
.ck .cp-hub__note a{color:var(--ck-blue-text-deep);font-weight:600}
.ck .cp-hub-none{margin:var(--ck-space-4) 0;color:var(--ck-muted)}
@media (max-width:900px){
  .ck-js .ck .ck-search.is-open .ck-suggest{left:0;right:0;width:auto;top:calc(100% - 2px)}
}
@media (pointer:coarse){
  .ck .ck-suggest__opt{padding-top:11px;padding-bottom:11px}
}
@media (forced-colors:active){
  .ck .ck-suggest__opt.is-active{outline:2px solid CanvasText;outline-offset:-2px}
}

/* ---------- Country Profiles in line with the Knowledge Hub 2026-10-20 ---------- */
/* Owner's Knowledge Hub decisions of 2026-10-19/20, on Country Profiles' pages under the kit (body.v5.ck; the 'v5' look
   is untouched):
   - no visible breadcrumb: the page's first block starts a little lower instead, and where the trail was the way up to a
     parent the menus do not reach in one step, a small "← Back to …" (partials/back_link.php: .cp-back);
   - a news article in the Hub's article layout (pages/news_article_kit.php with hub.css and hub-article.js): here only
     what Country Profiles adds — the warning of an unconfirmed item, the summary as the text (its first paragraph is the
     standfirst), "Why it matters", the official source — and Top and Share kept clear of the "Suggest a correction" button (.fbk-launch);
   - the glossary in the Hub glossary's balanced palette: navy names, a light-blue row on hover, the term a link leads
     to (:target) with a blue rule down its side on light blue; orange only for focus rings;
   - section headings as on the Hub (.hub-group .hub-section-title): the navy heading over a blue rule, where Country
     Profiles drew a navy rule under a navy heading (.module > h2 on the methodology, FAQs, about and country pages; .sh)
     and an orange one under each region of the jurisdictions list (--gold is the kit's orange). */
body.v5.ck main > .container:first-child,body.v5.ck main > .wrap:first-child{padding-top:var(--ck-space-5)}
body.v5.ck main > .container:first-child > h1:first-child{margin-top:0}
.ck .cp-back{margin:0 0 var(--ck-space-3);font-size:14px;line-height:1.4}
.ck .cp-back__link{display:inline-flex;align-items:center;gap:6px;color:var(--ck-blue-text);font-weight:600;text-decoration:none}
.ck .cp-back__link:hover{color:var(--ck-navy);text-decoration:underline}
.ck .cp-back__arrow{transition:transform var(--ck-dur) ease}
.ck .cp-back__link:hover .cp-back__arrow{transform:translateX(-3px)}
@media (pointer:coarse){
  .ck .cp-back__link{min-height:44px}
}

/* The news article */
.ck .cp-news__warn{margin:0 0 var(--ck-space-4);padding:var(--ck-space-3) var(--ck-space-4);border-radius:var(--ck-radius-sm);font-size:15px;line-height:1.5}
.ck .cp-news__summary{margin:0 0 var(--ck-space-5)}
.ck .cp-news__summary > :first-child{margin-top:0}
.ck .cp-news__summary > :last-child{margin-bottom:0}
.ck .cp-news__why{margin:0 0 var(--ck-space-5);padding:var(--ck-space-4) var(--ck-space-5);background:var(--ck-light);border:1px solid var(--ck-line);
  border-left:3px solid var(--ck-blue);border-radius:var(--ck-radius);--ck-blue-text:var(--ck-blue-text-deep)}
.ck .cp-news__why h2{margin:0 0 var(--ck-space-2);color:var(--ck-navy);font-size:1.3rem}
.ck .cp-news__why .rich-text > :last-child{margin-bottom:0}
.ck .cp-news__source{margin:0 0 var(--ck-space-5)}
.ck .cp-news__nosource{margin:0 0 var(--ck-space-5);color:var(--ck-muted)}
body.v5.ck .hub-float{bottom:calc(max(var(--ck-space-5),env(safe-area-inset-bottom)) + 56px)}
@media (max-width:640px){
  body.v5.ck .hub-float{bottom:calc(max(12px,env(safe-area-inset-bottom)) + 60px)}
}
@media print{
  body.v5.ck .fbk-launch,body.v5.ck .meter-overlay{display:none !important}
  .ck .cp-news__warn{border:1px solid currentColor;background:none}
  .ck .cp-news__why{padding:0;background:none;border:0}
  .ck .cp-news__source a{color:inherit;text-decoration:underline}
  .ck .cp-news__source a::after{content:" (" attr(href) ")";font-size:9pt}
}

/* Section headings: a blue rule, as the Hub's */
body.v5.ck .module > h2,body.v5.ck .sh{border-bottom-color:var(--ck-blue)}
body.v5.ck .region-title{border-bottom-color:var(--ck-blue)}

/* The glossary */
.ck .cp-glossary .glossary-list{max-width:54rem;margin:var(--ck-space-5) 0 0;border-top:1px solid var(--ck-line)}
.ck .cp-glossary .glossary-entry{padding:var(--ck-space-3) var(--ck-space-4);border-bottom:1px solid var(--ck-line);border-left:3px solid transparent;
  scroll-margin-top:calc(var(--ck-sticky-top) + var(--ck-space-4));transition:background-color var(--ck-dur) ease,border-color var(--ck-dur) ease}
.ck .cp-glossary .glossary-entry:hover{background:var(--ck-light)}
.ck .cp-glossary .glossary-entry:has(dt:target){background:var(--ck-light);border-left-color:var(--ck-blue)}
.ck .cp-glossary .glossary-list dt{margin:0;color:var(--ck-navy);font:600 1.2rem/1.3 var(--ck-font-head);scroll-margin-top:calc(var(--ck-sticky-top) + var(--ck-space-5))}
.ck .cp-glossary .glossary-list dd{margin:var(--ck-space-1) 0 0;color:var(--ck-text);line-height:1.65}
.ck .cp-glossary :focus-visible{outline:2px solid var(--ck-navy);outline-offset:3px;box-shadow:0 0 0 3px var(--ck-orange)}
@media (prefers-reduced-motion:reduce){
  .ck .cp-back__arrow,.ck .cp-glossary .glossary-entry{transition:none}
  .ck .cp-back__link:hover .cp-back__arrow{transform:none}
}

/* ---------- Jurisdictions page 2026-10-20 ---------- */
/* Owner's requests of 2026-10-20 for /countries under the kit (pages/countries_kit.php, cp-jurisdictions.js; the 'v5' page
   is untouched):
   - beside the globe (.gl--cp-sum), the coverage summary (.cp-cov): the counts as tiles (__nums), the freshness legend,
     "How we build profiles"; the line on how to use the globe, smaller;
   - "Browse by region" (.cp-jur): four boxes 4 across on wide screens, 2 on tablets, 1 on phones. The whole box is
     the one control (.cp-jur__btn: a link to its list without JavaScript, a button with it — no "Show / Hide the list"
     or "Close" text, only the chevron __chev, which turns when open); the open box is marked (.is-open: navy border,
     orange top, a notch on wide screens). The lists (__panel) sit below the row. Without JavaScript every list is shown
     under its region's heading (__region); html.ck-js (crcgs-early.js, before the page is drawn) hides the lists from
     the first frame unless one is the address's #target, so a list stays reachable if cp-jurisdictions.js never
     arrives, and takes the region's heading off the screen (an open list does not repeat its region's name; screen
     readers keep it). Once the script runs (.is-enhanced) one list is open at a time (the hidden attribute). */
.ck .gl--cp-sum .gl__title{margin-bottom:var(--ck-space-3)}
.ck .gl--cp-sum .gl__intro{margin:0 0 var(--ck-space-3);font-size:14px;line-height:1.5}
.ck .cp-cov{margin:0 0 var(--ck-space-4);container-type:inline-size}
.ck .cp-cov__nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ck-space-2);margin:0 0 var(--ck-space-4);padding:0}
@container (min-width:440px){
  .ck .cp-cov__nums{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
}
.ck .cp-cov__num{display:flex;flex-direction:column-reverse;justify-content:flex-end;margin:0;padding:var(--ck-space-3);background:var(--ck-light);
  border-top:3px solid var(--ck-blue);border-radius:var(--ck-radius-sm)}
.ck .cp-cov__num dt{margin:2px 0 0;color:var(--ck-muted);font:600 13px/1.3 var(--ck-font-body)}
.ck .cp-cov__num dd{margin:0;color:var(--ck-navy);font:700 1.9rem/1.1 var(--ck-font-head);font-variant-numeric:tabular-nums}
.ck .cp-cov__more{margin:0}
@media (pointer:coarse){
  .ck .cp-cov__more .ck-link,.ck .gl--cp-sum .gl__browse{display:inline-flex;align-items:center;min-height:44px}
}

.ck .cp-jur{margin:var(--ck-space-6) 0 var(--ck-space-7);scroll-margin-top:calc(var(--ck-sticky-top) + var(--ck-space-4))}
.ck .cp-jur__title{margin:0 0 var(--ck-space-4);color:var(--ck-navy);font:700 clamp(1.4rem,1.25rem + .6vw,1.75rem)/1.25 var(--ck-font-head)}
.ck .cp-jur__boxes{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--ck-space-4);margin:0;padding:0;list-style:none}
@media (min-width:600px){
  .ck .cp-jur__boxes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1024px){
  .ck .cp-jur__boxes{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.ck .cp-jur__box{position:relative;display:flex;margin:0}
/* The box itself is the control: a link (no JavaScript) or a button, filling its cell; the hand cursor is the kit's. */
.ck .cp-jur__btn{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:var(--ck-space-3);width:100%;min-height:44px;margin:0;
  padding:var(--ck-space-5) calc(var(--ck-space-5) + 28px) var(--ck-space-5) var(--ck-space-5);background:var(--ck-white);border:1px solid var(--ck-line);
  border-top:4px solid var(--ck-blue);border-radius:var(--ck-radius);box-shadow:var(--ck-shadow);color:var(--ck-text);font:inherit;text-align:left;
  text-decoration:none;transition:border-color var(--ck-dur) ease,box-shadow var(--ck-dur) ease}
.ck .cp-jur__btn:hover{border-color:var(--ck-line-strong);border-top-color:var(--ck-blue);box-shadow:var(--ck-shadow-lg);color:var(--ck-text)}
.ck .cp-jur__name{display:block;color:var(--ck-navy);font:700 1.3rem/1.25 var(--ck-font-head)}
.ck .cp-jur__facts{display:flex;flex-wrap:wrap;gap:var(--ck-space-1) var(--ck-space-5);color:var(--ck-muted);font-size:15px;line-height:1.4}
.ck .cp-jur__fact strong{display:block;color:var(--ck-navy);font:700 1.75rem/1.1 var(--ck-font-head);font-variant-numeric:tabular-nums}
/* The chevron (decoration: the button says expanded or not) in the box's top right corner; it turns when the list is open. */
.ck .cp-jur__chev{position:absolute;top:calc(var(--ck-space-5) + 6px);right:var(--ck-space-5);width:10px;height:10px;border-right:2px solid var(--ck-navy);
  border-bottom:2px solid var(--ck-navy);transform:rotate(45deg);transition:transform var(--ck-dur) ease}
.ck .cp-jur__btn[aria-expanded="true"] .cp-jur__chev{top:calc(var(--ck-space-5) + 11px);transform:rotate(-135deg)}
.ck .cp-jur__box.is-open .cp-jur__btn{border-color:var(--ck-navy);border-top-color:var(--ck-orange);box-shadow:var(--ck-shadow-lg)}
@media (min-width:1024px){
  /* A notch under the open box, pointing at its list below the row */
  .ck .cp-jur__box.is-open::after{content:"";position:absolute;left:50%;bottom:-10px;width:18px;height:18px;margin-left:-9px;background:var(--ck-white);
    border-right:1px solid var(--ck-navy);border-bottom:1px solid var(--ck-navy);transform:rotate(45deg)}
}

.ck .cp-jur__panels{margin-top:var(--ck-space-6)}
.ck .cp-jur__panel{margin:0 0 var(--ck-space-6);scroll-margin-top:calc(var(--ck-sticky-top) + var(--ck-space-4))}
.ck .cp-jur__panel[hidden]{display:none}
.ck-js .ck .cp-jur:not(.is-enhanced) .cp-jur__panel:not(:target){display:none}
/* With JavaScript the open list does not repeat its region's name (its box says it): off the screen, kept for screen readers. */
.ck-js .ck .cp-jur__region{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ck .cp-jur.is-enhanced .cp-jur__panel{padding:var(--ck-space-5);background:var(--ck-neutral);border:1px solid var(--ck-line);border-radius:var(--ck-radius);
  --ck-blue-text:var(--ck-blue-text-deep)}
.ck .cp-jur__group{margin:var(--ck-space-5) 0 0;color:var(--ck-navy);font:600 1.05rem/1.3 var(--ck-font-body)}
.ck .cp-jur.is-enhanced .cp-jur__group:first-of-type{margin-top:0}
.ck .cp-jur__group + .country-grid{margin-top:var(--ck-space-3)}
.ck .cp-jur.is-enhanced .cp-jur__region + .country-grid{margin-top:0}
@media (prefers-reduced-motion:reduce){
  .ck .cp-jur__btn,.ck .cp-jur__chev{transition:none}
}
@media (forced-colors:active){
  .ck .cp-jur__box.is-open .cp-jur__btn{outline:3px solid CanvasText;outline-offset:-1px}
  .ck .cp-jur__chev{border-color:CanvasText}
}
@media print{
  .ck .cp-jur__panel[hidden],.ck-js .ck .cp-jur:not(.is-enhanced) .cp-jur__panel:not(:target){display:block}
  .ck-js .ck .cp-jur__region{position:static;width:auto;height:auto;margin:var(--ck-space-5) 0 0;overflow:visible;clip:auto;white-space:normal}
  .ck .cp-jur__chev{display:none}
}

/* ---------- News Details 2026-10-20 ---------- */
/* Owner's decision of 2026-10-20 (migration 048), Country Profiles' news article under the kit (pages/news_article_kit.php):
   the large line under the title is the Summary an editor wrote, and only that; the item's Details are the text the
   progress line follows. .cp-news__details takes the place of .cp-news__summary above, which no view uses any more. */
.ck .cp-news__details{margin:0 0 var(--ck-space-5)}
.ck .cp-news__details > :first-child{margin-top:0}
.ck .cp-news__details > :last-child{margin-bottom:0}


/* ---------- Tiers removed 2026-10-27 ---------- */
/* The Jurisdictions page has no deep / baseline definitions any more: beside the globe come the four numbers, then the
   freshness legend (app.css .fr-legend, the one palette) with its heading. "Last updated" is a date, so its figure is
   smaller than the counts. */
.ck .cp-cov__legend-title{margin:0 0 var(--ck-space-2);color:var(--ck-navy);font-weight:600;font-size:15px;line-height:1.4}
.ck .cp-cov .fr-legend{margin:0 0 var(--ck-space-3)}
.ck .cp-cov .fr-legend .fr-chip{color:var(--ck-text)}
.ck .cp-cov__num:last-child dd{font-size:1.15rem;line-height:1.3}
.ck .country-card .fr-chip{color:var(--ck-muted);font-size:13px}

/* ---------- Small fixes 2026-10-27 ---------- */
/* A row of tabs that scrolls sideways on a narrow screen (a country page's tabs; the site's menu row) says so:
   scroll-hint.js puts is-more-start / is-more-end on the wrapper while items are out of sight on that side;
   the soft fade and small arrow are drawn here, as decoration only (no text, pointer-events none). */
.ck [data-scroll-hint]{position:relative;--ck-hint-bg:var(--ck-white)}
.ck .ptabs[data-scroll-hint]{--ck-hint-bg:var(--paper,var(--ck-white))}
.ck .ck-subnav__scroll{--ck-hint-bg:var(--ck-light);flex:1 1 auto;min-width:0}
.ck [data-scroll-hint]::before,.ck [data-scroll-hint]::after{content:"";position:absolute;top:0;bottom:0;width:44px;z-index:2;pointer-events:none;opacity:0;
  background-repeat:no-repeat;background-size:auto,16px 16px;transition:opacity var(--ck-dur) ease}
.ck [data-scroll-hint]::before{left:0;background-image:linear-gradient(to right,var(--ck-hint-bg) 25%,transparent),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2303045E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 3 5 8l5 5'/%3E%3C/svg%3E");
  background-position:0 0,6px center}
.ck [data-scroll-hint]::after{right:0;background-image:linear-gradient(to left,var(--ck-hint-bg) 25%,transparent),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2303045E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 3 5 5-5 5'/%3E%3C/svg%3E");
  background-position:0 0,right 6px center}
.ck [data-scroll-hint].is-more-start::before,.ck [data-scroll-hint].is-more-end::after{opacity:1}
@media (prefers-reduced-motion:reduce){
  .ck [data-scroll-hint]::before,.ck [data-scroll-hint]::after{transition:none}
}

/* ---------- CRCGS Weekly 2026-10-27 ---------- */
/* The section tick-boxes of the CRCGS Weekly sign-up (partials/newsletter_sections: both sites' forms, the preferences page, Account
   Settings). Kit tokens only. One column; each box is a large tap target with its name and a one-line hint. */
.nl-sections{flex:1 1 100%;min-width:0;margin:0 0 var(--ck-space-4);padding:0;border:0}
.nl-sections__legend{margin:0 0 var(--ck-space-2);padding:0;font-weight:600;color:var(--ck-text)}
.nl-sections__item{display:flex;align-items:flex-start;gap:var(--ck-space-3);padding:var(--ck-space-2) 0;color:var(--ck-text);cursor:pointer}
.nl-sections__item input{flex:0 0 auto;width:20px;height:20px;margin:2px 0 0;accent-color:var(--ck-navy)}
.nl-sections__text{display:flex;flex-direction:column;min-width:0}
.nl-sections__name{font-weight:600}
.nl-sections__hint{font-size:.875rem;color:var(--ck-muted)}
.nl-sections__item:focus-within{outline:2px solid var(--ck-navy);outline-offset:2px;border-radius:var(--ck-radius)}
.nl-form-hint{flex:1 1 100%;margin:var(--ck-space-2) 0 0;font-size:.875rem;color:var(--ck-muted)}
.nl-prefs{max-width:42rem}
.nl-prefs__form{margin:var(--ck-space-4) 0}
.nl-prefs__off{margin-top:var(--ck-space-5)}
.ck-section--navy .nl-sections__legend,.ck-section--navy .nl-sections__item,.ck-section--navy .nl-sections__hint,.ck-section--navy .nl-form-hint{color:var(--ck-on-navy)}
.account-section .nl-sections{margin:var(--ck-space-3) 0}
@media (min-width:60em){
  .hh-nl__form .nl-sections{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--ck-space-5)}
  .hh-nl__form .nl-sections__legend{grid-column:1 / -1}
}