/* Amazing Postnatal Care — static site styles
   Only rules that cannot live inline (media queries, pseudo-states, keyframes). */

html { scroll-behavior: smooth; }
body { margin: 0; background: #faf6ee; font-family: var(--font-zh); }
* { box-sizing: border-box; }
img { max-width: 100%; height: auto; }
a { color: var(--brand-sage-deep); text-decoration: none; }
a:hover { color: var(--rose-deep); }
::selection { background: var(--rose-blush); }
body, body * { cursor: url("assets/cursor-leaf.svg") 2 2, auto; }

/* ---------- keyframes ---------- */
@keyframes slowZoom { from { transform: scale(1.06) } to { transform: scale(1) } }
@keyframes breathe { 0%,100% { box-shadow: 0 10px 30px rgba(182,99,112,.18) } 50% { box-shadow: 0 14px 46px rgba(182,99,112,.34) } }
@keyframes glow { 0%,100% { transform: translateX(-50%) scale(1); opacity: .62 } 50% { transform: translateX(-50%) scale(1.06); opacity: .8 } }
@keyframes introVeil { from { opacity: 1 } to { opacity: 0; visibility: hidden } }
@keyframes heroCopyIn { from { opacity: 0; transform: translateY(18px) } to { opacity: 1; transform: none } }
@keyframes fadeRise { from { opacity: 0; transform: translateY(12px) } to { opacity: 1; transform: none } }

[data-intro] { animation: introVeil 1400ms cubic-bezier(.16,1,.3,1) 260ms forwards; }
[data-hero-copy] { animation: heroCopyIn 1000ms cubic-bezier(.16,1,.3,1) 760ms both; }
[data-intro-skip="1"] [data-intro] { display: none; }
[data-intro-skip="1"] [data-hero-copy] { animation: none; }

/* ---------- reveal on scroll ---------- */
.reveal-pending { opacity: 0; transform: translateY(26px); }
.reveal-in { opacity: 1; transform: none; transition: opacity 760ms cubic-bezier(.16,1,.3,1), transform 760ms cubic-bezier(.16,1,.3,1); }

/* ---------- header / nav ---------- */
.site-header {
  position: fixed; top: 18px; left: 0; right: 0; z-index: 80;
  display: flex; justify-content: center; padding: 0 20px;
}
.nav-pill {
  display: flex; align-items: center; gap: 26px;
  background: rgba(255,255,255,.92); backdrop-filter: blur(14px);
  border-radius: 999px; padding: 10px 12px 10px 22px;
  box-shadow: 0 8px 32px rgba(93,80,64,.10);
  max-width: 100%;
}
.nav-logo { display: flex; align-items: center; flex: none; }
.nav-logo img { height: 34px; width: auto; display: block; }
.nav-links { display: flex; align-items: center; gap: 20px; }
.nav-links a {
  font-size:16px; font-weight: 500; letter-spacing: .08em;
  color: var(--brand-bark); white-space: nowrap;
}
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--rose-deep); }
.nav-cta {
  background: var(--brand-bark-deep); color: #fff; font-size:16px; font-weight: 600;
  letter-spacing: .08em; padding: 11px 22px; border-radius: 999px; white-space: nowrap;
  transition: background 240ms cubic-bezier(.16,1,.3,1);
}
.nav-cta:hover { background: var(--rose-deep); color: #fff; }
.nav-lang, .nav-drawer-lang {
  -webkit-appearance: none; appearance: none; background: transparent; cursor: pointer; font: inherit;
}
.nav-drawer .nav-drawer-lang { border: none; padding: 12px 24px; }
.nav-lang {
  flex: none; font-family: var(--font-en); font-size:16px; font-weight: 700; letter-spacing: .12em;
  color: var(--brand-sage-deep); border: 1px solid var(--stone); border-radius: 999px;
  padding: 8px 13px; white-space: nowrap; line-height: 1;
  transition: border-color 240ms cubic-bezier(.16,1,.3,1), color 240ms cubic-bezier(.16,1,.3,1);
}
.nav-lang:hover { border-color: var(--rose); color: var(--rose-deep); }
.nav-drawer .nav-drawer-lang {
  font-size: 16px; font-weight: 600; letter-spacing: .1em; color: var(--brand-sage-deep);
}
.nav-burger {
  display: none; width: 44px; height: 44px; border: none; background: transparent;
  cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0;
}
.nav-burger span { width: 20px; height: 2px; background: var(--brand-bark-deep); border-radius: 2px; display: block; }

.nav-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 95;
  width: min(84vw, 360px); background: #faf6ee;
  box-shadow: -18px 0 48px rgba(93,80,64,.16);
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px;
  padding: 80px 28px 40px;
  transform: translateX(104%); visibility: hidden;
  transition: transform 420ms cubic-bezier(.2,.7,.2,1), visibility 0s linear 420ms;
}
.nav-drawer.is-open { transform: none; visibility: visible; transition: transform 420ms cubic-bezier(.2,.7,.2,1), visibility 0s; }
.nav-drawer > * { opacity: 0; transform: translateX(18px); transition: opacity 240ms cubic-bezier(.2,.7,.2,1), transform 240ms cubic-bezier(.2,.7,.2,1); }
.nav-drawer.is-open > * { opacity: 1; transform: none; transition-duration: 420ms; }
.nav-drawer.is-open > *:nth-child(2) { transition-delay: 90ms; }
.nav-drawer.is-open > *:nth-child(3) { transition-delay: 130ms; }
.nav-drawer.is-open > *:nth-child(4) { transition-delay: 170ms; }
.nav-drawer.is-open > *:nth-child(5) { transition-delay: 210ms; }
.nav-drawer.is-open > *:nth-child(6) { transition-delay: 250ms; }
.nav-drawer.is-open > *:nth-child(7) { transition-delay: 290ms; }
.nav-drawer.is-open > *:nth-child(8) { transition-delay: 330ms; }
.nav-drawer.is-open > *:nth-child(9) { transition-delay: 370ms; }
.nav-drawer a, .nav-drawer .nav-drawer-lang { padding-left: 0 !important; padding-right: 0 !important; }
.nav-drawer .nav-drawer-cta { padding: 14px 34px !important; }
.nav-drawer .nav-drawer-close { opacity: 1; transform: none; }
.nav-scrim {
  position: fixed; inset: 0; z-index: 94; background: rgba(43,38,32,.38);
  opacity: 0; visibility: hidden;
  transition: opacity 320ms cubic-bezier(.2,.7,.2,1), visibility 0s linear 320ms;
}
.nav-scrim.is-open { opacity: 1; visibility: visible; transition: opacity 320ms cubic-bezier(.2,.7,.2,1), visibility 0s; }
@media (prefers-reduced-motion: reduce) {
  .nav-drawer, .nav-drawer > *, .nav-scrim { transition: none !important; }
}
.nav-drawer a {
  padding: 12px 24px; font-size: 22px; font-weight: 600; letter-spacing: .08em; color: var(--brand-bark-deep);
}
.nav-drawer .nav-drawer-cta {
  margin-top: 14px; background: var(--brand-bark-deep); color: #fff;
  font-size: 18px; padding: 14px 34px; border-radius: 999px;
}
.nav-drawer-close {
  position: absolute; top: 22px; right: 22px; width: 44px; height: 44px;
  border: none; background: transparent; cursor: pointer; font-size: 26px; color: var(--brand-bark-deep);
}

