/*===== Global CSS =====*/

/* ===== Proxima Nova (self-hosted) ===== */
@font-face {
  font-family: 'Proxima Nova';
  src: url('../fonts/ProximaNovaLight.woff2') format('woff2'),
       url('../fonts/ProximaNovaLight.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Proxima Nova';
  src: url('../fonts/ProximaNovaRegular.woff2') format('woff2'),
       url('../fonts/ProximaNovaRegular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Proxima Nova';
  src: url('../fonts/ProximaNovaBold.woff2') format('woff2'),
       url('../fonts/ProximaNovaBold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Proxima Nova';
  src: url('../fonts/ProximaNovaBlack.woff2') format('woff2'),
       url('../fonts/ProximaNovaBlack.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --font: 'Proxima Nova', sans-serif;
  --am-primary-color: #822a7a;
  --am-secondary-color: #822a7a;
  --am-magma-orange: #ea7319;
  --am-agri-link: #0092d6;
  --am-agri-care: #009b58;
  --am-black: #000;
  --am-grey: #f4f4f4;
  --am-white: #fff;
  --font-size: min(1rem, 1.25vw); /* 16px → 20px */
  --line-height: 1.5;

  /* === Fluid heading scale — clamp(mobile, viewport-based, desktop) === */
  --nav-font-size: clamp(0.875rem, 0.75rem + 0.5vw, 1rem); /* 14px → 16px */
  --h1-size: clamp(2.25rem, 1.5rem + 3.2vw, 4.0625rem);   /* 36px → 65px */
  --h2-size: clamp(1.875rem, 1.56rem + 1.33vw, 2.625rem); /* 30px → 42px */
  --h3-size: clamp(1.3625rem, 1.33rem + 1vw, 1.725rem);   /* 25px → 34px */
  --h4-size: clamp(1.2125rem, 1.13rem + 0.77vw, 1.45rem); /* 21px → 28px */
  --h5-size: clamp(1.125rem, 1.02rem + 0.44vw, 1.325rem); /* 18px → 22px */
  --h6-size: clamp(1rem, 0.95rem + 0.22vw, 1.125rem);     /* 16px → 18px */
}

body,
body .et-boc {
  font-family: var(--font) !important;
  font-size: var(--font-size) !important;
  line-height: 1.2 !important;
  font-weight: 400;
}

body #page-container .et_pb_section .negative-btn:hover {
  border-color: var(--am-white) !important;
  color: var(--am-primary-color) !important;
  background-color: var(--am-white) !important;
}

/* ===== Typography ===== */
/* Anchored on #page-container (present in Divi 4, 5 and 5 compat mode) and       */
/* flagged !important so per-module dynamic CSS from the builder does not win.    */
body #page-container h1,
body #page-container .et_pb_module h1,
body #page-container .et_pb_heading_container h1,
body #page-container .h1-style,
body #page-container .h1-style * {
  font-family: var(--font) !important;
  /* font-size: var(--h1-size) !important; */
  font-weight: 300 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}
body #page-container h2,
body #page-container .et_pb_module h2,
body #page-container .et_pb_heading_container h2,
body #page-container .h2-style,
body #page-container .h2-style * {
  font-family: var(--font) !important;
  /* font-size: var(--h2-size) !important; */
  font-weight: 400 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.015em !important;
}
body #page-container h3,
body #page-container .et_pb_module h3,
body #page-container .et_pb_heading_container h3,
body #page-container .h3-style,
body #page-container .h3-style * {
  font-family: var(--font) !important;
  /* font-size: var(--h3-size) !important; */
  font-weight: 700 !important;
  line-height: 1.2 !important;
}
body #page-container h4,
body #page-container .et_pb_module h4,
body #page-container .et_pb_heading_container h4,
body #page-container .h4-style,
body #page-container .h4-style * {
  font-family: var(--font) !important;
  /* font-size: var(--h4-size) !important; */
  font-weight: 400 !important;
  line-height: 1.3 !important;
}
body #page-container h5,
body #page-container .et_pb_module h5,
body #page-container .et_pb_heading_container h5,
body #page-container .h5-style,
body #page-container .h5-style * {
  font-family: var(--font) !important;
  /* font-size: var(--h5-size) !important; */
  font-weight: 400 !important;
  line-height: 1.35 !important;
}
body #page-container h6,
body #page-container .et_pb_module h6,
body #page-container .et_pb_heading_container h6,
body #page-container .h6-style,
body #page-container .h6-style * {
  font-family: var(--font) !important;
  /* font-size: var(--h6-size) !important; */
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

/* Buttons & nav — regular weight */
body #page-container .et_pb_menu_0_tb_header.et_pb_menu ul li a,
body #page-container .et_pb_button,
body #page-container .link-btn-group a,
body #page-container button,
body #page-container input[type=submit],
body #page-container .wpcf7-form .row.submit-row > p .wpcf7-submit {
  font-family: var(--font) !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

