:root{
  --paper:#F1ECE2; --paper-2:#E7E0D2; --ink:#22251F; --ink-2:#615F56; --line:rgba(34,37,31,.17);
  --spruce:#141B18; --spruce-2:#1D2622; --mist:#D9D5C8; --thermal:#D9A06A;
  --g:clamp(16px,4.2vw,72px);
  --e:cubic-bezier(.19,.72,.16,1);
  --serif:"Oranienbaum",Georgia,"Times New Roman",serif;
  --ital:"Bona Nova",Georgia,serif;
  --sans:"Commissioner","Helvetica Neue",Arial,sans-serif;
  --sbw:0px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--paper);scroll-behavior:smooth}
html.lock{overflow:hidden}
html.lock body{padding-right:var(--sbw)}
body{margin:0;background:var(--paper);color:var(--ink);font:300 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;margin:0}
p,figure,dl,dd,ul,fieldset{margin:0;padding:0}
ul{list-style:none}
fieldset{border:0;min-width:0}
em{font-family:var(--ital);font-style:italic;letter-spacing:-.01em}
sub{font-size:.62em;line-height:0}
:focus-visible{outline:1.5px solid currentColor;outline-offset:4px}
.skip{position:fixed;left:12px;top:-60px;z-index:100;background:var(--ink);color:var(--paper);padding:10px 16px;transition:top .2s}
.skip:focus{top:12px}

.sec{padding:clamp(92px,13vw,190px) var(--g)}
.eye{font:400 11.5px/1.3 var(--sans);letter-spacing:.24em;text-transform:uppercase}
.h2{font-size:clamp(42px,6.3vw,100px);line-height:1.03;letter-spacing:-.008em}
.h2 em{font-size:1.02em}

/* links and buttons */
.link{display:inline-flex;align-items:center;gap:12px;font:400 12px/1 var(--sans);letter-spacing:.17em;text-transform:uppercase;padding:8px 0;position:relative;white-space:nowrap}
.link--line::after{content:"";position:absolute;left:0;right:0;bottom:1px;height:1px;background:currentColor;transform-origin:right;transition:transform .55s var(--e)}
.link--line:hover::after{transform:scaleX(0)}
.burger{display:block;width:26px;height:9px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;transition:height .35s var(--e)}
.link:hover .burger{height:5px}
.btn{display:inline-block;font:400 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;padding:21px 38px;border:1px solid currentColor;color:var(--paper);transition:background .4s,color .4s}
.btn:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn--dark{display:block;text-align:center;background:var(--ink);border-color:var(--ink);color:var(--paper)}
.btn--dark:hover{background:transparent;color:var(--ink);border-color:var(--ink)}
.only-narrow{display:none}

