/* =========================================================
   MODELO VENEXIA — página de captura
   Cores e fontes do manual VNX·IDV v1.0.
   Proporção de uso: Porcelana 55 · Grafite 25 · Platina 12 · Ouro 8
   ========================================================= */
/* Fontes da marca (licença livre OFL), servidas pelo próprio site — sem depender do Google. */
@font-face { font-family: 'Julius Sans One'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/julius-sans-one-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Albert Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/albert-sans-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Albert Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/albert-sans-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: 'Albert Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/albert-sans-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2'); }

:root {
    --vx-ouro: #E2BD67;
    --vx-ouro-escuro: #8A6E33;   /* ouro 130 — texto dourado legível sobre fundo claro */
    --vx-platina: #A8ABB2;
    --vx-grafite: #17181D;
    --vx-grafite-2: #26272E;
    --vx-porcelana: #F8F7F3;
    --vx-texto: #17181D;
    --vx-texto-2: #5A5D66;
    --vx-borda: #E3E1DA;
    --vx-raio: 14px;
    --vx-titulo: 'Julius Sans One', 'Albert Sans', sans-serif;
    --vx-corpo: 'Albert Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --vx-mono: 'IBM Plex Mono', ui-monospace, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--vx-porcelana);
    color: var(--vx-texto);
    font: 400 16px/1.6 var(--vx-corpo);
    -webkit-font-smoothing: antialiased;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; }

/* Topo */
.vx-top {
    display: flex; justify-content: center; align-items: center;
    padding: 18px 16px;
    border-bottom: 1px solid var(--vx-borda);
    background: var(--vx-porcelana);
}
.vx-top img { height: 30px; width: auto; }

/* Seções */
.vx-sec { padding: 44px 16px 52px; }
.vx-wrap { max-width: 640px; margin: 0 auto; text-align: center; }
.vx-dark { background: var(--vx-grafite); color: var(--vx-porcelana); }

.vx-eyebrow {
    margin: 0 0 14px;
    font: 500 12px/1.4 var(--vx-mono);
    letter-spacing: .14em; text-transform: uppercase;
    color: var(--vx-ouro-escuro);
}
.vx-eyebrow--light { color: var(--vx-ouro); }

.vx-title {
    margin: 0 0 14px;
    font: 400 clamp(28px, 7vw, 42px)/1.15 var(--vx-titulo);
    letter-spacing: .08em; text-transform: uppercase;
    text-wrap: balance;
}
.vx-title--sm { font-size: clamp(22px, 5.6vw, 32px); }

.vx-lead {
    margin: 0 auto 26px; max-width: 34em;
    color: var(--vx-texto-2); font-size: 17px;
    text-wrap: pretty;
}
.vx-lead--light { color: var(--vx-platina); }

