/* =========================================================
   EnviraH — design system  (Astra child)
   Brand: navy (Envira) + green (H) + mint (test tube)
   ========================================================= */

:root {
	/* ---- brand ---- */
	--e-navy:        #1B3A5C;
	--e-navy-deep:   #12293F;
	--e-navy-soft:   #EAF0F6;
	--e-green:       #2D6A4F;
	--e-green-bright:#40916C;
	--e-green-soft:  #E7F3EC;
	--e-mint:        #7CC9A0;
	--e-mint-soft:   #EBF7F1;

	/* ---- neutrals ---- */
	--e-ink:    #16202B;
	--e-body:   #46545F;
	--e-muted:  #6B7A86;
	--e-line:   #E1E7EC;
	--e-bg:     #FFFFFF;
	--e-bg-alt: #F5F8F7;
	--e-bg-navy:#12293F;

	/* ---- type ---- */
	--e-font:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	--e-font-ar: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif;

	/* ---- shape ---- */
	--e-radius:    14px;
	--e-radius-sm: 10px;
	--e-radius-lg: 22px;
	--e-shadow:    0 2px 8px rgba(18,41,63,.06), 0 12px 32px rgba(18,41,63,.08);
	--e-shadow-sm: 0 1px 3px rgba(18,41,63,.08), 0 4px 14px rgba(18,41,63,.06);
	--e-ring:      0 0 0 3px rgba(64,145,108,.28);

	/* ---- rhythm ---- */
	--e-container: 1200px;
	--e-section-y: clamp(3.5rem, 7vw, 6.5rem);

	/* ---- re-map Astra's global palette to EnviraH ---- */
	--ast-global-color-0: #40916C;   /* links            */
	--ast-global-color-1: #2D6A4F;   /* link hover       */
	--ast-global-color-2: #16202B;   /* headings / text  */
	--ast-global-color-3: #46545F;   /* body text        */
	--ast-global-color-4: #1B3A5C;   /* primary (navy)   */
	--ast-global-color-5: #2D6A4F;   /* secondary (green)*/
	--ast-global-color-6: #F5F8F7;   /* alt background   */
	--ast-global-color-7: #EBF7F1;   /* subtle bg        */
	--ast-global-color-8: #E1E7EC;   /* borders          */
}

/* Astra sets body/heading fonts inline from the old starter import — reclaim them. */
body,
button,
input,
select,
optgroup,
textarea,
.ast-button,
.ast-custom-button,
.site-title,
.site-title a {
	font-family: var(--e-font) !important;
}
h1, h2, h3, h4, h5, h6,
.entry-content :where(h1, h2, h3, h4, h5, h6),
.wp-block-heading {
	font-family: var(--e-font) !important;
}
body.rtl,
body.rtl button,
body.rtl input,
body.rtl select,
body.rtl textarea,
body.rtl h1, body.rtl h2, body.rtl h3, body.rtl h4, body.rtl h5, body.rtl h6,
body.rtl .wp-block-heading,
body.envirah-ar, body.envirah-ar h1, body.envirah-ar h2, body.envirah-ar h3, body.envirah-ar h4 {
	font-family: var(--e-font-ar) !important;
}

/* ---------- base ---------- */
body {
	font-family: var(--e-font);
	color: var(--e-body);
	font-size: 17px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	background: var(--e-bg);
}
body.envirah-ar,
body.rtl {
	font-family: var(--e-font-ar);
	line-height: 1.85;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.ast-single-post .entry-title {
	font-family: var(--e-font);
	color: var(--e-ink);
	font-weight: 700;
	line-height: 1.22;
	letter-spacing: -0.01em;
}
body.envirah-ar h1, body.rtl h1,
body.envirah-ar h2, body.rtl h2,
body.envirah-ar h3, body.rtl h3,
body.envirah-ar h4, body.rtl h4 {
	font-family: var(--e-font-ar);
	letter-spacing: 0;
	font-weight: 800;
}

h1 { font-size: clamp(2.1rem, 4.6vw, 3.35rem); }
h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
h3 { font-size: clamp(1.3rem, 2.2vw, 1.6rem); }

a { color: var(--e-green); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--e-green-bright); }

strong { color: var(--e-ink); }

::selection { background: var(--e-mint); color: var(--e-navy-deep); }

/* ---------- layout width ---------- */
.ast-container,
.site-content .ast-container {
	max-width: var(--e-container);
}

