/* 100% FUTBOL - dual-surface visual layer and live offer carousel.
   Loaded after the existing styles; inventory and authentication are untouched. */
.storefront-page {
  background: #d9e8df url("assets/canchas-futbol.svg") center top / 1920px auto repeat-y fixed;
}
.storefront-page [hidden] { display:none !important; }
.visually-hidden { position:absolute!important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.storefront-page header { background:rgba(249,253,249,.97); box-shadow:0 2px 15px rgba(18,56,42,.035); }
.storefront-page .hero-wrap { background:transparent; }
.hero-wrap::before {
  inset:0; background:linear-gradient(90deg,rgba(13,47,33,.74),rgba(18,65,42,.55) 34%,rgba(20,70,61,.1) 64%,rgba(21,66,92,.02)),url("assets/canchas-futbol.svg") center / cover;
  opacity:1; transform:none;
}
.hero-wrap::after { display:none; }
.storefront-page .hero { min-height:650px; gap:70px; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); padding:46px 0 52px; }
.surface-pills { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:29px; }
.surface-pill { display:inline-flex; align-items:center; gap:8px; border-radius:6px; padding:8px 11px; color:#eafce8; background:rgba(220,250,215,.075); border:1px solid rgba(208,238,193,.36); font-size:.62rem; font-weight:800; letter-spacing:.13em; }
.surface-pill>span { font:500 .64rem ui-monospace,monospace; opacity:.8; }
.surface-indoor { color:#f1fbff; background:rgba(172,221,242,.12); border-color:rgba(172,221,242,.45); }
.storefront-page .hero h1 { color:#ffffff; font-size:clamp(3rem,5.2vw,4.7rem); line-height:1.02; letter-spacing:-.064em; margin:21px 0 24px; text-shadow:0 3px 25px rgba(9,30,22,.1); }
.storefront-page .hero h1>span { color:#b9f6b5; }
.hero-copy>.eyebrow { color:#c3edcb; font-size:.61rem; letter-spacing:.14em; }
.hero-copy .eyebrow-line { background:#b9f6b5; }
.storefront-page .hero-copy>p { color:#e1eee6; font-size:1rem; line-height:1.8; max-width:470px; }
.hero-copy .hero-actions { margin-top:27px; }
.hero-copy .hero-actions .btn { background:#b3f2b4; border:1px solid #b3f2b4; box-shadow:0 8px 24px rgba(15,43,27,.14); }
.hero-copy .hero-actions .btn.secondary { background:rgba(235,250,246,.05); border-color:#9fbbb0; color:#f8fcf8; box-shadow:none; }
.hero-copy .hero-actions .btn.secondary:hover { background:rgba(237,248,246,.15); border-color:#eaf8ef; color:#fff; }
.hero-copy .hero-signature { color:#c5dccf; font-size:.58rem; }
.hero-copy .hero-signature strong { color:#e0eee7; }
.hero-copy .hero-signature .ui-icon { color:#baddeb; }
.hero-copy a:focus-visible { outline-color:#d1f4c1; }
.sport-ribbon { background:rgba(237,249,237,.93); border-color:rgba(233,249,235,.4); backdrop-filter:blur(6px); }
.sport-ribbon>.container { color:#285345; }
.sport-ribbon .ribbon-city { color:#246780; }
/* The court pattern continues behind light, readable content panels. */
.storefront-page .section { background:rgba(235,246,237,.955); border-bottom:1px solid rgba(116,163,140,.16); }
.storefront-page #marcas { background:rgba(231,243,234,.935); }
.storefront-page #productos { background:rgba(239,248,243,.965); }
.storefront-page #ofertas { background:rgba(226,240,244,.95); border-top:1px solid #c8dfdc; }
.storefront-page #tienda { background:rgba(236,246,235,.96); }
.storefront-page .section h2 { color:#183b31; }
.storefront-page a.brand-tile { background:rgba(253,255,253,.88); border-color:#bfd8c8; box-shadow:0 6px 18px rgba(30,69,49,.04); }
.storefront-page a.brand-tile:hover { box-shadow:0 14px 26px rgba(30,69,49,.08); }
.storefront-page .product-card { border-color:#c6ddd2; }
.storefront-page .city-banner { box-shadow:0 10px 35px rgba(36,78,70,.05); }
.storefront-page footer { background:#e6f0e9; border-color:#c9dcd0; }
/* Homepage carousel: photo and prices come from the published inventory. */
.storefront-page .offer-carousel {
  width:100%; min-height:0; padding:23px 26px 0; border-radius:22px; overflow:hidden;
  border:1px solid rgba(245,255,243,.9); background:rgba(251,254,249,.975);
  box-shadow:0 26px 60px rgba(8,45,40,.22),0 2px 7px rgba(15,50,40,.08); color:#163d2c;
  align-self:center;
}
.offer-carousel::before { display:none; }
.offer-carousel::after { inset:0 0 auto; width:100%; height:4px; border-radius:0; background:linear-gradient(90deg,#b3efad 0 57%,#8dc7dc 57% 92%,#d7d5a7 92%); }
.offer-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:17px; }
.offer-topline .match-label { color:#366950; font-size:.59rem; letter-spacing:.14em; }
.offer-topline .match-label i { background:#419a5b; }
.offer-counter { flex-shrink:0; display:inline-flex; padding:6px 8px; border:1px solid #c9dbcd; border-radius:5px; font:.67rem ui-monospace,monospace; letter-spacing:.04em; color:#326252; }
.offer-slide { min-width:0; }
.offer-kicker { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:6px; color:#3d717c; font-size:.61rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; }
.offer-kicker .surface-divider { width:20px; height:1px; background:#a9c6c4; }
.offer-product-name { font-size:clamp(1.4rem,2.1vw,1.85rem); line-height:1.14; font-weight:850; letter-spacing:-.038em; margin:0; color:#203e32; min-height:2.28em; overflow-wrap:anywhere; }
.offer-image-stage { margin:8px 0 14px; height:179px; position:relative; display:grid; place-items:center; isolation:isolate; border-radius:14px; overflow:hidden; background:linear-gradient(124deg,#e8f3e3,#f4f8ec 46%,#e5f0f2); }
.offer-image-stage::before { content:""; position:absolute; width:70%; height:65%; border:1px solid rgba(57,123,79,.12); border-radius:50%; z-index:-1; transform:rotate(-11deg); box-shadow:0 0 0 23px rgba(177,209,180,.13),0 0 0 48px rgba(177,209,180,.07); }
.offer-image-stage::after { content:""; position:absolute; left:0; bottom:0; width:72px; height:40px; background:repeating-linear-gradient(135deg,transparent 0 8px,rgba(80,150,157,.13) 8px 9px); }
.offer-product-image { display:block; width:100%; height:179px; object-fit:contain; padding:10px 16px; position:relative; z-index:1; }
.offer-placeholder { width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; padding:10px 14px; }
.offer-placeholder img { width:205px; height:114px; object-fit:contain; opacity:.75; }
.offer-placeholder span { color:#3f6970; font-size:.57rem; letter-spacing:.13em; font-weight:800; }
.offer-price-row { display:flex; gap:21px; align-items:center; flex-wrap:wrap; min-height:64px; }
.offer-price-block { display:flex; flex-direction:column; gap:5px; }
.offer-price-block .price-caption { font-size:.58rem; color:#61776b; font-weight:650; letter-spacing:.1em; text-transform:uppercase; }
.offer-old { color:#7a827b; font-size:1.45rem; line-height:1.2; font-weight:600; text-decoration-thickness:1.6px; text-decoration-color:#8b938d; white-space:nowrap; }
.offer-current-block { flex:1; }
.offer-current-block .price-caption { color:#397645; }
.offer-current { color:#21653a; font-size:clamp(2.3rem,3.25vw,2.85rem); line-height:1; letter-spacing:-.05em; white-space:nowrap; font-weight:900; }
.offer-price-block + .offer-current-block { border-left:1px solid #cadbcd; padding-left:21px; }
.offer-sizes { margin:11px 0 14px!important; font-size:.67rem!important; color:#617467!important; line-height:1.55!important; }
.storefront-page .offer-contact { width:100%; padding:12px 16px; justify-content:space-between; background:#b7f0b5; border:1px solid #a9dca9; color:#25492b; font-size:.78rem; border-radius:8px; box-shadow:none; }
.offer-contact>svg { flex-shrink:0; }
.offer-footer { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 0; border-top:1px solid #d8e6d7; margin-top:17px; }
.offer-timing { display:flex; align-items:center; gap:9px; min-width:0; color:#688272; font-size:.57rem; line-height:1.6; }
.offer-timing strong { font-weight:600; color:#376957; }
.timing-icon { width:31px; height:31px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #bed7c4; border-radius:50%; font:700 .73rem ui-monospace,monospace; color:#447b55; flex-shrink:0; }
.timing-icon>span { font-size:.54rem; }
.offer-controls { display:flex; align-items:center; gap:5px; }
.offer-control { display:grid; place-items:center; width:35px; height:35px; border-radius:50%; border:1px solid #c5d8c8; background:#f4faf2; padding:0; color:#316448; cursor:pointer; }
.offer-control:hover { background:#e3f3df; border-color:#89b696; }
.offer-control:focus-visible { outline:3px solid #2e7895; outline-offset:3px; }
.offer-control.offer-pause { background:#e5f1e7; font-size:.75rem; font-weight:800; }
.offer-progress { height:3px; margin:0 -26px; background:#dcebdd; overflow:hidden; }
.offer-progress>span { display:block; height:100%; background:linear-gradient(90deg,#6db577,#73b3ca); transform-origin:left; transform:scaleX(0); }
.offer-empty { min-height:392px; display:flex; flex-direction:column; justify-content:center; gap:12px; }
.offer-empty>img { width:165px; height:90px; align-self:center; opacity:.5; }
.offer-empty h2 { color:#254c38; font-size:1.7rem; letter-spacing:-.04em; line-height:1.15; margin:0; }
.storefront-page .hero .offer-empty p { font-size:.85rem; line-height:1.7; color:#63776b; }
.offer-empty .btn { margin-top:10px; align-self:start; }
.offer-slide.is-entering { animation:offer-enter .24s ease-out; }
@keyframes offer-enter { from { opacity:.45; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
/* Catalogue is still on the same routes, with the same search and filters. */
.storefront-page.catalog-page { background:linear-gradient(rgba(239,248,242,.9),rgba(228,241,237,.94)),url("assets/canchas-futbol.svg") center top / 1920px auto repeat-y fixed; }
.catalog-page .catalog-hero::before { opacity:.08; }
.catalog-page .catalog-hero h1 { color:#224738; }
.catalog-page .catalog-brand-tabs>a { background:#f9fdf8; }
.catalog-page .catalog-brand-tabs>a.is-active { background:#c1eebf; }
.catalog-page .catalog-search-input,.catalog-page .catalog-field select { background:rgba(255,255,255,.92); }
@media(min-width:801px) { .storefront-page .hero h1>span { white-space:nowrap; } }
@media(max-width:1100px) and (min-width:801px) {
 .storefront-page .hero { gap:32px; grid-template-columns:minmax(0,1.07fr) minmax(0,1fr); }
 .storefront-page .hero h1 { font-size:clamp(2.6rem,5.4vw,4.3rem); }
 .storefront-page .offer-carousel { padding:22px 21px 0; }
 .offer-progress { margin:0 -21px; }
 .offer-product-name { font-size:1.45rem; }
 .hero-copy>.eyebrow { font-size:.5rem; }
 .hero-copy>.hero-signature { font-size:.49rem; }
 .offer-price-row { gap:15px; }
 .offer-price-block + .offer-current-block { padding-left:15px; }
 .offer-old { font-size:1.23rem; }
 .offer-current { font-size:2.35rem; }
}
@media(max-width:800px) {
 .storefront-page .hero { grid-template-columns:1fr; gap:33px; min-height:0; padding:36px 0 40px; }
 .hero-wrap::before { background:linear-gradient(180deg,rgba(13,47,33,.74) 0%,rgba(20,66,49,.47) 44%,rgba(32,85,92,.04) 72%),url("assets/canchas-futbol.svg") center / cover; }
 .hero-copy { max-width:600px; }
 .storefront-page .hero h1 { font-size:clamp(3rem,9vw,5rem); margin:19px 0 19px; }
 .hero-copy>.eyebrow { font-size:.55rem; }
 .surface-pills { margin-bottom:25px; }
 .hero-copy .hero-signature { margin-top:22px; }
 .storefront-page .offer-carousel { max-width:550px; margin:0 auto; }
 .offer-product-name { font-size:1.75rem; min-height:2.28em; }
 .offer-image-stage,.offer-product-image { height:215px; }
 .offer-current { font-size:2.85rem; }
 .storefront-page.catalog-page,.storefront-page { background-attachment:scroll; }
}
@media(max-width:480px) {
 .storefront-page .hero { gap:29px; padding-top:30px; }
 .storefront-page .hero h1 { font-size:clamp(2.9rem,10.4vw,4rem); }
 .storefront-page .hero-copy>p { font-size:.87rem; line-height:1.75; }
 .hero-copy>.eyebrow { font-size:.49rem; letter-spacing:.09em; }
 .surface-pills { margin-bottom:24px; }
 .surface-pill { padding:7px 9px; font-size:.57rem; }
 .hero-copy .hero-actions { gap:9px; }
 .hero-copy .hero-actions .btn { padding:12px 16px; font-size:.78rem; }
 .hero-copy .hero-signature { font-size:.47rem; gap:6px; letter-spacing:.04em; }
 .storefront-page .offer-carousel { border-radius:18px; padding:21px 20px 0; }
 .offer-product-name { font-size:1.55rem; }
 .offer-image-stage,.offer-product-image { height:182px; }
 .offer-placeholder img { height:115px; }
 .offer-price-row { gap:15px; }
 .offer-price-block + .offer-current-block { padding-left:15px; }
 .offer-old { font-size:1.3rem; }
 .offer-current { font-size:2.55rem; }
 .offer-progress { margin:0 -20px; }
 .offer-topline .match-label { font-size:.51rem; }
 .offer-counter { font-size:.62rem; }
 .offer-control { width:33px; height:33px; }
 .offer-controls { gap:4px; }
 .offer-timing { font-size:.5rem; gap:6px; }
 .timing-icon { width:28px; height:28px; }
 .storefront-page .section { padding-top:40px; }
}
@media(max-width:360px) {
 .offer-price-row { gap:10px; }
 .offer-price-block + .offer-current-block { padding-left:10px; }
 .offer-old { font-size:1.15rem; }
 .offer-current { font-size:2.05rem; }
 .offer-price-block .price-caption { font-size:.51rem; }
 .offer-timing .timing-icon { display:none; }
 .offer-product-name { font-size:1.4rem; }
 .hero-copy .hero-actions .btn { padding:11px 13px; }
 .storefront-page .hero h1 { font-size:9.7vw; }
}
@media(prefers-reduced-motion:reduce) {
 .offer-slide.is-entering { animation:none; }
 .offer-progress>span { transition:none!important; }
}