/* Card shell */
#cffb-wrap { display:flex; justify-content:center; padding:40px 16px; background:transparent; }
.cffb-card { width:100%; max-width:720px; background:#fff; border-radius:18px; padding:32px 24px; box-shadow:0 16px 48px rgba(0,0,0,.08); text-align:center; }

/* Top section */
.cffb-logo img { max-width:180px; height:auto; margin:0 auto 14px; display:block; }
.cffb-heading { font-size:28px; margin:4px 0 6px; }
.cffb-desc { font-size:16px; color:#2d3748; margin:0 0 18px; }

/* Stars */
/* .cffb-stars { display:flex; justify-content:center; gap:14px; margin:10px 0 8px; }
.cffb-star { font-size:42px; line-height:1; background:none; border:0; cursor:pointer; color:#c5cbd3; transition:transform .08s ease, color .12s ease; }
.cffb-star.on { color:#f5b301; }
.cffb-star:active { transform:scale(.95); }
.cffb-label { margin-top:8px; font-weight:600; color:#243b53; min-height:22px; } */
/* Stars container */
.cffb-stars {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin: 10px 0 8px;
}

/* Each star button */
.cffb-star {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: none;
  background-color: #6c757d; /* default gray circle */
  transition: transform 0.08s ease, background-color 0.12s ease;
}

/* Font Awesome star icon inside */
.cffb-star i {
  font-size: 20px;
  color: white; /* star color */
}

/* Active/selected star */
.cffb-star.on {
  background-color: #ffc94d; /* yellow circle */
}

/* Click/press effect */
/* .cffb-star:active {
  transform: scale(0.95);
} */

/* Label under stars */
.cffb-label {
  margin-top: 8px;
  font-weight: 600;
  color: #243b53;
  min-height: 22px;
  text-align: center;
}


/* Highlight invalid inputs */
.cffb-error {
  border: 1.5px solid #e63946 !important;
  background-color: #fff5f5;
}

/* Style error messages */
.cffb-error-msg {
  display: block;
  font-size: 13px;
  color: #e63946;
  margin-top: 4px;
  font-weight: 500;
}



/* Form */
.cffb-form { margin-top:18px; text-align:left; }
.cffb-subtitle { text-align:center; margin:4px 0; }
.cffb-subdesc { text-align:center; margin:0 0 14px; color:#4a5568; }

.cffb-q { margin:14px 0; }
.cffb-q > label:first-child { font-weight:700; display:block; margin-bottom:6px; }
.cffb-q label { display:block; margin:6px 0; }

.cffb-row { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-top:8px; }
.cffb-form input[type="text"],
.cffb-form input[type="email"],
.cffb-form textarea { width:100%; padding:10px 12px; border:1px solid #d9dee4; border-radius:10px; font-size:15px; }

.cffb-btn { margin-top:10px; background:#0b6aa2; color:#fff; border:0; border-radius:10px; padding:10px 16px; cursor:pointer; font-weight:600; }
.cffb-btn:hover { background:#08557f; }
.cffb-msg { margin-top:10px; }

@media (max-width:680px){ .cffb-row { grid-template-columns:1fr; } .cffb-star{font-size:36px;} }