/* Vídeos */
.vx-video {
    position: relative; margin: 0 auto 26px;
    border-radius: var(--vx-raio); overflow: hidden;
    background: #000;
    box-shadow: 0 18px 40px -18px rgba(23, 24, 29, .45);
}
.vx-video--wide { aspect-ratio: 16 / 9; }
.vx-video--tall { aspect-ratio: 9 / 16; max-width: 340px; }
.vx-dark .vx-video { box-shadow: 0 0 0 1px rgba(168, 171, 178, .18), 0 24px 50px -20px rgba(0, 0, 0, .8); }
.vx-video iframe, .vx-video video, .vx-play, .vx-play img {
    position: absolute; inset: 0; width: 100%; height: 100%; border: 0;
}
.vx-video video { object-fit: cover; background: #000; }
.vx-play { padding: 0; cursor: pointer; background: #000; }
.vx-play img { object-fit: cover; opacity: .92; transition: opacity .2s; }
.vx-play:hover img { opacity: 1; }
.vx-play-icon {
    position: absolute; left: 50%; top: 50%;
    width: 72px; height: 72px; margin: -36px 0 0 -36px;
    display: grid; place-items: center;
    border-radius: 50%;
    background: var(--vx-ouro);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
    transition: transform .2s;
}
.vx-play:hover .vx-play-icon { transform: scale(1.06); }
.vx-play-icon svg { width: 30px; height: 30px; fill: var(--vx-grafite); margin-left: 4px; }

/* Botões */
.vx-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    width: 100%; max-width: 420px; min-height: 58px;
    padding: 16px 28px;
    border: 0; border-radius: 999px;
    background: var(--vx-ouro); color: var(--vx-grafite);
    font: 600 16px/1.2 var(--vx-corpo);
    letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
    cursor: pointer;
    box-shadow: 0 10px 24px -10px rgba(138, 110, 51, .7);
    transition: transform .15s, box-shadow .15s, background .15s;
}
.vx-btn:hover { transform: translateY(-1px); background: #E8C67A; }
.vx-btn:active { transform: translateY(0); }
.vx-btn:focus-visible, .vx-play:focus-visible { outline: 3px solid var(--vx-ouro); outline-offset: 3px; }
.vx-btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.vx-btn--dark {
    background: var(--vx-grafite); color: var(--vx-porcelana);
    box-shadow: 0 10px 24px -12px rgba(23, 24, 29, .8);
    max-width: none;
}
.vx-btn--dark:hover { background: var(--vx-grafite-2); }
.vx-btn[disabled] { opacity: .6; cursor: wait; transform: none; }

.vx-note { margin: 12px 0 0; font-size: 13px; color: var(--vx-texto-2); }

/* Formulário */
.vx-form-sec { padding-bottom: 60px; }
.vx-card {
    background: #fff; text-align: left;
    border: 1px solid var(--vx-borda); border-radius: var(--vx-raio);
    padding: 26px 20px;
    box-shadow: 0 18px 40px -28px rgba(23, 24, 29, .35);
}
.vx-field { display: block; margin-bottom: 16px; }
.vx-field span {
    display: block; margin-bottom: 6px;
    font: 500 12px/1.3 var(--vx-mono); letter-spacing: .1em; text-transform: uppercase;
    color: var(--vx-texto-2);
}
.vx-field input {
    width: 100%; min-height: 52px; padding: 12px 14px;
    border: 1px solid #D6D4CC; border-radius: 10px;
    background: var(--vx-porcelana); color: var(--vx-texto);
    font: 400 17px/1.3 var(--vx-corpo);
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.vx-field input:focus { outline: none; border-color: var(--vx-ouro-escuro); background: #fff; box-shadow: 0 0 0 3px rgba(226, 189, 103, .35); }
.vx-field input[aria-invalid="true"] { border-color: #B3261E; }
.vx-check {
    display: flex; gap: 10px; align-items: flex-start;
    margin: 4px 0 18px; font-size: 14px; line-height: 1.45; color: var(--vx-texto-2); cursor: pointer;
}
.vx-check input { flex: 0 0 auto; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--vx-grafite); }
.vx-error {
    margin: 0 0 14px; padding: 10px 12px; border-radius: 8px;
    background: #FBEAEA; color: #8C1D18; font-size: 14px;
}
.vx-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.vx-success { text-align: center; padding: 10px 0; }
.vx-success img { margin: 0 auto 14px; height: 38px; width: auto; }
.vx-success-text { margin: 0 0 16px; font-size: 18px; font-weight: 500; }
.vx-link { color: var(--vx-ouro-escuro); font-weight: 600; }

/* Rodapé */
.vx-foot {
    padding: 30px 16px 40px; text-align: center;
    border-top: 1px solid var(--vx-borda);
    font-size: 14px; color: var(--vx-texto-2);
}
.vx-foot img { margin: 0 auto 12px; height: 26px; width: auto; }
.vx-foot p { margin: 4px 0; }
.vx-foot a { color: var(--vx-ouro-escuro); font-weight: 600; text-decoration: none; }

/* Página indisponível */
.vx-off { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; text-align: center; }
.vx-off img { margin: 0 auto 24px; height: 64px; width: auto; }

/* Vitrine de produtos (aparece só quando a empresa tem produtos cadastrados) */
.vx-loja { background: #fff; border-top: 1px solid var(--vx-borda); }
.vx-btn--loja { background: transparent; color: var(--vx-grafite); box-shadow: inset 0 0 0 2px var(--vx-grafite); }
.vx-btn--loja:hover { background: var(--vx-grafite); color: var(--vx-ouro); }

@media (min-width: 720px) {
    .vx-sec { padding: 64px 24px 72px; }
    .vx-card { padding: 34px 32px; }
}
@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; scroll-behavior: auto !important; }
}

/* Link da política de privacidade */
.sac-privacy { margin-top: 10px !important; font-size: 12px; opacity: .8; }
.vx-check a { color: inherit; }