/* header */
.hd{position:fixed;inset:0 0 auto;z-index:40;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px var(--g);color:#fff;transition:transform .6s var(--e),background .4s,color .4s,padding .4s}
.hd__r{display:flex;justify-content:flex-end;align-items:center;gap:clamp(18px,3vw,44px)}
.hd.is-solid{background:var(--paper);color:var(--ink);box-shadow:0 1px 0 var(--line);padding-block:13px}
.hd.is-away{transform:translateY(-102%)}
.mark{font:400 clamp(19px,1.75vw,25px)/1 var(--serif);letter-spacing:.34em;margin-right:-.34em}
html.lock .hd{padding-right:calc(var(--g) + var(--sbw))}

/* full-screen menu */
.menu{position:fixed;inset:0;z-index:60;background:var(--spruce);color:var(--paper);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:auto 1fr auto;gap:0 var(--g);padding:20px var(--g) clamp(24px,4vh,44px);visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .85s var(--e),visibility 0s .85s;overflow-y:auto}
.menu.is-open{visibility:visible;clip-path:inset(0);transition:clip-path .85s var(--e),visibility 0s}
.menu__top{grid-column:1/-1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.menu__book{justify-self:end}
.menu__nav{align-self:center;display:flex;flex-direction:column;padding-block:28px}
.menu__nav a{font:400 clamp(34px,min(5.6vw,8.2vh),76px)/1.2 var(--serif);display:flex;align-items:baseline;gap:18px;opacity:0;transform:translateY(26px);transition:opacity .7s var(--e),transform .7s var(--e),padding .5s var(--e),color .3s}
.menu__nav small{font:400 11px/1 var(--sans);letter-spacing:.14em;opacity:.55;width:24px}
.menu__nav a:hover,.menu__nav a:focus-visible{padding-left:16px;color:var(--thermal)}
.menu.is-open .menu__nav a{opacity:1;transform:none}
.menu.is-open .menu__nav a:nth-child(1){transition-delay:.22s}.menu.is-open .menu__nav a:nth-child(2){transition-delay:.27s}.menu.is-open .menu__nav a:nth-child(3){transition-delay:.32s}.menu.is-open .menu__nav a:nth-child(4){transition-delay:.37s}.menu.is-open .menu__nav a:nth-child(5){transition-delay:.42s}.menu.is-open .menu__nav a:nth-child(6){transition-delay:.47s}.menu.is-open .menu__nav a:nth-child(7){transition-delay:.52s}
.menu.is-open .menu__nav a:hover{transition-delay:0s}
.menu__media{grid-column:2;grid-row:2/4;align-self:stretch;margin-top:28px;overflow:hidden;min-height:0;position:relative}
.menu__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s}
.menu__foot{grid-column:1;display:flex;gap:clamp(28px,6vw,90px);font-size:14px;line-height:1.6;opacity:.78}

/* hero */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;color:#fff;background:var(--spruce)}
.hero__media{position:absolute;inset:-5% 0;will-change:transform}
.hero__media img{width:100%;height:100%;object-fit:cover;animation:settle 3.6s var(--e) both}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(90% 74% at 12% 100%,rgba(12,17,15,.72) 0,rgba(12,17,15,0) 72%),linear-gradient(180deg,rgba(14,19,17,.5) 0,rgba(14,19,17,.1) 24%,rgba(14,19,17,.26) 52%,rgba(14,19,17,.84) 100%)}
.hero__fog{position:absolute;left:0;right:0;bottom:6%;height:46%;z-index:1;background:url(img/fog.webp) repeat-x 0 50%/2400px 100%;mix-blend-mode:screen;opacity:.42;animation:drift 110s linear infinite;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 38%,#000 62%,transparent);mask-image:linear-gradient(180deg,transparent,#000 38%,#000 62%,transparent)}
.hero__copy{position:absolute;z-index:2;left:var(--g);right:var(--g);bottom:clamp(26px,5.4vh,60px);display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,340px);gap:40px;align-items:end}
.hero h1{font-size:clamp(45px,7.5vw,126px);line-height:1;letter-spacing:-.012em}
.ln{display:block;overflow:hidden;padding-bottom:.13em;margin-bottom:-.13em}
.ln>span{display:block;transform:translateY(112%);animation:rise 1.5s var(--e) .28s forwards}
.ln:nth-child(2)>span{animation-delay:.4s}.ln:nth-child(3)>span{animation-delay:.52s}
.hero__side{font-size:15.5px;line-height:1.58;opacity:0;animation:fade 1.4s var(--e) 1.05s forwards}
.descend{display:inline-flex;align-items:center;gap:14px;margin-top:22px;font:400 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase}
.descend i{display:block;width:1px;height:46px;background:rgba(255,255,255,.4);position:relative;overflow:hidden}
.descend i::after{content:"";position:absolute;left:0;top:-50%;width:1px;height:50%;background:#fff;animation:drop 2.4s var(--e) infinite}
@keyframes settle{from{transform:scale(1.13)}to{transform:scale(1)}}
@keyframes rise{to{transform:none}}
@keyframes fade{to{opacity:1}}
@keyframes drop{to{top:110%}}
@keyframes drift{to{background-position-x:-2400px}}

/* prologue */
.pro{padding-bottom:clamp(70px,9vw,130px)}
.pro__lead{font:400 clamp(29px,4.2vw,66px)/1.14 var(--serif);max-width:20.5em;margin-top:clamp(20px,3vw,36px);letter-spacing:-.005em}
.pro__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px);margin-top:clamp(70px,10vw,150px);align-items:start}
.pro__theta{grid-column:1/6}
.theta{position:relative;width:min(100%,430px);aspect-ratio:1}
.theta svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:var(--ink);stroke-width:1}
.theta circle,.theta line{stroke-dasharray:1;stroke-dashoffset:0}
.js .theta[data-draw] circle,.js .theta[data-draw] line{stroke-dashoffset:1;transition:stroke-dashoffset 2.2s var(--e)}
.js .theta[data-draw] line{transition-delay:.5s}
.js .theta[data-draw].in circle,.js .theta[data-draw].in line{stroke-dashoffset:0}
.theta circle{transform:rotate(-180deg);transform-origin:center}
.theta div{position:absolute;left:0;right:0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:3px}
.theta__t{bottom:calc(50% + clamp(18px,3.4vw,44px))}
.theta__b{top:calc(50% + clamp(18px,3.4vw,44px))}
.theta b{font:400 clamp(36px,5vw,70px)/1 var(--serif)}
.theta span{font-size:13px;letter-spacing:.03em;color:var(--ink-2)}
.facts{display:flex;gap:clamp(30px,5vw,70px);margin-top:clamp(36px,4vw,56px)}
.facts dt{font-size:13px;color:var(--ink-2)}
.facts dd{font:400 clamp(26px,2.7vw,38px)/1.3 var(--serif)}
.pro__a{grid-column:6/13;grid-row:1}
.pro__b{grid-column:4/8;grid-row:2;margin-top:clamp(-120px,-8vw,-50px);z-index:2;box-shadow:0 0 0 clamp(8px,1vw,14px) var(--paper)}
.pro__note{grid-column:9/13;grid-row:2;margin-top:clamp(26px,3.2vw,48px);font-size:16px;color:var(--ink-2)}

