/* ==========================================================
   IMPAKT — Design System · Clases Utilitarias Custom
   shared/styles.css
   ========================================================== */

/* Textura de papel (grain) — fondo global de la plataforma */
.bg-grain {
  background-color: #FDFCF5;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
}

/* Panel glass (blur) — navbar y modales */
.glass-panel {
  @apply bg-white/80 backdrop-blur-xl border border-oxford-navy/10 shadow-xl;
}

/* Patrón geométrico de puntos */
.geo-pattern {
  background-image: radial-gradient(rgba(15, 23, 42, 0.05) 1.5px, transparent 1.5px);
  background-size: 24px 24px;
}

/* Título de sección — coherente con marketplace / consultorías */
.text-heading {
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 800;
  letter-spacing: -0.025em;
}
@media (min-width: 640px) {
  .text-heading {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

/* Material Symbols — evita que Inter herede y rompa ligaduras (p. ej. format_quote → "99") */
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

/* ===== Shimmer — Consultorías (Navbar) ===== */
/* Color base naranja sutil y raja de luz diagonal constante */
@keyframes shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.shimmer-consultorias {
  position: relative;
  font-weight: 600;
  background: linear-gradient(
    90deg,
    #FF8F1F 0%,
    #FFD8A8 40%,
    #FFFFFF 50%,
    #FFD8A8 60%,
    #FF8F1F 100%
  );
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: shimmer 5s linear infinite;
}