/*
Theme Name: AiBrands Theme
Theme URI: https://www.aibrands.com.mx/
Author: AiBrands
Author URI: https://www.aibrands.com.mx/
Description: Tema ligero optimizado para SEO para AiBrands (Inicio, Quiénes somos y Blog) con tipografías modernas y animaciones suaves.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: aibrands
*/

:root{
  --ab-yellow: #ffffe4;
  --ab-green: #46d30b;
  --ab-blue: #0d2058;
  --ab-text: #0d2058;
  --ab-muted: rgba(13,32,88,0.75);
}

html, body {
  margin: 0;
  padding: 0;
  background: var(--ab-yellow);
  color: var(--ab-text);
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  line-height: 1.55;
}

a { color: var(--ab-blue); text-decoration: none; }
a.button, .button {
  display: inline-block;
  padding: .9rem 1.2rem;
  border-radius: 16px;
  font-weight: 700;
  box-shadow: 0 6px 18px rgba(13,32,88,.15);
  background: white;
  color: var(--ab-blue);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
a.button.primary { background: var(--ab-green); color: var(--ab-blue); }
a.button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(13,32,88,.2); }

.container { max-width: 1200px; margin: 0 auto; padding: 0 1rem; }
.grid-2 { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 900px) { .grid-2 { grid-template-columns: 1.1fr .9fr; } }

header.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--ab-blue); color: white;
  backdrop-filter: saturate(140%) blur(6px);
}
.nav { display:flex; align-items:center; justify-content:space-between; padding: .8rem 1rem; }
.brand { display:flex; align-items:center; gap:.6rem; font-weight:900; font-size:1.15rem; letter-spacing:.5px; }
.brand .mark { width: 34px; height: 34px; background: var(--ab-green); border-radius: 10px; }
.menu a { color: #fff; opacity: .92; padding:.5rem .8rem; border-radius: 12px; font-weight:600; }
.menu a.active, .menu a:hover { background: rgba(255,255,255,.12); }

.hero { padding: 4rem 0 2rem; }
.hero h1 { font-size: clamp(40px, 6vw, 68px); margin: 0 0 .6rem 0; line-height:1.05; }
.hero p { font-size: clamp(18px, 2.4vw, 22px); color: var(--ab-muted); margin: 0 0 1.5rem 0; }
.stats { display:grid; grid-template-columns: repeat(3,1fr); gap:1rem; }
.stat { background:#fff; border-radius:18px; padding:1rem; box-shadow: 0 8px 22px rgba(13,32,88,.12); }
.stat .k { font-size: 28px; font-weight: 900; }

.card { background:#fff; border-radius:18px; padding:1.2rem; box-shadow:0 8px 22px rgba(13,32,88,.1); }
.section { padding: 2.5rem 0; }
.section h2 { font-size: clamp(28px,3.2vw,38px); margin:0 0 .5rem; }
.table { width:100%; border-collapse: collapse; overflow:hidden; border-radius:16px; }
.table th { background: var(--ab-blue); color:#fff; padding:.8rem; text-align:left; }
.table td { padding:.8rem; border-bottom:1px solid rgba(13,32,88,.12); }
.badge { background: var(--ab-green); color: var(--ab-blue); font-weight:800; padding:.25rem .6rem; border-radius:999px; font-size:.7rem; }

footer.site-footer { background: var(--ab-blue); color:#fff; margin-top:3rem; }
.footer-grid { display:grid; gap:1rem; grid-template-columns: 1fr; }
@media (min-width: 900px) { .footer-grid { grid-template-columns: 1.2fr .8fr .8fr; } }

.post-card { background:#fff; border-radius:18px; padding:1.2rem; box-shadow:0 8px 20px rgba(13,32,88,.08); display:flex; flex-direction:column; }
.post-card h3 { margin:.2rem 0; }
.post-card a.more { margin-top:auto; font-weight:700; }

/* Animaciones */
.reveal { opacity:0; transform: translateY(12px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity:1; transform: none; }
.float { animation: floatY 6s ease-in-out infinite; }
@keyframes floatY { 0% { transform: translateY(0) } 50% { transform: translateY(-8px) } 100% { transform: translateY(0) } }
.parallax { transform: translateY(var(--py, 0px)); will-change: transform; }

/* Accesibilidad */
.skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { position:static; width:auto; height:auto; padding:.5rem; background:#fff; }