/*
Theme Name: Afondo4
Theme URI: https://afondoedomex.com/
Author: Equipo A Fondo
Author URI: https://afondoedomex.com/
Description: Tema personalizado de WordPress basado en el rediseño 2025 de A Fondo Edomex.
Version: 0.1.0
Text Domain: afondo4
*/

/* Estilos base mínimos para no romper el layout mientras migramos los assets reales */
:root {
  --afondo-primary: #d52b1e;
  --afondo-dark: #000;
  --afondo-light: #fff;
  --afondo-gray-100: #f8f9fa;
  --afondo-gray-200: #e9ecef;
  --afondo-gray-800: #343a40;
  --color-border: #e0e0e0;
  --container-width: 1200px;
}

html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

body {
  margin: 0;
  font-family: "Roboto", system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  color: #212529;
  line-height: 1.5;
  background: #fff;
}

h1, h2, h3, h4, h5, h6 { font-family: "Oswald", Arial, sans-serif; margin: .5em 0; }

.container { width: 90%; max-width: var(--container-width); margin-left: auto; margin-right: auto; }

.site-header .top-bar { background: var(--afondo-gray-100); color: #6c757d; font-size: 14px; border-bottom: 1px solid #e0e0e0; }
.site-header .main-header { background: #d52b1e; color: #fff; border-bottom: 0; }
.main-nav { background: #f8f9fa; }
.main-nav a { color: var(--afondo-light); text-decoration: none; }

.site-main { padding: 32px 0; }

/**** Placeholders de grillas ****/
.main-grid-layout { display: grid; grid-template-columns: 1fr; gap: 28px; }
@media (min-width: 992px) { .main-grid-layout { grid-template-columns: 2.25fr 1fr; column-gap: 32px; } }

.news-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 768px) { .news-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .news-grid { grid-template-columns: repeat(3, 1fr); } }

img { max-width: 100%; height: auto; display: block; }

.section-header .section-title { position: static; padding-bottom: 0; margin-bottom: 0; }
.section-header .section-title:after { content: none; }
/* underline removed in favor of section header layout in assets/css/styles.css */

.site-footer { background: #111; color: #ddd; padding-top: 24px; }
.site-footer a { color: #ddd; }
.footer-bottom { border-top: 1px solid #333; padding: 16px 0; margin-top: 16px; }