﻿/*

 Theme Name:   MKICA Al-Rawdha Child

 Theme URI:    https://www.mkica.org/

 Description:  Custom child theme for MKICA Al-Rawdha Mosque, Milton Keynes

 Author:       MKICA CIO

 Template:     astra

 Version:      2.0.0

 Text Domain:  mkica-child

*/

/* ============================================================

   DESIGN TOKENS

   ============================================================ */

:root {
  --g900: #0f2318;
  --g800: #1a3a28;
  --g700: #2d5a3d;
  --g600: #3a6e4a;
  --g500: #4a8a5d;
  --g200: #c8e6d0;
  --g100: #eaf4ee;
  --g50:  #f4faf6;
  --gold: #c9a84c;
  --gold-l: #e8c96a;
  --gold-bg: #fdf8ec;
  --white: #ffffff;
  --text:  #1c2a1e;
  --mid:   #4a5c50;
  --light: #7a9080;
  --border:#dce8de;
  --r: 10px;
  --shadow: 0 2px 16px rgba(15,35,24,.08);
  --shadow-lg: 0 8px 40px rgba(15,35,24,.14);
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ============================================================

   FONTS

   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Amiri:wght@400;700&display=swap');

/* ============================================================

   BASE

   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; font-size: 16px; }

body { font-family: var(--font) !important; color: var(--text); background: var(--g50) !important; line-height: 1.7; }

body.mkica-homepage::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .055;
  background-image: url("/wp-content/themes/mkica-child/assets/images/arabesque.svg");
  background-size: 120px 120px;
  pointer-events: none;
}

a { color: var(--g700); transition: color .18s; }

a:hover { color: var(--g500); }

img { max-width: 100%; height: auto; display: block; }

::selection { background: var(--g700); color: #fff; }

:focus-visible { outline: 2px solid var(--g700); outline-offset: 3px; border-radius: 4px; }

::-webkit-scrollbar { width: 5px; }

::-webkit-scrollbar-thumb { background: var(--g500); border-radius: 3px; }

/* ============================================================

   PRAYER BAR -- top of page

   ============================================================ */

#mkica-prayer-bar {
  background: var(--g900) !important;
  border-bottom: 2px solid var(--gold) !important;
  font-family: var(--font) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 99999 !important;
  color: #fff !important; /* FIX: explicit white so all children inherit */
}

.mkica-bar-inner {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 7px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 0 6px !important;
  flex-wrap: nowrap !important;       /* never wrap -- scroll instead */
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;   /* hide scrollbar on Firefox */
}

.mkica-bar-inner::-webkit-scrollbar { display: none !important; } /* hide on Chrome/Safari */

.mkica-bar-label {
  color: var(--gold) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* FIX 1: all prayer times must be white on dark bar */

.mkica-prayer { padding: 3px 9px !important; border-radius: 5px !important; white-space: nowrap !important; color: #fff !important; }

.mkica-prayer-name { font-size: 10px !important; text-transform: uppercase !important; letter-spacing: .05em !important; color: rgba(255,255,255,.6) !important; }

.mkica-prayer-time { font-size: 13px !important; font-weight: 700 !important; margin-left: 3px !important; color: #fff !important; }

.mkica-iqamah { font-size: 11px !important; color: rgba(255,255,255,.55) !important; }

.mkica-prayer.mkica-next {
  background: var(--gold) !important;
  color: var(--g900) !important;
  font-weight: 700 !important;
}

.mkica-prayer.mkica-next .mkica-prayer-name { color: rgba(15,35,24,.75) !important; }

.mkica-prayer.mkica-next .mkica-prayer-time { color: var(--g900) !important; }

.mkica-prayer.mkica-next .mkica-iqamah { color: rgba(15,35,24,.65) !important; }

.mkica-bar-link {
  margin-left: auto !important;
  color: var(--gold) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: 1px solid rgba(201,168,76,.4) !important;
  padding: 4px 10px !important;
  border-radius: 4px !important;
  white-space: nowrap !important;
  transition: background .18s !important;
}

.mkica-bar-link:hover { background: rgba(201,168,76,.15) !important; color: var(--gold-l) !important; }

/* ============================================================

   ASTRA HEADER -- centred logo, nav below

   ============================================================ */

.site-header, #masthead {
  background: var(--white) !important;
  border-bottom: 2px solid var(--border) !important;
  box-shadow: 0 2px 12px rgba(15,35,24,.06) !important;
  padding: 0 !important;
}

.site-header::before, #masthead::before { 
  content: '';
  position: absolute;
  inset: 0;
  opacity: .055;
  background-image: url("/wp-content/themes/mkica-child/assets/images/arabesque.svg");
  background-size: 120px 120px;  
}

/* Stack logo above nav by making the header bar a column */

.main-header-bar,

.ast-primary-header-bar {
  background: var(--white) !important;
  border-bottom: none !important;
  padding: 0 !important;
}

/* The Astra grid row: override left/right split +' single centred column */

.site-primary-header-wrap.ast-builder-grid-row-container,

.ast-builder-grid-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
}
.site-primary-header-wrap.ast-builder-grid-row-container.site-header-focus-item.ast-container::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: .055;
    background-image: url(/wp-content/themes/mkica-child/assets/images/arabesque.svg);
    background-size: 120px 120px;
}

/* Logo row -- centred, generous padding */

.site-header-primary-section-left,

.site-header-section-left {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  padding: 18px 24px 10px !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Nav row -- centred below logo */

.site-header-primary-section-right,

.ast-grid-right-section {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  padding: 0 24px !important;
}

.ast-builder-menu-1 { width: 100% !important; display: flex !important; justify-content: center !important; }

.main-header-bar-navigation { justify-content: center !important; }

#primary-site-navigation { justify-content: center !important; }

.ast-main-header-bar-alignment { justify-content: center !important; width: 100% !important; }

#ast-hf-menu-1.main-navigation { display: flex !important; justify-content: center !important; }

.main-header-menu { justify-content: center !important; }

/* Logo sizing -- the banner is 1170--183, wide. Show it at a readable height centred */

.mkica-logo-img {
  height: 64px !important;           /* tall enough to read both calligraphy + text */
  width: auto !important;
  max-width: min(100%, 420px) !important; /* never overflow, never over-shrink on mobile */
  object-fit: contain !important;
  display: block !important;
  background: transparent !important;
}

/* Site branding wrapper -- remove any left-alignment Astra adds */

.ast-site-identity,

.site-branding { text-align: center !important; display: flex !important; justify-content: center !important; }

/* Mobile header: also centre */

#ast-mobile-header .site-header-primary-section-left { border-bottom: none !important; padding: 14px 20px 14px !important; }

#ast-mobile-header .ast-site-identity { justify-content: flex-start !important; }

#ast-mobile-header .mkica-logo-img { height: 44px !important; max-width: 260px !important; }

/* Nav links */

/* Nav links */

.main-header-menu > .menu-item > .menu-link,

.ast-nav-menu > .menu-item > .menu-link {
  font-family: var(--font) !important;
  color: var(--text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 14px !important;
  border-radius: 6px !important;
  transition: background .18s, color .18s !important;
  position: relative !important;
}

.main-header-menu > .menu-item:hover > .menu-link,

.main-header-menu > .menu-item.current-menu-item > .menu-link {
  background: var(--g100) !important;
  color: var(--g700) !important;
}

.ast-nav-menu .sub-menu {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-top: 2px solid var(--g700) !important;
  border-radius: 0 0 8px 8px !important;
  box-shadow: var(--shadow-lg) !important;
}

.ast-nav-menu .sub-menu .menu-link { color: var(--text) !important; font-size: 13px !important; }

.ast-nav-menu .sub-menu .menu-link:hover { color: var(--g700) !important; background: var(--g100) !important; }

/* ============================================================

   HERO -- split: left text + right prayer card

   ============================================================ */

.mkica-hero {
  background: linear-gradient(160deg, var(--g900) 0%, var(--g800) 60%, #193323 100%);
  position: relative;
  overflow: hidden;
  padding: 0;
}

/* Gold bottom accent line */

.mkica-hero::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, var(--gold) 30%, var(--gold) 70%, transparent 100%);
}

/* Arabesque tile -- full-width fill behind everything */

.mkica-hero-arabesque {
  position: absolute;
  inset: 0;
  background-image: url("/wp-content/themes/mkica-child/assets/images/arabesque.svg");
  background-size: 110px 110px;
  opacity: .055;
  pointer-events: none;
}

/* Split two-column inner */

.mkica-hero-inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 48px;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 64px 40px 72px;
}

