@import url("https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600;700;800;900&family=Poppins:wght@500;600;700;800&display=swap");

/* Energy Team | AI Process Opportunity Map
 * Source: Chen, "energy-team-ai-map-v3-exact.html" (September 2026).
 * Generated by build.mjs. Do not hand-edit: edit the source and rebuild.
 */

#et-apm{
  --black:#000;
  --dark:#0c0c0c;
  --card:#111;
  --white:#fff;
  --gray:#b8b8b8;
  --line:#323232;
  --red:#ef1b2d;
  --pink:#ff9ca8;
  --purple:#8067f6;
  --purple2:#9e89ff;

  --gradient:
    linear-gradient(
      120deg,
      #8067f6 0%,
      #b6509d 28%,
      #ef1b2d 55%,
      #ce3f79 75%,
      #8067f6 100%
    );
}


#et-apm *{
  box-sizing:border-box;
}


#et-apm{
  scroll-behavior:smooth;
}


#et-apm{
  margin:0;
  background:#000;
  color:#fff;
  font-family:"Heebo",Arial,sans-serif;
  direction:rtl;
}


#et-apm button,
#et-apm select,
#et-apm input{
  font-family:"Heebo",sans-serif;
}


#et-apm .container{
  width:min(92%,1160px);
  margin:auto;
  padding:60px 0 100px;
}


#et-apm .en{
  font-family:"Poppins",sans-serif;
  direction:ltr;
}


/* HERO */

#et-apm .hero{
  min-height:560px;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
  background:var(--gradient);
}


#et-apm .hero::after{
  content:"";
  position:absolute;
  left:-5%;
  bottom:-55px;
  width:110%;
  height:120px;
  background:#000;
  border-radius:50% 50% 0 0 / 35% 35% 0 0;
}


#et-apm .hero-inner{
  width:min(92%,980px);
  margin:auto;
  padding:80px 0 140px;
  text-align:center;
  position:relative;
  z-index:2;
}


#et-apm .kicker{
  font-family:"Poppins",sans-serif;
  direction:ltr;
  font-size:13px;
  font-weight:700;
  letter-spacing:1.6px;
  margin-bottom:18px;
}


#et-apm .hero h1{
  margin:0;
  font-size:clamp(46px,6vw,76px);
  line-height:1.03;
  font-weight:900;
}


#et-apm .hero p{
  max-width:770px;
  margin:20px auto 0;
  font-size:20px;
}


#et-apm .hero-badge{
  display:inline-block;
  margin-top:26px;
  border:1.5px solid rgba(255,255,255,.8);
  border-radius:999px;
  padding:10px 20px;
  font-size:14px;
}


/* CARDS */

#et-apm .card{
  border-radius:32px;
  margin-top:30px;
  padding:36px;
}


#et-apm .white-card{
  background:#fff;
  color:#000;
}


#et-apm .dark-card{
  background:#000;
  border:1.5px solid var(--purple);
}


#et-apm .section-en{
  font-family:"Poppins",sans-serif;
  direction:ltr;
  text-align:right;
  color:var(--purple);
  font-size:13px;
  font-weight:700;
}


#et-apm .white-card .section-en{
  color:var(--red);
}


#et-apm h2{
  margin:6px 0 10px;
  font-size:36px;
  line-height:1.15;
  font-weight:900;
}


#et-apm .muted{
  color:#aaa;
}


#et-apm .white-card .muted{
  color:#555;
}


/* STEP 1 */

#et-apm .profile-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:28px;
}


#et-apm .field-label{
  display:block;
  margin-bottom:7px;
  font-size:14px;
  font-weight:700;
}


#et-apm select{
  width:100%;
  min-height:52px;
  border:1px solid #ddd;
  background:#f7f7f7;
  color:#111;
  border-radius:14px;
  padding:12px 14px;
  font-size:15px;
  direction:rtl;
}


#et-apm .actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:30px;
}


#et-apm .form-feedback{
  min-height:24px;
  margin-top:14px;
  text-align:center;
  color:#ffb2bc;
  font-weight:700;
}


#et-apm .btn{
  border:0;
  border-radius:15px;
  padding:15px 27px;
  font-size:17px;
  font-weight:800;
  cursor:pointer;
  transition:.2s ease;
}


#et-apm .btn:hover{
  transform:translateY(-2px);
}