/* image reveal */
.pic{overflow:hidden;position:relative}
.pic img{width:100%;height:100%;object-fit:cover}
.js [data-pic]{clip-path:inset(9% 0 9% 0);transition:clip-path 1.5s var(--e)}
.js [data-pic] img{transform:scale(1.14);transition:transform 2s var(--e)}
.js [data-pic].in{clip-path:inset(0)}
.js [data-pic].in img{transform:scale(1)}
.js [data-rv]{opacity:0;transform:translateY(26px);transition:opacity 1.2s var(--e),transform 1.2s var(--e)}
.js [data-rv].in{opacity:1;transform:none}

/* water scene */
.water{position:relative;height:640vh;height:640svh;background:var(--spruce);color:var(--paper)}
.water__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;--bx:66vw}
.water canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.water__reveal{position:absolute;inset:0;clip-path:circle(0 at var(--bx) 62%);background:var(--spruce);will-change:clip-path}
.water__reveal img{width:100%;height:100%;object-fit:cover;filter:brightness(.74)}
.water__reveal::after{content:"";position:absolute;inset:0;background:radial-gradient(62% 46% at 50% 50%,rgba(10,16,15,.66) 0,rgba(10,16,15,.34) 56%,rgba(10,16,15,0) 100%)}
.water__depth{position:absolute;left:calc(var(--bx) + 26px);top:62%;transform:translateY(-50%);display:flex;align-items:baseline;gap:10px;white-space:nowrap;opacity:0;padding-left:30px}
.water__depth::before{content:"";position:absolute;left:-14px;top:52%;width:34px;height:1px;background:rgba(241,236,226,.7)}
#depthNum{font:400 clamp(60px,8.6vw,136px)/1 var(--serif);letter-spacing:-.01em;font-variant-numeric:lining-nums}
.water__depth small{font-size:13px;opacity:.72}
.step{position:absolute;left:var(--g);top:50%;width:min(38vw,540px);transform:translateY(-50%);opacity:0;visibility:hidden}
.step h2,.step h3{font-size:clamp(32px,4vw,62px);line-height:1.06;margin:14px 0 16px}
.step p:not(.eye){font-size:17px;line-height:1.6;color:var(--mist);max-width:29em}
.step .eye{color:var(--thermal)}
.step--first{top:70%}
.step--first .eye{color:var(--mist)}
.els{display:flex;flex-wrap:wrap;gap:6px clamp(16px,2vw,28px);margin-top:26px}
.els li{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:44px}
.els b{font:400 clamp(30px,3vw,44px)/1 var(--serif);color:var(--thermal)}
.els span{font-size:12px;opacity:.8}
.step--final{left:var(--g);right:var(--g);width:auto;text-align:center}
.step--final{text-shadow:0 1px 26px rgba(8,13,12,.55)}
.step--final h3{font-size:clamp(40px,6.6vw,108px);line-height:1.02;margin:0 0 20px}
.step--final p:not(.eye){margin-inline:auto;color:#fff;max-width:32em}

/* no-JS and reduced motion: stack the scene */
.no-js .water,.water.is-static{height:auto}
.no-js .water__stage,.water.is-static .water__stage{position:static;height:auto;overflow:visible;padding:clamp(80px,12vw,160px) var(--g)}
.no-js .water canvas,.no-js .water__reveal,.no-js .water__depth,.water.is-static canvas,.water.is-static .water__reveal,.water.is-static .water__depth{display:none}
.no-js .step,.water.is-static .step{position:static;width:auto;max-width:640px;opacity:1;visibility:visible;transform:none;margin-bottom:64px;text-align:left}
.no-js .step--final p:not(.eye),.water.is-static .step--final p:not(.eye){margin-inline:0}

/* care */
.care{background:var(--paper)}
.care__head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px)}
.care__head .eye{grid-column:1/-1;margin-bottom:clamp(18px,2.4vw,30px)}
.care__head .h2{grid-column:1/10}
.care__intro{grid-column:8/13;margin-top:clamp(26px,3.4vw,50px);color:var(--ink-2)}
.tx{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px);margin-top:clamp(64px,8vw,120px);align-items:start}
.tx__media{grid-column:1/7;position:sticky;top:96px;aspect-ratio:4/3.1;overflow:hidden;background:var(--paper-2)}
.tx__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .9s var(--e),transform 1.6s var(--e)}
.tx__media img.is-on{opacity:1;transform:none}
.tx__list{grid-column:8/13;border-top:1px solid var(--line)}
.acc{border-bottom:1px solid var(--line)}
.acc h3{font-size:clamp(25px,2.6vw,38px);line-height:1.15}
.acc button{width:100%;display:flex;align-items:baseline;gap:16px;padding:clamp(20px,2vw,28px) 0;text-align:left;font:inherit}
.acc small{font:400 11px/1 var(--sans);letter-spacing:.14em;color:var(--ink-2)}
.acc button span{flex:1}
.acc i{align-self:center;position:relative;width:15px;height:15px;flex:none}
.acc i::before,.acc i::after{content:"";position:absolute;left:0;right:0;top:7px;height:1px;background:currentColor;transition:transform .5s var(--e)}
.acc i::after{transform:rotate(90deg)}
.acc.is-open i::after{transform:rotate(0)}
.acc__p{display:grid;grid-template-rows:0fr;transition:grid-template-rows .65s var(--e)}
.acc.is-open .acc__p{grid-template-rows:1fr}
.acc__p>div{overflow:hidden}
.acc__p p{padding:0 31px clamp(22px,2.2vw,30px) 0;color:var(--ink-2)}