@media (max-width: 1080px) {
  .nav-pill { gap: 16px; }
  .nav-links { gap: 14px; }
}
@media (max-width: 899px) {
  .nav-links, .nav-cta { display: none; }
  .nav-burger { display: flex; }
  .nav-pill { gap: 12px; padding: 8px 8px 8px 18px; }
}

/* ---------- page transition veil ---------- */
.page-veil {
  position: fixed; inset: 0; z-index: 200; background: #faf6ee;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transition: opacity 420ms cubic-bezier(.16,1,.3,1);
}
.page-veil.is-on { opacity: 1; pointer-events: auto; }

/* ---------- testimonial switcher ---------- */
[data-tm-panel] { display: none; }
[data-tm-panel] { flex-wrap: wrap; gap: clamp(20px,2.4vw,31px); align-items: center; }
[data-tm-panel].is-active { display: flex; animation: fadeRise 280ms cubic-bezier(.2,.7,.2,1) both; }
@keyframes tmFromRight { from { opacity: 0; transform: translateX(56px) } to { opacity: 1; transform: none } }
@keyframes tmFromLeft { from { opacity: 0; transform: translateX(-56px) } to { opacity: 1; transform: none } }
[data-tm-panel].is-active.tm-from-right { animation: tmFromRight 420ms cubic-bezier(.2,.7,.2,1) both; }
[data-tm-panel].is-active.tm-from-left { animation: tmFromLeft 420ms cubic-bezier(.2,.7,.2,1) both; }
[data-m="tm-panels"] { touch-action: pan-y; overflow-x: clip; }
[data-awards-dots] { display: none; }
br[data-m-br] { display: none; }
@media (max-width: 760px) {
  [data-m-hide] { display: none !important; }
  [data-m-ampm] { display: none; }
  [data-m-meal-row] { flex-direction: column !important; gap: 0 !important; }
  [data-m-meal-row] > div:first-child { width: 100%; min-height: 150px; }
  [data-m-meal-row] { position: relative; }
  [data-m-meal-arrows] { display: flex !important; position: absolute; top: -6px; right: 0; gap: 8px !important; z-index: 2; }
  [data-m-meal-arrows] > button { width: 44px !important; height: 44px !important; flex: none; }
  [data-m-meal-arrows] > button:active { transform: scale(.94); }
  [data-m-meal-head] > div:first-child { padding-right: 104px; box-sizing: border-box; }
  [data-m-meal-head] { flex-wrap: wrap; gap: 4px 12px !important; }
  [data-m-meal-head] > div:first-child { font-size: 30.8px !important; width: 100%; line-height: 1.1; }
  [data-m-meal-head] > div:nth-child(2) { font-size: 22px !important; }
  [data-m-meal-head] > div:nth-child(3) { display: none; }
  [data-m-meal-row] p { margin-top: 10px !important; line-height: 1.7 !important; }
  [data-m-tl-labels] { display: grid !important; grid-template-columns: repeat(5, minmax(0,1fr)); height: auto !important; margin-left: -9px; margin-right: -9px; }
  [data-m-tl-labels] > button { position: static !important; left: auto !important; transform: none !important; min-height: 44px; padding: 8px 0 !important; display: flex !important; justify-content: center; align-items: flex-start; text-align: center; }
  br[data-m-br] { display: inline; }
  [data-m-dash] { display: none; }
  br[data-m-br] + span { margin-left: 0 !important; display: inline-block; margin-top: 6px; }
}
.tm-tab {
  display: flex; align-items: center; gap: 10px; flex: 1 1 0%; padding: 10px 14px;
  border-radius: 14px; cursor: pointer; text-align: left; min-width: 150px;
  border: 1px solid var(--stone); background: transparent; color: var(--brand-bark);
  box-shadow: none; transition: all 240ms cubic-bezier(.2,.7,.2,1); font-family: inherit;
}
.tm-tab.is-active {
  border-color: var(--brand-bark-deep); background: #fff; color: var(--fg-strong);
  box-shadow: 0 8px 20px rgba(93,80,64,.12);
}

