@font-face{font-family:'Archivo Wide';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/archivo-expanded-400.ttf') format('truetype')}
:root{--display:'Archivo Wide',Helvetica,Arial,sans-serif;--micro-speed:360ms;--interaction-speed:1100ms;--ambient-speed:19s;--ease-soft:cubic-bezier(.22,.68,.2,1);--contour:#bd9475}
html,body{overflow-x:clip}
.showcase-word{font-family:var(--display);font-size:178px;font-weight:400;letter-spacing:-8px;font-kerning:normal}
.showcase-art{z-index:2}
.showcase-art{pointer-events:none}.showcase-art .showcase-donut{pointer-events:auto;cursor:pointer}.showcase-type,.showcase-front{pointer-events:none}
.word-front{stroke-width:1.1px}
.ambient-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;color:var(--contour)}
.ambient-field svg{width:100%;height:100%;display:block;overflow:visible}
.ambient-field path{fill:none;stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke;opacity:.27;transform-origin:center;transform-box:fill-box}
.ambient-field path:nth-child(2){opacity:.2}.ambient-field path:nth-child(3){opacity:.15}
.showcase-assist{z-index:4}.hero-header .menu-button{font-family:var(--display);font-size:12px;letter-spacing:.06em}
.showcase-art:focus-visible::after{top:60%;left:2%;right:2%;opacity:.25}
@media(max-width:600px){.ambient-field svg{width:190%;margin-left:-45%}.ambient-field path{opacity:.2}.hero-header .menu-button{font-size:11px}}

/* One motion vocabulary, with independent breathing periods. */
@keyframes contour-breathe{0%,100%{transform:translate(0,0) rotate(-.3deg) scale(1,.996)}45%{transform:translate(3px,-2px) rotate(.5deg) scale(1.012,1.006)}72%{transform:translate(-2px,1px) rotate(.1deg) scale(.998,1.003)}}
@keyframes dough-volume{0%,100%{scale:.997}55%{scale:1.005}}
@keyframes dough-turn{0%,100%{rotate:-.4deg}47%{rotate:.4deg}}
@keyframes dough-settle{0%,100%{translate:0 0}63%{translate:0 1.4px}}
.ambient-field path{animation:contour-breathe var(--ambient-speed) ease-in-out infinite}.ambient-field path:nth-child(2){animation-duration:23s;animation-delay:-7s}.ambient-field path:nth-child(3){animation-duration:17s;animation-delay:-11s}
.donut-image{animation:dough-volume 19s ease-in-out infinite,dough-turn 23s ease-in-out infinite,dough-settle 17s ease-in-out infinite;transform-origin:center;--hover-scale:1;--donut-angle:-8deg;transition:transform var(--micro-speed) var(--ease-soft)}
.catalog-item:nth-child(2n) .donut-image{animation-delay:-5s,-11s,-3s}.catalog-item:nth-child(3n) .donut-image{animation-delay:-9s,-6s,-13s}
.catalog-image .donut-image,.detail-product .donut-image,.ingredient-visual>.donut-image,.shop-object .donut-image,.next-donut .donut-image{transform:rotate(var(--donut-angle)) scale(var(--hover-scale))}
.ingredient-visual>.donut-image{--donut-angle:-20deg}.shop-object .donut-image{--donut-angle:0deg}
@media(hover:hover) and (pointer:fine){.donut-image:hover,.catalog-item a:hover .donut-image,.next-donut:hover .donut-image{--hover-scale:1.045}.catalog-item a:hover .donut-image{transform:rotate(-6deg) scale(var(--hover-scale))}}
.offscreen .donut-image,.offscreen.ambient-field path,.is-hidden .donut-image,.is-hidden .ambient-field path,.menu-open .donut-image,.menu-open .ambient-field path,.motion-paused .donut-image,.motion-paused .ambient-field path{animation-play-state:paused}
.logo,.footer-mark{font-family:var(--display);font-weight:400;letter-spacing:-.065em}.logo span{letter-spacing:.12em}
.catalog-heading h1,.detail-heading h1,.story-opening h1,.philosophy-chapter h2,.hand-heading h2,.people-chapter h2,.place-type h2,.shop-heading h1,.shop-contact h2,.menu-dialog nav>a{font-family:var(--display);letter-spacing:-.065em;line-height:1.02}
.catalog-heading h1 em,.detail-heading h1 em,.story-opening h1 em,.philosophy-chapter h2 em,.hand-heading h2 em,.people-chapter h2 em,.place-type h2 em,.shop-heading h1 em,.shop-contact h2 em{font-style:normal;letter-spacing:-.08em}
.catalog-heading h1{font-size:clamp(65px,8vw,125px)}.detail-heading h1{font-size:clamp(46px,5.6vw,88px)}.story-opening h1{font-size:clamp(62px,9.4vw,147px)}.philosophy-chapter h2{font-size:clamp(55px,8.7vw,135px)}.hand-heading h2{font-size:clamp(60px,8vw,125px)}.people-chapter h2{font-size:clamp(55px,8vw,125px)}.place-type h2{font-size:clamp(65px,9vw,142px)}.shop-heading h1{font-size:clamp(60px,9vw,142px)}
.catalog,.detail-hero,.story-opening,.why-chapter,.philosophy-chapter,.ingredients-chapter,.hand-chapter,.people-chapter,.place-chapter,.shop-heading{position:relative;isolation:isolate}.catalog>.ambient-field{height:900px}.ambient-field{z-index:-1}.showcase>.ambient-field{z-index:0}
.ambient-catalog{opacity:.7;transform:rotate(17deg) scale(1.2,.72)}.ambient-detail{opacity:.7;inset:3% -25% 0 25%;transform:rotate(-19deg) scale(.9,1.05)}.ambient-story{opacity:.75;inset:-25% -30%;transform:rotate(64deg) scale(.8,1.1)}.ambient-shop{opacity:.38;transform:rotate(-8deg) scale(1.2,.83)}.hand-chapter .ambient-field{color:#d2b08c;opacity:.48}
.catalog-image,.detail-hero{background:none}.philosophy-chapter,.place-chapter{background-color:#e9e4da}
.detail-product{z-index:1}.detail-heading{z-index:2}
.detail-heading h1:focus{outline:none}
@media(max-width:600px){.detail-product{width:86vw;right:7%;top:44%}.detail-poem{font-size:20px;max-width:100%}.footer-mark{font-size:34vw}}
.donut-image.offscreen{animation-play-state:paused}.ambient-toggle{margin-left:auto;margin-right:25px;width:44px;height:44px;font-size:12px;opacity:.6}
.portal-active{overflow:hidden!important}.portal-active .ambient-field svg{transform:scale(.96);transition:transform 700ms var(--ease-soft)}
.portal-layer{position:fixed;inset:0;z-index:90;overflow:hidden;isolation:isolate;touch-action:none;pointer-events:auto}
.portal-destination{position:absolute;inset:0;overflow:hidden;background:var(--paper);clip-path:circle(0 at 50% 50%)}
.portal-destination .detail{min-height:100%;isolation:isolate}.portal-destination .detail-hero{height:100dvh}
.portal-destination .donut-image{animation:none;scale:1;rotate:0deg;translate:0 0;--hover-scale:1}
.portal-destination .detail-heading,.portal-destination .detail-caption,.portal-destination .detail-down{opacity:0}
.portal-destination .detail-product{will-change:transform}
.portal-ring{position:absolute;transform:translate(-50%,-50%);pointer-events:none;z-index:2;overflow:visible}
.portal-ring svg{display:block;width:100%;height:100%;overflow:visible}
.portal-ring image{filter:drop-shadow(4px 12px 12px #68432212)}
.portal-commit .detail-product{animation:detail-land 300ms var(--ease-soft) both}
@keyframes detail-land{from{transform:scale(1.07)}to{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.portal-active .ambient-field svg{transition:none}.portal-commit .detail-product{animation:none}}
@media(max-width:600px){.catalog-heading h1{font-size:13.8vw}.detail-heading h1{font-size:10.8vw}.story-opening h1{font-size:12.2vw}.philosophy-chapter h2{font-size:10.8vw}.hand-heading h2{font-size:19vw}.people-chapter h2{font-size:11.5vw}.place-type h2,.shop-heading h1{font-size:12.5vw}.shop-contact h2{font-size:19vw}.ambient-detail{inset:20% -35% 0 -15%}.ambient-story{inset:0 -40%;transform:rotate(45deg)}.menu-dialog nav>a{font-size:9vw}}
@media(prefers-reduced-motion:reduce){.ambient-field path,.donut-image{animation:none!important}.donut-image{transition:none!important}.showcase-donut{filter:none}}
