.ff-root {
  --ff-navy: #17474B;
  --ff-navy-dark: #0C2C2F;
  --ff-turquoise: #02C39A;
  --ff-pale: #E6F3F1;
  --ff-ink: #17242C;
  --ff-ink-soft: #5C6B72;
  --ff-surface: #FFFFFF;
  --ff-rule: #DCE2E4;
  --ff-err: #B8443C;
  --ff-err-bg: #FBE7E4;
  --ff-ok: #2E8B57;
  --ff-ok-bg: #E4F3E9;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--ff-ink);
  max-width: 520px;
  margin: 0 auto;
}
.ff-root * { box-sizing: border-box; }

.ff-brand { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; }
.ff-brand-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--ff-turquoise); }
.ff-brand-name { font-weight: 700; color: var(--ff-navy); font-size: 15px; letter-spacing: 0.2px; }

.ff-title { font-size: 24px; font-weight: 700; color: var(--ff-navy-dark); margin: 0 0 6px; line-height: 1.25; }
.ff-lede { color: var(--ff-ink-soft); font-size: 14.5px; line-height: 1.55; margin: 0 0 26px; max-width: 44ch; }

.ff-root form {
  background: var(--ff-surface);
  border: 1.5px solid var(--ff-rule);
  border-radius: 14px;
  padding: 24px;
}

.ff-field { margin-bottom: 18px; }
.ff-field:last-of-type { margin-bottom: 0; }
.ff-root label { display: block; font-size: 13px; font-weight: 600; color: var(--ff-navy); margin-bottom: 6px; }
.ff-optional { font-weight: 400; color: var(--ff-ink-soft); }

.ff-root input[type="text"],
.ff-root input[type="email"],
.ff-root textarea {
  width: 100%;
  font-family: inherit;
  font-size: 14.5px;
  padding: 11px 12px;
  border: 1.5px solid var(--ff-rule);
  border-radius: 8px;
  background: var(--ff-surface);
  color: var(--ff-ink);
  outline: none;
  transition: border-color .15s;
}
.ff-root input:focus, .ff-root textarea:focus { border-color: var(--ff-navy); }
.ff-root textarea { resize: vertical; min-height: 110px; line-height: 1.5; }

.ff-rating { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.ff-rating-opt {
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--ff-rule);
  border-radius: 8px;
  padding: 10px 0;
  font-size: 14px;
  font-weight: 700;
  color: var(--ff-ink-soft);
  cursor: pointer;
  margin: 0;
  transition: border-color .15s, background .15s, color .15s;
}
.ff-rating-opt input { display: none; }
.ff-rating-opt:has(input:checked) {
  border-color: var(--ff-turquoise);
  background: var(--ff-pale);
  color: var(--ff-navy);
}
.ff-rating-scale {
  display: flex; justify-content: space-between;
  margin-top: 6px;
  font-size: 11.5px;
  color: var(--ff-ink-soft);
}

.ff-segment { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.ff-seg-opt {
  display: flex; align-items: center; justify-content: center; text-align: center;
  border: 1.5px solid var(--ff-rule);
  border-radius: 8px;
  padding: 10px 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ff-ink-soft);
  cursor: pointer;
  margin: 0;
  transition: border-color .15s, background .15s, color .15s;
}
.ff-seg-opt input { display: none; }
.ff-seg-opt:has(input:checked) {
  border-color: var(--ff-turquoise);
  background: var(--ff-pale);
  color: var(--ff-navy);
}

/* honeypot — ascuns de vizitatorii reali */
.ff-hp { position: absolute; left: -9999px; top: -9999px; }

.ff-root button[type="submit"] {
  width: 100%;
  margin-top: 22px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  background: var(--ff-navy);
  border: none;
  border-radius: 9px;
  padding: 13px;
  cursor: pointer;
  transition: background .15s, transform .08s;
}
.ff-root button[type="submit"]:hover { background: var(--ff-navy-dark); }
.ff-root button[type="submit"]:active { transform: translateY(1px); }
.ff-root button[type="submit"]:disabled { opacity: .6; cursor: default; }

.ff-status-msg {
  margin-top: 14px;
  padding: 11px 13px;
  border-radius: 8px;
  font-size: 13.5px;
  line-height: 1.5;
  display: none;
}
.ff-status-msg.ff-ok { display: block; background: var(--ff-ok-bg); color: var(--ff-ok); }
.ff-status-msg.ff-err { display: block; background: var(--ff-err-bg); color: var(--ff-err); }

.ff-foot-note { margin-top: 18px; font-size: 12.5px; color: var(--ff-ink-soft); text-align: center; line-height: 1.5; }
