form {
  max-width: 600px;
  margin: auto;
  font-family: Georgia, serif;
}

.input-group {
  position: relative;
  margin-bottom: 40px;
}

.input-group input,
.input-group textarea {
  width: 100%;
  font-size: 28px;
  border: none;
  background: transparent;
  font-family: Georgia, serif;
  -webkit-appearance:none;
  appearance:none;
  border:0;                 /* niente rettangolo */
  outline:0;                /* niente glow blu */
  box-shadow:none;          /* niente ombre */
  background:transparent;
  width:100%;
  line-height:1.2;
  padding:6px 0;  
}

.input-group label {
  position: absolute;
  top: 10px;
  left: 0;
  color: #ccc;
  font-size: 18px;
  pointer-events: none;
  transition: all 0.2s ease-out;
}

.input-group input:focus + label,
.input-group textarea:focus + label,
.input-group input:not(:placeholder-shown) + label,
.input-group textarea:not(:placeholder-shown) + label {
  top: -20px;
  font-size: 14px;
  color: #aaa;
  border-bottom-color:#000;     /* sottolineatura più scura */
  border-bottom-width:2px; 
}

/* per tastiera: stesso stile di focus, niente rettangolo */
.input-group input:focus-visible,
.input-group textarea:focus-visible{
  outline:0;
  box-shadow:none;
}

textarea {
  height: 100px;
  resize: vertical;
}

.freccia {
  font-size: 30px;
  position: absolute;
  right: 10px;
  top: 35px;
  cursor: pointer;
  color: #666;
}

.step {
  display: none;
}

.step.active {
  display: block;
}

.buttons {
  display: flex;
  justify-content: flex-end;
  gap: 20px;
  margin-top: 20px;
}

#prevBtn {
  margin-right: auto;
}

button {
  background: none;
  border: none !important;
  font-size: 16px;
  color: #555 !important;
  cursor: pointer;
}

.progress-container {
  height: 6px;
  background: #eee;
  margin-top: 20px;
  width: 100%;
  position: relative;
}

.progress-bar {
  height: 6px;
  background: #a00;
  width: 0%;
  transition: width 0.4s ease;
}

.step-counter {
  margin-top: 10px;
  font-size: 18px;
  color: #999;
}

input:focus, textarea:focus { outline: none !important; box-shadow: none !important; }

.link-chi-siamo{ 
  font-size: 12px; 
  position: relative; 
  display:inline-flex; 
  align-items:flex-end; 
  gap:8px; 
  text-transform:uppercase; 
  text-decoration:none; 
  color:currentColor; 
  line-height:1; 
  padding:0; 
  margin:0; 
} 

.link-chi-siamo .arrow{ 
  flex:0 0 auto; 
} 

.link-chi-siamo .chi-siamo-label{ 
  position:relative; 
  display:inline-block; 
  transform:translateX(0); 
  transition: transform .4s ease; 
  transition-delay: var(--delay,60ms); } 
  
/* LINEA sotto l'intero link (freccia + testo) */ 
.link-chi-siamo::after{ 
  content:""; 
  position:absolute; 
  left:0; bottom:-14px; 
  height:4px; 
  width: var(--initial-underline, 92%); 
  background: #dfdfdf; 
  transition: width .4s ease; 
} 
  
.link-chi-siamo:hover .chi-siamo-label{ 
  transform:translateX(var(--shift,8px)); 
} 
  
.link-chi-siamo:hover::after{ 
  width: calc(100% + var(--shift,8px)); 
} 
@media (prefers-reduced-motion: reduce){ 
  .link-chi-siamo .chi-siamo-label, 
  .link-chi-siamo::after{ transition:none; } 
}

.form-success{
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 1.4;
}

/* sovrascrive la regola globale del riquadro malefico solo dentro #form-step */
#form-step input.text,
#form-step input.title,
#form-step input[type="email"],
#form-step input[type="password"],
#form-step input[type="tel"],
#form-step input[type="text"],
#form-step select,
#form-step textarea {
  background-color: transparent !important;
  border: none !important;
  padding: 6px 0 !important;
  /*color: #2d2d2d !important;*/
  box-shadow: none !important;
  border-bottom: 1px solid #ddd !important; /* linea custom */
}

/* testo bianco quando il form vive nell’overlay del dot */
.hfd-overlay .hfd-form-wrap input,
.hfd-overlay .hfd-form-wrap textarea {
  color: #fff !important;
  caret-color: #fff !important;
  border-bottom-color: rgba(255,255,255,.5) !important;
}
.hfd-overlay .hfd-form-wrap .input-group label {
  color: rgba(255,255,255,.7) !important;
}
.hfd-overlay .hfd-form-wrap input:-webkit-autofill {
  -webkit-text-fill-color: #fff !important;
  transition: background-color 9999s ease-out 0s !important;
}


/* ===========================
   ANTISPAM (HONEYPOT) 
   =========================== */
.cfs-hp-wrap {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

.cfs-hp-wrap input {
  width: 1px !important;
  height: 1px !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.cfs-hp-hint { 
  display: none !important; 
}