@font-face{font-family:"Anton";font-weight:400;font-display:swap;src:url(../fontes/anton-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:300;font-display:swap;src:url(../fontes/hanken-grotesk-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:400;font-display:swap;src:url(../fontes/hanken-grotesk-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:500;font-display:swap;src:url(../fontes/hanken-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:600;font-display:swap;src:url(../fontes/hanken-grotesk-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:700;font-display:swap;src:url(../fontes/hanken-grotesk-latin-700-normal.woff2) format("woff2")}
:root{
  --figo:#451739;--figo-2:#38122E;--figo-3:#2A0D22;--lilac:#987E92;--lilac-bg:#EFE9EE;--lilac-bg2:#E7DEE4;--lilac-tint:#DED4DC;
  --mostarda:#D6A461;--mostarda-dark:#896541;--mostarda-tint:#F9F2E9;--veto-border:#EDD6B8;
  --green:#7D7E3B;--green-deep:#19251A;--green-soft:#EAEAE0;--green-line:#D8D8C4;
  --ink:#33283A;--ink-soft:#6B5C74;--ink-faint:#B2A4B6;--surface:#FCF9FB;--line:#E8DCE4;--line-2:#DBCBD6;--creme:#FBEDE4;
  --sans:"Hanken Grotesk",system-ui,-apple-system,sans-serif;--display:"Anton",Impact,sans-serif;
  --r-lg:30px;--r-md:22px;--r-sm:16px;
  --elev-1:0 1px 2px rgba(58,20,48,.05),0 4px 14px -6px rgba(58,20,48,.10),0 16px 32px -20px rgba(58,20,48,.28);
  --elev-2:0 2px 6px rgba(58,20,48,.07),0 10px 24px -10px rgba(58,20,48,.18),0 32px 64px -28px rgba(58,20,48,.42);
  --ease:cubic-bezier(.2,.75,.25,1);--ease-spring:cubic-bezier(.34,1.45,.4,1);
  --h1:clamp(50px,6vw,88px);--h2:clamp(36px,4.2vw,58px);--h3:24px;--mani:clamp(28px,3.4vw,46px);
  color-scheme:light only;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0}
body{background:var(--lilac-bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,figure,ol,ul,dl,dd{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.oculto{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ic{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.ic-16{width:16px;height:16px;stroke-width:1.8}.ic-20{width:20px;height:20px;stroke-width:1.7}
.marca{display:block;width:112px;height:auto}
.wrap{width:min(1280px,100% - 96px);margin-inline:auto}
.d{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.012em;line-height:1.26;text-wrap:balance}
.label{font:600 11.5px/1.2 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:600 15px/1 var(--sans);padding:16px 26px;border-radius:999px;border:0;cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .13s var(--ease-spring),background .13s var(--ease),box-shadow .24s var(--ease)}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}
.btn-forte{background:var(--figo);color:#fff}
.btn-linha{background:transparent;color:var(--figo);box-shadow:inset 0 0 0 1.5px var(--figo)}
.btn-linha:hover{background:var(--figo);color:#fff}
.btn-claro{background:var(--creme);color:var(--figo)}
.btn-linha-claro{background:transparent;color:var(--creme);box-shadow:inset 0 0 0 1.5px rgba(251,237,228,.55)}
.btn-linha-claro:hover{background:var(--creme);color:var(--figo)}
.btn-sm{font-size:14px;padding:12px 18px}
.frm{display:grid;gap:14px}
.campo{display:grid;gap:6px}
.campo span{font:600 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.campo input,.campo textarea{font:400 17px/1.4 var(--sans);padding:14px 16px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);width:100%;resize:vertical}
.campo input::placeholder,.campo textarea::placeholder{color:var(--ink-faint)}
.frm-pe{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.frm-ok{font-size:14px;color:var(--green-deep);background:var(--green-soft);box-shadow:inset 0 0 0 1px var(--green-line);padding:9px 14px;border-radius:999px}
.frm-erro{font-size:14px;color:var(--mostarda-dark);background:var(--mostarda-tint);box-shadow:inset 0 0 0 1px var(--veto-border);padding:9px 14px;border-radius:999px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ══ o véu de abertura — o ícone do app ══ */
.veu{position:fixed;inset:0;z-index:300;background:var(--figo);display:grid;place-items:center;animation:veu-sobe .9s 1.2s var(--ease) forwards;pointer-events:none}
.veu img{width:72px;height:auto;animation:veu-a 1s .1s var(--ease) both}
@keyframes veu-sobe{to{transform:translateY(-101%);visibility:hidden}}
@keyframes veu-a{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.veu{display:none}}

/* ══ a página ══ */
.site{background:radial-gradient(1100px 560px at 4% -10%,#ECEEDA 0%,transparent 55%),radial-gradient(900px 640px at 110% 4%,#ECE0E9 0%,transparent 52%),var(--lilac-bg);color:var(--ink);overflow-x:clip}
.nav{position:sticky;top:0;z-index:60;transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.nav.solida{background:rgba(239,233,238,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:74px}
.nav nav{display:flex;gap:26px;margin-left:12px}
.nav nav a{text-decoration:none;font:500 14px/1 var(--sans);color:var(--ink-soft)}
.nav nav a:hover{color:var(--figo)}
.nav .acoes{margin-left:auto;display:flex;gap:12px;align-items:center}
.nav .entrar{font:600 14px/1 var(--sans);color:var(--figo);text-decoration:none}
.nav-lojas{display:flex;gap:8px;align-items:center}
.nav-lojas .btn{gap:7px}
.nav .hamb{display:none;background:transparent;border:0;color:var(--figo);width:44px;height:44px;border-radius:50%;cursor:pointer;place-items:center}
.menu-m{display:none}

/* hero — a leitura ao vivo */
.hero{display:grid;grid-template-columns:6fr 6fr;gap:48px;align-items:center;padding:36px 0 88px}
.hero-t{padding-top:0}
.hero h1{font-size:clamp(40px,4.4vw,64px);line-height:1.06;color:var(--figo);max-width:17ch;animation:up 1s .1s var(--ease) both}
.hero h1 b{font-weight:inherit;color:var(--mostarda-dark)}
.hero .sub{font-weight:300;font-size:21px;line-height:1.42;color:var(--ink);max-width:34ch;margin-top:28px;animation:up 1s .32s var(--ease) both}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px;animation:up 1s .42s var(--ease) both}
@keyframes up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
/* o leque de telas do hero */
.baralho{animation:up 1.2s .25s var(--ease) both}
.leque{position:relative;height:min(64vh,600px)}
.leque .fone{position:absolute;left:50%;top:0;width:40%;max-width:230px;margin-left:-20%;background:var(--figo-3);border-radius:42px;transform-origin:50% 120%;transition:transform .8s var(--ease),opacity .5s var(--ease);cursor:pointer;border:0;padding:10px;will-change:transform}
.leque .fone.ativa{cursor:default;box-shadow:0 40px 80px -20px rgba(58,20,48,.45),inset 0 0 0 1px rgba(255,255,255,.14)}
.leque .fone:not(.ativa):hover{filter:brightness(1.04)}
.leque .fone:focus-visible{outline:2px solid var(--mostarda);outline-offset:4px}
.leque-cab{text-align:center;margin-top:22px;min-height:78px}
.leque-cab h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;font-size:22px;line-height:1;color:var(--figo)}
.leque-cab p{font-size:15px;line-height:1.5;color:var(--ink-soft);max-width:38ch;margin:8px auto 0}
.leque-cab.troca h3,.leque-cab.troca p{animation:up .6s var(--ease) both}
.pontos{display:flex;justify-content:center;gap:8px;margin-top:12px}
.ponto{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:var(--line);cursor:pointer;transition:background .3s,transform .3s}
.ponto.on{background:var(--figo);transform:scale(1.25)}
.leque::after{content:"";position:absolute;left:14%;right:14%;bottom:-6px;height:40px;border-radius:50%;background:radial-gradient(closest-side,rgba(58,20,48,.28),rgba(58,20,48,0));filter:blur(6px)}
/* a peça lida ao vivo */


/* como o app funciona — a lista editorial do método */
.como{padding:96px 0 24px;border-top:1px solid var(--figo)}
.como .cab{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
.como .cab .label{grid-column:1/4;color:var(--mostarda-dark)}
.como h2{grid-column:4/12;font-size:var(--h2);color:var(--figo);max-width:14ch}
.como .intro{grid-column:4/12;font-weight:300;font-size:21px;line-height:1.45;color:var(--ink);max-width:48ch;margin-top:6px}
.etapas{margin-top:48px;display:grid}
.etapa{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;padding:30px 0;border-top:1px solid var(--line-2)}
.etapa .n{grid-column:1/4;font-family:var(--display);font-size:44px;line-height:.9;color:var(--mostarda)}
.etapa > div{grid-column:4/12;display:grid;gap:10px}
.etapa h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;font-size:var(--h3);line-height:1.05;color:var(--figo)}
.etapa p{font-size:17px;line-height:1.55;color:var(--ink-soft);max-width:60ch}

/* a leitura — os seis cartões de pergunta (mesma família do Provador, escala menor) */
.leitura{padding:96px 0 8px;border-top:1px solid var(--figo)}
.leitura .cab{display:grid;gap:12px;margin-bottom:44px}
.leitura .cab .label{color:var(--mostarda-dark)}
.leitura h2{font-size:var(--h2);color:var(--figo);max-width:16ch}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.flip.mini{width:100%;aspect-ratio:1/.92}
.mini .face{border-radius:26px;box-shadow:0 1px 0 var(--line),0 26px 50px -30px rgba(58,20,48,.5)}
.mini .face.frente{padding:24px;grid-template-rows:auto 1fr auto;gap:6px}
.mini .face.frente .perg{display:grid;align-content:center;font-size:clamp(23px,2.15vw,33px);line-height:1.04;justify-content:start}
.mini .face.frente small{font:600 10.5px/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:rgba(251,237,228,.55)}
.mini .face.verso{padding:22px;align-items:end}
/* o padrão fica INSINUADO nos pequenos — a onça aberta é privilégio do Provador */
/* sem repetir (a emenda aparecia): a estampa entra cortada, e cada cartão mostra um pedaço diferente */
.mini .face.verso{background:#C99755 url(../marca/onca.webp) center/auto 150% no-repeat}
.cards > *:nth-child(2) .verso{background-position:22% 30%}
.cards > *:nth-child(3) .verso{background-position:78% 60%}
.cards > *:nth-child(4) .verso{background-position:40% 80%}
.cards > *:nth-child(5) .verso{background-position:85% 20%}
.cards > *:nth-child(6) .verso{background-position:12% 65%}
.mini .face.verso::before{background:linear-gradient(175deg,rgba(69,23,57,.78) 0%,rgba(69,23,57,.93) 42%,rgba(69,23,57,.97) 100%)}
.mini .face.verso p{font-size:15.5px;line-height:1.42;font-weight:300}
.mini .face.verso .label{margin-bottom:8px}
.flip.mini:hover .face{box-shadow:0 1px 0 var(--line),0 34px 60px -30px rgba(58,20,48,.6)}
.flip.mini:focus-visible{outline:2px solid var(--mostarda);outline-offset:5px;border-radius:26px}

/* a vitrine noturna — o Provador */
.noite{background:linear-gradient(165deg,var(--figo) 0%,var(--figo-2) 55%,var(--figo-3) 100%);color:var(--creme);padding:120px 0;margin-top:60px;position:relative;overflow:hidden}
.noite-g{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center}
.noite h2{font-size:var(--h2);color:var(--creme);max-width:12ch}
.noite .sub{font-weight:300;font-size:19px;line-height:1.5;color:rgba(251,237,228,.85);max-width:40ch;margin-top:22px}
.noite .sub b{font-weight:500;color:var(--creme)}
.noite .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.flip{perspective:1600px;justify-self:center;width:min(100%,460px);aspect-ratio:4/5;cursor:pointer}
.flip-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s var(--ease)}
.flip.on .flip-in{transform:rotateY(180deg)}
.face{position:absolute;inset:0;border-radius:var(--r-lg);backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:var(--elev-2)}
.face.frente{background:linear-gradient(180deg,#5A2249 0%,#3A122F 100%);display:grid;grid-template-rows:auto 1fr auto;padding:26px}
.face.frente .label{color:var(--mostarda)}
.face.frente .peca{display:grid;place-items:center}
.face.frente .peca img{max-height:250px;width:auto;filter:drop-shadow(0 26px 30px rgba(0,0,0,.45))}
.face.frente .perg{font-family:var(--display);text-transform:uppercase;font-size:34px;line-height:1;color:var(--creme);display:flex;justify-content:space-between;align-items:end;gap:12px}
.face.frente .perg small{font:600 11px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(251,237,228,.6);text-align:right}
.face.verso{transform:rotateY(180deg);background:#C99755 url(../marca/onca.webp) center/cover;display:grid;align-items:end;padding:26px}
.face.verso::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(69,23,57,.15) 0%,rgba(69,23,57,.9) 62%)}
.face.verso > div{position:relative;color:var(--creme)}
.face.verso .label{color:var(--mostarda);margin-bottom:12px}
.face.verso p{font-weight:300;font-size:21px;line-height:1.35}
.face.verso .fonte{margin-top:16px;font:500 12px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:rgba(251,237,228,.65)}

/* consultoras · contato */
.duas{padding:120px 0 40px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bloco{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--elev-1);padding:40px}
.bloco h2{font-size:clamp(28px,2.8vw,38px);color:var(--figo)}
.bloco .sub{font-weight:300;font-size:17px;line-height:1.5;color:var(--ink);margin:16px 0 26px;max-width:42ch}
.bloco .email{display:inline-block;margin-top:18px;font-size:14px;color:var(--mostarda-dark);text-decoration:none;border-bottom:1px solid var(--mostarda)}

/* rodapé */
.foot{margin-top:80px;background:var(--figo);color:var(--creme)}
.foot .wrap{padding:64px 0 36px}
.foot .marca{width:180px}
.foot-g{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap}
.foot .links{display:flex;gap:22px;flex-wrap:wrap;font-size:14px;align-items:center}
.foot a{text-decoration:none;color:rgba(251,237,228,.85)}
.foot a:hover{color:var(--creme)}
.foot .social{display:inline-flex;align-items:center;gap:7px}
.foot .social .ic{width:18px;height:18px}
.foot .fim{margin-top:40px;padding-top:20px;border-top:1px solid rgba(214,164,97,.4);font-size:12.5px;opacity:.65;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.foot .onca{height:26px;background:url(../marca/onca.webp) center/900px auto}

@media (max-width:980px){
  .wrap{width:min(1280px,100% - 40px)}
  .hero{grid-template-columns:1fr;gap:36px;padding-bottom:56px}.hero-t{padding-top:20px}
  .baralho{max-width:520px;margin:0 auto;width:100%}.leque{height:auto;aspect-ratio:1/.98}
  .como{padding-top:72px}.como .cab,.etapa{grid-template-columns:1fr;gap:10px}.como .cab .label,.como h2,.como .intro,.etapa .n,.etapa > div{grid-column:auto}.como .intro{font-size:19px}.etapa{padding:22px 0}.etapa .n{font-size:32px}
  .cards{grid-template-columns:repeat(2,1fr);gap:14px}.leitura{padding-top:72px}.leitura .cab{margin-bottom:32px}
  .noite-g{grid-template-columns:1fr;gap:40px}.duas{grid-template-columns:1fr}.bloco{padding:28px}
}
@media (max-width:760px){
  .nav nav,.nav .entrar,.nav .nav-lojas{display:none}.nav .wrap{height:64px;gap:14px}.marca{width:96px}.nav .hamb{display:grid}
  .menu-m{position:fixed;inset:0;z-index:80;background:var(--figo);color:var(--creme);padding:24px;display:none;flex-direction:column;gap:6px}
  .menu-m.on{display:flex}
  .menu-m .fecha{align-self:flex-end;background:transparent;border:0;color:var(--creme);width:44px;height:44px;display:grid;place-items:center;cursor:pointer}
  .menu-m a{font-family:var(--display);text-transform:uppercase;font-size:36px;color:var(--creme);text-decoration:none;padding:10px 0;border-bottom:1px solid rgba(251,237,228,.15)}
  .menu-m .m-pe{margin-top:auto;display:grid;gap:12px}
  .menu-m .m-pe .btn{width:100%;font:600 15px/1 var(--sans);text-transform:none;border-bottom:0;padding:16px 26px}
  .menu-m .m-pe .btn-claro{color:var(--figo)}.menu-m .m-pe .btn-linha-claro{color:var(--creme)}.menu-m .m-pe .btn-linha-claro:hover{color:var(--figo)}
  .hero h1{font-size:clamp(34px,8.6vw,44px);line-height:1.1}.hero .sub{font-size:19px}.hero .cta .btn,.noite .cta .btn{width:100%}
  .como{padding-top:56px}.cards{grid-template-columns:1fr;gap:14px}.flip.mini{aspect-ratio:1/.62}.leitura{padding-top:56px}
  .noite{padding:72px 0}.noite h2{max-width:none}.duas{padding-top:72px}
}