/* Totem Já — página de apresentação (totem.cardapioja.com.br sem restaurante). Cores da marca Cardápio Já. */
:root{--ap-azul:#354581;--ap-tinta:#1e2749;--ap-laranja:#df9a07;--ap-creme:#fdf8ee;--ap-suave:#f4f5f9;--ap-linha:#e4e6ee;--ap-texto:#5d6884;--ap-branco:#fff}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body.ap{margin:0;background:var(--ap-branco);color:var(--ap-tinta);font-family:Roboto,"Segoe UI",Arial,sans-serif;font-size:17px;line-height:1.55}
img,video,iframe{max-width:100%}
a{color:inherit}
.ap-wrap{width:min(1160px,100% - 40px);margin:0 auto}
h1,h2,h3{color:var(--ap-azul);line-height:1.12;text-wrap:balance;margin:0}
h1 em,h2 em{font-style:normal;color:var(--ap-laranja)}
.ap-kicker{display:block;font-size:13px;font-weight:800;letter-spacing:.14em;color:var(--ap-laranja);margin-bottom:12px}

/* Topo */
.ap-topo{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--ap-linha)}
.ap-topo-in{display:flex;align-items:center;gap:28px;height:72px}
.ap-marca{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;color:var(--ap-azul);text-decoration:none}
.ap-marca small{font-weight:500;font-size:13px;color:var(--ap-texto)}
.ap-marca-icone{width:26px;height:38px;border-radius:7px;border:4px solid var(--ap-azul);position:relative}
.ap-marca-icone::after{content:"";position:absolute;left:3px;right:3px;bottom:3px;height:6px;border-radius:4px;background:var(--ap-laranja)}
.ap-topo nav{display:flex;gap:24px;margin-left:auto}
.ap-topo nav a{text-decoration:none;font-weight:600;font-size:15px;color:var(--ap-texto)}
.ap-topo nav a:hover{color:var(--ap-azul)}

