/*
 * YEL Semáforo · estilo Ya Estoy Listo (guía yel-landing-servicio).
 * Sin fondo propio: el plugin es transparente y deja ver el fondo único (glows) de la página.
 * Todo vive bajo .yel-semaforo y sus variables llevan prefijo --yel-semaforo-*.
 * Los estados hover/focus de cada botón se declaran explícitamente para que el reset del tema
 * (button:hover{background:#c36}) no se cuele. El JS reemplaza el atributo class de .sem-bar:
 * no pongas ganchos de estilo sobre ese elemento, solo sobre sus hijos o su padre.
 */
.yel-semaforo {
  /* tokens YEL */
  --yel-semaforo-crema:#F9F6ED; --yel-semaforo-principal:#E83983; --yel-semaforo-principal-soft:#F188B5;
  --yel-semaforo-principal-deep:#B92E69; --yel-semaforo-principal-dark:#8B224F;
  --yel-semaforo-surface:#112233; --yel-semaforo-line:#2B4054; --yel-semaforo-bg:#0E1B29;
  --yel-semaforo-muted:rgba(249,246,237,.72);
  --yel-semaforo-glass:linear-gradient(160deg,rgba(17,34,51,.88),rgba(14,27,41,.62));
  --yel-semaforo-ease:cubic-bezier(.2,.7,.2,1);
  --yel-semaforo-font:'Work Sans',system-ui,sans-serif; --yel-semaforo-container:1120px;
  /* semáforo: el verde sale del token YEL. Rojo y amarillo no tienen token de semáforo: el amarillo dorado #C5A04E se leía
     caqui al encenderse, así que el tramo usa #F5B83D (ajuste 1.0.3). */
  --yel-semaforo-tl-red:#E5484D; --yel-semaforo-tl-yellow:#F5B83D; --yel-semaforo-tl-green:#34A66F;
  --yel-semaforo-tl-red-rgb:229,72,77; --yel-semaforo-tl-yellow-rgb:245,184,61; --yel-semaforo-tl-green-rgb:52,166,111;
  --yel-semaforo-tl-red-text:#FF9EA2; --yel-semaforo-tl-yellow-text:#FFD27A; --yel-semaforo-tl-green-text:#86D8AF;
  display:block; width:100%; min-width:0; box-sizing:border-box;
  font-family:var(--yel-semaforo-font); font-size:16px; font-weight:400; font-style:normal; letter-spacing:normal; text-align:left; text-transform:none;
  background:transparent; color:var(--yel-semaforo-crema); line-height:1.55; color-scheme:dark;
  -webkit-font-smoothing:antialiased; padding:72px 0 84px; scroll-margin-top:68px;
}
.yel-semaforo, .yel-semaforo *, .yel-semaforo *::before, .yel-semaforo *::after { box-sizing:border-box; }
.yel-semaforo * { margin:0; padding:0; }
.yel-semaforo [hidden] { display:none !important; }
.yel-semaforo a { color:inherit; text-decoration:none; background:transparent; }
.yel-semaforo button { font:inherit; color:inherit; cursor:pointer; border:0; background:none; text-transform:none; letter-spacing:normal; box-shadow:none; }
.yel-semaforo input, .yel-semaforo select { font:inherit; }
.yel-semaforo :focus-visible { outline:3px solid rgba(232,57,131,.55); outline-offset:3px; }
.yel-semaforo .wrap { max-width:var(--yel-semaforo-container); margin:0 auto; padding:0 20px; }