.salt{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px);margin-top:clamp(90px,12vw,180px);align-items:end}
.salt__pic{grid-column:4/13;grid-row:1;margin-right:calc(var(--g) * -1);aspect-ratio:16/10}
.salt__txt{grid-column:1/5;grid-row:1;z-index:2;padding-bottom:clamp(20px,4vw,60px)}
.salt__q{font:400 clamp(26px,3vw,46px)/1.12 var(--serif);margin-top:14px;background:var(--paper);padding:clamp(16px,2vw,28px) clamp(16px,2vw,28px) clamp(16px,2vw,28px) 0}

.idx{margin-top:clamp(90px,12vw,170px)}
.idx__t{font-size:clamp(30px,3.4vw,50px);padding-bottom:clamp(20px,2.4vw,32px);border-bottom:1px solid var(--line)}
.idx__g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px clamp(18px,2.6vw,40px);margin-top:clamp(28px,3.4vw,46px)}
.idx h4{font:400 11.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);margin-bottom:16px}
.idx li{font-size:16px;line-height:1.42;padding:7px 0}
.idx__dx{margin-top:clamp(40px,5vw,70px);padding-top:22px;border-top:1px solid var(--line);font:400 clamp(21px,2.1vw,30px)/1.3 var(--serif);display:flex;flex-wrap:wrap;gap:6px 26px;align-items:baseline}
.idx__dx .eye{color:var(--ink-2)}
.warn{margin-top:18px;font-size:14px;color:var(--ink-2)}

