:root{
  --bg:#e2ddd4;--bg2:#d8d2c7;--fg:#15191c;--mute:#565b5e;--line:rgba(21,25,28,.18);--acc:#8e4424;--dark:#15191c;--on-dark:#e2ddd4;
  --sans:'Schibsted Grotesk',system-ui,sans-serif;--mono:'Fragment Mono',ui-monospace,Menlo,monospace;
  --g:clamp(16px,2.4vw,32px);--ease:cubic-bezier(.2,.7,.2,1)
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:var(--bg);color:var(--fg);font:400 15px/1.5 var(--sans);font-feature-settings:"kern";text-rendering:optimizeLegibility}
h1,h2,p,ol,ul,dl,dd,figure,blockquote{margin:0;padding:0}
ol,ul{list-style:none}
img{display:block;width:100%;height:100%;object-fit:cover}
picture{display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.01em}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:50;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;padding:14px var(--g);color:var(--fg);mix-blend-mode:normal;transition:background .3s var(--ease)}
.top.scrolled{background:rgba(226,221,212,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.wm{font-weight:800;font-size:22px;letter-spacing:-.035em;text-decoration:none;line-height:1}
.top .meta{font:12px/1 var(--mono);color:var(--mute)}
.btn{display:inline-flex;align-items:center;height:36px;padding:0 18px;background:var(--dark);color:var(--on-dark);text-decoration:none;font-weight:600;font-size:13px;border-radius:999px;transition:background .2s}
.btn:hover{background:var(--acc)}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,42fr) minmax(0,58fr);min-height:100svh}
.hero-l{display:flex;flex-direction:column;justify-content:flex-end;padding:96px var(--g) 72px;gap:36px}
.hero h1{font-weight:800;font-size:clamp(34px,4.4vw,64px);line-height:.98;letter-spacing:-.04em;max-width:11ch}
.idx{border-top:1px solid var(--line)}
.idx a{display:grid;grid-template-columns:34px 1fr;align-items:baseline;column-gap:12px;padding:11px 0;border-bottom:1px solid var(--line);text-decoration:none;position:relative}
.idx .num{font:12px var(--mono);color:var(--mute);transition:color .2s}
.idx .lbl{font-size:clamp(18px,1.5vw,22px);font-weight:600;letter-spacing:-.015em;transition:transform .35s var(--ease)}
.idx .cap{grid-column:2;font-size:13px;color:var(--mute);max-height:0;opacity:0;overflow:hidden;transition:max-height .35s var(--ease),opacity .3s}
.idx a:hover .num,.idx a:focus-visible .num,.idx a.act .num{color:var(--acc)}
.idx a:hover .lbl,.idx a:focus-visible .lbl,.idx a.act .lbl{transform:translateX(6px)}
.idx a:hover .cap,.idx a:focus-visible .cap,.idx a.act .cap{max-height:40px;opacity:1}
.facts{color:var(--mute)}
.hero-r{position:relative;min-height:100svh;overflow:hidden;background:var(--bg2)}
.stack picture{position:absolute;inset:0;opacity:0;transition:opacity .7s var(--ease),transform 1.4s var(--ease);transform:scale(1.03)}
.stack picture.on{opacity:1;transform:none}
.hcap{position:absolute;left:var(--g);bottom:var(--g);right:var(--g);color:#f1ede6;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.hcap p{position:absolute;bottom:0;left:0;opacity:0;transition:opacity .4s}
.hcap p.on{opacity:1}

/* intro */
.intro{padding:clamp(80px,12vw,160px) var(--g) clamp(64px,8vw,120px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px var(--g)}
.big{grid-column:1/span 8;font-size:clamp(21px,2.1vw,30px);line-height:1.28;letter-spacing:-.018em;font-weight:500;max-width:34ch}
.man{grid-column:10/span 3;align-self:end;color:var(--acc);display:grid;gap:6px}
.vals{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:24px}
.vals li{padding:16px 24px 20px 0;border-bottom:1px solid var(--line);display:grid;gap:4px}
.vals b{font-weight:600}
.vals span{color:var(--mute);font-size:14px;max-width:34ch}

/* sections */
.sec{padding:clamp(48px,6.5vw,96px) var(--g);border-top:1px solid var(--line);position:relative}
.sh{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px var(--g);align-items:baseline;margin-bottom:clamp(32px,4vw,56px)}
.sh .num{grid-column:1/span 1;color:var(--acc)}
.sh h2{grid-column:2/span 4;font-weight:800;font-size:clamp(28px,3vw,44px);letter-spacing:-.04em;line-height:1}
.sh .lede{grid-column:7/span 5;font-size:17px;line-height:1.45;max-width:46ch}
.sub{margin:-24px 0 32px calc((100% + var(--g)) / 12 * 6);color:var(--mute);max-width:46ch}

/* hover-preview float */
.rooms,.xwrap{position:relative}
.float{position:absolute;z-index:3;width:clamp(200px,20vw,300px);aspect-ratio:4/5;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.94);transition:opacity .25s,transform .35s var(--ease);left:0;top:0;overflow:hidden;background:var(--bg2);box-shadow:0 20px 40px -20px rgba(21,25,28,.4)}
.float.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.rimg{display:none}
.abimg picture,.abimg2 picture,.rimg picture,.float picture,.eimg picture{height:100%}

/* rooms table */
.tbl{width:100%;border-collapse:collapse}
.tbl thead th{font:12px var(--mono);color:var(--mute);text-align:left;font-weight:400;padding:0 12px 10px 0;border-bottom:1px solid var(--fg)}
.tbl td,.tbl tbody th{padding:22px 12px 22px 0;border-bottom:1px solid var(--line);vertical-align:baseline;text-align:left;font-weight:400}
.tbl tbody tr{transition:background .25s}
.tbl tbody tr:hover{background:rgba(21,25,28,.035)}
.rname{display:block;font-size:clamp(20px,1.9vw,28px);font-weight:700;letter-spacing:-.03em;line-height:1.1}
.rtext{display:block;color:var(--mute);font-size:14px;margin-top:6px;max-width:38ch}
.rate{font-weight:600;white-space:nowrap}
.lnk{font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px;white-space:nowrap}
.lnk:hover{color:var(--acc)}
.note{color:var(--mute);margin-top:16px}

/* eat */
.eat{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--g);align-items:stretch}
.eimg{overflow:hidden;min-height:100%}
.eimg picture{height:100%}
.etext{display:flex;flex-direction:column;gap:28px}
.etext>p{max-width:44ch}
.rows{border-top:1px solid var(--line)}
.rows li{display:grid;grid-template-columns:110px 1fr;column-gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.rows .k{font-weight:600}
.rows .t{color:var(--acc);text-align:right;align-self:center}
.rows .d{grid-column:1/-1;color:var(--mute);font-size:14px;margin-top:2px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:auto}
.pair picture{aspect-ratio:4/5;overflow:hidden}

/* explore */
.xlist{border-top:1px solid var(--fg)}
.xlist li{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,5fr) minmax(0,5fr) minmax(0,2fr);gap:var(--g);align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line);transition:padding .35s var(--ease)}
.xlist li:hover{padding-left:10px}
.xlist .cat{color:var(--acc)}
.xname{font-size:clamp(20px,1.9vw,28px);font-weight:700;letter-spacing:-.03em;line-height:1.1}
.xtext{color:var(--mute);max-width:40ch}
.meta2{color:var(--mute);text-align:right}