/* -- LEFT COLUMN -- */

.mkica-hero-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.mkica-hero-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
}

.mkica-hero-kicker-dot {
  display: inline-block;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--gold);
  opacity: .7;
  flex-shrink: 0;
}

.mkica-hero h1 {
  font-size: clamp(32px, 5vw, 58px) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  color: var(--white) !important;
  letter-spacing: -.03em !important;
  margin: 0 0 20px !important;
}

.mkica-hero h1 em {
  font-style: normal;
  color: var(--gold);
}

.mkica-hero-sub {
  font-size: 16px;
  color: rgba(255,255,255,.68);
  line-height: 1.7;
  max-width: 480px;
  margin: 0 0 32px;
  font-weight: 300;
}

.mkica-hero-ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.mkica-hero-charity {
  margin-top: 20px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
}

/* -- RIGHT COLUMN -- prayer card wrapper -- */

.mkica-hero-right {
  position: relative;
}

/* Curved gold arch above card */

.mkica-prayer-card-accent {
  position: absolute;
  top: -16px; left: 50%;
  transform: translateX(-50%);
  width: 80%;
  height: 20px;
  z-index: 3;
  pointer-events: none;
}

.mkica-prayer-card-accent svg {
  width: 100%; height: 100%;
  display: block;
}

/* -- THE PRAYER CARD -- */

.mkica-prayer-card {
  position: relative;
  z-index: 2;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(201,168,76,.25);
  border-top: 2px solid rgba(201,168,76,.55);
  border-radius: 14px;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}

/* Card header -- date + live clock */

.mkica-pc-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 18px 20px 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
}

.mkica-pc-head-left {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.mkica-pc-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
}

.mkica-pc-date {
  font-size: 14px;
  font-weight: 600;
  color: var(--white);
  line-height: 1.2;
}

.mkica-pc-hijri {
  font-size: 10px;
  color: rgba(255,255,255,.45);
  font-style: italic;
}

/* Live clock */

.mkica-pc-clock {
  font-size: 22px;
  font-weight: 700;
  color: var(--white);
  letter-spacing: -.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Column header row */

.mkica-pc-cols {
  display: grid;
  grid-template-columns: 1fr 72px 72px;
  padding: 7px 20px;
  background: rgba(0,0,0,.12);
  border-bottom: 1px solid rgba(255,255,255,.05);
}

.mkica-pc-cols span {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.35);
}

.mkica-pc-cols span:nth-child(2),

.mkica-pc-cols span:nth-child(3) { text-align: right; }

/* Prayer rows */

.mkica-pc-rows { padding: 4px 0; }

.mkica-pc-row {
  display: grid;
  grid-template-columns: 1fr 72px 72px;
  align-items: center;
  padding: 11px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .15s;
}

.mkica-pc-row:last-child { border-bottom: none; }

.mkica-pc-row:hover { background: rgba(255,255,255,.04); }

/* Next prayer highlight */

.mkica-pc-row--next {
  background: rgba(201,168,76,.12) !important;
  border-left: 3px solid var(--gold);
  padding-left: 17px;
}

.mkica-pc-row--next:hover { background: rgba(201,168,76,.16) !important; }

.mkica-pc-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--white);
  display: flex;
  align-items: center;
  gap: 7px;
}

.mkica-pc-next-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
  box-shadow: 0 0 6px rgba(201,168,76,.8);
  animation: mkica-pulse 2s ease-in-out infinite;
}

@keyframes mkica-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }

  50% { opacity: .6; transform: scale(1.3); }

}

.mkica-pc-badge {
  display: inline-block;
  background: var(--gold);
  color: var(--g900);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 3px;
  vertical-align: middle;
  line-height: 1.4;
}

.mkica-pc-time, .mkica-pc-iqamah {
  text-align: right;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.mkica-pc-time {
  font-weight: 700;
  color: var(--white);
}

.mkica-pc-iqamah {
  color: rgba(255,255,255,.5);
  font-size: 12px;
}

.mkica-pc-row--next .mkica-pc-time { color: var(--gold); }

.mkica-pc-row--next .mkica-pc-iqamah { color: rgba(201,168,76,.75); }

/* Unavailable state */

.mkica-pc-unavail {
  padding: 24px 20px;
  font-size: 13px;
  color: rgba(255,255,255,.4);
  text-align: center;
}

/* Card footer */

.mkica-pc-foot {
  padding: 12px 20px;
  border-top: 1px solid rgba(255,255,255,.07);
  background: rgba(0,0,0,.15);
  text-align: center;
}

.mkica-pc-foot-link {
  font-size: 12px;
  font-weight: 600;
  color: var(--gold) !important;
  text-decoration: none !important;
  letter-spacing: .02em;
  transition: color .18s;
}

.mkica-pc-foot-link:hover { color: var(--gold-l) !important; }

/* Buttons */

.mkica-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 13px 28px;
  border-radius: 7px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  transition: all .2s;
  cursor: pointer;
  border: none;
  font-family: var(--font);
  letter-spacing: .01em;
}

.mkica-btn-gold {
  background: var(--gold);
  color: var(--g900);
  box-shadow: 0 4px 18px rgba(201,168,76,.35);
}

.mkica-btn-gold:hover { background: var(--gold-l); color: var(--g900); transform: translateY(-1px); box-shadow: 0 6px 24px rgba(201,168,76,.45); }

.mkica-btn-ghost {
  background: rgba(255,255,255,.08);
  color: var(--white);
  border: 1.5px solid rgba(255,255,255,.35);
  backdrop-filter: blur(6px);
}

.mkica-btn-ghost:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.7); color: var(--white); }

.mkica-btn-green {
  background: var(--g700);
  color: var(--white);
  box-shadow: 0 4px 16px rgba(45,90,61,.25);
}

.mkica-btn-green:hover { background: var(--g600); color: var(--white); transform: translateY(-1px); }

/* ============================================================

   QUICK-STATS STRIP

   ============================================================ */

.mkica-stats {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 2px 8px rgba(15,35,24,.04);
}

.mkica-stats-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.mkica-stat {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 28px;
  border-right: 1px solid var(--border);
  transition: background .18s;
  text-decoration: none;
  color: inherit;
}

.mkica-stat:last-child { border-right: none; }

.mkica-stat:hover { background: var(--g100); }

.mkica-stat-icon {
  width: 46px; height: 46px;
  border-radius: 10px;
  background: var(--g100);
  display: grid;
  place-items: center;
  font-size: 20px;
  flex-shrink: 0;
  transition: background .18s;
}

.mkica-stat:hover .mkica-stat-icon { background: var(--g200); }

.mkica-stat strong { display: block; font-size: 17px; font-weight: 700; color: var(--g700); line-height: 1.2; }

.mkica-stat span { font-size: 11px; color: var(--light); text-transform: uppercase; letter-spacing: .07em; margin-top: 2px; display: block; }

/* ============================================================

   LAYOUT -- two-column with sidebar

   ============================================================ */

.mkica-layout {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px;
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 32px;
  align-items: start;
}

@media (max-width: 960px) {
  .mkica-layout { grid-template-columns: 1fr; }

  .mkica-sidebar { order: -1; }

}

.mkica-main { min-width: 0; }

.mkica-sidebar { display: flex; flex-direction: column; gap: 24px; }

