/* === /registro === */
.registro-hero{ --green:#5BBE72; --green-dark:#018F49; position:relative; overflow:hidden; background:var(--green); }
.registro-hero::before,.registro-hero::after{ content:""; position:absolute; top:0; bottom:0; width:min(18vw,100px); background:var(--green-dark); }
.registro-hero::before{ left:0; clip-path:polygon(0 0, 100% 50%, 0 100%); }
.registro-hero::after{ right:0; clip-path:polygon(100% 0, 0 50%, 100% 100%); }
.registro-hero__inner{ position:relative; display:flex; align-items:center;  padding:clamp(32px,5vw,64px) 16px; max-width:1200px; margin:0 auto; }
.registro-hero__title{ color:#fff; font-weight:700; letter-spacing:.5px; text-transform:uppercase;  font-size:clamp(20px,3.2vw,30px); margin:0; margin-left: 15%; }
.registro-hero__plane{ position:absolute; right:clamp(40px,10vw,160px); top:50%; transform:translateY(-50%); width:clamp(90px,14vw,200px); height:auto; filter:drop-shadow(0 6px 14px rgba(0,0,0,.18)); pointer-events:none; user-select:none; }
.registro-form{ background:#fff; }
.registro-form__container{ max-width:1200px; margin:clamp(24px,4vw,56px) auto; padding:0 16px; }
.registro-form__iframe{ width:100%; border:0; background:#fff; min-height:1050px; }
@media (max-width:768px){ .registro-form__iframe{ min-height:2100px; } .registro-hero__plane{ right:24px; width:140px; } }
.registro-form__fallback{ margin:.75rem 0 0; font-size:.95rem; text-align:center; }
.registro-form__fallback a{ color:#0b63ce; text-decoration:underline; }


/* ===== Responsive para /registro (no altera estilos base) ===== */

/* Tablets (≤ 992px): compacta un poco los laterales y el layout */
@media (max-width: 991.98px) {
  .registro-hero__inner{
    padding: clamp(28px, 6vw, 48px) 16px;
  }
  /* Triángulos laterales un poco más angostos en pantallas medias */
  .registro-hero::before,
  .registro-hero::after{
    width: min(12vw, 72px);
  }
  /* Reduce el empuje lateral del título */
  .registro-hero__title{
    margin-left: 8%;
  }
  /* Acerca un poco el avión al centro y ajusta tamaño */
  .registro-hero__plane{
    right: clamp(24px, 6vw, 88px);
    width: clamp(100px, 16vw, 180px);
  }
}

/* Móviles (≤ 768px): apila, centra y libera el avión de posición absoluta */
@media (max-width: 767.98px) {
  .registro-hero__inner{
    flex-direction: column;
    align-items: center;
    gap: .75rem;
    padding: clamp(20px, 7vw, 36px) 16px;
  }
  .registro-hero__title{
    margin-left: 0;           /* quita el desplazamiento lateral */
    text-align: center;
  }
  .registro-hero__plane{
    position: static;         /* deja de ser absoluto para que fluya debajo del título */
    transform: none;
    width: clamp(120px, 40vw, 180px);
    margin-top: .25rem;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.16)); /* un poco más suave en móvil */
  }
  /* Triángulos un poco más discretos en móvil */
  .registro-hero::before,
  .registro-hero::after{
    width: min(16vw, 56px);
    opacity: .9;
  }
}

/* Móviles muy pequeños (≤ 360px): aún más compacto */
@media (max-width: 359.98px) {
  .registro-hero__inner{ padding: 18px 14px; }
  .registro-hero__plane{ width: clamp(110px, 46vw, 160px); }
}

/* === Responsive para registro-hero === */
@media (max-width: 991.98px) {
  .registro-hero__inner {
    flex-direction: column;       /* Título y avión en columna */
    align-items: center;
    text-align: center;
    padding: 32px 16px;
  }

  .registro-hero__title {
    margin-left: 0 !important;   /* Quita el corrimiento lateral */
    font-size: clamp(18px, 5vw, 24px);
  }

  .registro-hero__plane {
    position: static;            /* Lo sacamos del absolute */
    transform: none;
    margin-top: 16px;
    width: clamp(100px, 35vw, 160px);
  }
}

@media (max-width: 575.98px) {
  .registro-hero__title {
    font-size: 18px;
  }
  .registro-hero__plane {
    width: 100px;
  }
}
