:root{
  /* Art Nouveau ornament world — warm ivory print ground, three named accent roles */
  --ground:#F6F0DE; --surface:#FFFBF0; --panel:#EFE6CC;
  --ink:#241F18; --ink-soft:#5C5648; --ink-faint:#6B6348;
  --line:#DDD0AA; --line-soft:#E9DFBE;
  --gold:#4B6A4C; --gold-tint:#DEE7D7;   /* sap green — primary accent (kept var name for call-site stability) */
  --rose:#8F4C57;                          /* dusty rose — secondary accent */
  --slate:#3C4550;                         /* deep slate — tertiary accent */
  --shadow:0 1px 2px rgba(36,31,24,.05), 0 18px 40px -26px rgba(36,31,24,.30);
  --display:"Yeseva One", Georgia, "Times New Roman", serif;
  --serif:"Alegreya", Georgia, "Times New Roman", serif;
  --sans:"Golos Text", "Segoe UI", system-ui, -apple-system, sans-serif;
  color-scheme:light dark;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#1B1E16; --surface:#22261C; --panel:#262A1E;
    --ink:#F0E9D2; --ink-soft:#B8AF92; --ink-faint:#9A926F;
    --line:#3A3F2E; --line-soft:#2E321F;
    --gold:#8FB08C; --gold-tint:#2B331F;
    --rose:#D69AA3;
    --slate:#A9B3C1;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 40px -26px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --ground:#1B1E16; --surface:#22261C; --panel:#262A1E;
  --ink:#F0E9D2; --ink-soft:#B8AF92; --ink-faint:#9A926F;
  --line:#3A3F2E; --line-soft:#2E321F;
  --gold:#8FB08C; --gold-tint:#2B331F;
  --rose:#D69AA3;
  --slate:#A9B3C1;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 40px -26px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{
  background:var(--ground); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  margin:0; padding:0; -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
.wrap{max-width:980px; margin:0 auto; padding-inline:22px}
h1,h2,h3{font-family:var(--serif); font-weight:600; text-wrap:balance; margin:0; letter-spacing:0}
h1{font-family:var(--display); font-weight:400}
p{margin:0}
a{color:inherit}
.eyebrow{
  font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); margin:0;
}
::selection{background:var(--gold-tint); color:var(--ink)}
::-webkit-scrollbar{height:8px; width:8px}
::-webkit-scrollbar-thumb{background:var(--line); border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:var(--gold)}
input{caret-color:var(--gold)}

/* ---------- header ---------- */
header{
  position:sticky; top:env(safe-area-inset-top, 0px); z-index:20;
  background:color-mix(in srgb, var(--ground) 88%, transparent);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line-soft);
}
.bar{display:flex; align-items:center; gap:16px; height:60px}
.mark{font-family:var(--display); font-weight:400; font-size:22px; letter-spacing:.22em; margin-right:auto; padding-left:.22em}
.mark small{display:block; font-family:var(--sans); font-size:11px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-faint); margin-top:-1px; padding-left:.12em}
.langs{display:flex; border:1px solid var(--line); border-radius:999px; overflow:hidden}
.langs button{
  font:inherit; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  background:none; border:0; color:var(--ink-soft); padding:6px 12px; cursor:pointer;
}
.langs button[aria-pressed="true"]{background:var(--ink); color:var(--ground)}
.langs button:focus-visible, a:focus-visible, button:focus-visible{outline:2px solid var(--gold); outline-offset:2px}

.btn{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  font-size:14px; font-weight:600; padding:11px 20px; border-radius:999px;
  background:var(--ink); color:var(--ground); border:1px solid var(--ink);
  transition:transform .15s ease, opacity .15s ease;
}
.btn:hover{transform:translateY(-1px); opacity:.92}
.btn.ghost{background:none; color:var(--ink); border-color:var(--line)}
.bar .btn{padding:8px 16px; font-size:13px}
@media (max-width:620px){ .bar .btn{display:none} }

/* ---------- ornament: hand-authored Art Nouveau stem+leaf motif ---------- */
/* One half drawn once (#orn-half); the left side is a CSS mirror of the same paths. */
.ornament{display:flex; align-items:center; justify-content:center; gap:0}
.orn-svg{width:180px; height:42px; display:block; overflow:visible}
.orn-svg.orn-small{width:96px; height:24px}
.orn-mirror{transform:scaleX(-1)}
.orn-stem{fill:none; stroke:var(--gold); stroke-width:1.6; stroke-linecap:round}
.orn-leaf path{fill:var(--gold-tint); stroke:var(--gold); stroke-width:1.1}
.orn-node{
  width:9px; height:9px; background:var(--gold); flex:0 0 auto; margin-inline:-1px;
  transform:rotate(45deg); border-radius:2px;
}
.orn-node-sm{width:6px; height:6px}