/* rooms */
.rooms{background:var(--paper-2);padding:clamp(92px,12vw,170px) 0 clamp(92px,12vw,170px)}
.rooms__head{display:flex;justify-content:space-between;align-items:end;gap:40px;padding:0 var(--g);flex-wrap:wrap}
.rooms__head .eye{margin-bottom:clamp(18px,2.4vw,30px)}
.rooms__side{display:flex;align-items:end;gap:clamp(24px,4vw,60px);max-width:540px;font-size:16px;color:var(--ink-2)}
.rooms__nav{display:flex;gap:8px;color:var(--ink);flex:none}
.rooms__nav button{width:50px;height:50px;border:1px solid var(--line);font-size:18px;transition:background .3s,color .3s}
.rooms__nav button:hover{background:var(--ink);color:var(--paper)}
.rooms__rail{display:flex;gap:clamp(14px,2vw,30px);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:clamp(40px,5vw,72px) var(--g) 0;scroll-padding-inline:var(--g);cursor:grab}
.rooms__rail::-webkit-scrollbar{display:none}
.rooms__rail.is-drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.room{flex:0 0 min(84vw,58vw + 180px,860px);scroll-snap-align:start;display:flex;flex-direction:column;align-items:flex-start}
.room .pic{width:100%;aspect-ratio:3/2}
.room .pic img{transition:transform 1.6s var(--e)}
.room:hover .pic img{transform:scale(1.035)}
.room__row{display:flex;justify-content:space-between;align-items:baseline;gap:18px;width:100%;margin-top:22px}
.room h3{font-size:clamp(33px,3.6vw,54px);line-height:1.05}
.room__p{text-align:right;font-size:14px;line-height:1.5;color:var(--ink-2);white-space:nowrap}
.room__p b{font-weight:400;color:var(--ink)}
.room__d{margin:12px 0 18px;max-width:34em;color:var(--ink-2);font-size:16px}
.rooms__bar{margin:clamp(30px,3.6vw,46px) var(--g) 0;height:1px;background:var(--line);position:relative}
.rooms__bar i{position:absolute;left:0;top:0;height:1px;width:100%;background:var(--ink);transform-origin:left;transform:scaleX(.25)}
.coat{text-align:center;padding:clamp(96px,13vw,180px) var(--g) 0;max-width:1060px;margin:0 auto}
.coat__q{font:400 clamp(42px,6.8vw,104px)/1.03 var(--serif);margin:18px 0 22px}
.coat__t{max-width:34em;margin:0 auto;color:var(--ink-2)}