/* ---------- generic switch panels (meals / rooms) ---------- */
[data-panel] { display: none; }
[data-panel].is-active { display: block; animation: fadeRise 280ms cubic-bezier(.2,.7,.2,1) both; }

/* ---------- video modal ---------- */
.video-modal {
  position: fixed; inset: 0; z-index: 160; background: rgba(93,80,64,.82);
  display: none; align-items: center; justify-content: center; padding: 48px; cursor: pointer;
}
.video-modal.is-open { display: flex; }
.video-modal-inner { width: min(980px, 92vw); }
.video-modal-frame {
  position: relative; width: 100%; aspect-ratio: 16/9; border-radius: 16px;
  overflow: hidden; background: #000; box-shadow: 0 30px 70px rgba(0,0,0,.4);
}
.video-modal-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: none; }
.video-modal-hint { margin-top: 14px; text-align: center; font-size:16px; font-weight: 500; letter-spacing: .08em; color: rgba(255,255,255,.8); }

@media (prefers-reduced-motion: reduce) {
  [data-intro] { display: none !important; }
  [data-hero-copy], [data-tm-panel].is-active, [data-panel].is-active { animation: none !important; }
  .reveal-pending { opacity: 1; transform: none; }
}

/* ---------- hero: narrow screens stack photo over copy ---------- */
@media (max-width: 900px) {
  #top { height: auto !important; min-height: 100svh !important; max-height: none !important; }
  [data-hero-photo-wrap] { position: relative !important; inset: auto !important; width: 100% !important; height: min(48svh, 400px) !important; }
  [data-hero-photo] { object-position: 58% 32% !important; transform: scale(1.3); transform-origin: 58% 34%; }
  [data-hero-wash] { display: none !important; }
  [data-hero-copy] { position: relative !important; inset: auto !important; justify-content: flex-start !important; padding: clamp(28px, 5svh, 44px) 26px clamp(40px, 7svh, 64px) !important; max-width: none !important; }
  [data-hero-copy] p { max-width: 100% !important; }
  [data-hero-copy] > div:first-child { font-size:16px !important; letter-spacing: .22em !important; }
}