/* ── Botones premium (rosa = .btn-pink · azul = .btn-outline / .btn-blue) ── */
.yel-semaforo .btn {
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:56px; padding:16px 30px; overflow:hidden;
  color:#fff; border-radius:14px; font-family:inherit; font-size:16px; font-weight:700; line-height:1; letter-spacing:-.01em; text-transform:none; text-decoration:none; text-shadow:none;
  white-space:nowrap; transform:translateY(0);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease,filter .25s ease;
}
.yel-semaforo .btn-pink {
  color:#fff; background:radial-gradient(circle at 50% 45%,#e83983 0%,#d92f77 38%,#b62663 68%,#8b224f 100%); border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 2px 2px #f188b5,inset 0 -8px 18px rgba(83,12,44,.2),0 10px 24px rgba(0,0,0,.24);
}
.yel-semaforo .btn-pink:hover, .yel-semaforo .btn-pink:focus {
  color:#fff; background:radial-gradient(circle at 50% 45%,#f04491 0%,#df327d 38%,#be2969 68%,#8b224f 100%); border-color:rgba(255,255,255,.22);
  box-shadow:inset 0 2px 2px rgba(255,184,215,.95),inset 0 -8px 18px rgba(83,12,44,.18),0 14px 30px rgba(0,0,0,.3);
}
.yel-semaforo .btn-pink:hover { transform:translateY(-2px); }
.yel-semaforo .btn-pink:active {
  transform:translateY(0) scale(.98); color:#fff;
  box-shadow:inset 0 3px 5px rgba(99,17,54,.32),inset 0 -2px 4px rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.24);
}
.yel-semaforo .btn-pink:focus-visible { outline:3px solid rgba(232,57,131,.35); outline-offset:4px; }
.yel-semaforo .btn-outline, .yel-semaforo .btn-blue {
  color:#fff; background:radial-gradient(circle at 50% 45%,#445d76 0%,#354c63 38%,#24384c 68%,#112233 100%); border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 2px 2px #445d76,inset 0 -8px 18px rgba(5,15,26,.28),0 10px 24px rgba(0,0,0,.24);
}
.yel-semaforo .btn-outline:hover, .yel-semaforo .btn-outline:focus, .yel-semaforo .btn-blue:hover, .yel-semaforo .btn-blue:focus {
  color:#fff; background:radial-gradient(circle at 50% 45%,#526f8c 0%,#405a73 38%,#2a4056 68%,#112233 100%); border-color:rgba(255,255,255,.2);
  box-shadow:inset 0 2px 2px rgba(109,139,168,.95),inset 0 -8px 18px rgba(5,15,26,.24),0 14px 30px rgba(0,0,0,.3);
}
.yel-semaforo .btn-outline:hover, .yel-semaforo .btn-blue:hover { transform:translateY(-2px); }
.yel-semaforo .btn-outline:active, .yel-semaforo .btn-blue:active {
  transform:translateY(0) scale(.98); color:#fff;
  box-shadow:inset 0 3px 5px rgba(5,15,26,.42),inset 0 -2px 4px rgba(255,255,255,.06),0 6px 14px rgba(0,0,0,.24);
}
.yel-semaforo .btn-outline:focus-visible, .yel-semaforo .btn-blue:focus-visible { outline:3px solid rgba(68,93,118,.45); outline-offset:4px; border-color:rgba(249,246,237,.6); }
.yel-semaforo .btn[disabled] { opacity:.55; cursor:not-allowed; transform:none; }

/* ── Tarjeta principal (vidrio oscuro) ── */
.yel-semaforo .qcard {
  display:grid; grid-template-columns:.9fr 1.1fr; gap:20px; padding:20px;
  background:var(--yel-semaforo-glass); border:1px solid var(--yel-semaforo-line); border-radius:24px;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 30px 60px -36px rgba(0,0,0,.6);
}
.yel-semaforo .q-left { padding:22px 18px 18px; display:flex; flex-direction:column; color:var(--yel-semaforo-crema); }
.yel-semaforo .q-left h2 {
  font-family:inherit; color:var(--yel-semaforo-crema); text-transform:none; font-style:normal; text-align:left;
  font-size:clamp(1.65rem,3vw,2.4rem); font-weight:700; letter-spacing:-.02em; line-height:1.1;
}
.yel-semaforo .yel-semaforo-accent { color:var(--yel-semaforo-principal); }
.yel-semaforo .q-left p { margin-top:14px; color:var(--yel-semaforo-muted); font-size:16px; max-width:400px; }