/* ============================================================

   SECTION HEADINGS

   ============================================================ */

.mkica-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 24px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--border);
}

.mkica-section-head h2 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  margin: 0 !important;
  letter-spacing: -.02em !important;
  display: flex;
  align-items: center;
  gap: 10px;
}

.mkica-section-head h2::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 20px;
  background: var(--g700);
  border-radius: 2px;
  flex-shrink: 0;
}

.mkica-section-head a {
  font-size: 13px;
  color: var(--g600);
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.mkica-section-head a:hover { color: var(--g700); }

/* ============================================================

   NEWS GRID -- magazine layout: featured + side cards

   ============================================================ */

/* Outer layout: featured full-width on top, cards grid below */
.mkica-news-grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.mkica-news-side {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

/* ---- FEATURED card -- full-width top banner with overlay ---- */
.mkica-news-featured {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .22s, transform .22s;
  display: flex;
  flex-direction: column;
  background: var(--g900);
  min-height: 400px;
}

.mkica-news-featured:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-2px);
}

.mkica-news-featured-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
  filter: brightness(.72);
}

.mkica-news-featured:hover .mkica-news-featured-bg { transform: scale(1.04); filter: brightness(.6); }

/* Gradient overlay — fills card, text sits at bottom */
.mkica-news-featured-overlay {
  position: relative;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 28px 26px 24px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 25%,
    rgba(10,25,15,.6) 55%,
    rgba(10,25,15,.93) 100%
  );
}

.mkica-news-featured-title {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 1.3 !important;
  margin: 8px 0 10px !important;
  letter-spacing: -.02em !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.4);
}

.mkica-news-excerpt {
  font-size: 14px;
  color: rgba(255,255,255,.8);
  line-height: 1.6;
  margin: 0 0 16px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  line-clamp: 3;
  text-shadow: 0 1px 3px rgba(0,0,0,.3);
}

/* ---- SIDE cards -- vertical card in 2-col grid ---- */
.mkica-news-card {
  display: flex;
  flex-direction: column;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .2s, transform .2s;
}

.mkica-news-card:hover {
  box-shadow: 0 6px 24px rgba(15,35,24,.12);
  transform: translateY(-2px);
  border-color: var(--g200);
}

.mkica-news-card-img {
  overflow: hidden;
  background: var(--g100);
  aspect-ratio: 16/9;
  flex-shrink: 0;
}

.mkica-news-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s;
  display: block;
}

.mkica-news-card:hover .mkica-news-card-img img { transform: scale(1.05); }

.mkica-news-card-body {
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 6px;
}

.mkica-news-card-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  line-height: 1.4 !important;
  margin: 4px 0 4px !important;
  letter-spacing: -.01em !important;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  flex: 1;
}

.mkica-news-card:hover .mkica-news-card-title { color: var(--g700) !important; }

/* ---- Shared meta + read ---- */
.mkica-news-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.mkica-news-cat {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--g700);
  background: var(--g100);
  border: 1px solid var(--g200);
  padding: 2px 7px;
  border-radius: 20px;
  white-space: nowrap;
}

.mkica-news-date { font-size: 11px; color: var(--light); white-space: nowrap; }

.mkica-news-read {
  font-size: 12px;
  font-weight: 600;
  color: var(--g600);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: gap .18s, color .18s;
}

.mkica-news-card:hover .mkica-news-read {
  color: var(--g700);
  gap: 7px;
}

/* Overlay variants -- white text on dark image */
.mkica-news-cat--light {
  background: rgba(255,255,255,.18) !important;
  border-color: rgba(255,255,255,.3) !important;
  color: #fff !important;
  backdrop-filter: blur(4px);
}

.mkica-news-date--light { color: rgba(255,255,255,.65) !important; }

.mkica-news-read--light {
  color: var(--gold) !important;
  font-size: 13px;
}

.mkica-news-featured:hover .mkica-news-read--light {
  color: var(--gold-l) !important;
  gap: 8px;
}

.mkica-news-no-img {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--g100) 0%, var(--g200) 100%);
  min-height: 80px;
}

/* Responsive */
@media (max-width: 600px) {
  .mkica-news-side { grid-template-columns: 1fr; }
  .mkica-news-featured { min-height: 280px; }
  .mkica-news-featured-overlay { padding: 20px 18px 18px; }
  .mkica-news-featured-title { font-size: 18px !important; }
}

/* Homepage: hide the empty #content wrapper Astra still outputs via get_header/footer */

body.mkica-homepage #content,

body.mkica-homepage #primary,

body.mkica-homepage #secondary { display: none !important; }

/* Donation section always full-width */

.mkica-donation-section { width: 100%; }

/* ============================================================

   SIDEBAR PRAYER WIDGET -- matches hero card style

   ============================================================ */

.mkica-sw {
  background: linear-gradient(160deg, var(--g900) 0%, var(--g800) 100%);
  border: 1px solid rgba(201,168,76,.22);
  border-top: 2px solid rgba(201,168,76,.55);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.22);
}

/* Header */

.mkica-sw-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 16px 18px 12px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(0,0,0,.18);
}

.mkica-sw-head-left { display: flex; flex-direction: column; gap: 2px; }

.mkica-sw-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
}

.mkica-sw-date {
  font-size: 13px;
  font-weight: 600;
  color: var(--white);
  line-height: 1.2;
}

.mkica-sw-hijri {
  font-size: 10px;
  color: rgba(255,255,255,.4);
  font-style: italic;
}

.mkica-sw-clock {
  font-size: 18px;
  font-weight: 700;
  color: var(--white);
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

/* Column headers */

.mkica-sw-cols {
  display: grid;
  grid-template-columns: 1fr 68px 68px;
  padding: 6px 18px;
  background: rgba(0,0,0,.12);
  border-bottom: 1px solid rgba(255,255,255,.05);
}

.mkica-sw-cols span {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
}

.mkica-sw-cols span:nth-child(2),

.mkica-sw-cols span:nth-child(3) { text-align: right; }

/* Prayer rows */

.mkica-sw-rows { padding: 2px 0; }

.mkica-sw-row {
  display: grid;
  grid-template-columns: 1fr 68px 68px;
  align-items: center;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .15s;
}

.mkica-sw-row:last-child { border-bottom: none; }

.mkica-sw-row:hover { background: rgba(255,255,255,.04); }

.mkica-sw-row--next {
  background: rgba(201,168,76,.11) !important;
  border-left: 3px solid var(--gold);
  padding-left: 15px;
}

.mkica-sw-row--next:hover { background: rgba(201,168,76,.16) !important; }

.mkica-sw-row--sunrise .mkica-sw-name,

.mkica-sw-row--sunrise .mkica-sw-begins,

.mkica-sw-row--sunrise .mkica-sw-iqamah {
  color: rgba(255,255,255,.35) !important;
  font-style: italic;
  font-weight: 400 !important;
}

.mkica-sw-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--white);
  display: flex;
  align-items: center;
  gap: 6px;
}

.mkica-sw-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
  box-shadow: 0 0 6px rgba(201,168,76,.8);
  animation: mkica-pulse 2s ease-in-out infinite;
}

.mkica-sw-badge {
  display: inline-block;
  background: var(--gold);
  color: var(--g900);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 2px 5px;
  border-radius: 3px;
  line-height: 1.4;
}

