/* LP Tricologia – styles.css
   Paleta: #00c48c, #002945, #696f7a, #ffffff, #111825
   Observação: Usamos Tailwind CDN para o layout/utilitários. Este arquivo faz ajustes finos e garante fallback básico. */

:root{
  --c-primary:#00c48c;
  --c-deep:#002945;
  --c-muted:#696f7a;
  --c-bg:#ffffff;
  --c-ink:#111825;
}

html,body{ font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; color: var(--c-ink); background: var(--c-bg); }

/* Helpers */
.hidden{ display:none; }
.container{ max-width: 72rem; margin-inline:auto; padding-inline: 1rem; }

/* Acentos e focos */
:focus-visible{ outline: 2px solid var(--c-primary); outline-offset: 2px; }

/* CTA hover fix em devices sem hover */
@media (hover:none){
  a, button{ transition:none !important; }
}

/* Cards básicos (fallback caso Tailwind não carregue) */
.card{ border:1px solid color-mix(in srgb, var(--c-muted) 25%, transparent); border-radius: 1rem; padding: 1rem; background: #fff; }
.card--ghost{ border-style:dashed; background: #f8fafc; }

/* Botões (fallback) */
.btn{ display:inline-flex; align-items:center; gap:.5rem; padding:.75rem 1.25rem; border-radius:.75rem; font-weight:600; text-decoration:none; border:1px solid transparent; }
.btn--primary{ background:var(--c-primary); color:#fff; }
.btn--primary:hover{ filter: brightness(0.96); }
.btn--outline{ border-color: color-mix(in srgb, var(--c-muted) 30%, transparent); background:#fff; color:var(--c-ink); }
.btn--outline:hover{ background:#f8fafc; }

/* Badges */
.badge{ display:inline-flex; align-items:center; gap:.25rem; padding:.25rem .5rem; border-radius:999px; background: color-mix(in srgb, var(--c-primary) 10%, transparent); color: var(--c-deep); font-size:.75rem; font-weight:700; }

/* Footer tip */
.footer-tip{ color: var(--c-muted); font-size:.875rem; text-align:center; margin-top: .75rem; }

/* Feedback mensagens */
.text-red-600{ color:#dc2626; }
.text-green-600{ color:#16a34a; }

section#video { background: linear-gradient(0deg, #ffffff 50%, #f4fdfa 50%); }