:root{color-scheme:light;--ink:#122e4b;--soft:#e8f4ff;--primary:#2563eb;--sky:#38bdf8;--line:#c9dced;--paper:#f3f9ff}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 'DM Sans',system-ui,sans-serif}header,main,footer{max-width:1130px;margin:auto;padding:20px clamp(18px,4vw,54px)}header,footer,.row{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}header strong{font-size:1.25rem}button,input,select,textarea{font:inherit}button{border:1px solid var(--primary);border-radius:30px;background:var(--primary);color:white;padding:10px 20px;cursor:pointer;font-weight:650}button.secondary{background:transparent;color:var(--primary)}:focus-visible{outline:3px solid #164d93;outline-offset:3px}.hero{display:grid;grid-template-columns:1.05fr .95fr;background:#e5f2fd;border-radius:28px;overflow:hidden}.hero section{padding:clamp(25px,6vw,76px)}h1,h2{font-family:'Instrument Serif',Georgia,serif;font-weight:400;line-height:1.04;margin:0 0 16px}h1{font-size:clamp(2.8rem,6vw,5.4rem);letter-spacing:-.04em}h2{font-size:clamp(2rem,4vw,3rem)}.art{min-height:230px;background:radial-gradient(ellipse at 65% 23%,#d1ebff 0 15%,transparent 16%),radial-gradient(ellipse at 100% 80%,#a8d8f8 0 45%,transparent 46%),radial-gradient(ellipse at 45% 100%,#78b7e5 0 50%,transparent 51%),#275e8f;background-position:center;background-size:cover}.demo{background:var(--soft);padding:8px 15px;border-radius:10px}.section{margin-top:44px}.cards,.fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}.card{border:1px solid var(--line);border-radius:18px;padding:21px}.card h3{margin:0}.price{font:2rem Georgia,serif;margin:6px 0}label{display:grid;gap:5px;margin:8px 0;font-weight:600}input,select,textarea{max-width:100%;width:100%;border:1px solid #6788ab;background:white;border-radius:9px;padding:8px;color:var(--ink)}dialog{border:1px solid var(--line);border-radius:19px;width:min(670px,calc(100% - 26px));max-height:90vh;padding:24px;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#0b2444b0}[hidden]{display:none!important}.error{color:#8b281a}.status{min-height:1.55em}details{padding:10px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer}footer{border-top:1px solid var(--line);margin-top:35px}@media(max-width:630px){.hero,.cards,.fields{grid-template-columns:1fr}.art{min-height:175px}dialog{padding:16px}}

nav{display:flex;gap:14px;flex-wrap:wrap}a{color:var(--primary);text-underline-offset:3px}.button-link{display:inline-block;background:var(--primary);color:white;border-radius:24px;padding:8px 16px;text-decoration:none}.stack{display:grid;gap:18px}.panel{border:1px solid var(--line);border-radius:18px;padding:20px}.panel h2{font-size:2rem}input[type=checkbox]{width:auto}label.check{display:inline-flex;margin-right:14px;align-items:center;gap:5px}.narrow{max-width:560px}.scope{background:var(--soft);padding:14px;border-radius:12px}.art img{width:100%;height:100%;object-fit:cover}.art{overflow:hidden}.small{font-size:.91rem}.notice{background:#e5f2fd;padding:12px;border-radius:10px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}fieldset{border:0;margin:0;padding:0;min-width:0}legend{font-weight:700}img{max-width:100%}

.notice{padding:14px 18px;border:1px solid #83adcf;border-left:5px solid var(--primary);border-radius:10px;background:#eef7ff;font-weight:600}pre{white-space:pre-wrap;overflow-wrap:anywhere}

/* Public landing variants share the same visual system. */
.relax-landing {
  --ink: #122e4b;
  --line: #c9dced;
  --paper: #f3f9ff;
  background: radial-gradient(ellipse at top right, #d7f1ff, transparent 52rem), var(--paper);
}
.relax-landing :focus-visible { outline-color: #164d93 }
.relax-landing header, .relax-landing main, .relax-landing footer { max-width: 1300px }
.relax-landing header { padding-block: 16px }
.relax-landing header strong a { text-decoration: none; color: #163759 }
.relax-landing header nav { gap: clamp(10px, 2vw, 26px) }
.relax-landing header nav a { font-weight: 600 }
.relax-landing .landing-notice { margin: 0 0 14px; background: #fff3d7; border-color: #bf924d; color: #623c0a }
.relax-landing .landing-hero { background: #102d52; color: #fff; min-height: 470px }
.relax-landing .hero-copy { padding: clamp(24px, 4.5vw, 66px); align-self: center }
.relax-landing .hero-copy h1 { font-size: clamp(2.65rem, 5.6vw, 5.4rem); max-width: 11ch }
.relax-landing .hero-intro { color: #e5f3ff; max-width: 43ch }
.relax-landing .hero-prices { font-weight: 650; color: #e5f3ff }
.relax-landing .context { color: var(--sky) }
.relax-landing .art { background: #234e78 }
.relax-landing .art img { display: block; height: 100% }
.relax-landing .button-link {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  padding: 10px 18px; border-radius: 10px; font-weight: 700;
}
.relax-landing .landing-hero .button-link { background: var(--sky); color: #123454 }
.relax-landing .landing-panel {
  margin-top: clamp(18px, 3vw, 32px); padding: clamp(16px, 3vw, 32px);
  background: #fff; border: 1px solid var(--line); border-radius: 20px;
}
.relax-landing .landing-panel > .button-link { margin-top: 16px }
.relax-landing .session-card { background: #eff8ff; border-left: 5px solid var(--sky) }
.relax-landing .session-long { background: #edf3ff; border-left-color: var(--primary) }
.relax-landing .story img {
  display: block; width: 100%; height: auto; object-fit: cover; border-radius: 10px;
}
.relax-landing .session-card .price { color: #174b78 }
.relax-landing .session-card p:empty { display: none }
.relax-landing .section-note { color: #3d566f }
.relax-landing .story-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px }
.relax-landing .story { padding: 10px; background: #f1f7fe; border-top: 3px solid var(--sky) }
.relax-landing .story:nth-child(2n) { border-top-color: var(--primary) }
.relax-landing .story img { aspect-ratio: 1.55; margin-bottom: 10px }
.relax-landing .story h3 { line-height: 1.2; font-size: 1rem }
.relax-landing .story p { font-size: .94rem; margin-bottom: 0 }
.relax-landing .landing-contact { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap }
.relax-landing .landing-contact a { overflow-wrap: anywhere }
.relax-landing .mobile-booking { display: none }
@media (max-width: 920px) {
  .relax-landing .story-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)) }
}
@media (max-width: 680px) {
  .relax-landing .landing-hero { grid-template-columns: 1fr }
  .relax-landing .landing-hero { min-height: 0 }
  .relax-landing .art { min-height: 0 }
  .relax-landing .art img { height: auto; aspect-ratio: 1.7 }
  .relax-landing footer { padding-bottom: calc(88px + env(safe-area-inset-bottom)) }
  html:has(.relax-landing) { scroll-padding-bottom: 80px }
  .relax-landing .mobile-booking {
    position: fixed; inset: auto 0 0; z-index: 1; display: flex; justify-content: center; padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
    background: #e9f5ff; border: 1px solid var(--line); border-radius: 12px 12px 0 0;
  }
  .relax-landing .mobile-booking a { width: min(100%, 460px) }
  .relax-landing :focus-visible { scroll-margin-block: 12px 80px }
}

.relax-landing .technique-grid, .relax-landing .visit-grid {
  display: grid;
  gap: 14px;
}
.relax-landing .technique-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)) }
.relax-landing .visit-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) }
.relax-landing .technique { padding: 14px; background: #f2f8ff; border-top: 4px solid var(--sky) }
.relax-landing .technique:nth-child(3n + 2) { border-top-color: var(--primary) }
.relax-landing .technique:nth-child(3n + 3) { border-top-color: var(--sky) }
.relax-landing .technique-photos { display: grid; grid-template-columns: 1.6fr 1fr; gap: 5px; margin-bottom: 12px }
.relax-landing .technique-photos img, .relax-landing .visit-grid img {
  width: 100%; height: auto; display: block; object-fit: cover; border-radius: 8px;
}
.relax-landing .technique-photos img { aspect-ratio: 1.25; }
.relax-landing .technique-photos img + img { height: 100%; min-height: 0 }
.relax-landing .visit-grid img { aspect-ratio: 2.2 }
.relax-landing #coverage nav { margin-bottom: 12px }

/* Booking and workspace views use the landing page palette and photography. */
.relax-interior {
  --ink: #122e4b;
  --line: #c9dced;
  --paper: #f3f9ff;
  --soft: #e8f4ff;
  background: radial-gradient(ellipse at top right, #d7f1ff, transparent 52rem), var(--paper);
  overflow-wrap: anywhere;
}
.relax-interior header, .relax-interior main, .relax-interior footer { max-width: 1300px }
.relax-interior header { padding-block: 16px }
.relax-interior header strong a { color: #163759; text-decoration: none }
.relax-interior header nav { align-items: center; gap: 12px }
.relax-interior header nav form { margin: 0 }
.relax-interior main { padding-top: 10px }
.relax-interior h1 {
  padding: clamp(22px, 4vw, 48px);
  border-radius: 20px;
  color: #fff;
  background: #102d52;
  font-size: clamp(2.15rem, 4.6vw, 4.35rem);
}
.interior-booking h1, .interior-receipt h1, .interior-access h1 {
  background: linear-gradient(90deg, #102d52 27%, #102d52eb 50%, #102d52b3),
    #102d52 url('/landing-media/scene-03.webp') right 45% / cover no-repeat;
}
.interior-receipt h1 {
  background-image: linear-gradient(90deg, #102d52 27%, #102d52eb 50%, #102d52b3),
    url('/landing-media/scene-14.webp');
}
.relax-interior .panel, .relax-interior .card, .interior-access main > section {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: clamp(16px, 3vw, 26px);
}
.relax-interior .section { margin-top: 18px }
.relax-interior .panel h2, .relax-interior .card h2 { font-size: clamp(1.5rem, 3vw, 2rem) }
.relax-interior .notice { background: #fff3d7; border-color: #bf924d; color: #623c0a }
.relax-interior .error:empty { display: none }
.relax-interior [role="alert"]:not(:empty) { color: #8b281a }
.relax-interior button, .relax-interior .button-link {
  min-height: 44px; border-radius: 10px; font-weight: 700;
}
.relax-interior input:not([type="checkbox"]):not([type="hidden"]),
.relax-interior select { min-height: 44px; min-width: 0 }
.relax-interior .scope, .relax-interior .booking-summary { border-left: 5px solid var(--sky) }
.relax-interior .booking-summary p { margin: 4px 0 9px }
.relax-interior .fields > * { min-width: 0 }
.relax-interior .check { align-items: baseline }
.relax-interior .check input { flex: none; accent-color: var(--primary) }
.interior-booking .availability-form {
  display: grid; grid-template-columns: 1.25fr 1fr auto; gap: 12px; align-items: end;
}
.interior-booking .availability-form label { margin: 0 }
.interior-booking form p, .interior-receipt main > form { margin-block: 12px }
.interior-receipt main, .interior-policy main { max-width: 940px }
.interior-policy .policy-copy { line-height: 1.7 }
.interior-access main > .narrow { margin-inline: auto }
.interior-access main > .narrow form button { margin-top: 10px }
.interior-calendar .card { border-left: 5px solid var(--primary) }
.interior-calendar .card form { margin-top: 10px }
.interior-calendar .appointment-status { display: flex; flex-wrap: wrap; gap: 8px }
.interior-calendar .state {
  padding: 5px 10px; border-radius: 7px; background: #e8f0fa; color: #23466a; font-weight: 650;
}
.interior-calendar :is(.state-confirmed, .state-paid) { background: #dcedff; color: #174e79 }
.interior-calendar :is(.state-held, .state-needs_review, .state-pending) { background: #fff3d7; color: #623c0a }
.interior-calendar :is(.state-expired, .state-cancelled, .state-failed) { background: #fae8e4; color: #772e22 }
@media (max-width: 680px) {
  .interior-booking .availability-form, .relax-interior .fields { grid-template-columns: 1fr }
  .interior-booking .availability-form button { justify-self: start }
  .relax-interior h1 { background-position: 60% center }
}

.relax-landing .landing-hero :focus-visible { outline-color: var(--sky) }