/* ---------- mobile layer (desktop untouched) ---------- */
@media (max-width: 900px) {
  [data-m-stack] { grid-template-columns: minmax(0,1fr) !important; }
  [data-m-unstick] { position: static !important; }
  [data-m-roomlist] { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 14px !important; }
  [data-m-roomlist] > button { padding: 11px 0 !important; min-height: 44px; }
}
@media (max-width: 760px) {
  [data-m-full] { max-width: 100% !important; }
  [data-m-sec] { padding-top: 64px !important; padding-bottom: 64px !important; }
  [data-m-card] { padding: 32px 22px !important; border-radius: 24px !important; }
  [data-m-badge] { position: static !important; display: inline-block !important; margin: 0 0 20px !important; padding: 12px 20px !important; font-size: 20px !important; line-height: 1.35 !important; max-width: 100%; }
  [data-m-foot-tag] { min-width: 0 !important; flex: 1 1 100% !important; order: 3; letter-spacing: .14em !important; }
  [data-m-tap] { display: inline-flex; align-items: center; min-height: 44px; }
  [data-track-dot] { position: relative; }
  [data-track-dot]::after { content: ""; position: absolute; left: -8px; right: -8px; top: -18px; bottom: -18px; }
  .nav-drawer a, .nav-drawer .nav-drawer-lang { min-height: 48px; display: flex; align-items: center; }
  .video-modal { padding: 16px; }
  .tm-tab { min-width: 0; flex: 1 1 calc(50% - 6px); }
}
@media (max-width: 560px) {
  [data-m-one] { grid-template-columns: minmax(0,1fr) !important; }
  [data-m-roomlist] { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .site-header { top: 12px; padding: 0 12px; }
}

/* ---------- mobile: footer, awards carousel, testimonial tabs, spacing ---------- */
@media (max-width: 760px) {
  [data-m-footer] { padding-bottom: 40px !important; }
  [data-m-foot] { flex-direction: column !important; justify-content: center !important; gap: 18px !important; padding-top: 36px !important; text-align: center; }
  [data-m-foot] > img { height: 36px !important; }
  [data-m-foot-tag] { order: 0 !important; flex: none !important; letter-spacing: .16em !important; }
  [data-m-foot-links] { justify-content: center !important; gap: 4px 22px !important; width: 100%; }
  [data-m-copy] { flex: 1 1 100%; text-align: center; margin-top: 6px; padding-top: 18px; border-top: 1px solid rgba(93,80,64,.08); }

  [data-awards] {
    display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px !important;
    margin-left: -20px !important; margin-right: -20px !important; padding: 4px 20px 6px;
    scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
  }
  [data-awards]::-webkit-scrollbar { display: none; }
  [data-awards] > div {
    flex: 0 0 72%; scroll-snap-align: center; background: #fff; border-radius: 24px;
    padding: 24px 16px 26px; box-shadow: 0 8px 24px rgba(93,80,64,.07);
  }
  [data-awards-dots] { display: flex; justify-content: center; gap: 8px; margin-top: 16px; }
  [data-awards-dots] button { position: relative; width: 8px; height: 8px; padding: 0; border: none; border-radius: 999px; background: var(--stone); cursor: pointer; transition: width 240ms cubic-bezier(.2,.7,.2,1), background 240ms cubic-bezier(.2,.7,.2,1); }
  [data-awards-dots] button::after { content: ""; position: absolute; inset: -18px -8px; }
  [data-awards-dots] button.is-active { width: 22px; background: var(--rose); }

  [data-m="tm-tabs"] {
    flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x proximity; gap: 10px !important;
    padding: 22px 20px 4px !important; scrollbar-width: none;
  }
  [data-m="tm-tabs"]::-webkit-scrollbar { display: none; }
  [data-m="tm-tabs"] .tm-tab { flex: 0 0 auto; min-width: 0; scroll-snap-align: start; min-height: 48px; }
  [data-m="tm-panels"] { padding-left: 20px !important; padding-right: 20px !important; }
  [data-m="tm"] { border-radius: 24px !important; }

  [data-m-sec] { padding-top: 56px !important; padding-bottom: 56px !important; }
  [data-m-sec] h2 { line-height: 1.3; }
}

/* ---------- mobile image zoom ---------- */
.img-zoom {
  position: fixed; inset: 0; z-index: 170; background: rgba(43,38,32,.92);
  display: none; align-items: center; justify-content: center; padding: 56px 12px;
  opacity: 0; transition: opacity 240ms cubic-bezier(.2,.7,.2,1);
}
.img-zoom.is-open { display: flex; }
.img-zoom.is-in { opacity: 1; }
.img-zoom img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: 14px; transform: scale(.96); transition: transform 320ms cubic-bezier(.2,.7,.2,1); }
.img-zoom.is-in img { transform: none; }
.img-zoom-close {
  position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; border: none; border-radius: 50%;
  background: rgba(255,255,255,.16); color: #fff; font-size: 24px; line-height: 1; cursor: pointer;
}
@media (max-width: 760px) {
  [data-zoomable] { cursor: zoom-in; }
}