/* Botões */
.ap-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;background:var(--ap-laranja);color:#fff;text-decoration:none;font-weight:800;padding:16px 28px;border:2px solid var(--ap-laranja)}
.ap-btn:hover{background:#e39f0c;border-color:#e39f0c}
.ap-btn-linha{background:transparent;color:var(--ap-azul);border-color:var(--ap-azul)}
.ap-btn-linha:hover{background:var(--ap-azul);border-color:var(--ap-azul);color:#fff}
.ap-btn-pequeno{padding:10px 20px;font-size:15px}
.ap-btn-cheio{width:100%}
.ap-btn:focus-visible,.ap-topo a:focus-visible{outline:3px solid var(--ap-azul);outline-offset:3px}

/* Abertura */
.ap-hero{background:var(--ap-creme);overflow:hidden}
.ap-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:center;padding-block:72px}
.ap-hero h1{font-size:clamp(36px,5vw,58px);margin-bottom:20px}
.ap-hero-texto>p{font-size:19px;color:var(--ap-texto);max-width:34em;margin:0 0 28px}
.ap-acoes{display:flex;flex-wrap:wrap;gap:14px}
.ap-preco-curto{margin:22px 0 0;color:var(--ap-texto)}
.ap-preco-curto strong{color:var(--ap-azul)}
.ap-hero-midia{margin:0;display:flex;flex-direction:column;align-items:center;gap:10px}
.ap-hero-midia>img{width:100%;max-height:560px;object-fit:cover;border-radius:28px;box-shadow:0 30px 60px rgba(30,39,73,.18)}
.ap-hero-midia figcaption{font-size:14px;color:var(--ap-texto)}

/* Totem desenhado (quando ainda não há foto) */
.ap-totem{display:flex;flex-direction:column;align-items:center}
.ap-totem-tela{width:min(280px,70vw);aspect-ratio:9/16;background:var(--ap-creme);border:14px solid var(--ap-tinta);border-radius:26px;display:grid;grid-template-rows:auto 1fr auto;gap:14px;padding:18px;box-shadow:0 30px 60px rgba(30,39,73,.25)}
.ap-totem-logo{justify-self:center;font-weight:800;color:var(--ap-azul);font-size:15px}
.ap-totem-prop{border-radius:14px;background:var(--ap-laranja);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;gap:6px}
.ap-totem-prop b{font-size:22px;line-height:1.1}
.ap-totem-prop i{font-style:normal;background:#fff;color:var(--ap-laranja);font-weight:800;border-radius:999px;padding:4px 12px;align-self:flex-start}
.ap-totem-botao{background:var(--ap-laranja);color:#fff;font-weight:800;text-align:center;border-radius:999px;padding:12px;font-size:17px}
.ap-totem-pe{width:80px;height:70px;background:linear-gradient(var(--ap-tinta),#2c355c);clip-path:polygon(30% 0,70% 0,100% 100%,0 100%)}

/* Faixa de números */
.ap-faixa{background:var(--ap-azul);color:#fff}
.ap-faixa-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-block:28px}
.ap-faixa b{display:block;font-size:26px}
.ap-faixa span{font-size:14px;opacity:.85}

/* Seções */
.ap-secao{padding-block:80px}
.ap-suave{background:var(--ap-suave)}
.ap-titulo{margin-bottom:40px;max-width:640px}
.ap-titulo h2{font-size:clamp(30px,3.6vw,42px)}
.ap-titulo p{color:var(--ap-texto);margin:16px 0 0}

/* Passos (sequência real do atendimento) */
.ap-passos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;counter-reset:passo}
.ap-passos li{background:#fff;border:1px solid var(--ap-linha);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:10px}
.ap-num{width:40px;height:40px;border-radius:50%;background:var(--ap-laranja);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}
.ap-passos h3{font-size:19px}
.ap-passos p{margin:0;font-size:15px;color:var(--ap-texto)}

/* Vídeos */
.ap-videos{display:grid;gap:22px}
.ap-qtd-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ap-qtd-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ap-video{margin:0;display:flex;flex-direction:column;gap:10px}
.ap-video-caixa{aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:var(--ap-tinta)}
.ap-video-caixa iframe,.ap-video-caixa video{width:100%;height:100%;border:0;display:block}
.ap-video figcaption{font-weight:700;color:var(--ap-azul)}
.ap-qtd-1 .ap-video{max-width:860px}

/* Espaços vazios (fotos e vídeos ainda não enviados) */
.ap-vazio{border:2px dashed #c9cedd;border-radius:20px;background:#fff;color:var(--ap-texto);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;padding:28px}
.ap-vazio h3{font-size:22px}
.ap-vazio p{margin:0}
.ap-vazio-video{aspect-ratio:16/9;max-width:860px}
.ap-play{width:64px;height:64px;border-radius:50%;background:var(--ap-laranja);position:relative}
.ap-play::after{content:"";position:absolute;left:25px;top:20px;border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}

/* Galeria */
.ap-galeria{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ap-galeria figure{margin:0;display:flex;flex-direction:column;gap:8px}
.ap-galeria img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:20px}
.ap-galeria figcaption{font-size:15px;color:var(--ap-texto)}
.ap-galeria .ap-vazio-foto{aspect-ratio:4/5;background:var(--ap-creme)}
.ap-vazio-foto span{font-weight:700;color:var(--ap-azul)}

/* Recursos */
.ap-recursos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ap-recursos article{background:#fff;border-radius:20px;padding:24px;border:1px solid var(--ap-linha)}
.ap-recursos h3{font-size:19px;margin-bottom:8px}
.ap-recursos p{margin:0;color:var(--ap-texto);font-size:15px}

/* Equipamento */
.ap-equip{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.ap-equip .ap-titulo{margin:0}
.ap-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ap-lista li{display:flex;flex-direction:column;gap:4px;padding:18px 0;border-bottom:1px solid var(--ap-linha)}
.ap-lista li:first-child{padding-top:0}
.ap-lista b{color:var(--ap-azul)}
.ap-lista span{color:var(--ap-texto);font-size:15px}

/* Plano */
.ap-plano-secao{background:var(--ap-creme)}
.ap-plano-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:48px;align-items:center}
.ap-plano-grid h2{font-size:clamp(30px,3.6vw,42px);margin-bottom:16px}
.ap-plano-grid p{color:var(--ap-texto)}
.ap-nota{background:#fff;border-radius:14px;padding:14px 18px;border:1px solid #f4e5be}
.ap-plano{background:#fff;border-radius:26px;padding:32px;box-shadow:0 24px 50px rgba(30,39,73,.12);display:flex;flex-direction:column;gap:16px}
.ap-plano h3{font-size:24px}
.ap-plano-preco{margin:0}
.ap-plano-preco strong{font-size:42px;color:var(--ap-azul);font-variant-numeric:tabular-nums}
.ap-plano-preco small{color:var(--ap-texto)}
.ap-plano ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ap-plano li{padding-left:28px;position:relative}
.ap-plano li::before{content:"";position:absolute;left:4px;top:6px;width:12px;height:7px;border-left:3px solid var(--ap-laranja);border-bottom:3px solid var(--ap-laranja);transform:rotate(-45deg)}

/* Rodapé */
.ap-rodape{background:var(--ap-tinta);color:#ccd0df;font-size:15px}
.ap-rodape-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-block:28px}
.ap-rodape p{margin:0}
.ap-rodape b,.ap-rodape a{color:#fff}
.ap-rodape code{background:rgba(255,255,255,.1);border-radius:6px;padding:2px 6px;color:#fff;overflow-wrap:anywhere}

@media(max-width:1000px){.ap-passos{grid-template-columns:repeat(2,minmax(0,1fr))}.ap-recursos{grid-template-columns:repeat(2,minmax(0,1fr))}.ap-qtd-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.ap-topo nav{display:none}.ap-topo-in{justify-content:space-between}.ap-hero-grid,.ap-equip,.ap-plano-grid{grid-template-columns:1fr}.ap-hero-grid{padding-block:48px;gap:36px}.ap-faixa-in{grid-template-columns:repeat(2,minmax(0,1fr))}.ap-galeria{grid-template-columns:1fr 1fr}.ap-qtd-2,.ap-qtd-3{grid-template-columns:1fr}.ap-secao{padding-block:56px}}
@media(max-width:520px){.ap-wrap{width:calc(100% - 32px)}.ap-marca small{display:none}.ap-passos,.ap-recursos,.ap-galeria{grid-template-columns:1fr}.ap-acoes .ap-btn{width:100%}.ap-hero-texto>p{font-size:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