.mkica-sw-begins, .mkica-sw-iqamah {
  text-align: right;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.mkica-sw-begins { font-weight: 700; color: var(--white); }

.mkica-sw-iqamah { color: rgba(255,255,255,.45); }

.mkica-sw-row--next .mkica-sw-begins { color: var(--gold); font-size: 13px; }

.mkica-sw-row--next .mkica-sw-iqamah { color: rgba(201,168,76,.7); }

/* Footer */

.mkica-sw-foot {
  display: flex;
  gap: 8px;
  padding: 12px 18px;
  border-top: 1px solid rgba(255,255,255,.07);
  background: rgba(0,0,0,.15);
}

.mkica-sw-btn-primary, .mkica-sw-btn-secondary {
  flex: 1;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  padding: 8px 0;
  border-radius: 7px;
  text-decoration: none !important;
  transition: background .18s;
}

.mkica-sw-btn-primary {
  background: var(--gold);
  color: var(--g900) !important;
}

.mkica-sw-btn-primary:hover { background: var(--gold-l) !important; color: var(--g900) !important; }

.mkica-sw-btn-secondary {
  background: rgba(255,255,255,.07);
  color: rgba(255,255,255,.7) !important;
  border: 1px solid rgba(255,255,255,.12);
}

.mkica-sw-btn-secondary:hover { background: rgba(255,255,255,.12) !important; color: var(--white) !important; }

/* ============================================================

   DONATION SIDEBAR WIDGET

   ============================================================ */

.mkica-donate-widget {
  background: linear-gradient(160deg, var(--g800) 0%, var(--g700) 100%);
  border-radius: var(--r);
  overflow: hidden;
  position: relative;
}

.mkica-donate-widget::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .06;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='70' viewBox='0 0 70 70'%3E%3Cg fill='none' stroke='%23c9a84c' stroke-width='1'%3E%3Cpath d='M35 8 L39 22 L53 16 L45 28 L60 30 L48 38 L55 52 L42 46 L38 60 L34 46 L21 52 L28 38 L16 30 L31 28 L23 16 L37 22 Z' opacity='.8'/%3E%3Ccircle cx='35' cy='35' r='14' opacity='.35'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 70px 70px;
}

.mkica-donate-inner { position: relative; padding: 22px 20px; }

.mkica-donate-kicker {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 8px;
}

.mkica-donate-title {
  font-size: 18px;
  font-weight: 800;
  color: var(--white);
  line-height: 1.25;
  margin-bottom: 10px;
  letter-spacing: -.02em;
}

.mkica-donate-desc {
  font-size: 13px;
  color: rgba(255,255,255,.72);
  line-height: 1.6;
  margin-bottom: 18px;
}

/* Extension project progress */

.mkica-progress-wrap { margin-bottom: 20px; }

.mkica-progress-labels {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
}

.mkica-progress-labels span { font-size: 11px; color: rgba(255,255,255,.65); }

.mkica-progress-labels strong { font-size: 13px; font-weight: 700; color: var(--white); }

.mkica-progress-bar-wrap {
  height: 8px;
  background: rgba(255,255,255,.15);
  border-radius: 4px;
  overflow: hidden;
}

.mkica-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, var(--gold), var(--gold-l));
  border-radius: 4px;
  width: 0;
  transition: width 1.5s ease;
}

.mkica-progress-note {
  font-size: 11px;
  color: rgba(255,255,255,.5);
  margin-top: 6px;
  text-align: right;
}

.mkica-donate-btns { display: flex; flex-direction: column; gap: 8px; }

.mkica-donate-btns .mkica-btn { justify-content: center; width: 100%; }

.mkica-donate-methods {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.1);
  font-size: 11px;
  color: rgba(255,255,255,.5);
  text-align: center;
  line-height: 1.7;
}

.mkica-donate-methods strong { color: rgba(255,255,255,.75); }

/* ============================================================

   DONATION SECTION -- full width below posts

   ============================================================ */

.mkica-donation-section {
  background: linear-gradient(135deg, var(--g900) 0%, var(--g800) 100%);
  padding: 64px 24px;
  position: relative;
  overflow: hidden;
  margin-top: 0;
}

.mkica-donation-section::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .055;
  background-image: url("/wp-content/themes/mkica-child/assets/images/arabesque.svg");
  background-size: 120px 120px;
}

.mkica-donation-inner {
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.mkica-donation-text {}

.mkica-donation-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.mkica-donation-kicker::before {
  content: '';
  display: inline-block;
  width: 24px;
  height: 2px;
  background: var(--gold);
}

.mkica-donation-title {
  font-size: clamp(26px, 3.5vw, 40px);
  font-weight: 800;
  color: var(--white);
  line-height: 1.15;
  letter-spacing: -.025em;
  margin-bottom: 16px;
}

.mkica-donation-title em { font-style: normal; color: var(--gold); }

.mkica-donation-desc {
  font-size: 15px;
  color: rgba(255,255,255,.72);
  line-height: 1.7;
  margin-bottom: 28px;
}

.mkica-donation-project-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 28px;
}

.mkica-proj-stat {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 14px;
  text-align: center;
}

.mkica-proj-stat strong {
  display: block;
  font-size: 20px;
  font-weight: 800;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 4px;
}

.mkica-proj-stat span { font-size: 10px; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: .08em; }

.mkica-donation-progress { margin-bottom: 28px; }

.mkica-donation-progress-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}

.mkica-donation-progress-top strong { font-size: 22px; font-weight: 800; color: var(--white); }

.mkica-donation-progress-top span { font-size: 13px; color: rgba(255,255,255,.55); }

.mkica-donation-progress-bar-wrap {
  height: 10px;
  background: rgba(255,255,255,.12);
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 6px;
}

.mkica-donation-progress-bar {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--gold), var(--gold-l));
  border-radius: 5px;
}

.mkica-donation-progress-note { font-size: 12px; color: rgba(255,255,255,.45); }

.mkica-donation-ctas { display: flex; gap: 12px; flex-wrap: wrap; }

/* Right side -- project breakdown */

.mkica-donation-breakdown {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 28px;
  backdrop-filter: blur(10px);
}

.mkica-breakdown-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.mkica-breakdown-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.mkica-breakdown-item:last-child { border-bottom: none; padding-bottom: 0; }

.mkica-breakdown-icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: rgba(201,168,76,.15);
  display: grid;
  place-items: center;
  font-size: 16px;
  flex-shrink: 0;
}

.mkica-breakdown-text strong { display: block; font-size: 13px; font-weight: 600; color: var(--white); margin-bottom: 2px; }

.mkica-breakdown-text span { font-size: 11px; color: rgba(255,255,255,.5); }

.mkica-breakdown-amount { margin-left: auto; font-size: 13px; font-weight: 700; color: var(--gold); white-space: nowrap; padding-left: 10px; }

@media (max-width: 860px) {
  .mkica-donation-inner { grid-template-columns: 1fr; gap: 36px; }

  .mkica-donation-project-stats { grid-template-columns: repeat(3, 1fr); }

}

/* ============================================================

   FULL TIMETABLE PAGE

   ============================================================ */

.mkica-pt-page { display: flex; flex-direction: column; gap: 40px; }

/* -- Today card -- matches hero prayer card style -- */

.mkica-pt-today {
  background: linear-gradient(160deg, var(--g900) 0%, var(--g800) 100%);
  border: 1px solid rgba(201,168,76,.22);
  border-top: 2px solid rgba(201,168,76,.55);
  border-radius: 14px;
  overflow: hidden;
}

.mkica-pt-today-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 22px 14px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background: rgba(0,0,0,.18);
}

.mkica-pt-today-head > div { display: flex; flex-direction: column; gap: 3px; }

.mkica-pt-today-label {
  font-size: 9px; font-weight: 700; letter-spacing: .2em;
  text-transform: uppercase; color: var(--gold);
}

.mkica-pt-today-date { font-size: 16px; font-weight: 700; color: var(--white); }

.mkica-pt-today-hijri { font-size: 11px; color: rgba(255,255,255,.4); font-style: italic; }

.mkica-pt-powered {
  font-size: 10px; color: rgba(255,255,255,.3) !important;
  text-decoration: none !important; white-space: nowrap; align-self: center;
}

.mkica-pt-powered:hover { color: var(--gold) !important; }

.mkica-pt-today-cols {
  display: grid; grid-template-columns: 1fr 100px 100px;
  padding: 7px 22px;
  background: rgba(0,0,0,.12);
  border-bottom: 1px solid rgba(255,255,255,.05);
  font-size: 9px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: rgba(255,255,255,.3);
}

