/*
Theme Name: Aqua Culture Foods
Description: A child theme of Hello Elementor, created for Aqua Culture Foods
Author: Base3Group
Author URI: https://base3group.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: aqua
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/
:root {
    --e-global-typography-primary-font-family: "Graphik";
    --e-global-typography-primary-font-weight: 400;
    --e-global-typography-secondary-font-family: "Tiempos Headline";
    --e-global-typography-secondary-font-weight: 400;
    --e-global-typography-secondary-font-style: italic;
    --e-global-typography-text-font-weight: 400;
    --e-global-typography-accent-font-family: "Graphik";
    --e-global-typography-accent-font-weight: 400;
    --e-global-typography-accent-text-transform: uppercase;
    --e-global-color-primary: #000000;
    --e-global-color-secondary: #fffcf6;
    --e-global-color-text: #303030;
    --e-global-color-accent: #ffffff;
    --e-global-color-12e2ab7: #021e1b;
    --e-global-color-1a06e2a: #052e2a;
    --e-global-color-c430e06: #10413c;
    --e-global-color-077583a: #10554e;
    --e-global-color-27f6452: #38796d;
    --e-global-color-24b853c: #259f82;
    --e-global-color-9604196: #61bfa9;

    --color-black: var(--e-global-color-primary);
    --color-ivory: var(--e-global-color-secondary);
    --color-white: var(--e-global-color-accent);
    --color-dark-gray: var(--e-global-color-text);
    --color-green-100: var(--e-global-color-12e2ab7);
    --color-green-90: var(--e-global-color-1a06e2a);
    --color-green-80: var(--e-global-color-c430e06);
    --color-green-70: var(--e-global-color-077583a);
    --color-green-60: var(--e-global-color-27f6452);
    --color-green-50: var(--e-global-color-24b853c);
    --color-green-40: var(--e-global-color-9604196);

    --font-main: var(--e-global-typography-primary-font-family);
    --font-accent: var(--e-global-typography-secondary-font-family);
    --font-size-xs: 15px;
    --font-size-sm: 16px;
    --font-size-md: 18px;
    --font-size-lg: 20px;
    --font-size-xl: 32px;
    --font-size-body: var(--font-size-sm);

    --container-max: 1440px;
    --xs: calc(var(--md) * 0.5);
    --sm: calc(var(--md) * 0.75);
    --md: 10px;
    --lg: calc(var(--md) * 2);
    --xl: calc(var(--md) * 4);
    --xxl: calc(var(--md) * 8);
}

/* Body Styles */
html {
    overflow-x: hidden;
}
body {
    font-size: var(--font-size-body);
    font-family: var(--font-main);
    font-style: normal;
    font-weight: normal;
    position: relative;
}

.site-header + .elementor {
    min-height: unset !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
}

.accent-text {
    font-family: var(--font-accent);
    font-style: italic;
}

.body--xs {
    font-size: var(--font-size-xs);
}
.body--sm {
    font-size: var(--font-size-sm);
}

.body--md {
    font-size: var(--font-size-md);
}
.body--lg {
    font-size: var(--font-size-lg);
}

.h0 {
    font-size: 44px !important;
}

h1,
.h1 {
    font-size: 36px;
}

h2,
.h2 {
    font-size: 32px;
}

h3,
.h3 {
    font-size: 28px;
}

h4,
.h4 {
    font-size: 24px;
}

h5,
.h5 {
    font-size: 18px;
}

h6,
.h6 {
    font-size: 16px;
    text-transform: uppercase;
}

.elementor-widget-heading .elementor-heading-title.elementor-size-small {
    font-size: 18px !important;
}

.elementor-widget-heading .elementor-heading-title.elementor-size-medium {
    font-size: 20px !important;
}

.elementor-widget-heading .elementor-heading-title.elementor-size-large {
    font-size: 24px !important;
}

.elementor-widget-heading .elementor-heading-title.elementor-size-xl {
    font-size: 36px !important;
}

.elementor-widget-heading .elementor-heading-title.elementor-size-xxl {
    font-size: 44px !important;
}