/* baths */
.baths__head{margin-bottom:clamp(54px,7vw,110px)}
.baths__head .eye{margin-bottom:clamp(18px,2.4vw,30px)}
.bath{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px);align-items:end;margin-bottom:clamp(64px,9vw,140px)}
.bath .pic{aspect-ratio:3/2}
.bath small{display:block;font-size:13px;color:var(--ink-2);margin-bottom:10px}
.bath h3{font-size:clamp(28px,3vw,46px);line-height:1.1;margin-bottom:12px}
.bath p{color:var(--ink-2);max-width:26em}
.bath--a .pic{grid-column:1/9}.bath--a .bath__t{grid-column:9/13}
.bath--b .pic{grid-column:6/13;grid-row:1}.bath--b .bath__t{grid-column:2/6;grid-row:1;align-self:center}
.bath--c .pic{grid-column:2/9}.bath--c .bath__t{grid-column:9/13}
.spa{border-top:1px solid var(--line);padding-top:24px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px)}
.spa .eye{grid-column:1/5;color:var(--ink-2);padding-top:6px}
.spa ul{grid-column:5/13;columns:2;column-gap:clamp(24px,4vw,60px);font:400 clamp(21px,2vw,29px)/1.2 var(--serif)}
.spa li{padding:0 0 14px;break-inside:avoid}

/* table */
.table{background:var(--spruce);color:var(--paper);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:stretch}
.table__pic{min-height:clamp(380px,48vw,780px)}
.table__pic img{position:absolute;inset:0;filter:saturate(.74) brightness(.94)}
.table__t{padding:clamp(64px,8vw,130px) var(--g) clamp(64px,8vw,130px) clamp(34px,5vw,84px);align-self:center}
.table .h2{font-size:clamp(38px,4.6vw,76px);margin:clamp(16px,2vw,26px) 0 clamp(26px,3vw,44px)}
.table li{padding:13px 0;border-top:1px solid rgba(241,236,226,.18);color:var(--mist);font-size:16px}

/* evenings */
.eve__head{margin-bottom:clamp(50px,6vw,96px)}
.eve__head .eye{margin-bottom:clamp(18px,2.4vw,30px)}
.eve__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px);row-gap:clamp(40px,5vw,72px);align-items:start}
.eve__a{grid-column:1/8;aspect-ratio:3/2}
.eve__a img{filter:grayscale(1) contrast(1.04)}
.eve__a figcaption{position:absolute;left:14px;bottom:12px;font-size:13px;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.55)}
.eve__b{grid-column:9/13;aspect-ratio:4/5;margin-top:clamp(40px,8vw,130px)}
.eve__list{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(18px,3vw,50px)}
.eve__list div{padding:20px 0 26px;border-top:1px solid var(--line)}
.eve__list dt{font:400 clamp(24px,2.3vw,33px)/1.15 var(--serif);margin-bottom:8px}
.eve__list dd{color:var(--ink-2);font-size:16px}

/* visit */
.visit{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.8vw,28px);align-items:center;background:var(--paper-2)}
.visit__map{grid-column:1/7;position:relative;aspect-ratio:1/1.04}
.visit__map canvas{position:absolute;inset:0;width:100%;height:100%}
.pin{position:absolute;left:50%;top:50%;display:flex;flex-direction:column;align-items:center;gap:2px;transform:translate(-50%,-14px)}
.pin i{width:14px;height:14px;border:1px solid var(--ink);border-radius:50%;background:var(--paper);position:relative;margin-bottom:6px}
.pin i::after{content:"";position:absolute;left:-1px;right:-1px;top:50%;height:1px;background:var(--ink)}
.pin span{font:400 22px/1 var(--serif);background:var(--paper-2);padding:2px 8px}
.pin small{font-size:12.5px;color:var(--ink-2);background:var(--paper-2);padding:0 6px}
.visit__t{grid-column:8/13}
.visit .h2{font-size:clamp(38px,4.6vw,74px);margin:clamp(16px,2vw,26px) 0 clamp(26px,3vw,44px)}
.visit__d div{display:grid;grid-template-columns:minmax(110px,150px) 1fr;gap:16px;padding:14px 0;border-top:1px solid var(--line);font-size:16px}
.visit__d dt{color:var(--ink-2)}
.visit__t .link{margin-top:26px}