#et-apm .btn-primary{
  background:var(--red);
  color:#fff;
}


#et-apm .btn-secondary{
  background:#111;
  color:#fff;
  border:1px solid #444;
}


/* STEP 2 */

#et-apm #step2,
#et-apm #results{
  display:none;
}


#et-apm .personal-message{
  margin-top:20px;
  padding:20px;
  border-radius:17px;
  border-right:5px solid var(--red);
  background:#121212;
  color:#ddd;
}


#et-apm .personal-message strong{
  color:#fff;
}


#et-apm .process-list{
  display:grid;
  gap:20px;
  margin-top:30px;
}


#et-apm .process-card{
  background:#0c0c0c;
  border:1.5px solid #363636;
  border-radius:28px;
  padding:28px;
  transition:.2s ease;
}


#et-apm .process-card:hover{
  border-color:var(--purple);
}


#et-apm .process-card.incomplete{
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(239,27,45,.14);
}


#et-apm .process-number{
  color:var(--purple2);
  font-family:"Poppins",sans-serif;
  direction:ltr;
  font-weight:700;
  font-size:12px;
}


#et-apm .process-title{
  margin:4px 0 5px;
  font-size:25px;
  font-weight:900;
}


#et-apm .process-note{
  color:#777;
  font-size:13px;
}


#et-apm .metric{
  border-top:1px solid #292929;
  margin-top:20px;
  padding-top:18px;
}


#et-apm .metric-title{
  font-size:17px;
  font-weight:700;
  margin-bottom:12px;
}


#et-apm .metric-options{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}


#et-apm .metric-options label{
  cursor:pointer;
}


#et-apm .metric-options input{
  position:absolute;
  opacity:0;
}


#et-apm .metric-options span{
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:9px 17px;
  border-radius:999px;
  border:1.5px solid #3b3b3b;
  background:#111;
  color:#ddd;
  font-size:14px;
  transition:.2s ease;
}


#et-apm .metric-options input:checked + span{
  background:var(--gradient);
  border-color:transparent;
  color:#fff;
  font-weight:700;
}


/* RESULTS */

#et-apm .results-head{
  text-align:center;
  margin-top:50px;
}


#et-apm .results-head .section-en{
  text-align:center;
}


#et-apm .results-head h2{
  font-size:44px;
}


#et-apm .heatmap-card{
  background:#fff;
  color:#000;
}


#et-apm .heatmap-wrap{
  margin-top:30px;
  background:#fff;
  border-radius:26px;
  overflow-x:auto;
}


#et-apm .heatmap{
  min-width:720px;
  border:1px solid #d9d9d9;
  border-radius:16px;
  overflow:hidden;
}


#et-apm .heatmap-row{
  display:grid;
  grid-template-columns:repeat(5,minmax(72px,1fr)) minmax(220px,1.7fr);
  direction:ltr;
}


#et-apm .heatmap-row + .heatmap-row{
  border-top:1px solid #e2e2e2;
}


#et-apm .heatmap-cell,
#et-apm .heatmap-process{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:9px;
  text-align:center;
  font-weight:800;
}


#et-apm .heatmap-header .heatmap-cell,
#et-apm .heatmap-header .heatmap-process{
  min-height:46px;
  background:#f3f3f3;
  color:#222;
}


#et-apm .heatmap-process{
  direction:rtl;
  justify-content:flex-start;
  text-align:right;
  background:#fafafa;
  border-left:1px solid #e2e2e2;
}


#et-apm .heatmap-process small{
  display:block;
  color:#6d6d6d;
  font-size:12px;
  font-weight:600;
}


#et-apm .heatmap-cell{
  position:relative;
  color:rgba(0,0,0,.68);
  border-left:1px solid rgba(255,255,255,.45);
}


#et-apm .heatmap-cell.is-selected{
  color:#000;
  box-shadow:inset 0 0 0 4px #111;
  z-index:1;
}


#et-apm .heatmap-cell.is-selected::after{
  content:"הציון שלכם";
  position:absolute;
  bottom:4px;
  right:6px;
  font-size:9px;
  font-weight:800;
}


#et-apm .heat-high{background:#16b85b;}

#et-apm .heat-good{background:#92d34d;}

#et-apm .heat-mid{background:#ffc21a;}

