/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/**
 * Design tokens
 */

:root {
  /* Brand */
  --sl-color-primary: #5369A5;
  --sl-color-heading: #262C3F;
  --sl-color-primary-100: #e1e9fc;
  --sl-color-primary-hover: #4665B7;
  --sl-color-accent: #4B5D86;
  --sl-color-muted: #9EA2AD;

  /* Neutrals */
  --sl-color-text: #3D4048;
  --sl-color-text-light: #4F535E;
  --sl-color-text-dark: #202124;
  --sl-color-bg: #faf9f7;
  --sl-color-surface: #F0F4FF;
  --sl-color-border: #e5e2dc;

  /* Typography */
  --sl-font-sans: "Work Sans", system-ui, -apple-system, sans-serif;
  --sl-font-serif: "Baskervville", "Times New Roman", serif;

  /*
   * Breakpoints (min-width)
   * sm  480px   large phones, landscape
   * md  768px   tablets
   * lg 1024px   laptops
   * xl 1280px   small desktop
   * 2xl 1440px  desktop
   * 3xl 1536px  large / ultrawide
   */
  --sl-bp-sm: 30rem;
  --sl-bp-md: 48rem;
  --sl-bp-lg: 64rem;
  --sl-bp-xl: 80rem; /* 1280px — small desktop */
  --sl-bp-2xl: 90rem; /* 1440px — desktop */
  --sl-bp-3xl: 96rem; /* 1536px */

  /*
   * Fluid type: scales between phone (320px) and desktop (1440px).
   * Formula: clamp(min, intercept + slope×vw, max) where slope = (max−min)/70.
   * Uses rem + vw (not vw alone) so zoom and user font settings still work.
   */
  --sl-viewport-fluid-min: 20rem; /* 320px */
  --sl-viewport-fluid-max: 90rem; /* 1440px */

  /* Static fallbacks / reference sizes at fluid max viewport */
  --sl-text-xs-max: 0.9rem;
  --sl-text-sm-max: 1rem;
  --sl-text-base-max: 1.125rem;
  --sl-text-lg-max: 1.3125rem;
  --sl-text-xl-max: 1.5rem;
  --sl-text-2xl-max: 3.125rem;
  --sl-text-3xl-max: 3.5rem;
  --sl-text-4xl-max: 4rem;

  --sl-text-xs-min: 0.8125rem;
  --sl-text-sm-min: 0.9375rem;
  --sl-text-base-min: 1rem;
  --sl-text-lg-min: 1.125rem;
  --sl-text-xl-min: 1.25rem;
  --sl-text-2xl-min: 1.875rem;
  --sl-text-3xl-min: 2.25rem;
  --sl-text-4xl-min: 2.5rem;

  --sl-text-xs: clamp(
    var(--sl-text-xs-min),
    0.788rem + 0.125vw,
    var(--sl-text-xs-max)
  );
  --sl-text-sm: clamp(
    var(--sl-text-sm-min),
    0.92rem + 0.089vw,
    var(--sl-text-sm-max)
  );
  --sl-text-base: clamp(
    var(--sl-text-base-min),
    0.964rem + 0.179vw,
    var(--sl-text-base-max)
  );
  --sl-text-lg: clamp(
    var(--sl-text-lg-min),
    1.071rem + 0.268vw,
    var(--sl-text-lg-max)
  );
  --sl-text-xl: clamp(
    var(--sl-text-xl-min),
    1.179rem + 0.357vw,
    var(--sl-text-xl-max)
  );
  --sl-text-2xl: clamp(
    var(--sl-text-2xl-min),
    1.554rem + 1.607vw,
    var(--sl-text-2xl-max)
  );
  --sl-text-3xl: clamp(
    var(--sl-text-3xl-min),
    1.893rem + 1.786vw,
    var(--sl-text-3xl-max)
  );
  --sl-text-4xl: clamp(
    var(--sl-text-4xl-min),
    2.071rem + 2.143vw,
    var(--sl-text-4xl-max)
  );

  --sl-leading-tight: 1.3;
  --sl-leading-normal: 1.5;
  --sl-leading-relaxed: 1.65;

  /* Spacing (4px base) */
  --sl-space-1: 0.25rem;
  --sl-space-2: 0.5rem;
  --sl-space-3: 0.75rem;
  --sl-space-4: 1rem;
  --sl-space-6: 1.5rem;
  --sl-space-8: 2rem;
  --sl-space-12: 3rem;
  --sl-space-16: 4rem;

  /* Layout */
  --sl-radius-sm: 4px;
  --sl-radius-md: 8px;
  --sl-radius-lg: 12px;
  --sl-radius-full: 9999px;

  --sl-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06);
  --sl-shadow-md: 0 4px 12px rgb(0 0 0 / 0.08);

  --sl-content-max: 72rem;
  --sl-transition: 150ms ease;
}