/* closing */
.come{position:relative;height:100vh;height:100svh;min-height:520px;overflow:hidden;color:var(--paper);display:grid;place-items:center;text-align:center}
.come__bg{position:absolute;inset:-8% 0}
.come__bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.32);transform-origin:72% 0}
.come::after{content:"";position:absolute;inset:0;background:rgba(16,22,19,.5)}
.come__t{position:relative;z-index:2;padding:0 var(--g);display:flex;flex-direction:column;align-items:center;gap:clamp(30px,3.6vw,50px)}
.come h2{font-size:clamp(50px,9.4vw,160px);line-height:1}

/* footer */
.ft{background:var(--spruce);color:var(--mist);padding:clamp(50px,6vw,90px) var(--g) 34px;overflow:hidden}
.ft__mark{font:400 clamp(58px,17.4vw,300px)/.92 var(--serif);text-align:center;letter-spacing:.075em;margin-right:-.075em;color:var(--paper)}
.ft__row{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:24px;margin-top:clamp(36px,4vw,64px);padding-top:22px;border-top:1px solid rgba(241,236,226,.18);font-size:14.5px;line-height:1.6}
.ft__note a{text-decoration:underline;text-underline-offset:3px}

/* booking drawer */
.scrim{position:fixed;inset:0;z-index:69;background:rgba(14,19,17,.55);opacity:0;visibility:hidden;transition:opacity .5s,visibility 0s .5s}
.scrim.is-open{opacity:1;visibility:visible;transition:opacity .5s}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:70;width:min(100%,520px);background:var(--paper);color:var(--ink);padding:20px clamp(20px,3.2vw,44px) 30px;overflow-y:auto;transform:translateX(102%);visibility:hidden;transition:transform .75s var(--e),visibility 0s .75s}
.drawer.is-open{transform:none;visibility:visible;transition:transform .75s var(--e)}
.drawer__top{display:flex;justify-content:space-between;align-items:center}
.drawer h2{font-size:clamp(35px,3.6vw,48px);line-height:1.06;margin:clamp(16px,2.6vh,30px) 0 clamp(14px,2.4vh,26px)}
.drawer fieldset{margin-bottom:clamp(12px,2vh,20px)}
.drawer legend{font-size:13px;color:var(--ink-2);margin-bottom:8px;padding:0}
.opts{display:grid;gap:6px}
.opts--2{grid-template-columns:1fr 1fr}.opts--3{grid-template-columns:1fr 1fr 1fr}
.opts label{position:relative;cursor:pointer}
.opts input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.opts span{display:block;text-align:center;font-size:15px;line-height:1.2;font-weight:400;padding:13px 6px;border:1px solid var(--line);transition:background .25s,color .25s,border-color .25s}
.opts input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.opts input:focus-visible+span{outline:1.5px solid var(--ink);outline-offset:2px}
.sum{border-top:1px solid var(--line);margin-top:clamp(14px,2.4vh,24px);padding:clamp(12px,2vh,20px) 0}
.sum small{font-size:13px;color:var(--ink-2);display:block}
.sum output{display:block;font:400 clamp(44px,4.6vw,60px)/1.12 var(--serif)}
.sum p{font-size:14px;color:var(--ink-2)}
.drawer__tel{text-align:center;font-size:15px;margin-top:12px}
.drawer__tel a{text-decoration:underline;text-underline-offset:3px}
.fine{font-size:13px;line-height:1.5;color:var(--ink-2);margin-top:clamp(12px,1.8vh,20px)}