#et-apm .heat-low{background:#ff1717;}

#et-apm .heat-very-low{background:#c90000;color:#fff;}


#et-apm .heatmap-legend{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
  margin-top:16px;
  color:#555;
  font-size:13px;
  font-weight:700;
}


#et-apm .legend-item{
  display:flex;
  align-items:center;
  gap:6px;
}


#et-apm .legend-swatch{
  width:16px;
  height:16px;
  border-radius:4px;
}


/* RANKING */

#et-apm .ranking{
  margin-top:24px;
}


#et-apm .rank-card{
  margin-top:13px;
  background:#111;
  border:1px solid #333;
  border-radius:19px;
  padding:20px;
}


#et-apm .rank-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}


#et-apm .rank-name{
  font-size:19px;
  font-weight:800;
}


#et-apm .rank-label{
  font-family:"Poppins",sans-serif;
  direction:ltr;
  color:var(--purple2);
  font-size:12px;
  font-weight:800;
  margin-top:5px;
}


#et-apm .rank-score{
  font-family:"Poppins",sans-serif;
  direction:ltr;
  font-size:25px;
  font-weight:800;
  color:var(--red);
}


#et-apm .rank-details{
  margin-top:10px;
  color:#aaa;
  font-size:14px;
}


/* CTA */

#et-apm .cta{
  background:var(--pink);
  color:#000;
  text-align:center;
}


#et-apm .cta h2{
  font-size:38px;
}


#et-apm .cta p{
  max-width:760px;
  margin:0 auto 24px;
}


#et-apm .cta a{
  display:inline-block;
  text-decoration:none;
  padding:13px 22px;
  border-radius:14px;
  font-weight:800;
  margin:5px;
}


#et-apm .cta-primary{
  background:var(--red);
  color:#fff;
}


#et-apm .cta-secondary{
  background:#fff;
  border:1px solid #000;
  color:#000;
}


@media(max-width:760px){


  #et-apm .hero{
    min-height:520px;
  }


  #et-apm .hero h1{
    font-size:42px;
  }


  #et-apm .profile-grid{
    grid-template-columns:1fr;
  }


  #et-apm .card{
    padding:24px 19px;
  }


  #et-apm .metric-options{
    display:grid;
    grid-template-columns:1fr 1fr;
  }


  #et-apm .metric-options span{
    width:100%;
  }


  #et-apm .heatmap-wrap{
    margin-inline:-4px;
  }


}


@media(max-width:480px){

  #et-apm .metric-options{
    grid-template-columns:1fr;
  }


}


/* ---- theme override layer (not part of the source design) ---- */

/* Bootstrap collision. The theme loads Bootstrap, and the source's class names
   are Bootstrap component names: .card, .container, .btn, .btn-primary,
   .btn-secondary. Bootstrap was repainting every dark surface in its own body
   colour, #212529 on #000 and #111, which is close to invisible, turning the
   cards into flex columns, and pushing 18px/35px body typography into a design
   drawn at 16px/normal. Caught by diffing computed styles on the themed page
   against the identical DOM rendered with the source CSS alone. */
#et-apm{
  font-size:16px;
  line-height:normal;
}

#et-apm .card{
  display:block;
  color:inherit;
  background-color:transparent;
  border:0;
}

/* The source's own card colours, re-asserted after that neutraliser. */
#et-apm .white-card{
  background:#fff;
  color:#000;
}

#et-apm .heatmap-card{
  background:#fff;
  color:#000;
}

#et-apm .dark-card{
  background:#000;
  border:1.5px solid var(--purple);
  color:#fff;
}

#et-apm .cta{
  background:var(--pink);
  color:#000;
}

#et-apm .metric-options span{
  background:#111;
  font-weight:400;
}

/* The source darkens .muted to #555 on .white-card, but the heat map card is
   .heatmap-card, so its caption kept the dark-background grey #aaa on white:
   a 2.3:1 contrast ratio. Same treatment as the other white card. */
#et-apm .heatmap-card .muted{
  color:#555;
}

/* The theme prepends a 960px "general-banner" hero that reprints the raw SEO
   title, pipes and all, directly above this page's own hero. Two stacked heroes,
   the top one unreadable. Same banner kill dr-ready needed.
   Unscoped on purpose: this stylesheet is linked from inside the page content,
   so it only ever loads on this page. */
