.blue-underline {
  position: relative;
  display: inline-block;
  color: #2c73b7;
  margin-left: 0.25rem;
}

.blue-underline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.25rem;
  width: 100%;
  height: 0.5rem;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22435%22%20height%3D%2214%22%20viewBox%3D%220%200%20435%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M68.5576%209.99993C123.233%201.99998%20217.5%201.99998%20366.443%209.99993%22%20stroke%3D%22%23EF3D48%22%20stroke-width%3D%223.99997%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  pointer-events: none;
  z-index: -1;
}

@media (min-width: 640px) {
  .blue-underline::after {
    bottom: -0.5rem;
    height: 0.75rem;
  }
}
/* ========================================================
   HOMEPAGE CONTACT FORM 7 STYLING (SAME AS CONTACT US PAGE)
   ======================================================== */
div.form-grid,
.form-grid,
.quote-cf7-form,
#homepage-form-wrapper .wpcf7 form,
#homepage-form-wrapper .form-grid,
#homepage-form-wrapper .quote-cf7-form,
#homepage-form-wrapper .popup-cf7-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.25rem !important;
  width: 100% !important;
  font-family: "Manrope", sans-serif !important;
}

div.form-grid form > p,
div.form-grid .wpcf7-form p,
#homepage-form-wrapper form > p,
#homepage-form-wrapper .wpcf7-form p {
  margin: 0 !important;
  padding: 0 !important;
}

div.form-grid br,
#homepage-form-wrapper br {
  display: none !important;
}

div.form-grid .wpcf7-form-control-wrap,
#homepage-form-wrapper .wpcf7-form-control-wrap {
  display: block !important;
  width: 100% !important;
  position: relative !important;
  margin-top: 0 !important;
}

/* 2 Columns Side by Side */
div.side-by-side,
.side-by-side,
.quote-form-row,
.cf7-grid-2,
.grid-cols-2,
.form-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1.25rem !important;
  width: 100% !important;
}

div.side-by-side > p,
.quote-form-row > p {
  display: contents !important;
}

div.side-by-side p,
.quote-form-row p {
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1.25rem !important;
  width: 100% !important;
}