@media (prefers-reduced-motion:no-preference){
  .hero .orn-stem{stroke-dasharray:1; stroke-dashoffset:1; animation:orn-draw .8s cubic-bezier(.16,1,.3,1) .1s forwards}
  .hero .orn-leaf path{stroke-dasharray:1; stroke-dashoffset:1; opacity:0; transform-box:fill-box; transform-origin:center;
    animation:orn-bloom .5s cubic-bezier(.16,1,.3,1) forwards}
  .hero .orn-leaf:nth-child(2) path{animation-delay:.55s}
  .hero .orn-leaf:nth-child(3) path{animation-delay:.68s}
  .hero .orn-node{transform:rotate(45deg) scale(0); animation:orn-pop .4s cubic-bezier(.16,1,.3,1) .85s forwards}
  .hero .ornament-tail{opacity:0; animation:rise .5s ease-out 1.55s forwards}
}
@keyframes orn-draw{ to{ stroke-dashoffset:0 } }
@keyframes orn-bloom{ to{ stroke-dashoffset:0; opacity:1 } }
@keyframes orn-pop{ to{ transform:rotate(45deg) scale(1) } }

/* ---------- hero ---------- */
.hero{padding-block:64px 56px; text-align:center}
.hero h1{
  font-size:clamp(38px,6.4vw,60px); line-height:1.1; margin:22px auto 0; max-width:16ch;
  opacity:0; animation:rise .6s cubic-bezier(.16,1,.3,1) 1s forwards;
}
.hero .lede{
  margin:20px auto 0; max-width:52ch; color:var(--ink-soft); font-size:17px;
  opacity:0; animation:rise .6s cubic-bezier(.16,1,.3,1) 1.2s forwards;
}
.hero .actions{
  display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; justify-content:center;
  opacity:0; animation:rise .6s cubic-bezier(.16,1,.3,1) 1.4s forwards;
}
.hero .ornament-tail{margin-top:40px}
@keyframes rise{ from{ opacity:0; transform:translateY(12px) } to{ opacity:1; transform:translateY(0) } }
@media (prefers-reduced-motion:reduce){
  .hero h1, .hero .lede, .hero .actions, .hero .ornament-tail{opacity:1!important; transform:none!important}
  .orn-node{transform:rotate(45deg) scale(1)!important}
}

/* ---------- principles ---------- */
.principles{padding-block:56px; border-top:1px solid var(--line-soft)}
.principles-head{
  font-size:clamp(24px,3.2vw,30px); line-height:1.3; max-width:34ch; margin:0 auto 40px; text-align:center;
}
.principles-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px}
@media (max-width:760px){ .principles-grid{grid-template-columns:1fr; gap:28px} }
.principle{padding-top:20px; border-top:1px solid var(--line-soft)}
.principle h3{font-size:22px; margin-bottom:7px}
.principle p{color:var(--ink-soft); font-size:15px}

/* ---------- section divider ---------- */
.ornament-divider{margin-bottom:40px}

/* ---------- section heads ---------- */
.sec{padding-block:60px}
.sec-head{margin-bottom:34px}
.sec-head h2{font-size:clamp(28px,4vw,38px); margin:0}
.sec-head p{color:var(--ink-soft); margin-top:12px; max-width:54ch}

/* ---------- indications ---------- */
.indic{background:var(--panel); border-radius:4px; padding:30px 34px; margin-top:44px}
@media (max-width:620px){ .indic{padding:24px 22px} }
.indic ul{list-style:none; margin:16px 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px 26px}
.indic li{padding-left:18px; position:relative; color:var(--ink-soft); font-size:15px}
.indic li::before{content:""; position:absolute; left:0; top:.62em; width:6px; height:1px; background:var(--gold)}