/* ---------- buttons ---------- */
.wp-block-button__link,
.ast-button,
.menu-toggle,
button.wp-element-button,
.elementor-button,
input[type="submit"],
.envirah-btn {
	--btn-bg: var(--e-green);
	background-color: var(--btn-bg);
	color: #fff;
	font-weight: 600;
	font-size: .98rem;
	letter-spacing: .01em;
	border: 0;
	border-radius: 999px;
	padding: .85em 1.8em;
	transition: transform .12s ease, background-color .15s ease, box-shadow .15s ease;
	box-shadow: 0 6px 18px rgba(45,106,79,.24);
}
.wp-block-button__link:hover,
.elementor-button:hover,
.envirah-btn:hover,
input[type="submit"]:hover {
	background-color: var(--e-green-bright);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(45,106,79,.30);
}
.envirah-btn--ghost {
	background: transparent;
	color: var(--e-navy);
	box-shadow: inset 0 0 0 2px var(--e-line);
}
.envirah-btn--ghost:hover {
	background: var(--e-navy);
	color: #fff;
	box-shadow: inset 0 0 0 2px var(--e-navy);
}
.envirah-btn--light {
	background: #fff;
	color: var(--e-navy-deep);
	box-shadow: 0 6px 18px rgba(0,0,0,.12);
}