section.banner.general-banner{
  display:none !important;
}

/* The theme pulls the content section up by -280px so it sits under that banner,
   and pads it 65px to clear the overlay. With the banner hidden, that negative
   margin dragged the whole page (and the absolutely positioned site header) off
   the top of the document. Zeroing both puts the header back at y=0, floating
   over this page's gradient hero exactly as it does on the homepage. */
section.general-page-content{
  margin-top:0 !important;
  padding-top:0 !important;
  /* The theme stacks this section at 999999 against the header's 999, so the
     hero painted straight over the logo and nav. Dropping it back to auto lets
     the header float above the gradient, the way it does on the homepage. */
  z-index:auto !important;
}

/* Full-bleed: escape the theme's centred .entry-content column. */
#et-apm{
  width:100vw;
  max-width:100vw;
  margin-inline:calc(50% - 50vw);
  overflow-x:hidden;
}

/* The theme forces text-align:left !important on every heading. Inheriting
   instead restores the design: card headings run RTL from the right, while the
   hero, results head and CTA inherit centre from their own parents. */
#et-apm h1,
#et-apm h2,
#et-apm h3{
  text-align:inherit !important;
  /* !important is required, not tidiness: the theme ships
     .general-page h2 { color:#000 !important }, which painted every heading on
     the dark cards black on black. Inheriting instead takes each heading from
     its own card, white on the dark ones and black on the white ones. */
  color:inherit !important;
  letter-spacing:normal;
}

/* The theme also forces heading sizes, h1 to 2.5rem and h2 to 2rem, both
   !important. That shrank the hero headline from 76px to 40px and every card
   heading from 36px to 32px. These restore the source values verbatim. */
#et-apm .hero h1{
  font-size:clamp(46px,6vw,76px) !important;
  line-height:1.03 !important;
}

#et-apm h2{
  font-size:36px !important;
  line-height:1.15 !important;
}

#et-apm .results-head h2{
  font-size:44px !important;
}

#et-apm .cta h2{
  font-size:38px !important;
}

/* The theme colours <p> black through a selector more specific than the
   inherited white, so the hero copy rendered black on the red gradient.
   Inheriting puts every paragraph back on its own section's colour: white in
   the hero and dark cards, black in the white cards and the pink CTA.
   .muted is excluded so it keeps its own greys. */
#et-apm p:not(.muted){
  color:inherit !important;
}

/* Chen's file had no site header above it. On the live page the header floats
   over the hero, and the kicker landed 45px inside the nav band. This clears it. */
#et-apm .hero{
  padding-top:110px;
}

@media(max-width:760px){
  #et-apm .hero{
    padding-top:90px;
  }

  #et-apm .hero h1{
    font-size:42px !important;
  }
}

#et-apm .hero h1,
#et-apm .hero p,
#et-apm .results-head h2,
#et-apm .cta h2,
#et-apm .cta p{
  text-align:center;
}

/* The theme styles bare <select> and <button>; keep the design's own. */
#et-apm select,
#et-apm button{
  appearance:none;
  -webkit-appearance:none;
  box-shadow:none;
  text-transform:none;
  line-height:1.3;
}

/* Theme link resets inside the CTA card. */
#et-apm .cta a:hover{
  opacity:.9;
}

/* BUGFIX (measured, not cosmetic): the source hides the radios with
   position:absolute + opacity:0 but never sizes them, so each one keeps its
   full ~371px width and hangs 22px past the container. On a 390px phone that
   made the whole document scroll sideways (scrollWidth 408 vs viewport 386).
   Sizing them to 1px removes the overflow (408 -> 379) while keeping them
   focusable, so label clicks and keyboard selection still work. */
#et-apm .metric-options input{
  width:1px;
  height:1px;
  margin:0;
  pointer-events:none;
}

/* Radio inputs are visually replaced by their <span>; keep them reachable by
   keyboard instead of display:none. */
#et-apm .metric-options input:focus-visible + span{
  outline:2px solid var(--purple2);
  outline-offset:2px;
}


/* AI Process Opportunity Map — campaign extension styles
 * Built from Chen's own tokens (--gradient, --red, --purple, --purple2) and her
 * card/pill vocabulary, so the two new sections read as part of the same page.
 * Appended to et-apm.css at upload time. Scoped under #et-apm like the rest.
 */