.elementor-heading-title {
    line-height: 1.2 !important;
}

@media screen and (min-width: 1025px) {
    .h0 {
        font-size: 70px !important;
    }

    h1,
    .h1 {
        font-size: 60px;
    }

    h2,
    .h2 {
        font-size: 48px;
    }

    h3,
    .h3 {
        font-size: 36px;
    }

    h4,
    .h4 {
        font-size: 32px;
    }

    h5,
    .h5 {
        font-size: 24px;
    }

    h6,
    .h6 {
        font-size: 20px;
    }

    .elementor-widget-heading .elementor-heading-title.elementor-size-small {
        font-size: 24px !important;
    }

    .elementor-widget-heading .elementor-heading-title.elementor-size-medium {
        font-size: 36px !important;
    }

    .elementor-widget-heading .elementor-heading-title.elementor-size-large {
        font-size: 48px !important;
    }

    .elementor-widget-heading .elementor-heading-title.elementor-size-xl {
        font-size: 60px !important;
    }

    .elementor-widget-heading .elementor-heading-title.elementor-size-xxl {
        font-size: 70px !important;
    }
}

header .elementor-button {
    font-size: var(--font-size-sm);
    min-width: unset;
}

.menu-item {
    font-size: var(--font-size-sm);
    text-transform: uppercase;
}

a,
a:hover {
    color: inherit;
}

.hide {
    display: none;
}

.show {
    display: block;
}

@media screen and (min-width: 1025px) {
    .hide-desktop {
        display: none;
    }
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    .hide-tablet {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .hide-mobile {
        display: none;
    }
}

.overflow-hidden {
    overflow: hidden !important;
}

.overflow-x-hidden {
    overflow-x: hidden;
}
.overflow-y-hidden {
    overflow-y: hidden;
}

.position-relative {
    position: relative;
}

.position-unset {
    position: unset;
}

p0 {
    padding: 0;
}

m0 {
    margin: 0;
}

.padded {
    padding: 40px;
}
.less-vertical-padding {
    padding-top: 20px;
    padding-bottom: 20px;
}

@media screen and (min-width: 1025px) {
    .padded {
        padding: 60px 80px;
    }
    .extra-vertical-padding {
        padding-top: 160px !important;
        padding-bottom: 160px !important;
    }
    .less-vertical-padding {
        padding-top: 30px;
        padding-bottom: 30px;
    }
}

.page-width {
    width: 100%;
    max-width: var(--container-max);
    margin-left: auto;
    margin-right: auto;
}

/* Colors */
.color--black {
    color: var(--color-black);
}
.color--dark-gray {
    color: var(--color-dark-gray);
}
.color--ivory {
    color: var(--color-ivory);
}
.color--white,
.color--light {
    color: var(--color-white);
}

.color--green-100 {
    color: var(--color-green-100);
}
.color--green-90 {
    color: var(--color-green-90);
}
.color--green-80 {
    color: var(--color-green-80);
}
.color--green-70 {
    color: var(--color-green-70);
}
.color--green-60 {
    color: var(--color-green-60);
}
.color--green-50 {
    color: var(--color-green-50);
}
.color--green-40 {
    color: var(--color-green-40);
}

.background--black {
    background: var(--color-black);
}
.background--dark-gray {
    background: var(--color-dark-gray);
}
.background--ivory {
    background: var(--color-ivory);
}
.background--white {
    background: var(--color-white);
}

.background--green-100 {
    background: var(--color-green-100);
}
.background--green-90 {
    background: var(--color-green-90);
}
.background--green-80 {
    background: var(--color-green-80);
}
.background--green-70 {
    background: var(--color-green-70);
}
.background--green-60 {
    background: var(--color-green-60);
}
.background--green-50 {
    background: var(--color-green-50);
}
.background--green-40 {
    background: var(--color-green-40);
}

/* Navigation */
.elementor-location-header .e-con.elementor-sticky--active,
.site-header {
    z-index: 9998;
}

.site-header {
    max-width: 100% !important;
    background-color: var(--color-green-90);
    padding: 15px 20px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

.site-header .header-inner {
    max-width: 1280px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.site-header .site-branding img {
    max-width: 200px;
    transition: all 0.2s ease-in-out;
}

@media screen and (min-width: 1025px) {
    .elementor-nav-menu .cta {
        display: none !important;
    }
}

@media screen and (max-width: 1024px) {
    .elementor-location-header > .elementor-element {
        height: 80px;
    }
    .elementor-nav-menu--dropdown {
        padding-top: var(--lg);
        padding-bottom: var(--xl);
        min-height: calc(100vh - 80px);
    }
    .elementor-nav-menu--dropdown .menu-item:not(.cta) .elementor-item {
        font-size: var(--font-size-lg) !important;
        text-transform: none !important;
        line-height: 40px;
    }

    .elementor-nav-menu--dropdown .cta {
        margin-top: var(--xl);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .site-header {
        border-bottom: 1px solid var(--color-green-70);
    }

    #mainNav {
        display: none;
    }
}

.elementor-menu-toggle i {
    display: none !important;
}

.elementor-menu-toggle:before,
.elementor-menu-toggle:after,
.nav-toggle:before,
.nav-toggle:after {
    content: "";
    width: 25px;
    height: 1.5px;
    position: absolute;
    background: var(--color-white);
    transition: all 250ms ease-out;
    will-change: transform;
}

.elementor-menu-toggle:before,
.nav-toggle:before {
    transform: translateY(calc(-1 * var(--xs)));
}

.elementor-menu-toggle:after,
.nav-toggle:after {
    transform: translateY(var(--xs));
}

.elementor-menu-toggle.elementor-active:before,
.nav-toggle.is--active:before {
    transform: translateY(0) rotate(45deg);
}

.elementor-menu-toggle.elementor-active:after,
.nav-toggle.is--active:after {
    transform: translateY(0) rotate(-45deg);
}

.site-navigation ul.menu li a {
    color: var(--color-white);
}

.site-navigation ul.menu li a:hover {
    color: var(--color-green-40);
}

#mainNav {
    max-width: 100% !important;
    justify-content: center;
}

#mainNav > div {
    width: 100%;
}

#mainNav .menu {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--xl);
}

