/*
Theme Name:   Astra Child - Marin Consulting
Theme URI:    https://marinconsulting.com
Description:  Marin Consulting Child Theme for Astra
Author:       Marin Consulting
Template:     astra
Version:      1.0.0
*/

/* ================================================
   IMPORT GOOGLE FONTS
   ================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Playfair+Display:wght@500;600&display=swap');

/* ================================================
   CSS VARIABLES / BRAND COLORS
   ================================================ */
:root {
  --navy:        #042C53;
  --navy-mid:    #185FA5;
  --navy-light:  #E6F1FB;
  --navy-muted:  #85B7EB;
  --white:       #ffffff;
  --gray-100:    #F7F8FA;
  --gray-200:    #EAECF0;
  --gray-400:    #9EA8B3;
  --gray-700:    #3D4A58;
  --text-main:   #0D1B2A;
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', sans-serif;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --shadow-sm:   0 1px 4px rgba(4,44,83,0.07);
  --shadow-md:   0 4px 20px rgba(4,44,83,0.10);
  --transition:  all 0.22s ease;
}

/* ================================================
   GLOBAL RESET & BASE
   ================================================ */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font-body);
  color: var(--text-main);
  background: var(--white);
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; transition: var(--transition); }
img { max-width: 100%; height: auto; }

/* ================================================
   HIDE DEFAULT ASTRA HEADER & FOOTER
   ================================================ */
.site-header.ast-primary-header,
#ast-fixed-header,
.ast-above-header-wrap,
.ast-below-header-wrap,
.site-footer {
  display: none !important;
}

/* ================================================
   KILL LEFTOVER POLARIS / HOSTINGER AI STYLES
   ================================================ */
[class*="polaris-"],
[id*="polaris-"],
[class*="hb-header"],
[class*="hostinger-header"] {
  display: none !important;
}

/* Ensure our header always takes priority */
.mc-header-wrap {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* SOLID STICKY — JS handles fixed positioning (Elementor breaks CSS sticky) */
body:not(.mc-has-transparent-header) .mc-header-wrap {
  position: relative;
  z-index: 9999;
}
body:not(.mc-has-transparent-header) .mc-header-wrap.mc-wrap-fixed {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
}

/* Fallback — any sticky header wrap */
.mc-header-wrap:has(.mc-sticky),
.mc-header.mc-sticky ~ * {
  /* backup approach */
}

/* TRANSPARENT mode — wrap starts absolute, JS switches to fixed */
body.mc-has-transparent-header .mc-header-wrap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 9999;
}
body.mc-has-transparent-header .mc-header-wrap.mc-wrap-fixed {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
}

.mc-header {
  display: flex !important;
  visibility: visible !important;
}

/* ================================================
   HEADER WRAP — positions header relative to page
   ================================================ */
/* header-wrap position managed by mode-specific rules below */

/* Transparent mode — wrap is absolute so it overlays content */
/* transparent wrap position handled by body.mc-has-transparent-header */

/* ================================================
   TOP INFO BAR
   ================================================ */
.mc-topbar {
  background: var(--navy);
  padding: 8px 0;
  border-bottom: 1px solid rgba(133,183,235,0.15);
}
.mc-topbar-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mc-topbar-contact {
  display: flex;
  gap: 28px;
  list-style: none;
  margin: 0; padding: 0;
}
.mc-topbar-contact li {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  color: var(--navy-muted);
}
.mc-topbar-contact li i { font-size: 13px; }
.mc-topbar-contact a {
  color: var(--navy-muted);
  font-size: 12px;
}
.mc-topbar-contact a:hover { color: var(--white); }
.mc-topbar-certs {
  display: flex;
  gap: 10px;
  align-items: center;
}
.mc-cert-badge {
  font-size: 11px;
  color: var(--navy-muted);
  padding: 2px 10px;
  border: 1px solid rgba(133,183,235,0.25);
  border-radius: 20px;
  letter-spacing: 0.03em;
}

/* ================================================
   MAIN HEADER — BASE
   ================================================ */
