/* roni.shtibel.com: public site. Right-to-left throughout, so spacing uses logical properties. */

/* ---------- fonts (self-hosted) ---------- */
@font-face{font-family:"Frank Ruhl Libre";font-style:normal;font-weight:300 900;font-display:swap;src:url(../fonts/frankruhl-hebrew.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Frank Ruhl Libre";font-style:normal;font-weight:300 900;font-display:swap;src:url(../fonts/frankruhl-latin.woff2) format("woff2");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:"Assistant";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/assistant-hebrew.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Assistant";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/assistant-latin.woff2) format("woff2");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}

/* ---------- tokens ---------- */
:root{
  /* the logo's two colours, and tones built around them */
  --cream:#F7E8D5;
  --bronze:#9C8363;
  --paper:#FBF5EC;
  --linen:#F4EADB;
  --sand:#ECDCC6;
  --white:#FFFDF9;
  --bronze-deep:#7B6245;   /* dark enough for text and buttons on the light tones */
  --cocoa:#4B3320;         /* headings; the dark band of the gift section */
  --ink:#5E4A3A;           /* body text */
  --olive:#A89A62;         /* the gold-green of the voucher's leaves */
  --sage:#93A083;
  --blush:#EED8CB;
  --line:rgba(156,131,99,.26);
  --line-strong:rgba(156,131,99,.48);
  --shadow:0 18px 50px -24px rgba(75,51,32,.28);
  --shadow-lg:0 34px 80px -34px rgba(75,51,32,.42);
  --radius:28px;
  --display:"Frank Ruhl Libre","David Libre","Times New Roman",serif;
  --body:"Assistant","Heebo","Segoe UI",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  /* paper grain: a tiny SVG noise tile */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .2 0 0 0 0 .12 0 0 0 .1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--body);font-size:1.125rem;line-height:1.75;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;background:var(--grain)}
[hidden]{display:none!important}
img,svg{display:block;max-width:100%}
h1,h2,h3{font-family:var(--display);font-weight:400;color:var(--cocoa);margin:0;text-wrap:balance}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--bronze-deep);outline-offset:3px;border-radius:6px}
::selection{background:var(--sand);color:var(--cocoa)}

.container{width:min(100% - 2 * clamp(20px,5vw,48px),1180px);margin-inline:auto}
.icon{width:1.15em;height:1.15em;flex:none}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;background:var(--cocoa);color:var(--white);padding:10px 18px;border-radius:999px;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
.hp{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}
.link{background:none;border:0;padding:0;cursor:pointer;color:inherit;text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:.2em}
.link:hover{text-decoration-color:currentColor}
.deco{position:absolute;pointer-events:none}

/* ---------- type helpers ---------- */
h2{font-size:clamp(2.2rem,4.8vw,3.5rem);line-height:1.12;margin-bottom:.4em}
.lead{font-size:clamp(1.15rem,1.7vw,1.32rem);line-height:1.7}
.eyebrow{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 16px;font-size:.95rem;font-weight:700;letter-spacing:.14em;color:var(--bronze-deep)}
.eyebrow::before,.eyebrow::after{content:"";width:34px;height:1px;background:currentColor;opacity:.45}
.eyebrow--start{justify-content:flex-start}
.eyebrow--start::before{display:none}

/* ---------- buttons ---------- */
.btn{--bg:var(--bronze-deep);--fg:var(--white);display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:.95em 1.9em;border:1px solid transparent;border-radius:999px;background:var(--bg);color:var(--fg);font-weight:700;font-size:1.05rem;line-height:1.2;text-decoration:none;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s var(--ease),box-shadow .25s}
.btn .icon{transition:transform .3s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:none}
.btn--primary{box-shadow:0 14px 30px -14px rgba(75,51,32,.6)}
.btn--primary:hover{--bg:var(--cocoa)}
.btn--primary:hover .icon{transform:translateX(-4px)}
.btn--ghost{--bg:transparent;--fg:var(--cocoa);border-color:var(--line-strong)}
.btn--ghost:hover{--bg:var(--white);border-color:var(--bronze)}
.btn--light{--bg:var(--cream);--fg:var(--cocoa)}
.btn--light:hover{--bg:var(--white)}
.btn--light:hover .icon{transform:translateX(-4px)}
.btn--wa{--bg:#2F8F5B;--fg:#fff}
.btn--sm{padding:.7em 1.4em;font-size:.98rem}
.btn--block{width:100%}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}

