/* Entrada do sistema (Padrão de Entrada dos app-cases): uma tela só, sem rolagem, em 1536x730, 1366x650, 390x664 e 360x640.
   Cores da Auto Sales lidas no código dos sites da empresa: azul #003A5D e verde #3DAE2B. Escala 4 8 12 16 24 32 48. */
@font-face{font-family:"Bricolage";src:url("/fontes/bricolage-700.woff2") format("woff2");font-weight:600 700;font-display:swap}
:root{--marca:#003A5D;--marca2:#002B46;--verde:#3DAE2B;--fundo:#071720;--sup:#0F2938;--sup2:#143346;--linha:#183649;--linha2:#274E66;--tx:#F2F6F9;--tx2:#AEBEC8;--tx3:#8DA1AD;--acc:#8FD983;
  --bt:#3DAE2B;--bt-h:#4BBE38;--bt-tx:#06200C;--dg:#EF8A7C;--halo:rgba(61,174,43,.42);--ouro:#C19A4B;--ouro-tx:#E2C27E;--ouro-soft:rgba(193,154,75,.12);--ouro-borda:rgba(193,154,75,.4);--veu:rgba(3,10,15,.7);color-scheme:dark}
html.claro{--fundo:#EEF4F7;--sup:#FFFFFF;--sup2:#F4F8FA;--linha:#D9E5EC;--linha2:#C3D4DF;--tx:#0B212F;--tx2:#324D5D;--tx3:#556C7B;--acc:#1B6B1E;--bt:#237F24;--bt-h:#1B6B1E;--bt-tx:#FFFFFF;
  --dg:#B2342C;--halo:rgba(27,107,30,.28);--ouro-tx:#7A5F22;--ouro-soft:#FBF3E2;--ouro-borda:#E3CD9B;--veu:rgba(11,33,47,.45);color-scheme:light}
*{box-sizing:border-box}
html,body{height:100%}
body.entrar{margin:0;background:var(--fundo);color:var(--tx);font:400 15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}
.ico{width:18px;height:18px;flex:none}
.ent{height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,480px)}
.ent.so{grid-template-columns:1fr;place-items:center}
/* a coluna da marca: o azul da empresa, a logo branca e o vídeo */
.ent-marca{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;gap:48px;padding:48px;background:radial-gradient(80% 70% at 20% 10%,rgba(61,174,43,.16),transparent 70%),linear-gradient(160deg,var(--marca),var(--marca2));color:#FFFFFF}
.ent-esq{display:flex;flex-direction:column;gap:32px;min-width:0}
.ent-logo{width:300px;max-width:100%;height:auto}
.ent-t b{display:block;font:700 40px/1.1 "Bricolage",system-ui,sans-serif;letter-spacing:-.03em}
.ent-t span{display:block;margin-top:12px;font-size:17px;line-height:1.5;color:#D6E4EC}
.ent-video{display:flex;flex-direction:column;gap:12px;min-width:0;padding:12px;border-radius:16px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#FFFFFF;font:inherit;text-align:left;cursor:pointer;transition:transform .15s cubic-bezier(.32,.72,0,1),background .15s}
.ent-video:hover{background:rgba(255,255,255,.14);transform:translateY(-2px)}.ent-video:active{transform:translateY(0)}
.ent-capa{position:relative;display:block;border-radius:8px;overflow:hidden;background:#071720;aspect-ratio:16/9}
.ent-capa img{display:block;width:100%;height:100%;object-fit:cover;opacity:.82}
.ent-video .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--verde);color:#06200C;box-shadow:0 0 32px -4px rgba(61,174,43,.9)}
.ent-video .play .ico{width:28px;height:28px;margin-left:3px}
.ent-vt{padding:0 4px 4px}
.ent-video b{display:block;font-size:16px}.ent-video small{display:block;font-size:13px;color:#D6E4EC}
.ent-topo{display:none}
/* o cartão de entrada */
.ent-cartao{display:flex;flex-direction:column;justify-content:center;padding:24px 40px;background:var(--sup);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.ent.so .ent-cartao{width:min(440px,100% - 32px);border-radius:12px;border:1px solid var(--linha);padding:32px}
.ent-cartao h1{margin:0 0 12px;font:700 24px/1.2 "Bricolage",system-ui,sans-serif;letter-spacing:-.02em}
.ent-sub{margin:0;color:var(--tx2)}.ent-sub a{color:var(--acc)}
.aviso-e{margin:0 0 16px;padding:12px 16px;border:1px solid var(--linha2);border-radius:8px;font-size:12.5px;line-height:1.45;color:var(--tx2)}
.aviso-e b{display:flex;align-items:center;gap:8px;margin-bottom:4px;font-size:12.5px;letter-spacing:.06em;color:var(--ouro-tx)}
.aviso-e b .ico{width:16px;height:16px;color:var(--ouro-tx)}
.aviso-e p{margin:0}.aviso-e p+p{margin-top:4px}
label{display:block;margin:0 0 4px;font-size:13px;font-weight:600;color:var(--tx2)}
.in{display:block;width:100%;height:44px;margin:0 0 12px;padding:0 12px;border-radius:8px;border:1px solid var(--linha2);background:var(--sup2);color:var(--tx);font:inherit}
.in:focus{outline:2px solid var(--acc);outline-offset:1px}
.bt{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;padding:0 16px;border-radius:8px;border:1px solid var(--linha2);background:var(--sup2);color:var(--tx);font:inherit;font-weight:600;text-decoration:none;cursor:pointer;transition:transform .15s cubic-bezier(.32,.72,0,1),background .15s}
.bt:hover{transform:translateY(-1px)}.bt:active{transform:translateY(1px)}
.bt.pri{background:var(--bt);border-color:var(--bt);color:var(--bt-tx);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 18px -7px var(--halo)}
.bt.pri:hover{background:var(--bt-h)}
.bt:focus-visible,.perfil:focus-visible,.ent-video:focus-visible,.ver-como button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.form-msg{min-height:20px;margin:-4px 0 8px;font-size:13px}.form-msg.erro{color:var(--dg)}
.divisor{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--tx3);font-size:12px}
.divisor::before,.divisor::after{content:"";flex:1;height:1px;background:var(--linha)}
.ent-bts{display:flex;flex-direction:column;gap:8px}
.so-cel-e{display:none}
.ent-pe{margin-top:16px;color:var(--tx3);font-size:12px}.ent-pe b{color:var(--ouro-tx)}
/* janelas: perfis de demonstração e vídeo */
.demo{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--veu)}
.demo[hidden]{display:none}
.demo-c{width:min(760px,100%);padding:24px;border-radius:12px;border:1px solid var(--linha2);background:var(--sup);box-shadow:0 24px 60px rgba(0,0,0,.55)}
.demo-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}
.demo-c h2{margin:0 0 4px;font:700 20px/1.2 "Bricolage",system-ui,sans-serif}
.demo-c p{margin:0;color:var(--tx2);font-size:14px}
.tag-ouro{flex:none;padding:4px 8px;border-radius:8px;border:1px solid var(--ouro-borda);background:var(--ouro-soft);color:var(--ouro-tx);font-size:12px;font-weight:700;white-space:nowrap}
.ver-como{display:inline-flex;gap:4px;margin-bottom:16px;padding:4px;border-radius:10px;border:1px solid var(--linha);background:var(--fundo)}
.ver-como[hidden]{display:none}
.ver-como button{height:32px;padding:0 16px;border:0;border-radius:8px;background:transparent;color:var(--tx2);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.ver-como button.on{background:var(--sup2);color:var(--tx);box-shadow:inset 0 0 0 1px var(--linha2)}
.perfis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:16px}
.perfil{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:72px;padding:12px 16px;border-radius:8px;border:1px solid var(--linha2);background:var(--sup2);color:var(--tx);font:inherit;text-align:left;cursor:pointer;transition:transform .15s cubic-bezier(.32,.72,0,1),border-color .15s}
.perfil:hover{border-color:var(--acc);transform:translateY(-2px)}.perfil small{color:var(--tx3);font-size:12.5px;line-height:1.35}
.video-c{width:min(1040px,100%);padding:16px}
.video-c .demo-cab{margin-bottom:12px}
.video-c video{display:block;width:100%;max-height:calc(100dvh - 160px);border-radius:8px;background:#000000}
.bt.x{width:44px;flex:none;padding:0}
/* visão celular no notebook: coluna de 390 px, sem moldura */
body.vc{margin:0;height:100dvh;display:flex;flex-direction:column;background:var(--fundo);color:var(--tx);font:400 14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
.vc-barra{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:8px 24px;border-bottom:1px solid var(--linha);background:var(--sup)}
.vc-bts{display:flex;gap:8px}.vc-bts .bt{width:auto;min-height:40px;font-size:13px}
.vc-palco{flex:1;min-height:0;display:flex;justify-content:center;background:var(--fundo)}
.vc-palco iframe{width:390px;max-width:100%;height:100%;border:0;border-left:1px solid var(--linha2);border-right:1px solid var(--linha2);background:var(--fundo)}
@media (max-width:820px){
  body.entrar{overflow:auto}
  .ent{grid-template-columns:1fr;min-height:100dvh;height:auto}.ent-marca{display:none}.ent-cartao{padding:16px}
  .ent-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-16px -16px 12px;padding:12px 16px;background:linear-gradient(160deg,var(--marca),var(--marca2));color:#D6E4EC;font-size:13px;font-weight:600}
  .ent-topo img{width:auto;height:24px}
  .ent-cartao{justify-content:flex-start}.aviso-e{margin-bottom:12px;padding:8px 12px;font-size:12px;line-height:1.4}.ent-cartao h1{margin-bottom:8px;font-size:21px}.divisor{margin:12px 0}.ent-pe{margin-top:12px}
  .so-cel-e{display:inline-flex}
  .demo{align-items:flex-end;padding:0}.demo-c{width:100%;border-radius:16px 16px 0 0;padding:16px;max-height:100dvh;overflow:auto}
  .perfis{grid-template-columns:repeat(2,minmax(0,1fr))}.perfil{min-height:64px;padding:8px 12px}.perfil small{font-size:12px}
  .video-c{border-radius:0;padding:12px}
  .vc-barra{padding:8px 12px}
}
@media (max-height:700px){
  .ent-cartao{padding-top:12px;padding-bottom:12px}.aviso-e{margin-bottom:12px;padding:8px 12px;font-size:12px;line-height:1.4}.ent-cartao h1{margin-bottom:8px;font-size:21px}
  .in{height:40px;margin-bottom:8px}.bt{min-height:40px}.divisor{margin:8px 0}.ent-pe{margin-top:8px}.form-msg{min-height:16px;margin:-2px 0 4px;font-size:12px}
  .ent-marca{gap:32px;padding:32px 48px}.ent-esq{gap:24px}.ent-t b{font-size:34px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media (max-width:1180px) and (min-width:821px){.ent-marca{grid-template-columns:1fr;gap:24px;align-content:center}.ent-video{max-width:420px}}
.sem-video{margin:0;padding:48px 16px;border:1px dashed var(--linha2);border-radius:8px;text-align:center;color:var(--tx2)}
.sem-video[hidden],video[hidden]{display:none}