@media (min-width: 480px) {
  div.side-by-side,
  .side-by-side,
  .quote-form-row,
  .cf7-grid-2,
  .grid-cols-2,
  .form-row {
    grid-template-columns: 1fr 1fr !important;
  }

  div.side-by-side p,
  .quote-form-row p {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* Labels */
div.form-grid label,
div.form-grid .custom-form-label,
div.form-grid .cf7-label {
  display: flex !important;
  flex-direction: column !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  color: #0b2944 !important;
  margin-bottom: 0 !important;
  line-height: 1.2 !important;
  gap: 0.5rem !important;
  width: 100% !important;
  font-family: "Manrope", sans-serif !important;
}

@media (min-width: 640px) {
  div.form-grid label,
  div.form-grid .custom-form-label,
  div.form-grid .cf7-label {
    font-size: 0.875rem !important;
  }
}

/* Inputs & Selects */
div.form-grid input[type="text"],
div.form-grid input[type="email"],
div.form-grid input[type="tel"],
div.form-grid input.wpcf7-text,
div.form-grid input.wpcf7-email,
div.form-grid input.wpcf7-tel,
div.form-grid select,
div.form-grid .form-input-field:not(textarea) {
  width: 100% !important;
  height: 48px !important;
  padding: 0.75rem 1.25rem !important;
  border-radius: 9999px !important;
  border: 1px solid #dce4ea !important;
  background-color: #ffffff !important;
  font-size: 0.875rem !important;
  font-family: "Manrope", sans-serif !important;
  color: #0b2944 !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
  font-weight: 400 !important;
  outline: none !important;
  text-indent: 0 !important;
}

div.form-grid input::placeholder,
div.form-grid textarea::placeholder,
div.form-grid .form-input-field::placeholder {
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

div.form-grid input:focus,
div.form-grid select:focus,
div.form-grid textarea:focus,
div.form-grid .form-input-field:focus {
  outline: none !important;
  border-color: #14538f !important;
  box-shadow: 0 0 0 3px rgba(20, 83, 143, 0.1) !important;
}

/* Textarea */
div.form-grid textarea,
div.form-grid .wpcf7-textarea,
div.form-grid textarea.form-input-field {
  width: 100% !important;
  min-height: 135px !important;
  padding: 1rem 1.25rem !important;
  border-radius: 20px !important;
  border: 1px solid #dce4ea !important;
  background-color: #ffffff !important;
  font-size: 0.875rem !important;
  font-family: "Manrope", sans-serif !important;
  color: #0b2944 !important;
  resize: vertical !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}

/* Submit Button Wrapper */
div.form-grid .quote-submit-wrapper,
div.form-grid .submit-btn-wrap {
  /* width: 100% !important; */
  margin-top: 0.25rem !important;
}

div.form-grid input[type="submit"].wpcf7-submit,
div.form-grid input[type="submit"],
div.form-grid .quote-submit-button {
  /* width: 100% !important; */
  height: 52px !important;
  padding: 0 3.5rem 0 1.5rem !important;
  border-radius: 9999px !important;
  background-color: #ef3d48 !important;
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 33 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='32.4426' height='32.4426' rx='16.2213' fill='white' fill-opacity='0.2'/%3E%3Cpath d='M10.8125 16.2214H21.6267M16.992 10.8143L22.3991 16.2214L16.992 21.6285' stroke-width='1.35177' stroke-linecap='round' stroke-linejoin='round' stroke='white'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 30px 30px !important;
  color: #ffffff !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  font-family: "Manrope", sans-serif !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(239, 61, 72, 0.35) !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  text-align: left !important;
  box-sizing: border-box !important;
  display: inline-block !important;
  position: relative !important;
}

div.form-grid input[type="submit"]:hover,
div.form-grid .quote-submit-button:hover {
  background-color: #d9303b !important;
  background-position: right 12px center !important;
  box-shadow: 0 6px 20px rgba(239, 61, 72, 0.45) !important;
  transform: translateY(-1px) !important;
}

div.form-grid .btn-arrow,
div.form-grid .cf7-submit-arrow {
  display: none !important;
}
.hero-comparison-wrapper input[type="range"] {
  width: 100%;
  height: 100%;
  outline: none;
  background: none;
  -webkit-appearance: none;
  cursor: col-resize;
}

.hero-comparison-wrapper .drag-line::before,
.hero-comparison-wrapper .drag-line::after {
  content: "";
  position: absolute;
  width: 2px;
  height: calc(50% - 22px);
  background: #ffffff;
  /* left: 50%; */
  left: 39%;
  transform: translateX(-50%);
}

.hero-comparison-wrapper .drag-line::before {
  top: 0;
}

.hero-comparison-wrapper .drag-line::after {
  bottom: 0;
}

.marquee-section {
  width: 100%;
  background-color: #0b2944;
  border-top: 4px solid #c13948;
  border-bottom: 4px solid #c13948;
  overflow: hidden;
  padding: 16px 0;
}

.marquee-track {
  display: flex;
  width: max-content;
  animation: scroll 28s linear infinite;
}

.marquee-section:hover .marquee-track {
  animation-play-state: paused;
}

.marquee-group {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.marquee-item {
  display: flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
  padding: 0 36px;
}

.diamond {
  width: 8px;
  height: 8px;
  background-color: #c13948;
  transform: rotate(45deg);
  flex-shrink: 0;
}

.marquee-item span {
  color: #ffffff;
  font-size: 1.375rem; /* 22px */
  line-height: 2.0625rem;
}

@media (max-width: 768px) {
  .marquee-item span {
    font-size: 0.75rem;
    line-height: 1.186875rem;
  }
  .diamond {
    width: 6.33px;
    height: 6.33px;
  }
  .marquee-section {
    padding: 10px 0;
  }
  .div.form-grid input.wpcf7-submit {
    font-size: 15.06px;
  }
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .marquee-track {
    animation: none;
  }
}

/* Hide scrollbar for popular packaging section on mobile */
.popular-packaging::-webkit-scrollbar {
  display: none;
}
.popular-packaging {
  -ms-overflow-style: none;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}