:root{
  --papel:#F6F3EC; --papel2:#FFFDF7; --tinta:#141712; --tinta2:#4A4F45;
  --linha:rgba(20,23,18,.12); --verde:#12684A; --ouro:#A5801A; --branco:#fff;
  --sombra:0 10px 30px rgba(20,23,18,.10);
  --disp:'Barlow Condensed',Impact,sans-serif;
  --ui:'Instrument Sans',system-ui,-apple-system,sans-serif;
  --retrato-vazio:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 140'%3E%3Crect width='100' height='140' fill='%23EDE9DF'/%3E%3Ccircle cx='50' cy='57' r='21' fill='%23C3BEB1'/%3E%3Cpath d='M11 140c0-21.5 17.5-34 39-34s39 12.5 39 34z' fill='%23C3BEB1'/%3E%3C/svg%3E");
  --mold-prata:linear-gradient(150deg,#9AA0A6 0%,#E6E9EC 26%,#8C929A 52%,#F2F4F6 74%,#878D95 100%);
  --mold-ouro:linear-gradient(150deg,#C9A227 0%,#F0DC9A 26%,#B8860B 52%,#F5E7B2 74%,#A5801A 100%);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--papel);color:var(--tinta);font-family:var(--ui);
  font-size:17px;line-height:1.55;text-wrap:pretty;
  background-image:repeating-linear-gradient(0deg,rgba(120,110,95,.045) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(120,110,95,.035) 0 1px,transparent 1px 4px);
}
::selection{background:var(--verde);color:#FFFDF7}
:focus-visible{outline:2px solid var(--verde);outline-offset:2px}
a{color:var(--verde);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--tinta)}
h1,h2,h3{text-wrap:balance;font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:.005em;line-height:1;margin:0}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
.kicker{font:700 12px/1 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--verde);margin:0 0 14px}
.pular{position:absolute;left:-9999px}
.pular:focus{left:24px;top:14px;z-index:9;background:var(--tinta);color:var(--papel2);padding:12px 16px;border-radius:10px}

/* ---------- hero ---------- */
.hero{padding:56px 0 8px;text-align:center}
.marca{width:74px;height:74px;margin:0 auto 22px;display:block}
.hero h1{font-size:clamp(58px,13vw,104px);font-weight:800;letter-spacing:-.01em}
.tagline{max-width:23ch;margin:14px auto 0;font-family:var(--disp);font-weight:600;font-size:clamp(21px,4.2vw,29px);line-height:1.16;text-transform:none;color:var(--tinta)}
.tagline em{font-style:normal;color:var(--verde)}
.selo-loja{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin:26px 0 0;padding:11px 20px;border:1.5px solid var(--tinta);border-radius:99px;background:transparent;font:700 13px var(--ui);letter-spacing:.06em;text-transform:uppercase}
.selo-loja .ponto{width:8px;height:8px;border-radius:99px;background:var(--verde)}
.leque{display:flex;justify-content:center;align-items:flex-end;gap:0;margin:44px 0 0;padding-bottom:8px}
.leque .fig{margin:0 -18px}
.leque .fig:nth-child(1){transform:rotate(-8deg) translateY(14px)}
.leque .fig:nth-child(3){transform:rotate(8deg) translateY(14px)}
.leque .fig:nth-child(2){z-index:2}

/* ---------- figurinha (portada do app) ---------- */
.fig{
  --w:168px;--cor:#0B2E5E;--mold:var(--mold-prata);--nfs:.105;--foto:var(--retrato-vazio);
  width:var(--w);aspect-ratio:2.5/3.5;flex:none;display:flex;position:relative;
  padding:calc(var(--w)*.038);border-radius:calc(var(--w)*.072);background:var(--mold);
  box-shadow:0 calc(var(--w)*.05) calc(var(--w)*.13) rgba(20,23,18,.18);
}
.fig.ex{--mold:var(--mold-ouro)}
.fig-in{flex:1;min-width:0;position:relative;display:flex;flex-direction:column;overflow:hidden;background:var(--cor);border:calc(var(--w)*.008) solid var(--cor);border-radius:calc(var(--w)*.042)}
.fig-foto{position:absolute;top:0;left:0;right:0;bottom:calc(var(--w)*.135);z-index:0;overflow:hidden;border-radius:calc(var(--w)*.03) calc(var(--w)*.03) 0 0;background:var(--cor)}
.fig-foto::before{content:'';position:absolute;top:0;bottom:0;left:calc(var(--w)*.035);right:calc(var(--w)*.035);background:#EDEAE1}
.fig-foto::after{content:'';position:absolute;top:0;bottom:0;left:calc(var(--w)*.035);right:calc(var(--w)*.035);background-image:var(--foto);background-position:center 12%;background-size:cover;background-repeat:no-repeat;filter:saturate(.93) contrast(1.05) sepia(.09);-webkit-mask-image:radial-gradient(ellipse 64% 96% at 50% 70%,#000 44%,rgba(0,0,0,.55) 74%,rgba(0,0,0,0) 92%);mask-image:radial-gradient(ellipse 64% 96% at 50% 70%,#000 44%,rgba(0,0,0,.55) 74%,rgba(0,0,0,0) 92%)}
.fig-topo{display:none;position:absolute;top:calc(var(--w)*.028);left:calc(var(--w)*.012);z-index:4;width:calc(var(--w)*.2375);height:calc(var(--w)*.2375);background-image:var(--logo);background-position:center;background-size:contain;background-repeat:no-repeat;filter:drop-shadow(0 1px calc(var(--w)*.018) rgba(0,0,0,.35))}
.fig-topo.cx{border-radius:calc(var(--w)*.028);background-color:#ffcc00;box-shadow:0 0 0 calc(var(--w)*.01) var(--papel2)}
.fig-numlinha{position:relative;z-index:3;flex:1;min-height:0;display:flex;align-items:flex-end;justify-content:flex-end}
.fig-num{font-family:var(--disp);font-weight:800;font-size:calc(var(--w)*.176);line-height:.82;color:#FFFDF7;-webkit-text-stroke:calc(var(--w)*.0095) var(--cor);letter-spacing:-.02em;margin:0 calc(var(--w)*.032) calc(var(--w)*-.022) 0;text-shadow:0 2px calc(var(--w)*.05) rgba(0,0,0,.35)}
.fig-nome{position:relative;z-index:1;flex:none;height:calc(var(--w)*.135);display:flex;align-items:center;justify-content:center;overflow:hidden;margin:0 calc(var(--w)*.035);padding:0 calc(var(--w)*.035);background:rgba(255,253,247,.68);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);font-family:var(--disp);font-weight:700;font-size:calc(var(--w)*var(--nfs));line-height:1;color:var(--tinta);text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
.fig-pe{position:relative;display:flex;align-items:center;justify-content:center;gap:calc(var(--w)*.03);padding:calc(var(--w)*.022) calc(var(--w)*.03);background:var(--cor);color:#fff;font:600 calc(var(--w)*.042)/1.3 var(--ui);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.fig-band{flex:none;width:calc(var(--w)*.125);height:calc(var(--w)*.086);background-image:var(--flag);background-position:center;background-size:cover;background-repeat:no-repeat}
.fig-grao{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:.62;mix-blend-mode:multiply;background-color:rgba(196,178,146,.14);background-image:repeating-linear-gradient(0deg,rgba(120,110,95,.09) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(120,110,95,.07) 0 1px,transparent 1px 3px)}

/* ---------- carrossel ---------- */
.telas{padding:60px 0 8px}
.telas h2{font-size:clamp(30px,6vw,44px)}
.telas .sub{margin:10px 0 0;color:var(--tinta2);max-width:52ch}
.trilha{display:flex;gap:20px;max-width:768px;margin:32px auto 0;padding:6px 24px 22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 24px;list-style:none;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.trilha>li{scroll-snap-align:center;scroll-margin-top:90px}
.trilha figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px}
.trilha figcaption{max-width:272px;text-align:center;font:600 13.5px/1.4 var(--ui);color:var(--tinta2)}
.trilha figcaption b{display:block;font:700 13px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--verde);margin-bottom:3px}
.pontos{display:flex;justify-content:center;gap:10px;padding:0 24px 6px;margin:0;list-style:none}
.pontos a{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:99px;font:700 13px var(--ui);color:var(--tinta2);text-decoration:none}
.pontos a:hover,.pontos a:focus-visible{background:var(--branco);color:var(--tinta);box-shadow:var(--sombra)}
.nota{margin:6px 0 0;text-align:center;font:500 12.5px var(--ui);color:var(--tinta2)}

/* ---------- moldura de celular + telas do app ---------- */
.fone{flex:none;width:272px;padding:9px;border-radius:36px;background:#1B1E19;box-shadow:0 18px 44px rgba(20,23,18,.28),inset 0 0 0 1.5px rgba(255,255,255,.14)}
.fone-tela{position:relative;width:254px;height:550px;overflow:hidden;border-radius:28px;background:var(--papel)}
.app{position:absolute;top:0;left:0;width:375px;height:812px;transform:scale(.6773);transform-origin:0 0;background:var(--papel);font-family:var(--ui);color:var(--tinta)}
.app-status{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 22px;font:600 14px var(--ui)}
.app-status .barra{width:44px;height:5px;border-radius:99px;background:var(--tinta);opacity:.25}
.app-cab{padding:6px 18px 12px}
.app-kicker{font:700 10.5px var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--verde)}
.app-tit{margin:6px 0 0;font-family:var(--disp);font-weight:800;font-size:34px;line-height:1;text-transform:uppercase}
.app-desc{margin:7px 0 0;font:400 12.5px/1.45 var(--ui);color:var(--tinta2)}
.app-busca{display:flex;align-items:center;gap:9px;height:46px;margin:12px 18px 0;padding:0 13px;border:1px solid var(--linha);border-radius:13px;background:var(--branco);font:400 13px var(--ui);color:var(--tinta2)}
.app-filtros{display:flex;gap:8px;margin:10px 18px 0;font:600 12.5px var(--ui)}
.app-chip{display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid var(--linha);border-radius:99px;background:var(--branco)}
.app-chip.on{background:var(--tinta);color:var(--papel);border-color:var(--tinta)}
.app-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:14px 18px 0}
.app-uf{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;padding:12px 18px 0}
.app-uf div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:78px;padding:11px 4px 9px;border:1px solid var(--linha);border-radius:12px;background:var(--branco)}
.app-uf b{font-family:var(--disp);font-weight:700;font-size:19px;line-height:1}
.app-uf span{font:400 8.5px/1.2 var(--ui);color:var(--tinta2);text-align:center}
.app-uf div>span:last-child{height:21px}
.app-uf .band{width:26px;height:17px;background-position:center;background-size:cover;background-repeat:no-repeat}
.app-uf .off{opacity:.42}
.app-abas{position:absolute;left:0;right:0;bottom:0;display:flex;height:76px;padding-bottom:18px;background:rgba(255,255,255,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--linha)}
.app-abas div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font:600 10.5px var(--ui);color:var(--tinta2)}
.app-abas div.on{color:var(--tinta);box-shadow:inset 0 2px 0 0 var(--verde)}
.app-abas svg{display:block}
.app-num{display:flex;align-items:center;justify-content:space-between;margin:0 16px 10px;padding:14px 16px;border:1px solid var(--linha);border-radius:14px;background:var(--branco)}
.app-num .val{font-family:var(--disp);font-weight:800;font-size:40px;line-height:.9;letter-spacing:.02em}
.app-num .rot{font:600 10.5px var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta2)}
.app-num .copiar{display:flex;align-items:center;height:40px;padding:0 16px;border-radius:99px;background:var(--verde);color:#fff;font:700 12px var(--ui);letter-spacing:.02em}
.app-linha{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 16px 10px;padding:12px 16px;border:1px solid var(--linha);border-radius:14px;background:var(--branco);font:500 12.5px var(--ui);color:var(--tinta2)}
.app-linha b{display:block;font:700 13.5px var(--ui);color:var(--tinta)}
.app-sec{display:flex;align-items:center;gap:10px;padding:14px 16px 8px;font:700 13px var(--ui)}
.app-sec .band{width:26px;height:18px;background-position:center;background-size:cover;background-repeat:no-repeat}
.app-cola{display:flex;align-items:center;gap:12px;margin:0 16px 10px;padding:10px 12px;border:1px solid var(--linha);border-left:4px solid var(--cor,var(--verde));border-radius:14px;background:var(--branco)}
.app-cola .retrato{flex:none;width:40px;height:56px;border-radius:7px;background-color:#EDEAE1;background-image:var(--retrato-vazio);background-position:center 12%;background-size:cover;background-repeat:no-repeat}
.app-cola .cargo{font:700 9.5px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--tinta2)}
.app-cola .nome{font-family:var(--disp);font-weight:700;font-size:19px;line-height:1.05;text-transform:uppercase}
.app-cola .part{font:500 10.5px var(--ui);color:var(--tinta2)}
.app-cola .n{margin-left:auto;font-family:var(--disp);font-weight:800;font-size:30px;line-height:.9}
.app-cola .vazio{font-family:var(--disp);font-weight:700;font-size:19px;text-transform:uppercase;color:var(--tinta2);opacity:.6}
.app-perfil{position:relative;display:flex;justify-content:center;padding:12px 0 6px;background:linear-gradient(180deg,var(--branco),var(--papel))}
.app-voltar{position:absolute;left:14px;top:8px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid var(--linha);border-radius:99px;background:var(--branco);box-shadow:0 2px 8px rgba(20,23,18,.1)}
.app-bt{margin:14px 16px 0;height:52px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:var(--tinta);color:var(--papel);font:700 14.5px var(--ui)}

/* ---------- pilares ---------- */
.pilares{padding:70px 0 10px}
.pilares ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:26px 0 0;padding:0;list-style:none}
.pilares li{padding:24px 22px 26px;border:1px solid var(--linha);border-radius:18px;background:var(--papel2);box-shadow:var(--sombra)}
.pilares h3{font-size:25px;margin:16px 0 8px}
.pilares p:not(.kicker){margin:0;color:var(--tinta2);font-size:15.5px}
.pilares svg{display:block;color:var(--verde)}

/* ---------- download ---------- */
.baixar{padding:70px 0 20px}
.baixar-cx{display:flex;flex-wrap:wrap;gap:34px;align-items:center;justify-content:space-between;padding:34px;border:1px solid var(--linha);border-radius:22px;background:var(--papel2);box-shadow:var(--sombra)}
.baixar-txt{flex:1 1 300px;min-width:260px}
.baixar h2{font-size:clamp(28px,5.4vw,40px)}
.baixar-txt>p:not(.loja):not(.kicker){margin:12px 0 0;color:var(--tinta2)}
.lojas{display:flex;flex-wrap:wrap;gap:14px;margin:24px 0 0}
.loja-badge{position:relative;display:inline-flex;align-items:center;gap:12px;min-height:58px;padding:11px 22px;border-radius:13px;background:#31352E;border:1.5px dashed rgba(255,253,247,.34);color:rgba(255,253,247,.66);cursor:not-allowed}
.loja-badge small{display:block;font:600 9.5px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;margin-bottom:4px}
.loja-badge b{display:block;font-family:var(--disp);font-weight:700;font-size:23px;line-height:1;letter-spacing:.01em}
.loja-badge svg{flex:none}
.loja-badge .tag{position:absolute;top:-10px;right:12px;padding:3px 9px;border-radius:99px;background:var(--ouro);color:#141712;font:700 9.5px/1.4 var(--ui);letter-spacing:.1em;text-transform:uppercase}
.baixar strong{color:var(--tinta);font-weight:700}
.qr{flex:none;display:flex;flex-direction:column;align-items:center;gap:12px;padding:18px;border-radius:18px;background:var(--branco);box-shadow:0 0 0 1px var(--linha),0 8px 22px rgba(20,23,18,.10)}
.qr svg{display:block;width:168px;height:168px}
.qr code{font:500 12.5px 'IBM Plex Mono',ui-monospace,monospace;color:var(--tinta2)}

/* ---------- rodapé ---------- */
footer{margin-top:56px;padding:34px 0 46px;border-top:1px solid var(--linha)}
footer .linhas{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14.5px;color:var(--tinta2)}
footer .marca-pe{font-family:var(--disp);font-weight:700;font-size:20px;text-transform:uppercase;color:var(--tinta);margin:0 0 12px}
footer .priv{margin:16px 0 0;font-size:13.5px;color:var(--tinta2)}

@media (max-width:640px){
  .hero{padding:40px 0 0}
  .leque .fig{--w:132px;margin:0 -14px}
  .baixar-cx{padding:24px}
}
@media (prefers-reduced-motion:no-preference){
  .trilha{scroll-behavior:smooth}
}
@media (prefers-color-scheme:dark){
  :root{
    --papel:#0E110E;--papel2:#181C17;--tinta:#F2F0E8;--tinta2:#B9BBB1;
    --linha:rgba(242,240,232,.15);--verde:#3FBF87;--ouro:#E7C46A;--branco:#20241E;
    --sombra:0 10px 30px rgba(0,0,0,.4);
  }
  body{background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.02) 0 1px,transparent 1px 4px)}
  .fig-nome{background:rgba(32,36,30,.68);color:#F2F0E8}
  .app-abas{background:rgba(24,28,23,.8)}
  .qr{background:#FFFDF7}
  .qr code{color:#4A4F45}
}
