/* Home: misma familia de títulos y textos que las páginas internas.
   Se carga solo en index.html; no modifica listados ni minisitios. */
@font-face {
  font-family: "GuiaDisplay";
  src: url("TypoGraphica Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --home-font-display: "GuiaDisplay", "Arial Black", Arial, sans-serif;
  --home-font-text: Arial, sans-serif;
}

body {
  font-family: var(--home-font-text);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--home-font-display) !important;
  font-weight: 400 !important;
  letter-spacing: normal;
}

/* Controles y textos breves necesitan legibilidad, no la fuente decorativa.
   No seleccionar los iconos: Font Awesome conserva su propia familia. */
button, input, select, textarea,
.nav, .search-dropdown, .ig-body {
  font-family: var(--home-font-text);
}

.hero-search-title {
  letter-spacing: -0.015em;
}

/* Card names and the community count use the readable secondary family. */
.market-product-body h3,
.thumbnail-item :is(h2,h3,h4),
.footer :is(h2,h3,h4,h5,h6) {
  font-family: var(--home-font-text) !important;
  font-weight: 700 !important;
}

/* Preserve the original oversized gradient number in the community CTA. */
.call-to-action h2 {
  font-family: var(--home-font-text) !important;
  font-size: clamp(1.2rem, 2vw, 1.55rem) !important;
  font-weight: 700 !important;
  line-height: normal !important;
}

.call-to-action .cta-number {
  font-family: Arial, sans-serif !important;
  font-size: clamp(4.5rem, 12vw, 9.5rem) !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: .92 !important;
  margin: 12px 0 20px !important;
  background: linear-gradient(180deg, #fff, #d7e8f4) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  text-shadow: 0 22px 55px rgba(0,0,0,.32) !important;
}

/* Match the display typography used by guia.html and the category listings. */
#home-rubros-title,
.content > h2,
.market-products-section > h2,
.ig-header h1 {
  font-family: "GuiaDisplay", "Arial Black", Arial, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: -.3px;
  line-height: 1.15;
  text-transform: uppercase;
}

.ig-header h1 {
  text-shadow: none !important;
}

/* Category accordion labels use the secondary, more readable typeface. */
.category-section > .toggle-button {
  font-family: var(--home-font-text) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
}