/* ==========================================================================
   Método Caracol — Extras (extras.css)
   Programadores: Graciliano Tolentino; Willian Albarelo
   Método Caracol, marca registrada.
   Data de geração: 2026-01-23
   Padrão: High Tech 12/10 (Ciclo Visual 01)
   Objetivo: camada final de acabamento e utilidades pequenas,
   SEM redefinir tokens (tokens.css), SEM criar componentes (components.css),
   SEM reestruturar seções (sections.css).

   Contrato:
   - Pode conter helpers (visibilidade, acessibilidade, scroll, debug leve).
   - Pode conter correções pontuais cross-browser.
   - Deve ser “última camada” (overrides defensivos mínimos).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Acessibilidade: utilitário sr-only (padrão robusto)
   -------------------------------------------------------------------------- */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* --------------------------------------------------------------------------
   Visibilidade / estado
   -------------------------------------------------------------------------- */
.hidden {
  display: none !important;
}

.invisible {
  visibility: hidden !important;
}

.is-hidden {
  display: none !important;
}

.is-disabled {
  pointer-events: none !important;
  opacity: 0.6 !important;
}

/* --------------------------------------------------------------------------
   Scroll / overflow (defensivo)
   -------------------------------------------------------------------------- */
.no-scroll {
  overflow: hidden !important;
}

/* Evita scroll horizontal acidental por sombras/grids */
html,
body {
  overflow-x: hidden;
}

/* Smooth scroll (somente quando permitido) */
@media (prefers-reduced-motion: no-preference) {
  html:focus-within {
    scroll-behavior: smooth;
  }
}

/* --------------------------------------------------------------------------
   Interações: reduzir "tap highlight" (mobile) sem afetar tema
   -------------------------------------------------------------------------- */
a,
button {
  -webkit-tap-highlight-color: transparent;
}

/* --------------------------------------------------------------------------
   Seleção de texto (acabamento visual) — token-first com fallback
   -------------------------------------------------------------------------- */
::selection {
  background: rgba(46, 168, 255, 0.25);
  color: var(--mc-text, #e7eefc);
}

/* --------------------------------------------------------------------------
   Imagens/SVGs: comportamento previsível (principalmente no hero/diagrama)
   - Não define componente; só evita comportamento estranho.
   -------------------------------------------------------------------------- */
img,
svg {
  max-width: 100%;
  height: auto;
}

img {
  image-rendering: auto;
}

/* Evita “1px gap” em imagens inline e melhora alinhamento */
img,
svg {
  vertical-align: middle;
}

/* --------------------------------------------------------------------------
   Safe-area (iOS) — utilitário para containers/painéis, se necessário
   -------------------------------------------------------------------------- */
.safe-area-pad {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* --------------------------------------------------------------------------
   Noscript (fallback) — deixa elegante sem virar “alerta assustador”
   -------------------------------------------------------------------------- */
.noscript {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(231, 238, 252, 0.12);
  background: rgba(11, 15, 20, 0.55);
  color: rgba(231, 238, 252, 0.78);
  line-height: 1.45;
}

/* --------------------------------------------------------------------------
   Suporte: motion reduzido (acessibilidade)
   - Mantém consistência mesmo se components/sections tiverem transições.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* --------------------------------------------------------------------------
   Print (defensivo): evita imprimir navegação e elementos interativos
   -------------------------------------------------------------------------- */
@media print {
  .site-header,
  .site-footer,
  .nav,
  .nav-mobile,
  .btn,
  .carousel,
  .timeline,
  .mc-banner {
    display: none !important;
  }

  body {
    background: #fff !important;
    color: #000 !important;
  }

  a {
    text-decoration: underline !important;
    color: #000 !important;
  }
}

/* --------------------------------------------------------------------------
   Debug leve (opcional): borda para inspeção rápida
   - Use adicionando class="debug-outline" no body (manual).
   -------------------------------------------------------------------------- */
.debug-outline * {
  outline: 1px dashed rgba(255, 255, 255, 0.12);
  outline-offset: -1px;
}

/* --------------------------------------------------------------------------
   Nota intencional (Caracol 12/10)
   - extras.css é a “válvula de escape” para exceções.
   - Se um bloco crescer demais, ele deve migrar para a camada correta.
   -------------------------------------------------------------------------- */
