/* Gabinet Masażu Len. Palette: lime-wash sage ground, deep olive neutrals, ONE accent (brick). Shape rule: pills for buttons, 14px for images/cells/inputs, one arch on the hero. */
@font-face{font-family:"Bricolage Grotesque";src:url(fonts/bricolage-grotesque-latin-ext-wght-normal.woff2) format("woff2");font-weight:200 800;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:"Bricolage Grotesque";src:url(fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2");font-weight:200 800;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:"Onest";src:url(fonts/onest-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:"Onest";src:url(fonts/onest-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}
:root{
  --bg:#e7ebe3;--bg2:#dce2d6;--paper:#f2f4ef;--ink:#18211b;--ink2:#3b4a3f;--line:rgba(24,33,27,.16);
  --olive:#3f4f35;--accent:#9a4328;--accent-ink:#f6f1ea;--accent-soft:#e6d3c8;--olive-soft:#d3dcc8;
  --foot:#25301f;--foot-ink:#e7ebe3;
  --display:"Bricolage Grotesque",system-ui,sans-serif;--body:"Onest",system-ui,sans-serif;
  --r:14px;--ease:cubic-bezier(.16,1,.3,1);--shadow:0 18px 40px -22px rgba(40,56,36,.45);
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#141b16;--bg2:#1a231c;--paper:#202b22;--ink:#e6ebe2;--ink2:#b6c1b3;--line:rgba(230,235,226,.16);
  --olive:#8fa57c;--accent:#d98a66;--accent-ink:#1c120d;--accent-soft:#3a2a22;--olive-soft:#2a3727;
  --foot:#0e130f;--foot-ink:#cfd8cb;--shadow:0 18px 40px -22px rgba(0,0,0,.7);
}}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1rem/1.62 var(--body);overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.08;letter-spacing:-.02em;margin:0;text-wrap:balance}
p{margin:0}
a{color:inherit}
::selection{background:var(--accent);color:var(--accent-ink)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--bg);padding:10px 14px;border-radius:8px;z-index:100}
.skip:focus{top:10px}
.ic{width:1.25em;height:1.25em;fill:currentColor;flex:none}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 20px}
@media (min-width:960px){.wrap{padding:0 40px}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 26px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font:600 1rem/1 var(--body);text-decoration:none;border:2px solid var(--accent);cursor:pointer;white-space:nowrap;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px -14px var(--accent)}
.btn:active{transform:translateY(1px) scale(.98);box-shadow:none}
.btn--sm{min-height:44px;padding:0 20px;font-size:.95rem}
.btn--full{width:100%}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--bg);box-shadow:none}
.lnk{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px;text-decoration-color:var(--accent)}
.lnk .ic{transition:transform .3s var(--ease)}
.lnk:hover .ic{transform:translateX(4px)}

/* header */
.top{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
.top.is-stuck{border-bottom-color:var(--line)}
.top__in{display:flex;align-items:center;gap:14px;height:64px}
.logo{display:flex;align-items:baseline;gap:8px;text-decoration:none;margin-right:auto}
.logo .ic{align-self:center;color:var(--olive);width:22px;height:22px}
.logo span{font:700 1.5rem/1 var(--display);letter-spacing:-.03em}
.logo small{font-size:.82rem;color:var(--ink2)}
.top__cta{display:none}
.burger{width:46px;height:46px;border:0;background:none;color:var(--ink);border-radius:50%;display:grid;place-items:center;cursor:pointer}
.burger .ic{grid-area:1/1;width:26px;height:26px}
.burger .ic:last-child,.burger[aria-expanded=true] .ic:first-child{display:none}
.burger[aria-expanded=true] .ic:last-child{display:block}
.nav{position:absolute;left:0;right:0;top:64px;background:var(--bg);border-bottom:1px solid var(--line);padding:6px 20px 18px;display:none;flex-direction:column}
.nav.is-open{display:flex}
.nav a{padding:14px 0;min-height:48px;text-decoration:none;font:500 1.15rem/1.2 var(--display);border-bottom:1px solid var(--line)}
@media (min-width:960px){
  .top__in{height:72px}.burger{display:none}.top__cta{display:inline-flex}
  .nav{position:static;display:flex;flex-direction:row;gap:26px;padding:0;border:0;background:none}
  .nav a{border:0;padding:0;min-height:44px;display:inline-flex;align-items:center;font:500 .98rem/1 var(--body);color:var(--ink2);transition:color .2s}
  .nav a:hover{color:var(--ink)}
  .logo{margin-right:auto}.nav{margin-right:8px}
}

/* hero */
.hero{padding:22px 0 48px}
.hero__in{display:grid;gap:30px}
.hero h1{font-size:clamp(2.55rem,11.4vw,4.6rem);letter-spacing:-.035em;line-height:.98}
.hero__s{margin-top:18px;font-size:1.1rem;color:var(--ink2);max-width:34ch}
.hero__b{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px}
.hero__i{justify-self:center;width:min(78vw,340px);position:relative}
.hero__i img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:999px 999px var(--r) var(--r);box-shadow:var(--shadow)}
.hero__i::before{content:"";position:absolute;inset:-12px -12px auto auto;width:62%;aspect-ratio:1;border-radius:50%;background:var(--olive-soft);z-index:-1}
@media (min-width:960px){
  .hero{padding:44px 0 80px}
  .hero__in{grid-template-columns:1.15fr .85fr;align-items:center;gap:60px}
  .hero__s{font-size:1.2rem}
  .hero__i{width:100%;max-width:460px;justify-self:end;margin-right:8px}
}
.js .hero__t>*{opacity:0;transform:translateY(22px);animation:up .9s var(--ease) forwards}
.js .hero__t>:nth-child(2){animation-delay:.12s}.js .hero__t>:nth-child(3){animation-delay:.24s}
.js .hero__i img{clip-path:inset(18% 0 0 0 round 999px 999px 14px 14px);opacity:0;animation:arch 1.2s .1s var(--ease) forwards}
@keyframes up{to{opacity:1;transform:none}}
@keyframes arch{to{clip-path:inset(0 0 0 0 round 999px 999px 14px 14px);opacity:1}}