/* ── Semáforo: tres tramos con brillo propio y marcador ── */
.yel-semaforo .sem { margin-top:0; padding-top:36px; }
.yel-semaforo .sem-bar { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; height:14px; }
.yel-semaforo .sem-bar span { border-radius:100px; opacity:.34; transition:opacity .6s ease,box-shadow .6s ease; }
.yel-semaforo .sem-bar .r { background:var(--yel-semaforo-tl-red); box-shadow:0 0 10px rgba(var(--yel-semaforo-tl-red-rgb),.3); }
.yel-semaforo .sem-bar .y { background:var(--yel-semaforo-tl-yellow); box-shadow:0 0 10px rgba(var(--yel-semaforo-tl-yellow-rgb),.3); }
.yel-semaforo .sem-bar .g { background:var(--yel-semaforo-tl-green); box-shadow:0 0 10px rgba(var(--yel-semaforo-tl-green-rgb),.3); }
.yel-semaforo .sem-bar.on-r .r { opacity:1; box-shadow:0 0 22px rgba(var(--yel-semaforo-tl-red-rgb),.75),0 0 3px rgba(var(--yel-semaforo-tl-red-rgb),.9); }
.yel-semaforo .sem-bar.on-y .y { opacity:1; box-shadow:0 0 22px rgba(var(--yel-semaforo-tl-yellow-rgb),.75),0 0 3px rgba(var(--yel-semaforo-tl-yellow-rgb),.9); }
.yel-semaforo .sem-bar.on-g .g { opacity:1; box-shadow:0 0 22px rgba(var(--yel-semaforo-tl-green-rgb),.75),0 0 3px rgba(var(--yel-semaforo-tl-green-rgb),.9); }
.yel-semaforo .sem-marker {
  position:absolute; top:50%; left:var(--yel-semaforo-pos,5%); width:28px; height:28px; border-radius:50%;
  background:var(--yel-semaforo-crema); border:5px solid var(--yel-semaforo-surface); translate:-50% -50%;
  box-shadow:0 0 0 2px var(--yel-semaforo-crema),0 8px 18px rgba(0,0,0,.45),0 0 18px rgba(232,57,131,.5);
  transition:left 1.2s cubic-bezier(.3,.9,.2,1);
}
.yel-semaforo .sem-labels { margin-top:16px; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; text-align:center; font-size:13px; font-weight:500; color:rgba(249,246,237,.6); }
.yel-semaforo .sem-labels span { transition:color .4s ease; }
.yel-semaforo .sem-labels .on { color:var(--yel-semaforo-crema); font-weight:700; }
.yel-semaforo .sem-cap { margin-top:16px; font-size:13.5px; color:var(--yel-semaforo-muted); }

/* ── Panel de preguntas (vidrio anidado) ── */
.yel-semaforo .q-right {
  padding:32px 34px; display:flex; flex-direction:column; min-height:460px;
  background:rgba(17,34,51,.62); border:1px solid var(--yel-semaforo-line); border-radius:18px;
}
.yel-semaforo .q-top { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px 12px; font-size:13.5px; font-weight:600; color:var(--yel-semaforo-muted); }
.yel-semaforo .q-top > span:first-child { white-space:nowrap; }
.yel-semaforo .q-top > span:last-child {
  flex:0 0 auto; padding:5px 12px; border-radius:999px; font-size:12px; font-weight:600; letter-spacing:.02em; white-space:nowrap;
  color:var(--yel-semaforo-crema); background:rgba(43,64,84,.55); border:1px solid var(--yel-semaforo-line);
}
.yel-semaforo .q-prog { margin-top:12px; height:8px; border-radius:100px; background:var(--yel-semaforo-line); }
.yel-semaforo .q-prog i {
  display:block; height:100%; width:0; border-radius:100px;
  background:linear-gradient(90deg,var(--yel-semaforo-principal-deep),var(--yel-semaforo-principal),var(--yel-semaforo-principal-soft));
  box-shadow:0 0 14px rgba(232,57,131,.5); transition:width .45s ease;
}
.yel-semaforo .q-body { margin-top:28px; flex:1; }
.yel-semaforo .q-title {
  font-family:inherit; color:var(--yel-semaforo-crema); text-transform:none; font-style:normal; text-align:left;
  font-size:clamp(1.3rem,2.4vw,1.75rem); font-weight:700; line-height:1.2; letter-spacing:-.02em;
}
.yel-semaforo .q-title:focus { outline:none; }
.yel-semaforo .opts { margin-top:22px; display:flex; flex-direction:column; gap:12px; }
.yel-semaforo .opt {
  width:100%; text-align:left; padding:16px 20px; border-radius:14px; border:1px solid var(--yel-semaforo-line);
  font-size:16px; font-weight:500; line-height:1.35; color:var(--yel-semaforo-crema); background:var(--yel-semaforo-glass); box-shadow:none;
  transition:border-color .3s ease,transform .3s ease,box-shadow .3s ease,background .3s ease;
}
.yel-semaforo .opt:hover:not(:disabled), .yel-semaforo .opt:focus-visible {
  color:var(--yel-semaforo-crema); background:var(--yel-semaforo-glass); border-color:var(--yel-semaforo-principal);
}
.yel-semaforo .opt:hover:not(:disabled) { transform:translateY(-3px); box-shadow:0 18px 36px -22px rgba(232,57,131,.55); }
.yel-semaforo .opt[aria-pressed="true"], .yel-semaforo .opt[aria-pressed="true"]:hover, .yel-semaforo .opt[aria-pressed="true"]:focus {
  color:var(--yel-semaforo-crema); background:rgba(232,57,131,.14); border-color:var(--yel-semaforo-principal); box-shadow:none;
}
.yel-semaforo .opt:disabled { cursor:default; }
.yel-semaforo .opt:disabled:not([aria-pressed="true"]) { opacity:.55; }
.yel-semaforo .q-back {
  margin-top:20px; font-size:14px; font-weight:600; color:var(--yel-semaforo-muted); background:none;
  text-decoration:underline; text-underline-offset:3px; align-self:flex-start; transition:color .25s ease;
}
.yel-semaforo .q-back:hover, .yel-semaforo .q-back:focus { color:var(--yel-semaforo-principal-soft); background:none; }
.yel-semaforo .q-back:disabled { opacity:.5; cursor:not-allowed; }
.yel-semaforo .q-fine {
  margin-top:22px; padding-top:14px; border-top:1px solid var(--yel-semaforo-line);
  font-size:12.5px; color:var(--yel-semaforo-muted); line-height:1.5;
}

