/* SEZIONE HERO */
.hero-banner {
  background-color: var(--bs-primary);
  height: 353px;
  display: flex;
  align-items: flex-start;
  position: relative;
  overflow: hidden;
}

/* Titolo */
.h1-hero {
  text-transform: uppercase !important;
  color: white !important;
  font-weight: 400 !important;
  position: relative;
  z-index: 2;
}

/* Quadrato arancione allineato al bordo del container */
.hero-square {
  position: absolute;
  left: 0;
  top: 0;
  width: 120px;
  height: 120px;
  background-color: var(--bs-secondary);
  z-index: 1;
  transform: translateX(
    var(--px-vw-5, 5vw)
  ); /* stessa distanza del container */
}

.lavora-cta-wrapper {
  display: flex;
  width: 100%;
  gap: 0;
  border: 1px solid var(--bs-neutral);
  border-right: none;
  border-left: none;
}

.cta-lavora-narrow {
  border-left: none !important;
}

/* Override per rimuovere larghezza fissa dalla cta-primary */
.cta-lavora-wide,
.cta-lavora-narrow {
  width: auto;
  flex-grow: 1;
  justify-content: center;
  text-align: center;
}

.cta-lavora-wide span,
.cta-lavora-narrow span {
  font-size: 19px !important;
}

/* CTA larga (circa 60-65%) */
.cta-lavora-wide {
  flex: 2;
}

/* CTA stretta (circa 35-40%) */
.cta-lavora-narrow {
  flex: 1.2;
}

/* Icona copia - styling */
.copy-icon {
  width: 24px;
  height: 24px;
  margin-left: 15px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

/* Animazione icona al hover */
.cta-lavora-narrow:hover .copy-icon {
  transform: scale(1.1);
}

/* Assicura che il testo rimanga bianco al hover */
.cta-lavora-wide:hover span,
.cta-lavora-narrow:hover span,
.cta-lavora-narrow:hover .copy-icon {
  color: #fff;
  stroke: #fff;
}

/* Fix per SVG stroke color */
.cta-lavora-narrow:hover .copy-icon rect,
.cta-lavora-narrow:hover .copy-icon path {
  stroke: #fff;
}

/* Responsive - mobile stack verticalmente */
@media (max-width: 768px) {
  .lavora-cta-wrapper {
    flex-direction: column;
  }

  .cta-lavora-wide,
  .cta-lavora-narrow {
    width: 100%;
    flex: none !important;
  }

  .cta-lavora-wide {
    border-left: none !important;
  }

  .cta-lavora-narrow {
    border-bottom: none !important;
  }

  .cta-lavora-wide span,
  .cta-lavora-narrow span {
    font-size: 15px !important;
  }
}

/* STILE FORM E CONTATTI */

.contatti-form-bg .form-row-double p {
  display: flex;
  gap: 20px;
}

.contatti-form-bg .form-row-double p > span {
  flex: 1;
}

@media (max-width: 768px) {
  .contatti-form-bg .form-row-double p {
    flex-direction: column;
    gap: 0;
  }
}

.contatti-form-bg {
  background-color: #2c4a54;
}

.min-vh-50 {
  min-height: 50vh;
}

/* Link hover */
.contatti-section a:hover {
  color: var(--bs-secondary) !important;
  transition: color 0.3s ease;
}

/* Contact Form 7 Styling */
.contatti-form-bg .wpcf7-form-control-wrap {
  display: block;
  margin-bottom: 30px;
}

.contatti-form-bg input[type="text"],
.contatti-form-bg input[type="email"],
.contatti-form-bg input[type="tel"],
.contatti-form-bg textarea {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  padding: 15px 0;
  color: #fff;
  font-size: 16px;
  font-family: var(--bs-font-primary);
}

.contatti-form-bg input::placeholder,
.contatti-form-bg textarea::placeholder {
  color: rgba(255, 255, 255, 0.6);
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 1px;
}

.contatti-form-bg input:focus,
.contatti-form-bg textarea:focus {
  outline: none;
  border-bottom-color: #fff;
}

.contatti-form-bg textarea {
  min-height: 60px;
  height: 150px !important;
  resize: vertical;
}

/* Checkbox */
.contatti-form-bg .wpcf7-list-item {
  margin: 0;
}

.contatti-form-bg .wpcf7-checkbox {
  margin: 30px 0;
}

.contatti-form-bg .wpcf7-list-item-label {
  color: #fff;
  font-size: 14px;
  margin-left: 10px;
}

.contatti-form-bg input[type="checkbox"] {
  width: 14px;
  height: 14px;
  cursor: pointer;
}

.wpcf7-form .wpcf7-submit {
  margin-top: 10px !important;
  border: none; /* rimuove il bordo di default */
  color: #fff !important; /* testo bianco */
  background: transparent; /* mantiene trasparente se vuoi */
  cursor: pointer;
}

.wpcf7-form .wpcf7-submit span {
  color: #fff; /* testo bianco */
}

/* Messaggi validazione */
.contatti-form-bg .wpcf7-not-valid-tip {
  color: #ff6b6b;
  font-size: 12px;
  margin-top: 5px;
}

.contatti-form-bg .wpcf7-response-output {
  margin: 20px 0 0;
  padding: 15px;
  border-radius: 4px;
  font-size: 14px;
}