/* header-wrap base - see mode rules */
.mc-header {
  background: #ffffff;
  position: relative;
  z-index: 9999;
  border-bottom: 1px solid #EAECF0;
  box-shadow: 0 1px 4px rgba(4,44,83,0.07);
  transition: background 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

/* ── STICKY — locks to top on scroll ── */
/* mc-sticky position handled by JS */

/* ── TRANSPARENT WRAP — position managed above and by JS ── */

/* ── TRANSPARENT HEADER — no background ── */
body.mc-has-transparent-header .mc-header {
  background: transparent !important;
  background-color: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
  position: relative;
}

/* ── FIXED WRAP — after scroll (JS adds class) ── */
/* duplicate mc-wrap-fixed removed */

/* ── SCROLLED — background set by JS using Customizer opacity values ── */
body.mc-has-transparent-header .mc-header.mc-scrolled {
  box-shadow: 0 2px 20px rgba(4,44,83,0.2) !important;
  border-bottom: 1px solid rgba(133,183,235,0.15) !important;
  /* background-color set dynamically by main.js */
}

/* ── No gap between header and hero ── */
body.mc-has-transparent-header .mc-content-wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ── Transparent nav links — white for dark hero ── */
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li a {
  color: #E6F1FB !important;
  background: transparent !important;
}
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li a:hover {
  color: #ffffff !important;
  background: rgba(255,255,255,0.12) !important;
}
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-logo-name {
  color: #ffffff !important;
}
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-logo-tagline {
  color: rgba(255,255,255,0.65) !important;
}
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-logo-icon {
  background: rgba(255,255,255,0.15) !important;
  border: 1px solid rgba(255,255,255,0.25) !important;
}
/* CTA button on transparent — colors controlled by Customizer via inline CSS */
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-btn-cta {
  /* Colors set by mc_dynamic_css() in functions.php */
}
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-btn-phone {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.2) !important;
  color: #E6F1FB !important;
}
/* Active/hover on transparent — subtle, not white box */
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li a:hover,
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li.current-menu-item > a,
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li.current_page_item > a,
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li.page_item.current_page_item > a,
body.mc-has-transparent-header .mc-header:not(.mc-scrolled) .mc-nav ul li.current-menu-ancestor > a {
  color: #ffffff !important;
  background: rgba(255,255,255,0.15) !important;
}

/* Dropdowns always solid */
body.mc-has-transparent-header .mc-nav ul li ul {
  background: #ffffff !important;
}
body.mc-has-transparent-header .mc-nav ul li ul li a {
  color: #3D4A58 !important;
  background: transparent !important;
}

/* ── Scrolled state — override colors ── */
body.mc-has-transparent-header .mc-header.mc-scrolled .mc-nav ul li a {
  color: #E6F1FB !important;
}
body.mc-has-transparent-header .mc-header.mc-scrolled .mc-logo-name {
  color: #ffffff !important;
}
body.mc-has-transparent-header .mc-header.mc-scrolled .mc-btn-cta {
  background: #185FA5 !important;
  border: none !important;
  color: #ffffff !important;
}
body.mc-has-transparent-header .mc-header.mc-scrolled .mc-logo-icon {
  background: rgba(255,255,255,0.15) !important;
}

/* ── All header elements transition smoothly ── */
.mc-header,
.mc-header .mc-nav ul li a,
.mc-header .mc-logo-name,
.mc-header .mc-logo-tagline,
.mc-header .mc-btn-cta,
.mc-header .mc-btn-phone,
.mc-header .mc-logo-icon {
  transition: all 0.3s ease;
}

.mc-header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

/* Logo */
.mc-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.mc-logo-icon {
  width: 42px; height: 42px;
  background: var(--navy);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.mc-logo-icon svg { width: 22px; height: 22px; fill: var(--navy-light); }
.mc-logo-text { line-height: 1.25; }
.mc-logo-name {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--navy);
  display: block;
}
.mc-logo-tagline {
  font-size: 10px;
  color: var(--gray-400);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: block;
  margin-top: 1px;
}

/* Navigation */
.mc-nav { display: flex; align-items: center; }
.mc-nav ul {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  gap: 4px;
}
.mc-nav ul li a {
  font-size: 14px;
  font-weight: 400;
  color: var(--gray-700);
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  display: block;
  transition: var(--transition);
}
/* Solid header hover/active */
body:not(.mc-has-transparent-header) .mc-nav ul li a:hover,
body:not(.mc-has-transparent-header) .mc-nav ul li.current-menu-item > a,
body:not(.mc-has-transparent-header) .mc-nav ul li.current_page_item > a {
  color: var(--navy);
  background: var(--navy-light);
}

