/* Gerado por scripts/extrair.mjs a partir do bundle do Claude Design. Não editar à mão: ajustes vão em src/extra.css. */
html,body{height:100%;margin:0}
html{scroll-behavior:smooth;}
body{margin:0;background:#060B16;color:#E8EDF5;font-family:'Geist',system-ui,sans-serif;-webkit-font-smoothing:antialiased;}
a{color:#E8EDF5;text-decoration:none;}a:hover{color:#fff;}
button{font-family:inherit;}
*:focus-visible{outline:2px solid #1B9DE6;outline-offset:3px;}
::selection{background:#1B9DE6;color:#fff;}
/* estilos inline do design (classe dupla = vence regras de elemento, como o inline fazia) */
.c0.c0{padding: 0px 40px 24px 0px; font-size: 15px; line-height: 1.7; color: rgb(169, 180, 198)}
.c1.c1{padding: 0px 20px 18px; display: flex; flex-direction: column; gap: 10px}
.c2.c2{margin: 0px; padding-left: 20px; font-size: 14px; line-height: 1.75; color: rgb(195, 204, 218)}
.c3.c3{font-size: 13px; line-height: 1.55; color: rgb(125, 138, 160)}
.c4.c4{min-height: 100vh; overflow-x: hidden}
.c5.c5{position: sticky; top: 0px; z-index: 30; background: rgba(6, 11, 22, 0.78); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid rgba(255, 255, 255, 0.07)}
.c6.c6{max-width: 1280px; margin: 0px auto; padding: 0px 28px; height: 68px; display: flex; align-items: center; gap: 28px}
.c7.c7{display: flex; align-items: center; gap: 12px; flex-shrink: 0}
.c8.c8{background: rgb(255, 255, 255); border-radius: 8px; padding: 4px 7px; display: flex}
.c9.c9{height: 30px; width: auto; display: block}
.ca.ca{font-family: "Geist Mono"; font-size: 12px; color: rgb(125, 138, 160); letter-spacing: 0.06em}
.cb.cb{flex: 1 1 0%; display: flex; gap: 2px; justify-content: center; flex-wrap: wrap}
.cc.cc{padding: 8px 12px; font-size: 14px; color: rgb(169, 180, 198); border-radius: 6px; transition: color 0.2s}
.cd.cd{height: 40px; padding: 0px 16px; border-radius: 8px; background: rgb(255, 255, 255); color: rgb(6, 11, 22); display: flex; align-items: center; font-weight: 600; font-size: 14px; flex-shrink: 0; transition: background 0.2s}
.ce.ce{position: relative; border-bottom: 1px solid rgba(255, 255, 255, 0.07); overflow: hidden}
.cf.cf{position: absolute; inset: 0px; background-image: linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px); background-size: 80px 80px; -webkit-mask-image: radial-gradient(70% 60% at 70% 40%, rgb(0, 0, 0), transparent); mask-image: radial-gradient(70% 60% at 70% 40%, rgb(0, 0, 0), transparent)}
.cg.cg{position: absolute; width: 900px; height: 900px; right: -300px; top: -380px; background: radial-gradient(circle, rgba(27, 157, 230, 0.16), transparent 60%)}
.ch.ch{position: relative; max-width: 1280px; margin: 0px auto; padding: clamp(56px, 8vw, 112px) 28px clamp(56px, 7vw, 96px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 500px), 1fr)); gap: 56px; align-items: center}
.ci.ci{display: flex; flex-direction: column; gap: 28px}
.cj.cj{font-family: "Geist Mono"; font-size: 12px; letter-spacing: 0.12em; color: rgb(125, 138, 160); display: flex; align-items: center; gap: 10px}
.ck.ck{width: 6px; height: 6px; background: rgb(27, 157, 230); border-radius: 999px}
.cl.cl{margin: 0px; font-weight: 600; font-size: clamp(44px, 6.4vw, 88px); line-height: 0.98; letter-spacing: -0.045em; color: rgb(255, 255, 255); text-wrap: balance}
.cm.cm{margin: 0px; font-size: clamp(17px, 1.5vw, 19px); line-height: 1.6; color: rgb(169, 180, 198); max-width: 540px; text-wrap: pretty}
.cn.cn{display: flex; gap: 10px; flex-wrap: wrap}
.co.co{height: 54px; padding: 0px 20px 0px 16px; border-radius: 10px; background: rgb(255, 255, 255); color: rgb(6, 11, 22); display: flex; align-items: center; gap: 11px; transition: background 0.2s}
.cp.cp{display: flex; flex-direction: column; line-height: 1.1}
.cq.cq{font-size: 11px; color: rgb(74, 85, 104)}
.cr.cr{font-size: 17px; font-weight: 600; letter-spacing: -0.2px}
.cs.cs{height: 54px; padding: 0px 20px 0px 16px; border-radius: 10px; background: transparent; border: 1px solid rgba(255, 255, 255, 0.22); color: rgb(255, 255, 255); display: flex; align-items: center; gap: 11px; transition: border-color 0.2s, background 0.2s}
.ct.ct{font-size: 11px; color: rgb(125, 138, 160)}
.cu.cu{align-self: flex-start; font-size: 14px; color: rgb(125, 138, 160); display: flex; align-items: center; gap: 8px; border-bottom: 1px solid rgba(125, 138, 160, 0.35); padding-bottom: 2px; transition: color 0.2s}
.cv.cv{position: relative; display: flex; justify-content: center}
.cw.cw{position: relative; width: min(340px, 100%); height: 700px; border-radius: 52px; padding: 11px; box-sizing: border-box; background: linear-gradient(160deg, rgb(42, 51, 70), rgb(17, 22, 31) 40%, rgb(28, 35, 49)); box-shadow: rgba(255, 255, 255, 0.08) 0px 0px 0px 1px, rgba(0, 0, 0, 0.8) 0px 50px 120px -20px, rgba(27, 157, 230, 0.12) 0px 0px 120px}
.cx.cx{width: 100%; height: 100%; border-radius: 42px; overflow: hidden; background: rgb(243, 246, 250); color: rgb(14, 26, 43); font-family: "Hanken Grotesk", sans-serif; display: flex; flex-direction: column}
.cy.cy{height: 48px; flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; padding: 0px 26px; font-size: 14px; font-weight: 700; position: relative}
.cz.cz{position: absolute; left: 50%; top: 10px; transform: translateX(-50%); width: 96px; height: 28px; border-radius: 999px; background: rgb(0, 0, 0)}
.c10.c10{font-size: 12px}
.c11.c11{flex: 1 1 0%; padding: 4px 16px 0px; display: flex; flex-direction: column; gap: 12px; overflow: hidden}
.c12.c12{display: flex; align-items: center; gap: 8px}
.c13.c13{flex: 1 1 0%}
.c14.c14{font-size: 13px; color: rgb(90, 107, 126)}
.c15.c15{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: 21px; letter-spacing: -0.6px}
.c16.c16{width: 40px; height: 40px; border-radius: 999px; background: rgb(255, 255, 255); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; display: flex; align-items: center; justify-content: center}
.c17.c17{position: relative; height: 196px; flex-shrink: 0; border-radius: 24px; overflow: hidden; background: linear-gradient(135deg, rgb(6, 32, 90), rgb(10, 42, 134) 55%, rgb(27, 157, 230)); color: rgb(255, 255, 255)}
.c18.c18{position: absolute; inset: 0px; width: 100%; height: 100%}
.c19.c19{position: relative; padding: 15px 16px; display: flex; flex-direction: column; gap: 4px}
.c1a.c1a{display: flex; justify-content: space-between; align-items: center}
.c1b.c1b{font-weight: 700; font-size: 14px}
.c1c.c1c{height: 24px; padding: 0px 9px; border-radius: 999px; background: rgba(255, 255, 255, 0.16); font-size: 11px; font-weight: 700; display: flex; align-items: center}
.c1d.c1d{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: 58px; letter-spacing: -3px; line-height: 1; font-variant-numeric: tabular-nums; margin-top: 4px}
.c1e.c1e{font-size: 14px; font-weight: 700}
.c1f.c1f{display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px}
.c1g.c1g{height: 38px; border-radius: 999px; background: rgb(10, 42, 134); color: rgb(255, 255, 255); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px}
.c1h.c1h{height: 38px; border-radius: 999px; background: rgb(255, 255, 255); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px}
.c1i.c1i{display: grid; grid-template-columns: 1fr 1fr; gap: 10px}
.c1j.c1j{border: 0px; text-align: left; cursor: pointer; border-radius: 20px; padding: 12px; height: 96px; display: flex; flex-direction: column; justify-content: space-between; background: rgb(10, 42, 134); color: rgb(255, 255, 255); box-shadow: rgba(10, 42, 134, 0.25) 0px 12px 30px; font-family: "Hanken Grotesk", sans-serif; transition: background 0.24s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.12s}
.c1k.c1k{display: flex; justify-content: space-between; width: 100%; align-items: center}
.c1l.c1l{width: 40px; height: 24px; border-radius: 999px; background: rgb(27, 157, 230); position: relative; transition: background 0.24s}
.c1m.c1m{position: absolute; top: 3px; left: 19px; width: 18px; height: 18px; border-radius: 999px; background: rgb(255, 255, 255); transition: left 0.24s cubic-bezier(0.2, 0.8, 0.2, 1)}
.c1n.c1n{display: block; font-size: 14px; font-weight: 700}
.c1o.c1o{display: block; font-size: 11px; color: rgb(188, 211, 245)}
.c1p.c1p{border: 0px; text-align: left; cursor: pointer; border-radius: 20px; padding: 12px; height: 96px; display: flex; flex-direction: column; justify-content: space-between; background: rgb(255, 255, 255); color: rgb(14, 26, 43); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; font-family: "Hanken Grotesk", sans-serif; transition: background 0.24s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.12s}
.c1q.c1q{width: 40px; height: 24px; border-radius: 999px; background: rgb(213, 222, 234); position: relative; transition: background 0.24s}
.c1r.c1r{position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 999px; background: rgb(255, 255, 255); transition: left 0.24s cubic-bezier(0.2, 0.8, 0.2, 1)}
.c1s.c1s{display: block; font-size: 11px; color: rgb(90, 107, 126)}
.c1t.c1t{height: 66px; flex-shrink: 0; background: rgb(255, 255, 255); border-top: 1px solid rgb(225, 232, 242); display: grid; grid-template-columns: repeat(5, 1fr); padding-top: 8px; font-size: 10px; font-weight: 600; color: rgb(98, 112, 130); text-align: center}
.c1u.c1u{display: flex; flex-direction: column; align-items: center; gap: 3px; color: rgb(10, 42, 134); font-weight: 700}
.c1v.c1v{display: flex; flex-direction: column; align-items: center; gap: 3px}
.c1w.c1w{position: relative; max-width: 1280px; margin: 0px auto; padding: 0px 28px}
.c1x.c1x{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); border-top: 1px solid rgba(255, 255, 255, 0.07)}
.c1y.c1y{padding: 28px 24px 34px 0px; display: flex; flex-direction: column; gap: 6px}
.c1z.c1z{font-size: clamp(26px, 2.6vw, 34px); font-weight: 500; letter-spacing: -0.04em; color: rgb(255, 255, 255)}
.c20.c20{font-size: 14px; color: rgb(125, 138, 160); line-height: 1.45}
.c21.c21{max-width: 1280px; margin: 0px auto; padding: clamp(72px, 9vw, 128px) 28px 40px}
.c22.c22{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 24px 56px; align-items: end; margin-bottom: 64px}
.c23.c23{margin: 0px; font-weight: 600; font-size: clamp(34px, 4.4vw, 60px); letter-spacing: -0.045em; line-height: 1.02; color: rgb(255, 255, 255); text-wrap: balance}
.c24.c24{margin: 0px; font-size: 17px; line-height: 1.6; color: rgb(169, 180, 198); max-width: 480px}
.c25.c25{display: flex; flex-direction: column; border-top: 1px solid rgba(255, 255, 255, 0.08)}
.c26.c26{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 40px 64px; padding: 56px 0px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); align-items: center}
.c27.c27{display: flex; flex-direction: column; gap: 18px}
.c28.c28{font-family: "Geist Mono"; font-size: 12px; letter-spacing: 0.12em; color: rgb(27, 157, 230)}
.c29.c29{margin: 0px; font-weight: 600; font-size: clamp(26px, 2.8vw, 38px); letter-spacing: -0.035em; line-height: 1.1; color: rgb(255, 255, 255)}
.c2a.c2a{margin: 0px; font-size: 16px; line-height: 1.65; color: rgb(169, 180, 198)}
.c2b.c2b{margin: 0px; padding: 0px; list-style: none; display: flex; flex-direction: column}
.c2c.c2c{display: flex; gap: 14px; padding: 12px 0px; border-top: 1px solid rgba(255, 255, 255, 0.06); font-size: 15px; color: rgb(210, 218, 230)}
.c2d.c2d{font-family: "Geist Mono"; font-size: 12px; color: rgb(115, 126, 145); padding-top: 2px}
.c2e.c2e{border-radius: 28px; background: rgb(243, 246, 250); color: rgb(14, 26, 43); font-family: "Hanken Grotesk", sans-serif; padding: clamp(16px, 2.2vw, 24px); display: flex; flex-direction: column; gap: 14px; box-shadow: rgba(255, 255, 255, 0.06) 0px 0px 0px 1px, rgba(0, 0, 0, 0.6) 0px 30px 80px -30px}
.c2f.c2f{display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap}
.c2g.c2g{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: 22px; letter-spacing: -0.6px}
.c2h.c2h{font-family: "Geist Mono"; font-size: 10px; letter-spacing: 0.08em; color: rgb(98, 112, 130)}
.c2i.c2i{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px}
.c2j.c2j{border: 0px; text-align: left; cursor: pointer; border-radius: 20px; padding: 16px; min-height: 132px; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; background: rgb(10, 42, 134); color: rgb(255, 255, 255); box-shadow: rgba(10, 42, 134, 0.25) 0px 12px 30px; font-family: "Hanken Grotesk", sans-serif; transition: background 0.24s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.12s, box-shadow 0.2s}
.c2k.c2k{width: 50px; height: 30px; border-radius: 999px; background: rgb(27, 157, 230); position: relative; transition: background 0.24s}
.c2l.c2l{position: absolute; top: 3px; left: 23px; width: 24px; height: 24px; border-radius: 999px; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px; transition: left 0.24s cubic-bezier(0.2, 0.8, 0.2, 1)}
.c2m.c2m{display: flex; flex-direction: column; gap: 2px}
.c2n.c2n{font-size: 16px}
.c2o.c2o{font-size: 13px; color: rgb(188, 211, 245)}
.c2p.c2p{border: 0px; text-align: left; cursor: pointer; border-radius: 20px; padding: 16px; min-height: 132px; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; background: rgb(255, 255, 255); color: rgb(14, 26, 43); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; font-family: "Hanken Grotesk", sans-serif; transition: background 0.24s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.12s, box-shadow 0.2s}
.c2q.c2q{width: 50px; height: 30px; border-radius: 999px; background: rgb(213, 222, 234); position: relative; transition: background 0.24s}
.c2r.c2r{position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 999px; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px; transition: left 0.24s cubic-bezier(0.2, 0.8, 0.2, 1)}
.c2s.c2s{border-radius: 24px; background: rgb(255, 255, 255); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; padding: 18px; display: flex; flex-direction: column; align-items: center; gap: 14px}
.c2t.c2t{position: relative; width: min(260px, 100%); aspect-ratio: 280 / 250}
.c2u.c2u{position: absolute; left: 0px; right: 0px; top: 28%; text-align: center}
.c2v.c2v{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: clamp(44px, 5vw, 58px); letter-spacing: -3px; line-height: 1; font-variant-numeric: tabular-nums}
.c2w.c2w{display: inline-block; margin-top: 6px; background: rgb(230, 243, 251); color: rgb(10, 42, 134); border-radius: 999px; padding: 5px 12px; font-size: 13px; font-weight: 700}
.c2x.c2x{display: flex; align-items: center; gap: 20px}
.c2y.c2y{width: 56px; height: 56px; border-radius: 999px; border: 1.5px solid rgb(225, 232, 242); background: rgb(255, 255, 255); font-size: 26px; cursor: pointer; color: rgb(14, 26, 43); transition: transform 0.12s}
.c2z.c2z{text-align: center; min-width: 110px}
.c30.c30{font-size: 12px; color: rgb(90, 107, 126)}
.c31.c31{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: 24px; font-variant-numeric: tabular-nums}
.c32.c32{width: 56px; height: 56px; border-radius: 999px; border: 0px; background: rgb(10, 42, 134); color: rgb(255, 255, 255); font-size: 26px; cursor: pointer; transition: transform 0.12s}
.c33.c33{border-radius: 20px; background: rgb(255, 255, 255); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; padding: 14px 16px; display: flex; justify-content: space-between; gap: 12px; font-size: 14px; flex-wrap: wrap}
.c34.c34{color: rgb(90, 107, 126)}
.c35.c35{font-variant-numeric: tabular-nums}
.c36.c36{border-radius: 20px; background: rgb(255, 255, 255); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 12px}
.c37.c37{display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap}
.c38.c38{font-size: 15px}
.c39.c39{font-family: "Bricolage Grotesque", sans-serif; font-size: 26px; letter-spacing: -0.6px; font-variant-numeric: tabular-nums}
.c3a.c3a{position: relative; height: 9px; border-radius: 999px; background: rgb(225, 232, 242)}
.c3b.c3b{position: absolute; left: 40%; width: 20%; top: 0px; bottom: 0px; border-radius: 999px; background: rgb(18, 160, 106); opacity: 0.3}
.c3c.c3c{position: absolute; left: 50%; top: -5px; width: 19px; height: 19px; margin-left: -9px; border-radius: 999px; background: rgb(255, 255, 255); border: 4px solid rgb(18, 160, 106); box-sizing: border-box}
.c3d.c3d{position: absolute; left: 25%; width: 50%; top: 0px; bottom: 0px; border-radius: 999px; background: rgb(18, 160, 106); opacity: 0.3}
.c3e.c3e{position: absolute; left: 45%; top: -5px; width: 19px; height: 19px; margin-left: -9px; border-radius: 999px; background: rgb(255, 255, 255); border: 4px solid rgb(18, 160, 106); box-sizing: border-box}
.c3f.c3f{position: absolute; left: 45%; width: 30%; top: 0px; bottom: 0px; border-radius: 999px; background: rgb(18, 160, 106); opacity: 0.3}
.c3g.c3g{position: absolute; left: 56%; top: -5px; width: 19px; height: 19px; margin-left: -9px; border-radius: 999px; background: rgb(255, 255, 255); border: 4px solid rgb(18, 160, 106); box-sizing: border-box}
.c3h.c3h{border-radius: 20px; padding: 16px 18px; background: rgb(10, 42, 134); color: rgb(255, 255, 255); display: flex; flex-direction: column; gap: 6px}
.c3i.c3i{font-size: 12px; font-weight: 700; letter-spacing: 1px; color: rgb(188, 211, 245)}
.c3j.c3j{font-size: 16px; line-height: 1.4}
.c3k.c3k{font-size: 13px; color: rgb(188, 211, 245); line-height: 1.45}
.c3l.c3l{border-radius: 24px; background: rgb(255, 255, 255); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; padding: 18px; display: flex; flex-direction: column; gap: 6px}
.c3m.c3m{font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; font-size: clamp(34px, 4vw, 44px); letter-spacing: -2px; font-variant-numeric: tabular-nums}
.c3n.c3n{font-size: 13px; font-weight: 700; color: rgb(15, 133, 88)}
.c3o.c3o{display: flex; align-items: flex-end; gap: 5px; height: 110px; margin-top: 10px}
.c3p.c3p{flex: 1 1 0%; height: 57.8%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3q.c3q{flex: 1 1 0%; height: 67.8%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3r.c3r{flex: 1 1 0%; height: 53.3%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3s.c3s{flex: 1 1 0%; height: 81.1%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3t.c3t{flex: 1 1 0%; height: 76.7%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3u.c3u{flex: 1 1 0%; height: 61.1%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3v.c3v{flex: 1 1 0%; height: 91.1%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3w.c3w{flex: 1 1 0%; height: 85.6%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3x.c3x{flex: 1 1 0%; height: 66.7%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3y.c3y{flex: 1 1 0%; height: 56.7%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c3z.c3z{flex: 1 1 0%; height: 73.3%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c40.c40{flex: 1 1 0%; height: 87.8%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c41.c41{flex: 1 1 0%; height: 93.3%; border-radius: 6px 6px 2px 2px; background: rgb(21, 95, 176)}
.c42.c42{flex: 1 1 0%; height: 68.9%; border-radius: 6px 6px 2px 2px; background: rgb(27, 157, 230)}
.c43.c43{border-radius: 20px; background: rgb(255, 255, 255); box-shadow: rgba(13, 28, 56, 0.05) 0px 2px 14px; padding: 6px 16px}
.c44.c44{display: flex; flex-direction: column; gap: 6px; padding: 10px 0px; border-bottom: 1px solid rgb(234, 239, 246)}
.c45.c45{display: flex; justify-content: space-between; font-size: 14px; gap: 10px}
.c46.c46{font-variant-numeric: tabular-nums; color: rgb(58, 78, 99)}
.c47.c47{height: 6px; border-radius: 999px; background: rgb(225, 232, 242)}
.c48.c48{width: 54%; height: 100%; border-radius: 999px; background: rgb(10, 42, 134)}
.c49.c49{width: 32%; height: 100%; border-radius: 999px; background: rgb(21, 95, 176)}
.c4a.c4a{width: 9%; height: 100%; border-radius: 999px; background: rgb(27, 157, 230)}
.c4b.c4b{width: 5%; height: 100%; border-radius: 999px; background: rgb(79, 192, 242)}
.c4c.c4c{max-width: 1280px; margin: 0px auto; padding: 40px 28px}
.c4d.c4d{position: relative; height: clamp(320px, 46vw, 580px); border-radius: 16px; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.08); background: rgb(10, 17, 32)}
.c4e.c4e{position: absolute; left: 0px; right: 0px; bottom: 0px; padding: clamp(20px, 3vw, 36px); background: linear-gradient(transparent, rgba(6, 11, 22, 0.85)); pointer-events: none; display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap}
.c4f.c4f{font-size: clamp(22px, 2.6vw, 34px); font-weight: 500; letter-spacing: -0.03em; color: rgb(255, 255, 255); max-width: 620px; line-height: 1.15}
.c4g.c4g{font-family: "Geist Mono"; font-size: 12px; color: rgb(169, 180, 198)}
.c4h.c4h{max-width: 1280px; margin: 0px auto; padding: clamp(56px, 7vw, 96px) 28px}
.c4i.c4i{margin: 0px 0px 40px; font-weight: 600; font-size: clamp(28px, 3.2vw, 44px); letter-spacing: -0.04em; line-height: 1.05; color: rgb(255, 255, 255); max-width: 720px}
.c4j.c4j{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); border-top: 1px solid rgba(255, 255, 255, 0.08); border-left: 1px solid rgba(255, 255, 255, 0.08)}
.c4k.c4k{padding: 28px; border-right: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08); display: flex; flex-direction: column; gap: 12px; transition: background 0.25s}
.c4l.c4l{font-size: 17px; font-weight: 600; letter-spacing: -0.02em; color: rgb(255, 255, 255); margin-top: 12px}
.c4m.c4m{font-size: 14px; line-height: 1.6; color: rgb(140, 152, 172)}
.c4n.c4n{background: rgb(244, 246, 249); color: rgb(11, 18, 32)}
.c4o.c4o{max-width: 1280px; margin: 0px auto; padding: clamp(72px, 9vw, 120px) 28px; display: flex; flex-direction: column; gap: 56px}
.c4p.c4p{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 24px 56px; align-items: end}
.c4q.c4q{font-family: "Geist Mono"; font-size: 12px; letter-spacing: 0.12em; color: rgb(21, 95, 176)}
.c4r.c4r{margin: 0px; font-weight: 600; font-size: clamp(34px, 4.4vw, 60px); letter-spacing: -0.045em; line-height: 1.02; text-wrap: balance}
.c4s.c4s{margin: 0px; font-size: 17px; line-height: 1.6; color: rgb(74, 85, 104); max-width: 480px}
.c4t.c4t{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 0px; border-top: 1px solid rgb(213, 220, 230)}
.c4u.c4u{padding: 28px 28px 8px 0px; display: flex; flex-direction: column; gap: 14px}
.c4v.c4v{font-family: "Geist Mono"; font-size: 13px; color: rgb(21, 95, 176)}
.c4w.c4w{font-size: 22px; font-weight: 600; letter-spacing: -0.03em}
.c4x.c4x{font-size: 15px; line-height: 1.6; color: rgb(74, 85, 104)}
.c4y.c4y{border-left: 2px solid rgb(201, 138, 0); padding: 4px 0px 4px 18px; font-size: 15px; line-height: 1.6; color: rgb(74, 85, 104); max-width: 820px}
.c4z.c4z{color: rgb(11, 18, 32)}
.c50.c50{max-width: 1280px; margin: 0px auto; padding: clamp(72px, 9vw, 120px) 28px; display: flex; flex-direction: column; gap: 48px}
.c51.c51{margin: 0px; font-weight: 600; font-size: clamp(34px, 4.4vw, 60px); letter-spacing: -0.045em; line-height: 1.02; color: rgb(255, 255, 255)}
.c52.c52{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 1px; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 16px; overflow: hidden}
.c53.c53{background: rgb(6, 11, 22); padding: 26px; display: flex; flex-direction: column; gap: 10px; min-height: 150px}
.c54.c54{font-family: "Geist Mono"; font-size: 11px; color: rgb(115, 126, 145)}
.c55.c55{font-size: 19px; font-weight: 600; letter-spacing: -0.02em; color: rgb(255, 255, 255); margin-top: auto}
.c56.c56{font-size: 14px; line-height: 1.5; color: rgb(140, 152, 172)}
.c57.c57{border-top: 1px solid rgba(255, 255, 255, 0.07); border-bottom: 1px solid rgba(255, 255, 255, 0.07); background: rgb(8, 16, 31)}
.c58.c58{max-width: 1280px; margin: 0px auto; padding: clamp(72px, 9vw, 120px) 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 48px 64px}
.c59.c59{margin: 0px; font-weight: 600; font-size: clamp(34px, 4.4vw, 56px); letter-spacing: -0.045em; line-height: 1.02; color: rgb(255, 255, 255)}
.c5a.c5a{margin: 0px; font-size: 17px; line-height: 1.6; color: rgb(169, 180, 198); max-width: 440px}
.c5b.c5b{display: grid; grid-template-columns: minmax(0px, 200px) minmax(0px, 1fr); gap: 8px 24px; padding: 22px 0px; border-bottom: 1px solid rgba(255, 255, 255, 0.08)}
.c5c.c5c{font-size: 16px; font-weight: 600; color: rgb(255, 255, 255); letter-spacing: -0.01em}
.c5d.c5d{font-size: 15px; line-height: 1.6; color: rgb(140, 152, 172)}
.c5e.c5e{max-width: 1280px; margin: 0px auto; padding: clamp(72px, 9vw, 120px) 28px}
.c5f.c5f{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 48px 64px; align-items: start}
.c5g.c5g{display: flex; flex-direction: column; gap: 24px}
.c5h.c5h{margin: 0px; font-weight: 600; font-size: clamp(40px, 5.4vw, 76px); letter-spacing: -0.05em; line-height: 0.98; color: rgb(255, 255, 255)}
.c5i.c5i{font-size: 17px; font-weight: 600}
.c5j.c5j{height: 54px; padding: 0px 20px 0px 16px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.22); color: rgb(255, 255, 255); display: flex; align-items: center; gap: 11px; transition: border-color 0.2s, background 0.2s}
.c5k.c5k{border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 14px; overflow: hidden}
.c5l.c5l{display: flex; align-items: center; gap: 16px; padding: 18px 20px; flex-wrap: wrap}
.c5m.c5m{flex: 1 1 0%; min-width: 200px}
.c5n.c5n{font-size: 15px; font-weight: 600; color: rgb(255, 255, 255)}
.c5o.c5o{font-family: "Geist Mono"; font-size: 12px; color: rgb(125, 138, 160); margin-top: 3px}
.c5p.c5p{height: 42px; padding: 0px 16px; border-radius: 8px; background: rgb(255, 255, 255); color: rgb(6, 11, 22); display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; transition: background 0.2s}
.c5q.c5q{width: 100%; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgba(255, 255, 255, 0.08) currentcolor currentcolor; border-image: none; background: transparent; color: rgb(169, 180, 198); font-size: 14px; padding: 14px 20px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; text-align: left}
.c5r.c5r{font-family: "Geist Mono"; color: rgb(115, 126, 145)}
.c5s.c5s{display: flex; flex-direction: column; gap: 16px}
.c5t.c5t{border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 14px; padding: 22px; display: flex; gap: 20px; align-items: center; flex-wrap: wrap}
.c5u.c5u{width: 128px; height: 128px; border-radius: 10px; background: rgb(255, 255, 255); padding: 10px; box-sizing: border-box; flex-shrink: 0}
.c5v.c5v{width: 100%; height: 100%; border: 1.5px dashed rgb(184, 194, 208); border-radius: 6px; display: flex; align-items: center; justify-content: center; text-align: center; font-family: "Geist Mono"; font-size: 10px; color: rgb(125, 138, 160); padding: 6px; box-sizing: border-box}
.c5w.c5w{flex: 1 1 0%; min-width: 180px}
.c5x.c5x{font-size: 17px; font-weight: 600; color: rgb(255, 255, 255)}
.c5y.c5y{font-size: 14px; line-height: 1.55; color: rgb(140, 152, 172); margin-top: 6px}
.c5z.c5z{border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 14px; padding: 4px 22px}
.c60.c60{display: flex; justify-content: space-between; gap: 16px; padding: 14px 0px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); font-size: 14px; flex-wrap: wrap}
.c61.c61{color: rgb(140, 152, 172)}
.c62.c62{font-family: "Geist Mono"; font-size: 13px; color: rgb(255, 255, 255)}
.c63.c63{display: flex; justify-content: space-between; gap: 16px; padding: 14px 0px; border-bottom: 0px solid rgba(255, 255, 255, 0.07); font-size: 14px; flex-wrap: wrap}
.c64.c64{max-width: 1280px; margin: 0px auto; padding: 0px 28px clamp(72px, 9vw, 120px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 40px 64px}
.c65.c65{margin: 0px; font-weight: 600; font-size: clamp(32px, 3.6vw, 48px); letter-spacing: -0.045em; line-height: 1.02; color: rgb(255, 255, 255)}
.c66.c66{margin: 0px; font-size: 16px; line-height: 1.6; color: rgb(140, 152, 172)}
.c67.c67{color: rgb(255, 255, 255); border-bottom: 1px solid rgba(255, 255, 255, 0.3)}
.c68.c68{border-top: 1px solid rgba(255, 255, 255, 0.08)}
.c69.c69{border-bottom: 1px solid rgba(255, 255, 255, 0.08)}
.c6a.c6a{width: 100%; border: 0px; background: transparent; text-align: left; cursor: pointer; padding: 22px 0px; display: flex; align-items: center; gap: 20px; color: rgb(255, 255, 255)}
.c6b.c6b{flex: 1 1 0%; font-size: 17px; font-weight: 500; letter-spacing: -0.01em; line-height: 1.4}
.c6c.c6c{width: 20px; height: 20px; position: relative; flex-shrink: 0; transform: rotate(45deg); transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1)}
.c6d.c6d{position: absolute; left: 0px; right: 0px; top: 9px; height: 1.5px; background: rgb(169, 180, 198)}
.c6e.c6e{position: absolute; top: 0px; bottom: 0px; left: 9px; width: 1.5px; background: rgb(169, 180, 198)}
.c6f.c6f{width: 20px; height: 20px; position: relative; flex-shrink: 0; transform: rotate(0deg); transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1)}
.c6g.c6g{border-top: 1px solid rgba(255, 255, 255, 0.07)}
.c6h.c6h{max-width: 1280px; margin: 0px auto; padding: 40px 28px; display: flex; gap: 24px; flex-wrap: wrap; align-items: center; justify-content: space-between}
.c6i.c6i{display: flex; align-items: center; gap: 16px; flex-wrap: wrap}
.c6j.c6j{height: 30px; display: block}
.c6k.c6k{font-size: 13px; color: rgb(125, 138, 160)}
.c6l.c6l{display: flex; gap: 6px 24px; flex-wrap: wrap; font-size: 14px}
.c6m.c6m{color: rgb(169, 180, 198)}
.c6n.c6n{max-width: 1280px; margin: 0px auto; padding: 0px 28px 32px; font-size: 12px; color: rgb(115, 126, 145)}
/* hover/active do design */
.h0:hover { color: rgb(255, 255, 255) !important; }
.h1:hover { background: rgb(220, 230, 242) !important; color: rgb(6, 11, 22) !important; }
.h2:hover { border-color: rgba(255, 255, 255, 0.5) !important; background: rgba(255, 255, 255, 0.04) !important; color: rgb(255, 255, 255) !important; }
.h3:active { transform: scale(0.965) !important; }
.h4:active { transform: scale(0.92) !important; }
.h5:hover { background: rgba(255, 255, 255, 0.024) !important; }

/* Ajustes sobre o CSS extraído do design (fonte/pagina.css). Cada regra diz por que existe. */

/* As classes do design têm display próprio; "hidden" precisa vencer. */
[hidden] { display: none !important; }

/* O cabeçalho é "sticky" no design, mas o overflow-x:hidden do invólucro anulava isso.
   clip corta o excesso lateral do mesmo jeito e deixa o cabeçalho grudar no topo. */
[data-pp="raiz"] { overflow-x: hidden !important; overflow-x: clip !important; }

/* Celular: os 5 links do topo não cabem (no design eles quebravam em 4 linhas e cortavam
   "Baixar o app"). Cabem a partir de ~766 px; com folga, abaixo de 800 px ficam só o logo e o botão. */
@media (max-width: 799.98px) {
  [data-pp="menu"] { display: none !important; }
  [data-pp="baixar-topo"] { margin-left: auto; }
}

/* Área de toque de 44 px sem mudar o desenho: um ::after invisível centrado no elemento. */
.pp-alvo { position: relative; }
.pp-alvo::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(100%, 44px);
  height: max(100%, 44px);
  transform: translate(-50%, -50%);
}
/* Rodapé: links em linhas que quebram; aqui a altura real vira 44 px (sem sobrepor alvos). */
[data-pp="rodape-links"] { row-gap: 0 !important; }
[data-pp="rodape-links"] > a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; }

/* Botão de loja ainda sem link: "Em breve", discreto, no mesmo desenho (contorno, como o
   botão da Google Play), com texto legível (contraste AA). */
.pp-embreve.pp-embreve.pp-embreve { background: transparent; border: 1px dashed rgba(255, 255, 255, .22); color: #A9B4C6; cursor: default; }
.pp-embreve.pp-embreve.pp-embreve span span:first-child { color: #7D8AA0; }

/* QR Code gerado (scripts/qr.mjs) no lugar do quadro tracejado. */
.pp-qr { display: block; width: 100%; height: 100%; image-rendering: pixelated; }

/* Foto real (quando configurada) ocupa o quadro inteiro. */
.pp-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }

/* SHA-256 do APK: quebra em qualquer ponto para não vazar no celular. */
.pp-sha { overflow-wrap: anywhere; }

/* Link do navegador na tabela de requisitos. */
.pp-link-req { color: inherit; border-bottom: 1px solid rgba(255, 255, 255, .3); }
.pp-link-req:hover { color: #fff; border-bottom-color: rgba(255, 255, 255, .6); }

/* Requisitos: a última linha visível não tem borda (o design calculava isso por linha). */
[data-pp="requisitos"] > [data-pp="req"] { border-bottom-width: 1px !important; }
[data-pp="requisitos"] > [data-pp="req"]:last-child { border-bottom-width: 0 !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
}