/* NORBOY 1,2,3 - ajustes v3 */

/* Ícono oficial suministrado por NORBOY: la imagen no se deforma ni se redibuja.
   La animación usa únicamente translate/scale uniforme y sombra. */
.visual.norboy-people-logo{
  width:74px;
  height:62px;
  margin:4px auto 8px;
  background:transparent;
  border-radius:0;
  display:grid;
  place-items:center;
  overflow:visible;
}
.norboy-people-logo img{
  display:block;
  width:64px;
  height:auto;
  object-fit:contain;
  transform-origin:50% 78%;
  animation:norboyPeopleSupportV3 6.4s cubic-bezier(.4,0,.2,1) infinite;
  will-change:transform,filter;
}
@keyframes norboyPeopleSupportV3{
  0%,18%{transform:translateY(0) scale(1);filter:drop-shadow(0 0 0 rgba(34,93,56,0))}
  30%{transform:translateY(-1px) scale(1.025);filter:drop-shadow(0 5px 5px rgba(34,93,56,.08))}
  40%{transform:translateY(-2px) scale(1.055);filter:drop-shadow(0 7px 7px rgba(34,93,56,.12))}
  50%{transform:translateY(-1px) scale(1.025);filter:drop-shadow(0 4px 5px rgba(34,93,56,.06))}
  58%,100%{transform:translateY(0) scale(1);filter:drop-shadow(0 0 0 rgba(34,93,56,0))}
}
/* 58%-100% deja una pausa visible antes de repetir. */
@media (max-width:520px){
  .visual.norboy-people-logo{
    width:66px;
    height:54px;
    margin:3px auto 9px;
  }
  .norboy-people-logo img{
    width:57px;
    animation-duration:6.4s!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .norboy-people-logo img{
    animation:norboyPeopleSupportV3 7.2s cubic-bezier(.4,0,.2,1) infinite!important;
  }
}

/* Tres productos: dos arriba y Créditos ocupa el ancho completo. */
.product-grid.three-products{
  grid-template-columns:1fr 1fr;
}
.product-grid.three-products .product-choice:last-child{
  grid-column:1 / -1;
  min-height:62px;
}

/* Tooltips accesibles para escritorio y táctil. */
.field-heading{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:5px;
  position:relative;
}
.field-help-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.field-help{
  width:17px;
  height:17px;
  border:1px solid #9eb4a4;
  border-radius:50%;
  padding:0;
  background:#f5f9f3;
  color:var(--forest);
  font:800 10px/1 Arial,sans-serif;
  display:grid;
  place-items:center;
  cursor:help;
  touch-action:manipulation;
}
.field-tooltip{
  position:absolute;
  z-index:40;
  left:50%;
  bottom:calc(100% + 8px);
  width:min(230px,72vw);
  padding:8px 9px;
  border-radius:9px;
  background:#213b35;
  color:#fff;
  font-size:8.5px;
  line-height:1.35;
  font-weight:600;
  box-shadow:0 8px 18px rgba(0,0,0,.16);
  transform:translateX(-50%) translateY(4px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:.15s ease;
}
.field-tooltip::after{
  content:"";
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  border:5px solid transparent;
  border-top-color:#213b35;
}
.field-help:hover + .field-tooltip,
.field-help:focus + .field-tooltip,
.field-help:focus-visible + .field-tooltip{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0);
}
.form-fields label{
  overflow:visible;
}
.norboy-turnstile-anchor{
  width:1px;
  height:1px;
  overflow:hidden;
  position:absolute;
  left:-9999px;
}
.norboy-turnstile-runtime{
  position:fixed;
  z-index:9999;
  right:12px;
  bottom:12px;
}
.send-whatsapp.norboy-saving{
  opacity:.68;
  pointer-events:none;
}

/* Mantiene buena interacción táctil. */
.continue,.back,.step-item,.product-choice,.member-button,.whatsapp-button,.service,.send-whatsapp,.field-help{
  touch-action:manipulation;
}

/* V3.2: permite pulsar el botón incompleto para mostrar el dato que falta. */
.send-whatsapp.disabled{cursor:pointer;}


/* V3.5 - Confirmación transparente después del envío */
.success-screen{
  text-align:center;
  padding-top:28px;
  min-height:520px;
}
.success-icon{
  width:76px;
  height:76px;
  margin:8px auto 20px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#eaf6e9;
  border:2px solid #83b98c;
  color:#24673d;
  font-size:38px;
  font-weight:900;
  box-shadow:0 9px 24px rgba(36,103,61,.10);
}
.success-screen .screen-title{
  text-align:center;
  margin-bottom:12px;
}
.success-message{
  max-width:430px;
  margin:0 auto 18px;
  color:#687870;
  font-size:15px;
  line-height:1.6;
}
.success-message strong{ color:#345e49; }
.success-interest{
  max-width:430px;
  margin:0 auto 25px;
  padding:12px 14px;
  border-radius:14px;
  background:#eef7e9;
  color:#6a786f;
  font-size:13px;
}
.success-interest strong{ color:#24673d; }
.success-home{
  max-width:430px;
  margin:24px auto 0;
}
@media (max-width:520px){
  .success-screen{ padding-top:22px; min-height:470px; }
  .success-icon{ width:68px; height:68px; font-size:34px; }
  .success-message{ font-size:14px; }
}
