/**
 * Global - Refresh Custom Styles
 *
 * @package Supreme_Starter
 * @since 1.0.0
 * @snippet_id 23462
 */

.hero-buttons .elementor-column {
	width:auto;
}

.hero-buttons .elementor-column-gap-default {
	gap:25px;
}

.premium-testimonial-lower-quote {
	z-index:-1;
}

.premium-testimonial-upper-quote {
	z-index:-1;
}

.overview-content{
	 max-width: 1000px;
    margin: 0 auto;
}

.overview-content .bio-btn{
	margin: 0 auto;
}

.bmmc-box:hover .elementor-button.elementor-button-link {
    background-color: #3d264f;
    border: 1px solid #fff;
    color: #fff;
}

@media screen and (max-width: 1024px) {
	.hero-buttons .elementor-container{
		justify-content: center;
	}
}

/* QA: CTAs touching or overlapping on tablet and mobile. Where two or more auto-width buttons share a wrapper they get a 12px gap and lose
   the per-widget margins (the gap spaces them instead). A lone button, or buttons in separate columns, keep their own margins. */
@media (max-width: 1024px) {
	.elementor-widget-wrap:has(> .elementor-widget-button.elementor-widget__width-auto ~ .elementor-widget-button.elementor-widget__width-auto) {
		gap: 12px;
	}
	.elementor-widget-wrap:has(> .elementor-widget-button.elementor-widget__width-auto ~ .elementor-widget-button.elementor-widget__width-auto) > .elementor-widget-button.elementor-widget__width-auto > .elementor-widget-container {
		margin: 0 !important;
	}
}

/* QA: cards stacked with no space between them on mobile. Inner-section columns get a 20px row gap */
@media (max-width: 767px) {
	.elementor-inner-section > .elementor-container { row-gap: 20px; }
}

.footer h3 a {
	transition:color .3s ease;
}

.footer h3 a:hover{
	color:#E47B3A !important;
	
}

.abt-list a {
	transition:color .3s ease;
}

.abt-list a:hover span {
	color:#E47B3A !important;
}

/* ============================================
   DLS-160 - Global font family and type scale
   Source: Homepage.html (build r61) / elementor-blocks/css/ss-brand-tokens.css.
   Instrument Sans, variable 400-700, self-hosted. Overrides the Lato / Lora / Roboto set in
   the Elementor kit and per widget; the editor settings stay as they are.
   Homepage blocks (.dls-brand) keep their own scoped tokens and are left out of the size rules.
   ============================================ */