/* sections */
.sec{padding:64px 0}
.sec--tint{background:var(--bg2)}
@media (min-width:960px){.sec{padding:104px 0}}
h2{font-size:clamp(1.95rem,7.4vw,3.2rem);max-width:18ch}
.lead{margin-top:16px;font-size:1.08rem;color:var(--ink2);max-width:52ch}
.js [data-r]{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js [data-r].in{opacity:1;transform:none}

/* bento */
.bento{display:grid;gap:14px;margin-top:34px}
.cell{border-radius:var(--r);overflow:hidden;background:var(--paper);display:flex;flex-direction:column}
.cell img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cell__t{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.cell h3{font-size:1.45rem}
.cell__t>p:nth-of-type(1){color:var(--ink2);max-width:46ch}
.cell__m{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:.95rem;color:var(--ink2)}
.cell__m strong{font:600 1.15rem/1 var(--display);color:var(--ink)}
.cell--tint1{background:var(--olive-soft)}
.cell--tint2{background:var(--accent-soft)}
.cell--tint1 h3,.cell--tint2 h3{font-size:clamp(1.7rem,6vw,2.3rem)}
@media (min-width:900px){
  .bento{grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(0,auto);gap:16px}
  .cell--a{grid-column:span 5}.cell--b{grid-column:span 7;flex-direction:row}
  .cell--b img{width:48%;aspect-ratio:auto;height:100%}.cell--b .cell__t{width:52%}
  .cell--c{grid-column:span 4}.cell--d{grid-column:span 4}.cell--e{grid-column:span 4}
  .cell--c,.cell--a{justify-content:flex-end}
  .cell--d img,.cell--e img{aspect-ratio:4/3}
}

/* prices */
.prices{margin-top:34px;display:grid;gap:34px}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
caption{text-align:left;font:600 1.35rem/1.2 var(--display);padding-bottom:12px}
thead th{font:500 .85rem/1 var(--body);color:var(--ink2);text-align:right;padding:0 0 8px}
tbody th{font-weight:500;text-align:left;padding:16px 12px 16px 0;vertical-align:top}
tbody th small{display:block;font-weight:400;font-size:.86rem;color:var(--ink2);margin-top:3px}
td{text-align:right;padding:16px 0;font:600 1rem/1.2 var(--display);white-space:nowrap;vertical-align:top;width:4.5rem}
@media (min-width:600px){td{width:5.6rem;font-size:1.1rem}}
tbody tr:nth-child(odd) th,tbody tr:nth-child(odd) td{background:color-mix(in srgb,var(--paper) 55%,transparent)}
tbody tr th:first-child{padding-left:12px;border-radius:10px 0 0 10px}
tbody tr td:last-child{padding-right:12px;border-radius:0 10px 10px 0}
.t2 td{width:auto}
.note{margin-top:28px;max-width:62ch;color:var(--ink2)}
@media (min-width:900px){.prices{grid-template-columns:1.25fr 1fr;gap:72px;align-items:start}}

/* visit */
.visit{display:grid;gap:34px}
.visit__i img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
.steps{list-style:none;margin:30px 0 0;padding:0 0 0 26px;border-left:2px solid var(--line);display:grid;gap:26px}
.steps li{position:relative}
.steps li::before{content:"";position:absolute;left:-34px;top:.35em;width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px var(--bg)}
.steps h3{font-size:1.25rem}
.steps p{margin-top:6px;color:var(--ink2);max-width:46ch}
@media (min-width:900px){.visit{grid-template-columns:1fr 1fr;gap:80px;align-items:center}.visit__i img{aspect-ratio:4/5}}

/* room + people */
.room{display:grid;gap:14px;margin-top:34px}
.room img{width:100%;object-fit:cover;border-radius:var(--r)}
.room__a{aspect-ratio:3/2}
.room__b{aspect-ratio:3/2}
@media (min-width:900px){
  .room{grid-template-columns:repeat(12,1fr);align-items:end}
  .room__a{grid-column:1/9}.room__b{grid-column:9/13;aspect-ratio:4/5;margin-bottom:-36px}
}
.people{display:grid;gap:34px;margin-top:44px}
.person{display:grid;grid-template-columns:132px 1fr;gap:18px;align-items:start}
.person img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:var(--r)}
.person h3{font-size:1.5rem}
.person__r{color:var(--accent);font-weight:600;margin:4px 0 10px}
.person p:last-child{color:var(--ink2)}
@media (min-width:700px){.person{grid-template-columns:200px 1fr;gap:26px}}
@media (min-width:900px){
  .people{grid-template-columns:1fr 1fr;gap:56px;margin-top:80px}
  .person--2{margin-top:56px}
}

/* voucher */
.voucher__in{display:grid;gap:28px;align-items:center}
.voucher__i{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r)}
.voucher__t .btn{margin-top:24px}
@media (min-width:900px){.voucher__in{grid-template-columns:.9fr 1.1fr;gap:72px}}