/* ---------- header ---------- */
.site-header{position:fixed;inset-block-start:0;inset-inline:0;z-index:60;padding-block:18px;transition:padding .3s,background .3s,box-shadow .3s}
.site-header.is-stuck{padding-block:9px;background:rgba(251,245,236,.88);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 1px 0 var(--line)}
.site-header__in{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--cocoa)}
.brand__mark{width:36px;height:40px;color:var(--bronze)}
.brand__text{display:grid;line-height:1.1}
.brand__name{font-family:var(--display);font-size:1.32rem;font-weight:500}
.brand__tag{font-size:.8rem;font-weight:600;letter-spacing:.14em;color:var(--bronze-deep)}
.nav{display:flex;align-items:center;gap:clamp(14px,2.2vw,32px)}
.nav a:not(.btn){position:relative;padding-block:6px;text-decoration:none;font-weight:600;font-size:1.02rem;color:var(--cocoa)}
.nav a:not(.btn)::after{content:"";position:absolute;inset-inline:0;bottom:0;height:1px;background:var(--bronze);transform:scaleX(0);transform-origin:inline-end;transition:transform .35s var(--ease)}
.nav a:not(.btn):hover::after,.nav a.is-current::after{transform:scaleX(1)}
.nav-toggle{display:none;width:46px;height:46px;border:1px solid var(--line-strong);border-radius:50%;background:var(--white);place-items:center;cursor:pointer;color:var(--cocoa)}
.nav-toggle .icon{width:22px;height:22px}
.nav-toggle__close{display:none}

