/* Página de vendas: usa as variáveis e fontes de style.css */
body.site{background:var(--bg)}
.site a{text-decoration:none}
.in{max-width:1080px;margin:0 auto;padding:0 20px}
.sec-title{text-align:center;margin:0 0 6px;font-size:clamp(28px,5vw,38px);color:var(--ink)}
.sec-sub{text-align:center;color:var(--muted);max-width:520px;margin:0 auto 28px}

/* topo */
.site-top{position:sticky;top:0;z-index:10;background:var(--card);border-bottom:1px solid var(--line)}
.site-top .in{display:flex;align-items:center;gap:18px;padding-top:10px;padding-bottom:10px}
.site-top .brand{flex:none;display:flex;align-items:center;gap:10px;font-size:20px}
.site-top nav{flex:1;display:none;gap:22px;justify-content:center}
.site-top nav a{color:var(--ink);font-weight:600;font-size:15.5px}
.site-top nav a:hover{color:#E2492C}
.site-top .btn{margin-left:auto;white-space:nowrap;font-size:14.5px;padding:8px 14px}
@media (min-width:820px){.site-top nav{display:flex}.site-top .btn{margin-left:0}}

/* herói */
.hero-s{position:relative;overflow:hidden;min-height:720px;background:linear-gradient(#4DB8FF,#B9E4FF 70%,#E4F5FF)}
.hero-s .art{position:absolute;inset:0}
.hero-s .art svg{display:block;width:100%;height:100%}
.hero-s .art.d{display:none}.dsk{display:none}
@media (min-width:820px){.hero-s .art.m{display:none}.hero-s .art.d{display:block}.dsk{display:inline}}
.hero-s::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:48px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 34' preserveAspectRatio='none'><path d='M0 18C70 40 130 0 200 14S340 34 400 12V34H0Z' fill='%23FFF5E1'/></svg>") center/100% 100% no-repeat}
.hero-s .txt{position:relative;z-index:2;padding-top:30px;max-width:560px}
.hero-s h1{font-size:clamp(36px,7vw,58px);line-height:1.04;color:var(--ink)}
.hero-s h1 em{font-style:normal;color:#E2492C}
.hero-s p{font-size:19px;color:#1E2B63;font-weight:600;margin:14px 0 22px;max-width:460px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.btn.teal{background:#fff;color:#1B2B6B;border:2px solid #1B2B6B}
.btn.teal:hover{background:#EAF2FF}
.btn.lg{font-size:18px;padding:15px 28px}
@media (min-width:820px){.hero-s{min-height:620px}.hero-s .txt{padding-top:80px}}

/* seção 1: blocos */
.sec{padding:34px 0 46px}
.feats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media (min-width:820px){.feats{grid-template-columns:repeat(3,1fr)}.sec{padding:46px 0 60px}}
.feat{border-radius:24px;padding:22px 18px 22px;color:#fff;box-shadow:0 10px 22px rgba(27,35,71,.16);display:flex;flex-direction:column;gap:10px}
.feat .med{width:70px;height:70px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 rgba(0,0,0,.12)}
.feat .med svg{width:36px;height:36px}
.feat h3{font-size:21px;color:inherit}
.feat p{font-size:15px;line-height:1.4;opacity:.96}
.f1{background:linear-gradient(160deg,#F2684A,#D8412A)}.f1 .med{color:#D8412A}
.f2{background:linear-gradient(160deg,#4C7DFF,#2A4BC9)}.f2 .med{color:#2A4BC9}
.f3{background:linear-gradient(160deg,#FFD65C,#F6B93B);color:#2A2205}.f3 .med{color:#B07A00}
.f4{background:linear-gradient(160deg,#35A872,#1E7F52)}.f4 .med{color:#1E7F52}
.f5{background:linear-gradient(160deg,#8B6BFF,#5B3FD6)}.f5 .med{color:#5B3FD6}
.f6{background:linear-gradient(160deg,#20B2B6,#117F86)}.f6 .med{color:#117F86}

/* faixa escura com carrossel */
.dark{position:relative;background:var(--navy);color:#fff;padding:26px 0 56px;margin-top:20px;background-image:radial-gradient(circle at 12% 30%,rgba(255,255,255,.7) 0 1.5px,transparent 2px),radial-gradient(circle at 70% 18%,rgba(255,255,255,.6) 0 1.5px,transparent 2px),radial-gradient(circle at 88% 62%,rgba(255,255,255,.55) 0 1.5px,transparent 2px),radial-gradient(circle at 36% 80%,rgba(255,255,255,.5) 0 1.5px,transparent 2px)}
.dark::before,.dark::after{content:"";position:absolute;left:0;right:0;height:34px;background-size:100% 100%;background-repeat:no-repeat}
.dark::before{top:-33px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 34' preserveAspectRatio='none'><path d='M0 34V16C60 -4 130 30 200 14S340 0 400 18V34Z' fill='%231B2B6B'/></svg>")}
.dark::after{bottom:-33px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 34' preserveAspectRatio='none'><path d='M0 0V18C60 38 130 4 200 20S340 34 400 16V0Z' fill='%231B2B6B'/></svg>")}
.dark .sec-title{color:#fff;margin-top:14px}.dark .sec-sub{color:rgba(255,255,255,.8)}
.car{position:relative}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 18px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail .book{flex:none;width:170px;scroll-snap-align:start}
.rail .book b{color:#fff}.rail .book small{color:rgba(255,255,255,.75)}
.arrow{position:absolute;top:42%;width:42px;height:42px;border-radius:50%;background:#fff;color:#1B2B6B;font-size:22px;font-weight:700;display:none;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.3);z-index:2}
.arrow.l{left:-18px}.arrow.r{right:-18px}
@media (min-width:820px){.arrow{display:flex}}
.book .cover.ph{font-size:20px}
.book .ref{display:block;margin-top:1px;font-size:13px;color:rgba(255,255,255,.75)}

/* três cartões */
.trio{display:grid;gap:16px;margin-top:66px}
@media (min-width:900px){.trio{grid-template-columns:repeat(3,1fr)}}
.panel{border-radius:24px;padding:24px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:12px}
.p1{background:#FFE8A8}.p2{background:#E5F6EC}.p3{background:#DFF0FF}
.panel h3{font-size:24px}
.panel p{color:#33406E}
.big-n{font-family:'Fredoka',sans-serif;font-weight:600;font-size:56px;line-height:1;color:#B07A00}
.steps{list-style:none;display:grid;gap:12px;margin:0}
.steps li{display:flex;gap:12px;align-items:flex-start;font-weight:600;color:#1F3B2D}
.steps b{flex:none;width:30px;height:30px;border-radius:50%;background:#1E7F52;color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px}
.mini-cover{align-self:flex-start;width:120px}
.panel .btn{margin-top:auto;align-self:flex-start}

/* preço e confiança */
.price-wrap{display:grid;gap:18px;margin-top:6px}
@media (min-width:900px){.price-wrap{grid-template-columns:1.1fr 1fr 1fr;align-items:stretch}}
.pricecard{background:#fff;color:var(--ink);border-radius:26px;padding:26px;box-shadow:0 14px 30px rgba(0,0,0,.28);display:flex;flex-direction:column;gap:10px}
.pricecard .tag{align-self:flex-start;background:#FFE8A8;color:#7A5200;font-weight:700;font-size:13.5px;border-radius:99px;padding:3px 12px}
.pricecard .val{font-family:'Fredoka',sans-serif;font-weight:600;font-size:54px;line-height:1;color:#E2492C}
.pricecard .val small{display:block;font-size:16px;color:var(--muted);font-weight:500;margin-top:6px;font-family:'Figtree',sans-serif}
.pricecard ul{margin:6px 0 8px 20px;color:#33406E;display:grid;gap:4px}
.trust{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:8px}
.trust .med{width:52px;height:52px;border-radius:50%;background:#fff;color:#1E7F52;display:flex;align-items:center;justify-content:center}
.trust .med svg{width:28px;height:28px}
.trust h3{color:#fff;font-size:20px}.trust p{color:rgba(255,255,255,.82);font-size:15.5px}

/* chamada final */
.final{position:relative;overflow:hidden;text-align:center;padding:70px 0 90px;margin-top:40px;background:linear-gradient(#FFF5E1,#BFE5FF 55%,#9BE3A8)}
.final h2{font-size:clamp(30px,6vw,46px);color:var(--ink)}
.final p{max-width:480px;margin:10px auto 22px;color:#1E2B63;font-weight:600}
.final .cta-row{justify-content:center}
footer.site-foot{background:#1B2B6B;color:rgba(255,255,255,.8);padding:26px 0 32px;font-size:14.5px}
footer.site-foot .in{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between}
footer.site-foot a{color:#FFD65C;font-weight:600}
@media (prefers-color-scheme:dark){
  .p1{background:#4A3F22}.p2{background:#1E4034}.p3{background:#1F3B52}
  .panel p,.steps li{color:#E7ECFF}.big-n{color:#FFD65C}
  .hero-s::after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 34' preserveAspectRatio='none'><path d='M0 18C70 40 130 0 200 14S340 34 400 12V34H0Z' fill='%2312172E'/></svg>")}
  .final{background:linear-gradient(#12172E,#1F3B52 55%,#1E4034)}.final h2{color:#fff}.final p{color:#E7ECFF}
  .pricecard{background:#1B2244}.pricecard ul{color:#E7ECFF}
  .hero-s .art svg{filter:brightness(.6)}
}

/* criação do desenho no site */
.maker{max-width:560px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:var(--shadow)}
.maker .sub{margin-bottom:12px}
.maker .preview{display:block;margin:12px auto}
.maker .btn.ghost{margin-top:12px}
.lock{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;padding:8px 4px}
.lock .lk{width:64px;height:64px;border-radius:50%;background:var(--blue-soft);color:var(--blue-ink);display:flex;align-items:center;justify-content:center}
.lock .lk svg{width:32px;height:32px}
.lock p{color:var(--muted);max-width:420px}
.lock .hint,.maker .hint{font-size:14.5px;color:var(--muted);margin-top:8px}
.out{text-align:center}
.out img{width:100%;max-width:420px;border-radius:14px;border:1px solid var(--line);background:#fff;margin-top:8px}
.out .btn.teal{color:#1B2B6B}
.sec,.dark,.final{scroll-margin-top:74px}

/* conta, saldo e vitrine de PDFs */
.bal{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--blue-soft);border-radius:16px;padding:12px 14px;margin-bottom:6px}
.bal .bn{font-family:'Fredoka',sans-serif;font-weight:600;font-size:34px;line-height:1;color:var(--blue-ink)}
.bal small{display:block;color:var(--muted);font-size:13px}
.who{font-size:13.5px;color:var(--muted);margin:6px 2px 14px}
.who a{color:var(--blue-ink)}
.shelf-s{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 16px}
@media (min-width:700px){.shelf-s{grid-template-columns:repeat(4,1fr)}}
.shelf-s .book b{color:var(--ink)}
.accountpage .acct{max-width:480px;margin:36px auto 60px;padding:0 16px}
.accountpage h2{font-size:30px}
.fld{display:block;font-weight:600;font-size:15px;color:var(--ink);margin:12px 0}
.fld input{margin-top:6px;font-weight:400}
.fld input[readonly]{background:var(--blue-soft);color:var(--muted)}