/* Font files (the same two files ss-brand-tokens.css declares; repeated here because ss-brand-tokens.css only loads on some pages) */
@font-face {
	font-family: "Instrument Sans";
	font-style: normal;
	font-weight: 400 700;
	font-stretch: 100%;
	font-display: swap;
	src: url("../../elementor-blocks/fonts/instrument-sans-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Instrument Sans";
	font-style: normal;
	font-weight: 400 700;
	font-stretch: 100%;
	font-display: swap;
	src: url("../../elementor-blocks/fonts/instrument-sans-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	--dls-font: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	/* homepage type scale (Homepage.html): same values and breakpoints */
	--dls-fs-md: 20px;   --dls-lh-md: 30px;
	--dls-fs-lg: 24px;   --dls-lh-lg: 34px;
	--dls-fs-xxl: 35px;  --dls-lh-xxl: 45px;
	--dls-fs-xxxl: 46px; --dls-lh-xxxl: 57px;
}
@media (max-width: 1240px) {
	:root {
		--dls-fs-xxxl: 38px; --dls-lh-xxxl: 48px;
		--dls-fs-xxl: 29px;  --dls-lh-xxl: 38px;
	}
}
@media (max-width: 900px) {
	:root {
		--dls-fs-xxxl: 32px; --dls-lh-xxxl: 41px;
		--dls-fs-xxl: 26px;  --dls-lh-xxl: 34px;
		--dls-fs-lg: 21px;   --dls-lh-lg: 30px;
		--dls-fs-md: 18px;   --dls-lh-md: 28px;
	}
}

/* Elementor kit variables (the kit sets them on body.elementor-kit-6, so :root would not win) */
body.elementor-kit-6 {
	--e-global-typography-primary-font-family: var(--dls-font);
	--e-global-typography-secondary-font-family: var(--dls-font);
	--e-global-typography-text-font-family: var(--dls-font);
	--e-global-typography-accent-font-family: var(--dls-font);
}

body {
	font-family: var(--dls-font);
	font-variation-settings: "wdth" 100;
}

/* Font family everywhere except icon fonts, code, the admin bar and Query Monitor */
/* (one compound selector: a line break here would turn into a descendant combinator) */
body :where(*):not(i):not(svg):not(svg *):not(pre):not(code):not(kbd):not(samp):not(.fa):not(.fas):not(.far):not(.fab):not([class*="fa-"]):not([class^="eicon"]):not([class*=" eicon"]):not([class^="ekit-"]):not([class*=" ekit-"]):not([class*="ekit-icon"]):not([class*="dashicons"]):not(#wpadminbar):not(#wpadminbar *):not([id^="qm"]):not([id^="qm"] *) {
	font-family: var(--dls-font) !important;
}

button, input, select, textarea, optgroup {
	font-family: inherit;
}

/* Pseudo-elements are not matched by the rule above (SearchWP sets Lato on its placeholder) */
input::placeholder,
textarea::placeholder,
.swp-input--search::placeholder {
	font-family: var(--dls-font) !important;
}

/* Sizes: H1 uses the homepage section-title size (the homepage H1 is a 78px hero), H2 / H3 / body use the lg / xxl / md steps.
   Weights follow the homepage (H1 600, H2 400, H3 600); body keeps its own weight. H4-H6 change font only.
   Homepage blocks (.dls-brand), the menu and the admin bar are excluded. */
body h1:not(.dls-brand *):not(.mes-nav-menu *):not(#wpadminbar *) {
	font-size: var(--dls-fs-xxxl) !important;
	line-height: var(--dls-lh-xxxl) !important;
	font-weight: 600 !important;
	letter-spacing: -0.5px !important;
}
body h2:not(.dls-brand *):not(.mes-nav-menu *):not(#wpadminbar *) {
	font-size: var(--dls-fs-xxl) !important;
	line-height: var(--dls-lh-xxl) !important;
	font-weight: 400 !important;
}
body h3:not(.dls-brand *):not(.mes-nav-menu *):not(#wpadminbar *) {
	font-size: var(--dls-fs-lg) !important;
	line-height: var(--dls-lh-lg) !important;
	font-weight: 600 !important;
}
/* Balance line lengths so a heading does not end on a single short word (ignored by browsers without support) */
body :is(h1, h2, h3):not(.dls-brand *):not(.mes-nav-menu *):not(#wpadminbar *) {
	text-wrap: balance;
}
body :is(.elementor-widget-text-editor, .entry-content) :is(p, li):not(.dls-brand *):not(.mes-nav-menu *):not(.elementor-inner-section *) {
	font-size: var(--dls-fs-md) !important;
	line-height: var(--dls-lh-md) !important;
}

/* DLS-160 follow-up - ElementsKit text widgets.
   The global font rule skips every [class^="ekit-"] element to protect icon fonts, which also skipped
   accordion / tab / heading text. Re-apply the font to ElementsKit text elements only (icons use *icon* classes). */
.ekit-accordion-title,
.ekit-accordion-title :not([class*="icon"]):not([class*="fa-"]),
.elementskit-card-body,
.elementskit-card-body :where(p, span, a, li, div, h1, h2, h3, h4, h5, h6):not([class*="icon"]):not([class*="fa-"]),
.ekit-heading--subtitle,
.elementskit-section-subtitle,
.ekit-heading--title,
.ekit-tab-title,
.elementskit-tab-title {
	font-family: var(--dls-font) !important;
}
/* Body copy on non-Elementor templates (FAQ .page-content, news .richtext) follows the same md step.
   Direct children only: .page-content also wraps every Elementor page, whose text keeps its own sizes. */
body :is(.page-content, .richtext) > p:not(.dls-brand *):not(.mes-nav-menu *),
body :is(.page-content, .richtext) > :is(ul, ol) > li:not(.dls-brand *):not(.mes-nav-menu *) {
	font-size: var(--dls-fs-md) !important;
	line-height: var(--dls-lh-md) !important;
}

/* Essential Addons accordion titles ship with line-height equal to font-size (1); use the homepage lg ratio (34/24 = ~1.4) */
.eael-accordion-tab-title,
.eael-accordion-header {
	line-height: 1.4 !important;
}

/* DLS-147: search result titles, a step above the homepage featured-resources card titles (20/30) so the list reads clearly
   without the long titles running to many lines: 22/32 on desktop, 20/30 up to 900px, 18/28 up to 560px (the mobile md step).
   The global h2 rule above is !important and has an ID in its :not(), so this selector needs the leading html + #main to win. */
html body #main .swp-result-item h2.entry-title {
	font-size: 22px !important;
	line-height: 32px !important;
	font-weight: 500 !important;
}
@media (max-width: 900px) {
	html body #main .swp-result-item h2.entry-title {
		font-size: 20px !important;
		line-height: 30px !important;
	}
}
@media (max-width: 560px) {
	html body #main .swp-result-item h2.entry-title {
		font-size: var(--dls-fs-md) !important;
		line-height: var(--dls-lh-md) !important;
	}
}