/* ---------- mobile: first section clears the fixed header ---------- */
@media (max-width: 760px) {
  body > div > section[data-m-sec]:first-child { padding-top: 112px !important; }
  [data-m-unstick] { scroll-margin-top: 84px; }
}

/* ---------- mobile: single-column lists, roomier careers card ---------- */
@media (max-width: 900px) {
  [data-m-roomlist] { grid-template-columns: minmax(0,1fr) !important; }
}
@media (max-width: 760px) {
  [data-m="weeks"] { grid-template-columns: minmax(0,1fr) !important; gap: 12px !important; }
  [data-m-career] { grid-template-columns: minmax(0,1fr) !important; gap: 24px !important; }
  [data-m-career] p { font-size: 17px !important; line-height: 1.8 !important; }
  [data-m-career] p + p { margin-top: 16px !important; }
  [data-m-career] a { margin-top: 24px !important; padding: 14px 24px !important; }
  [data-m-career] > div:last-child { min-height: 220px !important; }
  .m-bar > * { min-width: 0; padding: 0 10px; font-size: 15.5px !important; letter-spacing: .02em !important; white-space: nowrap; }
}

/* ---------- FAQ accordion ---------- */
details > summary::-webkit-details-marker { display: none; }
details > summary > span { transition: transform 240ms cubic-bezier(.2,.7,.2,1); }
details[open] > summary > span { transform: rotate(180deg); }
@media (max-width: 760px) {
  details[data-reveal] { border-radius: 22px !important; box-shadow: 0 4px 16px rgba(93,80,64,.05); }
  details[data-reveal] + details[data-reveal] { margin-top: 2px; }
  details[data-reveal] > summary {
    padding: 18px 18px 18px 22px !important; gap: 14px !important; align-items: center;
    font-size: 16.5px !important; line-height: 1.45 !important; letter-spacing: .01em;
  }
  details[data-reveal] > summary > span {
    flex: none; width: 30px; height: 30px; border-radius: 50%; background: #fff;
    display: inline-flex; align-items: center; justify-content: center; font-size: 16px !important; line-height: 1;
  }
  details[data-reveal] > div {
    padding: 0 22px 22px !important; font-size: 16px !important; line-height: 1.75 !important;
  }
  details[data-reveal][open] > div { border-top: 1px solid rgba(93,80,64,.08); padding-top: 14px !important; }
}

