/*
Theme Name: Meu Tema Personalizado
Theme URI: https://example.com/
Author: Seu Nome
Author URI: https://example.com/
Description: Tema WordPress leve com SEO básico, HTML semântico, menus e widgets.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: custom-theme
Tags: blog, custom-logo, one-column, two-columns, responsive-layout, accessibility-ready
*/

/* Variáveis (HSL) */
:root {
  --color-bg: 0 0% 100%;
  --color-fg: 222 47% 11%;
  --color-muted: 215 16% 47%;
  --color-accent: 221 83% 53%;
  --space: 1rem;
  --container: 1100px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: hsl(var(--color-fg));
  background: hsl(var(--color-bg));
  line-height: 1.6;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica Neue, Arial, "Apple Color Emoji", "Segoe UI Emoji";
}

.container { max-width: var(--container); margin: 0 auto; padding: 0 calc(var(--space)*1.25); }
.site-header, .site-footer { border-bottom: 1px solid hsl(var(--color-muted) / 0.25); }
.site-footer { border-top: 1px solid hsl(var(--color-muted) / 0.25); border-bottom: none; margin-top: 2rem; padding-top: 1.5rem; }
.branding { display:flex; align-items:center; gap: .75rem; padding: .75rem 0; }
.branding .site-title { margin: 0; font-weight: 700; font-size: 1.125rem; }
.branding .site-description { margin: 0; color: hsl(var(--color-muted)); font-size: .9rem; }

.menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 1rem; flex-wrap: wrap; }
.menu a { text-decoration: none; color: hsl(var(--color-fg)); }
.menu a:focus, .menu a:hover { color: hsl(var(--color-accent)); }

main { padding: 2rem 0; }
article { margin-bottom: 2.5rem; }
article .entry-title { margin: 0 0 .5rem; font-size: clamp(1.5rem, 2.5vw, 2rem); }
article .entry-meta { color: hsl(var(--color-muted)); font-size: .9rem; margin-bottom: .75rem; }

.pager { display: flex; gap: .75rem; justify-content: space-between; }

.widget-area { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); }

.skip-link { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.skip-link:focus { position: static; width: auto; height: auto; padding: .5rem 1rem; background: hsl(var(--color-accent)); color: white; }