/* Kai Thai Spa — site styles. Palette and type: brand.md §6 */
@font-face{font-family:'Albert Sans';font-style:normal;font-weight:400 800;font-display:optional;src:url(https://fonts.gstatic.com/s/albertsans/v4/i7dOIFdwYjGaAMFtZd_QA1ZbYFc.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}

:root{--ink:#1e1a18;--ink-2:#4a4440;--ink-3:#6b645f;--line:#e2ddd8;--bg-alt:#eef3f0;--jade:#2e5e4e;--header-h:72px}
h1{font-size:clamp(2.1rem,1.4rem + 3.2vw,3.9rem);letter-spacing:-.03em;line-height:1.02}
h2{letter-spacing:-.025em}
.brand img{height:44px;width:auto}
.nav a[aria-current="page"]{color:var(--brand)}

/* ---- Hero: promise left, branch picker right ------------------- */
.hero{padding-block:clamp(1.5rem,5vw,4.5rem) clamp(2rem,5vw,4rem)}
.hero-grid{display:grid;gap:clamp(1.25rem,4vw,4rem);grid-template-columns:1fr}
@media(min-width:960px){.hero-grid{grid-template-columns:1.05fr 1fr;align-items:start}}
.hero-grid>*{min-width:0}
.hero h1{margin-bottom:var(--s-4)}
.hero .lede{font-size:var(--fs-lg);color:var(--ink-2);max-width:44ch}
.hero .hours-line{margin-top:var(--s-4);font-size:var(--fs-sm);color:var(--ink-2)}
.hero .hours-line strong{color:var(--ink)}
.rooms{display:flex;gap:var(--s-3);margin-top:var(--s-6)}
.rooms img{width:min(31%,170px);aspect-ratio:1;object-fit:cover;border-radius:var(--radius)}
@media(max-width:959px){.rooms{display:none}}

/* branch rows */
.branches{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.branches li{display:flex;align-items:center;gap:var(--s-2);padding:.55rem 0;border-bottom:1px solid var(--line)}
.branches .where{flex:1;min-width:0}
.branches .where b{display:block;font-size:clamp(1.05rem,1rem + .5vw,1.35rem);font-weight:750;letter-spacing:-.01em;line-height:1.15}
.branches .where span{display:block;font-size:var(--fs-xs);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.branches .btn{padding:.7em 1em;min-height:44px;font-size:var(--fs-sm)}
.ico{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--radius);border:1.5px solid var(--line);color:var(--ink);text-decoration:none;flex:none}
.ico svg{width:20px;height:20px}
.ico.wa{color:var(--jade)}
.ico:hover{border-color:currentColor}
.picker-note{font-size:var(--fs-xs);color:var(--ink-3);margin-top:var(--s-3)}

/* ---- Menu board ------------------------------------------------ */
.board{background:var(--bg-alt)}
.board-cols{display:grid;gap:var(--s-7) clamp(2rem,5vw,4.5rem);grid-template-columns:1fr}
@media(min-width:860px){.board-cols{grid-template-columns:1fr 1fr}}
.menu h3{font-size:var(--fs-lg);font-weight:750;margin-bottom:var(--s-3);padding-bottom:var(--s-2);border-bottom:2px solid var(--ink)}
.menu dl{margin:0}
.menu .row{display:flex;align-items:baseline;gap:.5em;padding:.5rem 0}
.menu dt{font-weight:600}
.menu dt small{display:block;font-weight:400;color:var(--ink-3);font-size:var(--fs-xs)}
.menu .dots{flex:1;border-bottom:2px dotted color-mix(in srgb,var(--ink) 28%,transparent);transform:translateY(-.3em);min-width:1.5rem}
.menu dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.menu dd .t{font-weight:400;color:var(--ink-3);font-size:var(--fs-xs);margin-right:.35em}
.menu .row.two dd{min-width:0}
@media(max-width:600px){.menu .row.two{flex-wrap:wrap;row-gap:0}.menu .row.two dt{flex-basis:100%}}
.menu p.note{font-size:var(--fs-sm);color:var(--ink-2);margin-top:var(--s-3)}
.board .more{margin-top:var(--s-7)}

/* ---- Offers / vouchers strip ----------------------------------- */
.offer{border:2px solid var(--brand);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);display:grid;gap:var(--s-4);grid-template-columns:1fr}
@media(min-width:760px){.offer{grid-template-columns:1fr auto;align-items:center}}
.offer h2{font-size:var(--fs-xl);margin-bottom:var(--s-2)}
.vouchers{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));margin-top:var(--s-6)}
.voucher{border:1px solid var(--line);border-radius:var(--radius);padding:var(--s-5);display:flex;flex-direction:column;gap:var(--s-3)}
.voucher b{font-size:var(--fs-2xl);font-weight:800;letter-spacing:-.03em;line-height:1}
.voucher .btn{margin-top:auto}

/* ---- Guests ---------------------------------------------------- */
.guests{display:grid;gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.guests figure{margin:0}
.guests img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);height:auto}
.guests figcaption{font-size:var(--fs-sm);color:var(--ink-2);margin-top:var(--s-2)}

/* ---- Branch cards (contact) ------------------------------------ */
.branch-list{display:grid;gap:var(--s-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.branch{border-top:2px solid var(--ink);padding-top:var(--s-4)}
.branch h2,.branch h3{font-size:var(--fs-xl);margin-bottom:var(--s-2)}
.branch address{font-style:normal;color:var(--ink-2);margin-bottom:var(--s-3)}
.branch .cluster .btn{min-height:44px}
.btn-jade{background:var(--jade);color:#fff}
.btn-jade:hover{filter:brightness(1.1)}

/* ---- Prose pages ----------------------------------------------- */
.prose{max-width:68ch}
.prose h2{font-size:var(--fs-xl);margin-top:var(--s-7)}
.prose h3{font-size:var(--fs-lg);margin-top:var(--s-5);margin-bottom:var(--s-2)}
.page-head{padding-block:clamp(2rem,5vw,4rem) var(--s-5)}
.page-head .lede{font-size:var(--fs-lg);color:var(--ink-2)}
.hours-table{border-collapse:collapse;margin:var(--s-3) 0}
.hours-table td{padding:.35rem 1.5rem .35rem 0;border-bottom:1px solid var(--line)}

/* ---- Footer ---------------------------------------------------- */
.site-footer{background:var(--ink);color:#e9e5e1;padding-block:var(--s-8) var(--s-6);margin-top:var(--s-8)}
.site-footer a{color:#fff}
.foot-branches{display:grid;gap:var(--s-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));font-size:var(--fs-sm)}
.foot-branches b{display:block;color:#fff;margin-bottom:.2rem}
.foot-branches p{color:#cfc9c3}
.foot-meta{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);justify-content:space-between;margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid #3a3431;font-size:var(--fs-sm);color:#cfc9c3}
.foot-meta nav{display:flex;flex-wrap:wrap;gap:var(--s-4)}