/* Dropdown */
.mc-nav ul li { position: relative; }
.mc-nav ul li ul {
  display: none;
  position: absolute;
  top: 100%; /* No gap — flush against nav item */
  left: 0;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  box-shadow: var(--shadow-md);
  min-width: 220px;
  padding: 8px 6px 6px; /* Extra top padding bridges the gap */
  flex-direction: column;
  gap: 2px;
  z-index: 9999;
  margin-top: 0;
}
/* Invisible bridge — keeps hover alive between nav item and dropdown */
.mc-nav ul li::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 10px; /* covers any sub-pixel gap */
  background: transparent;
}
@media (min-width: 769px) { .mc-nav ul li:hover > ul { display: flex; } } /* desktop only - mobile handled by JS */
.mc-nav ul li ul li a {
  font-size: 13px;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  color: #3D4A58 !important;
  background: transparent !important;
  display: block !important;
  transition: background 0.15s, color 0.15s;
}
.mc-nav ul li ul li a:hover {
  background: #E6F1FB !important;
  color: #042C53 !important;
}

/* Header Actions */
.mc-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.mc-btn-phone {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--navy-mid);
  font-weight: 500;
  padding: 8px 14px;
  border: 1px solid var(--navy-light);
  border-radius: var(--radius-sm);
  background: var(--navy-light);
  transition: var(--transition);
}
.mc-btn-phone:hover { background: #d0e6f8; color: var(--navy); }
.mc-btn-phone i { font-size: 14px; }
.mc-btn-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--navy);
  color: var(--white) !important;
  font-size: 13px;
  font-weight: 500;
  padding: 10px 20px;
  border-radius: var(--radius-sm);
  transition: var(--transition);
  border: none;
  cursor: pointer;
  white-space: nowrap;
}
.mc-btn-cta:hover {
  background: var(--navy-mid);
  color: var(--white) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(4,44,83,0.25);
}
.mc-btn-cta i { font-size: 14px; }
.mc-mobile-toggle {
  display: none;
  background: none;
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  cursor: pointer;
  color: var(--navy);
  font-size: 20px;
}

/* ================================================
   FOOTER
   ================================================ */
.mc-footer {
  background: var(--navy);
  color: var(--navy-muted);
  margin-top: 0;
}

/* Footer Top */
.mc-footer-top {
  max-width: 1200px;
  margin: 0 auto;
  padding: 64px 32px 48px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: 48px;
  border-bottom: 1px solid rgba(133,183,235,0.12);
}

/* Footer Brand */
.mc-footer-brand {}
.mc-footer-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.mc-footer-logo-icon {
  width: 40px; height: 40px;
  background: rgba(230,241,251,0.12);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(133,183,235,0.2);
}
.mc-footer-logo-icon svg { width: 20px; height: 20px; fill: var(--navy-light); }
.mc-footer-logo-name {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 600;
  color: var(--white);
}
.mc-footer-desc {
  font-size: 14px;
  line-height: 1.75;
  color: var(--navy-muted);
  margin-bottom: 24px;
  max-width: 280px;
}
.mc-footer-certs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mc-footer-cert {
  font-size: 11px;
  color: var(--navy-muted);
  padding: 4px 10px;
  border: 1px solid rgba(133,183,235,0.2);
  border-radius: 20px;
}

