.elementor-57 .elementor-element.elementor-element-e52afd8{width:100%;max-width:100%;}.elementor-57 .elementor-element.elementor-element-e52afd8.elementor-element{--flex-grow:0;--flex-shrink:0;}/* Start custom CSS *//* === FIX LANDING /scopri + thank-you /grazie/scopri ===
   Disattiva padding/margin di default Elementor sulle landing custom HTML.
   Da applicare globalmente o solo a queste due pagine. */

body.elementor-page-NONE,
body[class*="page-id"] {
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden;
}

/* azzera padding di tutti i wrapper Elementor sulla pagina */
.elementor-section,
.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-container,
.elementor-row,
.elementor-column,
.elementor-column-wrap,
.elementor-widget-wrap,
.elementor-widget-html,
.elementor-widget-html > .elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* la sezione "full width" deve davvero essere full width */
.elementor-section.elementor-section-boxed {
  max-width: 100% !important;
}
.elementor-section-boxed > .elementor-container {
  max-width: 100% !important;
}

/* alcuni temi mettono padding sul main content */
main, #main, #content, .site-content, .site-main, .page-content, .entry-content {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
}
/* Elementor V4 / Atomic - reset wrapper Flexbox */
.e-flex,
.e-con,
.e-con-inner,
[class*="e-flex"],
[class*="e-con"] {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* HTML widget V4 */
.elementor-widget-html-v4,
[class*="elementor-widget-html"] {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}

/* ============================================================
   OVERRIDE FLUENTFORMS · Landing /scopri
   ============================================================
   Da incollare in: WP Admin → Elementor → Site Settings → Custom CSS
   (oppure Aspetto → Personalizza → CSS aggiuntivo)

   Riallinea il form FluentForms reale al visual system della
   landing-lead-magnet-v2.html (mockup originale).

   I selettori usano la classe .ff-default e gli ID/data-attr di
   FluentForms 6.x. Se il tuo form ha un ID specifico, puoi
   prefissare con #fluentform_NUMERO per maggiore specificità.

   Tokens del visual system:
   --navy:       #262735
   --orange:     #DD752C
   --orange-dk:  #BF621F
   --beige:      #D6C8B5
   --beige-lt:   #EDE5D8
   --cream:      #F8F3EC
   --slate:      #7B8A9D
   --serif: 'Playfair Display'
   --sans:  'Inter'
   ============================================================ */


/* ── CONTAINER FORM: la "card bianca" tipo mockup ────────── */
.fluentform {
  background: #FEFEFE !important;
  border-radius: 12px !important;
  padding: 48px 44px 40px !important;
  max-width: 520px !important;
  margin: 0 auto !important;
  position: relative !important;
  box-shadow:
    0 2px 4px rgba(0,0,0,0.04),
    0 8px 16px rgba(0,0,0,0.08),
    0 24px 48px rgba(0,0,0,0.16),
    0 40px 80px rgba(0,0,0,0.12) !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
}

/* Top border arancione 4px */
.fluentform::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: #DD752C !important;
  border-radius: 12px 12px 0 0 !important;
}

@media (max-width: 540px) {
  .fluentform {
    padding: 32px 24px 28px !important;
  }
}


/* ── HEADING / SOTTOTITOLO sopra il form (opzionale) ──────── */
/* Puoi aggiungere un widget HTML dentro Elementor con:
   <p class="ff-card-title">Dove ti mando il Kit?</p>
   <p class="ff-card-sub">Ti arriva nella stessa email. Nessuno spam, mai.</p>
   PRIMA dello shortcode FluentForms */
.ff-card-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  color: #262735 !important;
  margin-bottom: 6px !important;
  line-height: 1.3 !important;
}
.ff-card-sub {
  font-size: 0.85rem !important;
  color: #7B8A9D !important;
  margin-bottom: 30px !important;
  line-height: 1.55 !important;
}


/* ── LABELS dei campi (NOME, EMAIL) ────────────────────────── */
.fluentform .ff-el-input--label label,
.fluentform label {
  display: block !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.11em !important;
  text-transform: uppercase !important;
  color: #262735 !important;
  margin-bottom: 7px !important;
}