/* ---------- QA fixes ---------- */
.nav-logo { min-height: 44px; }
@media (max-width: 760px) {
  .m-bar > * { font-size: 16px !important; letter-spacing: 0 !important; padding: 0 8px; }
  [data-m-team] { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 12px 14px !important; }
  [data-m-team] > div { flex-direction: row !important; align-items: center !important; gap: 10px !important; text-align: left; }
  [data-m-team] > div > div:first-child { width: 42px !important; height: 42px !important; }
  [data-m-team] span { text-align: left !important; line-height: 1.3; overflow-wrap: anywhere; }
}
@media (max-width: 1080px) {
  [data-m-badge] { position: static !important; display: inline-block !important; margin: 0 0 24px !important; max-width: 100%; line-height: 1.35 !important; }
  [data-m-badge] + div { margin-top: 0; }
  [data-m-badge] { transform: translateY(-4px); }
}
@media (max-width: 1080px) and (min-width: 761px) {
  [data-m-card]:has(> [data-m-badge]) { padding-top: 40px !important; }
}

/* ---------- short laptop viewports: hero copy must never collide with the stats row ---------- */
@media (min-width: 901px) and (max-height: 820px) {
  #top { height: auto !important; min-height: 0 !important; max-height: none !important; }
  [data-hero-copy] { position: relative !important; inset: auto !important; padding-top: 128px !important; padding-bottom: 150px !important; }
  [data-hero-copy] h1 { font-size: clamp(44px, 5.2vw, 78px) !important; }
}
@media (min-width: 901px) and (max-height: 700px) {
  [data-hero-copy] { padding-top: 112px !important; padding-bottom: 140px !important; }
  [data-hero-copy] h1 { font-size: clamp(40px, 4.6vw, 66px) !important; }
}

/* ---------- mobile: hero eyebrow on one line ---------- */
@media (max-width: 900px) {
  [data-hero-copy] > div:first-child { font-size: clamp(11.5px, 3.3vw, 14px) !important; letter-spacing: .14em !important; white-space: nowrap; }
}
@media (max-width: 360px) {
  [data-hero-copy] > div:first-child { letter-spacing: .1em !important; }
}

/* ---------- mobile: award cards share one height, name block reserves two lines ---------- */
@media (max-width: 760px) {
  [data-awards] { align-items: stretch !important; }
  [data-awards] > div { display: flex !important; flex-direction: column; align-items: center; justify-content: flex-start; }
  [data-awards] > div > div:last-child {
    min-height: calc(2 * 1.45em); line-height: 1.45 !important; margin-top: 0 !important;
    display: flex; align-items: center; justify-content: center; text-align: center; text-wrap: balance;
  }
}