/* Footer Columns */
.mc-footer-col h4 {
  font-size: 13px;
  font-weight: 600;
  color: var(--white);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(133,183,235,0.12);
}
.mc-footer-col ul {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mc-footer-col ul li a {
  font-size: 14px;
  color: var(--navy-muted);
  display: flex;
  align-items: center;
  gap: 7px;
  transition: var(--transition);
}
.mc-footer-col ul li a:hover {
  color: var(--white);
  padding-left: 4px;
}
.mc-footer-col ul li a i { font-size: 13px; }

/* Footer Contact */
.mc-footer-contact-list {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.mc-footer-contact-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.mc-footer-contact-list li .icon {
  width: 32px; height: 32px;
  background: rgba(230,241,251,0.08);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid rgba(133,183,235,0.15);
}
.mc-footer-contact-list li .icon i {
  font-size: 14px;
  color: var(--navy-muted);
}
.mc-footer-contact-list li .info {
  display: flex;
  flex-direction: column;
}
.mc-footer-contact-list li .info span {
  font-size: 11px;
  color: rgba(133,183,235,0.6);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 2px;
}
.mc-footer-contact-list li .info a,
.mc-footer-contact-list li .info p {
  font-size: 13px;
  color: var(--navy-muted);
  margin: 0;
  transition: var(--transition);
}
.mc-footer-contact-list li .info a:hover { color: var(--white); }

/* Footer Bottom */
.mc-footer-bottom {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mc-footer-bottom p {
  font-size: 12px;
  color: rgba(133,183,235,0.55);
  margin: 0;
}
.mc-footer-social {
  display: flex;
  gap: 8px;
}
.mc-footer-social a {
  width: 32px; height: 32px;
  background: rgba(230,241,251,0.07);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navy-muted);
  font-size: 15px;
  border: 1px solid rgba(133,183,235,0.12);
  transition: var(--transition);
}
.mc-footer-social a:hover {
  background: rgba(230,241,251,0.14);
  color: var(--white);
}

/* ================================================
   RESPONSIVE
   ================================================ */
@media (max-width: 1024px) {
  .mc-footer-top { grid-template-columns: 1fr 1fr; }
  .mc-btn-phone { display: none; }
}

@media (max-width: 768px) {
  .mc-topbar { display: none; }
  .mc-header-inner { padding: 0 20px; height: 64px; }
  .mc-nav, .mc-btn-cta, .mc-btn-phone { display: none; }
  .mc-mobile-toggle { display: flex; }

  /* ── FULLSCREEN MOBILE MENU ── */
  .mc-nav.mc-nav-open {
    display: block !important;
    position: fixed !important;
    top: 64px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    background: #042C53 !important;
    z-index: 99997 !important;
    overflow-y: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  body.admin-bar .mc-nav.mc-nav-open { top: 110px !important; }
  /* Mobile logo fix */
  .mc-logo {
    display: flex !important;
    align-items: center !important;
    max-width: 60% !important;
  }
  img.mc-custom-logo {
    max-height: 50px !important;
    width: auto !important;
    display: block !important;
  }


  /* Main ul */
  .mc-nav.mc-nav-open > ul {
    display: block !important;
    width: 100% !important;
    padding: 16px 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  /* Top-level li */
  .mc-nav.mc-nav-open > ul > li {
    display: block !important;
    width: 100% !important;
    position: relative !important;
    border-bottom: 1px solid rgba(133,183,235,0.12) !important;
  }

  /* Top-level link */
  .mc-nav.mc-nav-open > ul > li > a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 18px 28px !important;
    color: #E6F1FB !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    background: transparent !important;
    background-color: transparent !important;
    text-decoration: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Arrow span */
  .mc-nav.mc-nav-open > ul > li > a
  .mc-nav.mc-nav-open > ul > li.mc-submenu-open > a
  .mc-nav.mc-nav-open > ul > li > a
  .mc-nav.mc-nav-open > ul > li.mc-submenu-open > a

  /* Submenu ul — hidden by default */
  .mc-nav.mc-nav-open > ul > li > ul {
    display: none !important;
    position: static !important;
    background: rgba(255,255,255,0.04) !important;
    border: none !important;
    border-left: 3px solid rgba(133,183,235,0.25) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 0 8px 0 !important;
    margin: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    float: none !important;
  }

  /* Submenu open */
  .mc-nav.mc-nav-open > ul > li.mc-submenu-open > ul {
    display: block !important;
  }

  /* Submenu li */
  .mc-nav.mc-nav-open > ul > li > ul > li {
    display: block !important;
    width: 100% !important;
    border-bottom: 1px solid rgba(133,183,235,0.07) !important;
  }

  /* Submenu link */
  .mc-nav.mc-nav-open > ul > li > ul > li > a {
    display: block !important;
    padding: 14px 28px 14px 36px !important;
    color: #85B7EB !important;
    font-size: 15px !important;
    background: transparent !important;
    background-color: transparent !important;
    text-decoration: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .mc-nav.mc-nav-open > ul > li > ul > li > a:hover {
    color: #ffffff !important;
  }

  /* Kill ANY background on active/current items */
  .mc-nav.mc-nav-open > ul > li,
  .mc-nav.mc-nav-open > ul > li > a,
  .mc-nav.mc-nav-open > ul > li.current-menu-item,
  .mc-nav.mc-nav-open > ul > li.current-menu-item > a,
  .mc-nav.mc-nav-open > ul > li.current_page_item,
  .mc-nav.mc-nav-open > ul > li.current_page_item > a {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }
  /* Current page text white — never invisible */
  .mc-nav.mc-nav-open > ul > li.current-menu-item > a,
  .mc-nav.mc-nav-open > ul > li.current_page_item > a,
  .mc-nav.mc-nav-open > ul > li.current-menu-ancestor > a {
    color: #ffffff !important;
    background: transparent !important;
    background-color: transparent !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  /* On tap/click — prevent color flash */
  .mc-nav.mc-nav-open > ul > li > a:active,
  .mc-nav.mc-nav-open > ul > li > a:focus {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
  }

  /* Header stays above menu */
  .mc-header-wrap { z-index: 99999 !important; position: relative !important; }
  .mc-header { z-index: 99999 !important; }
  body.mc-menu-open .mc-header { background: #ffffff !important; }

  /* Footer responsive */
  .mc-footer-top { grid-template-columns: 1fr; padding: 48px 20px 32px; }
  .mc-footer-bottom { padding: 16px 20px; text-align: center; flex-direction: column; gap: 12px; }
}


/* ================================================
   BLOG / NEWS PAGE — home.php
   ================================================ */

/* Hero */
.mc-blog-hero {
  position: relative;
  background: #042C53;
  padding: 100px 32px 80px;
  text-align: center;
  overflow: hidden;
}
.mc-blog-hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(4,44,83,0.65);
  z-index: 1;
}
.mc-blog-hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  margin: 0 auto;
}
.mc-blog-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #85B7EB;
  margin-bottom: 20px;
}
.mc-blog-hero-line {
  width: 32px;
  height: 1px;
  background: #85B7EB;
  display: inline-block;
}
.mc-blog-hero-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 48px;
  font-weight: 600;
  color: #ffffff;
  margin: 0 0 20px;
  line-height: 1.15;
}
.mc-blog-hero-subtitle {
  font-size: 16px;
  color: #85B7EB;
  line-height: 1.75;
  margin: 0;
  max-width: 560px;
  margin: 0 auto;
}

/* Posts content area */
.mc-blog-content {
  background: #F7F8FA;
  padding: 64px 0 80px;
}
.mc-blog-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 32px;
}

/* Posts grid */
.mc-posts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 56px;
}

/* Post card */
.mc-post-card {
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #EAECF0;
  overflow: hidden;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  display: flex;
  flex-direction: column;
}
.mc-post-card:hover {
  box-shadow: 0 8px 32px rgba(4,44,83,0.10);
  transform: translateY(-2px);
}

/* Thumbnail */
.mc-post-thumb {
  display: block;
  width: 100%;
  height: 200px;
  overflow: hidden;
}
.mc-post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.mc-post-card:hover .mc-post-thumb img {
  transform: scale(1.04);
}
.mc-post-thumb--placeholder {
  background: linear-gradient(135deg, #042C53, #185FA5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.mc-post-thumb-icon i {
  font-size: 48px;
  color: rgba(230,241,251,0.35);
}

/* Post body */
.mc-post-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.mc-post-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.mc-post-date {
  font-size: 12px;
  color: #9EA8B3;
  display: flex;
  align-items: center;
  gap: 5px;
}
.mc-post-date i { font-size: 13px; }
.mc-post-cat {
  font-size: 11px;
  font-weight: 500;
  color: #185FA5;
  background: #E6F1FB;
  padding: 2px 10px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.mc-post-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 12px;
}
.mc-post-title a {
  color: #042C53;
  text-decoration: none;
  transition: color 0.2s;
}
.mc-post-title a:hover { color: #185FA5; }
.mc-post-excerpt {
  font-size: 14px;
  color: #5F5E5A;
  line-height: 1.7;
  margin: 0 0 20px;
  flex: 1;
}
.mc-post-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: #185FA5;
  text-decoration: none;
  transition: gap 0.2s;
}
.mc-post-link:hover { gap: 10px; color: #042C53; }

/* Pagination */
.mc-blog-pagination {
  display: flex;
  justify-content: center;
}
.mc-blog-pagination .nav-links {
  display: flex;
  gap: 8px;
  align-items: center;
}
.mc-blog-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  border-radius: 8px;
  border: 1px solid #EAECF0;
  font-size: 14px;
  color: #3D4A58;
  text-decoration: none;
  transition: all 0.2s;
}
.mc-blog-pagination .page-numbers.current,
.mc-blog-pagination .page-numbers:hover {
  background: #042C53;
  color: #ffffff;
  border-color: #042C53;
}
.mc-blog-pagination .prev,
.mc-blog-pagination .next {
  width: auto;
  padding: 0 16px;
  gap: 6px;
  font-size: 13px;
}

/* No posts */
.mc-no-posts {
  text-align: center;
  padding: 80px 20px;
}
.mc-no-posts i { font-size: 56px; color: #EAECF0; margin-bottom: 20px; display: block; }
.mc-no-posts h2 { font-family: 'Playfair Display',serif; color: #042C53; margin-bottom: 10px; }
.mc-no-posts p { color: #9EA8B3; }

/* Responsive */
@media (max-width: 900px) {
  .mc-posts-grid { grid-template-columns: repeat(2, 1fr); }
  .mc-blog-hero-title { font-size: 36px; }
}
@media (max-width: 600px) {
  .mc-posts-grid { grid-template-columns: 1fr; }
  .mc-blog-hero { padding: 80px 20px 60px; }
  .mc-blog-hero-title { font-size: 28px; }
  .mc-blog-inner { padding: 0 20px; }
}

/* ================================================
   SINGLE POST — LAYOUT & TYPOGRAPHY FIX
   ================================================ */

/* Fix transparent header overlapping single post title */
body.single .mc-content-wrap,
body.single-post .mc-content-wrap {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Add top spacing on single post to clear the header */
body.single .ast-container,
body.single-post .ast-container,
body.single #primary,
body.single-post #primary {
  padding-top: 40px !important;
}

/* Single post title */
body.single .entry-title,
body.single-post .entry-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 38px !important;
  font-weight: 600 !important;
  color: #042C53 !important;
  line-height: 1.2 !important;
  margin-bottom: 16px !important;
}

/* Post meta (date, author, category) */
body.single .entry-meta,
body.single-post .entry-meta {
  color: #9EA8B3 !important;
  font-size: 13px !important;
  margin-bottom: 32px !important;
  padding-bottom: 24px !important;
  border-bottom: 1px solid #EAECF0 !important;
}
body.single .entry-meta a,
body.single-post .entry-meta a {
  color: #185FA5 !important;
}

/* Featured image */
body.single .ast-single-featured-image-wrap,
body.single-post .ast-single-featured-image-wrap {
  margin-bottom: 36px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
body.single .ast-single-featured-image-wrap img,
body.single-post .ast-single-featured-image-wrap img {
  width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
}

/* Post content typography */
body.single .entry-content,
body.single-post .entry-content {
  font-size: 16px !important;
  line-height: 1.85 !important;
  color: #3D4A58 !important;
}
body.single .entry-content p,
body.single-post .entry-content p {
  margin-bottom: 24px !important;
}
body.single .entry-content h2,
body.single-post .entry-content h2 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 26px !important;
  color: #042C53 !important;
  margin: 40px 0 16px !important;
}
body.single .entry-content h3,
body.single-post .entry-content h3 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 20px !important;
  color: #042C53 !important;
  margin: 32px 0 12px !important;
}

/* Post content links */
body.single .entry-content a,
body.single-post .entry-content a {
  color: #185FA5 !important;
  text-decoration: underline !important;
}

/* Blockquote */
body.single .entry-content blockquote,
body.single-post .entry-content blockquote {
  border-left: 4px solid #185FA5 !important;
  background: #E6F1FB !important;
  padding: 20px 24px !important;
  margin: 32px 0 !important;
  border-radius: 0 8px 8px 0 !important;
  font-style: italic !important;
  color: #042C53 !important;
}

/* Post navigation (prev/next) */
body.single .ast-post-navigation,
body.single-post .ast-post-navigation,
body.single .post-navigation,
body.single-post .post-navigation {
  border-top: 1px solid #EAECF0 !important;
  padding-top: 32px !important;
  margin-top: 48px !important;
}
body.single .nav-previous a,
body.single .nav-next a,
body.single-post .nav-previous a,
body.single-post .nav-next a {
  color: #185FA5 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
body.single .nav-previous a:hover,
body.single .nav-next a:hover {
  color: #042C53 !important;
}

/* Max width for readability */
body.single #primary,
body.single-post #primary {
  max-width: 800px !important;
  margin: 0 auto !important;
}

/* Fix: when transparent header is ON, push content below header height */
body.mc-has-transparent-header.single .site-content,
body.mc-has-transparent-header.single-post .site-content {
  padding-top: 100px !important;
}

/* Tags */
body.single .ast-post-footer .tag-links a,
body.single-post .ast-post-footer .tag-links a {
  background: #E6F1FB !important;
  color: #042C53 !important;
  padding: 4px 12px !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  text-decoration: none !important;
  margin-right: 6px !important;
  display: inline-block !important;
}
body.single .ast-post-footer .tag-links a:hover,
body.single-post .ast-post-footer .tag-links a:hover {
  background: #042C53 !important;
  color: #ffffff !important;
}

/* Responsive */
@media (max-width: 768px) {
  body.single .entry-title,
  body.single-post .entry-title {
    font-size: 26px !important;
  }
  body.single #primary,
  body.single-post #primary {
    padding: 20px 16px !important;
  }
}

/* ================================================
   BLOG — BRAND COLORS ONLY (no layout overrides)
   Astra Customizer controls all layout settings
   ================================================ */
.blog .entry-title a { color: #042C53; }
.blog .entry-title a:hover { color: #185FA5; }
.blog .ast-read-more { color: #185FA5; font-weight: 500; }
.blog .ast-read-more:hover { color: #042C53; }
.blog .posted-on a { color: #185FA5; }
.blog .page-numbers.current { background: #042C53; color: #fff; }
.blog .page-numbers:hover { background: #042C53; color: #fff; }

/* ================================================
   LOGO DISPLAY — mc-custom-logo (our own class)
   No Astra interference since we output the img directly
   ================================================ */
a.mc-logo,
a.mc-logo--img {
  display: flex;
  align-items: center;
  text-decoration: none !important;
  flex-shrink: 0;
  line-height: 0;
}

/* Our custom logo image — full control */
img.mc-custom-logo {
  width: auto;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transition: height 0.35s ease, opacity 0.2s ease;
}

/* Shrinks when header scrolls */
.mc-header.mc-scrolled img.mc-custom-logo {
  width: auto;
}

/* Hover */
a.mc-logo--img:hover img.mc-custom-logo { opacity: 0.85; }

/* ================================================
   DISABLE ASTRA HEADER BUILDER OUTPUT
   Our header.php handles everything
   ================================================ */

/* Hide any Astra header builder elements if they still render */
#ast-fixed-header,
.ast-above-header-wrap,
.ast-below-header-wrap,
.ast-primary-header-bar,
.main-header-bar-wrap,
.ast-hfb-header > .site-header,
body.ast-hfb-header .site-header:not(.mc-header) {
  display: none !important;
}

/* Make sure our header always shows */
.mc-header-wrap,
.mc-header {
  display: block !important;
}
.mc-header-inner {
  display: flex !important;
}

/* ================================================
   LOGO — ALL SCENARIOS
   ================================================ */
.mc-logo {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
}
.mc-logo .custom-logo-link {
  display: flex !important;
  align-items: center !important;
  line-height: 0 !important;
}
/* Override ALL width/height on logo img regardless of source */
.mc-logo img,
.mc-logo img.custom-logo,
.mc-logo img.mc-custom-logo,
.mc-header-inner .mc-logo img {
  width: auto !important;
  max-width: none !important;
  max-height: none !important;
  display: block !important;
  transition: height 0.35s ease !important;
}
/* Shrink when scrolled */
.mc-header.mc-scrolled .mc-logo img,
.mc-header.mc-scrolled .mc-logo img.custom-logo {
  width: auto !important;
}

/* ================================================
   MC LOGO — ALL SELECTORS
   ================================================ */
.mc-logo {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
.mc-logo .mc-logo-link,
.mc-logo a {
  display: flex !important;
  align-items: center !important;
  text-decoration: none !important;
  line-height: 0 !important;
}
.mc-logo img,
.mc-logo img.mc-custom-logo,
.mc-logo .mc-logo-link img,
.mc-header-inner .mc-logo img {
  /* height set by Customizer via inline CSS */
  width: auto !important;
  max-width: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transition: height 0.35s ease !important;
}
.mc-header.mc-scrolled .mc-logo img,
.mc-header.mc-scrolled .mc-logo img.mc-custom-logo {
  /* scrolled height set by Customizer via inline CSS */
  width: auto !important;
}
.mc-logo-text-only .mc-logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 20px;
  font-weight: 600;
  color: #042C53;
}

/* ================================================
   KILL ASTRA TRANSPARENT LOGO HIDING
   Astra hides logo on transparent headers — we override
   ================================================ */
.ast-inherit-site-logo-transparent .mc-logo img,
.ast-inherit-site-logo-transparent .mc-logo .mc-custom-logo,
.ast-header-sticked .mc-logo img,
body .mc-logo img {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  /* height controlled by Customizer */
  width: auto !important;
}

/* Also kill any Astra inline display:none on logo */
.ast-transparent-header .mc-logo img,
.ast-primary-header .mc-logo img {
  display: block !important;
  visibility: visible !important;
}

/* ================================================
   NUCLEAR LOGO FIX — absolute last resort
   ================================================ */
img.mc-custom-logo {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  max-width: 300px !important;
  min-height: 30px !important;
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  clip: unset !important;
  clip-path: none !important;
}

/* STICKY — handled by JS (position:sticky broken by Elementor template) */
.mc-header.mc-sticky {
  /* position managed by JS */
}

/* Arrow for mobile submenu */
.mc-sub-arrow { display: none; }
@media (max-width: 768px) {
  .mc-nav.mc-nav-open > ul > li > a .mc-sub-arrow {
    display: inline-block !important;
    margin-left: auto !important;
    font-size: 22px !important;
    color: #85B7EB !important;
    flex-shrink: 0 !important;
    float: right !important;
  }
  .mc-nav.mc-nav-open > ul > li.mc-submenu-open > a .mc-sub-arrow {
    transform: rotate(90deg) !important;
    display: inline-block !important;
  }
}

/* Mobile logo sizing */
@media (max-width: 768px) {
  .mc-logo { display: flex !important; align-items: center !important; flex-shrink: 1 !important; max-width: 65% !important; overflow: hidden !important; }
  img.mc-custom-logo { height: 50px !important; width: auto !important; max-width: 100% !important; display: block !important; visibility: visible !important; opacity: 1 !important; }
  .mc-header-inner { gap: 12px !important; }
}

/* Disable desktop dropdown on mobile - use JS toggle instead */
@media (max-width: 768px) {
  .mc-nav ul li:hover > ul {
    display: none !important;
  }
  .mc-nav ul li ul {
    display: none !important;
  }
}

/* FORCE disable ALL dropdown hover on mobile */
@media (max-width: 768px) {
  .mc-nav ul li:hover > ul,
  .mc-nav ul li:focus > ul,
  .mc-nav > ul > li:hover > ul {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  /* Only show via JS class */
  .mc-nav ul li.mc-submenu-open > ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

/* Mobile: completely remove hover dropdown - touch devices fire hover on tap */
@media (hover: none) {
  .mc-nav ul li:hover > ul {
    display: none !important;
  }
  .mc-nav ul li.mc-submenu-open > ul {
    display: block !important;
    position: static !important;
  }
}
@media (max-width: 768px) {
  .mc-nav ul li:hover > ul {
    display: none !important;
  }
  .mc-nav ul li.mc-submenu-open > ul {
    display: block !important;
    position: static !important;
    width: 100% !important;
    box-shadow: none !important;
    background: rgba(255,255,255,0.04) !important;
    border: none !important;
    top: auto !important;
    left: auto !important;
    padding: 0 0 8px 28px !important;
  }
}

/* Fix gap on sticky header pages - Astra adds padding for header height */
body.ast-header-break-point .site-content,
body.ast-header-break-point #content,
body.ast-page-builder-template .site-content,
body.ast-page-builder-template #content,
body:not(.mc-has-transparent-header) .mc-content-wrap > .elementor:first-child,
body:not(.mc-has-transparent-header) .mc-content-wrap {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Service/Team pages hero — compensate for sticky header height */
body:not(.mc-has-transparent-header) .mc-content-wrap {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* Remove any auto margin Astra adds for sticky header */
body.ast-header-break-point.mc-site #page,
body.ast-header-break-point.mc-site .site,
body.mc-site #masthead ~ * {
  margin-top: 0 !important;
  padding-top: 0 !important;
}