/* Align visible artwork, rather than the empty margins in the source logos. */
.brand-marquee{position:relative;display:block;overflow:hidden;padding:12px 0 28px}
.brand-viewport{width:100%;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.brand-marquee .brand-logos{display:flex;flex-wrap:nowrap;align-items:center;gap:0;width:max-content;max-width:none;margin:0;padding:0;overflow:visible;animation:brand-loop 46s linear infinite;will-change:transform}
.brand-group{display:flex;flex:none;align-items:center;gap:0}
.brand-marquee .brand-group .brand-logo{display:flex;flex:none;align-items:center;justify-content:center;width:25vw;min-width:0;height:112px;padding:0 28px}
.brand-marquee .brand-group .brand-logo img{display:block;flex:none;width:auto;height:auto;max-width:min(240px,calc(25vw - 72px));max-height:64px;object-fit:contain;object-position:center;filter:brightness(0) invert(1)}
.brand-marquee .brand-group .brand-logo.profile-mark img{filter:grayscale(1) contrast(8);mix-blend-mode:screen}
.brand-marquee .brand-logos.paused,.brand-viewport:focus-within .brand-logos{animation-play-state:paused}@media(hover:hover){.brand-marquee:hover .brand-logos{animation-play-state:paused}}
.brand-motion-toggle{position:absolute;right:4%;bottom:7px;width:25px;height:25px;display:grid;place-items:center;border:1px solid #ffffff25;border-radius:50%;background:#101010;color:#c9c7c1}
.brand-motion-toggle svg{width:11px;height:11px}
.brand-motion-toggle:hover{border-color:var(--accent);color:var(--accent)}
@keyframes brand-loop{from{transform:translateX(-50%)}to{transform:translateX(0)}}
/* The Bertilicious reel retains the original frame inside the portrait viewer. */
.reel-slide[data-reel-id="Ddrara-REnE"]>video{object-fit:contain;background:#000}
/* Quiet, mostly hollow glass lettering until the visitor hovers or focuses it. */
.hero h1{background:linear-gradient(125deg,#ffffff0a 4%,#ffffff03 28%,#ffffff20 var(--glass-light),#ffffff05 65%,#ffffff0c 95%);background-clip:text;-webkit-background-clip:text;-webkit-text-stroke:1px #fffffff0;text-shadow:none}
.hero h1:hover,.hero h1:focus-visible{-webkit-text-fill-color:#fff;color:#fff;-webkit-text-stroke-color:#fff;text-shadow:none}
.hero h1 span,.hero h1:hover span,.hero h1:focus-visible span{-webkit-text-fill-color:var(--accent);-webkit-text-stroke:0}
@media(max-width:900px){.brand-marquee .brand-group .brand-logo{width:33.333333vw}.brand-marquee .brand-group .brand-logo img{max-width:min(220px,calc(33.333333vw - 62px));max-height:59px}}
@media(max-width:700px){.brand-marquee{padding:10px 0 26px}.brand-marquee .brand-group .brand-logo{width:50vw;height:92px;padding:0 22px}.brand-marquee .brand-group .brand-logo img{max-width:calc(50vw - 48px);max-height:51px}.hero h1{-webkit-text-stroke-width:.8px}}
@media(hover:none){.hero h1{background:linear-gradient(125deg,#ffffff0a,#ffffff1a 48%,#ffffff05);background-clip:text;-webkit-background-clip:text}}
@media(prefers-reduced-motion:reduce){.brand-marquee .brand-logos{animation:none;transform:none;will-change:auto}.brand-marquee .brand-viewport{overflow-x:auto;mask-image:none;-webkit-mask-image:none}.brand-copy,.brand-group[aria-hidden="true"],.brand-motion-toggle{display:none}}


.brand-marquee .brand-group .brand-logo img{width:min(240px,calc(25vw - 72px));height:64px}@media(max-width:900px){.brand-marquee .brand-group .brand-logo img{width:min(220px,calc(33.333333vw - 62px));height:59px}}@media(max-width:700px){.brand-marquee .brand-group .brand-logo img{width:calc(50vw - 48px);height:51px}}