/* ---------- price page ---------- */
.price-cat{padding-block:32px; border-bottom:1px solid var(--line)}
.price-cat:first-child{padding-top:0}
.price-cat-name{font-size:clamp(24px,3.4vw,30px)}
.price-cat-desc{color:var(--ink-soft); font-size:15px; margin-top:10px; max-width:60ch}
.price-items{margin-top:22px; display:flex; flex-direction:column; gap:10px}
.price-item{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px;
  background:var(--surface); border:1px solid var(--line); border-radius:4px; padding:14px 18px;
}
.price-item-name{font-size:15px; color:var(--ink); flex:1 1 220px}
.price-item-price{font-family:var(--serif); font-size:19px; font-variant-numeric:tabular-nums; color:var(--ink)}
.price-item-btn{margin-left:auto; padding:8px 18px; font-size:13px}
@media (max-width:480px){ .price-item-btn{margin-left:0; flex:1 1 100%; justify-content:center} }

.price-item.is-selectable{cursor:pointer}
.price-item.is-selectable:hover{border-color:var(--gold)}
.price-item input[type="checkbox"]{
  width:19px; height:19px; flex:0 0 auto; accent-color:var(--gold); cursor:pointer;
}
.price-item:has(input:checked){background:var(--gold-tint); border-color:var(--gold)}

.price-cart{
  position:fixed; left:0; right:0; bottom:0; z-index:30;
  background:var(--surface); border-top:1px solid var(--line); box-shadow:var(--shadow);
}
.price-cart-inner{
  display:flex; align-items:center; justify-content:space-between; gap:10px 20px;
  padding-block:16px;
}
.price-cart-info{flex:1 1 auto; min-width:0; display:flex; flex-wrap:wrap; gap:4px 14px; font-size:14px; color:var(--ink-soft)}
.price-cart-inner .btn{flex:0 0 auto}
.price-cart-info strong{color:var(--ink); font-weight:600}

/* ---------- cosmetics ---------- */
.brands{display:flex; flex-wrap:wrap; gap:12px; margin-top:18px}
.brands span{font-family:var(--serif); font-size:22px; letter-spacing:.14em;
  padding:8px 20px; border:1px solid var(--line); border-radius:2px; color:var(--ink-soft)}

/* ---------- contact ---------- */
.contact{padding-block:58px}
.contact-grid{display:grid; grid-template-columns:1.2fr 1fr; gap:34px; align-items:start}
.contact-grid > *{min-width:0}
@media (max-width:760px){ .contact-grid{grid-template-columns:1fr} }
.contact h2{font-size:clamp(26px,4vw,36px)}
.contact .lede{color:var(--ink-soft); margin-top:14px; max-width:44ch}
.details{display:grid; gap:18px}
.detail .k{font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint)}
.detail .v{font-size:17px; margin-top:3px}
.detail .v a{text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:1px}
.contact .actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:26px}

/* ---------- booking ---------- */
.booking{margin-top:34px}
.booking-soon{
  background:var(--panel); border-radius:4px; padding:24px 26px;
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 20px;
}
.booking-soon p{color:var(--ink-soft); font-size:15px; margin:0; flex:1 1 240px}

.booking-noselection{
  background:var(--panel); border-radius:4px; padding:24px 26px;
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 20px;
}
.booking-noselection p{color:var(--ink-soft); font-size:15px; margin:0; flex:1 1 240px}

.bk-selection{
  background:var(--panel); border-radius:4px; padding:16px 18px; margin-bottom:22px;
  display:flex; flex-direction:column; gap:6px;
}
.bk-selection-item{display:flex; justify-content:space-between; gap:14px; font-size:14px}
.bk-selection-item span:first-child{color:var(--ink)}
.bk-selection-item span:last-child{color:var(--ink-soft); font-variant-numeric:tabular-nums; white-space:nowrap}
.bk-selection-total{
  display:flex; justify-content:space-between; gap:14px; font-size:14.5px; font-weight:600;
  border-top:1px solid var(--line); margin-top:4px; padding-top:8px;
}

.booking-form{
  background:var(--surface); border:1px solid var(--line); border-radius:4px;
  box-shadow:var(--shadow); padding:28px;
}
@media (max-width:620px){ .booking-form{padding:20px} }
.bk-step{border:0; margin:0; padding:0; min-width:0}
.bk-step + .bk-step{margin-top:22px}
.bk-step legend{
  font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold); padding:0; margin-bottom:14px;
}

.bk-cal{margin-bottom:16px}
.bk-cal-weekdays{display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin-bottom:6px}
.bk-cal-weekdays span{display:block; text-align:center; font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint)}
.bk-days{display:grid; grid-template-columns:repeat(7,1fr); gap:6px}
.bk-day-empty{visibility:hidden}
.bk-day{
  font:inherit; cursor:pointer; display:flex; align-items:center; justify-content:center;
  aspect-ratio:1; background:var(--ground); border:1px solid var(--line); border-radius:8px;
  color:var(--ink-soft); transition:border-color .15s ease, background .15s ease;
}
.bk-day:hover{border-color:var(--gold)}
.bk-day[aria-current="true"]{background:var(--ink); border-color:var(--ink); color:var(--ground)}
.bk-day:disabled{opacity:.32; cursor:default; border-style:dashed}
.bk-day:disabled:hover{border-color:var(--line)}
.bk-day-n{font-family:var(--serif); font-size:15px; line-height:1}

