/**
    * Get the font size from the font size map
    * @param {string} $element - Element name
    * @param {string} $device - Device name
    * @return {string} - Font size
    */
.block.newsletter-block {
  background-color: var(--accent-color);
  margin-bottom: 0;
}
@media only screen and (min-width: 1500px) and (max-width: 4999px) {
  .block.newsletter-block .container {
    padding-inline: 65px;
  }
}
@media only screen and (min-width: 1280px) and (max-width: 1499px) {
  .block.newsletter-block .container {
    padding-inline: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1279px) {
  .block.newsletter-block .container {
    padding-inline: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .block.newsletter-block .container {
    padding-inline: 25px;
  }
}
@media only screen and (min-width: 1500px) and (max-width: 4999px) {
  .block.newsletter-block .container {
    padding-block: 40px;
  }
}
@media only screen and (min-width: 1280px) and (max-width: 1499px) {
  .block.newsletter-block .container {
    padding-block: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1279px) {
  .block.newsletter-block .container {
    padding-block: 25px;
  }
}
@media only screen and (max-width: 767px) {
  .block.newsletter-block .container {
    padding-block: 25px;
  }
}
.block.newsletter-block .container .newsletter-content {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}
.block.newsletter-block .container .newsletter-content .newsletter-title {
  font-size: clamp(28px, 3.4895833333vw, 67px);
  color: var(--primary-color);
  font-weight: 700;
  margin-bottom: clamp(15px, 1.5625vw, 30px);
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-description {
  font-size: clamp(16px, 1.0416666667vw, 20px);
  color: var(--primary-color);
  margin-bottom: clamp(30px, 2.6041666667vw, 50px);
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: clamp(20px, 1.5625vw, 30px);
}
@media only screen and (max-width: 767px) {
  .block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper {
    flex-direction: column;
  }
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-form-control-wrap {
  flex: 1;
  width: 100%;
  position: relative;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-form-control-wrap input[type=email] {
  width: 100%;
  padding: clamp(12px, 0.9375vw, 18px) clamp(20px, 1.5625vw, 30px);
  font-size: clamp(16px, 0.9375vw, 18px);
  color: var(--primary-color);
  background-color: transparent;
  border: none;
  border-bottom: 2px solid var(--primary-color);
  outline: none;
  transition: border-color 0.3s ease;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-form-control-wrap input[type=email]::-moz-placeholder {
  color: var(--primary-color);
  opacity: 0.8;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-form-control-wrap input[type=email]::placeholder {
  color: var(--primary-color);
  opacity: 0.8;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-form-control-wrap input[type=email].wpcf7-not-valid {
  border-bottom-color: #ff4444;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
  position: absolute;
  bottom: -25px;
  left: 0;
  font-size: clamp(12px, 0.7291666667vw, 14px);
  color: #ff4444;
  background-color: rgba(255, 68, 68, 0.1);
  padding: 5px 10px;
  border-radius: 4px;
  white-space: nowrap;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper input[type=submit] {
  border-radius: 20px;
  font-weight: 700;
  background-color: transparent;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
  padding: clamp(12px, 0.9375vw, 18px) clamp(18px, 1.40625vw, 27px);
  font-size: clamp(16px, 1.0416666667vw, 20px);
  color: var(--primary-color);
  border: 2px solid var(--primary-color);
  cursor: pointer;
  border: none;
  flex-shrink: 0;
  border: 2px solid var(--primary-color);
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper input[type=submit]:hover {
  background-color: var(--primary-color);
  color: var(--accent-color);
}
@media only screen and (max-width: 767px) {
  .block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper input[type=submit] {
    width: 100%;
  }
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper input[type=submit]:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--primary-color);
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin-left: 10px;
  visibility: hidden;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-input-wrapper .wpcf7-spinner.is-active {
  visibility: visible;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
  display: block;
  margin-top: 10px;
  font-size: clamp(12px, 0.7291666667vw, 14px);
  color: #ff4444;
  text-align: center;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: clamp(14px, 0.8333333333vw, 16px);
  color: var(--primary-color);
  cursor: pointer;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item label input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 24px;
  height: 24px;
  min-width: 24px;
  border: 2px solid var(--primary-color);
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  background-color: transparent;
  transition: all 0.3s ease;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item label input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  background-color: var(--primary-color);
  border-radius: 50%;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item label input[type=checkbox]:hover {
  opacity: 0.8;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item label .wpcf7-list-item-label a {
  color: var(--primary-color);
  text-decoration: underline;
}
.block.newsletter-block .container .newsletter-content .newsletter-form .newsletter-container .newsletter-subscribe-container .newsletter-terms .wpcf7-list-item label .wpcf7-list-item-label a:hover {
  opacity: 0.8;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}