/* ---- verdict grid ---- */

#et-apm .apm-verdict-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 28px;
}

#et-apm .apm-verdict-card {
  background: #0c0c0c;
  border: 1.5px solid #363636;
  border-top-width: 4px;
  border-radius: 24px;
  padding: 24px;
  display: flex;
  flex-direction: column;
}

#et-apm .apm-verdict-automation {
  border-top-color: var(--purple);
}

#et-apm .apm-verdict-agent {
  border-top-color: #b6509d;
}

#et-apm .apm-verdict-human {
  border-top-color: var(--red);
}

#et-apm .apm-verdict-en {
  font-family: 'Poppins', sans-serif;
  direction: ltr;
  text-align: right;
  font-size: 12px;
  font-weight: 800;
  color: var(--purple2);
}

#et-apm .apm-verdict-human .apm-verdict-en {
  color: var(--pink);
}

#et-apm .apm-verdict-he {
  font-size: 24px;
  font-weight: 900;
  margin-top: 4px;
}

#et-apm .apm-verdict-count {
  color: #777;
  font-size: 13px;
  margin-top: 4px;
}

#et-apm .apm-verdict-list {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  flex: 1;
}

#et-apm .apm-verdict-list li {
  border-top: 1px solid #292929;
  padding: 11px 0;
  font-size: 15px;
  font-weight: 700;
  color: #e6e6e6;
}

#et-apm .apm-verdict-list li small {
  display: block;
  margin-top: 3px;
  color: #777;
  font-size: 12px;
  font-weight: 600;
}

#et-apm .apm-verdict-empty {
  flex: 1;
  margin: 18px 0 0;
  color: #666;
  font-size: 14px;
}

#et-apm .apm-verdict-why {
  margin: 18px 0 0;
  padding-top: 14px;
  border-top: 1px solid #292929;
  color: #9a9a9a;
  font-size: 13px;
  line-height: 1.5;
}

/* ---- verdict chip on the ranking cards ---- */

#et-apm .apm-chip {
  display: inline-block;
  margin-top: 12px;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  color: #fff;
}

#et-apm .apm-chip-automation {
  background: var(--purple);
}

#et-apm .apm-chip-agent {
  background: var(--gradient);
}

#et-apm .apm-chip-human {
  background: var(--red);
}

/* ---- lead form ---- */

#et-apm .apm-form {
  margin-top: 26px;
}

#et-apm .apm-fields {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

#et-apm .apm-field label {
  display: block;
  margin-bottom: 7px;
  font-size: 14px;
  font-weight: 700;
}

#et-apm .apm-field input {
  width: 100%;
  min-height: 52px;
  border: 1px solid #ddd;
  background: #f7f7f7;
  color: #111;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 15px;
  font-family: 'Heebo', Arial, sans-serif;
}

#et-apm .apm-field input:focus {
  outline: 2px solid var(--purple);
  outline-offset: 1px;
}

#et-apm .apm-field input.apm-invalid {
  border-color: var(--red);
  background: #fff5f6;
}

#et-apm .apm-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 20px;
  font-size: 14px;
  color: #555;
  cursor: pointer;
}

#et-apm .apm-consent input {
  width: 20px;
  height: 20px;
  margin: 0;
  flex: 0 0 20px;
  accent-color: var(--red);
  cursor: pointer;
}

#et-apm .apm-consent a {
  color: var(--red);
}

#et-apm .apm-form-feedback {
  min-height: 24px;
  margin-top: 14px;
  text-align: center;
  font-weight: 700;
  color: #555;
}

#et-apm .apm-form-feedback.apm-error {
  color: var(--red);
}

#et-apm .apm-success {
  text-align: center;
  padding: 26px 10px;
}

#et-apm .apm-success-title {
  font-size: 26px;
  font-weight: 900;
  margin-bottom: 8px;
}

#et-apm .apm-success p {
  color: #555;
  margin: 0;
}

/* ---- responsive ---- */

@media (max-width: 900px) {
  #et-apm .apm-verdict-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  #et-apm .apm-fields {
    grid-template-columns: 1fr;
  }
}