/**
 * 
 * Text styling
 * 
 */
h1, h2, h3 {
	font-family: var(--sl-font-serif)!important;
	color: var(--sl-color-heading)!important;
	font-weight: 400!important;
	line-height: 120%!important;
}

h1 {
	font-size: var(--sl-text-3xl)!important;
}

h2 {
	font-size: var(--sl-text-2xl)!important;
}


h3 {
	font-size: var(--sl-text-xl)!important;
}

p {
	font-size: var(--sl-text-base)!important;
	font-family: var(--sl-font-sans)!important;
	line-height: var(--sl-leading-normal)!important;
}

p strong{
	font-weight: 500!important;
}

.heading-alt-style {
	font-style: italic;
	color: var(--sl-color-accent);
}

.sub-accent {
	text-transform: uppercase;
	color: var(--sl-color-primary);
	font-size: var(--sl-text-sm);
}

.sub-accent-alt p{
	text-transform: uppercase;
	color: var(--sl-color-surface);
	font-size: var(--sl-text-sm);
}

/*
 * 
 * Components
 * 
 */
.rank-math-breadcrumb a, .rank-math-breadcrumb span {
	color: var(--sl-color-muted);
	font-size: var(--sl-text-small);
}

.rank-math-breadcrumb span:last-child {
	text-transform: capitalize;
	color: var(--sl-color-primary);
}

.sl-card-slider {
	max-width: 450px;
}

.sl-card-slider p {
	font-style: italic;
}

.sl-card-header {
	color: var(--sl-color-primary);
	font-family: var(--sl-font-sans);
}


@media (max-width: 767px) {
  .sl-card-slider {
    transform: none !important;
  }         
}

.sl-quote-section {
    max-width: 800px!important;
}

.sl-quote-section h2 {
	color: var(--sl-color-surface)!important;
}
/**
 * Container 
 *
*/
.sl-section {
  padding: clamp(40px, 5vw, 100px) clamp(16px, 3vw, 64px);
  max-width: 1504px!important;
	margin: auto!important;
}

.alt-section--margin {
    margin: 100px auto!important;
}

@media (width < 767px) {
	.alt-section--margin {
		margin: 50px auto!important;
	}
}

.sl-section-hero { 
  padding: 0 clamp(16px, 3vw, 64px) clamp(40px, 5vw, 100px) clamp(16px, 3vw, 64px);
	max-width: 1504px!important;
	margin:auto!important;
}

.sl-section-hero--service {
		padding: clamp(40px, 5vw, 100px) 0!important;
	max-width: 1504px!important;
	margin:auto!important;
	}

@media (width > 767px) {
	.sl-section-hero {
		padding-right: 0!important;
	}
}


.hero-alt {
	padding: clamp(40px, 5vw, 100px) 0!important;
}

@media (max-width: 767px) {
	.hero-alt {
		padding: 0!important;
		margin-top: 0!important;
	}
	.sl-section-hero--service {
		padding: clamp(40px, 5vw, 100px) clamp(16px, 3vw, 64px)!important;
	}
}


/**
 * Button — Elementor Button widget
 *
*/
.elementor-widget-button.sl-btn > .elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
	font-style: none!important;
  padding: 8px 24px;
  font-size: var(--sl-text-base);
  font-weight: 500;
  line-height: 130%;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: 0px;
  cursor: pointer;
  background-image: none;
  box-shadow: none;
  transition:
    background-color var(--sl-transition),
    border-color var(--sl-transition),
    color var(--sl-transition),
    box-shadow var(--sl-transition);
}

@media (max-width: 767px) {
	.elementor-widget-button.sl-btn > .elementor-button {
		width: 100%!important;
	}
}

.elementor-widget-button.sl-btn > .elementor-button:hover,
.elementor-widget-button.sl-btn > .elementor-button:focus {
  background-image: none;
}

.elementor-widget-button.sl-btn > .elementor-button:focus-visible {
  outline: 2px solid var(--sl-color-accent);
  outline-offset: 2px;
}

.elementor-widget-button.sl-btn .elementor-button-content-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: inherit;
}

.elementor-widget-button.sl-btn .elementor-button-text {
	color:inherit;
	font-style: none!important;
}

/* Variants */
.elementor-widget-button.sl-btn.sl-btn--primary > .elementor-button {
  color: var(--sl-color-surface);
  background-color: var(--sl-color-primary);
}

.elementor-widget-button.sl-btn.sl-btn--primary > .elementor-button:hover,
.elementor-widget-button.sl-btn.sl-btn--primary > .elementor-button:focus {
  color: var(--sl-color-surface);
  background-color: var(--sl-color-primary-hover);
}

.elementor-widget-button.sl-btn.sl-btn--secondary > .elementor-button {
  color: var(--sl-color-accent);
  background-color: transparent;
  border-color: var(--sl-color-accent);
}