/* ── Formulario ── */
.yel-semaforo .gate-sub { margin-top:8px; color:var(--yel-semaforo-muted); font-size:15.5px; }
.yel-semaforo .gate { margin-top:20px; }
.yel-semaforo .gate .field { margin-bottom:12px; }
.yel-semaforo .gate .btn { width:100%; margin-top:4px; padding:16px; font-size:16px; }
.yel-semaforo .gate .btn[disabled] { opacity:.7; cursor:wait; transform:none; }
.yel-semaforo .gate .fine { margin-top:12px; }
.yel-semaforo .gate-note {
  margin-top:12px; padding:12px 14px; border-radius:12px; font-size:14px; font-weight:500;
  background:rgba(232,57,131,.14); border:1px solid rgba(232,57,131,.45); color:var(--yel-semaforo-crema);
}
.yel-semaforo .field { margin-bottom:14px; }
.yel-semaforo .field > label {
  display:block; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; line-height:1.3;
  color:rgba(249,246,237,.82); margin-bottom:7px;
}
.yel-semaforo .field input, .yel-semaforo .field select, .yel-semaforo .field textarea {
  width:100%; padding:14px 16px; border-radius:10px; border:1px solid var(--yel-semaforo-principal); font-family:inherit; font-size:15px; line-height:1.4; letter-spacing:normal;
  background:rgba(17,34,51,.65); color:var(--yel-semaforo-crema); box-shadow:none; transition:box-shadow .25s ease,border-color .25s ease;
}
.yel-semaforo .field input::placeholder { color:rgba(249,246,237,.45); }
.yel-semaforo .field input:focus, .yel-semaforo .field select:focus, .yel-semaforo .field textarea:focus {
  outline:none; border-color:var(--yel-semaforo-principal); background:rgba(17,34,51,.65); box-shadow:0 0 0 3px rgba(232,57,131,.3);
}
.yel-semaforo .field select {
  -webkit-appearance:none; appearance:none; padding-right:40px; text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1.5l6 6 6-6' stroke='%23F9F6ED' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:14px 9px;
}
.yel-semaforo .field select option { background:var(--yel-semaforo-surface); color:var(--yel-semaforo-crema); }
.yel-semaforo .field input:-webkit-autofill, .yel-semaforo .field input:-webkit-autofill:focus {
  -webkit-text-fill-color:var(--yel-semaforo-crema); caret-color:var(--yel-semaforo-crema); -webkit-box-shadow:0 0 0 1000px var(--yel-semaforo-surface) inset;
}
.yel-semaforo .field-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
/* Nombre y teléfono van en filas completas: el prefijo del país debe leerse entero. */
.yel-semaforo .gate > .field-row:first-child { grid-template-columns:1fr; gap:0; }
.yel-semaforo .field { container-type:inline-size; }
.yel-semaforo .phone-row { display:flex; gap:8px; }
.yel-semaforo .phone-row select { width:46%; min-width:0; }
.yel-semaforo .phone-row input { flex:1; width:0; min-width:0; }
@container (max-width:340px) {
  .yel-semaforo .phone-row { flex-direction:column; }
  .yel-semaforo .phone-row select, .yel-semaforo .phone-row input { width:100%; flex:none; }
}
.yel-semaforo .fine { margin-top:14px; font-size:12px; color:var(--yel-semaforo-muted); line-height:1.5; }
.yel-semaforo .fine a { color:var(--yel-semaforo-crema); text-decoration:underline; text-underline-offset:2px; }
.yel-semaforo .fine a:hover, .yel-semaforo .fine a:focus { color:var(--yel-semaforo-principal-soft); }
.yel-semaforo .consent { display:flex; align-items:flex-start; gap:10px; }
.yel-semaforo .consent input { flex:0 0 auto; margin-top:3px; width:16px; height:16px; accent-color:var(--yel-semaforo-principal); }
.yel-semaforo .consent label { font-size:12px; font-weight:400; line-height:1.5; letter-spacing:normal; text-transform:none; color:var(--yel-semaforo-muted); }
.yel-semaforo .field-error { color:var(--yel-semaforo-tl-red-text); font-size:12.5px; margin-top:6px; }
.yel-semaforo .field [aria-invalid="true"], .yel-semaforo .consent [aria-invalid="true"] { border-color:var(--yel-semaforo-tl-red-text); box-shadow:0 0 0 1px var(--yel-semaforo-tl-red-text); }
.yel-semaforo .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.yel-semaforo .spam-field { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }

/* ── Resultado ── */
.yel-semaforo .res-light {
  display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:14px; padding:7px 16px 7px 10px; border-radius:100px; border:1px solid transparent;
}
.yel-semaforo .res-light i { width:18px; height:18px; border-radius:50%; }
.yel-semaforo .res.r .res-light { background:rgba(var(--yel-semaforo-tl-red-rgb),.16); border-color:rgba(var(--yel-semaforo-tl-red-rgb),.5); color:var(--yel-semaforo-tl-red-text); }
.yel-semaforo .res.r .res-light i { background:var(--yel-semaforo-tl-red); box-shadow:0 0 0 4px rgba(var(--yel-semaforo-tl-red-rgb),.25),0 0 16px rgba(var(--yel-semaforo-tl-red-rgb),.8); }
.yel-semaforo .res.y .res-light { background:rgba(var(--yel-semaforo-tl-yellow-rgb),.16); border-color:rgba(var(--yel-semaforo-tl-yellow-rgb),.5); color:var(--yel-semaforo-tl-yellow-text); }
.yel-semaforo .res.y .res-light i { background:var(--yel-semaforo-tl-yellow); box-shadow:0 0 0 4px rgba(var(--yel-semaforo-tl-yellow-rgb),.25),0 0 16px rgba(var(--yel-semaforo-tl-yellow-rgb),.8); }
.yel-semaforo .res.g .res-light { background:rgba(var(--yel-semaforo-tl-green-rgb),.16); border-color:rgba(var(--yel-semaforo-tl-green-rgb),.5); color:var(--yel-semaforo-tl-green-text); }
.yel-semaforo .res.g .res-light i { background:var(--yel-semaforo-tl-green); box-shadow:0 0 0 4px rgba(var(--yel-semaforo-tl-green-rgb),.25),0 0 16px rgba(var(--yel-semaforo-tl-green-rgb),.8); }
.yel-semaforo .res h3 {
  font-family:inherit; color:var(--yel-semaforo-crema); text-transform:none; font-style:normal; text-align:left;
  margin-top:16px; font-size:clamp(1.75rem,3.4vw,2.4rem); font-weight:700; letter-spacing:-.02em; line-height:1.1;
}
.yel-semaforo .res h3:focus { outline:none; }
.yel-semaforo .res p { margin-top:12px; color:var(--yel-semaforo-muted); font-size:16.5px; max-width:480px; }
.yel-semaforo .event-line { margin-top:10px; font-size:14.5px; color:var(--yel-semaforo-muted); }
.yel-semaforo .event-line b { color:var(--yel-semaforo-crema); font-weight:600; }
.yel-semaforo .res-mail {
  margin-top:14px; padding:12px 14px; border-radius:12px; font-size:14px; max-width:480px;
  background:rgba(14,27,41,.55); border:1px solid var(--yel-semaforo-line); color:var(--yel-semaforo-muted);
}
.yel-semaforo .res-mail b { color:var(--yel-semaforo-crema); font-weight:600; }
.yel-semaforo .res-cta { margin-top:26px; display:flex; gap:12px; flex-wrap:wrap; }
.yel-semaforo .res-links { margin-top:22px; display:flex; gap:22px; flex-wrap:wrap; font-size:14px; }
.yel-semaforo .res-links a, .yel-semaforo .res-links button {
  font-size:inherit; font-weight:600; color:var(--yel-semaforo-crema); background:none; box-shadow:none;
  text-decoration:underline; text-underline-offset:3px; transition:color .25s ease;
}
.yel-semaforo .res-links a:hover, .yel-semaforo .res-links a:focus, .yel-semaforo .res-links button:hover, .yel-semaforo .res-links button:focus {
  color:var(--yel-semaforo-principal-soft); background:none;
}