/* Nasconde l'asterisco rosso brutto dopo "Nome *" / "E-mail *" */
.fluentform label .ff-el-is-required.asterisk-right {
  color: #DD752C !important;
  font-weight: 700 !important;
}


/* ── INPUT TESTO / EMAIL ──────────────────────────────────── */
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform input[type="url"] {
  width: 100% !important;
  padding: 13px 15px !important;
  border: 1.5px solid #D6C8B5 !important;
  border-radius: 5px !important;
  font-size: 0.97rem !important;
  font-family: 'Inter', sans-serif !important;
  color: #262735 !important;
  background: #F8F3EC !important;
  outline: none !important;
  transition: border-color .2s, background .2s, box-shadow .2s !important;
  box-shadow: none !important;
  height: auto !important;
  line-height: 1.4 !important;
}

.fluentform input[type="text"]:focus,
.fluentform input[type="email"]:focus,
.fluentform input[type="tel"]:focus,
.fluentform input[type="url"]:focus {
  border-color: #DD752C !important;
  background: #FEFEFE !important;
  box-shadow: 0 0 0 3px rgba(221,117,44,0.12) !important;
  outline: none !important;
}

.fluentform input::placeholder {
  color: #BBB !important;
  opacity: 1 !important;
}


/* ── SPAZIATURA tra i campi ───────────────────────────────── */
.fluentform .ff-el-group {
  margin-bottom: 18px !important;
}


/* ── CHECKBOX GDPR Privacy ────────────────────────────────── */
.fluentform .ff-el-form-check {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-top: 4px !important;
  margin-bottom: 22px !important;
  padding-left: 0 !important;
}

.fluentform .ff-el-form-check input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  margin-top: 2px !important;
  accent-color: #DD752C !important;
  flex-shrink: 0 !important;
  cursor: pointer !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  position: static !important;
  appearance: auto !important;
  -webkit-appearance: checkbox !important;
}

.fluentform .ff-el-form-check label {
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #4A4A5A !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  cursor: pointer !important;
  display: inline !important;
}

.fluentform .ff-el-form-check label a {
  color: #BF621F !important;
  text-decoration: underline !important;
}


/* ── BOTTONE SUBMIT "Ricevi il Kit gratis →" ──────────────── */
.fluentform button.ff-btn-submit,
.fluentform .ff-btn.ff-btn-submit,
.fluentform .ff-el-group button[type="submit"] {
  width: 100% !important;
  background: #DD752C !important;
  color: white !important;
  border: none !important;
  padding: 16px 24px !important;
  border-radius: 5px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.97rem !important;
  cursor: pointer !important;
  margin-top: 4px !important;
  letter-spacing: 0.015em !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  box-shadow: 0 6px 20px rgba(221,117,44,0.35) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: background .2s, transform .18s, box-shadow .2s !important;
  text-transform: none !important;
}

/* Sovrapposizione lucida in alto per dare profondità */
.fluentform button.ff-btn-submit::before,
.fluentform .ff-btn.ff-btn-submit::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to bottom, rgba(255,255,255,0.1), transparent) !important;
  pointer-events: none !important;
}

/* Freccia "→" dopo il testo del bottone */
.fluentform button.ff-btn-submit::after,
.fluentform .ff-btn.ff-btn-submit::after {
  content: "→" !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  transition: transform .2s !important;
}

.fluentform button.ff-btn-submit:hover,
.fluentform .ff-btn.ff-btn-submit:hover {
  background: #BF621F !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px rgba(221,117,44,0.45) !important;
}

.fluentform button.ff-btn-submit:hover::after,
.fluentform .ff-btn.ff-btn-submit:hover::after {
  transform: translateX(3px) !important;
}


/* ── MESSAGGI DI VALIDAZIONE / ERRORE ─────────────────────── */
.fluentform .error,
.fluentform .ff-el-is-error .text-danger,
.fluentform .ff-el-is-error .ff-el-form-check-label {
  color: #BF621F !important;
  font-size: 0.78rem !important;
  font-style: italic !important;
  margin-top: 6px !important;
}

