.elementor-kit-4{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-4 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --navy:#082264; --deep-navy:#052168; --royal:#0D369E; --green:#15871D; --gold:#FFCB49; --gold-ink:#7A5600; --tint-navy:#DADFF0; --tint-green:#D3EDD5; --tint-gold:#FFEFC4; --ink:#1A1A1A; --ink-soft:#4A5068; --paper:#FFFFFF; --paper-2:#F4F6FA; --font-main:Arimo; }
/* Start custom CSS *//* SLR-V2 START: phone menu and shared v2 widget styles */
/* Buttons with an arrow in a circle. Add the class slr-btn to a Button widget
   (Advanced → CSS Classes); slr-btn--gold or slr-btn--light change the arrow colours. */
.slr-btn .elementor-button { transition: background-color .2s, color .2s, border-color .2s, transform .2s; }
.slr-btn .elementor-button:hover { transform: translateY(-2px); }
.slr-btn .elementor-button-content-wrapper { align-items: center; }
.slr-btn .elementor-button-icon { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--slr-arrow-bg, #082264); transition: background-color .2s, transform .2s; }
.slr-btn .elementor-button-icon svg { width: 13px; height: 13px; fill: var(--slr-arrow-fg, #fff); }
.slr-btn .elementor-button-icon i { font-size: 13px; color: var(--slr-arrow-fg, #fff); }
.slr-btn .elementor-button:hover .elementor-button-icon { --slr-arrow-bg: #fff; --slr-arrow-fg: #082264; transform: translateX(3px); }
.slr-btn--gold .elementor-button:hover .elementor-button-icon { --slr-arrow-bg: #082264; --slr-arrow-fg: #fff; }
.slr-btn--light .elementor-button-icon { --slr-arrow-bg: #fff; --slr-arrow-fg: #082264; }
.slr-btn--light .elementor-button:hover .elementor-button-icon { --slr-arrow-bg: #082264; --slr-arrow-fg: #fff; }

/* "Popular with visitors" cards: lift on hover, arrow slides */
.slr-card { transition: transform .2s, box-shadow .2s; text-decoration: none; }
.slr-card:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgb(5 33 104 / .08), 0 16px 36px rgb(5 33 104 / .14) !important; }
.slr-card .elementor-icon { transition: transform .2s; }
.slr-card:hover .elementor-icon { transform: translateX(3px); }

/* Figures strip: thin dividers between the numbers */
.slr-stats > .elementor-widget-counter + .elementor-widget-counter { border-left: 1px solid rgb(255 255 255 / .12); }
@media (max-width: 1024px) { .slr-stats > .elementor-widget-counter:nth-child(3) { border-left: 0; } .slr-stats > .elementor-widget-counter:nth-child(-n+2) { border-bottom: 1px solid rgb(255 255 255 / .12); } }
.slr-stats .elementor-counter-number-wrapper { flex-wrap: nowrap !important; justify-content: flex-start !important; white-space: nowrap; }
.slr-stats .elementor-counter-number-prefix, .slr-stats .elementor-counter-number-suffix { flex-grow: 0 !important; white-space: pre !important; }

/* News cards (Posts widget, Cards skin): date above the title, outlined "Read more" pill */
.slr-news .elementor-post__card { display: flex; flex-direction: column; }
.slr-news .elementor-post__thumbnail__link { order: 0; }
.slr-news .elementor-post__meta-data { order: 1; border-top: 0 !important; padding: 24px 24px 0 !important; }
.slr-news .elementor-post__text { order: 2; display: flex; flex-direction: column; flex-grow: 1; margin-top: 8px; }
.slr-news .elementor-post__excerpt { flex-grow: 1; }
.slr-news .elementor-post__thumbnail img { transition: transform .4s ease; }
.slr-news .elementor-post:hover .elementor-post__thumbnail img { transform: scale(1.03); }
.slr-news .elementor-post:hover .elementor-post__title a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 2px; }
.slr-news .elementor-post__read-more { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; padding: 8px 18px; border: 2px solid #082264; border-radius: 999px; transition: background-color .2s, color .2s; }
.slr-news .elementor-post__read-more::after { content: "→"; transition: transform .2s; }
.slr-news .elementor-post:hover .elementor-post__read-more { background: #082264; color: #fff !important; }
.slr-news .elementor-post:hover .elementor-post__read-more::after { transform: translateX(3px); }

/* Hero slider: round arrows, gold active dot */
.slr-hero .elementor-swiper-button { width: 48px; height: 48px; border: 2px solid #fff; border-radius: 50%; display: grid; place-items: center; color: #fff; transition: background-color .2s, color .2s; }
.slr-hero .elementor-swiper-button svg { width: 18px; height: 18px; fill: currentColor; }
.slr-hero .elementor-swiper-button:hover { background: #fff; color: #082264; }
.slr-hero .swiper-pagination-bullet { background: #fff; opacity: .5; width: 10px; height: 10px; transition: width .3s, background-color .3s; }
.slr-hero .swiper-pagination-bullet-active { background: #ffcb49; opacity: 1; width: 32px; border-radius: 5px; }
@media (max-width: 767px) { .slr-hero .elementor-swiper-button { display: none !important; } }

/* Desktop mega menu links: grey row + green title on hover */
.slr-mlink { transition: background-color .2s; }
.slr-mlink:hover { background-color: #f4f6fa; }
.slr-mlink .elementor-icon { transition: transform .2s; }
.slr-mlink:hover .elementor-icon { transform: scale(1.06); }
.slr-help a { color: #082264; font-weight: 600; }
.slr-help a:hover { color: #15871d; }

/* Mega menu link grid: rows hug their content */
.slr-mgrid { align-content: start; }

/* Phone menu panel: frosted blur behind the see-through blue */
.slr-mmenu-popup .dialog-widget-content { -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }

/* Phone menu button (opens the full-screen popup) */
.slr-burger .elementor-icon { transition: background-color .2s, color .2s; }

/* Full-screen phone menu (popup): numbered items, faint lines, round gold toggles */
.slr-mmenu-nav .elementor-nav-menu { counter-reset: slr; }
.slr-mmenu-nav .elementor-nav-menu > li { border-bottom: 1px solid rgb(255 255 255 / .14); counter-increment: slr; }
.slr-mmenu-nav .elementor-nav-menu > li > a { display: flex; align-items: center; gap: 14px; font-weight: 800; }
.slr-mmenu-nav .elementor-nav-menu > li > a::before { content: counter(slr, decimal-leading-zero) !important; position: static !important; display: inline-block !important; opacity: 1 !important; transform: none !important; background: none !important; width: auto !important; height: auto !important; min-width: 28px; font-size: 13px; font-weight: 700; letter-spacing: .06em; color: #ffcb49; }
.slr-mmenu-nav .sub-arrow { margin-left: auto; width: 44px; height: 44px; border: 1.5px solid rgb(255 255 255 / .35); border-radius: 50%; display: grid !important; place-items: center; color: #ffcb49; padding: 0 !important; transition: background-color .2s, color .2s, transform .2s; }
.slr-mmenu-nav .sub-arrow svg, .slr-mmenu-nav .sub-arrow i { width: 16px; height: 16px; font-size: 16px; fill: currentColor; }
.slr-mmenu-nav a.highlighted .sub-arrow { background: #ffcb49; border-color: #ffcb49; color: #082264; }
.slr-mmenu-nav .sub-menu { position: static !important; left: auto !important; top: auto !important; margin: 0 !important; width: auto !important; min-width: 0 !important; max-width: none !important; box-shadow: none !important; border: 0 !important; background: transparent !important; padding: 0 0 12px 42px !important; }
.slr-mmenu-nav .sub-menu a { white-space: normal !important; }
.slr-mmenu-nav .sub-menu li + li { border-top: 1px solid rgb(255 255 255 / .1); }
.slr-mmenu-nav .sub-menu a { border-left: 0 !important; }
.slr-mmenu-popup .dialog-close-button { width: 48px; height: 48px; border: 2px solid rgb(255 255 255 / .6); border-radius: 50%; display: grid; place-items: center; transition: background-color .2s; }
.slr-mmenu-popup .dialog-close-button:hover { background: #fff; }
.slr-mmenu-popup .dialog-close-button:hover svg, .slr-mmenu-popup .dialog-close-button:hover i { fill: #082264; color: #082264; }

/* Keyboard focus ring everywhere on the new design */
.slr-mmenu a:focus-visible, .slr-mega a:focus-visible, .slr-btn a:focus-visible, .slr-card:focus-visible { outline: 3px solid #ffcb49; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .slr-btn .elementor-button, .slr-card, .slr-news .elementor-post__thumbnail img, .slr-mlink .elementor-icon { transition: none; }
}

/* Text blocks in the new design: no extra space under the last paragraph */
.slr-text p:last-child { margin-bottom: 0; }

/* Long text on inner pages and news posts (text blocks get slr-prose) */
.slr-prose ul, .slr-prose ol { padding-left: 1.25em; }
.slr-prose li { margin-bottom: .5em; }
.slr-prose strong { color: #082264; }
.slr-prose a { color: #0d369e; text-decoration: underline; text-underline-offset: 2px; }
.slr-prose a:hover { color: #15871d; }
/* Contact page map: rounded corners */
.slr-map iframe { border-radius: 16px; }

/* Single news post: the "More news" band hides itself until there is another post to show */
.slr-morenews:not(:has(.elementor-post)) { display: none; }

/* SLR-V2 END */
/* MDA-ATOMIC START: managed by kit-v2/atomic/kit-css.php */
/* Header: the thin top bar scrolls away, the white bar with logo and menu stays at the top. */
.elementor-location-header { position: sticky; top: -44px; z-index: 50; }
.admin-bar .elementor-location-header { top: -12px; }
@media (max-width: 782px) { .admin-bar .elementor-location-header { top: 2px; } }
/* Small laptops (1025–1279px): the full menu no longer fits beside the logo, so show the menu button instead. */
@media (min-width: 1025px) and (max-width: 1279px) {
	.elementor-location-header .hide-tablet:has(.elementor-widget-nav-menu, .elementor-widget-mega-menu) { display: none; }
	.elementor-location-header a.menu-button { display: flex; }
}
/* Bullet lists inside Atomic text */
.text-list ul, .text-list ol { margin: 0; padding-left: 1.25em; }
.text-list li + li { margin-top: 0.5em; }
/* Bullet points as green tick circles */
.text-list ul { list-style: none; padding-left: 0; }
.text-list ul li { position: relative; padding-left: 32px; }
.text-list ul li::before { content: ""; position: absolute; left: 0; top: 0.25em; width: 20px; height: 20px; border-radius: 50%; background: #15871D url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 5l3.5 3.5L11 1.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat; }
/* Article body on single news posts */
.elementor-widget-theme-post-content p { margin: 0 0 1.1em; }
.elementor-widget-theme-post-content a { color: #0d369e; text-decoration: underline; text-underline-offset: 2px; }
/* Page edges: one side margin that grows with the screen (16px on phones → 40px on laptops) for the header, every
   section and the footer, so content never jumps from 120px to 24px when the window narrows. */
:root { --mda-gutter: clamp(16px, 4vw, 40px); --mda-edge: max(var(--mda-gutter), calc((100% - 1200px) / 2)); }
body .e-con.e-con:has(> .container) { padding-left: var(--mda-gutter); padding-right: var(--mda-gutter); }
body .e-con.section { padding-top: clamp(56px, 7vw, 88px); padding-bottom: clamp(56px, 7vw, 88px); }
/* Homepage slider: text lines up with the logo, the photo shows through a soft fade, dots and arrows sit on the photo. */
.slr-hero .swiper-slide > .e-con { --content-width: 1200px !important; --padding-left: var(--mda-gutter) !important; --padding-right: var(--mda-gutter) !important; }
.slr-hero .swiper-slide > .e-con::before { background-image: linear-gradient(90deg, rgba(6, 24, 72, 0.82) 0%, rgba(6, 24, 72, 0.55) 42%, rgba(6, 24, 72, 0.05) 78%), linear-gradient(0deg, rgba(6, 24, 72, 0.5) 0%, rgba(6, 24, 72, 0) 30%) !important; background-color: transparent !important; opacity: 1 !important; }
.slr-hero .swiper-slide .elementor-heading-title, .slr-hero .swiper-slide .slr-text { text-shadow: 0 1px 16px rgba(4, 16, 48, 0.35); }
.slr-hero .swiper-pagination { position: absolute !important; top: auto !important; bottom: 46px !important; left: var(--mda-edge) !important; width: auto !important; transform: none !important; text-align: left; line-height: 0; }
.slr-hero .elementor-swiper-button { top: auto !important; bottom: 28px !important; transform: none !important; display: grid; place-items: center; width: 52px; height: 52px; border: 2px solid rgba(255, 255, 255, 0.8) !important; border-radius: 50%; background: rgba(255, 255, 255, 0.12); backdrop-filter: blur(6px); color: #fff; }
.slr-hero .elementor-swiper-button svg { width: 18px; height: 18px; fill: #fff !important; }
.slr-hero .elementor-swiper-button:hover { background: #fff; }
.slr-hero .elementor-swiper-button:hover svg { fill: #082264 !important; }
.slr-hero .elementor-swiper-button-prev { left: auto !important; right: calc(var(--mda-edge) + 64px) !important; }
.slr-hero .elementor-swiper-button-next { right: var(--mda-edge) !important; }
/* Type: Helvetica on devices that have it (Mac, iPhone, iPad); Arimo, its free twin loaded from Google, everywhere else.
   Icons (<i>, svg) keep their own font. */
body, body :where(h1, h2, h3, h4, h5, h6, p, a, span, li, label, input, textarea, select, button, div, strong, em, b) { font-family: "Helvetica Neue", Helvetica, Arimo, Arial, sans-serif !important; }
/* Paragraph rhythm: the space between two paragraphs is clearly bigger than the space between lines (about 22px
   against 10px), so a new paragraph reads as a new paragraph. */
body .elementor :is(.text-body, .text-lead, .text-list) + :is(.text-body, .text-lead, .text-list) { margin-top: 8px; }
/* Reduce motion (an accessibility setting on phones and computers): show content at once, without the fade-in. */
@media (prefers-reduced-motion: reduce) { [data-interactions], [data-interaction-id] { opacity: 1 !important; transform: none !important; } }
/* Dash-dot ornament under centred section titles */
.ornament { background: linear-gradient(#C3CBE0, #C3CBE0) left center / 24px 2px no-repeat, linear-gradient(#C3CBE0, #C3CBE0) right center / 24px 2px no-repeat, radial-gradient(circle, #FFCB49 3.5px, transparent 4px) center / 8px 8px no-repeat, radial-gradient(circle, #C3CBE0 2.5px, transparent 3px) calc(50% - 15px) center / 8px 8px no-repeat, radial-gradient(circle, #C3CBE0 2.5px, transparent 3px) calc(50% + 15px) center / 8px 8px no-repeat; }
/* Quiet depth: soft rings in the top-right corner and a small dot grid in the bottom-left of tinted and navy sections. */
body .section.section-tint, body .section.section-navy { position: relative; overflow: hidden; isolation: isolate; }
body .section.section-tint::before, body .section.section-navy::before { content: ""; position: absolute; z-index: -1; top: -180px !important; right: -180px !important; left: auto !important; bottom: auto !important; width: 520px; height: 520px; pointer-events: none; background: repeating-radial-gradient(circle, transparent 0 34px, rgba(8, 34, 100, 0.07) 34px 36px); -webkit-mask-image: radial-gradient(circle, #000 30%, transparent 70%); mask-image: radial-gradient(circle, #000 30%, transparent 70%); }
body .section.section-tint::after, body .section.section-navy::after { content: ""; position: absolute; z-index: -1; bottom: 32px; left: 24px; width: 200px; height: 140px; pointer-events: none; background: radial-gradient(rgba(8, 34, 100, 0.16) 1.6px, transparent 2px) 0 0 / 18px 18px; -webkit-mask-image: linear-gradient(45deg, #000 20%, transparent 85%); mask-image: linear-gradient(45deg, #000 20%, transparent 85%); }
body .section.section-navy::before { background: repeating-radial-gradient(circle, transparent 0 34px, rgba(255, 255, 255, 0.07) 34px 36px); }
body .section.section-navy::after { background: radial-gradient(rgba(255, 203, 73, 0.35) 1.6px, transparent 2px) 0 0 / 18px 18px; }
/* Taller homepage slider; the dots become thin progress lines that fill in time with each slide. */
.slr-hero .swiper-slide > .e-con { --min-height: clamp(560px, 82vh, 820px) !important; min-height: clamp(560px, 82vh, 820px) !important; }
.slr-hero .swiper-pagination-bullet { position: relative; width: 56px !important; height: 3px !important; margin: 0 10px 0 0 !important; border-radius: 2px !important; background: rgba(255, 255, 255, 0.35) !important; opacity: 1 !important; overflow: hidden; }
.slr-hero .swiper-pagination-bullet-active { width: 56px !important; background: rgba(255, 255, 255, 0.35) !important; }
.slr-hero .swiper-pagination-bullet-active::after { content: ""; position: absolute; inset: 0; background: #FFCB49; transform-origin: left; animation: mda-progress 6s linear forwards; }
@keyframes mda-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .slr-hero .swiper-pagination-bullet-active::after { animation: none; } }
/* Photo collage: a gold block peeks out behind the photos */
.collage::before { content: ""; position: absolute; z-index: 0; left: -20px; bottom: -20px; width: 45%; height: 45%; border-radius: 20px; background: #FFCB49; }
.collage > * { position: relative; z-index: 1; }
/* Back to top: a round gold button bottom right, which appears once the page has been scrolled. */
body .back-to-top.back-to-top { position: fixed; right: 20px; bottom: 20px; z-index: 40; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background-color: #FFCB49; color: #082264; box-shadow: 0 8px 24px rgba(5, 33, 104, 0.25); transition: transform 0.2s; }
body .back-to-top.back-to-top:hover { transform: translateY(-3px); }
#ast-scroll-top { display: none !important; }   /* the theme's own button sat on top of ours */
body .back-to-top .e-svg-base, body .back-to-top svg { width: 18px; height: 18px; padding: 0; background: none; color: #082264; fill: currentColor; }
@supports (animation-timeline: scroll()) {
	body .back-to-top.back-to-top { animation: mda-reveal linear both; animation-timeline: scroll(root); animation-range: 0 480px; }
	@keyframes mda-reveal { from { opacity: 0; visibility: hidden; } to { opacity: 1; visibility: visible; } }
}
/* Outline buttons carry a small arrow that slides on hover, so they read as buttons. */
a.btn::after { content: "→"; display: inline-block; margin-left: 10px; font-weight: 700; transition: transform 0.2s; }
a.btn:hover::after { transform: translateX(4px); }
/* Cards with a square arrow button in the corner. All start light; the one under the mouse (or keyboard focus) fills
   with Ministry blue, its text turns white, the corner turns gold and the arrow nudges right. The button keeps its
   "Read more" text for screen readers. */
body .cta-card.cta-card { padding-bottom: 100px; border-radius: 16px; background-color: #F4F6FA; box-shadow: 0 1px 2px rgba(5, 33, 104, 0.06), 0 10px 28px rgba(5, 33, 104, 0.08); transition: transform 0.3s, box-shadow 0.3s, background-color 0.3s; }
body .section-tint .cta-card.cta-card { background-color: #fff; }
body .cta-card.cta-card:is(:hover, :focus-within) { background-color: #082264; transform: translateY(-6px); box-shadow: 0 2px 4px rgba(5, 33, 104, 0.06), 0 20px 40px rgba(5, 33, 104, 0.22); }
body .cta-card :is(h3, .text-body) { transition: color 0.3s; }
body .cta-card:is(:hover, :focus-within) :is(h3, .text-body) { color: #fff; }
.cta-card .icon-badge { background-color: #DADFF0; color: #082264; transition: background-color 0.3s, color 0.3s; }
.cta-card:is(:hover, :focus-within) .icon-badge { background-color: rgba(255, 255, 255, 0.12); color: #FFCB49; }
body .cta-card > .arrow-badge, body .cta-card > a.btn { position: absolute; right: 0; bottom: 0; display: grid; place-items: center; width: 72px; height: 72px; margin: 0; padding: 26px; border: 0; border-radius: 16px 0 16px 0; background-color: #082264; color: #fff; font-size: 0; transform: none; transition: background-color 0.3s, color 0.3s; }
body .cta-card > a.btn::after { margin: 0; font-size: 24px; line-height: 1; }
body .cta-card:is(:hover, :focus-within) > .arrow-badge, body .cta-card:is(:hover, :focus-within) > a.btn { background-color: #FFCB49; color: #082264; }
.cta-card > .arrow-badge svg { transition: transform 0.25s; }
.cta-card:hover > .arrow-badge svg, .cta-card:hover > a.btn::after { transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) { body .cta-card.cta-card:hover { transform: none; } }
/* News and document lists: Elementor's loop adds 10px padding at three levels, which pushed the cards in from the page edge. */
body .e-collection-loop-base.e-con, body .e-collection-loop-base > .e-con, body .e-collection-loop-base > .e-con > .e-con { padding: 0; }
@media (max-width: 767px) {
	.slr-hero .swiper-slide > .e-con::before { background-image: linear-gradient(180deg, rgba(6, 24, 72, 0.5) 0%, rgba(6, 24, 72, 0.82) 100%) !important; }
	.slr-hero .swiper-pagination { bottom: 32px !important; }
}
/* Logo lockup (MoICE format): emblem on the left, bigger; small green "Government of Sierra Leone"; ministry name big and bold. */
.brand img { width: 72px !important; height: 72px !important; max-width: none; object-fit: contain; }
@media (max-width: 1024px) { .brand img { width: 60px !important; height: 60px !important; } }
@media (max-width: 767px) { .brand img { width: 48px !important; height: 48px !important; } }
/* Key figures count up as they scroll into view (Custom Code "MDA stat counters"); digits keep a steady width while counting. */
.stat-number { font-variant-numeric: tabular-nums; }
/* MDA-ATOMIC END *//* End custom CSS */