.mkica-pt-today-cols span:nth-child(2),

.mkica-pt-today-cols span:nth-child(3) { text-align: right; }

.mkica-pt-today-rows { padding: 4px 0; }

.mkica-pt-row {
  display: grid; grid-template-columns: 1fr 100px 100px;
  align-items: center;
  padding: 12px 22px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .15s;
}

.mkica-pt-row:last-child { border-bottom: none; }

.mkica-pt-row:hover { background: rgba(255,255,255,.04); }

.mkica-pt-row--next {
  background: rgba(201,168,76,.11) !important;
  border-left: 3px solid var(--gold);
  padding-left: 19px;
}

.mkica-pt-row--sunrise .mkica-pt-name,

.mkica-pt-row--sunrise .mkica-pt-begins,

.mkica-pt-row--sunrise .mkica-pt-iqamah {
  color: rgba(255,255,255,.35) !important; font-style: italic; font-weight: 400 !important;
}

.mkica-pt-name {
  font-size: 14px; font-weight: 600; color: var(--white);
  display: flex; align-items: center; gap: 8px;
}

.mkica-pt-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--gold); flex-shrink: 0;
  box-shadow: 0 0 7px rgba(201,168,76,.8);
  animation: mkica-pulse 2s ease-in-out infinite;
}

.mkica-pt-badge {
  background: var(--gold); color: var(--g900);
  font-size: 9px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; padding: 2px 6px; border-radius: 3px; line-height: 1.4;
}

.mkica-pt-begins, .mkica-pt-iqamah {
  text-align: right; font-variant-numeric: tabular-nums;
}

.mkica-pt-begins { font-size: 14px; font-weight: 700; color: var(--white); }

.mkica-pt-iqamah { font-size: 13px; color: rgba(255,255,255,.45); }

.mkica-pt-row--next .mkica-pt-begins { color: var(--gold); }

.mkica-pt-row--next .mkica-pt-iqamah { color: rgba(201,168,76,.7); }

/* -- Monthly table -- */

.mkica-pt-monthly-head { margin-bottom: 16px; }

.mkica-pt-monthly-title-row {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}

.mkica-pt-monthly-title {
  font-size: 20px !important; font-weight: 700 !important;
  color: var(--g900) !important; margin: 0 0 4px !important;
}

.mkica-pt-monthly-note { font-size: 12px; color: var(--light); margin: 0; }

.mkica-pt-pdf-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 10px 20px; border-radius: 7px; border: none; cursor: pointer;
  background: var(--g700); color: var(--white);
  font-size: 13px; font-weight: 600; font-family: var(--font);
  text-decoration: none; transition: background .18s; white-space: nowrap;
  flex-shrink: 0;
}

.mkica-pt-pdf-btn:hover { background: var(--g600); }

.mkica-pt-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
}

.mkica-pt-table {
  width: 100%; border-collapse: collapse;
  font-size: 13px; white-space: nowrap;
}

.mkica-pt-table thead th {
  background: var(--g800); color: var(--white);
  padding: 11px 14px; text-align: center;
  font-size: 11px; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
  border-right: 1px solid rgba(255,255,255,.08);
}

.mkica-pt-table thead th:first-child { text-align: left; }

.mkica-pt-table thead th small { display: block; font-weight: 400; opacity: .6; font-size: 9px; letter-spacing: .04em; margin-top: 2px; }

.mkica-pt-table tbody tr { border-bottom: 1px solid var(--border); }

.mkica-pt-table tbody tr:last-child { border-bottom: none; }

.mkica-pt-table tbody tr:hover td { background: var(--g50); }

.mkica-pt-table tbody td {
  padding: 9px 14px; text-align: center;
  color: var(--text); line-height: 1.4;
  border-right: 1px solid var(--border);
  font-variant-numeric: tabular-nums;
}

.mkica-pt-table tbody td:last-child { border-right: none; }

.mkica-pt-day { text-align: left !important; font-weight: 600; color: var(--g800); white-space: nowrap; }

.mkica-pt-sunrise { color: var(--light) !important; font-style: italic; }

.mkica-pt-iq { color: var(--light); font-size: 11px; display: block; }

/* Today row */

.mkica-pt-today-row td { background: var(--gold-bg) !important; }

.mkica-pt-today-row .mkica-pt-day { color: var(--g700); }

.mkica-pt-today-tag {
  display: inline-block; background: var(--gold); color: var(--g900);
  font-size: 8px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; padding: 1px 5px; border-radius: 3px;
  margin-left: 5px; vertical-align: middle;
}

@media (max-width: 700px) {
  .mkica-pt-today-cols { grid-template-columns: 1fr 80px 80px; }

  .mkica-pt-row { grid-template-columns: 1fr 80px 80px; padding: 10px 16px; }

  .mkica-pt-row--next { padding-left: 13px; }

  .mkica-pt-today-head { flex-direction: column; gap: 8px; }

}

/* ============================================================

   FOOTER -- full-width, zero gaps, matches site theme

   ============================================================ */

/* Nuke every possible Astra footer gap/padding/margin/bg */

#colophon,

.site-footer,

footer.site-footer,

footer#colophon,

.footer-widget-area,

.ast-footer-overlay,

.ast-small-footer,

.ast-small-footer-wrap,

.ast-small-footer-section,

div.ast-small-footer,

.ast-row.ast-footer-row,

.ast-footer-row,

.ast-footer-row-inner,

.site-footer .ast-container,

.site-footer .ast-row {
  background:       var(--g900) !important;
  background-color: var(--g900) !important;
  border-top:    none !important;
  border-radius: 0 !important;
  margin:        0 !important;
  box-shadow:    none !important;
}

/* The footer as a whole: full viewport width, no gaps */

#colophon {
  position: relative;
  overflow: hidden;
  width: 100% !important;
  max-width: 100% !important;
  border-top: 3px solid var(--g700) !important;
}

/* Arabesque background pattern on footer */

#colophon::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90' viewBox='0 0 90 90'%3E%3Cg fill='none' stroke='%23c9a84c' stroke-width='1'%3E%3Cpath d='M45 8 L50 26 L67 18 L58 35 L76 36 L62 46 L72 62 L54 56 L49 74 L44 56 L26 62 L36 46 L22 36 L40 35 L31 18 L48 26 Z' opacity='.7'/%3E%3Ccircle cx='45' cy='45' r='18' opacity='.3'/%3E%3Ccircle cx='45' cy='45' r='30' opacity='.15'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 90px 90px;
}

/* ---- Custom footer content (we inject via PHP) ---- */

.mkica-footer {
  position: relative;
  z-index: 1;
  width: 100%;
}

/* Top content band */

.mkica-footer-top {
  display: grid;
  grid-template-columns: 280px 1fr 1fr;
  gap: 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.mkica-footer-col {
  padding: 48px 40px;
  border-right: 1px solid rgba(255,255,255,.06);
}

.mkica-footer-col:last-child { border-right: none; }

/* Brand column */

.mkica-footer-brand-logo {
  margin-bottom: 20px;
  line-height: 0;
}

.mkica-footer-brand-logo img {
  height: 52px;
  width: auto;
  max-width: 240px;
  opacity: .85;
}

.mkica-footer-tagline {
  font-size: 13px;
  color: rgba(255,255,255,.5);
  line-height: 1.7;
  margin-bottom: 20px;
}

.mkica-footer-charity {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
  border: 1px solid rgba(201,168,76,.35);
  padding: 4px 10px;
  border-radius: 4px;
}

/* Column headings */

.mkica-footer-col h4 {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--white) !important;
  margin: 0 0 18px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
}

/* Quick links */

.mkica-footer-links { list-style: none; margin: 0; padding: 0; }

.mkica-footer-links li { margin-bottom: 10px; }

