/* AppEvidex Canonical Mobile V22
   Built after source-level diagnostic.
   One mobile layer only. Desktop V13/V14 is untouched.
*/
.bg22-mobile{display:none!important}

@media (max-width:820px){
  html,body{
    margin:0!important;
    padding:0!important;
    width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
    background:#020914!important;
    -webkit-text-size-adjust:100%!important;
    text-size-adjust:100%!important;
  }
  body{
    min-height:0!important;
    color:#f6f8fb!important;
    font-family:Inter,Segoe UI,Arial,sans-serif!important;
  }

  .v15-desktop{display:none!important}
  .bg22-mobile{
    display:block!important;
    width:100%!important;
    min-height:100vh!important;
    background:
      radial-gradient(circle at 100% 0,rgba(239,179,66,.08),transparent 23rem),
      radial-gradient(circle at -10% 40%,rgba(28,80,126,.09),transparent 18rem),
      linear-gradient(180deg,#020914 0%,#04111e 58%,#020914 100%);
  }

  .bg22-head{
    position:relative;
    z-index:50;
    background:rgba(2,9,20,.98);
    border-bottom:1px solid rgba(239,179,66,.12);
  }
  .bg22-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:12px 16px 7px;
  }
  .bg22-brand{
    text-decoration:none;
    color:#fff;
    font-size:23px;
    line-height:1;
    font-weight:900;
    letter-spacing:-1px;
  }
  .bg22-brand b{color:#efb342}
  .bg22-langs{display:flex;gap:6px}
  .bg22-langs a{
    width:37px;height:33px;
    border-radius:999px;
    display:grid;place-items:center;
    color:#aeb7c2;
    background:#06121f;
    border:1px solid rgba(255,255,255,.12);
    text-decoration:none;
    font-size:10px;
  }
  .bg22-langs .on{
    color:#171006;
    font-weight:900;
    border-color:#ffd267;
    background:linear-gradient(135deg,#ffe58a,#dda02f);
    box-shadow:0 0 18px rgba(239,179,66,.20);
  }
  .bg22-nav{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:6px;
    padding:0 10px 10px;
  }
  .bg22-nav a{
    min-width:0;
    padding:8px 2px;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:clip;
    border-radius:999px;
    text-decoration:none;
    color:#d5dce3;
    background:#071522;
    border:1px solid #213247;
    font-size:9.2px;
    line-height:1;
  }
  .bg22-nav a.active{
    color:#ffd16a;
    border-color:#b97825;
    background:linear-gradient(180deg,rgba(239,179,66,.055),#071522);
  }

  .bg22-wrap{
    width:calc(100% - 20px);
    max-width:690px;
    margin:0 auto;
    padding:12px 0 30px;
  }
  .bg22-panel{
    border:1px solid rgba(190,125,37,.68);
    border-radius:18px;
    background:
      radial-gradient(circle at 100% 0,rgba(239,179,66,.065),transparent 15rem),
      linear-gradient(145deg,#081725,#04101c);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 16px 36px rgba(0,0,0,.24);
  }

  /* HERO: artwork is integrated into the panel, not placed in a separate rectangle. */
  .bg22-hero{
    position:relative;
    min-height:304px;
    padding:14px;
    overflow:hidden;
  }
  .bg22-kicker{
    position:relative;
    z-index:4;
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:6px 10px;
    border:1px solid rgba(190,125,37,.74);
    border-radius:999px;
    color:#efb342;
    font-size:8.6px;
    line-height:1;
    font-weight:900;
    letter-spacing:.55px;
    text-transform:uppercase;
    background:rgba(4,16,28,.36);
  }
  .bg22-kicker:before{
    content:"";
    width:6px;height:6px;border-radius:50%;
    background:#efb342;
    box-shadow:0 0 10px rgba(239,179,66,.82);
  }
  .bg22-copy{
    position:relative;
    z-index:4;
    width:53%;
    padding-top:13px;
  }
  .bg22-copy h1{
    margin:0 0 9px;
    font-size:clamp(18px,5.15vw,22px);
    line-height:1.035;
    letter-spacing:-.72px;
    font-weight:900;
  }
  .bg22-gold{
    background:linear-gradient(135deg,#ffe18b,#efb342 52%,#c77d18);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .bg22-lead{
    margin:0 0 6px;
    color:#eef2f6;
    font-size:10.3px;
    line-height:1.42;
  }
  .bg22-muted{
    margin:0;
    color:#9ea9b5;
    font-size:8.45px;
    line-height:1.47;
  }

  .bg22-hero-art{
    position:absolute;
    z-index:1;
    right:-6.5%;
    top:34px;
    width:64%;
    height:218px;
    background-repeat:no-repeat;
    background-color:transparent;
    filter:saturate(1.04) contrast(1.03);
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 10%,#000 30%,#000 100%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.25) 10%,#000 30%,#000 100%);
  }
  .bg22-hero-art.home{
    background-image:url('/assets/approved-home-v13.png?v=13');
    background-size:188% auto;
    background-position:76% 13%;
  }
  .bg22-hero-art.como{
    background-image:url('/assets/approved-como-funciona-v14.png?v=14');
    background-size:184% auto;
    background-position:76% 10%;
  }
  .bg22-hero:after{
    content:"";
    position:absolute;
    z-index:2;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(90deg,
        rgba(4,16,28,.995) 0%,
        rgba(4,16,28,.965) 39%,
        rgba(4,16,28,.73) 51%,
        rgba(4,16,28,.24) 68%,
        rgba(4,16,28,.02) 100%);
  }

  .bg22-actions{
    position:absolute;
    z-index:5;
    left:14px;right:14px;bottom:14px;
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:8px;
  }
  .bg22-btn{
    min-height:47px;
    border-radius:11px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:0 9px;
    text-decoration:none;
    font-weight:900;
    font-size:10.6px;
    line-height:1.12;
  }
  .bg22-btn.primary{
    color:#171006;
    border:1px solid #ffd369;
    background:linear-gradient(135deg,#ffe58a,#dda02f);
    box-shadow:0 10px 24px rgba(211,138,31,.17);
  }
  .bg22-btn.secondary{
    color:#fff;
    background:#071522;
    border:1px solid rgba(255,255,255,.14);
  }

  .bg22-benefits{
    margin-top:10px;
    padding:11px 6px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .bg22-benefit{
    min-width:0;
    text-align:center;
    padding:0 5px;
    border-right:1px solid rgba(195,131,39,.34);
  }
  .bg22-benefit:last-child{border-right:0}
  .bg22-icon{
    width:35px;height:35px;
    margin:0 auto 6px;
    border-radius:50%;
    border:1px solid #b87927;
    display:grid;
    place-items:center;
    color:#efb342;
    background:radial-gradient(circle,rgba(239,179,66,.08),transparent 65%);
  }
  .bg22-icon svg{
    width:18px;height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .bg22-benefit span{
    display:block;
    color:#d8e0e7;
    font-size:7.9px;
    line-height:1.18;
  }

  .bg22-section{margin-top:17px}
  .bg22-eyebrow{
    margin:0 0 5px 1px;
    color:#efb342;
    font-size:8.7px;
    line-height:1;
    font-weight:900;
    letter-spacing:1.9px;
    text-transform:uppercase;
  }
  .bg22-section h2{
    margin:0;
    font-size:21px;
    line-height:1.08;
    letter-spacing:-.45px;
  }
  .bg22-sub{
    margin:5px 0 10px;
    color:#9faab6;
    font-size:10.2px;
    line-height:1.4;
  }

  .bg22-cards3{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
  }
  .bg22-card{
    min-width:0;
    padding:11px 9px;
    border:1px solid rgba(190,125,37,.60);
    border-radius:14px;
    background:linear-gradient(145deg,#081725,#06111e);
  }
  .bg22-card .bg22-icon{margin:0 0 8px}
  .bg22-card h3{
    margin:0 0 7px;
    font-size:10.7px;
    line-height:1.17;
  }
  .bg22-card p{
    margin:0;
    color:#aab4bf;
    font-size:8.65px;
    line-height:1.44;
  }

  .bg22-offer{
    margin-top:13px;
    padding:12px;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:11px;
    align-items:center;
  }
  .bg22-offer h3{
    margin:7px 0 5px;
    font-size:14.8px;
    line-height:1.12;
  }
  .bg22-offer p{
    margin:0;
    color:#aab4bf;
    font-size:8.8px;
    line-height:1.43;
  }
  .bg22-price{
    color:#ffc754;
    font-size:26px;
    line-height:1;
    letter-spacing:-.9px;
    font-weight:900;
    white-space:nowrap;
  }
  .bg22-price small{
    display:block;
    margin-top:5px;
    color:#e5a73a;
    font-size:6.6px;
    letter-spacing:1.3px;
  }
  .bg22-checks{
    display:grid;
    gap:4px;
    margin-top:8px;
  }
  .bg22-checks span{
    color:#cbd3db;
    font-size:7.8px;
    line-height:1.18;
  }
  .bg22-checks span:before{
    content:"✓";
    margin-right:5px;
    color:#efb342;
    font-weight:900;
  }
  .bg22-offer .bg22-btn{
    grid-column:1/-1;
    min-height:40px;
  }

  .bg22-safe{
    margin-top:12px;
    padding:11px;
    display:grid;
    grid-template-columns:82px 1fr;
    gap:11px;
    align-items:center;
  }
  .bg22-safe-art{
    width:80px;height:80px;
    border-radius:15px;
    display:grid;
    place-items:center;
    background:
      radial-gradient(circle at 50% 42%,rgba(239,179,66,.20),transparent 53%),
      #071522;
    border:1px solid rgba(190,125,37,.56);
    color:#efb342;
    box-shadow:inset 0 0 25px rgba(239,179,66,.035);
  }
  .bg22-safe-art svg{
    width:43px;height:43px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.35;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .bg22-safe h3{
    margin:0 0 5px;
    font-size:15px;
    line-height:1.15;
  }
  .bg22-safe p{
    margin:0 0 8px;
    color:#aab4bf;
    font-size:8.9px;
    line-height:1.43;
  }
  .bg22-safe .bg22-btn{
    min-height:38px;
    font-size:9.3px;
  }

  /* COMO FUNCIONA */
  .bg22-video{
    margin-top:10px;
    padding:8px;
  }
  .bg22-video-title{
    margin:0 0 7px 2px;
    color:#efb342;
    font-size:8.8px;
    font-weight:900;
    letter-spacing:.65px;
    text-transform:uppercase;
  }
  .bg22-video iframe{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    border:0;
    border-radius:10px;
    background:#000;
  }
  .bg22-steps{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .bg22-step{
    min-width:0;
    padding:11px 10px;
    border:1px solid rgba(190,125,37,.58);
    border-radius:13px;
    background:linear-gradient(145deg,#081725,#06111e);
  }
  .bg22-num{
    width:28px;height:28px;
    margin-bottom:7px;
    border-radius:50%;
    display:grid;
    place-items:center;
    color:#ffd166;
    border:1px solid #b87927;
    font-weight:900;
    font-size:9px;
  }
  .bg22-step h3{
    margin:0 0 6px;
    font-size:10.5px;
    line-height:1.16;
  }
  .bg22-step p{
    margin:0;
    color:#aab4bf;
    font-size:8.5px;
    line-height:1.42;
  }
  .bg22-receive{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  .bg22-footer{
    padding:18px 12px 28px;
    text-align:center;
    color:#788591;
    font-size:8.5px;
  }

  @media(max-width:355px){
    .bg22-copy h1{font-size:17px}
    .bg22-copy{width:55%}
    .bg22-hero-art{width:67%;right:-10%}
    .bg22-nav a{font-size:8.3px}
    .bg22-card h3{font-size:9.8px}
    .bg22-card p{font-size:8px}
  }
}

@media (min-width:821px){
  .bg22-mobile{display:none!important}
}