.elementor-widget-button.sl-btn.sl-btn--secondary-alt > .elementor-button {
  color: var(--sl-color-surface)!important;
  background-color: transparent;
  border-color: var(--sl-color-surface)!important;
}

.elementor-widget-button.sl-btn.sl-btn--secondary > .elementor-button:hover,
.elementor-widget-button.sl-btn.sl-btn--secondary > .elementor-button:focus {
  color: var(--sl-color-surface);
  background-color: var(--sl-color-primary);
  border-color: var(--sl-color-primary);
}

.elementor-widget-button.sl-btn.sl-btn--ghost > .elementor-button {
  color: var(--sl-color-primary)!important;
  background-color: var(--sl-color-surface)!important;
}

.elementor-widget-button.sl-btn.sl-btn--ghost > .elementor-button:hover,
.elementor-widget-button.sl-btn.sl-btn--ghost > .elementor-button:focus {
  color: var(--sl-color-surface)
  background-color: var(--sl-color-accent);
}

/**
 * Content Filter Button
 */
.elementor-widget-taxonomy-filter.sl-btn .e-filter-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 8px 24px;
  font-size: var(--sl-text-base);
  font-weight: 500;
  line-height: 130%;
  font-style: normal !important;
  text-decoration: none;

  border: 2px solid transparent;
  border-radius: 0;
  cursor: pointer;

  background-image: none;
  box-shadow: none;

  transition:
    background-color var(--sl-transition),
    border-color var(--sl-transition),
    color var(--sl-transition),
    box-shadow var(--sl-transition);
}

.elementor-widget-taxonomy-filter.sl-btn .e-filter-item:hover,
.elementor-widget-taxonomy-filter.sl-btn .e-filter-item:focus {
  background-image: none;
}

.elementor-widget-taxonomy-filter.sl-btn .e-filter-item:focus-visible {
  outline: 2px solid var(--sl-color-accent);
  outline-offset: 2px;
}

/* Optional spacing between filter buttons */
.elementor-widget-taxonomy-filter.sl-btn .e-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* Default */
.elementor-widget-taxonomy-filter.sl-btn .e-filter-item {
  color: var(--sl-color-accent);
  background-color: transparent;
  border-color: var(--sl-color-accent);
}

.elementor-widget-taxonomy-filter.sl-btn .e-filter-item:hover,
.elementor-widget-taxonomy-filter.sl-btn .e-filter-item:focus {
  color: var(--sl-color-surface);
  background-color: var(--sl-color-primary);
	border-color: var(--sl-color-primary);
}

/* Active selected filter */
.elementor-widget-taxonomy-filter.sl-btn .e-filter-item[aria-pressed="true"] {
  color: var(--sl-color-surface);
  background-color: var(--sl-color-primary);
	border-color: var(--sl-color-primary);
}

/**
 * Table of Contents
 */

.elementor-widget-table-of-contents.sl-toc, .elementor-toc__header {
  border: none;
}

.elementor-widget-table-of-contents.sl-toc .elementor-toc__header {
	padding: 0px 0px 8px 0px;
}

.elementor-widget-table-of-contents.sl-toc .elementor-toc__body {
	padding: 0px;
}

.elementor-widget-table-of-contents.sl-toc .elementor-toc__header-title {
  margin: 0;
  font-family: var(--sl-font-sans);
  font-size: var(--sl-text-base);
  font-weight: 400;
  text-transform: uppercase;
  line-height: var(--sl-leading-tight);
  color: #6E727D;
}

.elementor-widget-table-of-contents.sl-toc .elementor-toc__list-item {
  transition:
    background-color var(--sl-transition),
    border-color var(--sl-transition);
}


.elementor-widget-table-of-contents.sl-toc .elementor-toc__list-item-text {
	padding: 12px 16px;
  font-family: var(--sl-font-sans);
  font-size: var(--sl-text-base);
  font-weight: 400;
  line-height: var(--sl-leading-tight);
  color: var(--sl-color-text-light);
  text-decoration: none;
	text-transform: capitalize;
  background-color: transparent;
}

/* Hover */
.elementor-widget-table-of-contents.sl-toc .elementor-toc__list-item:hover:not(.elementor-item-active) {
  background-color: var(--sl-color-primary-100);
	  width: 100%;
}

.elementor-widget-table-of-contents.sl-toc .elementor-toc__list-item-text:hover {
  text-decoration: none;
  color: var(--sl-color-text-dark);
}

/* Active */
.elementor-widget-table-of-contents.sl-toc .elementor-item-active {
  font-weight: 500;
  border-left: 2px solid var(--sl-color-primary);
  background-color: transparent;
  color: var(--sl-color-primary);
}

/*podcast buttons */

.sl-button-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.sl-button-row .elementor-widget-button {
  margin: 0;
}