.mkica-footer-links a {
  font-size: 13px;
  color: rgba(255,255,255,.55) !important;
  text-decoration: none !important;
  transition: color .18s;
  display: flex;
  align-items: center;
  gap: 7px;
}

.mkica-footer-links a::before { content: '-'; color: var(--gold); font-size: 16px; line-height: 1; }

.mkica-footer-links a:hover { color: var(--gold) !important; }

/* Contact info */

.mkica-footer-contact { list-style: none; margin: 0; padding: 0; }

.mkica-footer-contact li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 14px;
  font-size: 13px;
  color: rgba(255,255,255,.55);
  line-height: 1.5;
}

.mkica-footer-contact li span:first-child {
  font-size: 15px;
  flex-shrink: 0;
  margin-top: 1px;
}

.mkica-footer-contact a { color: rgba(255,255,255,.55) !important; text-decoration: none !important; }

.mkica-footer-contact a:hover { color: var(--gold) !important; }

.mkica-footer-contact strong { color: rgba(255,255,255,.8); display: block; font-size: 12px; margin-bottom: 2px; }

/* Bottom copyright bar */

.mkica-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 40px;
  background: rgba(0,0,0,.3);
  flex-wrap: wrap;
  gap: 8px;
}

.mkica-footer-bottom p {
  font-size: 12px !important;
  color: rgba(255,255,255,.35) !important;
  margin: 0 !important;
}

.mkica-footer-bottom a { color: var(--gold) !important; text-decoration: none !important; }

.mkica-footer-bottom a:hover { color: var(--gold-l) !important; }

.mkica-footer-bottom-right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.mkica-footer-bottom-right a {
  font-size: 11px;
  color: rgba(255,255,255,.3) !important;
  text-decoration: none !important;
  transition: color .18s;
}

.mkica-footer-bottom-right a:hover { color: var(--gold) !important; }

/* Hide Astra's own #colophon footer entirely -- we use #mkica-colophon */

#colophon,

#colophon * { display: none !important; }

/* Our custom footer */

#mkica-colophon {
  display: block !important;
  position: relative;
  overflow: hidden;
  width: 100% !important;
  max-width: 100% !important;
  background: var(--g900) !important;
  border-top: 3px solid var(--g700) !important;
}

/* Responsive footer */

@media (max-width: 900px) {
  .mkica-footer-top { grid-template-columns: 1fr 1fr; }

  .mkica-footer-col:first-child { grid-column: 1 / -1; border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); padding: 36px 28px; }

  .mkica-footer-col { padding: 32px 28px; }

  .mkica-footer-bottom { padding: 14px 28px; }

}

@media (max-width: 600px) {
  .mkica-footer-top { grid-template-columns: 1fr; }

  .mkica-footer-col { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,.06); padding: 28px 20px; }

  .mkica-footer-col:last-child { border-bottom: none; }

  .mkica-footer-bottom { flex-direction: column; text-align: center; padding: 14px 20px; gap: 6px; }

  .mkica-footer-bottom-right { justify-content: center; }

}

/* ============================================================

   OVERRIDE ASTRA DEFAULTS -- prevent conflicts

   ============================================================ */

.site-content, #content { background: transparent !important; }

/* Homepage: remove container constraints -- our layout handles it */

body.mkica-homepage .ast-container { max-width: none !important; padding: 0 !important; }

.ast-separate-container .ast-article-post { display: none !important; } /* hidden; we render our own cards */

.ast-separate-container .ast-pagination-container { display: none !important; }

/* But show posts on single/archive/non-home pages */

body:not(.mkica-homepage) .ast-separate-container .ast-article-post { display: block !important; }

body:not(.mkica-homepage) .ast-separate-container .ast-pagination-container { display: block !important; }

/* ============================================================

   INNER PAGES -- white content box, proper padding/centering

   ============================================================ */

body:not(.mkica-homepage) { background: var(--white) !important; }

body:not(.mkica-homepage) #content { background: var(--white) !important; }

/* Let Astra's container span the full width like the homepage */

body:not(.mkica-homepage) .ast-container {
  max-width: 1200px !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
}

/* Centre the primary column and cap it for readable line length */

body:not(.mkica-homepage) #primary {
  max-width: 860px;
  width: 100%;
  margin: 0 auto;
  padding: 48px 0 64px;
  background: var(--white);
}

body:not(.mkica-homepage) .entry-title {
  font-size: clamp(22px, 4vw, 34px);
  font-weight: 800;
  color: var(--g900);
  margin-bottom: 24px;
  border-bottom: 3px solid var(--g200);
  padding-bottom: 16px;
}

body:not(.mkica-homepage) .entry-content {
  font-size: 16px;
  line-height: 1.75;
  color: var(--text);
}

body:not(.mkica-homepage) .entry-content h2 {
  font-size: 22px;
  font-weight: 700;
  color: var(--g900);
  margin: 32px 0 12px;
}

body:not(.mkica-homepage) .entry-content h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--g800);
  margin: 24px 0 10px;
}

body:not(.mkica-homepage) .entry-content p { margin-bottom: 16px; }

body:not(.mkica-homepage) .entry-content strong { color: var(--g900); }

/* Dark sections inside entry-content must inherit white, not be overridden */

body:not(.mkica-homepage) .entry-content .mkica-ext-donate-box strong,

body:not(.mkica-homepage) .entry-content .mkica-ext-donate-box p,

body:not(.mkica-homepage) .entry-content .mkica-ext-intro p { color: #fff !important; }

body:not(.mkica-homepage) .entry-content a { color: var(--g700); text-decoration: underline; }

@media (max-width: 768px) {
  body:not(.mkica-homepage) .ast-container { padding-left: 20px !important; padding-right: 20px !important; }

  body:not(.mkica-homepage) #primary { padding: 28px 0 48px; }

}

/* ============================================================

   CONTACT PAGE -- two-column layout + map

   ============================================================ */

.mkica-contact-grid {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 48px;
  margin-bottom: 48px;
}

.mkica-contact-main h2 { margin-top: 0 !important; }

.mkica-contact-main h3 {
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--g700) !important;
  margin: 28px 0 6px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid var(--border) !important;
}

.mkica-contact-main p { margin-bottom: 0; }

.mkica-contact-side {
  background: var(--g50);
  border: 1px solid var(--border);
  border-top: 3px solid var(--g700);
  border-radius: var(--r);
  padding: 24px 22px;
  align-self: start;
}

.mkica-contact-side h3 {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--g700) !important;
  margin: 20px 0 6px !important;
}

.mkica-contact-side h3:first-child { margin-top: 0 !important; }

.mkica-contact-side p { font-size: 13px; color: var(--mid); line-height: 1.6; margin-bottom: 0; }

.mkica-contact-side a { color: var(--g700) !important; }

.mkica-map-wrap {
  border-radius: var(--r);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}

@media (max-width: 680px) {
  .mkica-contact-grid { grid-template-columns: 1fr; gap: 32px; }

  .mkica-contact-side { order: -1; }

}

/* Non-homepage: standard Astra post styling */

body:not(.mkica-homepage) article.post, body:not(.mkica-homepage) .ast-article-post {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--r) !important;
  box-shadow: var(--shadow) !important;
  margin-bottom: 24px !important;
  overflow: hidden !important;
  transition: box-shadow .22s, transform .22s !important;
}

body:not(.mkica-homepage) article.post:hover { box-shadow: var(--shadow-lg) !important; transform: translateY(-2px) !important; }

body:not(.mkica-homepage) .entry-title a { color: var(--text) !important; font-weight: 700 !important; }

body:not(.mkica-homepage) .entry-title a:hover { color: var(--g700) !important; }

body:not(.mkica-homepage) .ast-read-more, body:not(.mkica-homepage) a.more-link {
  background: var(--g700) !important;
  color: var(--white) !important;
  padding: 9px 20px !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  display: inline-block !important;
}