/* about: dark */
.about{background:var(--dark);color:var(--on-dark);border-top:0}
.about .num{color:#d98a60}
.ab{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,3fr);gap:var(--g);align-items:start}
.abimg{aspect-ratio:4/5;overflow:hidden}
.abimg2{aspect-ratio:16/10;overflow:hidden;align-self:end}
.abtext{display:flex;flex-direction:column;gap:32px;font-size:16px}
.abtext>p{max-width:46ch;color:#cfcac1}
.pairs{display:grid;gap:10px;max-width:380px}
.pairs li{display:grid;grid-template-columns:1fr 40px 1fr;align-items:center;gap:12px;font-size:13px}
.pairs li span:last-child{text-align:right}
.pairs i{height:1px;background:#d98a60}
blockquote p{font-size:clamp(22px,2.2vw,32px);font-weight:700;line-height:1.12;letter-spacing:-.03em}
blockquote footer{margin-top:14px;color:#a9a49b}

/* journal */
.jlist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g)}
.jlist a{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;text-decoration:none}
.jlist .meta2{text-align:left}
.jlist picture{aspect-ratio:3/2;overflow:hidden;margin-bottom:6px}
.jlist img{transition:transform .8s var(--ease)}
.jlist a:hover img{transform:scale(1.035)}
.jlist .cat{color:var(--acc)}
.jt{font-size:19px;font-weight:600;letter-spacing:-.02em;line-height:1.2;max-width:26ch}
.jlist a:hover .jt{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* faq */
.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--g);border-top:1px solid var(--fg)}
.faq div{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.faq dt{font-weight:600}
.faq dd{color:var(--mute);font-size:14px}

/* book */
.book{background:var(--acc);color:#f4efe8;padding:clamp(48px,7vw,96px) var(--g);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--g);align-items:end}
.book h2{font-size:clamp(40px,5vw,72px);font-weight:800;letter-spacing:-.045em;line-height:.95;margin-bottom:20px}
.bk-l p{max-width:40ch}
.book .note{color:#f1d9cb;margin-top:12px}
.bk-f{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:0;border:1px solid rgba(244,239,232,.5)}
.bk-f label{display:grid;gap:6px;padding:12px 14px;border-right:1px solid rgba(244,239,232,.5)}
.bk-f label span{color:#f1d9cb}
.bk-f input,.bk-f select{background:transparent;border:0;color:#fff;font:600 16px var(--sans);padding:0;min-width:0;width:100%;color-scheme:dark}
.bk-f select option{color:var(--fg)}
.bk-f button{background:var(--dark);color:var(--on-dark);border:0;font:600 15px var(--sans);padding:0 24px;cursor:pointer;transition:background .2s}
.bk-f button:hover{background:#000}

/* footer */
.foot{background:var(--dark);color:var(--on-dark);padding:clamp(48px,6vw,80px) var(--g) 80px;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,2fr) minmax(0,3fr) minmax(0,3fr);gap:24px var(--g);align-items:start}
.fwm{font-size:clamp(56px,10vw,160px);font-weight:900;letter-spacing:-.06em;line-height:.82;grid-column:1/-1;margin-bottom:24px}
.flinks{display:grid;gap:4px}
.flinks a{text-decoration:none}
.flinks a:hover{color:#d98a60}
.foot address{font-style:normal;line-height:1.8;color:#cfcac1}
.foot .mono{color:#cfcac1}
.fnote{font-size:13px;color:#a9a49b;max-width:40ch}

/* reveal */
.rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .stack picture,.idx .lbl,.xlist li,.jlist img{transition:none}
}

/* tablet */
@media (max-width:1100px){
  .tbl thead th:nth-child(2),.tbl td:nth-child(2){display:none}
  .xlist li{grid-template-columns:minmax(0,2fr) minmax(0,6fr) minmax(0,2fr)}
  .xtext{display:none}
}

/* mobile */
@media (max-width:899px){
  .top .meta{display:none}
  .top{grid-template-columns:1fr auto;background:rgba(226,221,212,.92);backdrop-filter:blur(10px)}
  .hero{grid-template-columns:1fr;min-height:0}
  .hero-r{order:-1;min-height:0;aspect-ratio:4/5;margin-top:60px}
  .hero-l{padding:28px var(--g) 40px;gap:28px}
  .idx .cap{max-height:none;opacity:1;font-size:13px}
  .idx a .lbl{transform:none!important}
  .intro{grid-template-columns:1fr;gap:28px}
  .big,.man,.vals{grid-column:1}
  .vals{grid-template-columns:1fr}
  .sh{grid-template-columns:auto 1fr;gap:8px 14px}
  .sh .num{grid-column:1}
  .sh h2{grid-column:2}
  .sh .lede{grid-column:1/-1}
  .sub{margin:-16px 0 24px}
  .float{display:none}
  .rimg{display:block;aspect-ratio:3/2;overflow:hidden;margin-top:14px}
  .tbl thead{display:none}
  .tbl,.tbl tbody,.tbl tr{display:block}
  .tbl tr{display:grid;grid-template-columns:1fr 1fr 1fr;column-gap:12px;padding:20px 0;border-bottom:1px solid var(--line)}
  .tbl tbody th{grid-column:1/-1;border:0;padding:0 0 12px}
  .tbl td{border:0;padding:6px 0 0;font-size:14px}
  .tbl td:nth-child(2){display:block;grid-column:1/-1;padding:0 0 4px;color:var(--mute)}
  .tbl td:last-child{grid-column:1/-1;padding-top:12px}
  .eat{grid-template-columns:1fr}
  .eimg{aspect-ratio:4/3;min-height:0}
  .xlist li{grid-template-columns:1fr auto;gap:4px 12px;padding:20px 0}
  .xlist li:hover{padding-left:0}
  .xlist .cat{grid-column:1}
  .xlist .meta2{grid-column:2;grid-row:1}
  .xname{grid-column:1/-1}
  .xtext{display:block;grid-column:1/-1}
  .xlist .rimg{grid-column:1/-1}
  .ab{grid-template-columns:1fr}
  .abimg2{display:none}
  .jlist{grid-template-columns:1fr;gap:32px}
  .faq{grid-template-columns:1fr}
  .faq div{grid-template-columns:1fr;gap:4px}
  .book{grid-template-columns:1fr}
  .bk-f{grid-template-columns:1fr 1fr}
  .bk-f label:nth-child(2){border-right:0}
  .bk-f label:nth-child(3){grid-column:1/-1;border-right:0;border-top:1px solid rgba(244,239,232,.5)}
  .bk-f label:first-child{border-bottom:0}
  .bk-f label:nth-child(1),.bk-f label:nth-child(2){border-bottom:0}
  .bk-f button{grid-column:1/-1;height:52px}
  .foot{grid-template-columns:1fr 1fr}
  .foot address,.foot .fnote{grid-column:1/-1}
}
