/* FluxUI v7.0 — Professional Polish Layer
   Camada aditiva: carregada depois de styles.v6.8 e fixes.v6.9.
   Não remove nem substitui estruturas; só refina acabamento, estados e consistência. */

:root {
  color-scheme: dark;
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --ring: 0 0 0 3px rgba(77, 143, 247, .28);
  --hairline: rgba(255, 255, 255, .06);
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "cv11", "ss01";
}

/* Tipografia: títulos mais firmes, números alinhados, leitura confortável */
h1, h2 { letter-spacing: -.028em; }
h3 { letter-spacing: -.012em; }
p, li { hyphens: manual; overflow-wrap: break-word; }
[data-progress-number], .dash-percent, .dash-grid strong, .process-intro small,
.loader-modal-bottom strong, .message-meta small { font-variant-numeric: tabular-nums; }
.hero-lead, .section-head > p, .contact-copy p, .client-copy p { max-width: 62ch; }

/* Header: acabamento ao rolar */
.site-header { transition: background-color .3s var(--ease-out), border-color .3s var(--ease-out), box-shadow .3s var(--ease-out); }
.site-header.is-scrolled {
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  backdrop-filter: saturate(160%) blur(14px);
  box-shadow: 0 1px 0 var(--hairline), 0 12px 32px -16px rgba(0, 0, 0, .55);
}
.desktop-nav a, .header-link, .footer-links a {
  transition: color .2s ease, opacity .2s ease;
}
.desktop-nav a:hover, .header-link:hover, .footer-links a:hover { color: #fff; }
.footer-links a, .header-link { text-underline-offset: 4px; }
.footer-links a:hover { text-decoration: underline; text-decoration-color: rgba(120, 169, 255, .6); }

/* Botões: estados completos (hover, pressionado, desabilitado) */
.button {
  transition: transform .2s var(--ease-out), background-color .2s ease, border-color .2s ease,
              box-shadow .25s ease, color .2s ease;
}
.button:hover { box-shadow: 0 10px 28px -12px rgba(77, 143, 247, .55); }
.button:active { transform: translateY(1px) scale(.99); box-shadow: none; }
.button:disabled, .button[aria-disabled="true"] { opacity: .6; cursor: not-allowed; box-shadow: none; }
.button > span[aria-hidden="true"], .button > span:last-child:not([data-submit-label]) {
  transition: transform .25s var(--ease-out);
}
.button:hover > span:last-child:not([data-submit-label]) { transform: translate(2px, -2px); }

/* Cards: borda e profundidade consistentes, com reação sutil ao passar o mouse */
.capability-card, .solution-card, .quality-list article, .client-experience-card,
.contact-form, .faq-list details, .dash-grid article, .quality-card {
  transition: border-color .3s ease, background-color .3s ease, box-shadow .35s var(--ease-out);
}
@media (hover: hover) {
  .capability-card:hover, .solution-card:hover, .quality-list article:hover {
    border-color: rgba(120, 169, 255, .32);
    box-shadow: 0 18px 44px -26px rgba(77, 143, 247, .35), inset 0 1px 0 var(--hairline);
  }
}
.cap-tags span {
  transition: border-color .2s ease, color .2s ease;
}
.capability-card:hover .cap-tags span { border-color: var(--line-2); color: #c4ccd6; }

/* FAQ: interação mais clara */
.faq-list details > summary {
  cursor: pointer;
  list-style: none;
  transition: color .2s ease;
}
.faq-list details > summary::-webkit-details-marker { display: none; }
.faq-list details > summary:hover { color: #fff; }
.faq-list details[open] { border-color: rgba(120, 169, 255, .28); }

/* Formulário: foco, hover, placeholder e validação */
.contact-form :is(input, select, textarea) {
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.contact-form :is(input, select, textarea):hover:not(:focus) { border-color: var(--line-2); }
.contact-form :is(input:not([type="checkbox"]), select, textarea):focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: var(--ring);
}
.contact-form ::placeholder { color: var(--muted-2); opacity: 1; }
.contact-form :is(input, textarea):user-invalid,
.contact-form select:user-invalid { border-color: rgba(255, 107, 107, .65); }
.contact-form input[type="checkbox"] { accent-color: var(--blue); cursor: pointer; }
.contact-form textarea { resize: vertical; min-height: 140px; }
.field-error { color: #ff8a8a; }
.form-assurance span { display: inline-flex; align-items: center; gap: 6px; }
.form-assurance svg { width: 14px; height: 14px; flex: none; color: var(--blue-2); }

/* Controles flutuantes: sombra e foco consistentes */
.fluxia-trigger, .back-to-top {
  box-shadow: 0 14px 36px -16px rgba(0, 0, 0, .75), inset 0 1px 0 var(--hairline);
  transition: transform .25s var(--ease-out), border-color .25s ease, box-shadow .25s ease;
}
@media (hover: hover) {
  .fluxia-trigger:hover, .back-to-top:hover { transform: translateY(-2px); border-color: rgba(120, 169, 255, .4); }
}

/* Rodapé: separação e ritmo */
.site-footer { border-top: 1px solid var(--line); }
.footer-bottom { border-top: 1px solid var(--hairline); }

/* Ancoragem e rolagem */
[id] { scroll-margin-top: 84px; }
main:focus { outline: none; }

/* Barra de rolagem discreta (desktop) */
@media (hover: hover) and (pointer: fine) {
  html { scrollbar-width: thin; scrollbar-color: var(--line-2) var(--bg); }
  ::-webkit-scrollbar { width: 10px; height: 10px; }
  ::-webkit-scrollbar-track { background: var(--bg); }
  ::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 10px; border: 2px solid var(--bg); }
  ::-webkit-scrollbar-thumb:hover { background: #3a4552; }
}

/* Alto contraste e movimento reduzido */
@media (forced-colors: active) {
  .button, .capability-card, .solution-card, .contact-form :is(input, select, textarea) { border: 1px solid CanvasText; }
}
@media (prefers-reduced-motion: reduce) {
  .button, .capability-card, .solution-card, .fluxia-trigger, .back-to-top { transition: none !important; transform: none !important; }
}

/* Impressão: página limpa, sem elementos interativos */
@media print {
  .site-loader, .scroll-progress, .site-header, .floating-actions, .fluxia-panel, .security-check { display: none !important; }
  body { background: #fff !important; color: #111 !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; color: #555; }
}