body:not(.mkica-homepage) .ast-taxonomy-container a, body:not(.mkica-homepage) .cat-links a {
  background: var(--g100) !important; color: var(--g700) !important;
  padding: 2px 10px !important; border-radius: 20px !important;
  font-size: 11px !important; font-weight: 600 !important;
  text-decoration: none !important; border: 1px solid var(--g200) !important;
}

/* Buttons */

.ast-button, button[type=submit], input[type=submit] { background: var(--g700) !important; color: var(--white) !important; border-radius: 7px !important; border: none !important; font-weight: 600 !important; padding: 11px 24px !important; transition: background .18s !important; }

.ast-button:hover, button[type=submit]:hover { background: var(--g600) !important; }

/* Pagination */

.pagination .page-numbers, .nav-links .page-numbers { border: 1px solid var(--border) !important; border-radius: 6px !important; color: var(--text) !important; padding: 8px 14px !important; font-size: 13px !important; transition: all .18s !important; }

.pagination .page-numbers.current, .nav-links .page-numbers.current, .pagination .page-numbers:hover { background: var(--g700) !important; border-color: var(--g700) !important; color: var(--white) !important; }

/* News section pagination */

.mkica-news-pagination {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
}

.mkica-news-pagination a,
.mkica-news-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none !important;
  transition: all .18s;
  border: 1px solid var(--border);
  color: var(--text) !important;
  background: var(--white);
  line-height: 1;
}

.mkica-news-pagination a:hover {
  background: var(--g100) !important;
  border-color: var(--g200) !important;
  color: var(--g700) !important;
}

.mkica-news-pagination span.current {
  background: var(--g700) !important;
  border-color: var(--g700) !important;
  color: var(--white) !important;
  font-weight: 700;
}

.mkica-news-pagination .dots {
  border: none;
  background: none;
  color: var(--light) !important;
  min-width: auto;
  padding: 0 4px;
}

/* Admin bar offset */

body.admin-bar #mkica-prayer-bar { top: 32px !important; }

@media (max-width: 782px) { body.admin-bar #mkica-prayer-bar { top: 46px !important; } }

/* ============================================================

   PRAYER BAR MOBILE

   ============================================================ */

@media (max-width: 640px) {
  .mkica-bar-label { display: none !important; } /* hide "Prayer Times" label -- saves space */

  .mkica-prayer { padding: 2px 6px !important; }

  .mkica-prayer-name { font-size: 9px !important; }

  .mkica-prayer-time { font-size: 12px !important; }

  .mkica-iqamah { display: none !important; } /* hide iqamah in brackets on small screens */

  .mkica-bar-link { font-size: 10px !important; padding: 3px 8px !important; flex-shrink: 0 !important; margin-left: 8px !important; }

  .mkica-prayer.mkica-next { padding: 3px 8px !important; }

}

/* Header mobile handled by #ast-mobile-header rules above */

/* ============================================================

   HERO RESPONSIVE

   ============================================================ */

/* Tablet -- narrow the card column */

@media (max-width: 1024px) {
  .mkica-hero-inner {
    grid-template-columns: 1fr 360px;
    gap: 36px;
    padding: 52px 28px 60px;
  }

}

/* Below 860px -- stack vertically, card goes below text */

@media (max-width: 860px) {
  .mkica-hero-inner {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 48px 24px 52px;
    max-width: 560px;
  }

  .mkica-hero-right { order: -1; }

  .mkica-hero-left { align-items: center; text-align: center; }

  .mkica-hero-kicker { justify-content: center; }

  .mkica-hero-sub { max-width: 100%; }

  .mkica-hero-ctas { justify-content: center; }

  .mkica-hero-right::before { display: none; }

  .mkica-prayer-card-accent { width: 60%; }

}

/* Mobile */

@media (max-width: 560px) {
  .mkica-hero-inner { padding: 36px 18px 44px; }

  .mkica-hero h1 { font-size: clamp(28px, 8vw, 40px) !important; }

  .mkica-hero-sub { font-size: 14px; }

  .mkica-hero-ctas { flex-direction: column; align-items: center; gap: 10px; }

  .mkica-btn { width: 100%; max-width: 280px; justify-content: center; }

  .mkica-pc-clock { font-size: 17px; }

  .mkica-pc-cols, .mkica-pc-row { grid-template-columns: 1fr 64px 64px; }

}

/* Stats grid responsive */

@media (max-width: 768px) {
  .mkica-stats-inner { grid-template-columns: repeat(2, 1fr); }

  .mkica-stat:nth-child(2) { border-right: none; }

  .mkica-stat:nth-child(1),

  .mkica-stat:nth-child(2) { border-bottom: 1px solid var(--border); }

  .mkica-layout { padding: 24px 16px; }

  .mkica-donation-section { padding: 48px 20px; }

}

@media (max-width: 480px) {
  .mkica-stats-inner { grid-template-columns: 1fr 1fr; }

  .mkica-hero-inner { padding: 40px 20px 44px; }

  .mkica-donation-ctas { flex-direction: column; }

  .mkica-donation-project-stats { grid-template-columns: 1fr 1fr 1fr; gap: 10px; }

}

/* ============================================================

   EXTENSION PROJECT PAGE

   ============================================================ */

.mkica-ext-page { display: flex; flex-direction: column; gap: 48px; }

.mkica-ext-intro {
  background: linear-gradient(135deg, var(--g900) 0%, var(--g800) 100%);
  border-radius: 14px;
  padding: 32px 36px;
  position: relative;
  overflow: hidden;
}

.mkica-ext-intro::before {
  content: '';
  position: absolute; inset: 0;
  background-image: url("/wp-content/themes/mkica-child/assets/images/arabesque.svg");
  background-size: 110px 110px;
  opacity: .05; pointer-events: none;
}

.mkica-ext-bismillah {
  font-size: 13px; font-weight: 600; color: var(--gold);
  letter-spacing: .06em; margin-bottom: 12px;
}

.mkica-ext-intro > p:not(.mkica-ext-bismillah) { color: rgba(255,255,255,.75); font-size: 15px; line-height: 1.7; position: relative; }

.mkica-ext-hadith {
  margin: 20px 0 0;
  padding: 16px 20px;
  border-left: 3px solid var(--gold);
  background: rgba(201,168,76,.08);
  border-radius: 0 8px 8px 0;
  position: relative;
}

.mkica-ext-hadith p, .mkica-ext-hadith { color: rgba(255,255,255,.85) !important; font-size: 15px; font-style: italic; line-height: 1.6; margin: 0 !important; }

.mkica-ext-hadith cite { display: block; margin-top: 6px; font-size: 12px; color: var(--gold); font-style: normal; font-weight: 600; }

/* Section headings */

.mkica-ext-section h2 {
  font-size: 22px !important; font-weight: 700 !important;
  color: var(--g900) !important; margin: 0 0 18px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid var(--g200) !important;
  display: flex; align-items: center; gap: 10px;
}

.mkica-ext-section h2::before {
  content: ''; display: inline-block; width: 4px; height: 22px;
  background: var(--g700); border-radius: 2px; flex-shrink: 0;
}

/* Timeline */

.mkica-ext-timeline { display: flex; flex-direction: column; gap: 0; position: relative; padding-left: 28px; }

.mkica-ext-timeline::before {
  content: ''; position: absolute; left: 8px; top: 8px; bottom: 8px;
  width: 2px; background: var(--g200);
}

.mkica-ext-tl-item { display: flex; gap: 16px; position: relative; padding-bottom: 28px; }

.mkica-ext-tl-item:last-child { padding-bottom: 0; }

.mkica-ext-tl-marker {
  position: absolute; left: -24px; top: 4px;
  width: 14px; height: 14px; border-radius: 50%;
  border: 2px solid var(--g200); background: var(--white);
  flex-shrink: 0;
}

.mkica-ext-tl-done .mkica-ext-tl-marker { background: var(--g700); border-color: var(--g700); }

.mkica-ext-tl-active .mkica-ext-tl-marker {
  background: var(--gold); border-color: var(--gold);
  box-shadow: 0 0 0 4px rgba(201,168,76,.2);
}

.mkica-ext-tl-upcoming .mkica-ext-tl-marker { background: var(--g100); border-color: var(--g500); }

.mkica-ext-tl-body { padding-top: 0; }

.mkica-ext-tl-date {
  display: inline-block; font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--g700); margin-bottom: 4px;
}