#mainNav .menu-item.cta,
#mobileNav .menu-main-menu-container .menu-item.cta {
    display: none;
}

.menu-cta-container ul {
    list-style: none;
}

button#hamburger {
    background: transparent;
    padding: 0 !important;
    width: 40px;
    height: 40px;
    border-radius: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

#mobileNav {
    --menu-height: calc(100vh - 80px);
    position: fixed;
    width: 100%;
    /* height: var(--menu-height); */
    max-height: 0;
    top: 80px;
    left: 0;
    background: var(--color-green-90);
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    display: flex;
    padding: 20px;
    transform: scaleY(0);
    transition: all 0.3s, transform 0.3s;
    transform-origin: top;
}

#mobileNav.is--active {
    display: flex;
    height: var(--menu-height);
    max-height: var(--menu-height);
    transform: scaleY(1);
}

#mobileNav .menu {
    display: flex;
    flex-direction: column !important;
    align-items: center;
    justify-content: flex-start;
    gap: var(--lg);
}

.menu-cta-container .cta.menu-item a {
    padding: 12px 30px !important;
    transition: all 0.5s ease;
}

.menu-cta-container .cta.menu-item a:hover {
    background-color: var(--color-green-40);
    color: var(--color-white) !important;
}

#mobileNav .menu-cta-container {
    margin-top: var(--xl);
}

@media screen and (max-width: 1024px) {
    .elementor-nav-menu__container.elementor-nav-menu--dropdown {
        top: 23px !important;
    }
    .menu-cta-container {
        display: none;
    }

    #mobileNav .menu-cta-container {
        display: block;
    }

    #mobileNav > div:not(.menu-cta-container) .menu-item {
        font-size: var(--font-size-lg) !important;
        text-transform: none !important;
        line-height: 40px;
    }
}