/* quotes */
.quotes{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:34px -20px 0;padding:0 20px 8px;scrollbar-width:none}
.quotes::-webkit-scrollbar{display:none}
.q{flex:0 0 82%;scroll-snap-align:center;margin:0;padding:24px 0 0;border-top:3px solid var(--accent);display:flex;flex-direction:column;gap:18px}
blockquote{margin:0;font:500 1.28rem/1.4 var(--display);letter-spacing:-.01em}
figcaption{display:flex;flex-direction:column;font-size:.92rem;color:var(--ink2)}
figcaption strong{color:var(--ink);font-size:1rem}
@media (min-width:900px){
  .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;overflow:visible;margin:56px 0 0;padding:0}
  .q{flex:none}.q1{margin-top:44px}.q2{margin-top:88px}
}

/* faq */
.faq{display:grid;gap:26px}
details{border-top:1px solid var(--line)}
details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px;padding:14px 0;font:600 1.1rem/1.3 var(--display)}
summary::-webkit-details-marker{display:none}
summary .ic{transition:transform .35s var(--ease);color:var(--accent)}
details[open] summary .ic{transform:rotate(45deg)}
details p{padding:0 0 20px;color:var(--ink2);max-width:60ch}
@media (min-width:900px){.faq{grid-template-columns:.8fr 1.2fr;gap:80px}.faq h2{position:sticky;top:110px;align-self:start}}

