/* ------------------------------------------- */
/* FONT DEL SITO */
/* ------------------------------------------ */

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");

.montserrat {
  font-family: var(--font-family);
}

/* ------------------------------------------- */
/* VARIABILI CSS */
/* ------------------------------------------ */

:root {
  --primary-color: #009345;
  --light-primary: #e9ebee;
  --dark: #5e5e5d;
  --light: #f8f8f8;
  --black: #02111b;

  --font-family: "Montserrat", serif;

  --heading1: 60px;
  --heading2: 36px;
  --heading3: 28px;
  --heading4: 24px;
  --heading5: 20px;
  --heading6: 16px;
  --section-title: 16px;
  --paragraph: 16px;
  --internal-link: 16px;
  --breadcrumbs: 14px;
  --footer: 14px;
}

@media screen and (max-width: 768px) {
  :root {
    --heading1: 60px;
    --line-height-heading1: ;
    --heading2: 30px;
    --line-height-heading2: ;
    --heading3: 28px;
    --line-height-heading3: ;
    --heading4: 24px;
    --heading5: 20px;
    --heading6: 16px;
    --section-title: 16px;
    --paragraph: 16px;
    --internal-link: 16px;
    --breadcrumbs: 14px;
    --footer: 14px;
  }
}

/* ------------------------------------------- */
/* TESTI */
/* ------------------------------------------ */

h1,
.h1,
#editor h1 {
  font-size: var(--heading1);
}

h2,
.h2,
#editor h2 {
  font-size: var(--heading2);
}

h3,
.h3,
#editor h3 {
  font-size: var(--heading3);
  line-height: 40px;
}

h4,
.h4,
#editor h4 {
  font-size: var(--heading4);
}

h5,
.h5,
#editor h5 {
  font-size: var(--heading5);
  line-height: 28px;
}

h6,
.h6,
#editor h6 {
  font-size: var(--heading6);
}

#editor span {
  color: var(--primary-color);
}

.section-title {
  font-size: var(--section-title);
  font-weight: 900;
  color: var(--primary-color);
  text-transform: uppercase;
}

p,
.p,
#editor p {
  font-family: var(--font-family);
  font-size: var(--paragraph);
  line-height: 28px;
}

#editor a {
  color: var(--primary-color);
}

#editor a:hover {
  color: var(--dark);
  text-decoration: none;
}

#editor li {
  margin-bottom: 1rem;
}

.primary-color {
  color: var(--primary-color);
}

.light-primary {
  color: var(--light-primary);
}

.dark {
  color: var(--dark);
}

.black {
  color: var(--black);
}

.light {
  color: var(--light);
}

.fw-300 {
  font-weight: 300 !important;
}

.fw-400 {
  font-weight: 400 !important;
}

.fw-black {
  font-weight: 900 !important;
}

.font-weight-bold * {
  font-weight: bold;
}

.font-weight-bold strong {
  color: var(--primary-color);
}

/* ------------------------------------------- */
/* BACKGROUND COLORI */
/* ------------------------------------------ */

.primary-bg {
  background-color: var(--primary-color);
}

.light-primary-bg {
  background-color: var(--light-primary);
}

.dark-bg {
  background-color: var(--dark);
}

.light-bg {
  background-color: var(--light);
}

/* ------------------------------------------- */
/* PULSANTI */
/* ------------------------------------------ */

.btn-1,
#gform_submit_button_1,
#gform_submit_button_2,
#gform_submit_button_3,
#gform_submit_button_5 {
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  padding: 15px 30px;
  border-radius: 10px;
  color: #ffffff;
  background-color: var(--primary-color);
  font-family: var(--font-family);
  font-weight: 300;
  transition: 0.1s ease-in-out;
  border: 2px solid var(--primary-color);
}

.btn-1:hover,
#gform_submit_button_1:hover,
#gform_submit_button_2:hover,
#gform_submit_button_3:hover,
#gform_submit_button_5:hover {
  background-color: var(--dark);
  color: #ffffff;
}

.btn-2 {
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  padding: 15px 30px;
  border-radius: 10px;
  color: var(--primary-color);
  background-color: transparent;
  font-family: var(--font-family);
  font-weight: 300;
  transition: 0.1s ease-in-out;
  border: 2px solid var(--primary-color);
}

.btn-2:hover {
  background-color: var(--primary-color);
  color: #ffffff;
}

.btn-3 {
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  text-transform: uppercase;
  padding: 10px 20px;
  border-radius: 10px;
  color: #ffffff;
  background-color: var(--dark);
  font-family: var(--font-family);
  font-weight: bold;
  transition: 0.1s ease-in-out;
  border: 2px solid var(--dark);
}

.btn-3:hover {
  background-color: #ffffff;
  color: var(--dark);
}

.btn-4 {
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  text-transform: uppercase;
  padding: 10px 20px;
  border-radius: 10px;
  color: #ffffff;
  background-color: var(--primary-color);
  font-family: var(--font-family);
  font-weight: bold;
  transition: 0.1s ease-in-out;
  border: 2px solid var(--primary-color);
}

.btn-4:hover {
  background-color: #ffffff;
  color: var(--primary-color);
}

.btn-info-stock {
  text-decoration: none;
  display: inline-block;
  font-size: 13px;
  padding: 6px 10px;
  border-radius: 10px;
  color: #ffffff;
  background-color: var(--primary-color);
  font-family: var(--font-family);
  font-weight: 300;
  transition: 0.1s ease-in-out;
  border: 2px solid var(--primary-color);
}

.btn-info-stock:hover {
  background-color: var(--dark);
  color: #ffffff;
}

.btn-search-stock {
  border: none;
  background-color: var(--light-primary);
  padding: 10px 20px;
  border-radius: 10px;
  color: var(--dark);
}