.bk-slots{display:grid; grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:8px}
.bk-slot{
  font:inherit; font-size:14px; font-variant-numeric:tabular-nums; cursor:pointer;
  background:var(--ground); border:1px solid var(--line); border-radius:4px; padding:9px 0; text-align:center;
  color:var(--ink); transition:border-color .15s ease, background .15s ease;
}
.bk-slot:hover{border-color:var(--gold)}
.bk-slot[aria-current="true"]{background:var(--ink); border-color:var(--ink); color:var(--ground)}
.bk-slot:disabled{opacity:.32; cursor:default; border-style:dashed; text-decoration:line-through; color:var(--ink-faint)}
.bk-slot:disabled:hover{border-color:var(--line)}
.bk-empty{color:var(--ink-faint); font-size:14px}

.field{display:flex; flex-direction:column; gap:6px; margin-bottom:16px; font-size:14px}
.field span{color:var(--ink-soft); font-size:12.5px; letter-spacing:.03em}
.field input{
  font:inherit; font-size:16px; background:var(--ground); color:var(--ink);
  border:1px solid var(--line); border-radius:4px; padding:11px 13px;
}
.field input:focus-visible{outline:2px solid var(--gold); outline-offset:1px}

.bk-contact-tabs{display:flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; width:fit-content}
.bk-contact-tab{
  font:inherit; font-size:13px; cursor:pointer; background:transparent; border:0; padding:8px 18px;
  color:var(--ink-soft); transition:background .15s ease, color .15s ease;
}
.bk-contact-tab[aria-pressed="true"]{background:var(--ink); color:var(--ground)}
.bk-phone-row{display:flex; gap:8px; min-width:0}
.bk-phone-row select{
  font:inherit; font-size:16px; background:var(--ground); color:var(--ink);
  border:1px solid var(--line); border-radius:4px; padding:11px 8px; flex:0 0 auto; max-width:40%;
}
.bk-phone-fixed{
  font:inherit; font-size:15px; color:var(--ink-soft); background:var(--panel);
  border:1px solid var(--line); border-radius:4px; padding:11px 10px; flex:0 0 auto;
  display:flex; align-items:center;
}
.bk-phone-row input{
  font:inherit; font-size:16px; background:var(--ground); color:var(--ink);
  border:1px solid var(--line); border-radius:4px; padding:11px 13px; flex:1 1 auto; min-width:0;
}
.bk-phone-row select:focus-visible, .bk-phone-row input:focus-visible{outline:2px solid var(--gold); outline-offset:1px}
.bk-phone-hint{font-size:12px; color:var(--ink-faint); margin:4px 0 0}

.bk-summary{
  background:var(--panel); border-radius:4px; padding:16px 18px; margin-top:22px;
  display:grid; gap:8px;
}
.bk-summary-row{display:flex; justify-content:space-between; gap:16px; font-size:14.5px}
.bk-summary-row span{color:var(--ink-soft)}
.bk-summary-row strong{font-weight:600; text-align:right}
.bk-summary-row strong a{text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:1px}

.bk-error{
  color:var(--rose); font-size:13.5px; margin-top:16px; padding:10px 14px;
  background:color-mix(in srgb, var(--rose) 12%, transparent); border-radius:4px;
}

.bk-actions{display:flex; gap:10px; margin-top:24px}
.bk-actions .btn[disabled]{opacity:.6; cursor:default}

.booking-done{
  background:var(--surface); border:1px solid var(--line); border-radius:4px;
  box-shadow:var(--shadow); padding:28px; display:grid; gap:8px;
}
.bk-done-title{
  font-family:var(--serif); font-size:24px; color:var(--gold); margin-bottom:6px;
}
.bk-done-note{color:var(--ink-soft); font-size:13.5px; margin-top:10px}

footer{border-top:1px solid var(--line-soft); padding-block:26px; color:var(--ink-faint); font-size:13px}
.foot{display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center}
.foot .sep{margin-left:auto}
@media (prefers-reduced-motion:reduce){ *{animation:none!important; transition:none!important} }