/*
Theme Name: Max WordPress Theme 2025
Theme URI: #
Description: Max WordPress Theme 2025 is a child theme of Hello Elementor
Author: Howell Studio
Author URI: https://howell.studio/
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
*/

/* -------------------------------------------------------
   1. Root Variables: Brand Color Palette
---------------------------------------------------------*/
:root {
  --color-green: #5B9771;
  --color-blue:  #1B457B;
  --color-navy:  #12173D;
  --color-black: #0B0B0A;
  --color-gray:  #F4F4F4;
  --color-white: #FFFFFF;
}

/* -------------------------------------------------------
   2. Base Typography
   Adjust font-family references as needed for your fonts.
---------------------------------------------------------*/
h1, h2, h3, .accent {
  font-family: "Apris", sans-serif; 
  color: var(--color-navy);
}

h4, h5, h6, body, p, li {
  font-family: "LabGrotesque", sans-serif; 

}

p.large {
  font-size: 1.125rem;
}

.testimonial-p {
  font-size: 1.5rem;
}

/* -------------------------------------------------------
   3. Responsive Typography
   Mobile-First (All Devices)
---------------------------------------------------------*/
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6, body, p, li { font-size: 1rem; }

/* Tablet (min-width: 768px) */
@media (min-width: 768px) {
  h1 { font-size: 2.75rem; }
  h2 { font-size: 2.375rem; }
  h3 { font-size: 2rem; }
  h4 { font-size: 1.5rem; }
  h5 { font-size: 1.375rem; }
  h6, body, p, li { font-size: 1.0625rem; }
}

/* Desktop (min-width: 1200px) */
@media (min-width: 1200px) {
  h1 { font-size: 3.5rem; }
  h2 { font-size: 3rem; }
  h3 { font-size: 2.5rem; }
  h4 { font-size: 1.75rem; }
  h5 { font-size: 1.5rem; }
  h6, body, p, li { font-size: 1.125rem; }
  p.large { font-size:1.5rem;}
}

/* -------------------------------------------------------
   4. Form Styling (Gravity Forms or Other Forms)
   Adjust selectors to your plugin’s needs.
---------------------------------------------------------*/
.gform_body .gfield_label,
.gform_body label {
  color: var(--color-navy);
  font-weight: 600;
  margin-bottom: 0.25rem;
  display: inline-block;
}

.gform_body .ginput_container input[type="text"],
.gform_body .ginput_container input[type="email"],
.gform_body .ginput_container input[type="tel"],
.gform_body .ginput_container textarea,
.gform_body .ginput_container select,
input[type=text]{
  width: 100%;
  max-width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--color-gray);
  background-color: var(--color-white);
  color: var(--color-black);
  font-family: "LabGrotesque", sans-serif;
  font-size: 1rem;
  box-sizing: border-box;
}

.gform_body .ginput_container input::placeholder,
.gform_body .ginput_container textarea::placeholder {
  color: #999; /* Adjust placeholder color if desired */
}

.gform_body .gfield_required .gfield_required_text {
  color: var(--color-green);
	padding-left: 5px;
}

.gform_body .gform_button {
  background-color: var(--color-green);
  color: var(--color-white);
  border: none;
  padding: 0.75rem 1.5rem;
  font-family: "LabGrotesque", sans-serif;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.gform_body .gform_button:hover {
  background-color: var(--color-blue);
}

.gform_body fieldset {
  border: none;
  margin: 0;
  padding: 0;
}

.mmi-top-rate {
	font-family: "Apris", Sans-serif;
    font-size: 76px;
    font-weight: 500;
    color: #FFFFFF;
	line-height: 1.1;
	padding-bottom: 10px;
}

.inline-top-rate {
	.mmi-top-rate {
		color: black;
		font-family: "LabGrotesque", sans-serif;
		font-size: 18px;
		font-weight: 700;
		padding-bottom: 10px;
	}
}


/* -------------------------------------------------------
   2. Base Button Styles
   Shared by Primary & Secondary CTAs
---------------------------------------------------------*/
.btn, .gform_button .button, #gform_submit_button_3, #max-wp-tools-support-search-form > button, #gform_submit_button_2, #join-max-btn, button.request-btn, button.btn, #max-wp-tools-inquiry-form  button, .gform-theme.gform-theme--framework.gform_wrapper .button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper .gform-theme-button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper :where(:not(.mce-splitbtn))>button:not([id*=mceu_]):not(.mce-open):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper button.button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type=submit],[type=button],[type=reset]).button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type=submit],[type=button],[type=reset]):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input[type=submit].button.gform_button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  border-radius: 9999px; /* Creates a pill shape */
  font-family: "LabGrotesque", sans-serif;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* -------------------------------------------------------
   3. Primary CTA
   Regular State: Green fill, white text
   Hover State: Blue fill, white text
---------------------------------------------------------*/
.btn-primary, #join-max-btn {
  background-color: var(--color-green);
  color: var(--color-white);
  border: 2px solid var(--color-green);
}
.btn-primary:hover {
  background-color: var(--color-blue);
  border-color: var(--color-blue);
  color: var(--color-white);
}