.mkica-ext-tl-active .mkica-ext-tl-date { color: var(--gold) !important; }

.mkica-ext-tl-upcoming .mkica-ext-tl-date { color: var(--light); }

.mkica-ext-tl-body p { font-size: 14px; color: var(--mid); line-height: 1.6; margin: 0; }

.mkica-ext-tl-done .mkica-ext-tl-body p { color: var(--text); }

/* Features grid */

.mkica-ext-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

.mkica-ext-feature {
  display: flex; gap: 14px; align-items: flex-start;
  background: var(--g50); border: 1px solid var(--border);
  border-radius: var(--r); padding: 18px;
}

.mkica-ext-feature-icon {
  font-size: 24px; flex-shrink: 0;
  width: 44px; height: 44px; display: grid; place-items: center;
  background: var(--g100); border-radius: 10px;
}

.mkica-ext-feature strong { display: block; font-size: 14px; color: var(--g900); margin-bottom: 4px; }

.mkica-ext-feature p { font-size: 13px; color: var(--mid); line-height: 1.5; margin: 0; }

/* Financials */

.mkica-ext-financials { background: var(--g50); border: 1px solid var(--border); border-radius: 14px; padding: 32px; }

.mkica-ext-fin-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px; margin-bottom: 28px;
}

.mkica-ext-fin-stat {
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--r); padding: 18px; text-align: center;
}

.mkica-ext-fin-stat strong { display: block; font-size: 22px; font-weight: 800; color: var(--g700); margin-bottom: 4px; }

.mkica-ext-fin-stat span { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--light); }

.mkica-ext-fin-stat--needed { border-top: 3px solid var(--gold); }

.mkica-ext-fin-stat--needed strong { color: var(--gold) !important; }

.mkica-ext-breakdown h3 { font-size: 14px !important; font-weight: 700 !important; color: var(--g800) !important; margin: 0 0 12px !important; }

.mkica-ext-breakdown-items { border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; background: var(--white); }

.mkica-ext-breakdown-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 11px 16px; border-bottom: 1px solid var(--border);
  font-size: 14px;
}

.mkica-ext-breakdown-row:last-child { border-bottom: none; }

.mkica-ext-breakdown-total { background: var(--g100); font-weight: 700; }

.mkica-ext-amount { font-weight: 700; color: var(--g700); white-space: nowrap; padding-left: 16px; }

.mkica-ext-breakdown-total .mkica-ext-amount { color: var(--gold); font-size: 16px; }

/* How to help */

.mkica-ext-help-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

.mkica-ext-help-item {
  display: flex; gap: 16px; align-items: flex-start;
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--r); padding: 18px;
}

.mkica-ext-help-num {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--g700); color: var(--white);
  display: grid; place-items: center;
  font-size: 16px; font-weight: 700; flex-shrink: 0;
}

.mkica-ext-help-item strong { display: block; font-size: 14px; color: var(--g900); margin-bottom: 4px; }

.mkica-ext-help-item p { font-size: 13px; color: var(--mid); margin: 0; line-height: 1.5; }

/* Donate box */

.mkica-ext-donate-box {
  background: linear-gradient(135deg, var(--g900) 0%, var(--g800) 100%);
  border-radius: 14px; padding: 36px; color: var(--white); position: relative; overflow: hidden;
}

.mkica-ext-donate-box::before {
  content: ''; position: absolute; inset: 0;
  background-image: url("/wp-content/themes/mkica-child/assets/images/arabesque.svg");
  background-size: 110px 110px; opacity: .05; pointer-events: none;
}

.mkica-ext-donate-box h2 { color: var(--white) !important; border-bottom-color: rgba(255,255,255,.15) !important; position: relative; }

.mkica-ext-donate-box h2::before { background: var(--gold) !important; }

.mkica-ext-donate-box > p { color: rgba(255,255,255,.7); font-size: 15px; margin-bottom: 20px; position: relative; }

.mkica-ext-bank {
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r); overflow: hidden; margin-bottom: 20px; position: relative;
}

.mkica-ext-bank-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 11px 18px; border-bottom: 1px solid rgba(255,255,255,.07);
  font-size: 14px;
}

.mkica-ext-bank-row:last-child { border-bottom: none; }

.mkica-ext-bank-row span { color: rgba(255,255,255,.5); }

.mkica-ext-bank-row strong { color: var(--white); }

.mkica-ext-contact-row {
  display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0; position: relative;
}

.mkica-ext-contact-link {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
  border-radius: 7px; padding: 9px 16px; font-size: 13px; font-weight: 600;
  color: var(--white) !important; text-decoration: none !important;
  transition: background .18s;
}

.mkica-ext-contact-link:hover { background: rgba(255,255,255,.15) !important; }

.mkica-ext-charity-note {
  font-size: 11px; color: rgba(255,255,255,.35);
  text-transform: uppercase; letter-spacing: .1em; margin: 16px 0 12px; position: relative;
}

.mkica-ext-dua {
  font-size: 14px; color: var(--gold); font-style: italic;
  margin: 0 !important; position: relative;
}

/* Responsive */

@media (max-width: 700px) {
  .mkica-ext-features { grid-template-columns: 1fr; }

  .mkica-ext-fin-grid { grid-template-columns: repeat(2, 1fr); }

  .mkica-ext-help-grid { grid-template-columns: 1fr; }

  .mkica-ext-intro, .mkica-ext-donate-box { padding: 24px 20px; }

  .mkica-ext-financials { padding: 22px 18px; }

}

/* ============================================================

   SINGLE POST PAGE

   ============================================================ */

.mkica-single-post { max-width: 760px; margin: 0 auto; }

.mkica-single-thumb {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 28px;
  box-shadow: var(--shadow);
  background: var(--g100);
}

.mkica-single-thumb-img {
  width: 100%;
  height: auto;
  display: block;
  max-height: 520px;
  object-fit: cover;
}

.mkica-single-header { margin-bottom: 24px; }

.mkica-single-cat {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--g700);
  background: var(--g100);
  border: 1px solid var(--g200);
  padding: 3px 10px;
  border-radius: 20px;
  text-decoration: none !important;
  margin-bottom: 12px;
  margin-right: 6px;
}

.mkica-single-cat:hover { background: var(--g200) !important; }

.mkica-single-title {
  font-size: clamp(22px, 4vw, 34px) !important;
  font-weight: 800 !important;
  color: var(--g900) !important;
  line-height: 1.25 !important;
  letter-spacing: -.02em !important;
  margin: 8px 0 12px !important;
}

.mkica-single-meta {
  font-size: 13px;
  color: var(--light);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.mkica-single-content { margin-bottom: 40px; }

/* Post navigation */
.mkica-single-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding-top: 28px;
  border-top: 1px solid var(--border);
  margin-top: 40px;
}

.mkica-single-nav-link {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 18px;
  border: 1px solid var(--border);
  border-radius: 10px;
  text-decoration: none !important;
  transition: border-color .18s, background .18s;
  background: var(--white);
}

.mkica-single-nav-link:hover { border-color: var(--g200); background: var(--g50); }

.mkica-single-nav-next { text-align: right; }

.mkica-single-nav-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--g600);
}

.mkica-single-nav-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-clamp: 2;
}

@media (max-width: 520px) {
  .mkica-single-nav { grid-template-columns: 1fr; }
  .mkica-single-nav-next { text-align: left; }
}

/* ============================================================

   PRINT STYLES - handled by JS print window, not @media print

   ============================================================ */

@media print { body { display: none !important; } } /* safety: block accidental Ctrl+P of full page */