@media (max-width: 760px) {
  [data-m-seclink] {
    display: flex !important; align-items: center; justify-content: center; width: 100%;
    min-height: 50px; margin-top: 32px; border: 1px solid var(--stone); border-radius: 999px; background: #fff;
    transition: border-color 240ms cubic-bezier(.2,.7,.2,1), transform 240ms cubic-bezier(.2,.7,.2,1);
  }
  [data-m-seclink]:active { transform: scale(.98); }
}
@media (max-width: 760px) {
  [data-meal-stack] { height: auto !important; min-height: 380px !important; margin-bottom: 64px !important; }
}

/* ---------- mobile: testimonial picker becomes dots (name + avatar already on the card) ---------- */
@media (max-width: 760px) {
  [data-m="tm-tabs"] { justify-content: center !important; flex-wrap: nowrap !important; overflow: visible !important; gap: 10px !important; padding: 18px 20px 4px !important; }
  [data-m="tm-tabs"] .tm-tab {
    position: relative; flex: none !important; width: 8px; height: 8px; min-width: 0 !important; min-height: 0 !important;
    padding: 0 !important; border: none !important; border-radius: 999px !important; box-shadow: none !important;
    background: var(--stone) !important; font-size: 0 !important; overflow: visible;
    transition: width 240ms cubic-bezier(.2,.7,.2,1), background 240ms cubic-bezier(.2,.7,.2,1);
  }
  [data-m="tm-tabs"] .tm-tab > * { display: none !important; }
  [data-m="tm-tabs"] .tm-tab.is-active { width: 24px; background: var(--rose) !important; }
  [data-m="tm-tabs"] .tm-tab::after { content: ""; position: absolute; left: -6px; right: -6px; top: -18px; bottom: -18px; }
}

[data-m="tm-panels"] { cursor: grab; user-select: none; -webkit-user-select: none; }
[data-m="tm-panels"] p, [data-m="tm-panels"] h3 { user-select: text; -webkit-user-select: text; }
[data-m="tm-panels"] [data-tm-panel] { will-change: transform; }

/* ---------- mobile About: founder photo before team avatars ---------- */
@media (max-width: 900px) {
  [data-m-stack]:has(> div > [data-m-team]) { gap: 0 !important; }
  [data-m-stack] > div:first-child:has(> [data-m-team]) { display: contents; }
  [data-m-stack]:has(> div > [data-m-team]) > div:first-child > * { order: 1; }
  [data-m-stack]:has(> div > [data-m-team]) > div:last-child { order: 2; margin-top: 32px; }
  [data-m-stack]:has(> div > [data-m-team]) [data-m-team] { order: 3 !important; margin-top: 32px !important; }
}

/* ---------- mobile Care: I-Remote photo between title and feature cards ---------- */
@media (max-width: 900px) {
  :has(> [data-m-iremote-img]) { display: flex !important; flex-direction: column; gap: 0 !important; }
  :has(> [data-m-iremote-img]) > div:first-child { display: contents; }
  :has(> [data-m-iremote-img]) > div:first-child > h2 { order: 1; margin-bottom: 20px !important; }
  [data-m-iremote-img] { order: 2; margin: 0 auto 24px; width: 100%; max-width: 440px; }
  :has(> [data-m-iremote-img]) > div:first-child > div { order: 3; }
}

/* ---------- rooms picker bar (mobile only) ---------- */
.room-picker-bar { display: none; }
@media (max-width: 900px) {
  [data-m-unstick].is-collapsible .room-picker-bar {
    display: flex; align-items: center; gap: 10px; width: 100%; min-height: 60px; padding: 12px 22px;
    border: none; background: #fff; cursor: pointer; font: inherit; text-align: left; color: var(--fg-strong);
  }
  .room-picker-bar .rpb-k { flex: none; font-size: 16px; font-weight: 500; color: var(--taupe); }
  .room-picker-bar .rpb-v { flex: 1; min-width: 0; font-size: 17px; font-weight: 700; color: var(--rose-deep); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .room-picker-bar .rpb-i {
    flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--paper); display: inline-flex; align-items: center; justify-content: center;
    font-size: 16px; color: var(--brand-bark); transition: transform 240ms cubic-bezier(.2,.7,.2,1);
  }
  [data-m-unstick].is-open .room-picker-bar .rpb-i { transform: rotate(180deg); }
  [data-m-unstick].is-collapsible .room-picker-body {
    display: grid; grid-template-rows: 0fr; transition: grid-template-rows 320ms cubic-bezier(.2,.7,.2,1);
  }
  [data-m-unstick].is-collapsible .room-picker-body > * { min-height: 0; overflow: hidden; }
  [data-m-unstick].is-collapsible.is-open .room-picker-body { grid-template-rows: 1fr; border-top: 1px solid var(--stone); }
  [data-m-unstick].is-collapsible { border-radius: 22px !important; }
}