body #page-container .h1-style,
body #page-container .h1-style * {
  font-size: var(--h1-size) !important;
}
body #page-container .h2-style,
body #page-container .h2-style * {
  font-size: var(--h2-size) !important;
}
body #page-container .h3-style,
body #page-container .h3-style * {
  font-size: var(--h3-size) !important;
}
body #page-container .h4-style,
body #page-container .h4-style * {
  font-size: var(--h4-size) !important;
}
body #page-container .h5-style,
body #page-container .h5-style * {
  font-size: var(--h5-size) !important;
}
body #page-container .h6-style,
body #page-container .h6-style *,
body #page-container .et_pb_button,
body #page-container .link-btn-group a {
  font-size: var(--h6-size) !important;
}

/* Form fields & Contact Form 7 controls */
body #page-container input,
body #page-container select,
body #page-container textarea,
body #page-container button,
body #page-container .wpcf7-form-control,
body #page-container .wpcf7-form input,
body #page-container .wpcf7-form select,
body #page-container .wpcf7-form textarea,
body #page-container .wpcf7 label {
  font-family: var(--font) !important;
  /* font-size: var(--font-size) !important; */
  line-height: 1.5 !important;
}

/* ===== Navigation ===== */
body .csln-menu ul > li {
	margin-top: 0 !important;
	> a {
		margin-top: 0 !important;
		padding: 20px !important;
	}
} 

.csln-menu .et-menu .menu-item-has-children>a:first-child:after {
	top: 35%;
}

/* ===== Buttons ===== */
body #page-container .et_pb_button.black-btn {
  background-color: var(--am-black);
  color: var(--am-white);
  border-color: var(--am-black);
  border-radius: 0px;
  padding: 0.5rem 1rem;
  cursor: pointer;

  &:hover {
    color: var(--am-black) !important;
    background-color: rgba(255, 255, 255, 0);
    border-color: var(--am-black) !important;
    border-radius: 0px;
  }
}

.purple-btn {
  background-color: var(--am-primary-color);
  color: var(--am-white);
  border-color: var(--am-primary-color);
  border: 2px solid var(--am-primary-color);
  border-radius: 0px;
  padding: 0.5rem 1rem !important;
  cursor: pointer;

  &:hover {
    color: var(--am-primary-color) !important;
    background-color: var(--am-white) !important;
    border-color: var(--am-primary-color) !important;
    padding-right: 1.5rem !important;
    border-radius: 0px !important;
  }
}

.blue-btn {
  background-color: var(--am-agri-link);
  color: var(--am-white);
  border-color: var(--am-agri-link);
  border: 2px solid var(--am-agri-link);
  border-radius: 0px;
  padding: 0.5rem 1rem !important;
  cursor: pointer;

  &:hover {
    color: var(--am-agri-link) !important;
    background-color: var(--am-white) !important;
    border-color: var(--am-agri-link) !important;
    padding-right: 1.5rem !important;
    border-radius: 0px !important;
  }
}

.green-btn {
  background-color: var(--am-agri-care);
  color: var(--am-white);
  border-color: var(--am-agri-care);
  border: 2px solid var(--am-agri-care);
  border-radius: 0px;
  padding: 0.5rem 1rem !important;
  cursor: pointer;

  &:hover {
    color: var(--am-agri-care) !important;
    background-color: var(--am-white) !important;
    border-color: var(--am-agri-care) !important;
    padding-right: 1.5rem !important;
    border-radius: 0px !important;
  }
}

/* === Contact Forms CF7 === */
.wpcf7 {
  margin: 0;
}

.wpcf7 .row {
  margin: 0;
}

.wpcf7 .row p {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: min(1%, 10px);
  margin: 0 0 min(1%, 10px) 0;
}

.wpcf7-form-control-wrap {
  width: 100%;
}

.wpcf7 label {
  display: block;
}

input.wpcf7-form-control[type=email],
input.wpcf7-form-control[type=password],
input.wpcf7-form-control[type=tel],
input.wpcf7-form-control[type=text],
input.wpcf7-form-control,
select.wpcf7-form-control,
textarea.wpcf7-form-control {
  background-color: transparent;
  width: 100%;
  padding: 9px 0.75rem;
  border: 1px solid var(--am-white);
  color: var(--am-white);
  transition: 0.25s all ease-in-out;
  font-size: 1.05rem;
}

textarea.wpcf7-textarea {
  max-height: 6rem;
}

.wpcf7-form-control::placeholder {
  color: var(--am-white);
  opacity: 0.7;
}

input.wpcf7-form-control:focus,
select.wpcf7-form-control:focus,
textarea.wpcf7-form-control:focus {
  background-color: var(--am-white);
  color: var(--am-black);
}

.wpcf7 .wpcf7-submit,

.wpcf7 input.wpcf7-submit {
  background-color: var(--am-primary-color);
  border-width: 1px !important;
  border-color: var(--am-primary-color);
  border-radius: 0px;
  padding: 0.5rem 1rem 0.5 7rem;
  font-size: 1.25rem;
  line-height: 1.5;
  cursor: pointer;
}

.wpcf7 .wpcf7-submit:hover,
.wpcf7 input.wpcf7-submit:hover {
  color: var(--am-primary-color) !important;
  background-color: rgba(255, 255, 255, 0);
  border-color: var(--am-primary-color) !important;
  border-radius: 0px;
}