/* brand pages, guides, promo codes: extends collabs.css */
.logo-b{display:block;width:min(70vw,360px);background:var(--c);-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat;margin:6px 0 10px}
.tagl{font-family:var(--disp);font-size:12px;letter-spacing:.12em;color:var(--c);margin-top:10px}
.hero-row{margin-top:14px}
.shots.n4{grid-template-columns:repeat(2,1fr)}
.shot figcaption i{display:block;font-style:normal;font-size:9px;color:color-mix(in srgb,var(--k) 70%,transparent);margin-top:2px}
.about{border-top:var(--bw) solid var(--ink);padding-top:16px;margin-top:20px}
.story{margin-bottom:14px;max-width:720px}
.story h3{font-family:var(--disp);font-size:12px;letter-spacing:.1em;color:var(--c);margin-bottom:6px}
.story p{font-size:12.5px;color:var(--soft)}
.about .btn,.about .buy-row{margin-top:8px}
.stores-l{list-style:none;display:grid;grid-template-columns:1fr;gap:6px;margin-top:14px}
.stores-l a{display:flex;align-items:center;gap:10px;text-decoration:none;border:2px solid var(--soft);padding:9px 10px;font-size:11px}
.stores-l a span{display:flex;flex-direction:column;flex:1}
.stores-l b{font-weight:800}.stores-l i{font-style:normal;font-size:9.5px;color:var(--soft);font-weight:700}
.stores-l .ic:last-child{width:14px;height:14px;color:var(--soft)}
.stores-l a:hover{border-color:var(--c)}
.hub-grid{display:grid;grid-template-columns:1fr;gap:10px;margin:8px 0 6px}
.hub{display:flex;flex-direction:column;gap:6px;text-decoration:none;background:var(--bb);color:var(--ink);border:var(--bw) solid var(--ink);padding:14px;position:relative;box-shadow:5px 5px 0 var(--c);transition:transform .15s var(--ease),box-shadow .15s var(--ease);overflow:hidden}
.hub::after{content:"";position:absolute;right:-30px;bottom:-30px;width:150px;aspect-ratio:600/378;background:var(--ink);opacity:.06;-webkit-mask:url(logos/w.png) center/contain no-repeat;mask:url(logos/w.png) center/contain no-repeat}
.hub:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--c)}
.hub-logo{display:block;width:min(50vw,220px);background:var(--ink);-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat;margin-bottom:4px}
.hub b{font-family:var(--disp);font-size:18px;line-height:1.1}
.hub.big b{font-size:26px}
.hub-cat{font-size:9.5px;letter-spacing:.12em;color:var(--c);font-weight:800}
.hub-tag{font-size:11px;color:var(--ink);opacity:.9}
.hub .go{margin-top:4px}
.codes{margin:6px 0 10px}
.code-card{background:var(--ink);color:var(--onacc);border:var(--bw) solid var(--ink);box-shadow:8px 8px 0 var(--c);padding:18px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:520px}
.code-k{font-family:var(--disp);font-size:10px;letter-spacing:.14em}
.code{font-family:var(--disp);font-weight:900;font-size:clamp(34px,11vw,64px);letter-spacing:.06em;background:var(--c);color:var(--k);padding:4px 14px;border:var(--bw) solid var(--onacc);box-shadow:4px 4px 0 var(--onacc);cursor:pointer;transition:transform .15s var(--ease)}
.code:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--onacc)}
.code-d{font-family:var(--disp);font-size:14px}
.code-rules{list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.code-rules li{border:2px solid var(--onacc);padding:4px 8px;font-size:10px;font-weight:800}
.code-card .btn{margin-top:4px}
.steps{list-style:none;display:grid;gap:8px;margin-bottom:16px;max-width:720px}
.steps li{display:flex;gap:12px;align-items:flex-start;border:var(--bw) solid var(--ink);background:var(--panel);padding:10px 12px;font-size:12px}
.steps b{font-family:var(--disp);color:var(--c);font-size:14px;flex:none}
@media (min-width:760px){
  .shots.n4{grid-template-columns:repeat(4,1fr);gap:12px}
  .stores-l{grid-template-columns:repeat(2,1fr)}
  .hub-grid{grid-template-columns:repeat(3,1fr)}
  .hub.big{grid-column:span 2}
}
.a-contrast .story p,.a-contrast .hub-tag{color:#FFFFFF}
