/**
 * Theme Name:     Hello Elementor Child
 * Author:         Elementor Team
 * Template:       hello-elementor
 * Text Domain:	   hello-elementor-child
 * Description:    Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
 */
 
 
 /*
 * Mahāvastu – Header & Footer Styles
 * Place in your child theme's CSS (style.css or enqueue separately)
 * ─────────────────────────────────────────────────────────────────
 */

/* ── Tokens ──────────────────────────────────────────────────── */
:root {
	--mv-font:          'DM Sans', system-ui, sans-serif;
	--mv-color-bg:      #f7f7f5;
	--mv-color-text:    #1a1a1a;
	--mv-color-muted:   #6b6b6b;
	--mv-color-cta-bg:  #c8f135;   /* lime-green pill */
	--mv-color-cta-text:#1a1a1a;
	--mv-border:        1px solid rgba(0,0,0,.09);
	--mv-radius-pill:   999px;
	--mv-header-h:      68px;
	--mv-transition:    .2s ease;
}

/* ── Base reset for our elements ─────────────────────────────── */
.mahavastu-header *,
.mahavastu-footer * {
	box-sizing: border-box;
}

/* ═══════════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════════ */
.mahavastu-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	width: 100%;
	height: var(--mv-header-h);
	background: var(--mv-color-bg);
	border-bottom: var(--mv-border);
	font-family: var(--mv-font);
}

.mahavastu-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 32px;
	height: 100%;
	gap: 24px;
}

/* ── Logo ────────────────────────────────────────────────────── */
.mahavastu-header__logo a,
.mahavastu-header__logo a:hover {
	display: flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: var(--mv-color-text);
}

/* Custom-logo image sizing */
.mahavastu-header__logo .custom-logo {
	height: 36px;
	width: auto;
	display: block;
}

/* Text logo fallback */
.mahavastu-header__logo-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--mv-color-text);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -.5px;
	flex-shrink: 0;
}

.mahavastu-header__logo-text {
	font-size: 16px;
	font-weight: 500;
	letter-spacing: -.2px;
	color: var(--mv-color-text);
}

.mahavastu-header__logo-macron {
	/* macron ā stays part of normal text */
}

/* ── Nav ─────────────────────────────────────────────────────── */
.mahavastu-header__nav {
	flex: 1;
	display: flex;
	justify-content: center;
}

.mahavastu-nav__list {
	display: flex;
	align-items: center;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mahavastu-nav__list li a {
	display: inline-block;
	padding: 6px 14px;
	font-size: 14px;
	font-weight: 450;
	color: var(--mv-color-muted);
	text-decoration: none;
	border-radius: var(--mv-radius-pill);
	transition: color var(--mv-transition), background var(--mv-transition);
}

.mahavastu-nav__list li a:hover,
.mahavastu-nav__list li.current-menu-item > a,
.mahavastu-nav__list li.current-page-ancestor > a {
	color: var(--mv-color-text);
	background: rgba(0,0,0,.05);
}

/* ── CTA Button ──────────────────────────────────────────────── */
.mahavastu-btn--cta {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	padding: 10px 22px;
	border-radius: var(--mv-radius-pill);
	background: var(--mv-color-cta-bg);
	color: var(--mv-color-cta-text);
	font-family: var(--mv-font);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	letter-spacing: -.1px;
	transition: filter var(--mv-transition), transform var(--mv-transition);
	flex-shrink: 0;
}

.mahavastu-btn--cta:hover {
	filter: brightness(.93);
	transform: translateY(-1px);
}

.mahavastu-btn--cta:active {
	transform: translateY(0);
	filter: brightness(.88);
}

/* ═══════════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════════ */
.mahavastu-footer {
	width: 100%;
	background: var(--mv-color-bg);
	border-top: var(--mv-border);
	font-family: var(--mv-font);
}

.mahavastu-footer__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 1280px;
	margin: 0 auto;
	padding: 22px 32px;
	gap: 24px;
}

/* ── Footer brand block ──────────────────────────────────────── */
.mahavastu-footer__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.mahavastu-footer__logo-link {
	display: flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: var(--mv-color-text);
}

.mahavastu-footer__logo-link:hover {
	opacity: .75;
}

/* Custom logo in footer */
.mahavastu-footer__logo-link .custom-logo {
	height: 28px;
	width: auto;
}

.mahavastu-footer__logo-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--mv-color-text);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	flex-shrink: 0;
}

.mahavastu-footer__logo-text {
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -.2px;
	color: var(--mv-color-text);
}

.mahavastu-footer__sep {
	color: var(--mv-color-muted);
	font-size: 15px;
}

.mahavastu-footer__copy {
	font-size: 14px;
	color: var(--mv-color-muted);
}

/* ── Footer nav ──────────────────────────────────────────────── */
.mahavastu-footer__nav {
	display: flex;
	align-items: center;
	gap: 28px;
}

.mahavastu-footer__list {
	display: flex;
	align-items: center;
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mahavastu-footer__list li a,
.mahavastu-footer__email {
	font-size: 14px;
	color: var(--mv-color-muted);
	text-decoration: none;
	transition: color var(--mv-transition);
}

.mahavastu-footer__list li a:hover,
.mahavastu-footer__email:hover {
	color: var(--mv-color-text);
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE  (≤ 768 px)
   – Header: logo + CTA only, nav hidden
═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

	/* Header */
	.mahavastu-header__inner {
		padding: 0 20px;
	}

	/* Hide nav completely on mobile */
	.mahavastu-header__nav {
		display: none;
	}

	/* Slightly smaller CTA */
	.mahavastu-btn--cta {
		padding: 9px 18px;
		font-size: 13px;
	}

	/* Footer – stack vertically */
	.mahavastu-footer__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		padding: 20px;
	}

	.mahavastu-footer__nav {
		flex-wrap: wrap;
		gap: 16px;
	}

	.mahavastu-footer__list {
		gap: 16px;
	}
}

/* ── Tiny phones (≤ 375 px) ──────────────────────────────────── */
@media (max-width: 375px) {
	.mahavastu-header__inner {
		padding: 0 16px;
	}

	.mahavastu-btn--cta {
		padding: 8px 14px;
		font-size: 12px;
	}
}