.elementor-38910 .elementor-element.elementor-element-2af6e68:not(.elementor-motion-effects-element-type-background), .elementor-38910 .elementor-element.elementor-element-2af6e68 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-38910 .elementor-element.elementor-element-2af6e68{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-38910 .elementor-element.elementor-element-2af6e68 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-38910 .elementor-element.elementor-element-249a4b2{--spacer-size:30px;}.elementor-widget-heading .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-38910 .elementor-element.elementor-element-9e02530 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-38910 .elementor-element.elementor-element-9e02530{text-align:center;}.elementor-widget-text-editor{color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-38910 .elementor-element.elementor-element-7388788{text-align:center;font-family:"Open Sans", Sans-serif;font-size:16px;}.elementor-38910 .elementor-element.elementor-element-072e228:not(.elementor-motion-effects-element-type-background), .elementor-38910 .elementor-element.elementor-element-072e228 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-38910 .elementor-element.elementor-element-072e228{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-38910 .elementor-element.elementor-element-072e228 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-38910 .elementor-element.elementor-element-8ba4cc6:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-38910 .elementor-element.elementor-element-8ba4cc6 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-38910 .elementor-element.elementor-element-8ba4cc6 > .elementor-element-populated, .elementor-38910 .elementor-element.elementor-element-8ba4cc6 > .elementor-element-populated > .elementor-background-overlay, .elementor-38910 .elementor-element.elementor-element-8ba4cc6 > .elementor-background-slideshow{border-radius:10px 10px 10px 10px;}.elementor-38910 .elementor-element.elementor-element-8ba4cc6 > .elementor-element-populated{box-shadow:0px 0px 10px 1px rgba(0, 0, 0, 0.2);transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:0px 0px 50px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-38910 .elementor-element.elementor-element-8ba4cc6 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-38910 .elementor-element.elementor-element-73a01a8 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;border-style:none;}@media(min-width:768px){.elementor-38910 .elementor-element.elementor-element-26a3b39{width:22.005%;}.elementor-38910 .elementor-element.elementor-element-8ba4cc6{width:55.652%;}.elementor-38910 .elementor-element.elementor-element-17bb82e{width:22.007%;}}/* Start custom CSS for shortcode, class: .elementor-element-73a01a8 */am reușit sa fac box-ul, acum hai sa mai lucram la formular că nu îmi place cum arata
Hai să-l facem să arate mai profesionist. Aș merge pe un stil editorial, potrivit pentru Munteanu Recomandă: etichete clare, câmpuri aliniate, spațiere uniformă și un buton negru, simplu. Păstrăm box-ul pe care l-ai făcut deja și lucrăm doar la formular.
1. Cum aș vrea să arate
Dă-ne un pont!
Completează câteva detalii și ajută-ne să descoperim lucruri faine.
Ce ne recomanzi? *
Alege o categorie
Numele recomandării *
Cum se numește?
Orașul *
Alege orașul
Link cu mai multe informații
https://...
De ce merită descoperit?
Spune-ne ce ți-a atras atenția...
Trimite recomandarea 
Machetă vizuală, nu formularul live.
2. Hai să ajustăm formularul existent
Ca să nu acumulăm reguli CSS contradictorii, îți propun să înlocuim regulile dedicate formularului cu o versiune curată.
Înainte să-ți dau codul final, am nevoie de un singur lucru: trimite-mi un screenshot cu formularul așa cum se vede acum în pagina publică, ideal cu toate câmpurile vizibile.
Așa pot să văd exact ce nu funcționează — lățimea câmpurilor, fonturile, spațierea, etichetele sau butonul — și îți dau modificările potrivite pentru site-ul tău, fără să stricăm box-ul pe care tocmai l-ai construit.
User attachment
Acum văd exact ce te deranjează. Box-ul în sine arată bine, iar titlul are o culoare potrivită pentru identitatea Munteanu Recomandă. Problema este în interiorul formularului:
Spații verticale exagerat de mari între câmpuri.
Câmpurile sunt prea înalte și prea late vizual pentru cantitatea de informație.
Textul introductiv ocupă prea mult spațiu.
Apar niște mici simboluri negre, ca niște lilieci, peste formular — acestea nu sunt normale pentru Contact Form 7 și trebuie investigate separat.
Aș păstra fundalul crem-verzui și box-ul alb, dar aș face formularul mai compact și mai uniform, cu Open Sans la 16 px.
1. Corectăm formularul prin CSS
Mergi la Aspect → Personalizare → CSS suplimentar și adaugă codul de mai jos chiar la finalul CSS-ului existent. Nu șterge codul box-ului.

/* Munteanu Recomanda - formular compact si centrat */
.mr-pont-box .mr-pont-form {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

/* Text introductiv */
.mr-pont-box .mr-pont-form > p:first-child {
  margin: 0 0 22px !important;
  font-size: 16px;
  line-height: 1.6;
}

/* Spatiul dintre campuri */
.mr-pont-box .mr-pont-form p {
  margin: 0 0 14px !important;
  padding: 0;
}

/* Etichete */
.mr-pont-box .mr-pont-form label {
  display: block;
  margin: 0;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 400;
}

/* Campuri text, select si link */
.mr-pont-box .mr-pont-form input:not([type="submit"]),
.mr-pont-box .mr-pont-form select,
.mr-pont-box .mr-pont-form textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 5px 0 0;
  padding: 9px 12px;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid #d8d8d3;
  border-radius: 5px;
  background: #fff;
  color: #343b40;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  box-shadow: none;
}

/* Textarea */
.mr-pont-box .mr-pont-form textarea {
  min-height: 110px;
  resize: vertical;
}

/* Focus */
.mr-pont-box .mr-pont-form input:focus,
.mr-pont-box .mr-pont-form select:focus,
.mr-pont-box .mr-pont-form textarea:focus {
  outline: none;
  border-color: #155465;
  box-shadow: 0 0 0 2px rgba(21, 84, 101, 0.10);
}

/* Buton */
.mr-pont-box .mr-pont-form input[type="submit"] {
  display: inline-block;
  margin-top: 6px;
  padding: 12px 22px;
  min-height: 44px;
  border: 1px solid #155465;
  border-radius: 5px;
  background: #155465;
  color: #fff;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.mr-pont-box .mr-pont-form input[type="submit"]:hover {
  background: #103f4c;
  border-color: #103f4c;
}

/* Nota de subsol */
.mr-pont-box .mr-pont-form .mr-pont-notice {
  margin-top: 14px !important;
  font-size: 13px;
  line-height: 1.5;
  color: #666;
}

/* Mesaje Contact Form 7 */
.mr-pont-box .mr-pont-form .wpcf7-not-valid-tip {
  margin-top: 4px;
  font-size: 13px;
}

.mr-pont-box .mr-pont-form .wpcf7-response-output {
  margin: 14px 0 0;
  padding: 12px;
  font-size: 14px;
}

/* Mobil */
@media (max-width: 767px) {
  .mr-pont-box .mr-pont-form {
    max-width: 100%;
  }

  .mr-pont-box .mr-pont-form p {
    margin-bottom: 12px !important;
  }
}

Apasă Publică, apoi reîncarcă pagina cu Cmd + Shift + R.
2. Ce facem cu simbolurile negre?
Liliecii care apar peste text și câmpuri par să fie un efect decorativ al site-ului, nu elemente ale formularului. E posibil să fie un efect de cursor pentru Halloween sau un script de animație.
După ce aplici CSS-ul, verifică dacă liliecii mai apar. Dacă da, îi identificăm separat — nu vreau să stricăm formularul încercând să-i ascundem cu reguli CSS nepotrivite.
simbolurile mici sunt puse de mine pentru tot site-ul, ignora-le
Perfect, îi ignorăm complet. 😊 Ne concentrăm doar pe aspectul formularului.
După ce adaugi noul CSS, vreau să verificăm în special două lucruri:
Spațierea: fiecare câmp ar trebui să fie la aproximativ 12–14 px de următorul, fără golurile mari din screenshot.
Lățimea: formularul să fie centrat în box, cu o lățime maximă de 520 px, fără să pară întins inutil.
Păstrăm fontul Open Sans la 16 px, iar butonul în nuanța petrol a titlului.
Ai aplicat deja ultimul cod CSS sau încă nu? Dacă l-ai aplicat, trimite-mi un screenshot nou și continuăm de la rezultatul real.
Inca nu
Atunci hai să facem asta împreună, pas cu pas. Nu modificăm box-ul, ci doar formularul din interior.
Pasul 1. Intră în CSS-ul site-ului
Deschide panoul WordPress.
Mergi la Aspect → Personalizare → CSS suplimentar.
Derulează până la finalul codului existent.
Pasul 2. Adaugă noul cod
Lipește la final codul CSS din mesajul meu anterior, cel care începe cu:
/* Munteanu Recomanda - formular compact si centrat */
Nu șterge codul vechi deocamdată. Noile reguli îl vor suprascrie pentru formularul din box, iar dacă rezultatul nu ne place, le putem ajusta ușor.
Apasă Publică.
Deschide pagina „Dă-ne un pont!” și apasă Cmd + Shift + R pentru reîncărcare forțată.
După ce ai făcut asta, trimite-mi un screenshot nou. Vedem dacă spațiile s-au redus suficient și ajustăm fin lățimea și aspectul câmpurilor.
da-mi codul
Copiază codul de mai jos și lipește-l la finalul CSS-ului existent, în WordPress → Aspect → Personalizare → CSS suplimentar. Nu șterge codul box-ului.

/* Munteanu Recomanda - formular compact si centrat */
.mr-pont-box .mr-pont-form {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

/* Text introductiv */
.mr-pont-box .mr-pont-form > p:first-child {
  margin: 0 0 22px !important;
  font-size: 16px;
  line-height: 1.6;
}

/* Spatiul dintre campuri */
.mr-pont-box .mr-pont-form p {
  margin: 0 0 14px !important;
  padding: 0;
}

/* Etichete */
.mr-pont-box .mr-pont-form label {
  display: block;
  margin: 0;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 400;
}

/* Campuri */
.mr-pont-box .mr-pont-form input:not([type="submit"]),
.mr-pont-box .mr-pont-form select,
.mr-pont-box .mr-pont-form textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 5px 0 0;
  padding: 9px 12px;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid #d8d8d3;
  border-radius: 5px;
  background: #fff;
  color: #343b40;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  box-shadow: none;
}

/* Zona de text */
.mr-pont-box .mr-pont-form textarea {
  min-height: 110px;
  resize: vertical;
}

/* Evidentierea campului selectat */
.mr-pont-box .mr-pont-form input:focus,
.mr-pont-box .mr-pont-form select:focus,
.mr-pont-box .mr-pont-form textarea:focus {
  outline: none;
  border-color: #155465;
  box-shadow: 0 0 0 2px rgba(21, 84, 101, 0.10);
}

/* Buton */
.mr-pont-box .mr-pont-form input[type="submit"] {
  display: inline-block;
  margin-top: 6px;
  padding: 12px 22px;
  min-height: 44px;
  border: 1px solid #155465;
  border-radius: 5px;
  background: #155465;
  color: #fff;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.mr-pont-box .mr-pont-form input[type="submit"]:hover {
  background: #103f4c;
  border-color: #103f4c;
}

/* Nota informativa */
.mr-pont-box .mr-pont-form .mr-pont-notice {
  margin-top: 14px !important;
  font-size: 13px;
  line-height: 1.5;
  color: #666;
}

/* Mesaje de validare */
.mr-pont-box .mr-pont-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 4px;
  font-size: 13px;
}

.mr-pont-box .mr-pont-form .wpcf7-response-output {
  margin: 14px 0 0;
  padding: 12px;
  font-size: 14px;
}

/* Afisare pe mobil */
@media (max-width: 767px) {
  .mr-pont-box .mr-pont-form {
    max-width: 100%;
  }

  .mr-pont-box .mr-pont-form p {
    margin-bottom: 12px !important;
  }
}

După ce îl lipești:
Apasă Publică.
Deschide pagina „Dă-ne un pont!”.
Reîncarcă folosind Cmd + Shift + R.
Trimite-mi apoi un screenshot cu rezultatul și reglăm spațierea dacă mai este nevoie.
nu s-a schimbat nimic
Atunci cel mai probabil CSS-ul nu se aplică deoarece clasa mr-pont-box nu este pe containerul corect sau structura HTML a formularului este diferită de cea pe care am presupus-o. Hai să verificăm înainte să mai adăugăm cod.
Pasul 1 — Verificăm containerul în Elementor
Deschide pagina „Dă-ne un pont!” cu Elementor.
Selectează containerul alb în care se află formularul.
Intră la Advanced → CSS Classes.
Verifică dacă apare exact:
mr-pont-box
Fără punct în față și fără alte caractere.
Pasul 2 — Verificăm dacă formularul are clasa corectă
În Contact → Formulare de contact → „Dă-ne un pont!”, în fila Form, codul trebuie să înceapă cu:
<div class="mr-pont-form">

și să se termine cu:
</div>

Salvează dacă ai făcut vreo modificare.
Pasul 3 — Testăm dacă CSS-ul ajunge la formular
Adaugă temporar, la finalul CSS-ului suplimentar, doar această regulă:
.mr-pont-form {
  outline: 4px solid red !important;
  max-width: 520px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

Publică și reîncarcă pagina.
Spune-mi dacă apare conturul roșu în jurul formularului. Dacă apare, știm că trebuie să corectăm .elementor-38910 .elementor-element.elementor-element-73a01a8ii sau regulile de stil. Dacă nu apare, verificăm unde este introdus CSS-ul și dacă există cache. După test, vom elimina conturul roșu.
da, apare
Perfect! Asta înseamnă că CSS-ul ajunge la formular. Problema este în regulile de stil pe care le-am aplicat, nu în cache sau în WordPress.
Hai să facem o variantă mai simplă și mai sigură.
Pasul următor
În Aspect → Personalizare → CSS suplimentar:
Șterge regula temporară cu conturul roșu.
Adaugă codul de mai jos la final.
Apasă Publică și reîncarcă pagina.

/* Formular Munteanu Recomanda */
.mr-pont-form {
  width: 100% !important;
  max-width: 520px !important;
  margin: 0 auto !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
}

/* Reducem spatiile dintre campuri */
.mr-pont-form p {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  padding: 0 !important;
}

/* Text introductiv */
.mr-pont-form > p:first-child {
  margin-bottom: 18px !important;
  line-height: 1.6 !important;
}

/* Etichete */
.mr-pont-form label {
  display: block !important;
  margin: 0 !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
}

/* Campuri */
.mr-pont-form input:not([type="submit"]),
.mr-pont-form select,
.mr-pont-form textarea {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 40px !important;
  margin-top: 4px !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  border: 1px solid #d8d8d3 !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #343b40 !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  box-shadow: none !important;
}

.mr-pont-form textarea {
  min-height: 90px !important;
}

/* Buton */
.mr-pont-form input[type="submit"] {
  margin-top: 4px !important;
  padding: 11px 22px !important;
  border: 1px solid #155465 !important;
  border-radius: 5px !important;
  background: #155465 !important;
  color: #fff !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  cursor: pointer !important;
}

.mr-pont-form input[type="submit"]:hover {
  background: #103f4c !important;
}

/* Nota informativa */
.mr-pont-form .mr-pont-notice {
  margin-top: 12px !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

@media (max-width: 767px) {
  .mr-pont-form {
    max-width: 100% !important;
  }
}

Am eliminat dependența de clasa box-ului și am pus !important pe proprietățile principale, pentru ca regulile temei Astra sau Elementor să nu le suprascrie ușor.
Dacă tot nu se modifică spațierea, următorul pas este să verificăm dacă Astra aplică marginile pe elementele interioare ale formularului, nu pe paragrafele <code>p</code>.
tot are spatii mari intre Campuri si nu folosește fonturile ok
Cred că am identificat problema: Contact Form 7 folosește mai multe elemente HTML în interiorul fiecărui câmp, iar Astra și Elementor pot aplica propriile margini și fonturi. În plus, font-family: "Open Sans" nu încarcă fontul dacă acesta nu este deja disponibil pe site.
Hai să corectăm ambele probleme.
1. Înlocuiește CSS-ul formularului
În Aspect → Personalizare → CSS suplimentar, păstrează codul pentru box și șterge regulile CSS anterioare care încep cu .mr-pont-form. În locul lor, adaugă codul de mai jos.

/* MUNTEANU RECOMANDA - FORMULAR */

/* Container formular */
.mr-pont-form,
.mr-pont-form * {
  box-sizing: border-box;
}

.mr-pont-form {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.45 !important;
}

/* Toate elementele din formular */
.mr-pont-form p,
.mr-pont-form label,
.mr-pont-form span,
.mr-pont-form input,
.mr-pont-form select,
.mr-pont-form textarea,
.mr-pont-form button {
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
}

/* Eliminam spatiile implicite ale paragrafelor */
.mr-pont-form p {
  margin: 0 0 12px !important;
  padding: 0 !important;
}

/* Text introductiv */
.mr-pont-form > p:first-child {
  margin-bottom: 20px !important;
  line-height: 1.55 !important;
}

/* Etichete */
.mr-pont-form label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

/* Wrapper-ele generate de Contact Form 7 */
.mr-pont-form .wpcf7-form-control-wrap {
  display: block !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
}

/* Campuri */
.mr-pont-form input:not([type="submit"]),
.mr-pont-form select,
.mr-pont-form textarea {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 1px solid #d8d8d3 !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #343b40 !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
}

/* Zona de text */
.mr-pont-form textarea {
  min-height: 90px !important;
  resize: vertical;
}

/* Buton */
.mr-pont-form input[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  min-height: 42px !important;
  margin: 4px 0 0 !important;
  padding: 10px 22px !important;
  border: 1px solid #155465 !important;
  border-radius: 5px !important;
  background: #155465 !important;
  color: #fff !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  cursor: pointer;
}

.mr-pont-form input[type="submit"]:hover {
  background: #103f4c !important;
  color: #fff !important;
}

/* Nota informativa */
.mr-pont-form .mr-pont-notice {
  margin: 12px 0 !important;
  color: #666 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Mesaje de validare */
.mr-pont-form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 4px !important;
  font-size: 13px !important;
}

.mr-pont-form .wpcf7-response-output {
  margin: 12px 0 0 !important;
  padding: 12px !important;
  font-size: 14px !important;
}

@media (max-width: 767px) {
  .mr-pont-form {
    max-width: 100% !important;
  }

  .mr-pont-form p {
    margin-bottom: 10px !important;
  }
}

Apasă Publică, apoi reîncarcă pagina cu Cmd + Shift + R.
2. Ne asigurăm că Open Sans este încărcat
Dacă fontul tot nu arată corect, trebuie să-l activăm în setările de tipografie ale site-ului, nu doar în CSS.
În Elementor, mergi la Setări site → Tipografie (Site Settings → Typography) și verifică fontul global pentru text. Dacă Open Sans nu apare sau nu este încărcat, va trebui să-l selectăm și să verificăm setările de fonturi ale site-ului.
După ce aplici codul, trimite-mi încă un screenshot. Vreau să verific dacă spațiul dintre câmpuri s-a redus și dacă mai este nevoie să intervenim asupra tipografiei globale din Astra sau Elementor.
mai sus mi-ai pus o macheta vizuală, poți să îl faci așa?
Da. Hai să-l apropiem cât mai mult de machetă: câmpuri albe, etichete deasupra, spațiere compactă, text de 16 px și buton petrol. Păstrăm box-ul pe care l-ai construit deja.
1. Înlocuiește CSS-ul formularului
În Aspect → Personalizare → CSS suplimentar, păstrează regulile pentru box și șterge regulile vechi care încep cu .mr-pont-form. Apoi adaugă codul de mai jos.

/* Open Sans - formular Munteanu Recomanda */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');

.mr-pont-box .mr-pont-form {
  width: 100% !important;
  max-width: 520px !important;
  margin: 0 auto !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  color: #292722;
}

/* Text introductiv */
.mr-pont-box .mr-pont-form > p:first-child {
  margin: 0 0 22px !important;
  padding: 0 !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
}

/* Eliminam spatiile mari dintre campuri */
.mr-pont-box .mr-pont-form > p:not(:first-child) {
  margin: 0 0 12px !important;
  padding: 0 !important;
}

/* Etichete */
.mr-pont-box .mr-pont-form label {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

/* Zona de continut generata de Contact Form 7 */
.mr-pont-box .mr-pont-form .wpcf7-form-control-wrap {
  display: block !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
}

/* Campuri uniforme */
.mr-pont-box .mr-pont-form input:not([type="submit"]),
.mr-pont-box .mr-pont-form select,
.mr-pont-box .mr-pont-form textarea {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 43px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
  border: 1px solid #d8d3c9 !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #343b40 !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  box-shadow: none !important;
}

/* Textarea */
.mr-pont-box .mr-pont-form textarea {
  min-height: 100px !important;
  resize: vertical;
}

/* Focus */
.mr-pont-box .mr-pont-form input:focus,
.mr-pont-box .mr-pont-form select:focus,
.mr-pont-box .mr-pont-form textarea:focus {
  outline: none !important;
  border-color: #155465 !important;
  box-shadow: 0 0 0 2px rgba(21, 84, 101, .10) !important;
}

/* Buton */
.mr-pont-box .mr-pont-form input[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  min-height: 44px !important;
  margin: 4px 0 0 !important;
  padding: 11px 22px !important;
  border: 1px solid #155465 !important;
  border-radius: 5px !important;
  background: #155465 !important;
  color: #fff !important;
  font-family: "Open Sans", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

.mr-pont-box .mr-pont-form input[type="submit"]:hover {
  background: #103f4c !important;
  color: #fff !important;
}

/* Nota informativa */
.mr-pont-box .mr-pont-form .mr-pont-notice {
  margin: 12px 0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: #666 !important;
}

/* Mesaje Contact Form 7 */
.mr-pont-box .mr-pont-form .wpcf7-not-valid-tip {
  display: block !important;
  margin-top: 4px !important;
  font-size: 13px !important;
}

.mr-pont-box .mr-pont-form .wpcf7-response-output {
  margin: 12px 0 0 !important;
  padding: 12px !important;
  font-size: 14px !important;
}

/* Mobil */
@media (max-width: 767px) {
  .mr-pont-box .mr-pont-form {
    max-width: 100% !important;
  }

  .mr-pont-box .mr-pont-form > p:not(:first-child) {
    margin-bottom: 12px !important;
  }
}

2. Salvează și verifică
Apasă Publică.
Deschide pagina publică și reîncarc-o cu Cmd + Shift + R.
Dacă folosești un plugin de cache, golește și cache-ul acestuia.
Am inclus și încărcarea fontului Open Sans, pentru ca acesta să nu depindă doar de setările temei.
Important: .elementor-38910 .elementor-element.elementor-element-73a01a8ii presupun că ai clasa mr-pont-box pe containerul exterior și mr-pont-form în codul formularului Contact Form 7, exact cum le-am configurat anterior. Dacă aspectul diferă în continuare, următorul lucru de verificat este HTML-ul generat efectiv de formular./* End custom CSS */
/* Start custom CSS for column, class: .elementor-element-8ba4cc6 */mr-pont-box/* End custom CSS */