/* ── Entrada suave: translate (no transform) y fill backwards para no congelar el hover ── */
@keyframes yel-semaforo-rise { from { opacity:0; translate:0 16px; } to { opacity:1; translate:0 0; } }
.yel-semaforo .q-title, .yel-semaforo .gate, .yel-semaforo .res { animation:yel-semaforo-rise .6s var(--yel-semaforo-ease) backwards; }
.yel-semaforo .opt { animation:yel-semaforo-rise .5s var(--yel-semaforo-ease) backwards; }
.yel-semaforo .opt:nth-child(1) { animation-delay:.05s; }
.yel-semaforo .opt:nth-child(2) { animation-delay:.12s; }
.yel-semaforo .opt:nth-child(3) { animation-delay:.19s; }
.yel-semaforo .opt:nth-child(n+4) { animation-delay:.26s; }

/* ── Responsive ── */
@media (max-width:980px) {
  .yel-semaforo .qcard { grid-template-columns:1fr; }
  .yel-semaforo .q-left { padding:20px 14px 8px; }
  .yel-semaforo .sem { padding-top:30px; }
}
@media (max-width:767px) {
  .yel-semaforo .btn { min-height:52px; padding:15px 24px; font-size:15px; border-radius:13px; }
  .yel-semaforo .gate .btn { padding:15px; font-size:15px; }
}
@media (max-width:640px) {
  .yel-semaforo { padding:48px 0 56px; }
  .yel-semaforo .wrap { padding:0 16px; }
  .yel-semaforo .qcard { padding:12px; border-radius:20px; gap:14px; }
  .yel-semaforo .q-left { padding:16px 10px 4px; }
  .yel-semaforo .q-right { padding:24px 18px; min-height:0; border-radius:16px; }
  .yel-semaforo .field-row { grid-template-columns:1fr; gap:0; }
  .yel-semaforo .res-cta { flex-direction:column; }
  .yel-semaforo .res-cta .btn { width:100%; max-width:100%; white-space:normal; line-height:1.25; text-align:center; }
}
@media (max-width:480px) {
  /* Elementor limita el contenedor boxed que aloja el semáforo (Content Width 340px en móvil).
     Se levanta (y se quita el padding por defecto) solo en los contenedores que alojan al plugin; el resto de la página no cambia. */
  .e-con > .e-con-inner:has(.yel-semaforo) { max-width:100%; }
  /* El contenedor que aloja el widget trae 10px de padding lateral por defecto en Elementor. */
  .e-con:has(> .elementor-widget .yel-semaforo) { padding-inline:0; }
  .yel-semaforo .wrap { padding:0 8px; }
  .yel-semaforo .qcard { padding:8px; border-radius:22px; gap:10px; }
  .yel-semaforo .q-left { padding:14px 8px 2px; }
  .yel-semaforo .q-right { padding:18px 14px; border-radius:16px; }
  .yel-semaforo .q-top { font-size:13px; }
  .yel-semaforo .q-top > span:last-child { font-size:11.5px; padding:4px 10px; }
}
@media (prefers-reduced-motion:reduce) {
  .yel-semaforo *, .yel-semaforo *::before, .yel-semaforo *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}