:root{
  --qode-opposite-color: #fc0101; /* change to your desired colour */
}
/* ================= CF7 Clean Dark Style ================= */

/* Paragraph spacing */
.wpcf7-form p {
  margin: 0 0 28px;
}

/* Labels */
.wpcf7-form label {
  display: block;
  font-weight: 600;
  margin-bottom: 8px;
  color: rgba(255,255,255,0.85);
}

/* Inputs underline */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255,255,255,0.45);
  padding: 10px 0 12px;
  color: #ffffff;
  font-weight: 400;
  outline: none;
}

/* Focus */
.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
  border-bottom: 1px solid rgba(255,255,255,0.9);
}

/* Textarea */
.wpcf7-form textarea {
  min-height: 95px;
  line-height: 1.6;
  resize: vertical;
}

/* Button — always yellow */
.wpcf7-form input[type="submit"] {
  margin-top: 20px;
  background: #F5B400 !important;
  color: #0b2a2f !important;
  border: none !important;
  padding: 14px 32px;
  border-radius: 999px;
  font-weight: 700;
  cursor: pointer;
  transition: 0.2s ease;
}

/* Hover — still yellow, slightly brighter */
.wpcf7-form input[type="submit"]:hover {
  background: #F5B400 !important;
  color: #0b2a2f !important;
  opacity: 0.95;
}
/* Force CF7 response messages to white text */
.wpcf7 form .wpcf7-response-output,
.wpcf7 form .wpcf7-mail-sent-ok,
.wpcf7 form .wpcf7-mail-sent-ng,
.wpcf7 form .wpcf7-validation-errors,
.wpcf7 form .wpcf7-acceptance-missing {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.35) !important;
}
/* Button base */
.wpcf7-form input[type="submit"]{
  background: #F5B400 !important;
  color: #0b2a2f !important;
}

/* IMPORTANT: don’t force the hover colour */
/* Yellow default */
.wpcf7-form input[type="submit"]{
  background: #F5B400 !important;
  color: #0b2a2f !important;
  border: none !important;
}

/* Red hover (uses Qode variable if available) */
.wpcf7-form input[type="submit"]:hover{
  background: var(--qode-main-color, #e53935) !important;
  color: #ffffff !important;
  opacity: 1 !important;
}
/* ===== FORCE CF7 BUTTON: yellow default, red hover ===== */
body .wpcf7 form input.wpcf7-submit{
  background-color: #F5B400 !important;
  border-color: #F5B400 !important;
  color: #0b2a2f !important;
  opacity: 1 !important;
  filter: none !important;
  background-image: none !important;
}

body .wpcf7 form input.wpcf7-submit:hover{
  background-color: var(--qode-main-color, #ff3b30) !important; /* your red */
  border-color: var(--qode-main-color, #ff3b30) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  background-image: none !important;
}
/* ===== FORCE CF7 BUTTON: yellow default, red hover ===== */
body .wpcf7 form input.wpcf7-submit{
  background-color: #F5B400 !important;
  border-color: #F5B400 !important;
  color: #0b2a2f !important;
  opacity: 1 !important;
  filter: none !important;
  background-image: none !important;
}

body .wpcf7 form input.wpcf7-submit:hover{
  background-color: var(--qode-main-color, #ff3b30) !important; /* your red */
  border-color: var(--qode-main-color, #ff3b30) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  background-image: none !important;
}
/* === Greenfield: Qode Service List spacing fix === */

/* Make each item a 3-column grid with a real gap */
.greenfield-service-list .qodef-service-list-item,
.greenfield-service-list .qodef-e,
.greenfield-service-list .qodef-m-item {
  display: grid !important;
  grid-template-columns: 140px minmax(260px, 1.2fr) minmax(280px, 1fr) !important;
  column-gap: 40px !important;
  align-items: center;
}

/* Keep the title from colliding with the description */
.greenfield-service-list h1,
.greenfield-service-list h2,
.greenfield-service-list h3,
.greenfield-service-list h4,
.greenfield-service-list .qodef-e-title,
.greenfield-service-list .qodef-m-title {
  line-height: 1.2 !important;
  margin: 0 !important;
}

/* Improve readability of the right column text */
.greenfield-service-list p,
.greenfield-service-list .qodef-e-text,
.greenfield-service-list .qodef-m-text {
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* Make sure the right column can wrap and doesn't float weirdly */
.greenfield-service-list .qodef-e-content,
.greenfield-service-list .qodef-m-content,
.greenfield-service-list .qodef-e-description,
.greenfield-service-list .qodef-m-description {
  min-width: 0 !important;
}

/* Tablet: stack title + description under the number */
@media (max-width: 1024px){
  .greenfield-service-list .qodef-service-list-item,
  .greenfield-service-list .qodef-e,
  .greenfield-service-list .qodef-m-item{
    grid-template-columns: 120px 1fr !important;
    row-gap: 14px !important;
  }
}/* ================================
   ELEMENTOR ACCORDION – BRAND RED + ALIGNMENT
   Brand red: #fc0101
================================ */

/* 1) Make the built-in toggle icon red (covers SVG + icon fonts) */
.elementor-accordion .elementor-accordion-icon i,
.elementor-accordion .elementor-accordion-icon svg {
  color: #fc0101 !important;
  fill: #fc0101 !important;
}

/* 2) If the icon is drawn with CSS (plus/minus strokes), force them red */
.elementor-accordion .elementor-accordion-icon::before,
.elementor-accordion .elementor-accordion-icon::after {
  background-color: #fc0101 !important;
}

/* 3) OPTIONAL: Force a clean red minus line on the right (like your screenshot)
   - If you use this, it may appear alongside the existing icon.
   - If that happens, I’ll show you how to hide the default icon. */
.elementor-accordion .elementor-tab-title {
  position: relative;
}
.elementor-accordion .elementor-tab-title::after {
  content: "";
  position: absolute;
  right: 24px;
  top: 50%;
  width: 36px;
  height: 3px;
  background: #fc0101;
  transform: translateY(-50%);
  border-radius: 2px;
}

/* 4) Fix the “body copy sits low” issue (remove extra top spacing) */
.elementor-accordion .elementor-tab-content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Prevent the first paragraph from adding extra top margin */
.elementor-accordion .elementor-tab-content > *:first-child {
  margin-top: 0 !important;
}
.qodef-service-list .qodef-e-number-holder {
flex-basis: 18%;
}
.qodef-service-list .qodef-e-title {
flex-basis: 46%;
padding-right: 15px;
}