/* =========================================================================
   HILADA — Sección de Contacto + botón flotante de WhatsApp
   Manual de marca v2: Oliva #3B4433 como único color de marca, Arena #C7B8A1
   como acento cálido, Hueso #F3F0E7 de fondo, aire generoso.
   Display: Cormorant Garamond · Texto: Jost
   Breakpoints coherentes con el resto del tema: 1100 / 860 / 520
   ========================================================================= */

.hilada-contacto{
  background:var(--hilada-bone);
  color:var(--hilada-charcoal);
  padding:clamp(3.5rem,8vw,7rem) 0;
  font-family:var(--font-ui);
}
.hilada-contacto__inner{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* ---------- Encabezado ---------- */
.hilada-contacto__head{
  max-width:64ch;
  margin:0 auto clamp(2.5rem,5vw,4.5rem);
  text-align:center;
}
.hilada-contacto__eyebrow{
  margin:0 0 1.1rem;
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--hilada-greige);
}
.hilada-contacto__title{
  font-family:var(--font-display);
  font-weight:500;
  font-size:var(--step-xl);
  line-height:1.02;
  letter-spacing:.01em;
  margin:0;
  color:var(--hilada-olive);
}
.hilada-contacto__rule{
  display:block;
  width:64px;
  height:1px;
  margin:clamp(1.2rem,3vw,1.8rem) auto;
  background:var(--hilada-sand);
}
.hilada-contacto__subtitle{
  font-family:var(--font-display);
  font-style:italic;
  font-size:var(--step-lg);
  line-height:1.25;
  margin:0 0 1.1rem;
  color:var(--hilada-olive-medium);
}
.hilada-contacto__lead{
  font-size:var(--step-base);
  line-height:1.75;
  font-weight:300;
  margin:0;
  color:var(--hilada-greige);
}

/* ---------- Rejilla ---------- */
.hilada-contacto__grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:clamp(2.5rem,6vw,6rem);
  align-items:start;
}

/* ---------- Avisos ---------- */
.hilada-contacto__alert{
  margin:0 0 2rem;
  padding:1rem 1.2rem;
  font-size:var(--step-sm);
  line-height:1.6;
  border-left:2px solid;
  background:#fff;
}
.hilada-contacto__alert:focus{outline:none;box-shadow:var(--focus)}
.hilada-contacto__alert--ok{border-color:var(--hilada-olive);color:var(--hilada-olive)}
.hilada-contacto__alert--error{border-color:#8a3a2a;color:#8a3a2a}

/* ---------- Campos: línea simple, sin cajas ---------- */
.hilada-contacto__form{margin:0}
.hilada-field{
  display:grid;
  gap:.45rem;
  margin:0 0 clamp(1.6rem,3vw,2.2rem);
}
.hilada-field label{
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--hilada-greige);
}
.hilada-field__req{
  color:var(--hilada-sand);
  margin-left:.15em;
}
.hilada-field input,
.hilada-field textarea{
  width:100%;
  font-family:var(--font-ui);
  font-size:var(--step-base);
  font-weight:300;
  color:var(--hilada-charcoal);
  background:transparent;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  padding:.6rem 0;
  transition:border-color .25s ease;
  -webkit-appearance:none;
  appearance:none;
}
.hilada-field textarea{
  resize:vertical;
  min-height:7.5rem;
  line-height:1.7;
}
.hilada-field input:hover,
.hilada-field textarea:hover{border-bottom-color:var(--hilada-sand)}
.hilada-field input:focus,
.hilada-field textarea:focus{
  outline:none;
  border-bottom-color:var(--hilada-olive);
  box-shadow:0 1px 0 0 var(--hilada-olive);
}
.hilada-field input:focus-visible,
.hilada-field textarea:focus-visible{box-shadow:0 1px 0 0 var(--hilada-olive)}
.hilada-field input::placeholder,
.hilada-field textarea::placeholder{color:var(--hilada-greige);opacity:.6}

.hilada-field--error input,
.hilada-field--error textarea{border-bottom-color:#8a3a2a}
.hilada-field__msg{
  font-size:var(--step-sm);
  color:#8a3a2a;
  line-height:1.5;
}

/* Honeypot */
.hilada-contacto__hp{
  position:absolute!important;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* ---------- Botón enviar ---------- */
.hilada-contacto__actions{margin:clamp(2rem,4vw,2.8rem) 0 0}
.hilada-contacto__submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:220px;
  padding:1rem 2.6rem;
  font-family:var(--font-ui);
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--hilada-bone);
  background:var(--hilada-olive);
  border:1px solid var(--hilada-olive);
  border-radius:0;
  cursor:pointer;
  transition:background-color .25s ease,border-color .25s ease,color .25s ease;
}
.hilada-contacto__submit:hover,
.hilada-contacto__submit:focus-visible{
  background:var(--hilada-charcoal);
  border-color:var(--hilada-charcoal);
  color:var(--hilada-bone);
}
.hilada-contacto__submit:focus-visible{outline:none;box-shadow:var(--focus)}

