/* cortes-aplicados: 400/52 690/67 10700/52 + faixa final + primeira-dobra 376/113 + respiro-topo 186/+10.5 + nota-moeda 10370/+30 14390/+30 */
/* Ajustes só da versão em espanhol: o texto em ES é mais longo e estourava
   algumas caixas de largura fixa herdadas do layout original. */

/* desktop */
.c113{width:200px}                 /* pílula "Actividades de 2 a 10 años" */
.c161{left:598px;width:240px}      /* Enfoque y Concentración */
.c164{left:216px;width:200px}      /* Razonamiento Lógico */
.c192{left:145px;width:320px}      /* Sustituir horas de pantalla... */
.c194{left:540px;width:272px}      /* Tener a mano actividades listas... */
.c196{left:140px;width:700px}      /* Este kit es perfecto para mamás que: */
.c201{left:529px;width:360px}      /* Saben que la pantalla no es lo ideal... */
.c270{left:122px;width:760px}      /* Mira lo que otras mamás están diciendo: */
.c271{left:141px;width:720px}      /* ¡Compra única, acceso de por vida... */
.c275{left:225px;width:175px}      /* La Zona de Confort */
.c279{width:340px}                 /* bullets Opción 1 */

/* mobile */
@media (max-width:767px){
  .m23{left:28rem;width:126rem}
  .m23 p{font-size:9.5rem}
  .m45{left:88rem;width:185rem}
  .m69{left:96rem;width:192rem;top:1090.5rem}
  .m76{left:15rem;width:290rem}
  .m99{left:59.5rem;width:200rem;top:2706.5rem}
  .m159{left:42rem;width:240rem}
  .m167{width:182rem}
  .m172{width:150rem;top:9539.5rem}
  .m240{left:10rem;width:300rem}
  .m242{left:10rem;width:300rem}
  .m242 p{font-size:24rem;line-height:24rem}
  .m251{width:130rem}
  .m291{left:45rem;width:230rem}
  .mfaq summary{padding:22rem 0 24rem}
  /* traços de preço ajustados aos valores em dólar */
  .m178,.m180,.m182,.m184,.m186,.m187{left:249rem;width:32rem}
  .m198{left:228rem;width:55rem}
  .m208{left:133.2rem;width:58rem}
  .m279{left:122.2rem;width:58rem}
}

/* ---------------------------------------------------------------
   Textos que estavam "queimados" dentro das imagens, refeitos em
   HTML por cima. A arte original continua embaixo, só o texto muda.
   --------------------------------------------------------------- */

