/* Equipación: extensión local de la identidad editorial oscura de la portada. */
@import url("/css/pages.css");

body { color: #f7f3ef; background: #111216; }
.season-banner { background: linear-gradient(90deg, #641824, #a81725 52%, #641824); box-shadow: inset 0 -1px rgb(255 255 255 / 8%); }
.site-header { color: #f7f3ef; background: rgb(17 18 22 / 96%); border-bottom-color: rgb(255 255 255 / 9%); box-shadow: 0 0.9rem 2.5rem rgb(0 0 0 / 22%); }
.site-header .brand { color: #f7f3ef; }
.site-header .brand-copy small { color: #aaa7aa; }
.site-header .menu-toggle { color: #f7f3ef; background: rgb(255 255 255 / 6%); border-color: rgb(255 255 255 / 16%); }
.primary-navigation { color: #f7f3ef; background: #111216; }
.primary-navigation li { border-bottom-color: rgb(255 255 255 / 12%); }
.primary-navigation li a { color: #ced1d6; }
.primary-navigation li a:hover, .primary-navigation li a:focus-visible { color: #fff; }
main#contenido { color: #f7f3ef; background: #111216; }
main#contenido > .section { background: #111216; }
main#contenido > .section:first-of-type { background: radial-gradient(circle at 88% 6%, rgb(105 25 42 / 16%), transparent 24rem), #111216; }

.section-heading h2, .page-cta h2, .product-grid h3 { color: #f7f3ef; font-family: var(--font-display); font-weight: 900; text-transform: uppercase; }
.section-heading > p:last-child { color: #aaa7aa; }
.product-grid { gap: 1rem; }
.product-grid article { position: relative; min-height: 12rem; padding: clamp(1.2rem, 3vw, 1.65rem); border: 1px solid rgb(255 255 255 / 9%); border-radius: 0.9rem; background: radial-gradient(circle at 100% 0%, rgb(136 28 45 / 14%), transparent 11rem), #1b1c21; box-shadow: 0 0.8rem 2rem rgb(0 0 0 / 18%); transition: border-color var(--transition-fast), background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.product-grid article::after { position: absolute; right: 1.35rem; bottom: 1.25rem; width: 2rem; height: 2px; background: #d92231; content: ""; }
.product-grid article:hover { border-color: rgb(255 98 107 / 38%); background: radial-gradient(circle at 100% 0%, rgb(153 31 50 / 22%), transparent 12rem), #202126; box-shadow: 0 1.2rem 2.5rem rgb(0 0 0 / 26%); transform: translateY(-0.2rem); }
.product-grid article > span { margin-bottom: 1rem; color: #ff7480; font-size: 0.68rem; letter-spacing: 0.14em; }
.product-grid h3 { margin-bottom: 0.7rem; font-size: clamp(1.3rem, 2.5vw, 1.8rem); line-height: 0.98; letter-spacing: -0.035em; }
.product-grid p { max-width: 32ch; color: #aaa7aa; line-height: 1.55; }

.page-cta { position: relative; overflow: hidden; border-top: 1px solid rgb(255 255 255 / 8%); border-bottom: 1px solid rgb(255 255 255 / 8%); background: linear-gradient(115deg, rgb(100 24 36 / 96%), rgb(55 17 25 / 98%)), url("/assets/images/torneo-club.webp") center / cover; }
.page-cta h2 { color: #fff; }
.page-cta p { color: #e2dadd; }
.page-cta .button { color: #17191d; background: #f7f3ef; box-shadow: 0 0.8rem 1.8rem rgb(0 0 0 / 18%); }
.page-cta .button:hover, .page-cta .button:focus-visible { color: #17191d; background: #fff; box-shadow: 0 1rem 2rem rgb(0 0 0 / 28%); }

.site-footer { color: #aaa7aa; background: radial-gradient(circle at 82% 0%, rgb(100 22 35 / 18%), transparent 30rem), linear-gradient(180deg, #15161a, #111216); border-top: 1px solid rgb(232 38 55 / 28%); }
.site-footer .brand { color: #f7f3ef; }
.site-footer .brand-copy small, .site-footer .footer-brand p { color: #8f8c90; }
.site-footer .footer-column h2 { color: #f7f3ef; }
.site-footer .footer-column a, .site-footer .footer-column span { color: #aaa7aa; }
.site-footer .footer-column a:hover, .site-footer .footer-column a:focus-visible, .site-footer .footer-bottom a:hover, .site-footer .footer-bottom a:focus-visible { color: #fff; }
.site-footer .footer-bottom { border-top-color: rgb(255 255 255 / 9%); color: #77757a; }

@media (min-width: 36rem) { .product-grid article { min-height: 13rem; } }
@media (min-width: 72rem) {
  .site-header .primary-navigation li a { color: #ced1d6; }
  .site-header .header-cta { color: #fff; background: linear-gradient(135deg, #641824, #8f2230); border: 1px solid rgb(255 108 121 / 24%); box-shadow: 0 0.75rem 1.8rem rgb(73 8 20 / 42%); }
  .site-header .header-cta:hover, .site-header .header-cta:focus-visible { background: linear-gradient(135deg, #7b1b29, #ac2636); border-color: rgb(255 121 132 / 42%); }
}
@media (max-width: 39.99rem) {
  .season-banner { gap: 0.5rem; padding-inline: 0.75rem; white-space: nowrap; }
  .season-banner > span:first-child { display: none; }
  .season-banner strong { max-width: calc(100vw - 4.5rem); overflow: hidden; text-overflow: ellipsis; font-size: 0.6rem; }
  .product-grid article { min-height: 0; }
  .page-cta .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .product-grid article { transition: none; } }