/* booking */
.book{display:grid;gap:36px}
.contact{list-style:none;margin:28px 0;padding:0;display:grid;gap:20px}
.contact li{display:flex;gap:14px}
.contact .ic{width:24px;height:24px;color:var(--accent);margin-top:2px}
.contact div{display:flex;flex-direction:column}
.contact strong{font-family:var(--display);font-size:1.05rem}
.contact a{text-underline-offset:4px}
.dim{color:var(--ink2);font-size:.95rem;max-width:44ch}
.form{background:var(--paper);border-radius:var(--r);padding:24px 20px;display:grid;gap:18px;align-content:start;box-shadow:var(--shadow)}
.f{display:grid;gap:7px}
label{font-weight:600;font-size:.95rem}
input,select,textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--bg);border:1.5px solid color-mix(in srgb,var(--ink) 38%,transparent);border-radius:var(--r);min-height:50px;padding:12px 14px}
textarea{resize:vertical;min-height:96px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
input[aria-invalid=true]{border-color:#a1301c}
.err{color:#a1301c;font-size:.9rem;font-weight:500}
@media (prefers-color-scheme:dark){.err{color:#f0a08c}input[aria-invalid=true]{border-color:#f0a08c}}
.demo{display:flex;gap:10px;align-items:flex-start;padding:14px;border-radius:var(--r);background:var(--olive-soft);font-weight:500}
.demo .ic{margin-top:2px}
[hidden]{display:none!important}
@media (min-width:900px){.book{grid-template-columns:1fr 1fr;gap:80px;align-items:start}.form{padding:32px}}

/* footer */
.foot{background:var(--foot);color:var(--foot-ink);padding:52px 0 40px}
.foot__in{display:grid;gap:30px}
.foot__logo{display:flex;align-items:center;gap:8px;font:700 1.6rem/1 var(--display);margin-bottom:12px}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 22px}
.foot nav a{min-height:44px;display:inline-flex;align-items:center;color:inherit;text-decoration:none;opacity:.85}
.foot nav a:hover{opacity:1;text-decoration:underline}
.foot__demo{font-size:.88rem;opacity:.75;border-top:1px solid rgba(231,235,227,.2);padding-top:20px}
@media (min-width:900px){.foot__in{grid-template-columns:1.2fr 2fr;align-items:start}.foot__demo{grid-column:1/-1}}

/* dock + chat */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:10px 74px calc(10px + env(safe-area-inset-bottom)) 14px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .4s var(--ease)}
.dock.is-on{transform:none}
@media (min-width:960px){.dock{display:none}}
.chat-fab{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:55;display:inline-flex;align-items:center;gap:8px;min-height:52px;min-width:52px;padding:0;justify-content:center;border:0;border-radius:999px;background:var(--olive);color:var(--bg);font:600 .95rem/1 var(--body);cursor:pointer;box-shadow:var(--shadow);transition:bottom .35s var(--ease),transform .3s var(--ease)}
:root{--on-olive:#f2f4ef}
.chat-fab{color:var(--on-olive)}
@media (prefers-color-scheme:dark){.chat-fab{color:#10170f}}
.chat-fab .ic{width:24px;height:24px}
.chat-fab span{display:none}
.chat-fab:active{transform:scale(.96)}
.dock.is-on~.chat-fab{bottom:calc(12px + env(safe-area-inset-bottom))}
@media (min-width:960px){.chat-fab{right:24px;bottom:24px;padding:0 20px 0 16px}.chat-fab span{display:inline}}
.chat{position:fixed;z-index:60;inset:0 0 auto 0;height:100dvh;background:var(--paper);display:flex;flex-direction:column;overflow:hidden}
.chat[hidden]{display:none}
@media (min-width:960px){.chat{inset:auto 24px 24px auto;width:390px;height:600px;border-radius:18px;box-shadow:0 24px 60px -20px rgba(20,30,18,.5);border:1px solid var(--line)}}
.chat__head{display:flex;align-items:center;gap:12px;padding:max(14px,env(safe-area-inset-top)) 12px 14px 16px;border-bottom:1px solid var(--line)}
.chat__logo{width:38px;height:38px;border-radius:50%;background:var(--olive-soft);color:var(--olive);display:grid;place-items:center;flex:none}
.chat__head div{display:grid;gap:2px;flex:1;line-height:1.2}
.chat__head strong{font:600 1rem/1.2 var(--display)}
.chat__head div span{font-size:.8rem;color:var(--ink2)}
.chat__close{width:44px;height:44px;border:0;background:none;color:var(--ink);border-radius:10px;cursor:pointer;display:grid;place-items:center}
.chat__close:hover{background:var(--bg2)}
.chat__warn{font-size:.78rem;color:var(--ink2);background:var(--bg2);padding:8px 16px;line-height:1.4}
.chat__log{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}
.msg{max-width:86%;padding:10px 14px;border-radius:16px;line-height:1.45;font-size:.97rem;white-space:pre-wrap}
.msg--bot{background:var(--bg2);border-bottom-left-radius:4px;align-self:flex-start}
.msg--me{background:var(--olive);color:var(--on-olive);border-bottom-right-radius:4px;align-self:flex-end}
@media (prefers-color-scheme:dark){.msg--me{color:#10170f}}
.msg--typing{opacity:.65}
.msg .btn{margin-top:10px;display:flex;min-height:44px}
.chat__chips{display:flex;gap:8px;overflow-x:auto;padding:0 16px 10px;scrollbar-width:none}
.chat__chips::-webkit-scrollbar{display:none}
.chat__chips button{flex:none;border:1.5px solid var(--line);background:var(--paper);border-radius:999px;padding:8px 14px;font:500 .88rem/1.2 var(--body);color:var(--ink);cursor:pointer;min-height:40px}
.chat__chips button:hover{border-color:var(--accent)}
.chat__form{display:flex;gap:8px;padding:10px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.chat__form input{flex:1;min-height:46px}
.chat__form button{width:48px;height:48px;border:0;border-radius:50%;background:var(--accent);color:var(--accent-ink);cursor:pointer;display:grid;place-items:center}
.chat__form button:disabled{opacity:.5}
html.chat-open,html.chat-open body{overflow:hidden;overscroll-behavior:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js [data-r],.js .hero__t>*{opacity:1;transform:none}
  .js .hero__i img{opacity:1;clip-path:none}
}