/* ---------- forms ---------- */
input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
textarea,
select {
	border: 1px solid var(--e-line);
	border-radius: var(--e-radius-sm);
	padding: .8em 1em;
	font-family: inherit;
	font-size: 1rem;
	background: #fff;
	transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, textarea:focus, select:focus {
	outline: none;
	border-color: var(--e-green-bright);
	box-shadow: var(--e-ring);
}

/* ---------- utility surface classes (usable inside Elementor) ---------- */
.e-bg-alt    { background: var(--e-bg-alt); }
.e-bg-navy   { background: var(--e-bg-navy); color: #cfe0ef; }
.e-bg-navy h1, .e-bg-navy h2, .e-bg-navy h3, .e-bg-navy h4 { color: #fff; }
.e-bg-green  { background: var(--e-green); color: #dbeee4; }
.e-bg-green h1, .e-bg-green h2, .e-bg-green h3 { color: #fff; }
.e-bg-mint   { background: var(--e-mint-soft); }

.e-eyebrow {
	display: inline-block;
	font-weight: 700;
	font-size: .8rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--e-green-bright);
	margin-bottom: .9rem;
}
body.envirah-ar .e-eyebrow, body.rtl .e-eyebrow { letter-spacing: .04em; }

.e-card {
	background: #fff;
	border: 1px solid var(--e-line);
	border-radius: var(--e-radius);
	padding: 1.9rem;
	box-shadow: var(--e-shadow-sm);
	transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.e-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--e-shadow);
	border-color: transparent;
}

/* ---------- hero polish ---------- */
.e-bg-navy {
	background:
		radial-gradient(900px 400px at 85% -10%, rgba(64,145,108,.35), transparent 60%),
		radial-gradient(700px 500px at 0% 120%, rgba(124,201,160,.18), transparent 55%),
		linear-gradient(135deg, #0f3d2e 0%, #12293F 45%, #1B3A5C 100%);
}
.e-bg-navy .wp-block-buttons { margin-top: 1.6rem; }

/* ---------- stats band ---------- */
.envirah-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; text-align: center; }
.envirah-stats .st-n { font-size: clamp(2rem, 4vw, 2.8rem); font-weight: 800; color: #fff; line-height: 1; }
.envirah-stats .st-l { font-size: .95rem; color: #d7eee4; opacity: .85; margin-top: .4rem; display: block; }
.e-bg-green .envirah-stats .st-l { color: #e6f3ec; }
@media (max-width: 700px) { .envirah-stats { grid-template-columns: 1fr 1fr; gap: 1.6rem; } }

/* ---------- process steps ---------- */
.envirah-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; counter-reset: s; }
.envirah-steps > div { position: relative; padding-top: 3rem; }
.envirah-steps > div::before {
	counter-increment: s; content: counter(s);
	position: absolute; top: 0; inset-inline-start: 0;
	width: 2.4rem; height: 2.4rem; border-radius: 50%;
	background: var(--e-mint-soft); color: var(--e-green);
	font-weight: 800; display: grid; place-items: center;
}
.envirah-steps h3 { font-size: 1.1rem; margin-bottom: .3rem; }
@media (max-width: 800px) { .envirah-steps { grid-template-columns: 1fr 1fr; } }

/* ---------- sector icons ---------- */
.envirah-sectors { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; text-align: center; }
.envirah-sectors > div { padding: 1.3rem .6rem; border: 1px solid var(--e-line); border-radius: var(--e-radius-sm); font-weight: 600; font-size: .9rem; color: var(--e-ink); background: #fff; }
.envirah-sectors .se-i { font-size: 1.7rem; display: block; margin-bottom: .4rem; }
@media (max-width: 900px) { .envirah-sectors { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 520px) { .envirah-sectors { grid-template-columns: 1fr 1fr; } }

/* ---------- brand strip ---------- */
.envirah-brands { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 1.4rem; }
.envirah-brands span { font-weight: 700; color: var(--e-navy); opacity: .8; font-size: 1.05rem; }
body.rtl .envirah-brands span, .envirah-brands span { font-family: var(--e-font); }

/* ---------- blog cards (home + archive) ---------- */
.envirah-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.envirah-post-card { display: flex; flex-direction: column; gap: .5rem; background: #fff; border: 1px solid var(--e-line); border-radius: var(--e-radius); padding: 1.4rem; transition: transform .16s ease, box-shadow .16s ease; }
.envirah-post-card:hover { transform: translateY(-3px); box-shadow: var(--e-shadow); }
.envirah-post-card .ep-cat { font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--e-green-bright); }
.envirah-post-card .ep-title { font-weight: 700; color: var(--e-ink); font-size: 1.08rem; line-height: 1.3; }
.envirah-post-card .ep-ex { color: var(--e-body); font-size: .92rem; }
@media (max-width: 800px) { .envirah-posts { grid-template-columns: 1fr; } }

/* ---------- header : clean white sticky bar ---------- */
.site-header,
#masthead .ast-primary-header-bar,
.ast-primary-header-bar .site-primary-header-wrap,
.ast-mobile-header-content,
.ast-desktop-header-content {
	background-color: #fff !important;
	background-image: none !important;
}
#masthead .ast-primary-header-bar {
	box-shadow: 0 1px 0 rgba(18,41,63,.06), 0 6px 20px rgba(18,41,63,.05);
	border-bottom: 1px solid var(--e-line);
}

/* keep the header visible while scrolling */
#masthead {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 999;
}
.ast-primary-header-bar,
.ast-primary-header-bar .site-primary-header-wrap {
	min-height: 70px !important;
}
.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item {
	line-height: 70px !important;
}

/* hide the site-name text sitting next to the logo */
.site-header .site-title,
.site-header .ast-site-title-wrap,
.site-header .site-branding .site-title,
.ast-site-identity .site-title {
	display: none !important;
}

/* tighten the nav */
.ast-primary-header-bar .main-header-menu .menu-link {
	font-size: 15px !important;
	padding-left: 14px !important;
	padding-right: 14px !important;
}
.ast-primary-header-bar .main-header-menu .sub-menu .menu-link {
	font-size: 14px !important;
	line-height: 1.5 !important;
}
/* menu + toggle text dark on the white bar */
.ast-primary-header-bar .main-header-menu .menu-link,
.ast-primary-header-bar .main-header-menu .ast-menu-toggle,
.ast-primary-header-bar .menu-toggle,
.ast-mobile-header-content .menu-toggle {
	color: var(--e-ink) !important;
}
.ast-primary-header-bar .main-header-menu .menu-item:hover > .menu-link,
.ast-primary-header-bar .main-header-menu .current-menu-item > .menu-link,
.ast-primary-header-bar .main-header-menu .current-menu-ancestor > .menu-link {
	color: var(--e-green) !important;
}
/* mobile drawer */
.ast-mobile-popup-drawer .ast-mobile-popup-inner { background-color: #fff !important; }
.ast-builder-menu-mobile .main-header-menu .menu-link,
.ast-builder-menu-mobile .main-header-menu .ast-menu-toggle { color: var(--e-ink) !important; }
.ast-builder-menu-mobile .menu-item-cta > a { color: #fff !important; display: inline-block; margin: .5rem 0 0; }

.site-header .custom-logo,
.custom-logo-link img { width: auto !important; max-height: 44px; }
@media (max-width: 921px) {
	.site-header .custom-logo,
	.custom-logo-link img { max-height: 36px; }
}
.main-header-menu .menu-item > .menu-link,
.ast-header-navigation-arrow {
	font-weight: 600;
	font-size: .98rem;
	color: var(--e-ink);
}
.main-header-menu .menu-item > .menu-link:hover,
.main-header-menu .current-menu-item > .menu-link {
	color: var(--e-green);
}
.ast-builder-menu .main-header-menu .sub-menu {
	border-radius: var(--e-radius-sm);
	box-shadow: var(--e-shadow);
	border: 1px solid var(--e-line);
	padding: .4rem;
}
.ast-builder-menu .main-header-menu .sub-menu .menu-link { border-radius: 8px; }

/* ---------- menu direction: nav hugs the logo ----------
   Menu lives in the left header zone next to the logo. Astra mirrors the
   flex header for RTL, so this reads as: menu on the LEFT in English,
   menu on the RIGHT in Arabic. The "Request a quote" button sits on the
   opposite edge in both. */
.ast-desktop .ast-primary-header-bar .site-header-primary-section-left {
	flex: 1 1 auto;
	gap: .4rem 1.4rem;
}
.ast-desktop .ast-primary-header-bar .site-header-primary-section-right {
	flex: 0 0 auto;
	margin-inline-start: auto;
}
.ast-desktop .ast-primary-header-bar .ast-builder-menu-1 .main-header-menu {
	justify-content: flex-start;
}
.ast-desktop .ast-primary-header-bar .site-header-primary-section-left .ast-builder-menu-1 {
	margin-inline-start: 1.2rem;
}

/* "Client portal" item in the primary menu */
.main-header-menu .menu-item-portal > a {
	font-weight: 700;
	color: var(--e-navy) !important;
	border: 1.5px solid var(--e-line);
	border-radius: 999px;
	padding: .5em 1.1em !important;
	margin-inline-start: .5rem;
	display: inline-flex;
	align-items: center;
	gap: .4em;
}
.main-header-menu .menu-item-portal > a::before {
	content: "\1F464"; /* bust in silhouette */
	font-size: .85em;
}
.main-header-menu .menu-item-portal > a:hover {
	border-color: var(--e-green-bright);
	color: var(--e-green) !important;
}

/* CTA item in the primary menu */
.main-header-menu .menu-item-cta > .menu-link,
.main-header-menu .menu-item-cta > a {
	background: var(--e-green);
	color: #fff !important;
	border-radius: 999px;
	padding: .58em 1.35em !important;
	margin-inline-start: .7rem;
	box-shadow: 0 6px 16px rgba(45,106,79,.25);
	transition: background-color .15s ease, transform .12s ease;
}
.main-header-menu .menu-item-cta > a:hover { background: var(--e-green-bright); transform: translateY(-1px); }

/* language switcher (Polylang) — clean single toggle to the other language */
.main-header-menu .lang-item > a,
.main-header-menu .pll-parent-menu-item > a {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: .82rem;
	border: 1px solid var(--e-line);
	border-radius: 8px;
	padding: .4em .7em !important;
}
.main-header-menu .lang-item > a:hover { border-color: var(--e-green-bright); color: var(--e-green); }
.main-header-menu .lang-item img,
.main-header-menu .pll-parent-menu-item img { display: none; } /* names only, no flags */
.main-header-menu .lang-item.current-lang { display: none; } /* show only the other language */

/* ---------- EnviraH footer ---------- */
.envirah-footer { background: var(--e-bg-navy); color: #a8bccf; padding: 3.5rem 0 2.5rem; }
.envirah-footer .ef-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2.5rem; }
.envirah-footer .ef-logo { max-width: 190px; height: auto; margin-bottom: 1.1rem; }
.envirah-footer p { font-size: .93rem; line-height: 1.8; margin-bottom: 1.2rem; }
.envirah-footer h4 { color: #fff; font-size: 1rem; margin-bottom: 1rem; }
.envirah-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.envirah-footer a { color: #cfe0ef; font-size: .92rem; }
.envirah-footer a:hover { color: #fff; }
.envirah-footer .envirah-btn { margin-top: .3rem; padding: .6em 1.3em; font-size: .9rem; }
.envirah-footer .ef-social { display: flex; gap: 1rem; margin-top: 1rem; font-size: .85rem; }
.envirah-footer bdi { direction: ltr; }
@media (max-width: 900px) { .envirah-footer .ef-grid { grid-template-columns: 1fr 1fr; gap: 2rem; } }
@media (max-width: 560px) { .envirah-footer .ef-grid { grid-template-columns: 1fr; } }

/* tighten Astra's own copyright bar under it */
.ast-small-footer { background: #0d2033; }

/* ---------- footer ---------- */
.site-footer,
.ast-small-footer,
footer.site-footer {
	background: var(--e-bg-navy);
	color: #a8bccf;
}
.site-footer a { color: #cfe0ef; }
.site-footer a:hover { color: #fff; }
.site-footer h2, .site-footer h3, .site-footer h4, .site-footer .widget-title {
	color: #fff;
	font-size: 1.05rem;
	margin-bottom: 1rem;
}
.ast-small-footer { border-top: 1px solid rgba(255,255,255,.09); font-size: .9rem; }

/* blog index intro */
.envirah-blog-intro { margin-bottom: 2.5rem; padding-bottom: 1.8rem; border-bottom: 1px solid var(--e-line); }
.envirah-blog-intro .e-eyebrow { margin-bottom: .5rem; }
.envirah-blog-intro h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); margin-bottom: .6rem; }
.envirah-blog-intro p { color: var(--e-body); font-size: 1.05rem; max-width: 60ch; }

/* ---------- blog / single ---------- */
.ast-article-post, .ast-article-single {
	border-radius: var(--e-radius);
}
.blog-layout-1, .ast-article-inner {
	border: 1px solid var(--e-line);
	border-radius: var(--e-radius);
	overflow: hidden;
}
.entry-content > p:first-of-type { font-size: 1.08em; color: var(--e-ink); }
.entry-content blockquote {
	border-inline-start: 4px solid var(--e-mint);
	background: var(--e-mint-soft);
	border-radius: var(--e-radius-sm);
	padding: 1.1rem 1.4rem;
	font-style: normal;
}

/* ---------- quote form ---------- */
.envirah-quote { display: grid; gap: 1.1rem; }
.envirah-quote .eq-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.envirah-quote label { display: grid; gap: .4rem; font-weight: 600; color: var(--e-ink); font-size: .95rem; }
.envirah-quote input, .envirah-quote select, .envirah-quote textarea { font-weight: 400; }
.envirah-quote .eq-hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }
.envirah-quote button { justify-self: start; margin-top: .3rem; }
.envirah-quote-note { padding: 1rem 1.2rem; border-radius: var(--e-radius-sm); font-weight: 600; margin-bottom: 1rem; }
.envirah-quote-note.is-ok  { background: var(--e-green-soft); color: var(--e-green); border: 1px solid #bfe3cd; }
.envirah-quote-note.is-err { background: #fdecec; color: #b02a2a; border: 1px solid #f5c6c6; }
@media (max-width: 600px) { .envirah-quote .eq-row { grid-template-columns: 1fr; } }

/* ---------- equipment filters ---------- */
.envirah-eq-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.envirah-eq-filters .eq-f {
	background: #fff; color: var(--e-body);
	border: 1px solid var(--e-line); border-radius: 999px;
	padding: .45em 1em; font-size: .85rem; font-weight: 600; cursor: pointer;
	box-shadow: none; transition: all .12s ease;
}
.envirah-eq-filters .eq-f:hover { border-color: var(--e-green-bright); color: var(--e-green); transform: none; }
.envirah-eq-filters .eq-f.is-active { background: var(--e-navy); color: #fff; border-color: var(--e-navy); }
.envirah-eq { margin-top: 1rem; }
.envirah-eq-filters + .envirah-eq-filters { margin-top: -.4rem; margin-bottom: 1.6rem; }

/* ---------- equipment cards ---------- */
.envirah-eq-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.4rem; }
.envirah-eq-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--e-line); border-radius: var(--e-radius); overflow: hidden; transition: transform .16s ease, box-shadow .16s ease; }
.envirah-eq-card:hover { transform: translateY(-4px); box-shadow: var(--e-shadow); }
.envirah-eq-card img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 0; }
.envirah-eq-card .eq-body { padding: 1.1rem 1.2rem 1.3rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.envirah-eq-card .eq-brand { font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--e-green-bright); }
.envirah-eq-card h3 { font-size: 1.1rem; }
.envirah-eq-card .envirah-btn { margin-top: auto; align-self: start; padding: .6em 1.2em; font-size: .88rem; }

/* ---------- floating WhatsApp ---------- */
.envirah-wa {
	position: fixed;
	inset-block-end: 22px;
	inset-inline-end: 22px;
	z-index: 9990;
	width: 56px; height: 56px;
	display: grid; place-items: center;
	background: #25D366;
	color: #fff;
	border-radius: 50%;
	box-shadow: 0 10px 26px rgba(37,211,102,.45);
	transition: transform .15s ease;
}
.envirah-wa:hover { transform: scale(1.08); color: #fff; }

/* ---------- misc polish ---------- */
img { border-radius: var(--e-radius-sm); }
.ast-separate-container .ast-article-post,
.ast-separate-container .comment-respond { box-shadow: var(--e-shadow-sm); }

/* thin brand rule Astra sometimes shows above footer */
.site-footer .ast-container { padding-block: 3rem; }

@media (max-width: 921px) {
	body { font-size: 16px; }
	.e-card { padding: 1.5rem; }
}