.fluentform .ff-el-is-error input[type="text"],
.fluentform .ff-el-is-error input[type="email"] {
  border-color: #BF621F !important;
  background: rgba(191,98,31,0.04) !important;
}


/* ── MESSAGGIO DI SUCCESSO (se mai si vede prima del redirect) ── */
.ff-message-success,
.fluentform_v3 .ff-message-success {
  background: #F8F3EC !important;
  border-left: 4px solid #DD752C !important;
  color: #262735 !important;
  padding: 16px 20px !important;
  border-radius: 0 6px 6px 0 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 0.95rem !important;
}


/* ── DIVIDER + PRIVACY FOOTER del form ──────────────────────
   Puoi aggiungere un widget HTML SOTTO lo shortcode con:
   <div class="ff-divider"></div>
   <div class="ff-form-privacy">
     <svg viewBox="0 0 16 16"><path d="M8 1L2 4v4c0 3.5 2.5 6.5 6 7 3.5-.5 6-3.5 6-7V4L8 1z"/></svg>
     <p>I tuoi dati non vengono ceduti a terzi. Puoi cancellarti
     in qualsiasi momento con un click. Informativa privacy
     completa su aipergenitori.it/privacy</p>
   </div>
*/
.ff-divider {
  height: 1px !important;
  background: #EDE5D8 !important;
  margin: 22px 0 18px !important;
}

.ff-form-privacy {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}
.ff-form-privacy svg {
  width: 13px !important;
  height: 13px !important;
  fill: #7B8A9D !important;
  flex-shrink: 0 !important;
  margin-top: 1px !important;
}
.ff-form-privacy p {
  font-size: 0.72rem !important;
  color: #7B8A9D !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}


/* ── LOADING SPINNER al submit ────────────────────────────── */
.fluentform .ff_submit_btn_loader svg circle {
  stroke: white !important;
}
/* ============================================================
   FIX RIFINITURA · Round 2
   ============================================================ */


/* ── FIX 1: Annulla la card interna quando il form è dentro .form-card ──
   La .form-card esterna fornisce già container, border-radius,
   shadow e top border arancione. Il .fluentform interno deve essere
   "trasparente": niente background, niente shadow, niente padding extra. */
.form-card .fluentform,
.form-card div.fluentform {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.form-card .fluentform::before {
  display: none !important;
}


/* ── FIX 2: Asterisco "required" — discreto e in tono ── */
.fluentform .ff-el-input--label label .ff-el-is-required,
.fluentform label span.ff-el-is-required,
.fluentform label .ff-el-is-required.asterisk-right,
.fluentform .asterisk-right,
.fluentform [aria-label="required"] {
  color: #DD752C !important;
  font-weight: 700 !important;
  font-size: 0.85em !important;
  margin-left: 3px !important;
  vertical-align: super !important;
  opacity: 0.7 !important;
}


/* ── FIX 3: Spaziatura checkbox + testo privacy ── */
.fluentform .ff-el-form-check {
  gap: 12px !important;
  align-items: flex-start !important;
  padding: 0 !important;
  margin-bottom: 24px !important;
}

.fluentform .ff-el-form-check input[type="checkbox"] {
  margin-top: 3px !important;
  margin-right: 4px !important;
}

.fluentform .ff-el-form-check label {
  padding-left: 0 !important;
  line-height: 1.6 !important;
}


/* ── FIX 4: Bottone "Ricevi il Kit gratis" — più presenza ── */
.fluentform button.ff-btn-submit,
.fluentform .ff-btn.ff-btn-submit,
.fluentform .ff-el-group button[type="submit"] {
  padding: 18px 28px !important;
  font-size: 1rem !important;
  margin-top: 12px !important;
  letter-spacing: 0.02em !important;
}


/* ── FIX 5: Toglie eventuale spazio extra residuo sotto il form ── */
.form-card .fluentform .ff_form_instance,
.form-card .fluentform form {
  margin: 0 !important;
  padding: 0 !important;
}/* End custom CSS */