/* KAOLIN · Keramikstudio · porcelain, celadon, gold */
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-full-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-ext-full-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-full-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-latin-ext-full-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Albert Sans";src:url(../fonts/albert-sans-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Albert Sans";src:url(../fonts/albert-sans-latin-ext-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Spline Sans Mono";src:url(../fonts/spline-sans-mono-latin-wght-normal.woff2) format("woff2");font-weight:300 700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Spline Sans Mono";src:url(../fonts/spline-sans-mono-latin-ext-wght-normal.woff2) format("woff2");font-weight:300 700;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --porc:#E8E9E3;--porc2:#DCDED6;--night:#0D1110;
  --ink:#17201C;--ink2:#4F5A54;--ink3:#7E8781;--line:rgba(23,32,28,.18);--line2:rgba(23,32,28,.1);
  --gold:#C9A04B;--gold-ink:#7E5F1E;--em:#7E5F1E;
  --scrim:232,233,227;
  --fd:"Fraunces",Georgia,serif;--fb:"Albert Sans",system-ui,sans-serif;--fm:"Spline Sans Mono",ui-monospace,Menlo,monospace;
  --pad:clamp(18px,4.2vw,64px);--hd:74px;
  --ease:cubic-bezier(.2,.75,.1,1);--expo:cubic-bezier(.16,1,.3,1);
}
html.tone-dark{--ink:#ECEAE3;--ink2:#AEB3AC;--ink3:#767C76;--line:rgba(236,234,227,.2);--line2:rgba(236,234,227,.1);--em:#E2C27A;--scrim:13,17,16}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--porc);-webkit-text-size-adjust:100%;text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--porc);color:var(--ink);font:400 16px/1.6 var(--fb);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;transition:color .6s}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
ol,ul{padding:0;list-style:none}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
em{font-family:var(--fd);font-style:italic;font-weight:380;font-variation-settings:"SOFT" 100,"WONK" 1;color:var(--em);transition:color .6s}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mono{font-family:var(--fm);font-weight:400;letter-spacing:.02em}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--ink);color:var(--porc);padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--gold-ink);outline-offset:3px;border-radius:6px}
html.tone-dark :focus-visible{outline-color:var(--gold)}
::selection{background:var(--gold);color:var(--night)}

