/* Six brand-specific motion studies. No WebGL, external animation library or emoji glyphs. */
.display{font-family:'Barlow Condensed','Arial Narrow',sans-serif}
.ui-icon{display:inline-block;width:1em;height:1em;flex:0 0 auto;vertical-align:-.13em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.brand-symbol{display:block;width:1em;height:1em;fill:currentColor;stroke:none}
.brand-field{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;contain:strict}
[data-brand-hero]{isolation:isolate;--scroll-shift:0px}
.brand-progress{position:fixed;left:0;top:0;width:100%;height:2px;background:var(--ink);z-index:100;transform:scaleX(var(--read-progress,0));transform-origin:left;pointer-events:none}
.brand-motion-toggle{position:fixed;bottom:14px;right:14px;z-index:40;border:1px solid var(--rule);border-radius:40px;background:var(--paper);color:var(--ink);padding:9px 15px;font-size:10px;letter-spacing:.03em;box-shadow:0 3px 18px #0000000a;opacity:.88}
.brand-motion-toggle:hover,.brand-motion-toggle:focus-visible{opacity:1}.brand-motion-toggle:disabled{cursor:default}
.brand-ready[data-motion=on] [data-brand-reveal]{opacity:0;translate:0 32px;transition:opacity .9s ease var(--reveal-delay,0ms),translate .9s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
.brand-ready[data-motion=on] [data-brand-reveal].is-seen{opacity:1;translate:0 0}
.nav-links>a{position:relative}.nav-links>a:after{content:'';position:absolute;left:0;right:0;bottom:3px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s ease}.nav-links>a:hover:after,.nav-links>a:focus-visible:after{transform:scaleX(1);transform-origin:left}
.btn .ui-icon{transition:transform .3s cubic-bezier(.2,.8,.2,1)}.btn:hover .ui-icon{transform:translate(3px,-3px)}
[data-tilt]{transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotate(var(--base-rotate,0deg));transition:transform .35s ease}
.brand-ticker{display:flex;overflow:hidden;white-space:nowrap}.brand-ticker-track{display:flex;flex-shrink:0;align-items:center;gap:1.5em;min-width:100%;padding-right:1.5em;animation:brand-ticker 28s linear infinite}.brand-ticker .ui-icon,.brand-ticker .brand-symbol{width:1em;height:1em;display:inline-block;vertical-align:middle;flex:0 0 auto}
@keyframes brand-ticker{to{transform:translateX(-100%)}}@keyframes brand-rise{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}
@keyframes brand-poster{from{opacity:0;transform:translateY(65px) rotate(-4deg);clip-path:inset(100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes brand-float{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes brand-wobble{0%,100%{rotate:0deg}30%{rotate:-5deg}60%{rotate:4deg}}
body[data-motion=off] *,body[data-motion=off] *:before,body[data-motion=off] *:after{animation-play-state:paused!important;scroll-behavior:auto!important}
body[data-motion=off] [data-brand-reveal]{opacity:1;translate:none;transition:none}
body[data-motion=off] [data-tilt]{transform:rotate(var(--base-rotate,0deg))}
body[data-motion=off] .btn,body[data-motion=off] .btn .ui-icon{transform:none;transition:none}

/* KURO: measured type, fine contours and rising tea vapour. */
[data-brand=kuro] .k-lead{position:relative;z-index:3}
[data-brand=kuro][data-motion=on] .k-lead>*{animation:brand-rise 1.25s cubic-bezier(.2,.75,.25,1) both}
[data-brand=kuro] .k-lead h1{animation-delay:.1s}[data-brand=kuro] .k-lead p{animation-delay:.23s}[data-brand=kuro] .k-lead .btn{animation-delay:.35s}
[data-brand=kuro] .k-hero>img{transition:filter .8s ease;filter:brightness(.95)}[data-brand=kuro] .k-hero:hover>img{filter:brightness(1.06)}
[data-brand=kuro] .k-word{background:linear-gradient(105deg,#f5f4f0 32%,#777870 78%);background-clip:text;color:transparent}
[data-brand=kuro] .line-list>div{position:relative;transition:padding .4s ease,background .4s ease}.line-list>div:after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .6s ease}
[data-brand=kuro] .line-list>div:hover{padding-left:12px;background:#ffffff05}[data-brand=kuro] .line-list>div:hover:after{transform:scaleX(1)}
[data-brand=kuro] .k-steps strong{font-variant-numeric:tabular-nums;color:#969b8e}

/* TIDE: a slowly shifting horizon and quiet room/timeline details. */
[data-brand=tide] .t-hero{overflow:hidden}[data-brand=tide] .t-hero>img{transform:scale(1.035) translateY(var(--scroll-shift));transform-origin:center;will-change:transform}
[data-brand=tide] .t-hero:after{background:linear-gradient(90deg,#10191655,transparent 70%),linear-gradient(0deg,#10191650,transparent 35%)}
[data-brand=tide] .t-hero>div,[data-brand=tide] .t-hero>p,[data-brand=tide] .t-scroll{z-index:3}
[data-brand=tide][data-motion=on] .t-hero h1{animation:brand-rise 1.6s ease both}[data-brand=tide][data-motion=on] .t-hero>p{animation:brand-rise 1.5s .25s ease both}
[data-brand=tide] .t-scroll{display:flex;align-items:center;gap:12px}.t-scroll .ui-icon{height:28px;width:16px}
[data-brand=tide] .t-rooms article{position:relative;transition:border-color .4s}.t-rooms article:before{content:'';position:absolute;top:-1px;left:0;width:100%;height:2px;background:#6e7866;scale:0 1;transform-origin:left;transition:scale .6s}.t-rooms article:hover:before{scale:1 1}
[data-brand=tide] .t-day>div{border-left:1px solid #c7c0af;padding-left:40px}.t-day article{position:relative}.t-day article:before{content:'';position:absolute;left:-45px;top:36px;width:9px;height:9px;border:1px solid #858473;background:#eae6dc;border-radius:50%;transition:background .5s}.t-day article.is-seen:before{background:#858473}

/* ONDO: subtle sound rings, pill controls and a material-colour wash. */
[data-brand=ondo] .o-title{position:relative;z-index:3}[data-brand=ondo] .o-model{z-index:3}
[data-brand=ondo][data-motion=on] .o-title h1{animation:brand-rise 1.1s ease both}[data-brand=ondo][data-motion=on] .o-title p{animation:brand-rise 1.1s .16s ease both}
[data-brand=ondo] .o-product{transition:background .6s ease}[data-brand=ondo][data-finish=stone] .o-product{background:#dedfdd}
[data-brand=ondo] .choice button{display:inline-flex;gap:9px;align-items:center}.o-product .choice button:before{content:'';height:13px;width:13px;border-radius:50%;background:#f9f8f4;border:1px solid #a6a5a0}.o-product .choice button:last-child:before{background:#a4a6a3}
[data-brand=ondo] .o-points article{border-top:1px solid #d9d8d3;padding-top:25px;transition:border-color .35s,translate .35s}.o-points article:hover{border-color:#202020;translate:0 -5px}
[data-brand=ondo] .o-statement h2{letter-spacing:-.05em}.o-life{overflow:hidden}.o-life>img{transition:scale 1.2s ease}.o-life:hover>img{scale:1.025}

/* OVEN CLUB: poster entrances and a continuously passing diner strip. */
[data-brand=oven] .v-hero{overflow:hidden}[data-brand=oven] .v-hero>h1,[data-brand=oven] .v-intro,[data-brand=oven] .v-stamp{position:relative;z-index:3}
[data-brand=oven] .v-stamp{position:absolute}[data-brand=oven][data-motion=on] .v-hero h1{animation:brand-poster .95s cubic-bezier(.16,.8,.3,1) both}
[data-brand=oven] .v-hero>img{box-shadow:9px 9px 0 #dd30271c;transition:border-radius .7s,filter .7s}.v-hero:hover>img{border-radius:125px 125px 15px 15px;filter:saturate(1.08)}
[data-brand=oven] .v-top{padding:11px 0}[data-brand=oven] .v-top .brand-ticker-track{justify-content:center;animation-duration:38s}
[data-brand=oven] .v-check{background-position:calc(var(--read-progress,0) * 90px) 0}
[data-brand=oven] .v-menu-items article{padding:20px 18px;border-top:1px solid #fff8;transition:background .3s,translate .3s}.v-menu-items article:hover{background:#fff9ed12;translate:0 -5px}
[data-brand=oven] .v-how-grid b{display:inline-block;transition:rotate .4s}.v-how-grid>div:hover b,.v-how-grid>article:hover b{rotate:-7deg}

/* PLAYDOT: tactile cut paper; the glyphs are authored SVGs, never emoji. */
[data-brand=playdot] .p-hero>div,[data-brand=playdot] .p-hero figure{position:relative;z-index:2}[data-brand=playdot] .p-hero figure{--base-rotate:4deg;box-shadow:10px 12px 0 #20215110}
[data-brand=playdot] .p-hero figure[data-tilt]{transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotate(var(--base-rotate,4deg))}
[data-brand=playdot] .p-star{width:1em;height:1em;z-index:3;rotate:-10deg;pointer-events:none}
[data-brand=playdot][data-motion=on] .p-star{animation:brand-float 5s ease-in-out infinite}[data-brand=playdot][data-motion=on] .p-hero h1{animation:brand-rise 1s cubic-bezier(.2,.8,.2,1) both}
[data-brand=playdot] .p-hero h1 span{display:inline;background:linear-gradient(#ffe481,#ffe481) 0 96%/100% 13px no-repeat;padding-bottom:4px}
[data-brand=playdot] .p-modules article{border:1px solid #20215115;box-shadow:0 0 0 #202151;transition:box-shadow .3s,translate .3s}.p-modules article:hover{translate:0 -7px;box-shadow:7px 7px 0 #202151}
[data-brand=playdot] .p-shape{height:155px;display:flex;align-items:center;justify-content:center;gap:10px}.p-shape .ui-icon{width:.95em;height:.95em;stroke-width:1.1}.p-shape .brand-symbol{width:.65em;height:.65em}.p-modules article:hover .p-shape{animation:brand-wobble .5s ease}
[data-brand=playdot] .p-course-box{box-shadow:11px 11px 0 #ffd75f}[data-brand=playdot] .band{padding:20px 0;font-size:17px;letter-spacing:.1em}

/* MELLOW: soft, physical shapes and a flavour-aware colour palette. */
[data-brand=mellow] .m-hero{overflow:hidden}[data-brand=mellow] .m-hero>h1{position:relative;z-index:3;text-shadow:3px 4px 0 #b7a1e65c}
[data-brand=mellow] .m-hero>.m-wordmark{font-size:0;line-height:0}.m-wordmark svg{display:block;width:100%;height:auto;overflow:visible;fill:currentColor;filter:drop-shadow(3px 4px 0 #b7a1e65c)}.m-wordmark text{font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:800;letter-spacing:-8px}
[data-brand=mellow][data-motion=on] .m-hero>h1{animation:brand-poster 1.15s cubic-bezier(.16,1,.3,1) both}
[data-brand=mellow] .m-hero-row>div{position:relative;z-index:3}[data-brand=mellow] .m-hero-row>img{box-shadow:10px 12px 0 #b7a1e638}
[data-brand=mellow] .m-flower{width:1em;height:1em;z-index:3;pointer-events:none;text-shadow:none;filter:drop-shadow(1px 2px 0 #493199)}
[data-brand=mellow] .m-taste-art>span{display:block;width:1em;height:1em;margin-bottom:12px}.m-taste-art>span .brand-symbol{width:100%;height:100%}
[data-brand=mellow] .m-ribbon{padding:23px 0}[data-brand=mellow] .m-badges span{box-shadow:4px 5px 0 #49319920}.m-badges span:hover{animation:brand-wobble .5s ease}
[data-brand=mellow] .m-taste{transition:background .5s ease}.m-taste-art{transition:background .5s ease,rotate .5s ease}[data-brand=mellow][data-flavor=grape] .m-taste{background:#d6c6f0}[data-brand=mellow][data-flavor=grape] .m-taste-art{background:#b8ddf5;rotate:8deg}
[data-brand=mellow] .m-moments article{transition:padding-left .3s}.m-moments article:hover{padding-left:15px}
[data-brand=mellow] .m-moments{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}[data-brand=mellow] .m-moments h2{font-size:clamp(48px,7.8vw,100px)}
@media(max-width:700px){.brand-motion-toggle{font-size:9px;padding:7px 11px;bottom:10px;right:10px}.brand-ready[data-motion=on] [data-brand-reveal]{translate:0 20px}[data-brand=tide] .t-day>div{padding-left:26px}.t-day article:before{left:-31px}[data-brand=playdot] .p-shape{height:90px}.p-course-box{box-shadow:6px 7px 0 #ffd75f}[data-brand=mellow] .m-flower{right:-4px;bottom:-5px}[data-brand=mellow] .m-ribbon{padding:18px 0}[data-brand=oven] .v-menu-items article{padding-inline:0}.foot{padding-bottom:65px}}
@media(max-width:700px){[data-brand=mellow] .m-moments{grid-template-columns:minmax(0,1fr)}[data-brand=mellow] .m-moments h2{font-size:18.5vw}}
@media(prefers-reduced-motion:reduce){.brand-ready [data-brand-reveal]{opacity:1!important;translate:none!important}.brand-field{opacity:.6}[data-brand=tide] .t-hero>img{transform:none!important}.brand-ticker-track{animation:none!important}[data-tilt]{transform:rotate(var(--base-rotate,0deg))!important}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}