/* tablet */
@media (max-width:1100px){.hd__tel{display:none}}
@media (max-width:800px){
  body{font-size:16.5px}
  .only-wide{display:none}.only-narrow{display:inline}
  .hd{padding-block:15px}
  .link span:not(.only-narrow):not(.only-wide){letter-spacing:.14em}
  .menu{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}
  .menu__media{display:none}
  .menu__book{display:none}
  .menu__nav a{font-size:clamp(32px,10.5vw,50px)}
  .menu__foot{grid-column:1;justify-content:space-between}
  .hero__copy{grid-template-columns:1fr;gap:18px}
  .hero h1{font-size:clamp(38px,11.4vw,74px)}
  .hero__side{font-size:15px}
  .descend{margin-top:14px}
  .descend i{height:30px}
  .pro__theta{grid-column:1/-1}
  .theta{margin:0 auto;width:min(100%,360px)}
  .facts{justify-content:center}
  .pro__a{grid-column:1/-1;grid-row:auto;margin-top:56px}
  .pro__b{grid-column:5/13;grid-row:auto;margin-top:-52px}
  .pro__note{grid-column:1/-1;grid-row:auto;margin-top:26px}
  .water{height:600vh;height:600svh}
  .water__stage{--bx:88vw}
  .water__depth{left:var(--g);top:calc(env(safe-area-inset-top) + 28px);transform:none;padding-left:0;flex-direction:column;gap:2px;align-items:flex-start}
  .water__depth::before{display:none}
  #depthNum{font-size:clamp(58px,17vw,86px)}
  .step{left:var(--g);right:21vw;width:auto;top:auto;bottom:9vh;bottom:9svh;transform:none}
  .step--first{top:auto;bottom:6vh;bottom:6svh}
  .step h2,.step h3{font-size:clamp(30px,8.4vw,42px);margin:10px 0 12px}
  .step p:not(.eye){font-size:16px}
  .els{margin-top:18px;display:grid;grid-template-columns:repeat(6,auto);justify-content:space-between;gap:0 6px}
  .els li{min-width:0}
  .els b{font-size:26px}
  .els span{font-size:11px}
  .step--final{right:var(--g);top:50%;bottom:auto;transform:translateY(-50%)}
  .step--final h3{font-size:clamp(38px,11vw,60px)}
  .care__head .h2{grid-column:1/-1}
  .care__intro{grid-column:1/-1}
  .tx__media{grid-column:1/-1;position:relative;top:0;margin-bottom:24px}
  .tx__list{grid-column:1/-1}
  .salt__pic{grid-column:1/-1;grid-row:1;margin-left:calc(var(--g) * -1)}
  .salt__txt{grid-column:1/-1;grid-row:2;padding-top:22px;padding-bottom:0}
  .salt__q{padding:0;background:none}
  .idx__g{grid-template-columns:1fr 1fr;gap:34px 20px}
  .rooms__side{max-width:none;width:100%;justify-content:space-between}
  .room{flex-basis:84vw}
  .room__row{flex-direction:column;gap:8px;align-items:flex-start}
  .room__p{text-align:left}
  .bath .pic,.bath .bath__t{grid-column:1/-1!important;grid-row:auto!important}
  .bath .bath__t{margin-top:20px}
  .spa .eye,.spa ul{grid-column:1/-1}
  .spa ul{columns:1;margin-top:18px}
  .table{grid-template-columns:1fr}
  .table__pic{min-height:0;aspect-ratio:3/2}
  .table__t{padding:58px var(--g) 62px}
  .eve__a{grid-column:1/-1}
  .eve__b{grid-column:5/13;margin-top:-44px;z-index:2;box-shadow:0 0 0 8px var(--paper)}
  .eve__list{grid-template-columns:1fr}
  .visit__map{grid-column:1/-1;aspect-ratio:1/.8;margin-bottom:34px}
  .visit__t{grid-column:1/-1}
  .ft__row{grid-template-columns:1fr}
}
@media (max-width:420px){.idx__g{grid-template-columns:1fr}}
@media (max-height:640px) and (min-width:801px){.step p:not(.eye){font-size:16px}.els{margin-top:16px}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .hero__fog{animation:none}
}