.elementor-widget-container [data-tippy-root] > .tippy-box{color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-container [data-tippy-root] > .tippy-box .tippy-arrow{color:var( --e-global-color-primary );}.elementor-1054 .elementor-element.elementor-element-63081e93{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-html [data-tippy-root] > .tippy-box{color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-html [data-tippy-root] > .tippy-box .tippy-arrow{color:var( --e-global-color-primary );}.elementor-widget-html .wpcf7 input:not([type="submit"]){background-color:var( --e-global-color-primary );}.elementor-widget-html .wpcf7 select{background-color:var( --e-global-color-primary );}.elementor-widget-html .wpcf7 textarea{background-color:var( --e-global-color-primary );}.elementor-widget-html .wpcf7 label{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-html ::placeholder{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-html .wpcf7-submit{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );}.elementor-widget-html .wpcf7 input[type="submit"]:hover{color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );}.elementor-widget-shortcode [data-tippy-root] > .tippy-box{color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-shortcode [data-tippy-root] > .tippy-box .tippy-arrow{color:var( --e-global-color-primary );}.elementor-widget-shortcode .wpcf7 input:not([type="submit"]){background-color:var( --e-global-color-primary );}.elementor-widget-shortcode .wpcf7 select{background-color:var( --e-global-color-primary );}.elementor-widget-shortcode .wpcf7 textarea{background-color:var( --e-global-color-primary );}.elementor-widget-shortcode .wpcf7 label{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-shortcode ::placeholder{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-widget-shortcode .wpcf7-submit{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );}.elementor-widget-shortcode .wpcf7 input[type="submit"]:hover{color:var( --e-global-color-primary );background-color:var( --e-global-color-primary );}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-21d8118 */:root{
      --accent:#d28030;
      --accent2:#568bc5;
      --accent3:#d89331;
      --accentDark:#234579;

      --bg:#ffffff;
      --text:#0b1220;
      --muted:#5b6473;
      --line:rgba(11,18,32,.10);
      --shadow: 0 24px 60px rgba(11,18,32,.08);
      --shadow2: 0 10px 22px rgba(11,18,32,.10);
      --ease:cubic-bezier(.2,.8,.2,1);
      --max: 1160px;

      --compBg:#f3f4f7;
      --compBg2:#eceff4;
      --compBorder:#d8dde6;
      --compText: rgba(11,18,32,.55);

      --good:#1fbf72;
      --good2:#0e8a55;
    }

    *{box-sizing:border-box}
    body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);background:var(--bg);}
    .container{width:min(var(--max), calc(100% - 48px)); margin:0 auto;}
    .section{padding:84px 0;}

    .chip{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;box-shadow:0 1px 0 rgba(11,18,32,.03);font-size:14px;font-weight:900;}
    .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);}
    .head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px;}
    .head h2{font-size:clamp(26px,3.2vw,44px);letter-spacing:-.8px;margin:10px 0 0;line-height:1.12;}
    .head p{margin:0;color:var(--muted);max-width:64ch;line-height:1.6}

    .tabsRow{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:10px 0 16px;}
    .tabs{display:flex;flex-wrap:wrap;gap:10px;}
    .tab{padding:10px 12px;border-radius:999px;border:1px solid rgba(11,18,32,.10);background:#fff;color:#2b3340;font-weight:900;font-size:13px;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);user-select:none;white-space:nowrap;}
    .tab:hover{transform:translateY(-1px);box-shadow:var(--shadow2);border-color:rgba(11,18,32,.16);}
    .tab.active{border:none;color:#fff;background:var(--accent);box-shadow:0 18px 44px rgba(35,69,121,.18);}
    .helper{color:var(--muted);font-size:13px;line-height:1.5;}
    .helper b{color:var(--text)}

    .list{display:grid;gap:14px;}

    .plan{border:1px solid rgba(11,18,32,.10);border-radius:22px;background:#fff;box-shadow:0 1px 0 rgba(11,18,32,.03);overflow:hidden;transition:box-shadow .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);position:relative;}
    .plan:hover{box-shadow:var(--shadow2);border-color:rgba(11,18,32,.16);transform:translateY(-1px);}
    .summary{display:grid;grid-template-columns:1.15fr .85fr .6fr;gap:14px;align-items:center;padding:18px;cursor:pointer;position:relative;}
    .left{display:flex;align-items:flex-start;gap:14px;min-width:0;}
    .gbBadge{flex:0 0 auto;width:92px;height:92px;border-radius:24px;background:radial-gradient(circle at 25% 20%, rgba(210,128,48,.18), transparent 55%),radial-gradient(circle at 80% 70%, rgba(86,139,197,.18), transparent 58%),rgba(11,18,32,.02);border:1px solid rgba(11,18,32,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;}
    .gbBadge b{font-size:28px;letter-spacing:-.6px;}
    .gbBadge span{font-size:12px;color:var(--muted);font-weight:900;letter-spacing:.2px;}

    .meta{min-width:0;}
    .title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:950;letter-spacing:-.3px;font-size:16px;margin:0 0 6px;}
    .pill{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;border:1px solid rgba(11,18,32,.10);background:rgba(255,255,255,.90);font-size:12px;font-weight:950;color:#2b3340;}
    .pill i{width:8px;height:8px;border-radius:999px;background:var(--accent);display:inline-block;}
    .desc{color:var(--muted);font-size:13px;line-height:1.55;margin:0;max-width:60ch;}

    .persona{display:grid;gap:8px;justify-items:start;}
    .persona .who{font-weight:950;letter-spacing:-.2px;font-size:13px;}
    .persona .why{color:var(--muted);font-size:12px;line-height:1.45;}

    .action{display:flex;align-items:center;justify-content:flex-end;gap:10px;}
    .miniCta{display:inline-flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;border:1px solid rgba(11,18,32,.10);background:#fff;font-weight:950;cursor:pointer;user-select:none;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);white-space:nowrap;}
    .miniCta:hover{transform:translateY(-1px);box-shadow:var(--shadow2);border-color:rgba(11,18,32,.16);}
    .chev{width:10px;height:10px;border-right:2px solid rgba(11,18,32,.55);border-bottom:2px solid rgba(11,18,32,.55);transform:rotate(45deg);transition:transform .25s var(--ease);margin-top:-2px;}
    .plan[data-open="1"] .chev{transform:rotate(225deg);}

    .details{display:none;border-top:1px solid rgba(11,18,32,.08);padding:16px 18px 18px;background:radial-gradient(circle at 18% 20%, rgba(210,128,48,.06), transparent 45%),radial-gradient(circle at 82% 70%, rgba(86,139,197,.08), transparent 45%),#fff;}
    .plan[data-open="1"] .details{display:block;}

    .compareTop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
    .compareTop .msg{color:var(--muted);font-size:13px;line-height:1.5;max-width:70ch;}
    .badgeML{display:inline-flex;align-items:flex-start;gap:10px;padding:9px 12px;border-radius:16px;border:1px solid rgba(11,18,32,.10);background:linear-gradient(135deg, rgba(86,139,197,.14), rgba(210,128,48,.12));font-weight:950;font-size:12px;color:#2b3340;max-width:520px;white-space:normal;line-height:1.35;}
    .badgeML b{color:var(--accentDark)}
    .badgeML .dot{margin-top:4px}

    .grid4{display:grid;grid-template-columns:repeat(4, 1fr);gap:12px;}

    .stars{position:absolute;top:10px;right:10px;display:flex;gap:3px;z-index:3;}
    .star{width:14px;height:14px;display:inline-block;background:rgba(11,18,32,.12);clip-path:polygon(50% 0%, 62% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 38% 35%);opacity:.85;}
    .star.on{background:linear-gradient(135deg, var(--accent3), var(--accent));opacity:1;}
    .stars.compStars .star.on{background:linear-gradient(135deg, rgba(11,18,32,.30), rgba(11,18,32,.18));opacity:.95;}

    .box{border:1px solid rgba(11,18,32,.10);border-radius:18px;background:rgba(255,255,255,.92);box-shadow:0 10px 22px rgba(11,18,32,.06);padding:12px;position:relative;overflow:hidden;min-height:154px;}
    .box:before{content:"";position:absolute;inset:-90px;background:radial-gradient(circle at 25% 20%, rgba(210,128,48,.10), transparent 55%),radial-gradient(circle at 80% 70%, rgba(86,139,197,.10), transparent 58%);opacity:.85;pointer-events:none;}
    .box h4{margin:0 0 6px;font-size:12px;font-weight:950;letter-spacing:.2px;color:rgba(11,18,32,.72);position:relative;text-transform:uppercase;padding-right:92px;}
    .box .big{font-weight:950;font-size:18px;letter-spacing:-.4px;position:relative;margin:6px 0 2px;}
    .box .small{color:var(--muted);font-size:12px;line-height:1.45;position:relative;}
    .box .kpi{margin-top:10px;display:flex;flex-direction:column;gap:8px;position:relative;font-size:12px;color:rgba(11,18,32,.70);font-weight:900;}
    .kpiLine{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
    .chipK{border:1px solid rgba(11,18,32,.10);border-radius:999px;padding:5px 8px;background:rgba(255,255,255,.92);white-space:nowrap;font-size:11px;font-weight:950;}

    .box.biencelM{border:1px solid rgba(11,18,32,.10);background:radial-gradient(circle at 15% 20%, rgba(210,128,48,.22), transparent 52%),radial-gradient(circle at 85% 70%, rgba(86,139,197,.24), transparent 58%),rgba(255,255,255,.98);box-shadow:0 18px 44px rgba(35,69,121,.10);}
    .box.biencelM:before{opacity:.95}
    .box.biencelM h4{color:rgba(11,18,32,.86);}

    .box.biencelA {
      border: none;
      background: radial-gradient(circle at 18% 20%, rgba(210,128,48,0.30), transparent 50%), radial-gradient(circle at 82% 70%, rgba(86,139,197,0.30), transparent 55%), linear-gradient(135deg, rgba(35,69,121,0.10), rgba(210,128,48,0.10)), #fff;
      box-shadow: 0 26px 70px rgba(35,69,121,0.20);
      padding-top: 35px; /* Más espacio arriba */
      overflow: visible; /* IMPORTANTE: para que no se corte el ribbon */
      margin-top: 10px;  /* Espacio para que el ribbon no choque arriba */
    }
    .box.biencelA:before{display: none;}

    /* Ribbon now floats above the card and animates like Hot Sale flame */
    .ribbon {
      position: absolute;
      top: -18px; /* Ajustado */
      left: 14px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 8px 12px;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      font-weight: 950;
      font-size: 12px;
      z-index: 10; /* Prioridad máxima */
      box-shadow: 0 10px 20px rgba(35,69,121,0.2);
    }
    .ribbon .fire{width:18px;height:18px;display:grid;place-items:center;filter:drop-shadow(0 10px 12px rgba(210,128,48,.25));transform-origin:50% 70%;animation:flameFlicker 1.1s infinite;}
    .ribbon .fire::before{content:"🔥";font-size:16px;line-height:1;}
    .ribbon .spark{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.85);opacity:.9;}
    @keyframes flameFlicker{0%{transform:rotate(-6deg) scale(1);filter:drop-shadow(0 10px 12px rgba(210,128,48,.24));}30%{transform:rotate(4deg) scale(1.06);filter:drop-shadow(0 12px 14px rgba(210,128,48,.30));}60%{transform:rotate(-2deg) scale(1.02);filter:drop-shadow(0 11px 13px rgba(210,128,48,.26));}100%{transform:rotate(-6deg) scale(1);filter:drop-shadow(0 10px 12px rgba(210,128,48,.24));}}

    .priceTag{display:inline-flex;align-items:baseline;gap:10px;padding:10px 12px;border-radius:16px;background:var(--accent);color:#fff;font-weight:950;font-size:16px;margin-top:8px;position:relative;width:fit-content;}
    .priceTag small{opacity:.85;font-size:11px;font-weight:900}
    .priceTag .emph{font-size:22px;letter-spacing:-.6px;}

    .promo{margin-top:10px;border-top:1px solid rgba(11,18,32,.10);padding-top:10px;position:relative;color:rgba(11,18,32,.78);font-size:12px;line-height:1.45;}

    .features{margin-top:10px;display:grid;gap:6px;position:relative;}
    .f{display:flex;align-items:flex-start;gap:8px;color:rgba(11,18,32,.78);font-size:12px;line-height:1.35;font-weight:850;}
    .tick{width:16px;height:16px;border-radius:6px;background:linear-gradient(135deg,var(--good),var(--good2));border:1px solid rgba(0,0,0,.10);display:grid;place-items:center;flex:0 0 auto;margin-top:1px;box-shadow:0 10px 18px rgba(31,191,114,.18);}
    .tick:before{content:"";width:7px;height:4px;border-left:2px solid rgba(255,255,255,.95);border-bottom:2px solid rgba(255,255,255,.95);transform:rotate(-45deg);margin-top:-1px;opacity:1;}

    .box.comp{background:linear-gradient(180deg, var(--compBg), var(--compBg2));border-color:var(--compBorder);box-shadow:0 8px 18px rgba(11,18,32,.05);filter:saturate(.18);opacity:.92;}
    .box.comp:before{display:none;}
    .box.comp h4,.box.comp .big,.box.comp .small{color:var(--compText);}
    .box.comp .chipK{border-color:var(--compBorder);background:rgba(255,255,255,.8);color:rgba(11,18,32,.52);font-weight:900;}

    .worse{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:12px;border:1px solid rgba(11,18,32,.10);background:rgba(11,18,32,.04);color:rgba(11,18,32,.52);font-weight:950;font-size:12px;max-width:100%;line-height:1.3;}
    .worse i{width:8px;height:8px;border-radius:999px;background:rgba(11,18,32,.28);display:inline-block;flex:0 0 auto;}

    .bottomRow {
      display: flex;
      align-items: center;      /* Alinea nota y botón al centro vertical */
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
      margin-top: 20px;
    }
    /* Contenedor específico del botón por si tienes más de uno */
    .bottomRow div[style*="display:flex"] {
      align-items: center;      /* Evita deformación de botones internos */
      justify-content: flex-end;
    }
   .cta-container {
      display: flex !important;
      justify-content: flex-end;
      align-items: center; 
      flex: 0 0 auto; /* No permite que el contenedor crezca más de lo debido */
    }
    .cta {
      /* 1. Reset total para evitar herencias */
      all: unset; 
      box-sizing: border-box;
      
      /* 2. Comportamiento de botón */
      display: inline-flex !important;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      
      /* 3. Dimensiones estrictas - LA CLAVE */
      height: 44px !important;    /* Altura fija */
      max-height: 44px !important;
      width: auto !important;     /* El ancho se adapta al texto */
      padding: 0 24px !important; /* Espacio a los lados */
      
      /* 4. Estética */
      border-radius: 999px !important;
      font-weight: 900;
      font-size: 14px;
      font-family: inherit;
      white-space: nowrap;
      text-align: center;
      line-height: 1;            /* Evita que el texto empuje hacia arriba/abajo */
      transition: transform .2s var(--ease), box-shadow .2s var(--ease);
    }
    
    /* El color se mantiene separado */
    .cta.primary {
      color: #ffffff !important;
      background: var(--accent) !important;
      box-shadow: 0 10px 25px rgba(210,128,48,0.25);
    }
    .cta:hover{transform:translateY(-1px);box-shadow:var(--shadow2);border-color:rgba(11,18,32,.16);}
    .note{color:var(--muted);font-size:12px;line-height:1.45;max-width:70ch;}
    
    .details .grid4 .box.comp {
        margin-top: 120px; /* Desplaza las tarjetas hacia abajo para bajarlas */
    }

    @media (max-width:980px){
      .summary{grid-template-columns:1fr;gap:12px;}
      .action{justify-content:flex-end;}
      .grid4{grid-template-columns:1fr;}
      .gbBadge{width:84px;height:84px;}
      .badgeML{max-width:100%}
      .worse{white-space:normal}
      .details .grid4 .box.comp { margin-top: 20px;}
      .bottomRow {
        flex-direction: column;
        align-items: flex-start;
      }
      .cta-container {
        width: 100%;
      }
      .cta {
        width: 100%;
      }
    }
    @media (prefers-reduced-motion: reduce){
      .ribbon .fire{animation:none}
      .plan,.miniCta,.cta{transition:none}
      .chev{transition:none}
    }
    
.modal-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(11, 18, 32, 0.6); backdrop-filter: blur(4px);
  z-index: 9999; align-items: center; justify-content: center;
}
.close-modal {
  position: absolute; top: 15px; right: 20px;
  background: none; border: none; font-size: 24px; cursor: pointer;
}

/* Estilo base para el modal de planes (orderModal) */
#orderModal {
    display: none; /* Se controla con .style.display = 'flex' en tu JS */
    position: fixed;
    z-index: 9999;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.6);
    justify-content: center;
    align-items: center;
}

/* Contenedor interno compartido */
.modal-content {
    background: white;
    padding: 30px;
    border-radius: 15px;
    width: 90%;
    max-width: 500px;
    position: relative;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

/* Estilo base para el modal de recargas (miModalExterno) */
#miModalExterno {
    display: none; /* Estado inicial oculto */
    position: fixed !important; /* Asegura que se fije a la pantalla, no al contenido */
    z-index: 999999 !important; /* Valor muy alto para estar sobre cualquier otro elemento */
    left: 0;
    top: 0;
    width: 100vw; /* Ocupa todo el ancho de la ventana */
    height: 100vh; /* Ocupa todo el alto de la ventana */
    background-color: rgba(11, 18, 32, 0.7); /* Fondo oscuro con transparencia */
    backdrop-filter: blur(4px); /* Efecto de desenfoque igual al orderModal */
    
    /* Centrado absoluto */
    display: none; 
    align-items: center;
    justify-content: center;
}

/* Clase que activa el modal (se usa en tu JS) */
#miModalExterno.is-visible {
    display: flex !important;
}

/* Contenedor de la tarjeta blanca del iframe */
#miModalExterno .modal-content {
    background: white;
    padding: 10px; /* Espacio mínimo para el iframe */
    border-radius: 20px;
    width: 95%;
    max-width: 500px; /* Ajustado al tamaño de la interfaz de pago */
    height: auto;
    max-height: 90vh;
    position: relative;
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
    overflow: hidden; /* Evita que el iframe rompa los bordes redondeados */
}

/* Ajuste del botón cerrar para que sea visible sobre el iframe */
#miModalExterno .cerrar-modal {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 30px;
    color: #333;
    cursor: pointer;
    z-index: 10;
    line-height: 1;
}

/* Ajuste del iframe para que sea responsivo */
#iframe-pago-externo {
    border-radius: 15px;
    display: block;
    width: 100%;
}

.input-group { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.input-group label { font-size: 13px; font-weight: 800; color: var(--muted); }
.input-group input {
  padding: 12px; border-radius: 12px; border: 1px solid var(--compBorder);
  font-family: inherit; outline: none;
  color: var(--muted);
}
.input-group input:focus { border-color: var(--accent); }

.btn-loading {
  pointer-events: none;
  opacity: 0.7;
  position: relative;
}
.btn-loading::after {
  content: "";
  width: 16px; height: 16px;
  border: 2px solid #fff;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  display: inline-block;
  margin-left: 10px;
  vertical-align: middle;
}
@keyframes spin { to { transform: rotate(360deg); } }
#orderForm button[type="submit"] {
  height: 52px;            /* Un poco más robusto por ser el principal */
  border-radius: 999px;
  width: 100%;             /* Aquí sí queremos que ocupe el ancho del modal */
  margin-top: 20px;
  font-size: 16px;
}

/* Estado inicial: oculto */
#miModalExterno {
    display: none; 
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.6);
    justify-content: center;
    align-items: center;
}

/* Estado activo: se activa mediante tu JS */
#miModalExterno.is-visible {
    display: flex !important;
}

.modal-content {
    background: white;
    padding: 20px;
    border-radius: 15px;
    width: 90%;
    max-width: 500px;
    position: relative;
}

.cerrar-modal {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 28px;
    cursor: pointer;
}/* End custom CSS */