/* =========================================================
   MoneyWiseNation – Astra + Elementor Universal CSS Pack
   Purpose: Cleaner typography, spacing rhythm, card UI,
   header/logo sizing, button/form polish, mobile readability.
   ========================================================= */

/* ---------- 1) Global typography + readability ---------- */
:root{
  --mwn-text: #222;
  --mwn-muted: #555;
  --mwn-soft: #6b7280;
  --mwn-border: rgba(0,0,0,0.08);
  --mwn-bgsoft: #f8f9fb;
  --mwn-radius: 10px;
  --mwn-shadow: 0 10px 25px rgba(0,0,0,0.06);
  --mwn-shadow2: 0 6px 16px rgba(0,0,0,0.06);
}

body{
  color: var(--mwn-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  line-height: 1.6;
}

p, li{
  line-height: 1.7;
}

a{
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* Headings: calm, authoritative */
h1,h2,h3,h4,h5,h6{
  color: #111;
  line-height: 1.25;
  letter-spacing: -0.2px;
}

h1{ font-size: clamp(26px, 2.4vw, 38px); }
h2{ font-size: clamp(20px, 1.8vw, 28px); }
h3{ font-size: clamp(18px, 1.4vw, 22px); }

/* Better content width on large screens */
.ast-container, .site-content .ast-container{
  max-width: 1240px;
}

/* ---------- 2) Header + logo sizing (Astra) ---------- */
/* Keep header compact and professional */
.ast-primary-header-bar{
  min-height: 64px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--mwn-border);
}

/* Logo control: works for most Astra header configs */
.custom-logo-link img,
.site-branding img.custom-logo{
  max-height: 56px;
  width: auto;
}

/* Mobile header: tighter */
@media (max-width: 768px){
  .ast-primary-header-bar{
    min-height: 56px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .custom-logo-link img,
  .site-branding img.custom-logo{
    max-height: 44px;
  }
}

/* ---------- 3) Elementor section spacing rhythm ---------- */
/* Prevent crowded blocks */
.elementor-section{
  margin: 0;
}
.elementor-section .elementor-container{
  padding-left: 20px;
  padding-right: 20px;
}
@media (max-width: 768px){
  .elementor-section .elementor-container{
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* Common widget spacing normalization */
.elementor-widget-heading{
  margin-bottom: 14px;
}
.elementor-widget-text-editor{
  margin-bottom: 14px;
}

/* ---------- 4) Post cards (Astra blog grids + Elementor post widgets) ---------- */
/* Astra blog/archive cards */
.ast-archive-post,
.ast-blog-single-element,
.ast-article-post,
.blog .ast-article-post,
.archive .ast-article-post{
  border: 1px solid var(--mwn-border);
  border-radius: var(--mwn-radius);
  box-shadow: var(--mwn-shadow2);
  background: #fff;
  overflow: hidden;
}

/* Card padding */
.ast-archive-post .ast-blog-featured-section + .post-content,
.ast-article-post .post-content{
  padding: 18px;
}

/* Featured images: consistent */
.ast-archive-post img,
.ast-article-post img{
  display: block;
}

/* Titles: clean and readable */
.ast-archive-post .entry-title,
.ast-article-post .entry-title{
  margin: 0 0 10px 0;
  font-weight: 650;
  line-height: 1.35;
}

/* Excerpts: calm */
.ast-archive-post .entry-content,
.ast-article-post .entry-content{
  color: var(--mwn-muted);
}

/* Reduce clutter: meta text smaller (you can remove if you want to keep meta) */
.ast-archive-post .entry-meta,
.ast-article-post .entry-meta{
  font-size: 13px;
  color: var(--mwn-soft);
}

/* Hover: subtle, premium */
.ast-archive-post:hover,
.ast-article-post:hover{
  transform: translateY(-2px);
  transition: transform 160ms ease, box-shadow 160ms ease;
  box-shadow: var(--mwn-shadow);
}

/* Elementor Posts widget cards */
.elementor-widget-posts .elementor-post{
  border: 1px solid var(--mwn-border);
  border-radius: var(--mwn-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--mwn-shadow2);
}
.elementor-widget-posts .elementor-post__text{
  padding: 16px;
}
.elementor-widget-posts .elementor-post__title{
  margin: 0 0 10px 0;
  font-weight: 650;
  line-height: 1.35;
}
.elementor-widget-posts .elementor-post__excerpt{
  color: var(--mwn-muted);
}

/* ---------- 5) Buttons: consistent and trustworthy ---------- */
button,
input[type="button"],
input[type="submit"],
.ast-button,
.elementor-button{
  border-radius: 6px !important;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.elementor-button{
  padding: 12px 22px;
}

/* ---------- 6) Forms: cleaner fields ---------- */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select{
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.12);
  padding: 12px 12px;
  background: #fff;
}

input:focus, textarea:focus, select:focus{
  outline: none;
  border-color: rgba(0,0,0,0.35);
  box-shadow: 0 0 0 3px rgba(0,0,0,0.08);
}

/* ---------- 7) Sidebar widgets: tidy cards ---------- */
.widget{
  border: 1px solid var(--mwn-border);
  border-radius: var(--mwn-radius);
  background: #fff;
  box-shadow: var(--mwn-shadow2);
  padding: 18px;
  margin-bottom: 22px;
}

/* ---------- 8) Images & embeds ---------- */
img{
  max-width: 100%;
  height: auto;
}
iframe{
  max-width: 100%;
}

/* ---------- 9) Mobile readability improvements ---------- */
@media (max-width: 768px){
  body{
    font-size: 16px;
  }
  p, li{
    font-size: 16px;
    line-height: 1.75;
  }
  .ast-archive-post .entry-title,
  .ast-article-post .entry-title{
    font-size: 18px;
  }
}

/* ---------- 10) Optional: hide noisy meta on homepage cards ----------
   If you WANT to hide dates/authors in grids, uncomment below.
   NOTE: This will hide meta everywhere those selectors match.
------------------------------------------------------------------ */
/*
.home .ast-archive-post .entry-meta,
.home .ast-article-post .entry-meta{
  display: none !important;
}
*/

/* hide overflow of screen */
html, body {
  overflow-x: hidden;
}


/* Remove focus outline from Astra mobile menu dropdown icons */
/* Remove focus ring only for mouse/touch users */
/* Remove outline on mobile hamburger open/close */
.ast-button-wrap .ast-mobile-menu-trigger-minimal:focus,
.ast-button-wrap .ast-mobile-menu-trigger-fill:focus,
.ast-button-wrap .ast-mobile-menu-trigger-outline:focus {
    outline: none !important;
    border-width: 0 !important;
}

/* Remove focus outline around the close X */
.ast-mobile-popup-drawer.active .menu-toggle-close:focus {
    outline: none !important;
    box-shadow: none !important;
    border-width: 0 !important;
}

/* Remove outline on dropdown toggles in mobile menu */
.ast-builder-menu-mobile .main-navigation .menu-item.menu-item-has-children > .ast-menu-toggle,
.ast-builder-menu-mobile .main-navigation .menu-item.menu-item-has-children > .ast-menu-toggle:focus {
    outline: none !important;
    border-width: 0 !important;
}


/* related blogs layout */

#jp-relatedposts .jp-relatedposts-post-title a {
        color: var(--e-global-color-astglobalcolor2);
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
    font-size: var(--e-global-typography-secondary-font-size);
    font-weight: var(--e-global-typography-secondary-font-weight);
}

#jp-relatedposts .jp-relatedposts-items-visual h4.jp-relatedposts-post-title{
	    margin: 10px 0px;
}

#jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post{
	padding: 0px;
	margin-right:18px;
	margin-bottom: 0px;
	border: 1px solid gray;
	border-radius: 10px;
	overflow:hidden;
	opacity: 1;
	padding-bottom: 10px

	
}
#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post{
	    width: 30%;

}
#jp-relatedposts .jp-relatedposts-items-visual h4.jp-relatedposts-post-title,
#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-date,
#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-context{
	padding: 0px 5px;
}
.sd-content .share-customize-link{
	display:none;
}

@media(max-width: 768px){
	#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post{
	    width: 100%;
		margin-bottom: 10px;

}
	#jp-relatedposts .jp-relatedposts-items-visual .jp-relatedposts-post img.jp-relatedposts-post-img{
		display:none;
	}
}

/* end of related blogs layout */