/* Funil B (19/10/2026): layout idéntico al quiz de workoutforwomen, en el rosa de Pilates en la Pared. */
:root{--pink:#b42364;--pink-2:#d63a82;--pink-soft:#fde4ec;--bg:#f4f3f8;--card:#fff;--ink:#26222b;--muted:#8a8593;--line:#e8e6ee;--grey:#a9a6ae}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Poppins,"Segoe UI",Arial,sans-serif}
button,input{font:inherit;color:inherit}button{cursor:pointer}
#app{max-width:480px;margin:0 auto;padding:0 16px 120px;min-height:calc(100vh - 60px)}
.top{position:sticky;top:0;z-index:20;background:var(--bg);height:52px;max-width:480px;margin:0 auto;display:flex;align-items:center;padding:0 12px}
.back{border:0;background:none;font-size:34px;line-height:1;width:36px;height:40px;padding:0 0 4px;color:var(--ink)}
.back[hidden]{visibility:hidden;display:block}
.logo{flex:1;text-align:center;font-weight:700;font-size:17px;letter-spacing:-.01em}.logo span{color:var(--pink);font-weight:800;font-style:italic;font-size:21px}
.count{width:44px;text-align:right;font-size:13px;color:var(--muted)}
.bar{max-width:448px;margin:0 auto;height:5px;background:#e3e1e8;border-radius:5px;overflow:hidden}.bar>div{height:100%;width:0;background:var(--pink);border-radius:5px;transition:width .35s ease}
.bar[hidden]{display:none}
h1{font-size:21px;line-height:1.35;font-weight:600;text-align:center;margin:26px 8px 8px}
.sub{color:var(--muted);text-align:center;font-size:14px;line-height:1.5;margin:0 10px 6px}
.list{display:grid;gap:12px;margin-top:22px}
.opt{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;border:2px solid transparent;background:var(--card);border-radius:12px;padding:12px 16px;text-align:left;font-size:15px;font-weight:500;box-shadow:0 1px 2px rgba(40,30,60,.04);transition:border-color .15s,background .15s}
.opt:hover{border-color:#efc3d6}.opt.on{border-color:var(--pink);background:#fff7fa}
.opt .ic{width:24px;height:24px;flex:none;color:var(--ink)}
.opt small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:2px;line-height:1.35}
/* 26/10: 1ª pergunta (goal) com cartões brancos, ícone magenta, descrição cinza e seleção destacada */
.eyebrow{text-align:center;color:var(--pink);font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;margin:26px 8px 0}
.eyebrow+h1{margin-top:8px}
.list.rich{gap:12px;margin-top:20px}
.list.rich .opt{position:relative;min-height:76px;padding:14px 50px 14px 14px;border:1.5px solid #f1dce6;border-radius:16px;background:#fff;box-shadow:0 2px 10px rgba(180,35,100,.06)}
.list.rich .opt .ic{width:46px;height:46px;padding:11px;border-radius:13px;background:var(--pink-soft);color:var(--pink);stroke-width:1.8}
.list.rich .opt b{display:block;font-size:16px;font-weight:600;line-height:1.3;color:var(--ink)}
.list.rich .opt small{font-size:13px;margin-top:3px}
.list.rich .opt::after{content:'';position:absolute;right:20px;top:50%;width:8px;height:8px;border:solid #bdb3bb;border-width:2px 2px 0 0;transform:translateY(-50%) rotate(45deg)}
.list.rich .opt:hover{border-color:#e9b3cb}
.list.rich .opt.on{border-color:var(--pink);background:#fff6fa;box-shadow:0 0 0 3px rgba(180,35,100,.13)}
.list.rich .opt.on .ic{background:var(--pink);color:#fff}
.list.rich .opt.on::after{right:16px;width:24px;height:24px;border:0;border-radius:50%;transform:translateY(-50%);background:var(--pink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat}
/* 26/10: pergunta "life" (várias opções) — caixinha à direita, magenta quando marcada; pular é opcional */
.hint{text-align:center;color:var(--pink);font-size:12.5px;font-weight:700;margin:8px 0 0}
.list.rich.multi{gap:9px;margin-top:16px}
.list.rich.multi .opt{min-height:56px;padding:10px 48px 10px 12px;font-size:15px;font-weight:500;border-radius:14px}
.list.rich.multi .opt .ic{width:36px;height:36px;padding:8px;border-radius:10px}
.list.rich.multi .opt::after{right:16px;width:20px;height:20px;border:1.5px solid #cfc4cc;border-radius:6px;transform:translateY(-50%);background-color:#fff}
.list.rich.multi .opt.on{color:var(--pink);font-weight:600}
.list.rich.multi .opt.on::after{width:22px;height:22px;border:0;border-radius:6px;background-color:var(--pink);background-size:13px}
.skip{display:block;margin:14px auto 0;background:none;border:0;padding:8px 12px;color:var(--muted);font-size:13.5px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
/* 26/10: pergunta "level" — headline em maiúsculas, pergunta abaixo e nota de apoio rosa */
h1.up{font-size:23px;font-weight:800;line-height:1.2;text-transform:uppercase;text-wrap:balance;margin-top:8px}
.ask{text-align:center;font-size:16px;font-weight:600;line-height:1.35;margin:14px 8px 0;color:var(--ink)}
.ask+.list.rich{margin-top:14px}
.tip{display:flex;align-items:center;gap:10px;margin:14px 0 0;padding:12px 14px;border-radius:14px;background:var(--pink-soft);color:var(--pink);font-size:13.5px;font-weight:500;line-height:1.4}
.tip .ic{width:20px;height:20px;flex:none}
@media(min-width:700px){h1.up{font-size:28px}}
/* 26/10: pergunta "areas" — cartões com foto, todos do mesmo tamanho, check no canto da foto */
.list.rich.multi .opt.photo{min-height:96px;padding:0 0 0 16px;gap:0}
.list.rich.multi .opt.photo .txt{font-size:15.5px;font-weight:600;line-height:1.3;padding:12px 12px 12px 0}
.list.rich.multi .opt.photo img{width:42%;height:96px;border-radius:0 12px 12px 0}
.list.rich.multi .opt.photo::after{top:9px;right:9px;transform:none;width:22px;height:22px;border:2px solid #fff;border-radius:50%;background-color:rgba(255,255,255,.5);box-shadow:0 1px 4px rgba(0,0,0,.25)}
.list.rich.multi .opt.photo.on::after{width:24px;height:24px;border:0;border-radius:50%;background-color:var(--pink)}
@media(min-width:700px){.list.rich.multi .opt.photo,.list.rich.multi .opt.photo img{min-height:110px;height:110px}.list.rich.multi .opt.photo .txt{font-size:17px}}
/* 26/10: pergunta com 8 opções (event) — cartões mais baixos */
.list.rich .opt:nth-last-child(n+7),.list.rich .opt:nth-last-child(n+7)~.opt{min-height:62px;padding-top:9px;padding-bottom:9px}
.list.rich .opt:nth-last-child(n+7) .ic,.list.rich .opt:nth-last-child(n+7)~.opt .ic{width:38px;height:38px;padding:9px}
.rich-min{text-align:center;color:var(--muted);font-size:12.5px;margin:18px 0 0}
@media(min-width:700px){.list.rich .opt{min-height:82px;padding-left:18px}.list.rich .opt b{font-size:17px}.list.rich .opt small{font-size:14px}}
.opt.photo{padding:0 0 0 16px;min-height:76px;overflow:hidden}.opt.photo .txt{flex:1;padding:12px 0}.opt.photo img{width:44%;height:76px;object-fit:cover;object-position:center 30%;align-self:stretch}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.tile{border:2px solid transparent;background:var(--card);border-radius:12px;padding:6px 6px 10px;text-align:center;font-size:13px;font-weight:500;box-shadow:0 1px 2px rgba(40,30,60,.04)}
.tile img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:8px;display:block;margin-bottom:8px;background:#f1eff5}
.tile.on{border-color:var(--pink)}
/* 26/10: tela bodyNow — "HOY" em magenta, 4 fotos iguais 4:5, seleção com borda magenta + check */
h1.hl-em em{font-style:normal;color:var(--pink);font-weight:800}
.grid2.rich{gap:10px;margin-top:18px}
.grid2.rich .tile{position:relative;display:flex;flex-direction:column;justify-content:flex-start;padding:5px 5px 10px;border:2px solid #f1dce6;border-radius:14px;font-size:14px;font-weight:600;color:var(--ink);box-shadow:0 2px 10px rgba(180,35,100,.06);transition:border-color .15s,box-shadow .15s}
.grid2.rich .tile img{aspect-ratio:4/5;border-radius:10px;margin-bottom:8px}
.grid2.rich .tile:hover{border-color:#e9b3cb}
.grid2.rich .tile.on{border-color:var(--pink);background:#fff6fa;box-shadow:0 0 0 3px rgba(180,35,100,.13);color:var(--pink)}
.grid2.rich .tile.on::after{content:'';position:absolute;top:12px;right:12px;width:26px;height:26px;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.18);background:var(--pink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/15px no-repeat}
/* 26/10: 3 fotos (flex) — a 3ª fica centralizada, do mesmo tamanho das outras */
.grid2.rich .tile:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 5px)}
@media(min-width:700px){.grid2.rich .tile:last-child:nth-child(odd){width:calc(50% - 7px)}}
@media(min-width:700px){.grid2.rich{gap:14px}.grid2.rich .tile{font-size:15px}}
.cta-wrap{position:fixed;left:0;right:0;bottom:0;z-index:15;padding:12px 16px calc(16px + env(safe-area-inset-bottom));background:linear-gradient(0deg,var(--bg) 70%,rgba(244,243,248,0))}
.cta{display:block;width:100%;max-width:448px;margin:0 auto;border:0;border-radius:8px;background:var(--pink);color:#fff;font-weight:600;font-size:15px;letter-spacing:.03em;text-transform:uppercase;padding:16px;box-shadow:0 6px 16px rgba(180,35,100,.22)}
.cta:disabled{background:var(--grey);box-shadow:none;cursor:default}
.link{display:block;margin:16px auto 0;border:0;background:none;color:var(--ink);font-size:12px;font-weight:600;text-decoration:underline;text-transform:uppercase}
/* edad */
.age-head{text-align:center;padding-top:26px}.age-head h1{font-size:30px;font-weight:800;letter-spacing:.01em;margin:0}.age-head p{color:var(--muted);letter-spacing:.06em;font-size:14px;margin:6px 0 0;text-transform:uppercase}
.age-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.age{position:relative;border:0;border-radius:12px;overflow:hidden;background:#fff;aspect-ratio:1/1.05;padding:0}
.age img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.age span{position:absolute;left:0;right:0;bottom:0;background:var(--pink);color:#fff;font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:space-between;padding:9px 10px}
.age span b{width:20px;height:20px;border-radius:50%;background:#fff;color:var(--pink);display:grid;place-items:center;font-size:13px}
.legal{text-align:center;color:var(--muted);font-size:12px;line-height:1.5;margin:18px 8px}.legal a{color:var(--ink)}
/* intervalos */
.info-img{width:100%;border-radius:12px;display:block;margin:18px 0 14px;aspect-ratio:1.3/1;object-fit:cover;background:#ece9f1}
.card{background:#fff;border-radius:12px;padding:16px 18px;font-size:14px;line-height:1.6;color:#4b4652}.card b{color:var(--ink)}
.brand-num{text-align:center;padding:40px 0 0}.brand-num strong{display:block;font-size:34px;font-weight:800;color:var(--pink);line-height:1.2}.brand-num span{display:block;font-size:18px;font-weight:500;margin-top:6px}
/* números */
.units{display:flex;justify-content:center;gap:6px;margin:22px 0 0}
.units button{border:0;border-radius:6px;background:#fff;min-width:64px;padding:8px 14px;font-size:13px;font-weight:600}.units button.on{background:var(--pink);color:#fff}
.num{display:flex;justify-content:center;align-items:baseline;gap:6px;margin:44px 0 28px}
.num input{width:120px;border:0;border-bottom:2px solid #d9d6df;background:transparent;text-align:center;font-size:40px;font-weight:600;padding:4px 0;outline:0}
.num input:focus{border-color:var(--pink)}.num i{font-style:normal;color:var(--muted);font-size:14px}
.num.two input{width:70px}
.err{color:#c0392b;text-align:center;font-size:13px;min-height:18px}
/* 26/10: altura/peso — campo num cartão branco, unidades em pílula magenta */
.sub+.units{margin-top:16px}
.units button{border:1.5px solid #f1dce6}.units button.on{border-color:var(--pink)}
.mcard{margin-top:14px;padding:16px 16px 12px;background:#fff;border:1.5px solid #f1dce6;border-radius:16px;box-shadow:0 2px 10px rgba(180,35,100,.06);text-align:center}
.mlab{margin:0;font-size:15.5px;font-weight:600;color:var(--ink)}
.mcard .num{margin:12px 0 4px;align-items:center}
.mcard .num input{width:150px;font-size:30px;padding:8px 10px;border:1.5px solid #e3d9e0;border-radius:14px;background:#fff;transition:border-color .15s,box-shadow .15s}
.mcard .num input::placeholder{color:#c3bcc3;font-weight:500}
.mcard .num input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(180,35,100,.13)}
.mcard .num.two input{width:92px}
.mcard .err{margin:2px 0;min-height:16px}
.mhint{display:block;color:var(--muted);font-size:12.5px}
/* 26/10: meta de peso — peso atual em linha, campo grande e frase da diferença */
.mnow{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}
.mnow b{color:var(--ink);font-size:17px}
.mcard .num.big input{width:170px;font-size:38px;font-weight:700;color:var(--pink)}
.mdiff{margin:0 0 6px;font-size:14.5px;line-height:1.4;color:var(--ink)}.mdiff:empty{display:none}
.mdiff b{color:var(--pink)}.mdiff small{display:block;margin-top:6px;color:#9a5a12;font-size:12.5px}
.mcard+.tip{align-items:flex-start}.mcard+.tip .ic{margin-top:2px}
.note{background:#ecebf0;border-radius:10px;padding:14px 16px;font-size:12.5px;color:var(--muted);line-height:1.5}.note b{display:block;color:var(--ink);font-size:13.5px;margin-bottom:4px}
/* resumen IMC */
.bmi{background:#fff;border-radius:12px;padding:16px 14px 12px;margin-top:16px}
.bmi-top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:22px}.bmi-top b{color:var(--ink)}
.bmi-scale{position:relative;height:6px;border-radius:6px;background:linear-gradient(90deg,#4aa3df 0 18%,#4cc38a 18% 45%,#f2b34a 45% 70%,#e35d5d 70%)}
.bmi-pin{position:absolute;top:-30px;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:11px;font-weight:600;border-radius:6px;padding:3px 7px;white-space:nowrap}
.bmi-pin:after{content:'';position:absolute;left:50%;bottom:-4px;transform:translateX(-50%) rotate(45deg);width:7px;height:7px;background:var(--ink)}
.bmi-dot{position:absolute;top:-5px;width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--ink);transform:translateX(-50%)}
.bmi-lab{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:8px}
.prof{display:grid;grid-template-columns:1fr 120px;gap:8px;align-items:end;margin-top:14px}
.prof dl{margin:0;font-size:12px;color:var(--muted)}.prof dd{margin:2px 0 12px;color:var(--ink);font-weight:600;font-size:14px}
.prof img{width:120px;height:200px;object-fit:cover;object-position:center top;border-radius:10px}
/* 26/10: resumen físico — escala com cortes reais, cartões brancos */
.bmi.rich{margin-top:16px;padding:16px 16px 14px;border:1.5px solid #f1dce6;border-radius:16px;box-shadow:0 2px 10px rgba(180,35,100,.06)}
.bmi.rich .bmi-top{gap:10px;align-items:baseline;font-size:13px;margin-bottom:34px}.bmi.rich .bmi-top b{color:var(--pink);font-size:15px;white-space:nowrap}
.bmi.rich .bmi-scale{height:8px;background:linear-gradient(90deg,#4aa3df 0 14%,#4cc38a 14% 40%,#f2b34a 40% 60%,#e35d5d 60%)}
.bmi.rich .bmi-dot{top:-5px;width:18px;height:18px;border-color:var(--pink)}
.bmi.rich .bmi-pin{top:-32px;background:var(--pink)}.bmi.rich .bmi-pin:after{background:var(--pink)}
.bmi-num{position:relative;height:16px;margin-top:8px;font-size:11px;color:var(--muted)}
.bmi-num span{position:absolute;transform:translateX(-50%)}.bmi-num span:first-child{transform:none}.bmi-num span:last-child{transform:translateX(-100%)}
.bmi-cat{display:flex;margin-top:2px;font-size:10.5px;color:var(--ink);font-weight:600;text-align:center;line-height:1.2}
.bmi-note,.bmi-teen{margin:12px 0 0;font-size:12px;line-height:1.45;color:var(--muted)}.bmi-teen{color:var(--ink);font-size:13px;margin-top:4px}
.prof.rich{margin-top:12px;padding:14px 16px;background:#fff;border:1.5px solid #f1dce6;border-radius:16px;align-items:center;grid-template-columns:1fr 108px}
.prof.rich dd{color:var(--ink);font-size:15px}.prof.rich dd:last-child{margin-bottom:0}
.prof.rich figure{margin:0;text-align:center}.prof.rich img{width:108px;height:170px}
.prof.rich figcaption{font-size:10.5px;color:var(--muted);margin-top:4px}
/* 26/10: tela final (plan) — cartão do gráfico com início e meta */
h1.up.hl-em em{font-style:normal;color:var(--pink)}
.chart.rich{margin-top:14px;padding:14px 14px 10px;border:1.5px solid #f1dce6;border-radius:16px;box-shadow:0 2px 10px rgba(180,35,100,.06)}
.pl-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.pl-top small{display:block;font-size:11.5px;color:var(--muted);margin:0;text-align:left}.pl-top .r small{text-align:right}
.pl-top b{font-size:20px;color:var(--ink)}.pl-top b.pk{color:var(--pink)}.pl-top .r{text-align:right}
.pl-top .ic{width:22px;height:22px;color:var(--pink)}
/* 26/10: tela de e-mail — cartão com campo + botão (botão no fluxo, não fixo) */
.em-ic{display:flex;justify-content:center;margin-top:18px}.em-ic .ic{width:46px;height:46px;padding:11px;border-radius:50%;background:var(--pink-soft);color:var(--pink)}
.em-ic+.eyebrow{margin-top:10px}
h1.up em.pkt{font-style:normal;color:var(--pink)}
.mcard.em{text-align:left;padding:16px}
.mcard.em .mlab{display:block;font-size:14px;margin-bottom:8px}
.mcard.em .mail{margin-top:0;border:1.5px solid #e3d9e0;border-radius:12px}
.mcard.em .mail:focus-within{border-color:var(--pink);box-shadow:0 0 0 3px rgba(180,35,100,.13)}
.mcard.em .mail.ok{border-color:#2c8a5a}.mcard.em .mail.bad{border-color:#c0392b}
.mcard.em .err{text-align:left;margin:6px 2px}
.cta.in{max-width:none;border-radius:12px;margin:2px 0 10px;font-weight:700}.cta.in:disabled{background:#e9e3e8;color:#9a8f98;box-shadow:none}
.mcard.em .mhint{display:flex;align-items:center;justify-content:center;gap:5px}.mcard.em .mhint .ic{width:13px;height:13px}
.tip.ok{background:#e7f3ef;color:#2c4f45}.tip.ok .ic{color:#2c8a5a}
.em-legal{margin:12px 4px 0;font-size:11.5px;line-height:1.5;color:var(--muted);text-align:center}.em-legal a{color:var(--ink)}
.em-nomkt{margin:8px auto 24px;font-size:11.5px;color:var(--muted);text-transform:none}
/* 26/10: carregamento (depoimento real) e tela "listo" */
.rev.real{position:relative;padding:14px 16px 14px 48px;border:1.5px solid #f1dce6}.rev.real .ic{position:absolute;left:14px;top:15px;width:22px;height:22px;color:var(--pink)}
.rev.real p{margin:0 0 8px;font-size:14px;line-height:1.5;color:var(--ink)}.rev.real b{display:block;font-size:13px;color:var(--pink)}.rev.real small{font-size:11.5px;color:var(--muted)}
.chips.ld{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:16px 0 0}
.band.rd{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 0;margin:16px 0 0;padding:11px 8px;border-radius:12px;background:var(--pink);color:#fff;font-size:14px;font-weight:700;text-align:center}
.card.rd{margin-top:12px;padding:16px;border:1.5px solid #f1dce6;border-radius:16px;font-size:15px;line-height:1.55}.card.rd p{margin:0 0 12px}.card.rd .mirror-key{margin:14px 0 0}
.rd-sub{margin:10px 8px 0;text-align:center;font-size:16px;font-weight:800;line-height:1.3;color:var(--pink);text-transform:uppercase}
.rd-sub+.sub{margin-top:8px}
.rd-h{font-weight:700;font-size:15px;margin:0 0 10px!important;color:var(--ink)}
.wk{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.wk div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 4px;border-radius:12px;background:var(--pink-soft);text-align:center}
.wk b{font-size:22px;font-weight:800;color:var(--pink);line-height:1.1}.wk span{font-size:13px;font-weight:600;color:var(--ink)}.wk small{font-size:12px;color:var(--pink);font-weight:600}
.rd-note{margin:10px 0 0!important;font-size:12px;line-height:1.45;color:var(--muted);text-align:center}
.rd-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.rd-list li{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:500}
.rd-list .ic{width:32px;height:32px;padding:7px;border-radius:9px;background:var(--pink-soft);color:var(--pink);flex:none}
/* 26/10: oferta nova — barra fixa com preço, cartões brancos, preço grande, CTA forte */
.off-top.of div{display:flex;flex-direction:column}.off-top.of b{font-size:20px;font-weight:800;color:var(--pink);line-height:1.1}.off-top.of span{font-size:12px;color:var(--muted)}
.off-top.of+.eyebrow{margin-top:18px}
.of-chips{margin-top:14px!important}
.of-card{background:#fff;border:1.5px solid #f1dce6;border-radius:16px;padding:16px;margin-top:14px;box-shadow:0 2px 10px rgba(180,35,100,.06)}
.of-price{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.of-price div{display:flex;align-items:center;gap:8px}.of-price s{color:var(--muted);font-size:15px}
.of-tag{background:var(--pink);color:#fff;font-size:12px;font-weight:800;border-radius:999px;padding:3px 9px}
.of-price strong{font-size:40px;font-weight:800;color:var(--ink);line-height:1.1}.of-price small{font-size:13px;color:var(--muted)}
.cta.of-cta{max-width:none;margin-top:14px;border-radius:12px;font-size:16px;font-weight:800;padding:18px 12px}
.of-safe{display:flex;align-items:center;justify-content:center;gap:6px;margin:10px 0 0;font-size:12.5px;color:#2c8a5a;font-weight:600;text-align:center}.of-safe .ic{width:15px;height:15px;flex:none}
.of-data .said{margin:10px 0 0}.of-data .pl-top{margin:0}
.of-vs{margin-top:14px}.of-vs .vs-img img{height:220px}
.mini.c{text-align:center;margin-top:8px}
.of-copy{font-size:15px;line-height:1.55}.of-copy p{margin:0 0 12px}.of-copy p:last-child{margin:0}.of-copy .mirror-key{margin:4px 0 12px}
.of-copy .band{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 0;padding:10px 8px;border-radius:12px;background:var(--pink);color:#fff;font-size:13.5px;font-weight:700}
.of-inc{background:#fff;border:1.5px solid #f1dce6;border-radius:16px;padding:14px 16px;margin-top:10px;gap:12px}
.of-inc li{align-items:flex-start}.of-inc span{font-size:13.5px;color:var(--muted);line-height:1.4}.of-inc b{display:block;color:var(--ink);font-size:15px}
.of-offer{border:2px solid var(--pink)}.of-h{margin:0 0 8px;text-align:center;font-weight:800;font-size:17px;text-transform:uppercase;color:var(--pink)}
.of-li{display:flex;gap:10px;align-items:flex-start;margin:10px 0 0;font-size:14px;line-height:1.45;color:var(--ink)}.of-li .ic{width:20px;height:20px;flex:none;color:var(--pink);margin-top:1px}
.of-offer .secure{margin:12px 0 0}
.risk{background:#fdf2df;border-radius:12px;padding:14px 16px;font-size:12.5px;line-height:1.5;color:#5a4b33;margin-top:12px}.risk b{display:block;color:#3a2f1f;margin-bottom:4px}
/* gráfico de la meta */
.goal-line{text-align:center;font-size:14px;color:var(--muted);line-height:1.55;margin:4px 12px}.goal-line strong{display:block;color:var(--ink);font-size:17px;text-decoration:underline;margin:6px 0}
.chart{background:#fff;border-radius:14px;padding:14px 10px 8px;margin-top:16px;box-shadow:0 4px 14px rgba(40,30,60,.06)}
.chart svg{width:100%;height:auto;display:block}.chart small{display:block;text-align:center;color:var(--muted);font-size:11px;margin-top:6px}
/* correo */
.mail{display:flex;align-items:center;gap:10px;background:#fff;border-radius:10px;padding:0 14px;margin-top:22px;border:2px solid transparent}.mail:focus-within{border-color:var(--pink)}
.mail input{flex:1;border:0;outline:0;padding:16px 0;font-size:15px;background:transparent}
.trust{display:flex;align-items:center;gap:10px;background:#e7f3ef;border-radius:10px;padding:12px 14px;margin-top:14px;font-weight:700;font-size:13px;color:#2c4f45}
.privacy{display:flex;gap:10px;font-size:11.5px;color:var(--muted);line-height:1.5;margin:14px 2px}.privacy a{color:var(--ink)}
/* carga */
.load-box{display:flex;align-items:center;gap:14px;background:#fff;border-radius:12px;padding:14px 16px;margin-top:22px}
.ring{width:54px;height:54px;flex:none}.ring text{font-size:12px;font-weight:600;fill:var(--ink)}
.load-box span{color:var(--muted);font-size:14px}
.big{text-align:center;margin-top:30px}.big strong{display:block;font-size:26px;font-weight:700}.big span{color:var(--muted);font-size:15px}
.faces{position:relative;height:300px;margin-top:20px}
.faces img{position:absolute;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 4px 12px rgba(40,30,60,.12);animation:float 4s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px)}}
/* oferta */
.off-top{position:sticky;top:0;z-index:25;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;margin:0 -16px;box-shadow:0 2px 10px rgba(40,30,60,.06)}
.off-top p{margin:0;font-size:12px;color:var(--muted)}.off-top p b{color:var(--pink)}.off-top strong{display:block;font-size:22px;font-weight:800;color:var(--pink);letter-spacing:.02em}
.off-top .cta{width:auto;margin:0;padding:12px 18px;font-size:13px;box-shadow:none}
.vs{background:#ecebf3;border-radius:16px;overflow:hidden;margin-top:18px}
.vs-head{display:grid;grid-template-columns:1fr 1fr;text-align:center;font-weight:600;padding:12px 0;background:#e2e0ec}
.vs-img{display:grid;grid-template-columns:1fr 1fr;background:linear-gradient(115deg,#dcd9ea 0 50%,#e8e6f2 50%)}.vs-img img{width:100%;height:250px;object-fit:cover;object-position:center top}
.vs-data{display:grid;grid-template-columns:1fr 1fr;padding:14px 20px 18px;gap:18px}.vs-data div+div{border-left:1px solid #d5d2e0;padding-left:18px}
.vs-data small{display:block;color:var(--muted);font-size:13px}.vs-data b{display:block;font-size:15px;margin:2px 0 12px}.vs-data .goal b{color:var(--pink)}
.lv{display:flex;gap:4px}.lv i{flex:1;height:4px;border-radius:4px;background:#fff}.lv i.on{background:var(--ink)}.goal .lv i.on{background:var(--pink)}
.mini{color:var(--muted);font-size:12px;margin:12px 2px}
h2{font-size:22px;line-height:1.35;text-align:center;font-weight:700;margin:30px 6px 16px}h2 em{font-style:normal;color:var(--pink)}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 10px}.kv small{display:block;color:var(--muted);font-size:13px}.kv b{font-size:15px}
.promo{background:#fff;border-radius:12px;padding:14px 16px;margin-top:18px}
.promo p{margin:0 0 10px;font-weight:600;font-size:14px;color:#2c8a5a}
.promo-row{display:flex;gap:10px;align-items:center}.promo-code{flex:1;border:1px dashed #b9b6c2;border-radius:8px;padding:10px 12px;font-weight:600}
.promo-time{display:flex;gap:4px;align-items:baseline;font-weight:800;font-size:20px;color:var(--pink)}.promo-time small{font-size:10px;color:var(--muted);font-weight:500;display:block}
.plan{position:relative;display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:center;background:#fff;border:2px solid var(--pink);border-radius:12px;padding:18px 14px 14px;margin-top:16px}
.plan .badge{position:absolute;top:-11px;left:0;right:0;margin:auto;width:max-content;background:var(--pink);color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:3px 12px;letter-spacing:.04em}
.plan .radio{width:22px;height:22px;border-radius:50%;border:6px solid var(--pink)}
.plan b{display:block;font-size:15px}.plan s{color:var(--muted);font-size:12px;margin-right:6px}.plan .now{font-size:13px;font-weight:600}
.plan .day{text-align:right;background:var(--pink-soft);border-radius:8px;padding:6px 10px}.plan .day s{display:block;margin:0}.plan .day strong{font-size:18px;color:var(--pink)}.plan .day small{display:block;font-size:10px;color:var(--muted)}
.terms{font-size:11px;color:var(--muted);line-height:1.5;margin:14px 2px}
.secure{text-align:center;color:#2c8a5a;font-weight:600;font-size:13px;margin:12px 0}
.hl{background:#fff;border-radius:12px;padding:6px 16px;margin-top:10px}.hl li{list-style:none;padding:12px 0 12px 28px;border-bottom:1px solid var(--line);position:relative;font-size:14px}.hl li:last-child{border:0}.hl li:before{content:'✓';position:absolute;left:0;color:var(--pink);font-weight:800}
.rev{background:#fff;border-radius:12px;padding:14px 16px;margin-top:12px;font-size:13.5px;line-height:1.55;color:#4b4652}.rev b{display:block;color:var(--ink);margin-bottom:2px}.rev .st{color:#f5a623;letter-spacing:2px;font-size:13px}
.faq details{background:#fff;border-radius:12px;padding:14px 16px;margin-top:10px;font-size:14px}.faq summary{font-weight:600;cursor:pointer}.faq p{color:#4b4652;line-height:1.55;margin:10px 0 0}
.foot{text-align:center;color:var(--muted);font-size:11.5px;line-height:1.5;margin:22px 4px 0}
@media(min-width:700px){h1{font-size:24px}}
/* tamaño de los íconos fuera de las opciones */
.ic{width:20px;height:20px;flex:none;vertical-align:-4px}
.note b .ic,.kv .ic{width:17px;height:17px;margin-right:4px;color:var(--pink)}
.mail .ic{color:var(--muted)}.trust .ic{width:22px;height:22px;color:#2c8a5a}.privacy .ic{width:16px;height:16px;margin-top:2px}.secure .ic{width:16px;height:16px;color:#2c8a5a}
/* página de inicio */
body.home-mode{background:#fff}body.home-mode .top,body.home-mode .bar{display:none!important}body.home-mode #app{max-width:none;padding:0}
.home{min-height:100vh;display:flex;flex-direction:column;background:#fff}
.home-media{position:relative;height:62vh;min-height:380px;overflow:hidden;background:#f3e6ea}
.home-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.home-media:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,15,30,.38) 0,rgba(40,15,30,0) 26%);pointer-events:none}
.home-top{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;gap:10px;padding:14px 16px}
.home-logo{font-weight:700;color:#fff;font-size:17px;margin-right:auto;text-shadow:0 1px 8px rgba(0,0,0,.25)}.home-logo span{font-style:italic;font-weight:800;font-size:21px}
.home-login,.home-menu-btn{border:1.5px solid rgba(255,255,255,.75);background:rgba(255,255,255,.14);backdrop-filter:blur(6px);color:#fff;border-radius:999px;height:44px;display:grid;place-items:center;text-decoration:none;font-weight:600;font-size:14px}
.home-login{padding:0 18px}.home-menu-btn{width:44px;font-size:19px;padding:0}
.home-menu{position:absolute;top:66px;right:16px;z-index:3;background:#fff;border-radius:16px;box-shadow:0 14px 40px rgba(60,20,40,.22);padding:8px;display:flex;flex-direction:column;min-width:230px}.home-menu[hidden]{display:none}
.home-menu a,.home-menu button{border:0;background:none;text-align:left;padding:14px 16px;border-radius:10px;color:var(--ink);font-weight:600;font-size:15px;text-decoration:none}.home-menu a:hover,.home-menu button:hover{background:var(--pink-soft)}
.home-panel{flex:1;padding:28px 24px 36px;max-width:560px}
.home-panel h1{font-size:27px;line-height:1.3;text-align:left;margin:0 0 12px;font-weight:700}
.home-panel>p{color:var(--muted);font-size:15px;line-height:1.55;margin:0 0 24px}
.home-cta{border:0;border-radius:999px;background:var(--pink);color:#fff;font-weight:600;font-size:16px;padding:16px 30px;display:inline-flex;align-items:center;gap:18px;box-shadow:0 10px 24px rgba(180,35,100,.28)}.home-cta span{font-size:21px;line-height:1}.home-cta:hover{background:#951c53}
.home-points{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:9px;font-weight:500;font-size:14px}.home-points li:before{content:'✓';color:var(--pink);font-weight:800;margin-right:10px}
.home-panel>.home-legal{margin:24px 0 0;font-size:12px}.home-legal a{color:var(--muted)}
@media(min-width:900px){.home{flex-direction:row;height:100vh}.home-media{flex:1.15;height:auto}.home-panel{flex:1;display:flex;flex-direction:column;justify-content:center;padding:60px 64px;max-width:none}.home-panel h1{font-size:42px}.home-cta{align-self:flex-start}}
.home-logo,.home-login{white-space:nowrap}.home-logo{font-size:15px}.home-logo span{font-size:19px}.home-login{font-size:13px;padding:0 14px;height:40px}.home-menu-btn{width:40px;height:40px;font-size:17px}

/* 21/10: 1ª tela com a promessa do anúncio */
.age-head h1.hook{font-size:27px;line-height:1.15;color:var(--pink);text-transform:none;letter-spacing:0;margin:0 6px}.age-head .hook-sub{color:var(--ink);text-transform:none;letter-spacing:0;font-size:16px;font-weight:500;margin:8px 10px 0}.age-head .hook-social{color:var(--muted);text-transform:none;letter-spacing:0;font-size:13px;margin:10px 0 0}
/* 21/10: voz da Lavinia (modelo Brooke Burke) */
.age-head .hola{display:flex;align-items:center;gap:10px;justify-content:center;text-transform:none;letter-spacing:0;color:var(--ink);font-size:14px;margin:12px 8px 0;text-align:left}.age-head .hola img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 8px rgba(40,30,60,.15);flex:none}
.age-head .chips{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:10px 0 0;text-transform:none;letter-spacing:0}.age-head .chips span{background:var(--pink-soft);color:var(--pink);border-radius:99px;padding:4px 10px;font-size:12.5px;font-weight:600}
h1.voice{font-size:22px;font-weight:700}
/* 26/10: tela "needInfo" — chamada em 2–3 linhas com "tu cuerpo" em magenta, foto mais baixa no celular p/ o botão subir */
h1.voice.big{font-size:23px;font-weight:800;line-height:1.2;text-transform:uppercase;letter-spacing:.005em;margin:18px 6px 0;text-wrap:balance}
h1.voice.big em{font-style:normal;color:var(--pink)}
h1.voice.big+.info-img{aspect-ratio:1.75/1;object-position:center 40%;margin:14px 0 12px}
h1.voice.big~.card{font-size:14.5px;line-height:1.55}
.mirror-key{margin:14px 0 4px;font-weight:800;font-size:15.5px;line-height:1.3;color:var(--pink);text-transform:uppercase}
.mirror-end{margin:0}
/* 26/10: tela lifeInfo — cartão no centro visual (sem vão até o botão fixo) e parágrafos com respiro */
.info-center{min-height:calc(100svh - 200px);display:flex;flex-direction:column;justify-content:center;padding-bottom:12px}
.info-center h1.voice.big{margin-top:6px}
.info-center .card{margin-top:16px}
.card .lt{font-size:15px;line-height:1.55}
.card .lt p{margin:0 0 12px}
.card .lt .mirror-key{margin:16px 0 12px}
/* 26/10: tela planInfo — faixa magenta com os 4 benefícios */
.card .lt .band{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 0;margin:4px 0 14px;padding:10px 8px;border-radius:12px;background:var(--pink);color:#fff;font-size:13.5px;font-weight:700;line-height:1.3;text-align:center}
.band span{padding:0 9px}.band span+span{border-left:1.5px solid rgba(255,255,255,.55)}
.card .lt .pk{color:var(--pink);text-transform:uppercase;font-weight:800}
/* 26/10: resumo fantInfo — chips de benefícios */
.card .lt .said{margin:0 0 14px}
.card .lt .chips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:0 0 14px}
.chips span{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;background:var(--pink-soft);color:var(--pink);font-size:12.5px;font-weight:700}
.chips .ic{width:15px;height:15px}
@media(min-width:700px){h1.voice.big{font-size:30px}h1.voice.big+.info-img{aspect-ratio:1.4/1}}
.sign{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.sign img{width:40px;height:40px;border-radius:50%;object-fit:cover}.sign span{font-size:12px;color:var(--muted);line-height:1.3}.sign b{display:block;color:var(--pink);font-size:14px}
.said{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0 0 14px;padding:12px;background:var(--bg);border-radius:10px;font-size:13px}.said dt{color:var(--muted)}.said dd{margin:0;color:var(--ink);font-weight:600;text-align:right}
.load-box span b{display:block;color:var(--ink);font-weight:600}.load-box span small{color:var(--muted);font-size:13px}
.lq{background:#fff;border:2px solid var(--pink);border-radius:12px;padding:14px 16px;margin-top:14px;text-align:center}.lq p{margin:0 0 12px;font-weight:600;font-size:15px;line-height:1.4}.lq div{display:flex;gap:10px}.lq button{flex:1;border:0;border-radius:10px;padding:12px;font:inherit;font-weight:700;background:var(--pink);color:#fff;cursor:pointer}.lq button+button{background:#ecebf0;color:var(--ink)}
.nosub{background:#e9f8ef;border-radius:12px;padding:12px 14px;margin-top:12px;font-size:13.5px;color:#2d5a3f;line-height:1.45}.nosub b{display:block;color:#1d4a30;font-size:15px}
.hl.made li b{color:var(--pink)}

/* 26/10: 1ª tela nova (referência do dono, 1107 px) — v2: fidelidade de tamanhos/espaços; mobile primeiro, depois 560 px e 900 px */
body.age-mode{background:#fff}
body.age-mode #app{max-width:1110px;padding:0 18px 44px}
.ag-hero{display:grid;grid-template-columns:1fr 44%;grid-template-areas:"copy copy" "sub fig" "hola hola";column-gap:10px;align-items:start;padding-top:18px}
.ag-copy{grid-area:copy;position:relative;z-index:2}
.ag-brand{color:var(--pink);font-weight:700;font-size:15px;margin:0 0 8px}
.ag-title{font-family:Anton,Impact,"Arial Narrow",sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(27px,8.6vw,50px);line-height:1.06;color:#1c1822;margin:0;letter-spacing:0;text-align:left}
.ag-title .n21{color:var(--pink)}
.ag-title em{font-style:normal;color:var(--pink);text-decoration:underline;text-decoration-thickness:.065em;text-underline-offset:.09em}
.ag-title mark{display:inline-block;white-space:nowrap;background:var(--pink-2);color:#fff;padding:.03em .16em .05em;margin-top:.06em;border-radius:5px 16px 7px 14px/14px 6px 16px 5px;transform:rotate(-1.2deg);box-shadow:-.08em .05em 0 rgba(214,58,130,.35)}
.ag-fig{grid-area:fig;margin:16px 0 0;position:relative;align-self:center}
.ag-fig::before{content:"";position:absolute;inset:0 -12% -2% -12%;background:radial-gradient(56% 50% at 52% 46%,#f6bdd5 0,#fbdbe8 52%,rgba(253,228,236,0) 74%);z-index:0}
.ag-fig img{position:relative;z-index:1;width:100%;height:auto;display:block}
.ag-note{position:absolute;z-index:2;font-family:Caveat,"Segoe Print",cursive;font-weight:700;color:var(--pink);font-size:15px;line-height:.9;text-align:center;transform:rotate(-8deg);white-space:nowrap}
.ag-note small{font-size:.78em}
.ag-note::after{content:"";position:absolute;width:34px;height:26px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 30'%3E%3Cpath d='M38 3C26 6 14 13 6 25' fill='none' stroke='%23b42364' stroke-width='2.6' stroke-linecap='round'/%3E%3Cpath d='M4 15l2 11 10-3' fill='none' stroke='%23b42364' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.ag-note.n1{top:0;right:-2%}.ag-note.n1::after{left:-30px;top:84%}
.ag-note.n2{top:30%;right:-6%}.ag-note.n2::after{left:-36px;top:70%}
.ag-note.n3{top:66%;right:-2%}.ag-note.n3::after{left:-34px;top:-20px;transform:scaleY(-1)}
.ag-sub{grid-area:sub;font-size:15.5px;line-height:1.5;color:#36313c;margin:16px 0 0;align-self:center}
.ag-sub b{color:#1c1822}
.ag-hola{grid-area:hola;display:flex;align-items:center;gap:14px;background:#fde6ef;border-radius:52px 20px 20px 52px;padding:10px 16px 10px 10px;margin-top:22px}
.ag-hola img{width:66px;height:66px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 0 0 3px #f6bfd5;flex:none}
.ag-hola p{margin:0;font-size:15px;line-height:1.42;color:#36313c}
.ag-hola p b:first-child{color:var(--pink);font-size:1.2em}
.ag-ben{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ag-ben li{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;background:#fde6ef;border-radius:18px 10px 18px 10px;padding:14px 4px;font-weight:700;color:var(--pink);font-size:13px;line-height:1.22}
.ag-ben svg{width:40px;height:40px;flex:none;fill:none;stroke:var(--pink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ag-ben svg .f{fill:var(--pink);stroke:none}
.ag-social{display:flex;gap:12px;align-items:center;color:#5e5966;font-size:14.5px;line-height:1.45;margin:22px 2px 0}
.ag-social svg{width:42px;height:32px;flex:none;fill:#8a8593}
.ag-social b{color:#36313c}
.ag-h2{text-align:center;margin:32px 0 0;font-family:Anton,Impact,"Arial Narrow",sans-serif;font-weight:400;text-transform:uppercase;color:var(--pink);font-size:clamp(25px,7.2vw,50px);line-height:1.12;text-wrap:balance}
.ag-h2 span{background:linear-gradient(transparent 56%,#fcd8e6 56%);padding:0 .2em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ag-min{text-align:center;letter-spacing:.34em;color:#5e5966;font-size:13px;font-weight:600;text-transform:uppercase;margin:8px 0 0}
.ag-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:20px}
.ag-card{border:0;padding:0;background:#fdf0f5;border-radius:16px;overflow:hidden;box-shadow:0 5px 18px rgba(60,30,60,.11);display:grid;grid-template-columns:45% 1fr;grid-template-rows:1fr auto;grid-template-areas:"img info" "btn btn";text-align:left;cursor:pointer;font-family:inherit;color:inherit;transition:transform .12s ease,box-shadow .2s ease}
.ag-card img{grid-area:img;width:100%;height:100%;min-height:172px;object-fit:cover;object-position:center 14%;display:block;background:#e9e7ec}
.ag-info{grid-area:info;padding:14px 14px 12px 16px;display:flex;flex-direction:column;justify-content:center}
.ag-info small{font-weight:700;font-size:15px;color:#1c1822}
.ag-info strong{font-size:30px;font-weight:800;color:var(--pink);line-height:1.1;margin-top:2px}
.ag-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.ag-list i{font-style:normal;font-size:14.5px;line-height:1.3;color:#36313c;padding-left:22px;position:relative}
.ag-list i::before{content:"";position:absolute;left:2px;top:.26em;width:10px;height:6px;border-left:2.4px solid var(--pink);border-bottom:2.4px solid var(--pink);transform:rotate(-45deg)}
.ag-btn{grid-area:btn;background:#b4135f;color:#fff;font-weight:800;text-transform:uppercase;font-size:18px;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;gap:14px;padding:13px 10px}
.ag-btn b{width:30px;height:30px;border-radius:50%;background:#fff;color:#b4135f;display:grid;place-items:center;font-size:20px;line-height:1;padding-bottom:2px;box-sizing:border-box}
.ag-card:active{transform:scale(.985)}
.ag-card:focus-visible{outline:3px solid var(--pink-2);outline-offset:3px}
@media(hover:hover){.ag-card:hover{box-shadow:0 10px 26px rgba(180,35,100,.26)}}
body.age-mode .legal{font-size:13.5px;margin:22px 6px 0}
@media(max-width:559px){.ag-note{display:none}}
@media(min-width:560px) and (max-width:899px){
  .ag-grid{grid-template-columns:1fr 1fr}
  .ag-note{font-size:20px}
}
@media(min-width:900px){
  body.age-mode #app{padding:0 54px 56px}
  .ag-hero{grid-template-columns:1fr 44%;grid-template-rows:auto auto 1fr;grid-template-areas:none;column-gap:12px;padding-top:28px}
  .ag-copy{grid-column:1/-1;grid-row:1;max-width:700px}
  .ag-fig{grid-column:2;grid-row:1/span 3}
  .ag-sub{grid-column:1;grid-row:2}
  .ag-hola{grid-column:1;grid-row:3;align-self:start}
  .ag-brand{font-size:23px;margin-bottom:12px}
  .ag-title{font-size:68px;line-height:1.02}
  .ag-fig{margin:-10px -54px 0 6px;align-self:start;z-index:1}
  .ag-fig::before{inset:-2% -4% -4% -10%}
  .ag-fig img{width:100%;height:auto;max-height:560px;object-fit:contain;margin:0 auto}
  .ag-note{font-size:35px}
  .ag-note::after{width:46px;height:34px}
  .ag-note.n1{top:2%;right:5%}.ag-note.n1::after{left:-40px;top:90%}
  .ag-note.n2{top:27%;right:1%}.ag-note.n2::after{left:-48px;top:72%}
  .ag-note.n3{top:66%;right:4%}.ag-note.n3::after{left:-46px;top:-26px}
  .ag-sub{font-size:22px;line-height:1.38;max-width:560px;margin-top:20px;align-self:start}
  .ag-hola{max-width:610px;margin-top:26px;padding:12px 30px 12px 12px;gap:22px;border-radius:70px 26px 26px 70px}
  .ag-hola img{width:112px;height:112px;box-shadow:0 0 0 4px #f6bfd5}
  .ag-hola p{font-size:21px;line-height:1.38}
  .ag-ben{gap:20px;margin-top:22px}
  .ag-ben li{flex-direction:row;text-align:left;justify-content:flex-start;gap:20px;font-size:21px;padding:18px 26px;border-radius:28px 14px 28px 14px}
  .ag-ben svg{width:64px;height:64px}
  .ag-social{justify-content:center;font-size:20px;margin-top:30px}
  .ag-social svg{width:64px;height:46px}
  .ag-h2{margin-top:36px;font-size:50px}
  .ag-min{font-size:19px;margin-top:10px}
  .ag-grid{grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}
  .ag-card{grid-template-columns:50% 1fr;border-radius:18px}
  .ag-card img{min-height:205px}
  .ag-info{padding:18px 12px 16px 18px}
  .ag-info small{font-size:21px}
  .ag-info strong{font-size:36px}
  .ag-list{gap:8px;margin-top:12px}
  .ag-list i{font-size:17px;padding-left:26px}
  .ag-list i::before{width:13px;height:7px;border-width:0 0 3px 3px}
  .ag-btn{font-size:23px;padding:14px}
  .ag-btn b{width:38px;height:38px;font-size:24px}
  body.age-mode .legal{font-size:18px;margin-top:30px}
}