/* -------------------------------------------------------
   4. Secondary CTA
   Regular State: Blue fill, white text
   Hover State: Navy fill, white text
---------------------------------------------------------*/
.btn-secondary,button .btn-secondary,#max-wp-tools-inquiry-form  button, .gform_button .button, #gform_submit_button_3,#max-wp-tools-support-search-form > button, #gform_submit_button_2, #max-wp-tools-advisor-request-form > p:nth-child(4) > button, button.request-btn, .gform-theme.gform-theme--framework.gform_wrapper .button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper .gform-theme-button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper :where(:not(.mce-splitbtn))>button:not([id*=mceu_]):not(.mce-open):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper button.button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type=submit],[type=button],[type=reset]).button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type=submit],[type=button],[type=reset]):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input[type=submit].button.gform_button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
  background-color: var(--color-blue);
  color: var(--color-white);
  border: 2px solid var(--color-blue);
}
.btn-secondary:hover, #gform_submit_button_3:hover, #max-wp-tools-support-search-form > button:hover, #gform_submit_button_2:hover, #max-wp-tools-advisor-request-form > p:nth-child(4) > button:hover, button.request-btn:hover,#max-wp-tools-inquiry-form  button:hover {
  background-color: var(--color-navy);
  border-color: var(--color-navy);
  color: var(--color-white);
}

/* -------------------------------------------------------
   5. Tertiary CTA
   Typically presented as a text-only link with an arrow
   Regular State: Navy text + arrow
   Hover State: Blue text
---------------------------------------------------------*/
.btn-tertiary {
  background-color: transparent;
  color: var(--color-navy);
  border: none;
  padding: 0;  /* Often minimal or no padding for link style */
  font-family: "LabGrotesque", sans-serif;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  text-decoration: none;
}
.btn-tertiary::after {
  /* Automatically append arrow if desired */
  content: " →";
}
.btn-tertiary:hover {
  color: var(--color-blue);
  text-decoration: underline; /* Optional hover effect */
}

/* -------------------------------------------------------
   6. Textual Link
   Regular State: Blue text
   Hover State: Green or navy text, with underline
---------------------------------------------------------*/
.text-link {
  color: var(--color-blue);
  text-decoration: none;
  font-weight: 400; /* Adjust as desired */
}
.text-link:hover {
  color: var(--color-green);
  text-decoration: underline;
}


img.max-logo {
	    max-width: 150px !important;
}


.elementor-widget-n-menu .e-n-menu-title.e-current, .elementor-widget-n-menu .e-n-menu-title.e-current a {
    color: var(--color-navy);
}


.elementor-nav-menu, .elementor-nav-menu li, .elementor-nav-menu ul {
	font-size: 1.125rem;
}

figure.how-max-works-img {
	text-align: center;
}

/* Responsive site navigation */
@media (min-width: 768px) and (max-width: 1200px) {
	.e-n-menu-content > .e-con {
		margin-top: 0 !important;
	}
	
	.e-n-menu-wrapper {
		top: 3rem !important;
	}
}

@media (max-width: 768px) {
	.elementor-nav-menu--dropdown.elementor-nav-menu__container {
		top: 3rem !important;
	}
}