@media (max-width:940px){
  .nav-toggle{display:grid;position:relative;z-index:2}
  .nav{position:fixed;inset:0;z-index:1;flex-direction:column;justify-content:center;gap:6px;padding:90px 24px 40px;background:var(--paper);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
  .nav a:not(.btn){font-family:var(--display);font-size:1.9rem;font-weight:400;padding:10px 0}
  .nav__cta{margin-top:18px;font-size:1.15rem;padding:1em 2.2em}
  .nav-open .nav{opacity:1;visibility:visible}
  .nav-open .nav-toggle__open{display:none}
  .nav-open .nav-toggle__close{display:block}
  .nav-open{overflow:hidden}
  .nav-open .site-header{background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .brand{position:relative;z-index:2}
}

/* ---------- hero ---------- */
.hero{position:relative;display:grid;align-items:center;min-height:min(100svh,940px);padding-block:clamp(118px,17vh,180px) clamp(96px,13vh,150px);overflow:clip;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:
  radial-gradient(58% 60% at 88% 8%,rgba(238,216,203,.85),transparent 70%),
  radial-gradient(46% 52% at 4% 78%,rgba(221,228,209,.75),transparent 70%),
  linear-gradient(180deg,#FCF3E7,var(--paper))}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(36px,6vw,96px);align-items:center}
.hero h1{font-size:clamp(3.1rem,7.6vw,6rem);line-height:1.04;letter-spacing:-.012em;margin-bottom:.34em}
.accent{position:relative;display:inline-block;color:var(--bronze-deep);white-space:nowrap}
.swoosh{position:absolute;inset-inline:-2%;bottom:-.16em;width:104%;height:.26em;overflow:visible}
.swoosh path{fill:none;stroke:var(--olive);stroke-width:2.4;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.5s .9s var(--ease) forwards}
.hero .lead{max-width:30em;margin-bottom:1.7em;text-wrap:balance}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:2.1em}
.facts{display:flex;flex-wrap:wrap;gap:10px 26px;font-size:1rem;font-weight:600;color:var(--bronze-deep)}
.facts li{display:flex;align-items:center;gap:8px}
.hero__sprig{color:var(--sage);opacity:.5;z-index:-1}
.hero__sprig--1{width:clamp(110px,15vw,200px);inset-inline-end:-2%;top:16%;transform:rotate(28deg);animation:sway 9s ease-in-out infinite}
.hero__sprig--2{width:clamp(90px,12vw,170px);inset-inline-start:39%;bottom:5%;transform:rotate(-24deg) scaleX(-1);color:var(--olive);opacity:.42;animation:sway 11s ease-in-out infinite reverse}

.hero__visual{position:relative}
.arch-wrap{position:relative;width:min(100%,430px);margin-inline:auto}
.arch-wrap::before{content:"";position:absolute;inset:0;border:1px solid var(--line-strong);border-radius:999px 999px 30px 30px;transform:translate(-18px,18px)}
.arch{position:relative;aspect-ratio:43/55;border-radius:999px 999px 30px 30px;overflow:hidden;background:linear-gradient(180deg,#EFDCC4,var(--cream) 52%,#EAD6BD);box-shadow:var(--shadow-lg)}
.arch__img{width:100%;height:100%;object-fit:cover}
.arch__glow{position:absolute;inset-inline:12%;top:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#FFF9EF 0,rgba(255,249,239,0) 68%)}
.arch__mark{position:absolute;top:17%;inset-inline:0;margin-inline:auto;width:44%;height:auto;aspect-ratio:458/512;color:var(--bronze)}
.arch__word{position:absolute;top:65%;inset-inline:0;margin-inline:auto;width:42%;aspect-ratio:654/151;color:var(--bronze)}
.arch__tag{position:absolute;top:77.5%;inset-inline:0;margin-inline:auto;width:44%;aspect-ratio:694/40;color:var(--bronze)}
.arch__sprig{position:absolute;bottom:-9%;width:34%;aspect-ratio:120/200;color:var(--olive);opacity:.8}
.arch__sprig--1{inset-inline-start:-6%;transform:rotate(18deg)}
.arch__sprig--2{inset-inline-end:-6%;transform:rotate(-18deg) scaleX(-1);color:var(--sage)}
.badge{position:absolute;inset-inline-end:-30px;bottom:-34px;width:clamp(104px,11vw,136px);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:var(--white);box-shadow:var(--shadow)}
.badge__ring{position:absolute;inset:0;width:100%;height:100%;direction:ltr;animation:spin 36s linear infinite}
.badge__ring text{font-family:var(--body);font-size:13.5px;font-weight:700;letter-spacing:.2em;fill:var(--bronze-deep)}
.badge__mark{width:34%;aspect-ratio:458/512;color:var(--bronze)}

.wave{position:absolute;inset-inline:0;bottom:-1px;width:100%;height:clamp(40px,6vw,90px);fill:var(--paper)}
.wave--top{bottom:auto;top:-1px}

@media (max-width:900px){
  .hero{min-height:0;padding-block:118px 110px;text-align:center}
  .hero__grid{grid-template-columns:1fr;gap:56px}
  .hero .lead{margin-inline:auto}
  .hero__cta,.facts{justify-content:center}
  .hero .eyebrow--start{justify-content:center}
  .hero .eyebrow--start::before{display:block}
  .arch-wrap{width:min(78%,340px)}
  .badge{inset-inline-end:-22px;bottom:-26px}
  .hero__sprig--1{display:none}
  .hero__sprig--2{inset-inline-start:-4%;bottom:38%}
}

/* ---------- sections ---------- */
.section{position:relative;padding-block:clamp(76px,10.5vw,140px)}
.section__head{max-width:680px;margin:0 auto clamp(38px,5vw,66px);text-align:center}
.section__head .lead{margin:0}

/* about */
.about__grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(36px,7vw,110px);align-items:center}
.pill{position:relative;width:min(100%,400px);aspect-ratio:4/5.4;margin-inline:auto;border-radius:999px;overflow:hidden;box-shadow:var(--shadow-lg)}
.pill__img{width:100%;height:100%;object-fit:cover}
.pill--quote{display:grid;place-content:center;gap:26px;padding:16% 14%;text-align:center;background:radial-gradient(90% 60% at 50% 0,rgba(255,250,241,.9),transparent 70%),linear-gradient(180deg,var(--blush),var(--cream) 60%,#E9D8BF)}
.pill--quote blockquote{margin:0;font-family:var(--display);font-size:clamp(1.55rem,2.6vw,2.15rem);line-height:1.3;color:var(--cocoa);text-wrap:balance}
.pill__sprig{width:30%;aspect-ratio:120/200;margin-inline:auto;color:var(--olive);transform:rotate(8deg)}
.pill__mark{width:22%;aspect-ratio:458/512;margin-inline:auto;color:var(--bronze)}
.about__text .lead{font-family:var(--display);font-size:clamp(1.3rem,2.1vw,1.62rem);line-height:1.5;color:var(--bronze-deep)}
.values{display:grid;gap:18px;margin-top:34px}
.values li{display:flex;gap:18px;align-items:flex-start;padding:18px 20px;background:var(--white);border:1px solid var(--line);border-radius:20px}
.values__icon{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--cream);color:var(--bronze-deep)}
.values__icon .icon{width:24px;height:24px}
.values h3{font-size:1.32rem;margin-bottom:2px}
.values p{margin:0;font-size:1.05rem;line-height:1.55}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;margin-top:clamp(48px,7vw,90px)}
.gallery__item{border-radius:24px;overflow:hidden;aspect-ratio:4/5;box-shadow:var(--shadow)}
.gallery__img{width:100%;height:100%;object-fit:cover}
@media (max-width:860px){
  .about__grid{grid-template-columns:1fr}
  .pill{width:min(74%,320px)}
}

/* treatments and prices */
.treatments{background:var(--linen)}
.treatments .wave--top{fill:var(--paper)}
.menu{position:relative;max-width:860px;margin-inline:auto;padding:clamp(34px,5.5vw,66px) clamp(24px,5.5vw,70px);background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow)}
.menu::before{content:"";position:absolute;inset:11px;border:1px solid var(--line-strong);border-radius:calc(var(--radius) - 9px);pointer-events:none}
.menu__branch{width:110px;aspect-ratio:150/64;margin:0 auto 10px;color:var(--olive)}
.menu__item{padding-block:24px}
.menu__item + .menu__item{border-top:1px dashed var(--line-strong)}
.menu__main{display:flex;align-items:baseline;gap:16px}
.menu__name{font-size:clamp(1.5rem,2.6vw,1.95rem)}
.menu__dots{flex:1;min-width:24px;border-bottom:2px dotted var(--line-strong);transform:translateY(-.3em)}
.menu__price{margin:0;font-family:var(--display);font-size:clamp(1.6rem,2.8vw,2.1rem);color:var(--bronze-deep);white-space:nowrap}
.menu__ask{font-family:var(--body);font-size:1.02rem;font-weight:600}
.menu__desc{max-width:36em;margin:6px 0 0;font-size:1.08rem}
.menu__meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;margin-top:14px}
.tag{display:inline-flex;align-items:center;gap:7px;padding:5px 14px;border-radius:999px;background:var(--cream);font-size:.95rem;font-weight:700;color:var(--bronze-deep)}
.menu__book{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:1rem;color:var(--bronze-deep);text-decoration:none}
.menu__book .icon{transition:transform .3s var(--ease)}
.menu__book:hover .icon{transform:translateX(-5px)}
.menu__note,.menu__empty{margin:22px 0 0;text-align:center;font-size:.98rem;color:var(--bronze-deep)}

/* how it works */
.steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,60px)}
.steps::before{content:"";position:absolute;top:43px;inset-inline:16%;border-top:1px dashed var(--line-strong)}
.step{position:relative;text-align:center}
.step__icon{position:relative;display:grid;place-items:center;width:86px;height:86px;margin:0 auto 20px;border-radius:50%;background:var(--white);border:1px solid var(--line-strong);color:var(--bronze-deep);box-shadow:var(--shadow)}
.step__icon .icon{width:32px;height:32px}
.step__num{display:block;font-family:var(--display);font-size:1rem;letter-spacing:.2em;color:var(--bronze)}
.step h3{font-size:1.65rem;margin:2px 0 8px}
.step p{max-width:19em;margin:0 auto}
@media (max-width:760px){
  .steps{grid-template-columns:1fr;gap:38px}
  .steps::before{display:none}
}

/* ---------- booking ---------- */
.booking{background:linear-gradient(180deg,var(--paper),#F8EEDF 45%,var(--paper));overflow:clip}
.booking__sprig{width:clamp(120px,16vw,220px);inset-inline-start:-3%;top:8%;color:var(--sage);opacity:.38;transform:rotate(-22deg) scaleX(-1)}
.book{position:relative;max-width:1040px;margin-inline:auto;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);overflow:hidden}
.book--closed{display:grid;justify-items:center;gap:18px;padding:48px 24px;text-align:center}
.book--closed p{margin:0}
.book__treatments{padding:22px clamp(18px,3.4vw,38px);border-bottom:1px solid var(--line);background:linear-gradient(180deg,#FFF8EE,var(--white))}
.book__label{margin:0 0 10px;font-size:.92rem;font-weight:700;letter-spacing:.1em;color:var(--bronze-deep)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{display:grid;gap:1px;padding:10px 22px;border:1px solid var(--line-strong);border-radius:18px;background:var(--white);text-align:start;cursor:pointer;transition:background .2s,border-color .2s,color .2s,box-shadow .2s}
.chip__name{font-weight:700;color:var(--cocoa)}
.chip__meta{font-size:.92rem;color:var(--bronze-deep)}
.chip:hover{border-color:var(--bronze)}
.chip.is-selected{background:var(--bronze-deep);border-color:var(--bronze-deep);box-shadow:0 10px 24px -14px rgba(75,51,32,.7)}
.chip.is-selected .chip__name,.chip.is-selected .chip__meta{color:var(--white)}
.book__main{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr)}
.book__cal{padding:clamp(20px,3.4vw,38px);border-inline-end:1px solid var(--line)}
.book__side{padding:clamp(20px,3.4vw,38px);background:#FFFAF2}
.cal__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.cal__title{font-size:1.5rem}
.cal__nav{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line-strong);border-radius:50%;background:var(--white);cursor:pointer;color:var(--cocoa);transition:background .2s,border-color .2s}
.cal__nav:hover:not(:disabled){background:var(--cream);border-color:var(--bronze)}
.cal__nav:disabled{opacity:.3;cursor:default}
.cal__dow,.cal__grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal__dow{margin-bottom:6px;font-size:.9rem;font-weight:700;color:var(--bronze-deep);text-align:center}
.cal__grid{align-content:start;min-height:calc(6 * 58px)}
.cal__grid.is-loading{opacity:.45}
.cal__day{position:relative;display:grid;place-items:center;width:min(100%,52px);aspect-ratio:1;justify-self:center;padding:0;border:1px solid transparent;border-radius:50%;background:none;font-size:1.05rem;font-variant-numeric:tabular-nums;color:#C3B29B}
.cal__day.is-open{background:var(--cream);color:var(--cocoa);font-weight:700;cursor:pointer;transition:background .2s,color .2s,transform .2s var(--ease)}
.cal__day.is-open:hover{background:var(--sand);transform:scale(1.06)}
.cal__day.is-today{border-color:var(--line-strong)}
.cal__day.is-selected,.cal__day.is-selected:hover{background:var(--bronze-deep);color:var(--white)}
.cal__legend{display:flex;align-items:center;gap:8px;margin:16px 0 0;font-size:.92rem;color:var(--bronze-deep)}
.cal__dot{width:14px;height:14px;border-radius:50%;background:var(--cream);border:1px solid var(--line-strong)}
.book__when{font-size:1.5rem;margin-bottom:6px}
.book__hint{margin:0 0 16px;font-size:1rem;color:var(--bronze-deep)}
.slots{display:grid;gap:8px 10px;grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
.slots__group{grid-column:1/-1;margin:12px 0 0;font-size:.88rem;font-weight:700;letter-spacing:.1em;color:var(--bronze-deep)}
.slots__group:first-child{margin-top:0}
.slot{padding:10px 0;border:1px solid var(--line-strong);border-radius:999px;background:var(--white);font-weight:700;font-variant-numeric:tabular-nums;color:var(--cocoa);cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s var(--ease)}
.slot:hover{background:var(--cream);border-color:var(--bronze);transform:translateY(-2px)}
.book__summary{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;padding:14px 18px;border-radius:16px;background:var(--cream);color:var(--cocoa)}
.book__summary strong{display:block;font-family:var(--display);font-size:1.25rem;font-weight:500;line-height:1.3}
.book__summary span{font-size:1rem}
.book__summary .link{flex:none;font-size:.95rem;font-weight:700}
.book__done,.gift__done{display:grid;justify-items:center;gap:8px;padding-block:18px;text-align:center}
.book__done[hidden],.gift__done[hidden]{display:none}
.book__done:focus,.gift__done:focus{outline:none}
.book__done h3,.gift__done h3{font-size:1.8rem}
.book__done p,.gift__done p{margin:0;max-width:24em}
.done__icon{display:grid;place-items:center;width:68px;height:68px;margin-bottom:6px;border-radius:50%;background:var(--cream);color:var(--bronze-deep);animation:pop .6s var(--ease) both}
.done__icon .icon{width:30px;height:30px}
.done__text strong{font-family:var(--display);font-size:1.3rem;font-weight:500;color:var(--cocoa)}
.book__done .btn,.gift__done .btn{margin-top:14px}
.book__noscript{margin:0;padding:18px 24px;text-align:center;border-top:1px solid var(--line)}
@media (max-width:820px){
  .book__main{grid-template-columns:1fr}
  .book__cal{border-inline-end:0;border-bottom:1px solid var(--line)}
}

/* ---------- forms ---------- */
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.field{display:grid;gap:5px;align-content:start}
.field--full{grid-column:1/-1}
.field label{font-size:.96rem;font-weight:700;color:var(--cocoa)}
.opt{font-weight:400;font-size:.88rem;color:var(--bronze-deep)}
.field input,.field textarea,.field select{width:100%;padding:11px 14px;border:1px solid var(--line-strong);border-radius:14px;background:var(--white);font:inherit;font-size:1.05rem;color:var(--cocoa);transition:border-color .2s,box-shadow .2s}
.field input[dir=ltr]{text-align:right}
.field textarea{resize:vertical;min-height:84px;line-height:1.5}
.field select{appearance:none;-webkit-appearance:none;padding-inline-end:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237B6245' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 12px center;background-size:20px}
.field input::placeholder,.field textarea::placeholder{color:#B9A68D}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--bronze-deep);box-shadow:0 0 0 4px rgba(156,131,99,.2)}
.field .is-invalid{border-color:#B4543C;box-shadow:0 0 0 4px rgba(180,84,60,.14)}
.form__error{margin:14px 0 0;padding:11px 16px;border-radius:14px;background:#FBE9E2;color:#8F3A26;font-weight:600;font-size:1rem}
.form__error[hidden]{display:none}
.book__form > .btn,.gift__form > .btn{margin-top:18px}
.form__note{margin:12px 0 0;font-size:.92rem;line-height:1.5;text-align:center;color:var(--bronze-deep)}
@media (max-width:520px){.fields{grid-template-columns:1fr}}

/* ---------- gift voucher ---------- */
.gift{background:var(--cocoa);color:#EADCC8;overflow:clip}
.gift .wave--top{fill:var(--paper)}
.gift .wave{fill:var(--paper)}
.gift h2,.gift h3{color:#FCF3E6}
.gift .eyebrow{color:#D8C3A2}
.gift__grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(36px,5.5vw,84px);align-items:start;padding-block:clamp(20px,3vw,40px)}
.ticks{display:grid;gap:10px;margin:22px 0 0}
.ticks li{display:flex;gap:12px;align-items:flex-start;line-height:1.55}
.ticks .icon{margin-top:.28em;color:var(--olive)}
.gift__card{margin-top:clamp(34px,5vw,58px)}
.gift__form{position:relative;padding:clamp(24px,3.4vw,40px);border:1px solid rgba(234,220,200,.22);border-radius:var(--radius);background:rgba(255,253,249,.06)}
.gift__form h3{font-size:1.75rem;margin-bottom:18px}
.gift__form .field label{color:#F3E6D2}
.gift__form .opt{color:#CDB89A}
.gift__form .field input,.gift__form .field textarea,.gift__form .field select{background:rgba(255,253,249,.96);border-color:transparent}
.gift__form .form__note{color:#CDB89A}
.gift__form.is-done > :not(.gift__done){display:none}
.gift__done .done__icon{background:rgba(247,232,213,.14);color:var(--cream)}
.gift__done p{color:#EADCC8}
@media (max-width:900px){.gift__grid{grid-template-columns:1fr}}

/* the voucher card: sized in container units, so it keeps its proportions at any width */
.voucher{container-type:inline-size;position:relative;aspect-ratio:3/2;border-radius:1.4cqw;background:#FAE8D4;color:#55340C;box-shadow:0 34px 80px -30px rgba(0,0,0,.65);transform:rotate(-1.6deg);transition:transform .6s var(--ease)}
.voucher:hover{transform:rotate(0)}
.voucher__frame{position:absolute;inset:2.2cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.2cqw 5cqw 1cqw;border:.28cqw solid #B79C6B;text-align:center;line-height:1.2}
.voucher__frame > *{margin:0;flex:none}
.voucher__corner{position:absolute;width:6.4cqw;height:10.6cqw;color:#B5A065}
.voucher__corner--1{top:1.6cqw;inset-inline-start:1.6cqw;transform:rotate(-38deg) scaleX(-1)}
.voucher__corner--2{top:1.6cqw;inset-inline-end:1.6cqw;transform:rotate(38deg)}
.voucher__corner--3{bottom:1.6cqw;inset-inline-start:1.6cqw;transform:rotate(-142deg)}
.voucher__corner--4{bottom:1.6cqw;inset-inline-end:1.6cqw;transform:rotate(142deg) scaleX(-1)}
.voucher__mark{width:6.4cqw;height:7.2cqw;color:#A78655}
.voucher__by{margin-top:.5cqw;font-size:2.05cqw;font-weight:700;letter-spacing:.02em}
.voucher__by span,.voucher__contact span,.voucher__small span{margin-inline:.5em;font-weight:400;opacity:.7}
.voucher__title{display:flex;align-items:center;justify-content:center;gap:2.4cqw;width:100%;margin-top:.3cqw;font-family:var(--display);font-size:7.6cqw;font-weight:700;line-height:1.05}
.voucher__branch{width:11cqw;height:4.7cqw;color:#B5A065}
.voucher__branch--flip{transform:scaleX(-1)}
.voucher__sub{font-family:var(--display);font-size:3.6cqw;font-weight:500}
.voucher__text{margin-top:.7cqw;font-size:2.15cqw;line-height:1.32}
.voucher__fields{display:grid;grid-template-columns:1fr 1fr;gap:.9cqw 5cqw;width:100%;margin:1.3cqw 0 0;padding-block:1.3cqw 1.2cqw;border-block:.16cqw solid #C9B48C}
.voucher__field{display:flex;align-items:baseline;gap:1.2cqw;min-width:0}
.voucher__field dt{flex:none;font-size:2.25cqw;font-weight:700}
.voucher__field dd{flex:1;min-width:0;min-height:3.1cqw;margin:0;border-bottom:.16cqw solid #6B4A1E;font-size:2.35cqw;line-height:1.25;color:#2B1A07;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.voucher__contact{margin-top:1.2cqw;font-size:2.8cqw;font-weight:700}
.voucher__area{font-size:2cqw}
.voucher__small{margin-top:.7cqw;padding-top:.7cqw;border-top:.16cqw solid #C9B48C;font-size:1.6cqw;line-height:1.35}
@media (max-width:600px){
  /* narrow screens: a taller card with larger type and one field per line */
  .voucher{aspect-ratio:auto;border-radius:3cqw;transform:rotate(-1deg)}
  .voucher__frame{position:relative;inset:auto;margin:3.4cqw;padding:5cqw 6cqw 4cqw;border-width:.45cqw}
  .voucher__corner{width:11cqw;height:18cqw}
  .voucher__mark{width:15cqw;height:16.8cqw}
  .voucher__by{font-size:3.9cqw;margin-top:1.4cqw}
  .voucher__title{font-size:12.5cqw;margin-top:1cqw}
  .voucher__branch{display:none}
  .voucher__sub{font-size:6.2cqw}
  .voucher__text{font-size:4.1cqw;margin-top:2cqw}
  .voucher__fields{grid-template-columns:1fr;gap:2.4cqw;margin-top:3.4cqw;padding-block:3.6cqw 3.2cqw;border-width:.3cqw}
  .voucher__field{gap:2.4cqw}
  .voucher__field dt{font-size:4.1cqw}
  .voucher__field dd{min-height:6cqw;font-size:4.4cqw;border-width:.3cqw}
  .voucher__contact{font-size:5cqw;margin-top:3.4cqw}
  .voucher__area{font-size:3.9cqw}
  .voucher__small{font-size:3.2cqw;margin-top:2.4cqw;padding-top:2.4cqw;border-width:.3cqw}
}

/* ---------- good to know + contact ---------- */
.contact__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,96px);align-items:start}
.know{padding:clamp(26px,3.6vw,44px);border:1px solid var(--line);border-radius:var(--radius);background:var(--linen)}
.know__list{display:grid;gap:14px}
.know__list li{display:flex;gap:14px;align-items:flex-start;line-height:1.6}
.know__list .icon{margin-top:.3em;color:var(--olive)}
.reach__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}
.reach__item{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:20px;background:var(--white);text-decoration:none;color:var(--cocoa);transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
a.reach__item:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--bronze)}
.reach__icon{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--cream);color:var(--bronze-deep)}
.reach__icon .icon{width:22px;height:22px}
.reach__item small{display:block;font-size:.86rem;font-weight:700;letter-spacing:.08em;color:var(--bronze-deep);line-height:1.3}
.reach__item strong{display:block;font-size:1.08rem;line-height:1.35;overflow-wrap:anywhere}
@media (max-width:860px){.contact__grid{grid-template-columns:1fr}}
@media (max-width:460px){.reach__list{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.footer{padding-block:clamp(48px,6vw,76px) calc(38px + env(safe-area-inset-bottom));background:var(--sand);text-align:center;color:var(--cocoa)}
.footer__logo{display:grid;justify-items:center;gap:12px;margin-bottom:22px;color:var(--bronze-deep)}
.footer__mark{width:74px;aspect-ratio:458/512}
.footer__word{width:128px;aspect-ratio:654/151}
.footer__tag{width:136px;aspect-ratio:694/40}
.footer__line{margin:0 0 4px;font-weight:700;text-wrap:balance}
.footer__small,.footer__links,.footer__copy{margin:0 0 4px;font-size:.95rem;color:var(--bronze-deep)}
.footer__links{display:flex;justify-content:center;gap:10px;margin-top:14px}
@media (max-width:760px){.footer{padding-bottom:calc(104px + env(safe-area-inset-bottom))}}

/* ---------- mobile call-to-action bar ---------- */
.mobile-cta{display:none}
@media (max-width:760px){
  .mobile-cta{position:fixed;inset-inline:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:50;display:flex;gap:10px;transform:translateY(160%);transition:transform .45s var(--ease)}
  .mobile-cta.is-on{transform:none}
  .mobile-cta .btn--primary{flex:1;box-shadow:0 16px 34px -12px rgba(75,51,32,.7)}
  .mobile-cta .btn--wa{flex:none;width:56px;padding:0;box-shadow:0 16px 34px -12px rgba(30,90,58,.7)}
  .mobile-cta .btn--wa .icon{width:26px;height:26px}
}

/* ---------- dialog ---------- */
.dialog{width:min(92vw,560px);padding:clamp(26px,4vw,42px);border:0;border-radius:var(--radius);background:var(--white);color:var(--ink);box-shadow:var(--shadow-lg)}
.dialog::backdrop{background:rgba(75,51,32,.5);backdrop-filter:blur(3px)}
.dialog h2{font-size:1.9rem;margin-bottom:.5em}
.dialog p{font-size:1.04rem}
.dialog p:last-child{margin-bottom:0}
.dialog__close{position:absolute;top:14px;inset-inline-end:14px;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line-strong);border-radius:50%;background:var(--white);cursor:pointer}

/* ---------- motion ---------- */
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes sway{0%,100%{rotate:0deg}50%{rotate:4deg}}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.rise{animation:rise 1s var(--ease) both}
.hero__text .rise:nth-child(2){animation-delay:.1s}
.hero__text .rise:nth-child(3){animation-delay:.22s}
.hero__text .rise:nth-child(4){animation-delay:.34s}
.hero__text .rise:nth-child(5){animation-delay:.46s}
.hero__visual.rise{animation-delay:.25s;animation-duration:1.3s}
/* .reveal elements start visible; the script hides only those still below the fold, then fades them in */
.reveal.is-waiting{opacity:0;transform:translateY(26px)}
.reveal.is-shown{transition:opacity .95s var(--ease),transform .95s var(--ease);transition-delay:var(--delay,0s)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .swoosh path{stroke-dashoffset:0}
  .reveal.is-waiting{opacity:1;transform:none}
}

/* ---------- print (the voucher page) ---------- */
@media print{
  .site-header,.mobile-cta,.footer,.no-print{display:none!important}
  body{background:#fff}
  body::after{display:none}
}