/* badges Paso 1/2/3 (cobrem os "Passo" da imagem) */
.esbadge{position:absolute;display:flex;align-items:center;justify-content:center;
  border-radius:999px;color:#fff;font-family:mr;font-weight:600;z-index:6}
.esbadge-pink{background:rgb(245,30,162)}
.esbadge-blue{background:rgb(21,87,183)}
.esbadge-green{background:rgb(68,183,118)}
#page .esbadge{font-size:18px}
#pagem .esbadge{font-size:9rem}
#pagem .esbadge-green{background:rgb(130,244,81)}

/* selos de compra segura */
.c76,.c93,.m219,.m286{display:none}
.esseals{position:absolute;display:flex;align-items:center;justify-content:space-between;z-index:6}
.esseal{display:flex;align-items:center;color:rgb(110,110,110);font-family:hr;white-space:nowrap}
.esseal::before{content:"";flex:0 0 auto;background:center/contain no-repeat}
#page .esseal{font-size:10px;gap:4px}
#page .esseal::before{width:15px;height:15px}
#pagem .esseal{font-size:7rem;gap:3rem}
#pagem .esseal::before{width:11rem;height:11rem}
.s1::before{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6e6e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5 4.5 5.2v5.6c0 4.7 3.2 8.9 7.5 10.4 4.3-1.5 7.5-5.7 7.5-10.4V5.2L12 2.5Z'/%3E%3Cpath d='m8.6 12.1 2.4 2.4 4.4-4.4'/%3E%3C/svg%3E")}
.s2::before{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6e6e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='10' width='15' height='11' rx='2.5'/%3E%3Cpath d='M8 10V7.2a4 4 0 0 1 8 0V10'/%3E%3Cpath d='M12 14.5v2.5'/%3E%3C/svg%3E")}
.s3::before{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6e6e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3.5h10V9a5 5 0 0 1-10 0V3.5Z'/%3E%3Cpath d='M7 5.5H4V7a3 3 0 0 0 3 3M17 5.5h3V7a3 3 0 0 1-3 3'/%3E%3Cpath d='M12 14v2.5M9.5 20.5h5l-.8-4h-3.4l-.8 4Z'/%3E%3C/svg%3E")}

/* cartões "¿Cómo recibo el acceso?" do mobile (no original é imagem) */
.escard{position:absolute;background:#fff;text-align:center;z-index:6}
.escard .esct{font-family:mr;font-weight:800;font-size:17rem;line-height:20rem;color:rgb(27,30,47)}
.escard .escb{font-family:mr;font-weight:500;font-size:9.5rem;line-height:12rem;color:#000;margin-top:7rem}

/* traços de preço riscado ajustados aos novos valores */
.xs-es-item{width:56px!important}
.xs-es-total{left:605px!important;width:97px!important}
.xs-es-offer1{left:600px!important;width:91px!important}
.xs-es-offer2{left:609px!important;width:91px!important}

/* Centralização medida no pixel contra as imagens novas (mobile) */
@media (max-width:767px){
  /* nomes das 6 áreas no centro da faixa colorida de cada imagem */
  .m97{left:64.5rem;top:2425.5rem}
  .m100{left:46rem;top:3002rem}
  .m101{left:58rem;top:3293.5rem}
  .m102{left:67rem;top:3591.5rem}
  .m103{left:56.5rem;top:3891rem}
  /* etiquetas da foto do topo */
  .m34{left:23.6rem;top:308.9rem}
  .m33{left:190.1rem;top:303.9rem}
  /* selo Gratis */
  .m174{left:226rem;width:74rem}
  .m174 h2{text-align:center}
  /* bloco de preço no eixo do botão */
  .m207{left:94.5rem}
  .m278{left:83.5rem}
  .m207 p,.m211 h2,.m213 p,.m278 p,.m280 h2,.m281 p{text-align:center}
  /* lista de checks alinhada às caixinhas da imagem */
  .m200{top:10042.5rem} .m202{top:10061.5rem} .m203{top:10081rem} .m204{top:10100.5rem}
  .m271{top:14085.5rem} .m274{top:14105rem} .m273{top:14124.5rem} .m272{top:14144rem}
}

/* Marca Pequeños Creadores: a logo quadrada substitui passarinho + nome em texto.
   Proporção da imagem 400x392. */
.c40{left:441px;top:14px;width:98px;height:96px}              /* topo */
.c49{left:441px;top:2690px;width:98px;height:96px}            /* apresentação do kit */
.c78{left:615.3px;top:10974px;width:73.5px;height:72px}       /* card oferta 1 */
.c94{left:622.2px;top:14212px;width:77.6px;height:76px}       /* card oferta 2 */
.c95{left:454.2px;top:15545px;width:81.6px;height:80px}       /* rodapé */
.c303{top:15645px}
/* rodapé sem CNPJ e sem "¿Tienes dudas?": faixa escura encolhe e a página termina nela */
.c22{height:227px}
.c23{display:none}
#page,.c0{height:15731px}
@media (max-width:767px){
  .mi1{left:126.3rem;top:4rem;width:67.3rem;height:66rem}
  .m221{left:130.3rem;top:10133.5rem;width:71.4rem;height:70rem}
  .mi25{left:123.4rem;top:14173.5rem;width:63.3rem;height:62rem}
  .mi26{left:126.3rem;top:15309.5rem;width:67.3rem;height:66rem}
  .m291{top:15390.5rem}
}

/* Primeira dobra do mobile compactada: logo, título, subtítulo e pílulas sobem
   para a foto "Sin el kit / Con el kit" aparecer inteira sem rolar. */
@media (max-width:767px){
  .m1{height:52rem}
  .m2{display:none}
  .m11{top:52rem;height:232.5rem}
  .m28{top:284.5rem;height:263rem}  /* emenda das faixas cinza abaixo das pílulas (antes cobria a 3ª) */
  .mi1{left:136.5rem;top:3rem;width:46.9rem;height:46rem}
  .m15{left:15rem;top:62rem;width:290rem}
  .m20{left:10rem;top:164.3rem;width:300rem}
  .m20 .m19{font-size:15rem}
  .m21,.m24{top:196.5rem} .m26{top:241.5rem}
  .mi2,.mi3{top:204.5rem} .mi4{top:248.5rem}
  .m23,.m25{top:207.5rem} .m27{top:252.5rem}
}

/* Aviso de conversão de moeda nos blocos de preço */
.esnota{position:absolute;font-family:hr;color:rgb(102,101,101);text-align:center;z-index:4}
#page .esnota{font-size:12px;line-height:16px}
#pagem .esnota{font-size:9rem;line-height:11.5rem}

/* cartões "Cómo recibo" do mobile (top saiu do inline para o planos.mjs conseguir deslocar) */
.esc1{top:10734.5rem}.esc2{top:10882rem}.esc3{top:11025.5rem}

/* Layout mobile (<768px) é dimensionado por 100vw. Em navegador de computador com janela estreita,
   a barra de rolagem clássica (~15px) fica por cima da direita e a página parece deslocada.
   Celular usa barra sobreposta (não ocupa espaço), então esconder a barra aqui não muda nada no celular. */
@media (max-width:767px){
  html{scrollbar-width:none}
  html::-webkit-scrollbar{display:none}
}
