/**
 * Guia Signature 18.0 — camada canônica de experiência e acabamento.
 * Escopo: consistência global, acessibilidade, responsividade e estabilidade.
 */
:root {
  color-scheme: light;
  --guia-color-ink: #0b1f33;
  --guia-color-text: #1c2b3a;
  --guia-color-muted: #5d6b7a;
  --guia-color-brand: #075dcc;
  --guia-color-brand-hover: #064ca8;
  --guia-color-accent: #0b8db4;
  --guia-color-surface: #fff;
  --guia-color-subtle: #f6f8fb;
  --guia-color-line: #dde3eb;
  --guia-color-focus: #ffb800;
  --guia-container: 1200px;
  --guia-radius-xs: 6px;
  --guia-radius-sm: 10px;
  --guia-radius-md: 16px;
  --guia-radius-lg: 24px;
  --guia-shadow-1: 0 1px 2px rgb(11 31 51 / 6%);
  --guia-shadow-2: 0 14px 36px rgb(11 31 51 / 10%);
  --guia-ease: cubic-bezier(.2,.8,.2,1);
  --guia-font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { scroll-padding-top: 76px; }
body {
  min-width: 320px;
  background: var(--guia-color-surface);
  color: var(--guia-color-text);
  font-family: var(--guia-font);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
*, *::before, *::after { box-sizing: border-box; }
img, svg, video { max-width: 100%; }
img { height: auto; }
.container, .guia-container, .footer-container {
  width: min(var(--guia-container), calc(100% - 48px));
  margin-inline: auto;
}

:where(h1,h2,h3,h4) {
  color: var(--guia-color-ink);
  font-weight: 700;
  text-wrap: balance;
}
:where(h1) { font-size: clamp(2.35rem, 5vw, 4.75rem); line-height: .98; letter-spacing: -.055em; }
:where(h2) { font-size: clamp(1.75rem, 3vw, 2.75rem); line-height: 1.08; letter-spacing: -.04em; }
:where(h3) { line-height: 1.2; letter-spacing: -.025em; }
:where(p,li) { text-wrap: pretty; }
:where(a) { text-underline-offset: .18em; text-decoration-thickness: .08em; }

/* Foco premium, sempre perceptível e independente da cor do componente. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 3px solid var(--guia-color-focus) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 6px rgb(255 184 0 / 18%) !important;
}
:where(button,input,select,textarea) { font: inherit; }
:where(input:not([type=checkbox]):not([type=radio]),select,textarea) {
  min-height: 48px;
  border: 1px solid var(--guia-color-line);
  border-radius: var(--guia-radius-sm);
  background: #fff;
  color: var(--guia-color-ink);
}
:where(input:not([type=checkbox]):not([type=radio]),select) { padding-inline: 14px; }
:where(textarea) { min-height: 128px; padding: 12px 14px; resize: vertical; }
:where(input,select,textarea):focus { border-color: var(--guia-color-brand); }

:where(.btn,.button,button:not(.mobile-menu-toggle),input[type=submit],.wp-block-button__link) {
  min-height: 44px;
  border-radius: var(--guia-radius-sm);
  font-weight: 700;
  transition: transform .2s var(--guia-ease), box-shadow .2s var(--guia-ease), background-color .2s ease, border-color .2s ease;
}
:where(.btn,.button,button:not(.mobile-menu-toggle),input[type=submit],.wp-block-button__link):hover { transform: translateY(-1px); }
:where(.btn,.button,button,input[type=submit]):active { transform: translateY(0); }

/* Cabeçalho: proporção precisa, leitura limpa e navegação tátil. */
.site-header { background: rgb(255 255 255 / 92%); border-color: rgb(11 31 51 / 8%); }
.site-header .container { width: min(var(--guia-container), calc(100% - 48px)); }
.header-inner { min-height: 68px; }
.site-logo { width: 42px; height: 42px; max-width: none; }
.main-navigation .nav-menu > li > a { min-height: 42px; padding-inline: 12px; font-size: 14px; }

/* Linguagem de superfícies unificada em todo o ecossistema. */
:where(.card,.guia-card,.empresa-card,.praia-card,.evento-card,.vaga-card,.post-card,
  .guia-event-card,.guia-popular-card,.sidebar-card,.guia-dashboard-card) {
  border: 1px solid var(--guia-color-line);
  border-radius: var(--guia-radius-md);
  background: var(--guia-color-surface);
  box-shadow: var(--guia-shadow-1);
}
@media (hover:hover) {
  :where(.card,.guia-card,.empresa-card,.praia-card,.evento-card,.vaga-card,.post-card,
    .guia-event-card,.guia-popular-card):hover {
    border-color: #cbd4df;
    box-shadow: var(--guia-shadow-2);
    transform: translateY(-3px);
  }
}
:where(.card,.guia-card,.empresa-card,.praia-card,.evento-card,.vaga-card,.post-card,.guia-event-card) {
  transition: transform .25s var(--guia-ease), box-shadow .25s var(--guia-ease), border-color .25s ease;
}

/* Conteúdo fora da primeira dobra custa menos renderização sem alterar SEO. */
:where(.site-main section,.site-main article):nth-of-type(n+4) {
  content-visibility: auto;
  contain-intrinsic-size: auto 600px;
}
.site-footer { border-top: 1px solid rgb(255 255 255 / 10%); }
.footer-menu a, .footer-contact a { min-height: 36px; display: inline-flex; align-items: center; }

@media (max-width: 768px) {
  .container, .guia-container, .footer-container, .site-header .container { width: min(100% - 32px, var(--guia-container)); }
  html { scroll-padding-top: 60px; }
  body { font-size: 15px; }
  .header-inner { min-height: 58px; }
  .site-logo { width: 38px; height: 38px; }
  .mobile-menu-toggle { width: 44px; height: 44px; min-width: 44px; }
  .main-navigation { width: min(88vw, 360px); padding: 78px 20px 32px; }
  .main-navigation .nav-menu > li > a { min-height: 48px; font-size: 16px; }
  :where(h1) { font-size: clamp(2.25rem, 11vw, 3.25rem); }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .footer-main { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media (forced-colors: active) {
  :where(a,button,input,select,textarea):focus-visible { outline: 3px solid CanvasText !important; }
}
@media print {
  .site-header,.site-footer,.no-print { display: none !important; }
  a[href]::after { content: " (" attr(href) ")"; font-size: .8em; }
}