/* rooms picker: open as an overlay panel instead of pushing content down */
@media (max-width: 900px) {
  [data-m-unstick].is-collapsible { position: relative !important; top: auto !important; overflow: visible !important; z-index: 40; }
  [data-m-unstick].is-collapsible .room-picker-bar { border-radius: 22px; }
  [data-m-unstick].is-collapsible .room-picker-body {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px);
    background: #fff; border-radius: 22px; box-shadow: 0 18px 48px rgba(93,80,64,.18);
    max-height: min(70svh, 560px); overflow-y: auto; overscroll-behavior: contain;
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity 240ms cubic-bezier(.2,.7,.2,1), transform 240ms cubic-bezier(.2,.7,.2,1), visibility 0s linear 240ms;
    display: block !important; grid-template-rows: none !important; border-top: none !important;
  }
  [data-m-unstick].is-collapsible .room-picker-body > * { overflow: visible !important; }
  [data-m-unstick].is-collapsible.is-open .room-picker-body {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity 240ms cubic-bezier(.2,.7,.2,1), transform 240ms cubic-bezier(.2,.7,.2,1), visibility 0s;
  }
}

@media (max-width: 900px) {
  [data-m-unstick].is-collapsible .room-picker-bar { min-height: 72px; padding: 12px 18px 12px 22px; gap: 14px; }
  .room-picker-bar .rpb-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
  .room-picker-bar .rpb-k { font-size: 16px; font-weight: 500; letter-spacing: .02em; color: var(--taupe); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .room-picker-bar .rpb-v { flex: none; font-size: 18px; line-height: 1.3; }
}
@media (max-width: 760px) { [data-m-center] { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } }
@media (max-width: 1080px) {
  [data-m-badge] { display: block !important; width: 100%; text-align: center !important; box-sizing: border-box; text-wrap: balance; }
}

/* ---------- mobile Meals: four stages in one row ---------- */
@media (max-width: 760px) {
  [data-m-weeks4] { grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 8px !important; }
  [data-m-weeks4] > div { padding: 16px 8px 18px !important; border-radius: 18px !important; text-align: center; display: flex; flex-direction: column; align-items: center; }
  [data-m-weeks4] > div > div:first-child { font-size: 11.5px !important; letter-spacing: .08em !important; white-space: nowrap; }
  [data-m-weeks4] > div > div:nth-child(2) { margin: 8px 0 6px !important; font-size: 32px !important; line-height: 1.1; }
  [data-m-weeks4] > div > p { font-size: 13.5px !important; line-height: 1.45 !important; overflow-wrap: anywhere; hyphens: auto; text-wrap: balance; }
}

/* language-specific images */
.en-only { display: none !important; }
html.lang-en .en-only { display: block !important; }
html.lang-en .zh-only { display: none !important; }

/* meals stages: cards on desktop, illustrated wheel on mobile */
[data-mobile-only] { display: none !important; }
@media (max-width: 760px) {
  [data-mobile-only] { display: block !important; }
  [data-desk-only] { display: none !important; }
}
@media (max-width: 760px) {
  [data-m-foot-tag] { font-size: clamp(11px, 3.2vw, 14px) !important; letter-spacing: .12em !important; white-space: nowrap; }
}
@media (max-width: 360px) { [data-m-foot-tag] { letter-spacing: .08em !important; } }