/* ---------- layers ---------- */
.gl{position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;z-index:0;display:block;pointer-events:none}
html:not(.gl-on) .gl{display:none}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 24px;border-radius:999px;font:600 15px/1 var(--fb);letter-spacing:.005em;text-decoration:none;white-space:nowrap;transition:background-color .3s,color .3s,border-color .3s,transform .4s var(--expo),box-shadow .4s}
.btn--acc{background:var(--gold);color:#16130A;box-shadow:0 12px 34px -14px rgba(126,95,30,.7)}
.btn--acc:hover{background:#D6AE57;box-shadow:0 16px 44px -14px rgba(126,95,30,.85)}
.btn--line{border:1px solid var(--line);color:var(--ink)}
.btn--line:hover{border-color:var(--ink)}
.btn--round{width:50px;padding:0;border:1px solid var(--line)}
.btn--round svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn--round:hover{border-color:var(--ink)}
.btn--big{height:58px;padding:0 32px;font-size:16px}
.btn:active{transform:scale(.97)}
.pill{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--line);font-size:14px;font-weight:500;transition:background-color .3s,color .3s,border-color .3s,transform .4s var(--expo)}
.pill:hover{border-color:var(--ink)}
.pill[aria-pressed="true"]{background:var(--ink);color:var(--porc);border-color:var(--ink)}
html.tone-dark .pill[aria-pressed="true"]{color:var(--night)}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- header ---------- */
.hd{position:fixed;left:0;right:0;top:0;z-index:60;height:var(--hd);display:flex;align-items:center;gap:26px;padding:0 var(--pad);color:var(--ink);transition:color .6s}
.hd::before{content:"";position:absolute;inset:0 0 -36px;background:linear-gradient(rgba(var(--scrim),.78),rgba(var(--scrim),0));pointer-events:none;z-index:-1;transition:background .6s}
html.at-end .hd::before,html:not(.cine) .hd::before{background:linear-gradient(rgba(var(--scrim),.97) 58%,rgba(var(--scrim),0))}
.hd__logo{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.hd__mark{width:30px;height:30px;overflow:visible}
.hd__mark .m0{fill:currentColor;transition:fill .6s}
.hd__mark .m1{fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linejoin:round}
.hd__word{font:560 22px/1 var(--fd);font-variation-settings:"SOFT" 100,"opsz" 36;letter-spacing:.16em}
.hd__sub{font-size:10.5px;color:var(--ink2)}
.hd__nav{display:flex;gap:26px}
.hd__nav a{position:relative;text-decoration:none;font-weight:500;font-size:15px;padding:6px 0}
.hd__nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--expo)}
.hd__nav a:hover::after,.hd__nav a.is-on::after{transform:scaleX(1);transform-origin:left}
.hd__cta{height:44px;padding:0 20px;font-size:14px}
.snd{display:flex;align-items:center;gap:10px;height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);transition:border-color .3s}
.snd:hover{border-color:var(--ink)}
.snd__ic{position:relative;width:16px;height:16px}
.snd__ic i{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;border:1.3px solid var(--ink2);opacity:.9}
html.sound .snd__ic i{border-color:var(--gold);animation:ripple 2.4s ease-out infinite}
html.sound .snd__ic i:nth-child(2){animation-delay:.8s}html.sound .snd__ic i:nth-child(3){animation-delay:1.6s}
@keyframes ripple{0%{transform:scale(.4);opacity:1}100%{transform:scale(2.6);opacity:0}}
.snd__txt{font-size:11px}
.hd__menu{display:none;width:44px;height:44px;border-radius:50%;position:relative}
.hd__menu span{position:absolute;left:12px;right:12px;height:2px;background:currentColor;transition:transform .35s var(--expo)}
.hd__menu span:first-child{top:17px}.hd__menu span:nth-child(2){top:25px}
.hd__menu[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.hd__menu[aria-expanded="true"] span:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:55;background:rgba(232,233,227,.97);color:#17201C;padding:calc(var(--hd) + 20px) var(--pad) 28px;display:flex;flex-direction:column;justify-content:space-between;overflow:auto}
.menu nav{display:flex;flex-direction:column}
.menu a{display:flex;align-items:baseline;gap:16px;text-decoration:none;font:400 clamp(2rem,8vw,3.2rem)/1.14 var(--fd);font-variation-settings:"SOFT" 100;letter-spacing:-.01em;border-bottom:1px solid rgba(23,32,28,.14);padding:10px 0}
.menu a small{font-size:11px;color:var(--gold-ink)}
.menu__foot{font-size:11px;color:#4F5A54;margin-top:24px}
html.menu-open{--ink:#17201C;--ink2:#4F5A54;--line:rgba(23,32,28,.18);--line2:rgba(23,32,28,.1);--scrim:232,233,227}

/* ---------- chapter badge ---------- */
.chap{position:fixed;left:16px;bottom:16px;z-index:50;display:flex;align-items:center;gap:12px;padding:6px 16px 6px 6px;border-radius:999px;background:rgba(var(--scrim),.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line2);color:var(--ink);transition:opacity .4s,transform .5s var(--expo),background-color .6s,color .6s}
.chap:hover{border-color:var(--line)}
.chap__ic{width:40px;height:40px}
.chap__ic .c0{fill:none;stroke:var(--line);stroke-width:1.2}
.chap__ic .c1{fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;transition:d .6s var(--expo)}
.chap__ic .c2{fill:currentColor;opacity:.85}
.chap__now{display:flex;flex-direction:column;line-height:1.25;font-size:10.5px;text-align:left}
.chap__now b{color:var(--em);font-weight:500}
.chap__now span{color:var(--ink2);white-space:nowrap}
html.at-end .chap{opacity:0;transform:translateY(20px);pointer-events:none}

/* ---------- chapters ---------- */
main{position:relative;z-index:2}
.ch{position:relative}
.ch__bg{position:absolute;inset:0;overflow:hidden;z-index:0}
html.gl-on .ch__bg{display:none}
.stage{position:relative;z-index:1;min-height:100vh;min-height:100svh;padding:calc(var(--hd) + 40px) var(--pad) 120px;display:flex;align-items:center}
html.cine .ch{height:calc(var(--len) * 1vh)}
html.cine .stage{position:fixed;left:0;right:0;top:0;height:100vh;height:100svh;min-height:0;visibility:hidden;pointer-events:none;z-index:3}
html.cine .stage.is-on{visibility:visible;pointer-events:auto}
html.cine .stage.is-out{visibility:visible;pointer-events:none}

.kick{display:flex;align-items:center;gap:12px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:24px}
.kick__no{display:inline-grid;place-items:center;min-width:34px;height:22px;padding:0 7px;border-radius:999px;background:var(--gold);color:#16130A;font-weight:500;letter-spacing:.04em}
.t2{font:380 clamp(2.4rem,min(5.8vw,10vh),6.2rem)/.98 var(--fd);font-variation-settings:"SOFT" 100,"opsz" 144;letter-spacing:-.022em}
.t2 .l,.hero__t .l{display:block}
.t2 em,.hero__t em{letter-spacing:-.02em}
.meta{font-size:12px;color:var(--ink2);margin-top:20px;letter-spacing:.03em;line-height:1.6}
.txt{font-size:clamp(16px,1.2vw,18.5px);line-height:1.6;color:var(--ink);opacity:.86;max-width:40ch;margin-top:16px}
.col{width:min(540px,44vw)}

/* split letters, and the gold mend that runs under a fresh headline */
.ch_{display:inline-block;will-change:transform,opacity,filter}
[data-split] .w_{display:inline-block;white-space:nowrap;perspective:700px}
[data-split]{position:relative}
[data-split]::after{content:"";position:absolute;left:0;bottom:-.12em;height:2px;width:100%;background:linear-gradient(90deg,transparent,var(--gold) 15%,#F0D894 50%,var(--gold) 85%,transparent);transform:scaleX(0);transform-origin:left;opacity:0;pointer-events:none}
[data-split].is-mend::after{animation:mend 1.6s var(--expo) forwards}
/* masked line reveal: the clip reaches well past the line box so descenders (g y p) and italic overhangs are never cut */
[data-split].is-mask .l{clip-path:inset(-.42em -.6em -.32em -.6em)}
@keyframes mend{0%{transform:scaleX(0);opacity:1}55%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}

/* hero */
.hero{width:min(600px,46vw)}
.hero__t{font:340 clamp(3.2rem,min(8vw,13vh),9.4rem)/.94 var(--fd);font-variation-settings:"SOFT" 100,"opsz" 144;letter-spacing:-.03em}
.hero__lead{font-size:clamp(16px,1.25vw,19px);line-height:1.6;opacity:.86;max-width:38ch;margin-top:28px}
.shapes{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:26px}
.shapes__l{font-size:10.5px;color:var(--ink2);letter-spacing:.08em;text-transform:uppercase;margin-right:6px}
.hero__act{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero__hint{position:absolute;left:0;top:0;display:flex;align-items:center;gap:10px;margin:-13px 0 0 -13px;font-size:11px;color:var(--ink);transition:opacity .8s;pointer-events:none;white-space:nowrap}
.hero__hint .js-hint{padding:5px 10px;border-radius:999px;background:rgba(232,233,227,.78);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero__hint.is-done{opacity:0}
.hero__hint.is-left{flex-direction:row-reverse;margin:-13px -13px 0 0}
html:not(.cine) .hero__hint{display:none}
.hint__ic{position:relative;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--gold)}
.hint__ic::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:var(--gold);animation:nudge 1.8s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateX(-5px)}50%{transform:translateX(5px)}}
#stHero,#stTon,#stShelf{touch-action:pan-y}

/* clay */
.ton__act{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.ton__hint{position:absolute;right:var(--pad);bottom:78px;font-size:11px;color:var(--ink2);transition:opacity .8s}
.ton__hint.is-done{opacity:0}

/* courses */
.stage--kurse{display:block}
.kurse__kick{position:absolute;left:var(--pad);top:calc(var(--hd) + 30px)}
.courses{position:absolute;left:var(--pad);top:calc(var(--hd) + 70px);bottom:150px;width:min(540px,44vw)}
.course{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;visibility:hidden}
.course.is-on,.course.is-out{visibility:visible}
.course__n{font-size:11px;color:var(--ink2);letter-spacing:.06em;text-transform:uppercase;margin-bottom:16px}
.price{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin-top:20px}
.price b{font:400 30px/1 var(--fd);font-variation-settings:"SOFT" 100}
.price span{font-size:10.5px;color:var(--ink2)}
html:not(.cine) .course{position:relative;transform:none;top:auto;visibility:visible;margin-bottom:90px}
html:not(.cine) .courses{position:relative;top:auto;left:auto;bottom:auto}
.steps{position:absolute;left:var(--pad);bottom:96px;display:flex;flex-wrap:wrap;gap:6px}
.steps button{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line);font-size:11px;color:var(--ink2);transition:background-color .3s,color .3s,border-color .3s}
.steps button:hover{border-color:var(--ink);color:var(--ink)}
.steps button.is-on{background:var(--ink);color:var(--porc);border-color:var(--ink)}
html.tone-dark .steps button.is-on{color:var(--night)}
html:not(.cine) .steps{display:none}

/* glaze */
.tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:26px;max-width:520px}
.tile{display:flex;flex-direction:column;align-items:center;gap:8px;padding:6px 4px 8px;border-radius:14px;border:1px solid transparent;transition:border-color .3s,background-color .3s,transform .4s var(--expo)}
.tile canvas{width:100%;max-width:64px;aspect-ratio:1;border-radius:10px;box-shadow:0 8px 18px -10px rgba(0,0,0,.6),inset 0 0 0 1px rgba(0,0,0,.1)}
.tile span{font-size:12px;font-weight:500;white-space:nowrap}
.tile:hover{border-color:var(--line)}
.tile[aria-pressed="true"]{border-color:var(--ink);background:rgba(var(--scrim),.5)}
.glaze__note{font-size:14.5px;line-height:1.55;color:var(--ink2);max-width:44ch;margin-top:16px;min-height:3.1em}
.mine{position:absolute;right:var(--pad);bottom:78px;display:flex;align-items:center;gap:10px;font-size:11px;color:var(--ink2)}
.mine__dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(201,160,75,.25)}

/* kiln */
.kiln{margin-top:28px}
.kiln__t{display:flex;align-items:baseline;gap:6px;font:300 clamp(3.4rem,7vw,6.4rem)/1 var(--fd);font-variation-settings:"SOFT" 100,"opsz" 144;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#FFF3E2;text-shadow:0 0 calc(var(--heat,0) * 40px) rgba(255,150,60,.6)}
.ch--brand .txt,.ch--brand .t2,.ch--brand .kiln__s{text-shadow:0 1px 18px rgba(10,4,2,.55)}
.kiln__u{font-size:.36em;color:var(--ink2)}
.kiln__s{font-size:11px;color:var(--ink2);margin-top:8px;min-height:1.6em}
.cones{display:block;width:180px;height:70px;margin-top:14px;overflow:visible}
.cones__base{stroke:var(--line);stroke-width:2}
.cone path{fill:#D8C9A8;stroke:rgba(0,0,0,.35);stroke-width:.8;transition:fill .6s}
.cone.is-down path{fill:#F2B260}
.cones__l{display:flex;justify-content:space-between;width:180px;font-size:10px;color:var(--ink3);padding:0 22px 0 26px}

/* kintsugi (quiet) */
.stage--quiet{justify-content:center;text-align:center}
.quiet{display:flex;flex-direction:column;align-items:center;max-width:760px;margin:0 auto;transform:translateY(-19vh)}
.quiet .kick{justify-content:center}
.quiet__t{font-size:clamp(3.4rem,8.4vw,8.6rem);line-height:.92}
.quiet .txt{max-width:36ch;margin-top:22px;font-size:clamp(16px,1.3vw,19px)}
.quiet .meta{margin-top:16px}

/* shelf */
.piece{margin-top:24px}
.piece__no{font-size:11px;color:var(--ink2)}
.piece__no b{color:var(--em);font-weight:500}
.piece__title{font:400 clamp(1.7rem,2.6vw,2.5rem)/1.05 var(--fd);font-variation-settings:"SOFT" 100;margin-top:6px}
.piece__meta{font-size:11.5px;color:var(--ink2);margin-top:8px}
.piece__price{display:flex;align-items:baseline;gap:8px;margin-top:12px;font:600 20px/1 var(--fb)}
.piece__price small{font-size:10px;color:var(--ink3);font-weight:400}
.piece__act{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.piece__msg{min-height:20px;margin-top:14px;font-size:11.5px;color:var(--gold-ink)}
.regal__hint{position:absolute;right:var(--pad);bottom:78px;font-size:11px;color:var(--ink2)}
@media (min-width:761px) and (orientation:landscape){.ch--regal .stage::before{content:"";position:absolute;inset:0 auto 0 0;width:52%;background:linear-gradient(90deg,rgba(var(--scrim),.88) 30%,rgba(var(--scrim),0));pointer-events:none;z-index:-1}}

/* booking (normal flow) */
.book{position:relative;z-index:3;padding:calc(var(--hd) + 80px) var(--pad) 120px;min-height:100vh;overflow-x:hidden;overflow-x:clip}
.book__hd{margin-bottom:clamp(36px,6vh,64px);max-width:56vw}
.book__mine{font-size:16px;color:var(--ink2);margin-top:18px;max-width:44ch}
.book__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(32px,5vw,90px)}
.form{display:flex;flex-direction:column;gap:28px;padding:clamp(22px,2.4vw,34px);border-radius:22px;background:rgba(232,233,227,.72);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--line2)}
.fs{border:0;margin:0;padding:0;min-width:0}
.fs legend,.ppl__l,.field>span{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:12px;display:block;padding:0}
.fs--row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:end}
.fs--row:last-of-type{grid-template-columns:1fr 1fr}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:999px;border:1px solid var(--line);font-weight:500;font-size:14.5px;transition:background-color .25s,color .25s,border-color .25s}
.chip:hover span{border-color:var(--ink)}
.chip input:checked+span{background:var(--ink);color:var(--porc);border-color:var(--ink)}
.chip input:focus-visible+span{outline:2px solid var(--gold-ink);outline-offset:2px}
.ppl__c{display:flex;align-items:center;gap:6px;height:48px;border:1px solid var(--line);border-radius:999px;padding:0 4px;width:max-content}
.ppl__b{width:40px;height:40px;border-radius:50%;font-size:20px}
.ppl__b:hover{background:rgba(23,32,28,.06)}
.ppl__v{min-width:28px;text-align:center;font:500 20px var(--fd)}
.check{display:flex;align-items:center;gap:12px;height:48px;cursor:pointer;font-size:15px}
.check input{width:20px;height:20px;accent-color:#17201C;margin:0}
.field{display:flex;flex-direction:column;min-width:0}
.field input{font:400 17px/1.4 var(--fb);color:var(--ink);background:transparent;border:0;border-bottom:1px solid rgba(23,32,28,.35);padding:10px 0;border-radius:0;min-width:0}
.field input:focus{outline:none;border-bottom-color:var(--gold-ink);box-shadow:0 1px 0 var(--gold-ink)}
.field.is-bad input{border-bottom-color:#B3361C;box-shadow:0 1px 0 #B3361C}
.form__end{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:6px}
.form__msg{font-size:15px;max-width:44ch}
.form__msg.is-bad{color:#B3361C}
.info{display:flex;flex-direction:column;gap:30px;align-self:start;padding:clamp(22px,2.4vw,34px);border:1px solid var(--line2);border-radius:22px;background:rgba(232,233,227,.72);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.info__k{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:12px}
.info__k small{color:var(--ink3);margin-left:8px;text-transform:none;letter-spacing:.02em}
.hours{width:100%;border-collapse:collapse;font-size:15px}
.hours th{text-align:left;font-weight:400;color:var(--ink2);padding:7px 12px 7px 0;border-bottom:1px solid var(--line2);vertical-align:top;white-space:nowrap}
.hours td{text-align:right;padding:7px 0;border-bottom:1px solid var(--line2)}
.drinks li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line2);font-size:15px}
.drinks i{font-style:normal;font-family:var(--fm);font-size:13px;color:var(--ink2);white-space:nowrap}
.info a{text-decoration:none;border-bottom:1px solid var(--line)}
.info a:hover{border-color:var(--gold-ink)}
.info__b>p:not(.info__k){font-size:15px;line-height:1.6}

/* footer */
.ft{position:relative;z-index:3;background:#17201C;color:#ECEAE3;padding:clamp(48px,7vw,96px) var(--pad) 90px;overflow:hidden}
.ft__word{font:300 clamp(5rem,26vw,26rem)/.8 var(--fd);font-variation-settings:"SOFT" 100,"opsz" 144;letter-spacing:-.04em;color:rgba(236,234,227,.08);-webkit-mask-image:linear-gradient(180deg,#000 20%,transparent 92%);mask-image:linear-gradient(180deg,#000 20%,transparent 92%);margin:0 0 clamp(30px,4vw,56px) -.04em;white-space:nowrap}
.ft__row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;font-size:15px;color:#AEB3AC;border-top:1px solid rgba(236,234,227,.14);padding-top:22px}
.ft__row a{text-decoration:none}
.ft__row a:hover{color:#ECEAE3}
.ft__fine{margin-top:36px;font-size:10.5px;line-height:1.7;color:#7E857F;max-width:90ch}

/* intro */
.intro{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:var(--porc);pointer-events:none}
html.no-js .intro,html.reduced .intro{display:none}
.intro__pot{width:min(26vmin,170px);overflow:visible}
.intro__body{fill:#17201C}
.intro__seam{fill:none;stroke:var(--gold);stroke-width:3;stroke-linejoin:round;stroke-dasharray:80;stroke-dashoffset:80}
.intro__txt{position:absolute;bottom:12vh;display:flex;gap:16px;font-size:11px;color:#4F5A54;letter-spacing:.14em;text-transform:uppercase}

/* ---------- responsive ---------- */
@media (max-width:1060px){
  .hd__nav,.hd__cta{display:none}
  .hd__menu{display:block}
  .col,.hero,.courses{width:min(540px,100%)}
}
@media (min-width:761px) and (orientation:landscape) and (max-height:780px){
  .stage{padding-top:calc(var(--hd) + 22px);padding-bottom:80px}
  .kick{margin-bottom:14px}
  .hero__lead{margin-top:16px}
  .shapes{margin-top:16px}
  .hero__act{margin-top:16px}
  .meta{margin-top:12px}
  .tiles{margin-top:16px}
  .kiln{margin-top:16px}
  .piece{margin-top:14px}.piece__act{margin-top:14px}
  .courses{top:calc(var(--hd) + 56px);bottom:128px}
  .steps{bottom:70px}
  .price{margin-top:12px}
}
@media (min-width:761px) and (orientation:landscape) and (max-height:620px){
  .hero__lead,.glaze__note{display:none}
  .chap,.course__n{display:none}
}
@media (min-width:761px) and (orientation:landscape) and (max-height:500px){
  .kick,.kurse__kick,.steps,.ch--kurse .meta,.price span,.shapes__l{display:none}
  .courses{top:calc(var(--hd) + 10px);bottom:40px}
  .t2{font-size:clamp(2rem,9vh,3rem)}
  .hero__t{font-size:clamp(2.4rem,13vh,3.6rem)}
  .txt{font-size:14.5px;margin-top:8px}
}
@media (max-width:760px),(max-width:1100px) and (orientation:portrait){
  :root{--hd:62px}
  .hd{gap:10px}
  .hd__sub{display:none}
  .snd{height:40px;padding:0 12px}
  .snd__txt{display:none}
  .stage{align-items:flex-end;padding-bottom:92px}
  .hero__t{font-size:clamp(2.9rem,14vw,6rem)}
  .hero__lead{margin-top:14px;font-size:15.5px}
  .shapes{margin-top:14px;gap:6px}
  .shapes__l{display:none}
  .pill{height:36px;padding:0 13px;font-size:13.5px}
  .hero__act{margin-top:14px;gap:8px;flex-wrap:nowrap}
  .hero__act .btn{flex:1 1 auto;min-width:0;padding:0 12px;font-size:14px;height:48px}
  .ton__hint,.mine,.regal__hint{display:none}
  .hero__hint{font-size:10.5px}
  .t2{font-size:clamp(2.3rem,11vw,4.4rem)}
  .col{width:100%}
  .txt{font-size:15.5px}
  .courses{top:auto;bottom:118px;width:calc(100% - var(--pad) * 2)}
  .course{top:auto;bottom:0;transform:none}
  .course__n{margin-bottom:10px}
  .price{margin-top:12px}.price b{font-size:24px}
  .steps{bottom:62px;left:var(--pad);right:var(--pad);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .steps::-webkit-scrollbar{display:none}
  .steps button{flex:none;height:34px}
  .kurse__kick{top:calc(var(--hd) + 14px)}
  .tiles{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin-top:16px}
  .tile{padding:4px 2px 6px}
  .tile span{font-size:10.5px}
  .glaze__note{font-size:13.5px;margin-top:10px}
  .kiln{margin-top:14px;display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:16px}
  .kiln__t{font-size:clamp(2.8rem,13vw,4rem);grid-column:1/-1}
  .cones{width:140px;height:56px;margin-top:6px}
  .cones__l{width:140px;padding:0 16px 0 20px}
  .quiet{transform:none}
  .stage--quiet{align-items:flex-end}
  .quiet__t{font-size:clamp(3rem,15vw,5.4rem)}
  .piece{margin-top:12px}
  .piece__act{margin-top:14px}
  .piece__act .btn--acc{flex:1}
  .book__hd{max-width:none}
  .book__grid{grid-template-columns:minmax(0,1fr)}
  .fs--row,.fs--row:last-of-type{grid-template-columns:minmax(0,1fr)}
  .ft__row{grid-template-columns:minmax(0,1fr)}
  .chap{left:12px;bottom:12px;padding-right:10px}
  .chap__ic{width:36px;height:36px}
  .chap__now span{display:none}
  .stage::before{content:"";position:absolute;left:0;right:0;bottom:0;height:64%;background:linear-gradient(rgba(var(--scrim),0),rgba(var(--scrim),.82) 38%,rgba(var(--scrim),.94));pointer-events:none;z-index:-1;transition:background .6s}
  .ch--hero .stage::before{height:66%}
}
@media (max-width:380px){
  .tile span{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}
}

/* ---------- without WebGL: drawn stills beside the text ---------- */
.ch__bg canvas{position:absolute;top:50%;right:var(--pad);width:min(44vw,76vh);height:auto;transform:translateY(-50%)}
html:not(.cine) .stage--kurse{padding:calc(var(--hd) + 40px) var(--pad) 60px}
html:not(.cine) .kurse__kick{position:static}
html:not(.cine) .course .t2{font-size:clamp(2.2rem,4.6vw,4.4rem)}
html:not(.gl-on) .ch--brand{background:#170C07;--ink:#ECEAE3;--ink2:#AEB3AC;--em:#E2C27A;color:var(--ink)}
html:not(.gl-on) .ch--kintsugi{background:#0D1110;--ink:#ECEAE3;--ink2:#AEB3AC;--em:#E2C27A;color:var(--ink)}
html:not(.gl-on) .ch--kintsugi .ch__bg canvas{right:50%;transform:translate(50%,-10%);opacity:.5}
@media (max-width:760px),(max-width:1100px) and (orientation:portrait){
  .ch__bg canvas{top:calc(var(--hd) + 10px);right:50%;width:min(80vw,46vh);transform:translateX(50%)}
}

/* custom cursor (fine pointers only) */
.cur{position:fixed;left:0;top:0;z-index:150;pointer-events:none;display:none;color:var(--ink)}
html.has-cur .cur{display:block}
html.has-cur,html.has-cur a,html.has-cur button,html.has-cur label{cursor:none}
.cur__dot{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--gold)}
.cur__ring{position:absolute;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;border:1px solid var(--line);transition:width .35s var(--expo),height .35s var(--expo),margin .35s var(--expo),border-color .3s,background-color .3s}
.cur.is-link .cur__ring{width:56px;height:56px;margin:-28px 0 0 -28px;border-color:var(--gold);background:rgba(201,160,75,.1)}
.cur.is-grab .cur__ring{width:76px;height:76px;margin:-38px 0 0 -38px;border-color:var(--gold);border-width:1.5px}
.cur.is-down .cur__ring{width:30px;height:30px;margin:-15px 0 0 -15px}
.cur__lbl{position:absolute;left:24px;top:14px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;opacity:0;transition:opacity .3s}
.cur.has-lbl .cur__lbl{opacity:1}