.brand-image{position:relative;display:block;inline-size:100%;aspect-ratio:var(--brand-image-ratio, 4 / 5);overflow:hidden;background-color:var(--surface-muted);isolation:isolate}.brand-image[data-ratio=auto]{aspect-ratio:auto}.brand-image__img{position:absolute;top:0;right:0;bottom:0;left:0;inline-size:100%;block-size:100%;object-fit:cover;object-position:center;transition:opacity var(--dur-md) var(--ease-out-expo),transform var(--dur-lg) var(--ease-out-expo);z-index:1}.brand-image__fallback{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 40%,var(--surface-raised) 0%,var(--surface-muted) 60%,oklch(from var(--surface-muted) calc(l - .03) c h) 100%);color:var(--text-muted);z-index:0;opacity:1;transition:opacity var(--dur-md) var(--ease-out-expo)}.brand-image__fallback:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(135deg,transparent 0 14px,oklch(from var(--surface-muted) calc(l - .02) c h / .35) 14px 15px);opacity:.35;pointer-events:none;mix-blend-mode:multiply}.brand-image[data-placeholder=false] .brand-image__fallback{opacity:0;pointer-events:none}.brand-image__monogram{position:relative;inline-size:clamp(48px,18%,96px);block-size:auto;color:var(--text-muted);opacity:.6}.brand-image__initial{position:relative;font-family:var(--font-display);font-variation-settings:var(--frax-display);font-size:clamp(3rem,8vw,5.5rem);line-height:1;color:var(--text-muted);letter-spacing:var(--tracking-display);opacity:.55;-webkit-user-select:none;user-select:none}.brand-image__dots{position:relative;display:inline-flex;gap:var(--space-2)}.brand-image__dots i{inline-size:6px;block-size:6px;border-radius:50%;background:currentColor;opacity:.35;animation:brand-image-dots 1.4s var(--ease-in-out-soft) infinite}.brand-image__dots i:nth-child(2){animation-delay:.2s}.brand-image__dots i:nth-child(3){animation-delay:.4s}@keyframes brand-image-dots{0%,80%,to{transform:scale(.6);opacity:.25}40%{transform:scale(1);opacity:.7}}@media(prefers-reduced-motion:reduce){.brand-image__dots i{animation:none;opacity:.5}}.brand-image[data-hover-swap=true]:hover .brand-image__img,.brand-image[data-hover-swap=true]:focus-within .brand-image__img{transform:scale(1.03)}.brand-image__img:not([src]),.brand-image__img[src=""]{opacity:0}
/*# sourceMappingURL=/cdn/shop/t/3/assets/brand-image.css.map */