/* ===== SUSSAI – página inicial (v2) ===== */
html{scroll-behavior:smooth}
body.home{background:#0b0f14}
.topo{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;align-items:center;gap:14px;padding:10px 26px;background:#0b0f14d9;backdrop-filter:blur(10px);border-bottom:1px solid #ffffff14}
.topo nav{margin-left:auto;display:flex;gap:22px;align-items:center}
.topo nav a{color:#c9d1d9;text-decoration:none;font-size:15px}
.topo nav a:hover{color:#fff}
.burger{display:none;margin-left:auto;background:none;border:1px solid #ffffff33;color:#fff;font-size:20px;border-radius:8px;padding:4px 10px;cursor:pointer}
.btn{display:inline-block;background:#238636;color:#fff!important;border:0;border-radius:8px;padding:10px 20px;text-decoration:none;font:600 15px "Segoe UI",system-ui,sans-serif;cursor:pointer}
.btn:hover{filter:brightness(1.12)}
.btn.mini{padding:7px 14px;font-size:14px}
.btn.grande{padding:14px 26px;font-size:17px;border-radius:10px}
.btn.sec{background:#ffffff1f;border:1px solid #ffffff55}
.btn.sec2{background:#30363d}
.pequeno{font-size:13px}.claro{color:#d0d7de}

/* capa */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;background:#05080c}
.slides,.slides img,#bgVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slides img{opacity:0;transition:opacity 1.4s ease;transform:scale(1.04)}
.slides img.on{opacity:1;animation:kb 7s linear forwards}
@keyframes kb{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.13) translate(-1.5%,-1%)}}
#bgVideo{opacity:0;transition:opacity 1s}#bgVideo.ok{opacity:1}
.veu{position:absolute;inset:0;background:linear-gradient(90deg,#05080cf0 0%,#05080cc8 36%,#05080c55 62%,#05080c00 100%),linear-gradient(0deg,#05080ccc 0%,transparent 30%)}
.hero-txt{position:relative;z-index:2;max-width:640px;padding:110px 6vw 150px}
.hero h1{font-size:clamp(34px,5vw,58px);line-height:1.08;margin:12px 0 18px;color:#fff}
.hero h1 span{color:#ff7a5c}
.hero p{font-size:18px;color:#e6edf3}
.selo{display:inline-block;background:#ff7a5c26;color:#ffb199;border:1px solid #ff7a5c66;border-radius:20px;padding:4px 12px;font-size:13px;font-weight:600}
.acoes{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 10px}
.legenda{position:absolute;z-index:3;right:3vw;bottom:30px;width:min(470px,92vw);background:#0b0f14e0;border:1px solid #ffffff26;border-radius:12px;padding:12px 16px}
.lg-num{display:block;color:#ff7a5c;font-weight:800;letter-spacing:3px;font-size:12px}
.lg-nome{display:block;font-size:16px;color:#fff;margin:2px 0 4px}
.lg-cap{display:block;font-size:13px;color:#c9d1d9;line-height:1.45;min-height:56px}
.lg-barra{height:3px;background:#ffffff1a;border-radius:2px;margin-top:8px;overflow:hidden}
.lg-barra i{display:block;height:100%;width:0;background:#ff7a5c}
.lg-pontos{display:flex;gap:5px;margin-top:8px;flex-wrap:wrap}
.lg-pontos button{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:#ffffff40;cursor:pointer}
.lg-pontos button.on{background:#ff7a5c}
.real{position:absolute;z-index:3;left:6vw;bottom:14px;margin:0;font-size:11px;color:#8b949e}

/* números */
.numeros{display:grid;grid-template-columns:repeat(4,1fr);background:#161d25;border-bottom:1px solid #ffffff12}
.numeros div{padding:20px 10px;text-align:center;border-right:1px solid #ffffff12}
.numeros b{display:block;font-size:30px;color:#ff7a5c}
.numeros span{color:#8b949e;font-size:14px}

/* seções */
.cx{max-width:1160px;margin:0 auto;padding:64px 26px}
.faixa{background:#0f151c;border-top:1px solid #ffffff10;border-bottom:1px solid #ffffff10}
section h2{font-size:30px;margin:0 0 8px;color:#e6edf3}

/* galeria */
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:24px}
.card{background:#161d25;border:1px solid #30363d;border-radius:12px;overflow:hidden;cursor:zoom-in;transition:transform .15s,border-color .15s}
.card:hover{transform:translateY(-3px);border-color:#ff7a5c}
.card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#0b0f14}
.card div{padding:11px 13px 13px}
.card .n{color:#ff7a5c;font-weight:800;font-size:11px;letter-spacing:2px}
.card .tag{float:right;font-size:10.5px;background:#23863633;color:#56d364;border:1px solid #2386366e;border-radius:10px;padding:1px 7px}
.card b{display:block;font-size:15px;margin:3px 0 4px;color:#e6edf3}
.card span.d{color:#8b949e;font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .info{margin-top:6px;font-size:11.5px;color:#6e7f91}

/* recursos */
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:22px}
.rec{background:#161d25;border:1px solid #30363d;border-radius:12px;padding:18px 20px}
.rec b{font-size:17px}.rec p{color:#8b949e;margin:6px 0 0;font-size:15px}

/* preços */
.precos{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin:26px 0 14px;align-items:stretch}
.plano{position:relative;background:#161d25;border:1px solid #30363d;border-radius:14px;padding:22px 18px;display:flex;flex-direction:column;text-align:center}
.plano h3{margin:0;font-size:19px}
.valor{font-size:44px;font-weight:800;margin:10px 0 0;color:#fff}
.valor small{font-size:17px;font-weight:600;color:#c9d1d9}
.per{color:#8b949e;margin-bottom:12px}
.plano ul{list-style:none;padding:0;margin:0 0 18px;color:#c9d1d9;font-size:14px;flex:1}
.plano li{padding:4px 0;border-top:1px solid #ffffff0d}
.plano .btn{margin-top:auto;width:100%}
.plano.destaque{border:2px solid #ff7a5c;background:linear-gradient(180deg,#2a1a16,#161d25);transform:translateY(-6px)}
.plano.destaque .btn{background:#ff7a5c}
.plano.grupo{border-color:#1f6feb}.plano.grupo .btn{background:#1f6feb}
.fita{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#ff7a5c;color:#fff;font-size:12px;font-weight:700;border-radius:12px;padding:3px 12px;white-space:nowrap}

/* já comprei */
.dois{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start;margin-top:20px}
.baixar{background:#161d25;border:2px solid #238636;border-radius:14px;padding:22px;text-align:center;display:flex;flex-direction:column;gap:8px;align-items:center}
.baixar .ic{font-size:44px}.baixar b{font-size:20px}.baixar span{color:#8b949e}.baixar small{color:#8b949e;font-size:12.5px}

/* passos e dúvidas */
.passos{counter-reset:p;list-style:none;padding:0;margin:22px 0 0;display:grid;gap:12px}
.passos li{counter-increment:p;background:#161d25;border:1px solid #30363d;border-radius:12px;padding:14px 18px 14px 64px;position:relative}
.passos li::before{content:counter(p);position:absolute;left:16px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;background:#ff7a5c;color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
details{background:#161d25;border:1px solid #30363d;border-radius:10px;padding:12px 16px;margin:10px 0}
summary{cursor:pointer;font-weight:600}details p{color:#c9d1d9;margin:8px 0 0}
footer p{margin:4px 0}

/* ampliar imagem */
.lb{position:fixed;inset:0;z-index:60;background:#000000e6;display:flex;align-items:center;justify-content:center}
.lb[hidden]{display:none}
.lb figure{margin:0;max-width:92vw}
.lb img{max-width:92vw;max-height:78vh;border-radius:8px;display:block}
.lb figcaption{color:#c9d1d9;max-width:900px;margin-top:10px;font-size:14px}
.lb figcaption b{color:#fff;font-size:17px;display:block}
.lb button{position:absolute;background:#ffffff1a;border:0;color:#fff;font-size:32px;width:48px;height:48px;border-radius:50%;cursor:pointer}
.lb-x{top:16px;right:16px;font-size:22px!important}.lb-p{left:16px}.lb-n{right:16px}

/* formulário de compra */
.modal{position:fixed;inset:0;z-index:70;background:#000000c0;display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:30px 12px}
.modal[hidden]{display:none}
.caixa{position:relative;background:#161d25;border:1px solid #3a4856;border-radius:14px;padding:22px 24px;width:min(640px,100%)}
.caixa h3{margin:0 0 4px;color:#ff7a5c;font-size:21px}
.caixa label{display:block;margin:10px 0 0;color:#c9d1d9;font-size:13.5px}
.caixa label small{color:#8b949e}
.caixa input,.caixa select,.caixa textarea{display:block;width:100%;box-sizing:border-box;margin-top:4px;background:#0d1117;color:#e6edf3;border:1px solid #3a4856;border-radius:8px;padding:9px 10px;font:15px "Segoe UI",system-ui,sans-serif}
.caixa input:focus,.caixa select:focus,.caixa textarea:focus{outline:2px solid #ff7a5c55;border-color:#ff7a5c}
.caixa .erro{border-color:#ff7b72}
.caixa .chk{display:flex;gap:8px;align-items:flex-start;margin-top:12px}.caixa .chk input{width:auto;margin-top:3px}
.col2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fechar{position:absolute;top:10px;right:12px;background:none;border:0;color:#8b949e;font-size:20px;cursor:pointer}
.ms{min-height:20px;margin-top:10px;font-weight:600;font-size:14px}.ms.er{color:#ff7b72}.ms.ok{color:#56d364}

@media (max-width:860px){
  .burger{display:block}
  .topo nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:#0b0f14f5;padding:12px;gap:12px}
  .topo nav.aberto{display:flex}
  .numeros{grid-template-columns:repeat(2,1fr)}
  .dois,.col2{grid-template-columns:1fr}
  .legenda{left:4vw;right:4vw;width:auto}
  .hero-txt{padding-bottom:230px}
}
@media (prefers-reduced-motion:reduce){.slides img.on{animation:none}}

/* sem foto: fundo neutro (nunca ícone de imagem quebrada) */
img.semfoto{visibility:hidden}
.card img.semfoto{visibility:visible;background:radial-gradient(circle at 50% 40%,#22303d,#0b0f14)}