/* Sistema tipográfico global de Racing Hobbies.
   Anton: titulares y nombres de impacto.
   Archivo: interfaz, navegación, textos y datos. */

@font-face {
  font-family: "Anton";
  src: url("../assets/fonts/anton-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Archivo";
  src: url("../assets/fonts/archivo-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

html,
body,
button,
input,
select,
textarea,
option,
label,
table {
  font-family: "Archivo", Arial, sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.statement,
.page-hero h1,
.sec-title,
.feature-name,
.error-title,
.hero-title {
  font-family: "Anton", Impact, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
  font-synthesis: none;
}

.page-hero h1 .accent,
.sec-title .accent,
.big-quote .accent,
.ln-manifesto-copy .ln-serif {
  font-family: "Anton", Impact, sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
}

h1,
.page-hero h1,
.error-title,
.hero-title {
  line-height: 0.92 !important;
}

h2,
.sec-title,
.feature-name {
  line-height: 0.98 !important;
}

h3,
h4,
h5,
h6 {
  line-height: 1.06 !important;
}

.kicker,
.hero-meta,
.hero-proof,
.hero-foot,
.btn,
.add-btn,
.cart-btn,
.menu-btn,
.main-nav,
.site-footer,
.form-label,
.field-label,
.price,
.prod-price,
.tag,
.chip,
.badge,
.status,
.catalog-toolbar,
.search-wrap,
.sort-select {
  font-family: "Archivo", Arial, sans-serif !important;
}

strong,
b,
em,
small,
figcaption,
::placeholder {
  font-family: "Archivo", Arial, sans-serif;
}

/* Escala común para todas las secciones.
   La portada conserva su impacto, pero comparte el mismo ritmo con las
   páginas interiores: etiqueta, título, texto de apoyo y acción. */
:root {
  --type-kicker: 0.75rem;
  --type-body: 1rem;
  --type-section: clamp(2.8rem, 6vw, 5.6rem);
  --type-page-title: clamp(3.7rem, 8vw, 8rem);
}

body {
  font-size: var(--type-body);
  line-height: 1.55 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
}

/* Encabezados principales */
.page-hero h1 {
  max-width: 12ch !important;
  font-size: var(--type-page-title) !important;
  line-height: 0.92 !important;
  letter-spacing: 0.01em !important;
}

.sec-title,
.community-section .sec-title {
  font-size: var(--type-section) !important;
  line-height: 0.96 !important;
  letter-spacing: 0.01em !important;
  margin-top: 0.8rem !important;
}

.statement {
  font-size: clamp(3rem, 7.2vw, 6.5rem) !important;
  line-height: 0.92 !important;
  letter-spacing: 0.01em !important;
}

.feature-name {
  font-size: clamp(2.8rem, 5.6vw, 4.8rem) !important;
  line-height: 0.96 !important;
}

.big-quote {
  font-family: "Anton", Impact, sans-serif !important;
  font-size: clamp(2.2rem, 5vw, 4.4rem) !important;
  font-weight: 400 !important;
  line-height: 0.98 !important;
  letter-spacing: 0.01em !important;
}

/* Etiquetas y bajadas: mismo tamaño y respiración en cada sección. */
.kicker,
.hero-meta,
.hero-proof,
.feature-tag,
.brands-label,
.results-info {
  font-size: var(--type-kicker) !important;
  line-height: 1.3 !important;
  letter-spacing: 0.18em !important;
}

.page-hero > .container > p:not(.kicker),
.sec-sub,
.feature-price,
.feature p,
.step p,
.info-item p,
.info-item a,
.legal-content p,
.legal-content li,
.pit-band p {
  font-size: var(--type-body) !important;
  line-height: 1.58 !important;
}

/* Títulos de tarjetas y datos: una sola escala legible, sin herencias raras. */
.feature h3,
.step h3,
.tile-name,
.prod-name,
.prod-name button {
  font-family: "Archivo", Arial, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 760 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
}

.info-item h3,
.footer-col h3 {
  font-family: "Archivo", Arial, sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 760 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}

.info-item p,
.info-item a {
  font-weight: 600 !important;
}

.prod-cat,
.tile-cat,
.prod-price,
.add-btn,
.chip,
.catalog-rail-hint,
.catalog-toolbar,
.field label,
.footer-col a,
.footer-col li,
.footer-brand p,
.footer-bottom {
  font-family: "Archivo", Arial, sans-serif !important;
}

.prod-cat,
.tile-cat {
  font-size: 0.72rem !important;
  line-height: 1.35 !important;
  letter-spacing: 0.14em !important;
}

.prod-price {
  line-height: 1.15 !important;
}

.btn,
.add-btn {
  font-size: 0.76rem !important;
  line-height: 1.2 !important;
  letter-spacing: 0.14em !important;
}

.footer-col a,
.footer-col li,
.footer-brand p,
.footer-bottom {
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}

@media (max-width: 899px) {
  .page-hero h1 {
    font-size: clamp(3.4rem, 13vw, 6.6rem) !important;
  }

  .sec-title,
  .community-section .sec-title {
    font-size: clamp(2.7rem, 10vw, 4.8rem) !important;
  }
}

@media (max-width: 520px) {
  .page-hero h1 {
    font-size: clamp(3rem, 16vw, 5.3rem) !important;
  }

  .sec-title,
  .community-section .sec-title {
    font-size: clamp(2.5rem, 12vw, 4rem) !important;
  }

  .page-hero > .container > p:not(.kicker),
  .sec-sub,
  .feature p,
  .step p,
  .info-item p,
  .info-item a,
  .legal-content p,
  .legal-content li {
    font-size: 0.95rem !important;
    line-height: 1.55 !important;
  }
}