/* Streetball editorial 2026 — redesign aprovado. Preserva catálogo, checkout e painel. */
:root{--black:#151518;--ink:#1b1b21;--muted:#6d6b75;--line:#d6d5da;--paper:#efeff0;--wash:#dddddf;--lime:#818bd5;--accent:#818bd5;--accent-deep:#616bc5;--max:1470px}
body{background:#e6e6e8;color:var(--ink)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline-color:#5b63b9}
.demo-notice{background:#f5f1e9;color:#574838;border-bottom-color:#e9ddd0}
.announcement{background:#18181d;color:#e9e9ef}
.dot{background:#818bd5}
.site-header{background:#e3e3e6;border-bottom:1px solid #cfcfd4}
.header-main{height:89px;grid-template-columns:245px minmax(350px,1fr) 190px auto;gap:28px}
.brand-icon{display:none}
.brand-word{font-size:35px;letter-spacing:-.024em;line-height:.77;font-style:italic;font-weight:900}
.brand-word small{font-size:10px;letter-spacing:.64em;font-style:normal;text-align:center;margin-top:11px}
.brand-spark{color:#17171b;font-size:25px}
.primary-nav{display:flex;align-items:center;justify-content:center;gap:clamp(16px,2vw,35px)}
.primary-nav a{font-size:13px;font-weight:700;padding:12px 2px;border-bottom:2px solid transparent;white-space:nowrap}
.primary-nav a:hover,.primary-nav a.active{border-color:var(--accent);color:#4245a1}
.search-box{background:#f3f2f6;border-color:#d3d4d9;max-width:220px;height:42px}
.search-box kbd{display:none}
.header-actions{gap:12px}
.account-menu-wrap{position:relative}
.account-trigger{display:flex;align-items:center;gap:9px;border:0;background:#c6c6d2;border-radius:7px;padding:10px 13px;min-height:43px;color:#18181c;font-size:12px;font-weight:800}
.account-trigger svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.account-menu{position:absolute;right:0;top:calc(100% + 9px);z-index:50;width:218px;background:#f9f9fb;box-shadow:0 20px 55px #12122125;border:1px solid #d9d9e2;border-radius:7px;padding:7px}
.account-menu[hidden]{display:none}
.account-menu a{display:block;padding:12px 11px;font-size:12px;font-weight:650;color:#2c2c38;border-radius:4px}
.account-menu a:hover,.account-menu a:focus-visible{background:#e2e3fa;color:#252b70}
.cart-count{background:#777ee0}
.desktop-nav{background:#e6e6e9;border-color:#d4d4d9}
.nav-inner{height:39px;justify-content:center;flex-wrap:wrap;gap:clamp(9px,2vw,30px)}
.nav-inner button{color:#50505e;font-size:10px;letter-spacing:.03em}
.nav-inner button.active{border-color:var(--accent);color:#343d91}
.hero{background:#d7d7dc;color:#151518;position:relative}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 65% 20%,#eeeeef95,transparent 65%),repeating-linear-gradient(40deg,transparent 0 22px,#fff2 23px,transparent 24px);pointer-events:none}
.hero-layout{grid-template-columns:minmax(320px,42%) minmax(0,58%);min-height:530px;height:clamp(520px,41vw,680px);position:relative;z-index:1}
.hero-copy{padding:42px 0 60px;justify-content:center}
.eyebrow{color:#42414b;letter-spacing:.28em}
.eyebrow-line{background:var(--accent)}
.hero h1{font-size:clamp(94px,10.2vw,166px);font-weight:900;line-height:.76;letter-spacing:-.05em;margin:25px 0 24px;color:#111114;text-shadow:none}
.hero h1 em{color:#151518}
.hero-copy>p{font-size:13px;letter-spacing:.21em;line-height:1.8;max-width:430px;text-transform:uppercase;color:#42404b;font-weight:700}
.hero-buttons{gap:12px;flex-wrap:wrap}
.btn-accent{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-accent:hover{background:#626cca}
.btn-ghost{border-color:#1d1d23;color:#1d1d23;background:transparent}
.btn-ghost:hover{background:#fff;border-color:#202028}
.hero-footer{display:none}
.hero-slider-controls{display:flex;gap:8px;margin-top:29px;align-items:center}
.hero-dot{width:10px;height:10px;border-radius:100%;padding:0;border:0;background:#b7b7bf}
.hero-dot[aria-current="true"]{background:#757cde;transform:scale(1.18)}
.hero-art{position:relative;isolation:isolate;align-items:center;justify-content:center;overflow:visible}
.hero-brush{position:absolute;background:#7e86de;width:180px;height:430px;top:5%;left:8%;transform:rotate(18deg);opacity:.58;clip-path:polygon(11% 0%,90% 0%,60% 35%,99% 44%,70% 100%,0% 92%,30% 48%)}
.hero-notes{position:absolute;right:4%;bottom:9%;color:#383844;font:700 15px/1.5 'Barlow Condensed',Impact,sans-serif;transform:rotate(-8deg);letter-spacing:.1em;z-index:4}
.editorial-hero-scene{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .65s ease}
.editorial-hero-scene.active{opacity:1;pointer-events:auto}
.editorial-frame{position:absolute;background:#f4f4f7;padding:10px 10px 35px;box-shadow:1px 18px 25px #2225;overflow:hidden;border:1px solid #ffffffbb;transition:transform .6s}
.editorial-frame img{width:100%;height:100%;object-fit:cover;display:block;background:#d0d0d4}
.editorial-frame.main{width:49%;height:79%;left:27%;top:10%;transform:rotate(4deg);z-index:3}
.editorial-frame.left{width:27%;height:54%;left:0;top:10%;transform:rotate(-7deg);z-index:2}
.editorial-frame.right{width:29%;height:53%;right:0;top:4%;transform:rotate(9deg);z-index:1}
.editorial-frame.low{width:28%;height:44%;right:4%;bottom:1%;transform:rotate(-8deg);z-index:4}
.editorial-frame.low-left{width:25%;height:36%;left:5%;bottom:4%;transform:rotate(7deg);z-index:2}
.editorial-frame::after{content:'FOOTBALL ARCHIVES   /   STREETBALL';position:absolute;bottom:8px;left:12px;color:#4b4a55;font:700 9px/1 Arial,sans-serif;letter-spacing:.08em}
.editorial-frame img[src=""]{visibility:hidden}
.hero-sideword,.hero-bgnum,.hero-disc,.hero-jersey,.hero-corner{display:none!important}
.service-strip{background:#818bd5}
.service-grid{min-height:128px;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.service-grid .service-item{display:flex;align-items:center;gap:20px;padding:22px 30px;color:#101018;min-width:0;position:relative}
.service-grid .service-item:not(:last-child):after{content:'';width:1px;height:55%;right:0;top:22%;position:absolute;background:#393d7460}
.service-grid .service-item b{font:800 53px/1 'Barlow Condensed',Impact,sans-serif;color:#111;margin:0}
.service-item .service-icon{font-size:26px;flex:none;width:32px;height:32px;display:block}.service-item .service-icon svg{width:32px;height:32px;display:block}
.service-item strong{font-size:12px;line-height:1.4;letter-spacing:.05em;display:block}
.service-item small{font-size:11px;font-weight:500;line-height:1.45;display:block;margin-top:8px;letter-spacing:0;color:#202241}
.service-item a{text-decoration:none;border-bottom:1px solid #202241;padding-bottom:1px}
.shipping-disclosure{padding:13px 0!important;font-size:11px!important;line-height:1.6!important;color:#555562!important;border-bottom:1px solid #d2d2d8}
.shipping-disclosure a{text-decoration:underline}
.category-section{padding-top:74px;padding-bottom:76px}
.section-head .micro{color:#5e5e6b}
.section-head h2,.story-copy h2{color:#111}
.section-head h2 i,.story-copy h2 i{color:#7a84d1}
.category-section .section-head h2{font-size:clamp(42px,5.9vw,78px);max-width:680px}
.category-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.category-tile{min-height:250px;display:flex;align-items:flex-end;text-align:left;justify-content:flex-end;flex-direction:column;padding:18px;background:#2c2c34;border-radius:6px;border:0;color:white;box-shadow:0 4px 16px #1c1c2515}
.category-tile:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0e102007 5%,#0e0d17df 95%);z-index:1}
.category-tile:hover{background:#22222d;transform:translateY(-5px)}
.category-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(.88)}
.category-tile strong,.category-tile small,.category-tile .category-arrow{position:relative;z-index:2;align-self:flex-start;line-height:1.2}
.category-tile strong{font-size:29px;color:#fff}
.category-tile small{font-size:11px;color:#e5e4ef;letter-spacing:0;text-transform:none;font-weight:500;margin-top:5px;max-width:220px;line-height:1.5}
.category-arrow{border:1px solid white;border-radius:50%;width:31px;height:31px;display:grid;place-items:center;margin-top:11px}
.catalog-section{background:#f0f0f2}
.filter-tag.active,.br-club.active{background:#777fd0;border-color:#777fd0}
.br-club.active:hover{background:#6570c4}
.br-club.active .br-club-count{color:white}
.br-club:hover{background:#ebebff;border-color:#b8b8df}
.product-image{background:#fff}
.label-chip.highlight{background:#818bd5!important;color:white!important}
.story-section{background:#cbcad9}
.story-visual{background:#171721}
.story-visual::after{border-color:#888ace}
.story-big{color:#9198e4}
.story-big span{color:#c6c7f3}
.story-visual-caption{color:#dadbea}
.story-copy .micro{color:#4e4b77}
.site-footer{background:#16161d;color:#f0eff6}
.brand-light .brand-icon{color:#9aa4ff}
.footer-top button,.footer-top a:not(.brand){color:#bbb8ca}
.footer-brand p{color:#b1afbb}
.footer-top>div>p:not(.small-note){color:#b0aebb}
.toast{background:#23233b}
.br-club:focus-visible{outline-color:#777fd0}
.checkout-grand-total strong{color:#26264a}
.category-shirt{display:none}
.primary-nav a:focus-visible,.account-menu a:focus-visible{outline-color:#515ab2}
.account-header-nav{display:flex;align-items:center;justify-content:center;gap:28px}
.account-header-nav a{color:#25252c;font-size:13px;font-weight:700;padding-bottom:4px}
.account-header-nav a:hover{border-bottom:2px solid #818bd5}
.editorial-account-head{grid-template-columns:240px 1fr auto}
@media(max-width:850px){.account-header-nav{display:none}.editorial-account-head{grid-template-columns:1fr auto}}
@media(max-width:510px){.editorial-account-head .btn-outline{font-size:10px;padding:12px}}

@media(max-width:1160px){.header-main{grid-template-columns:210px 1fr 175px auto;gap:15px}.primary-nav{gap:16px}.primary-nav a{font-size:12px}.hero h1{font-size:clamp(85px,10vw,120px)}.service-grid .service-item{gap:12px;padding:18px}}
@media(max-width:890px){.header-main{grid-template-columns:40px 1fr auto;height:80px}.primary-nav{display:none}.search-box{display:none}.menu-toggle,.search-mobile{display:grid}.brand-word{font-size:28px}.header-actions{gap:9px}.account-trigger{padding:8px}.account-trigger span{display:none}.account-menu{right:-42px}.desktop-nav{position:absolute;top:auto;left:0;right:0;z-index:20;display:none}.desktop-nav.mobile-open{display:block}.nav-inner{height:auto;display:grid;grid-template-columns:repeat(2,1fr);padding:16px;gap:3px}.nav-inner button{height:35px;text-align:left}.search-box.open{display:flex;top:78px;left:12px;right:12px;max-width:none;z-index:40}.hero-layout{grid-template-columns:1fr;min-height:620px;height:auto}.hero-copy{padding:58px 0 90px;z-index:8}.hero h1{font-size:clamp(76px,14vw,130px)}.hero-art{position:absolute;left:25%;top:0;right:0;width:87%;height:100%;opacity:.30}.service-grid{grid-template-columns:1fr}.service-grid .service-item{min-height:96px}.service-grid .service-item:not(:last-child):after{top:auto;bottom:0;width:95%;height:1px;left:2.5%}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-tile{min-height:235px}}
@media(max-width:510px){.header-main{grid-template-columns:30px minmax(0,1fr) auto;height:70px;gap:8px}.brand-word{font-size:24px}.brand-word small{font-size:9px}.brand-spark{font-size:16px}.header-actions{gap:5px}.account-trigger{min-height:36px}.hero-layout{min-height:558px}.hero-copy{padding:49px 0 72px}.hero h1{font-size:clamp(72px,18vw,94px)}.hero-copy>p{font-size:10px;max-width:270px}.hero-art{opacity:.19;left:11%;width:115%;height:100%}.editorial-frame.main{width:50%}.hero-buttons button{min-height:44px;padding:13px;font-size:9px}.hero-slider-controls{margin-top:20px}.service-grid .service-item b{font-size:42px}.category-section{padding-top:53px;padding-bottom:54px}.category-section .section-head h2{font-size:43px}.category-grid{gap:8px}.category-tile{min-height:195px;padding:13px}.category-tile strong{font-size:24px}.category-tile small{font-size:10px}.story-copy{background:#d6d5e1}}
@media(prefers-reduced-motion:reduce){.editorial-hero-scene,.editorial-frame{transition:none!important}.hero-dot{transform:none!important}}

/* Recortes fotográficos aprovados: os cards já contêm legendas na própria imagem.
   Evitar texto duplicado sobre a tipografia da arte original. */
.editorial-fixed-tile{padding:0;display:block;overflow:hidden;background:#dadadd}
.editorial-fixed-tile:after{display:none}
.editorial-fixed-tile .category-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:none;transition:transform .45s ease}
.editorial-fixed-tile:hover .category-photo{transform:scale(1.035)}
.editorial-fixed-tile .editorial-tile-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.editorial-fixed-tile .category-photo[hidden]{display:none}
.editorial-frame img[hidden]{display:none}
/* O recorte grande de Ronaldo conserva a moldura original do mockup. */
.editorial-frame.main img{object-position:50% 36%}
.editorial-frame.left img,.editorial-frame.right img{object-position:50% 28%}
@media(max-width:890px){
 .editorial-fixed-tile{min-height:200px}
 .editorial-frame{padding:6px 6px 19px}
 .editorial-frame::after{font-size:6px;bottom:6px}
}

/* Título apenas para fallback temporário quando a arte aprovada ainda não foi enviada. */
.editorial-fixed-tile.needs-label:before{
 content:attr(data-editorial-label);position:absolute;left:16px;right:16px;bottom:52px;
 z-index:3;font:800 29px/1 'Barlow Condensed',Impact,sans-serif;color:#fff;
 text-shadow:0 2px 12px #111c;pointer-events:none
}
.editorial-fixed-tile.needs-label:after{
 content:attr(data-editorial-sub);position:absolute;left:16px;right:16px;bottom:17px;display:block;
 z-index:3;font:600 11px/1.3 'DM Sans',Arial,sans-serif;color:#fff;text-shadow:0 2px 9px #111b;pointer-events:none
}
.editorial-fixed-tile.needs-label .category-photo{filter:brightness(.55)}

/* === Streetball Mobile Editorial V2: preserve os 9 recortes licenciados ===
   Fotos retrô nítidas, carrossel independente do texto e cards inteiros no celular. */
@media (max-width:890px){
 .hero{overflow:hidden}
 .hero::before{opacity:.5}
 .hero-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto auto;
  height:auto;
  min-height:0;
  gap:0;
  padding-top:0;
  padding-bottom:24px
 }
 .hero-copy{
  position:relative;
  z-index:2;
  padding:34px 0 16px;
  max-width:100%
 }
 .hero h1{
  font-size:clamp(76px,13vw,115px);
  line-height:.83;
  max-width:100%;
  margin:18px 0 21px
 }
 .hero-copy>p{max-width:100%;font-size:12px;line-height:1.55}
 .hero-buttons{margin-top:20px}
 .hero-slider-controls{margin-top:16px}
 .hero-art{
  position:relative;
  display:block;
  inset:auto;
  top:auto;left:auto;right:auto;bottom:auto;
  opacity:1;
  width:100%;
  height:clamp(300px,55vw,455px);
  min-height:300px;
  max-width:none;
  margin:4px auto 0;
  transform:none;
  overflow:visible
 }
 .hero-brush{left:34%;top:4%;width:130px;height:240px;opacity:.42}
 .hero-notes{z-index:5;right:1%;bottom:0;font-size:11px}
 .editorial-frame{box-shadow:0 12px 21px #16162433;opacity:1}
 .editorial-frame.main{
  width:44%;height:82%;left:28%;top:8%;z-index:4;transform:rotate(3deg)
 }
 .editorial-frame.left{
  width:26%;height:62%;left:3%;top:6%;z-index:2;transform:rotate(-6deg)
 }
 .editorial-frame.right{
  width:25%;height:62%;right:2%;top:6%;z-index:2;transform:rotate(7deg)
 }
 .editorial-frame.low{
  width:28%;height:44%;right:0;bottom:1%;z-index:5;transform:rotate(-5deg)
 }
 .editorial-frame.low-left{
  width:27%;height:42%;left:0;bottom:0;z-index:3;transform:rotate(5deg)
 }
 .category-grid{gap:15px}
 .category-tile.editorial-fixed-tile{
  min-height:0;
  aspect-ratio:1.38 / 1;
  border-radius:6px
 }
 .category-tile.editorial-fixed-tile .category-photo{
  object-fit:cover;
  object-position:center;
  filter:none
 }
 .category-tile.editorial-fixed-tile.needs-label .category-photo{filter:brightness(.55)}
}
@media (max-width:600px){
 .hero-layout{padding-bottom:17px}
 .hero-copy{padding:30px 0 9px}
 .hero .eyebrow{font-size:9px;letter-spacing:.16em}
 .hero h1{
  font-size:clamp(72px,17vw,96px);
  letter-spacing:-.055em;
  line-height:.82;
  margin:14px 0 18px
 }
 .hero-copy>p{font-size:10px;max-width:310px;line-height:1.55}
 .hero-buttons{gap:9px;margin-top:16px}
 .hero-buttons .btn-ghost,.hero-buttons .btn-accent{
  padding:12px 14px;min-height:44px;font-size:10px
 }
 .hero-slider-controls{margin-top:15px}
 .hero-art{
  opacity:1;
  left:auto;right:auto;top:auto;
  width:100%;height:clamp(290px,92vw,380px);
  min-height:290px
 }
 .hero-brush{left:29%;width:90px;height:220px}
 .hero-notes{font-size:9px;right:0;bottom:0}
 .editorial-frame{padding:5px 5px 15px}
 .editorial-frame::after{font-size:5px;bottom:5px;left:6px;letter-spacing:0}
 .editorial-frame.main{width:49%;height:79%;left:25%;top:6%;z-index:4}
 .editorial-frame.left{width:28%;height:61%;left:1%;top:9%}
 .editorial-frame.right{width:28%;height:60%;right:0;top:3%}
 .editorial-frame.low{width:32%;height:43%;right:0;bottom:0}
 .editorial-frame.low-left{width:30%;height:37%;left:0;bottom:0}
 .service-grid .service-item{min-height:83px;padding:12px 6px}
 .category-section{padding-top:45px;padding-bottom:52px}
 .category-section .section-head h2{font-size:clamp(38px,10vw,54px)}
 .category-grid{grid-template-columns:minmax(0,1fr);gap:13px}
 .category-tile.editorial-fixed-tile{
  width:100%;
  min-height:0;
  aspect-ratio:1.39 / 1;
  padding:0;
  border-radius:6px
 }
 .category-tile.editorial-fixed-tile .category-photo{
  object-fit:cover;object-position:50% 50%;
 }
}
@media (max-width:360px){
 .hero h1{font-size:clamp(63px,18vw,74px)}
 .hero-art{min-height:270px;height:285px}
 .hero-notes{font-size:8px}
}
@media (prefers-reduced-motion:reduce){
 .editorial-hero-scene{transition:none}
 .editorial-fixed-tile .category-photo{transition:none}
}

/* Mobile V3 — mesmas nove fotos do desktop, sem thumbnails aleatórias nem recorte de texto. */
.quick-btn{
 display:flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 white-space:nowrap;
 font-family:inherit;
}
.quick-btn .quick-btn-arrow{
 display:inline-block;
 width:15px;
 height:15px;
 flex:none;
 stroke:currentColor;
 stroke-width:2;
 vertical-align:middle;
}
.editorial-frame.image-unavailable{background:#a7a9c8}
.editorial-frame.image-unavailable:before{
 content:'FOTO INDISPONÍVEL';display:grid;place-items:center;
 position:absolute;inset:10px 6px 26px;color:#333449;
 font:700 10px/1.4 system-ui,sans-serif;text-align:center
}
@media (max-width:890px){
 .category-tile.editorial-fixed-tile{aspect-ratio:1.35/1;background:#d7d7da}
 .category-tile.editorial-fixed-tile .category-photo{
  object-fit:contain;
  object-position:center;
  background:#d7d7da;
  filter:none;
 }
}
@media (max-width:600px){
 .hero-art{
  opacity:1!important;
  filter:none!important;
 }
 .editorial-hero-scene img{
  opacity:1!important;
  filter:none!important;
 }
 .category-tile.editorial-fixed-tile{
  min-height:0;
  aspect-ratio:1.35/1;
 }
 .category-tile.editorial-fixed-tile .category-photo{
  object-fit:contain;
  object-position:center;
  max-width:100%;
 }
 .quick-btn{gap:6px}
 .quick-btn .quick-btn-arrow{width:13px;height:13px}
}

/* Cards editoriais V5: usar proporção NATIVA de cada PNG.
   Antes todos os cards eram forçados a 1:1, embora as imagens tenham
   240×193, 252×193, 305×193 e 295×193. Isso criava recortes e bordas
   artificiais. O conteúdo (inclusive texto e seta gravados na arte)
   agora fica 100% visível em desktop, tablet e celular. */
.category-grid{
 grid-template-columns:minmax(0,240fr) minmax(0,252fr) minmax(0,305fr) minmax(0,295fr);
 align-items:start;
 gap:14px;
}
.category-grid .category-tile.editorial-fixed-tile{
 min-width:0;
 min-height:0;
 height:auto;
 aspect-ratio:var(--editorial-aspect);
 padding:0;
 margin:0;
 display:block;
 overflow:hidden;
 border:0;
 border-radius:7px;
 background:#d6d6d8;
 box-shadow:none;
 transform:none;
}
.category-grid .category-tile.editorial-fixed-tile[data-category="retro"]{--editorial-aspect:240 / 193}
.category-grid .category-tile.editorial-fixed-tile[data-category="europa"]{--editorial-aspect:252 / 193}
.category-grid .category-tile.editorial-fixed-tile[data-category="personalizadas"]{--editorial-aspect:305 / 193}
.category-grid .category-tile.editorial-fixed-tile[data-category="todos"]{--editorial-aspect:295 / 193}
.category-grid .category-tile.editorial-fixed-tile .category-photo{
 position:static;
 display:block;
 width:100%;
 height:100%;
 max-width:100%;
 max-height:none;
 padding:0;
 margin:0;
 object-fit:contain;
 object-position:center;
 filter:none;
 background:transparent;
 transform:none;
}
.category-grid .category-tile.editorial-fixed-tile:hover .category-photo{transform:none}
.category-grid .category-tile.editorial-fixed-tile:hover{transform:translateY(-2px);box-shadow:0 7px 18px #17171b22}
.ui-arrow-up-right{
 width:16px;height:16px;flex:none;display:inline-block;
 fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
 vertical-align:middle;
}
.hero-buttons .btn-ghost,.section-head .text-link{display:inline-flex;align-items:center;justify-content:center;gap:12px}
@media(max-width:890px){
 .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:14px}
 .category-grid .category-tile.editorial-fixed-tile{
  min-height:0;
  height:auto;
  aspect-ratio:var(--editorial-aspect);
 }
 .category-grid .category-tile.editorial-fixed-tile .category-photo{object-fit:contain}
}
@media(max-width:600px){
 .category-grid{grid-template-columns:minmax(0,1fr);row-gap:15px}
 .category-grid .category-tile.editorial-fixed-tile{
  min-height:0;height:auto;aspect-ratio:var(--editorial-aspect);
 }
 .category-grid .category-tile.editorial-fixed-tile .category-photo{object-fit:contain}
 .ui-arrow-up-right{width:14px;height:14px}
}
@media(prefers-reduced-motion:reduce){
 .category-grid .category-tile.editorial-fixed-tile,
 .category-grid .category-tile.editorial-fixed-tile .category-photo{transition:none}
}

/* Logo oficial Streetball Store: mesmo arquivo SVG em todo o site. */
.brand .brand-logo-img{display:block;width:197px;max-width:100%;height:auto;aspect-ratio:480/136;object-fit:contain}
.brand-light .brand-logo-img{filter:invert(1)}
@media(max-width:890px){.site-header .brand .brand-logo-img{width:158px}}
@media(max-width:510px){.site-header .brand .brand-logo-img{width:128px}}


/* Mobile Collections V6: preserve native aspect ratio and 100% of artwork on phones. */
@media (max-width: 780px) {
  #categoryGrid.category-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 15px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  #categoryGrid .category-tile.editorial-fixed-tile {
    display: block;
    position: relative;
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
    padding: 0;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: 8px;
    line-height: 0;
    background: #d6d6d8;
    box-shadow: none;
  }

  #categoryGrid .category-tile.editorial-fixed-tile .category-photo {
    display: block;
    position: relative;
    inset: auto;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    min-width: 0;
    max-width: 100%;
    max-height: none;
    aspect-ratio: auto;
    padding: 0;
    margin: 0;
    object-fit: contain;
    object-position: center;
    background: transparent;
    filter: none;
    transform: none;
  }

  #categoryGrid .category-tile.editorial-fixed-tile:hover,
  #categoryGrid .category-tile.editorial-fixed-tile:focus-visible {
    transform: none;
  }
  #categoryGrid .category-tile.editorial-fixed-tile:hover .category-photo {
    transform: none;
  }
  #categoryGrid .category-tile.editorial-fixed-tile:not(.needs-label)::after {
    display: none;
  }
  #categoryGrid .category-tile.editorial-fixed-tile .category-photo[hidden] {
    display: none;
  }
  #categoryGrid .category-tile.editorial-fixed-tile.needs-label::after {
    display: block;
  }
  #categoryGrid .category-tile.editorial-fixed-tile .editorial-tile-sr {
    line-height: normal;
  }
}
@media (max-width: 390px) {
  #categoryGrid.category-grid {gap: 12px}
}


/* Streetball unified collection cards V7: approved artwork, 960x557, 4 matching banners */
.category-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.category-grid .category-tile.editorial-fixed-tile[data-category] {
 --editorial-aspect:960 / 557;
 aspect-ratio:960 / 557;
 min-height:0;
}
.category-grid .category-tile.editorial-fixed-tile .category-photo {
 object-fit:contain; object-position:center; transform:none;
}
@media (max-width:890px) and (min-width:781px){
 #categoryGrid.category-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:780px){
 #categoryGrid.category-grid {grid-template-columns:minmax(0,1fr);row-gap:14px}
 #categoryGrid .category-tile.editorial-fixed-tile {aspect-ratio:auto;height:auto;min-height:0}
 #categoryGrid .category-tile.editorial-fixed-tile .category-photo {width:100%;height:auto;aspect-ratio:auto;object-fit:contain;position:relative}
}


/* V8 mobile: 4 novos banners com ratio 960:557, sem redimensionamento forçado. */
@media (max-width: 780px) {
  #categoryGrid.category-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 14px;
    width: 100%;
    align-items: stretch;
  }
  #categoryGrid .category-tile.editorial-fixed-tile {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 960 / 557;
    padding: 0;
    line-height: 0;
    overflow: hidden;
  }
  #categoryGrid .category-tile.editorial-fixed-tile .category-photo {
    display: block;
    position: static;
    width: 100%;
    height: auto;
    min-width: 0;
    max-width: 100%;
    aspect-ratio: 960 / 557;
    object-fit: contain;
    object-position: center;
    transform: none;
  }
  #categoryGrid .category-tile.editorial-fixed-tile .category-photo[hidden] {
    display: none;
  }
}

/* Navegação rápida mobile para as mesmas coleções e ligas do desktop.
   Sem depender do menu hambúrguer ou de largura fixa de tela. */
.mobile-collection-nav{display:none}
@media(max-width:890px){
  .mobile-collection-nav{display:block;position:relative;z-index:10;background:#f6f6f8;border-bottom:1px solid #d8d9e1}
  .mobile-collection-inner{display:flex;gap:7px;max-width:1100px;margin:0 auto;padding:10px 16px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  .mobile-collection-inner button{flex:0 0 auto;min-height:39px;padding:9px 14px;border:1px solid #cfd1dc;border-radius:22px;background:#fff;color:#333849;font:700 12px/1.3 Arial,sans-serif;white-space:nowrap;cursor:pointer;touch-action:manipulation}
  .mobile-collection-inner button.active{background:#242943;color:#fff;border-color:#242943}
  .mobile-collection-inner button:focus-visible{outline:2px solid #777ee0;outline-offset:2px}
  .europe-clubs{padding:17px 13px}
  .europe-league-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .europe-league-grid .br-club{min-width:0;min-height:75px}
  .europe-league-grid .br-club-name{font-size:15px;overflow-wrap:anywhere}
  .europe-club-section{margin-top:19px;padding-top:17px}
  #europeClubGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #europeClubGrid .br-club{min-width:0;min-height:68px;overflow-wrap:anywhere}
}
@media(max-width:370px){
  .mobile-collection-inner{padding:9px 12px}
  .mobile-collection-inner button{font-size:11px;padding:8px 11px}
  .europe-clubs{padding:12px 10px}
  .europe-league-grid,#europeClubGrid{gap:6px}
  .europe-league-grid .br-club,#europeClubGrid .br-club{padding:10px}
}