/* ---- Contact Form 7 (form 206) inside the map page ----
 * This is the site's shared contact form, so it arrives with English labels,
 * dir="ltr", and classes (.fieldsWrap/.fieldWrap/.note/.privacy) that only the
 * contact page's own stylesheet dresses. Dropped in here it rendered as raw
 * browser defaults. These rules put it into Chen's design language and flip it
 * to RTL; et-apm.ext.js translates the label text.
 */

#et-apm .apm-cf7 .wpcf7 {
  direction: rtl;
  text-align: right;
}

#et-apm .apm-cf7 .hidden-fields-container {
  display: none;
}

/* Spam honeypot. It ships with a visible label and input; it must never be
   shown or a real visitor will fill it and be rejected as a bot. */
#et-apm .apm-cf7 .maspik-field,
#et-apm .apm-cf7 .screen-reader-response {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

#et-apm .apm-cf7 .fieldsWrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}

#et-apm .apm-cf7 .fieldWrap {
  display: block;
  width: 100%;
}

#et-apm .apm-cf7 label {
  display: block;
  margin-bottom: 7px;
  font-size: 14px;
  font-weight: 700;
  color: #000;
}

#et-apm .apm-cf7 .wpcf7-form-control-wrap {
  display: block;
}

#et-apm .apm-cf7 input[type='email'],
#et-apm .apm-cf7 input[type='tel'],
#et-apm .apm-cf7 input[type='text'],
#et-apm .apm-cf7 textarea {
  width: 100%;
  min-height: 52px;
  box-sizing: border-box;
  border: 1px solid #ddd;
  background: #f7f7f7;
  color: #111;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 15px;
  font-family: 'Heebo', Arial, sans-serif;
  direction: rtl;
}

#et-apm .apm-cf7 textarea {
  min-height: 190px;
  line-height: 1.5;
}

#et-apm .apm-cf7 input:focus,
#et-apm .apm-cf7 textarea:focus {
  outline: 2px solid var(--purple);
  outline-offset: 1px;
}

/* consent row */

#et-apm .apm-cf7 .note {
  margin-top: 18px;
}

#et-apm .apm-cf7 .wpcf7-list-item {
  margin: 0;
}

#et-apm .apm-cf7 .privacy,
#et-apm .apm-cf7 .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  font-size: 14px;
  font-weight: 400;
  color: #555;
  cursor: pointer;
}

#et-apm .apm-cf7 input[type='checkbox'] {
  width: 20px;
  height: 20px;
  min-height: 0;
  flex: 0 0 20px;
  margin: 0;
  padding: 0;
  accent-color: var(--red);
  cursor: pointer;
}

#et-apm .apm-cf7 .wpcf7-list-item-label a {
  color: var(--red);
}

/* submit, matching .btn-primary */

#et-apm .apm-cf7 input[type='submit'] {
  display: block;
  margin: 22px auto 0;
  width: auto;
  min-height: 0;
  border: 0;
  border-radius: 15px;
  padding: 15px 27px;
  background: var(--red);
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  font-family: 'Heebo', Arial, sans-serif;
  cursor: pointer;
  transition: 0.2s ease;
}

#et-apm .apm-cf7 input[type='submit']:hover {
  transform: translateY(-2px);
}

/* validation and status */

#et-apm .apm-cf7 .wpcf7-not-valid-tip {
  margin-top: 6px;
  color: var(--red);
  font-size: 13px;
  font-weight: 700;
}

#et-apm .apm-cf7 .wpcf7-response-output {
  margin: 18px 0 0;
  padding: 12px 16px;
  border: 1.5px solid #ddd;
  border-radius: 12px;
  font-size: 14px;
  text-align: center;
}

#et-apm .apm-cf7 .wpcf7-spinner {
  display: block;
  margin: 10px auto 0;
}

@media (max-width: 760px) {
  #et-apm .apm-cf7 .fieldsWrap {
    grid-template-columns: 1fr;
  }
}

/* The theme paints this span white for the dark contact section, from one of its
   own stylesheets. On the white card here that made the consent sentence
   invisible: only the "מדיניות הפרטיות" link showed. */
#et-apm .apm-cf7 .wpcf7-list-item-label,
#et-apm .apm-cf7 .note,
#et-apm .apm-cf7 .privacy {
  color: #555 !important;
}

#et-apm .apm-cf7 .wpcf7-list-item-label a {
  color: var(--red) !important;
}