/* ============================================================
   DRIVE7 · TOKENS DE MARCA
   Este é o único arquivo que carrega cor e fonte da Drive7.
   O style.css do site permanece agnóstico de marca (usa var()).
   ============================================================ */
@import url('fonts.css');   /* fontes auto-hospedadas — não depender de fonts.googleapis.com */

:root{
  /* cor — extraída dos assets oficiais */
  --d7-black:#000000;          /* fundo padrão, preto absoluto */
  --d7-red:#ED3237;            /* vermelho oficial (fil1) */
  --d7-white:#FEFEFE;          /* branco oficial (fil0/fil2) */

  --d7-surface:#0A0A0A;        /* card sobre o preto */
  --d7-line:#1F1F1F;           /* divisor */
  --d7-muted:#9A9A9A;          /* texto secundário */
  --d7-red-dark:#C4262A;       /* hover/pressed */
  --d7-red-soft:rgba(237,50,55,.12);

  /* papéis genéricos — o style.css só conhece estes */
  --accent:var(--d7-red);
  --bg:var(--d7-black);
  --fg:var(--d7-white);

  /* tipografia */
  --d7-font-display:'Archivo Black', system-ui, -apple-system, sans-serif;
  --d7-font-body:'Instrument Sans', system-ui, -apple-system, sans-serif;

  /* proporções travadas dos assets — nunca alterar */
  --d7-logo-ratio:4.8029;      /* 11000 : 2290.3 */
  --d7-icon-ratio:1.1108;      /* 2540.43 : 2286.97 */

  /* área de respiro mínima da marca = 1/4 da altura do logo */
  --d7-logo-clear:.25;
}

html{background:var(--d7-black);color-scheme:dark}
body{background:var(--d7-black);color:var(--d7-white);font-family:var(--d7-font-body)}
h1,h2,h3,.d7-display,.d7-kpi{font-family:var(--d7-font-display);letter-spacing:-.01em}

/* ---- marca -------------------------------------------------- */
/* max-width:100% é OBRIGATÓRIO: com ratio 4.8:1, uma altura de 96px
   gera 461px de largura e estoura qualquer viewport de 360-430px.
   Bug real capturado no QA de 03/09 — não remover. */
.d7-logo{display:block;width:auto;max-width:100%;object-fit:contain;aspect-ratio:var(--d7-logo-ratio)}
.d7-logo--header{height:38px}
.d7-logo--hero{width:min(100%,520px);height:auto}   /* no mobile manda a LARGURA, não a altura */
.d7-logo--footer{height:30px}
.d7-icon{display:block;width:auto;max-width:100%;object-fit:contain;aspect-ratio:var(--d7-icon-ratio)}
.d7-icon--sq{aspect-ratio:1}

/* respiro obrigatório ao redor da marca */
.d7-lockup{padding:calc(var(--d7-logo-clear) * 38px)}

/* fundo claro: trocar o arquivo pelo de contraste, não filtrar por CSS */
.d7-on-light{background:var(--d7-white);color:var(--d7-black)}

/* ---- CTA ---------------------------------------------------- */
.d7-btn{
  font-family:var(--d7-font-body);font-weight:700;line-height:1.1;
  /* botão = controle interativo com texto branco → --d7-red-dark (AA 5.69:1).
     --d7-red segue a cor de marca em superfícies/decoração/ícones. */
  background:var(--d7-red-dark);color:var(--d7-white);
  /* alvo de toque ≥44px (WCAG 2.5.8) mesmo quando usado fora do site.css */
  min-height:48px;display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:10px;padding:14px 22px;cursor:pointer;
  transition:background .16s cubic-bezier(.22,1,.36,1),transform .1s cubic-bezier(.22,1,.36,1)
}
.d7-btn:hover{background:color-mix(in srgb,var(--d7-red-dark) 85%,var(--d7-black))}
/* feedback imediato ao toque (responde no press, não no release) */
.d7-btn:active{transform:scale(.98)}
.d7-btn:focus-visible{outline:3px solid var(--d7-white);outline-offset:2px}

/* ---- acessibilidade ----------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