/* ---------- Datos directos ---------- */
.hilada-contacto__datos{
  border-left:1px solid var(--line);
  padding-left:clamp(1.6rem,3vw,2.8rem);
}
.hilada-contacto__datos-title{
  margin:0 0 1.6rem;
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--hilada-olive);
}
.hilada-datos{margin:0}
.hilada-datos__row{
  padding:1rem 0;
  border-bottom:1px solid var(--line);
}
.hilada-datos__row:first-child{padding-top:0}
.hilada-datos dt{
  margin:0 0 .3rem;
  font-size:.68rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--hilada-greige);
}
.hilada-datos dd{
  margin:0;
  font-size:var(--step-base);
  font-weight:300;
  line-height:1.6;
  color:var(--hilada-charcoal);
}
.hilada-datos dd a{
  color:inherit;
  text-decoration:underline;
  text-decoration-color:transparent;
  text-underline-offset:.3em;
  transition:text-decoration-color .25s ease,color .25s ease;
}
.hilada-datos dd a:hover{color:var(--hilada-olive);text-decoration-color:var(--hilada-sand)}

/* ---------- Enlace WhatsApp dentro de la sección ---------- */
.hilada-contacto__wa-inline{
  display:inline-flex;
  align-items:center;
  gap:.75rem;
  margin-top:2rem;
  padding:.9rem 1.3rem;
  color:var(--hilada-olive);
  background:var(--hilada-bone-secondary);
  text-decoration:none;
  font-size:var(--step-sm);
  line-height:1.35;
  transition:background-color .25s ease,color .25s ease;
}
.hilada-contacto__wa-inline em{
  display:block;
  font-style:normal;
  font-size:.72rem;
  letter-spacing:.12em;
  color:var(--hilada-greige);
  margin-top:.2rem;
}
.hilada-contacto__wa-inline:hover{background:var(--hilada-sand);color:var(--hilada-charcoal)}
.hilada-contacto__wa-inline:hover em{color:var(--hilada-charcoal)}
.hilada-contacto__wa-inline:focus-visible{outline:none;box-shadow:var(--focus)}
.hilada-contacto__wa-inline .hilada-wa__icon{flex:0 0 auto;width:22px;height:22px}

/* =========================================================================
   Botón flotante de WhatsApp (todo el sitio)
   ========================================================================= */
.hilada-wa{
  position:fixed;
  right:clamp(1rem,3vw,1.75rem);
  bottom:clamp(1rem,3vw,1.75rem);
  z-index:9990;
  display:inline-flex;
  align-items:center;
  gap:0;
  max-width:56px;
  height:56px;
  padding:0 14px;
  overflow:hidden;
  color:#fff;
  background:#25D366;
  border-radius:999px;
  text-decoration:none;
  box-shadow:0 8px 26px rgba(27,26,21,.24);
  transition:max-width .35s ease,gap .35s ease,box-shadow .25s ease,background-color .25s ease;
}
.hilada-wa__icon{flex:0 0 auto;width:28px;height:28px}
.hilada-wa__label{
  white-space:nowrap;
  font-family:var(--font-ui);
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.08em;
  opacity:0;
  transition:opacity .25s ease .1s;
}
.hilada-wa:hover,
.hilada-wa:focus-visible{
  max-width:340px;
  gap:.7rem;
  background:#1EBE5A;
  box-shadow:0 10px 30px rgba(27,26,21,.3);
}
.hilada-wa:hover .hilada-wa__label,
.hilada-wa:focus-visible .hilada-wa__label{opacity:1}
.hilada-wa:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(37,211,102,.45),0 10px 30px rgba(27,26,21,.3)}

/* No tapar la barra inferior del móvil ni el chat de otros plugins */
@supports(padding:env(safe-area-inset-bottom)){
  .hilada-wa{bottom:calc(clamp(1rem,3vw,1.75rem) + env(safe-area-inset-bottom))}
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media(max-width:1100px){
  .hilada-contacto__grid{gap:clamp(2rem,4vw,3.5rem)}
}
@media(max-width:860px){
  .hilada-contacto__grid{grid-template-columns:1fr}
  .hilada-contacto__datos{
    border-left:0;
    border-top:1px solid var(--line);
    padding-left:0;
    padding-top:clamp(2rem,5vw,2.8rem);
  }
  .hilada-contacto__head{text-align:left;margin-inline:0}
  .hilada-contacto__rule{margin-inline:0}
}
@media(max-width:520px){
  .hilada-contacto{padding:clamp(2.5rem,10vw,3.5rem) 0}
  .hilada-contacto__submit{width:100%;min-width:0}
  .hilada-wa{max-width:52px;height:52px;padding:0 12px}
  .hilada-wa__icon{width:26px;height:26px}
  .hilada-wa:hover,.hilada-wa:focus-visible{max-width:calc(100vw - 2.5rem)}
  .hilada-contacto__wa-inline{width:100%}
}

/* Accesibilidad y movimiento reducido */
@media(prefers-reduced-motion:reduce){
  .hilada-wa,.hilada-wa__label,.hilada-field input,.hilada-field textarea,
  .hilada-contacto__submit,.hilada-contacto__wa-inline,.hilada-datos dd a{
    transition:none!important;
  }
}

/* Impresión: fuera el flotante */
@media print{
  .hilada-wa{display:none!important}
  .hilada-contacto{background:#fff;padding:0}
  .hilada-contacto__grid{grid-template-columns:1fr}
}