/* ═══ Brujula Fiscal — Estilos compartidos ═══ */
/* Cambiar aca impacta en TODAS las paginas */

.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
body { background-color: #f7f9fc; font-family: 'Manrope', sans-serif; }
html { scroll-behavior: smooth; }

/* Animaciones */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate {
  animation: fadeUp 0.7s ease-out both;
  animation-play-state: paused;
}
.delay-1 { animation-delay: 0.15s; }
.delay-2 { animation-delay: 0.3s; }
.delay-3 { animation-delay: 0.45s; }

/* Nav */
.nav-mobile { display: none; }
.nav-mobile.open { display: flex; }
.nav-scrolled { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06); }

/* Responsive */
@media (max-width: 768px) {
  .hero-title { font-size: 32px !important; line-height: 40px !important; }
  .hero-sub { font-size: 16px !important; line-height: 24px !important; }
  .section-display { font-size: 28px !important; line-height: 36px !important; }
  .cta-title { font-size: 28px !important; line-height: 36px !important; }
  .bento-title { font-size: 28px !important; line-height: 36px !important; }
  .stat-number { font-size: 28px !important; line-height: 36px !important; }
  .article-title { font-size: 28px !important; line-height: 36px !important; }
}

/* Servicios acordeon */
.svc-panel { max-height: 0; overflow: hidden; transition: max-height 0.5s ease; }
.svc-accordion.active .svc-panel { max-height: 1200px; }
.svc-accordion.active .svc-chevron { transform: rotate(180deg); }
.svc-chevron { transition: transform 0.3s ease; }

/* FAQ (solo index) */
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.faq-item.active .faq-answer { max-height: 200px; }
.faq-item.active .faq-chevron { transform: rotate(180deg); }
.faq-chevron { transition: transform 0.3s ease; }

/* Plan featured (solo index) */
.plan-featured { border: 2px solid #2563eb; position: relative; }
.plan-featured::before {
  content: 'Mas elegido';
  position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
  background: #2563eb; color: white; font-size: 12px; font-weight: 700;
  padding: 4px 16px; border-radius: 9999px; letter-spacing: 0.05em;
}

/* Blog filtros */
.blog-filter { background: #edf1f7; color: #475569; border: 1px solid transparent; }
.blog-filter:hover { background: #dbe1ec; }
.blog-filter.active { background: #2563eb; color: #ffffff; border-color: #2563eb; }
.blog-card.hidden-by-filter { display: none; }

/* Blog articulo content */
.article-content h2 { font-family: 'Noto Serif', serif; font-size: 22px; line-height: 28px; font-weight: 600; color: #0f172a; margin-top: 2rem; margin-bottom: 0.75rem; }
.article-content h3 { font-family: 'Noto Serif', serif; font-size: 18px; line-height: 24px; font-weight: 600; color: #0f172a; margin-top: 1.5rem; margin-bottom: 0.5rem; }
.article-content p { font-size: 16px; line-height: 28px; color: #475569; margin-bottom: 1rem; }
.article-content ul, .article-content ol { margin-bottom: 1rem; padding-left: 1.5rem; }
.article-content li { font-size: 16px; line-height: 28px; color: #475569; margin-bottom: 0.5rem; }
.article-content ul li { list-style-type: disc; }
.article-content ol li { list-style-type: decimal; }
.article-content strong { color: #0f172a; font-weight: 600; }
.article-content a { color: #2563eb; text-decoration: underline; text-underline-offset: 3px; }
.article-content a:hover { color: #1d4ed8; }
.article-content blockquote { border-left: 4px solid #2563eb; padding-left: 1rem; margin: 1.5rem 0; font-style: italic; color: #475569; }
.article-content table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; }
.article-content th, .article-content td { border: 1px solid #e2e8f0; padding: 0.75rem 1rem; text-align: left; font-size: 14px; }
.article-content th { background: #f2f5fa; font-weight: 600; color: #0f172a; }
.article-content td { color: #475569; }