@media screen and (min-width: 1025px) {
    #hamburger {
        display: none !important;
    }
    #mobileNav {
        display: none !important;
    }
}

/* Footer */
.elementor-location-footer {
    overflow: hidden;
}

/* Buttons */

button:focus {
    outline: none;
}

button,
.button,
.elementor-button,
.cta.menu-item a {
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    line-height: 1.5;
    padding: 10px 30px !important;
    border-radius: 100px !important;
    border: none;
    background-color: var(--color-green-90);
    color: var(--color-white);
}

.button--light .elementor-button,
.button.button--light {
    color: var(--color-green-60) !important;
    background-color: var(--color-white);
}

.elementor-button:hover,
.button--light .elementor-button:hover {
    background-color: var(--color-green-40) !important;
    color: var(--color-white) !important;
}

header .button--light .elementor-button,
.cta.menu-item a {
    font-size: inherit;
    color: var(--color-black) !important;
    background-color: var(--color-white);
}

.underline--link .elementor-button,
.underline--link .elementor-button:hover,
.underline--link .elementor-button:focus {
    padding: 0 !important;
    position: relative;
    background-color: transparent !important;
}

.underline--link .elementor-button:hover,
.underline--link .elementor-button:focus {
    color: var(--color-green-40) !important;
}

.underline--link .elementor-button:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 3px;
    width: 100%;
    height: 1px;
    background-color: var(--color-white);
    transition: all 0.3s;
}

.underline--link .elementor-button:hover:before,
.underline--link .elementor-button:focus:before {
    background-color: var(--color-green-40);
}

/* Gravity Forms */
.gform_required_legend,
.charleft.ginput_counter.gfield_description {
    display: none;
}

input#gform_submit_button_1 {
    background-color: var(--color-white);
    color: var(--color-green-70) !important;
    text-transform: uppercase;
    min-width: 140px;
}

.gform-theme--foundation .gfield input,
.gform-theme--foundation .gfield select,
.gform-theme--foundation .gfield textarea {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--color-white);
    border-radius: 0;
    color: var(--color-white);
}

.ginput_container.ginput_container_select {
    position: relative;
}

.ginput_container.ginput_container_select:after {
    content: "\2304";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translate(0, -50%);
    color: var(--color-white);
}

.gform_confirmation_message {
    color: var(--color-white);
}

.gfield > * > *,
.gfield_checkbox label {
    font-size: 18px !important;
}

.gfield_checkbox label {
    color: #cacaca !important;
}

.gfield > * > *::-webkit-input-placeholder {
    color: #279179 !important;
}

.gfield > * > *::-moz-placeholder {
    color: #279179 !important;
}

.gfield > * > *:-ms-input-placeholder {
    color: #279179 !important;
}

.gfield > * > *::-ms-input-placeholder {
    color: #279179 !important;
}

.gfield > * > *::placeholder,
.gfield select:not(.has-value) {
    color: #279179 !important;
}

.gfield-choice-input {
    background: #ffffff !important;
    border: none !important;
}

.gfield-choice-input::before {
    color: #000000 !important;
}

/* Klaviyo */
.klaviyo-close-form {
    background: transparent !important;
    padding: 0 !important;
}

.newsletter-form form > div {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    border-bottom: 1px solid #ffffff !important;
    justify-content: center !important;
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
    width: fit-content !important;
}

.newsletter-form form > div > div > div {
    padding: 0 !important;
}

.newsletter-form form > div > div > div input {
    background: transparent !important;
    box-shadow: none !important;
}

.newsletter-form form button {
    border-radius: 0 !important;
    background: transparent !important;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="12" viewBox="0 0 14 12" fill="none"><path d="M7.67756 12L6.69318 11.0284L10.7457 6.97587H0.25V5.56962H10.7457L6.69318 1.52985L7.67756 0.545471L13.4048 6.27274L7.67756 12Z" fill="white"/></svg>') !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    padding: 10px 30px 10px 10px !important;
}
