/* Rainbow Holistics, shared styles. Palette sampled from Nicky's logo:
   the page reads the rainbow from the outside in and ends at the heart. */

@font-face{font-family:'Corben';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/corben-normal-400.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:normal;font-weight:200 1000;font-display:swap;src:url(../fonts/nunito-sans-normal.woff2) format('woff2')}
@font-face{font-family:'Nunito Sans';font-style:italic;font-weight:200 1000;font-display:swap;src:url(../fonts/nunito-sans-italic.woff2) format('woff2')}

:root{
  --sg:#a0b5a2;   --sgp:#e4ebe0;
  --moss:#1e2a23; --moss2:#3c4a41;
  --rose:#db9097; --rose-t:#f3dcdb;
  --duck:#a1cacc; --duck-t:#dbecec;
  --butter:#e2b675; --butter-t:#f5e6ca;
  --peach:#cfa187; --peach-t:#f0dfd4;
  --heart:#8c4936; --heart-d:#6f3829;
  --fd:'Corben', 'Iowan Old Style', Georgia, serif;
  --ff:'Nunito Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --r:14px;
  --gut:clamp(16px, 5vw, 72px);
  --shell:1320px;
  --topH:84px;
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--sgp);color:var(--moss);font-family:var(--ff);font-size:1.125rem;font-weight:430;line-height:1.6;overflow-x:clip;
  font-variant-ligatures:no-common-ligatures} /* corben's c_k ligature curls the k, reads like a typo */
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--fd);font-weight:400;margin:0;text-wrap:balance}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
:focus-visible{outline:3px solid var(--moss);outline-offset:3px;border-radius:4px}
[hidden]{display:none !important}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--moss);color:var(--sgp);padding:10px 16px;border-radius:999px;text-decoration:none}
.skip:focus{top:12px}

.w{width:min(100% - 2*var(--gut), var(--shell));margin-inline:auto}

/* buttons. one filled action per screen, everything else is a text link */
.cta-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  min-height:52px;padding:.8em 1.6em;border-radius:999px;
  background:var(--moss);color:var(--sgp);
  font:700 1.05rem/1 var(--ff);letter-spacing:.01em;text-decoration:none;
  border:0;cursor:pointer;
  transition:transform .35s var(--ease), background-color .25s;
}
.cta-btn:hover{background:#2c3b32;transform:translateY(-2px)}
.cta-btn:active{transform:none}
.cta-sm{min-height:44px;padding:.65em 1.25em;font-size:.98rem}
.cta-pale{background:var(--sgp);color:var(--heart-d)}
.cta-pale:hover{background:#fff}

.txt-link{
  display:inline-flex;align-items:center;gap:.45em;min-height:44px;
  font-weight:700;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;
}
.txt-link::after{content:"";width:.5em;height:.5em;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg) translate(-1px,1px)}
.txt-link:hover{text-decoration-thickness:2px}

/* header */
.rh-top{position:sticky;top:0;z-index:70;background:var(--sg);transition:background-color .3s, box-shadow .3s}
.rh-top[data-past="1"]{background:var(--sgp);box-shadow:0 1px 0 rgba(30,42,35,.16)}
.top-row{display:flex;align-items:center;gap:28px;min-height:var(--topH)}
.rh-brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none;min-height:44px}
.rh-brand .b-rain{width:62px}
.rh-brand .b-word{width:128px}
.top-nav{margin-left:auto}
.top-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:6px}
.top-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;text-decoration:none;font-weight:600;font-size:1.02rem;border-radius:999px}
.top-nav a:hover{text-decoration:underline;text-underline-offset:.35em}
.top-nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.35em}
.top-book{background:transparent;color:var(--moss);box-shadow:inset 0 0 0 1.5px currentColor}
.top-book:hover{background:var(--moss);color:var(--sgp)}
.burger{display:none}

/* hero: the logo's rainbow, scaled up into a window onto the room */
.retreat-hero{background:var(--sg);padding-top:clamp(24px, 4vw, 56px);overflow:clip}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,5vw,88px);align-items:end}
.hero-copy{padding-bottom:clamp(56px, 9vw, 132px);align-self:center}
.hero-copy h1{font-size:clamp(2.9rem, 1.4rem + 4.7vw, 6rem);line-height:1.02;letter-spacing:-.015em;max-width:11ch}
.hero-lede{margin-top:clamp(18px,2vw,28px);font-size:clamp(1.13rem, 1rem + .45vw, 1.35rem);line-height:1.5;max-width:36ch}
.hero-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:clamp(26px,3vw,40px)}
.hero-tel{font-weight:700;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.hero-tel span{text-decoration:underline;text-underline-offset:.3em;text-decoration-thickness:1px}

.arch-win{
  container-type:inline-size;
  position:relative;margin:0;width:min(100%, 600px);justify-self:end;
  aspect-ratio:4/5;overflow:clip;
  --b:3.1cqi; --g:1.5cqi;
}
.arch-win .arc{
  position:absolute;inset:var(--i) var(--i) 0 var(--i);
  border:var(--b) solid var(--c);border-bottom:0;border-radius:999px 999px 0 0;
  animation:archUp 1.25s var(--ease) var(--d) both;
}
.arc.a1{--i:0px;--c:var(--rose);--d:.42s}
.arc.a2{--i:calc(var(--b) + var(--g));--c:var(--duck);--d:.32s}
.arc.a3{--i:calc(2*(var(--b) + var(--g)));--c:var(--butter);--d:.22s}
.arc.a4{--i:calc(3*(var(--b) + var(--g)));--c:var(--peach);--d:.12s}
.arch-pic{
  position:absolute;inset:calc(4*(var(--b) + var(--g))) calc(4*(var(--b) + var(--g))) 0;
  border-radius:999px 999px 0 0;overflow:hidden;background:var(--peach-t);
  animation:archUp 1.25s var(--ease) 0s both;
}
.arch-pic img{width:100%;height:100%;object-fit:cover;object-position:42% 58%}
/* the hidden state lives in the keyframe, so a skipped animation still shows the arch */
@keyframes archUp{from{transform:translateY(102%)}to{transform:none}}

/* hello from Nicky */
.nicky-hello{background:var(--rose-t);padding-block:clamp(72px, 9vw, 140px)}
.hello-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,104px);align-items:center}
.hello-pic{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;max-width:440px}
.hello-pic img{width:100%;height:100%;object-fit:cover}
.hello-copy h2{font-size:clamp(2.1rem, 1.3rem + 2.6vw, 3.6rem);line-height:1.06;margin-bottom:.55em}
.hello-copy p{max-width:44ch;font-size:clamp(1.13rem, 1.05rem + .3vw, 1.3rem)}
.hello-sign{font-family:var(--fd);font-size:1.9rem;line-height:1;margin-top:.8em !important}
.hello-trust{margin-top:22px !important;padding-top:16px;border-top:1px solid rgba(30,42,35,.2);font-size:1.0625rem !important;color:var(--moss2);max-width:none !important}

/* treatments, set like her printed menu */
.treat-menu{background:var(--duck-t);padding-block:clamp(72px, 9vw, 140px)}
.treat-menu h2{font-size:clamp(2.1rem, 1.3rem + 2.6vw, 3.6rem);line-height:1.06;max-width:18ch;margin-bottom:clamp(32px,4vw,56px)}
.menu-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(32px,5vw,80px)}
.menu-list li{border-top:1px solid rgba(30,42,35,.22)}
.menu-list a{
  display:grid;grid-template-columns:1fr auto;gap:2px 20px;align-items:baseline;
  padding:22px 0 24px;text-decoration:none;min-height:100%;
}
.mi-name{font-family:var(--fd);font-size:clamp(1.35rem, 1.15rem + .6vw, 1.7rem);line-height:1.2}
.mi-price{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.mi-note{grid-column:1 / -1;color:var(--moss2);font-size:1.0625rem;line-height:1.5;max-width:46ch}
.menu-list a:hover .mi-name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.menu-foot{margin-top:clamp(28px,3vw,40px);padding-top:24px;border-top:1px solid rgba(30,42,35,.22);display:flex;flex-wrap:wrap;gap:16px 48px;align-items:center;justify-content:space-between}
.menu-foot p{max-width:62ch;color:var(--moss2);font-size:1.0625rem;margin:0}

/* three photos of the room, full bleed */
.retreat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:var(--sgp)}
.retreat-strip figure{margin:0;aspect-ratio:4/5;overflow:hidden;background:var(--peach-t)}
.retreat-strip img{width:100%;height:100%;object-fit:cover}

/* treats + out and about */
.pamper-band{background:var(--butter-t);padding-block:clamp(72px, 9vw, 140px)}
.pamper-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(48px,7vw,120px)}
.pamper-band h2{font-size:clamp(1.8rem, 1.3rem + 1.6vw, 2.7rem);line-height:1.08;margin-bottom:.7em;max-width:16ch}
.offer-list{margin:0 0 20px;padding:0}
.offer-list div{display:grid;grid-template-columns:1fr auto;gap:4px 24px;align-items:baseline;padding:18px 0;border-top:1px solid rgba(30,42,35,.22)}
.offer-list div:last-child{border-bottom:1px solid rgba(30,42,35,.22)}
.offer-list dt{font-family:var(--fd);font-size:1.3rem;line-height:1.3}
.offer-list dd{margin:0;font-weight:700;text-align:right}
.pamper-band .fine{font-size:1.0625rem;color:var(--moss2)}
.about-out p{max-width:40ch}
.out-list{list-style:none;margin:0 0 24px;padding:0}
.out-list li{padding:18px 0;border-top:1px solid rgba(30,42,35,.22);display:grid;gap:2px}
.out-list li:last-child{border-bottom:1px solid rgba(30,42,35,.22)}
.out-list strong{font-family:var(--fd);font-weight:400;font-size:1.3rem;line-height:1.3}
.out-list span{color:var(--moss2);font-size:1.0625rem}

/* kind words */
.kind-words{background:var(--peach-t);padding-block:clamp(72px, 9vw, 140px)}
.kind-words h2{font-size:clamp(2.1rem, 1.3rem + 2.6vw, 3.6rem);line-height:1.06;margin-bottom:clamp(32px,4vw,56px)}
.kw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px,4vw,64px);align-items:start}
.kw{margin:0;padding-top:22px;border-top:1px solid rgba(30,42,35,.22)}
.kw blockquote{margin:0 0 18px;font-size:1.08rem;line-height:1.65}
.kw blockquote p{white-space:pre-line}
.kw figcaption{font-weight:700}
.kw figcaption span{display:block;font-weight:400;color:var(--moss2);font-size:.95rem}
.kw-more{margin-top:clamp(32px,4vw,48px)}

/* the heart of it */
.heart-band{background:var(--heart);color:var(--sgp);padding-block:clamp(88px, 11vw, 168px);text-align:center}
.heart-band h2{font-size:clamp(2.2rem, 1.2rem + 3.4vw, 4.4rem);line-height:1.1;max-width:20ch;margin-inline:auto}
.heart-sign{font-family:var(--fd);font-size:1.8rem;margin-top:.7em}
.heart-act{margin-top:clamp(28px,3vw,40px)}
.heart-tel{margin:18px auto 0;font-size:1.08rem;max-width:60ch}
.heart-tel a{font-weight:700;text-underline-offset:.3em}
.heart-band :focus-visible{outline-color:var(--sgp)}

/* footer */
.rh-foot{background:var(--moss);color:#d9e2d6;padding-block:clamp(64px,7vw,96px) 32px;font-size:1.0625rem}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.1fr) repeat(3,minmax(0,1fr)) minmax(0,.9fr);gap:40px 32px;align-items:start}
.foot-brand img{width:150px}
.rh-foot h3{font-family:var(--ff);font-weight:700;font-size:1.0625rem;color:#fff;margin-bottom:.6em}
.rh-foot p{margin:0 0 .7em}
.rh-foot a{color:#fff;text-underline-offset:.25em}
.foot-nav{display:grid;gap:2px}
.foot-nav a{display:inline-flex;align-items:center;min-height:36px;text-decoration:none}
.foot-nav a:hover{text-decoration:underline}
.foot-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px;margin-top:56px;padding-top:24px;border-top:1px solid rgba(228,235,224,.18);color:#aebcaf;font-size:.95rem}
.foot-base p{margin:0}
.rh-foot :focus-visible{outline-color:#fff}

/* phones and tablets */
@media (max-width:1100px){
  .top-nav a{padding:0 9px}
  .foot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot-brand{grid-column:1 / -1}
}
@media (max-width:900px){
  :root{--topH:70px}
  .top-nav,.top-book{display:none}
  .rh-brand .b-rain{width:52px}
  .rh-brand .b-word{width:112px}
  .burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;margin-left:auto;width:48px;height:48px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:var(--moss);cursor:pointer}
  .burger span:not(.sr){display:block;height:2px;background:currentColor;border-radius:999px;transition:transform .3s var(--ease), opacity .2s}
  .rh-top.menu-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .rh-top.menu-open .burger span:nth-child(2){opacity:0}
  .rh-top.menu-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .mob-menu{position:fixed;inset:var(--topH) 0 0;background:var(--sgp);padding:24px var(--gut) 40px;overflow-y:auto;opacity:0;transform:translateY(-8px);transition:opacity .25s, transform .3s var(--ease);visibility:hidden}
  .rh-top.menu-open .mob-menu{opacity:1;transform:none;visibility:visible}
  .mob-menu ul{list-style:none;margin:0 0 28px;padding:0}
  .mob-menu li{border-bottom:1px solid rgba(30,42,35,.15)}
  .mob-menu a.m-link{display:flex;align-items:center;min-height:60px;font-family:var(--fd);font-size:1.7rem;text-decoration:none}
  .mob-menu .cta-btn{width:100%}
  .mob-menu .m-tel{display:block;text-align:center;margin-top:16px;font-weight:700;min-height:44px;line-height:44px}

  .hero-grid{grid-template-columns:1fr;gap:0}
  .arch-win{order:-1;justify-self:center;width:min(74%, 440px)}
  .hero-copy{padding:28px 0 56px;text-align:left}
  .hero-copy h1{max-width:12ch}

  .hello-grid{grid-template-columns:1fr}
  .hello-pic{max-width:340px;width:78%}
  .menu-list{grid-template-columns:1fr}
  .pamper-grid{grid-template-columns:1fr}
  .kw-grid{grid-template-columns:1fr}
  .kw-grid .kw:nth-child(n+3){display:none}

  .retreat-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:4px;scrollbar-width:none}
  .retreat-strip::-webkit-scrollbar{display:none}
  .retreat-strip figure{flex:0 0 78%;scroll-snap-align:start}
}
@media (min-width:901px){ .mob-menu{display:none} }
@media (max-width:560px){
  body{font-size:1.0625rem}
  .foot-grid{grid-template-columns:1fr 1fr}
  .menu-foot{display:block}
  .menu-foot .txt-link{margin-top:12px}
  .offer-list div{grid-template-columns:1fr}
  .offer-list dd{text-align:left}
}
@media (max-width:430px){ .foot-grid{grid-template-columns:1fr} }
@media (max-width:375px){
  :root{--gut:16px}
  .hero-copy h1{font-size:2.6rem}
}

@media (prefers-reduced-motion:reduce){
  .arch-win .arc,.arch-pic{animation:none}
  .cta-btn,.burger span,.mob-menu{transition:none}
  .cta-btn:hover{transform:none}
}
@media print{ .rh-top,.retreat-strip,.wa-tap,.wa-peek{display:none} body{background:#fff} }

/* whatsapp tab (shared snippet): off while the phone menu is open, and held back
   until the hero has gone so "Book a treatment" is the only action up there */
body:has(.rh-top.menu-open) .wa-tap,body:has(.rh-top.menu-open) .wa-peek{opacity:0 !important;visibility:hidden;pointer-events:none}
body:has(.rh-top[data-past="0"]) .wa-tap,body:has(.rh-top[data-past="0"]) .wa-peek{opacity:0 !important;pointer-events:none}

/* inner pages: same sage ground and rainbow window as home, smaller, copy first */
.page-hero{background:var(--sg);padding-top:clamp(28px,4.5vw,64px);overflow:clip}
.page-hero .hero-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
.page-hero h1{font-size:clamp(2.7rem, 1.5rem + 3.6vw, 4.8rem);line-height:1.04;letter-spacing:-.012em;max-width:14ch}
.page-hero .hero-copy{padding-bottom:clamp(48px,7vw,104px)}
.page-hero .hero-lede{max-width:40ch}
.page-hero .arch-win{width:min(100%, 420px)}

.band{padding-block:clamp(64px, 8vw, 128px)}
.band h2{font-size:clamp(2rem, 1.3rem + 2.3vw, 3.3rem);line-height:1.07;margin-bottom:.6em;max-width:20ch}
.b-rose{background:var(--rose-t)} .b-duck{background:var(--duck-t)}
.b-butter{background:var(--butter-t)} .b-peach{background:var(--peach-t)}

/* her safety notice, set large because it is the voice of the place */
.mama-note{font-size:clamp(1.13rem, 1rem + .45vw, 1.35rem);line-height:1.55;max-width:46ch}
.mama-note p{margin-bottom:.8em}

.care-list{list-style:none;margin:0 0 28px;padding:0;columns:2;column-gap:clamp(32px,5vw,80px)}
.care-list li{break-inside:avoid;padding:14px 0;border-top:1px solid rgba(30,42,35,.22)}
.care-note{max-width:60ch;color:var(--moss2)}
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,104px)}
.two-up h2{font-size:clamp(1.8rem, 1.3rem + 1.6vw, 2.7rem)}
.two-up .care-list{columns:1}

.policy-rows{margin:0 0 24px;padding:0;max-width:880px}
.policy-rows div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:6px 40px;padding:20px 0;border-top:1px solid rgba(30,42,35,.22)}
.policy-rows div:last-child{border-bottom:1px solid rgba(30,42,35,.22)}
.policy-rows dt{font-family:var(--fd);font-size:1.3rem;line-height:1.3}
.policy-rows dd{margin:0}
.policy-intro{max-width:52ch;font-size:clamp(1.13rem, 1.05rem + .3vw, 1.3rem)}
.fine{font-size:1.0625rem;color:var(--moss2)}
[id]{scroll-margin-top:calc(var(--topH) + 16px)}

@media (max-width:900px){
  .page-hero .hero-grid{grid-template-columns:1fr}
  .page-hero .arch-win{order:-1;justify-self:center;width:min(62%, 280px)}
  .page-hero .hero-copy{padding:24px 0 48px}
  .care-list{columns:1}
  .two-up{grid-template-columns:1fr}
  .policy-rows div{grid-template-columns:1fr}
}

/* treatments page: one ground for the whole menu so it reads as one printed list */
.jump{display:flex;flex-wrap:wrap;gap:4px 6px;padding:18px 0 0;margin-bottom:clamp(40px,5vw,72px);border-top:1px solid rgba(30,42,35,.22)}
.jump a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;font-weight:700;text-decoration:none;background:rgba(255,255,255,.55)}
.jump a:hover{background:#fff}
.menu-page{background:var(--duck-t);padding-block:clamp(48px,6vw,96px) clamp(64px,8vw,120px)}
.cat{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:24px clamp(32px,6vw,104px);padding:clamp(40px,5vw,64px) 0;border-top:1px solid rgba(30,42,35,.22)}
.cat:first-of-type{border-top:0;padding-top:0}
.cat-head h2{font-size:clamp(2rem, 1.3rem + 2.3vw, 3.3rem);line-height:1.06;margin-bottom:.45em}
.cat-head p{color:var(--moss2);max-width:34ch}
.cat-pic{margin:24px 0 0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;max-width:340px}
.cat-pic img{width:100%;height:100%;object-fit:cover}
@media (min-width:901px){ .cat-head{position:sticky;top:calc(var(--topH) + 24px);align-self:start} }
.t-item{padding:0 0 26px;margin-bottom:26px;border-bottom:1px solid rgba(30,42,35,.14)}
.t-item:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.t-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 20px;margin-bottom:8px}
.t-top h3{font-size:clamp(1.35rem, 1.15rem + .6vw, 1.7rem);line-height:1.2}
.t-meta{margin:0;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.t-meta span{font-weight:430;color:var(--moss2)}
.t-item p{max-width:62ch}

/* about: her letter, one ground, one reading column */
.letter{background:var(--rose-t);padding-block:clamp(64px,8vw,128px)}
.letter-col{max-width:680px}
.letter-col p{font-size:clamp(1.13rem, 1.05rem + .3vw, 1.3rem);line-height:1.7}
.letter-col h2{font-size:clamp(1.8rem, 1.3rem + 1.6vw, 2.6rem);line-height:1.1;margin:1.6em 0 .55em}
.letter-big{font-family:var(--fd);font-size:clamp(1.8rem, 1.3rem + 1.6vw, 2.7rem) !important;line-height:1.2 !important;margin:.2em 0 .7em}
.letter-sign{font-family:var(--fd);font-size:2rem;margin-top:1.2em}
.quals{list-style:none;margin:0;padding:0;columns:2;column-gap:clamp(32px,5vw,80px);max-width:1000px}
.quals li{break-inside:avoid;padding:16px 0;border-top:1px solid rgba(30,42,35,.22);display:grid;gap:2px}
.quals strong{font-family:var(--fd);font-weight:400;font-size:1.3rem;line-height:1.3}
.quals span{color:var(--moss2);font-size:1.0625rem}

/* reviews page */

/* contact */
.contact-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(40px,6vw,104px);align-items:start}
.side-info{display:grid;gap:0}
.side-info div{padding:18px 0;border-top:1px solid rgba(30,42,35,.22)}
.side-info h3{font-family:var(--ff);font-weight:800;font-size:1.0625rem;margin-bottom:4px}
.side-info p{margin:0}
.enq{display:grid;gap:18px}
.enq-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.enq label{display:block;font-weight:700;margin-bottom:6px}
.enq label span{font-weight:430;color:var(--moss2)}
.enq input,.enq select,.enq textarea{
  width:100%;min-height:52px;padding:12px 14px;border:1px solid #6b756f;border-radius:10px;
  background:#fff;color:var(--moss);font:inherit;font-size:1.05rem;
}
.enq textarea{min-height:150px;resize:vertical}
.enq ::placeholder{color:#5d6a62;opacity:1}
.enq select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--moss) 50%),linear-gradient(135deg,var(--moss) 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}
.enq input:focus-visible,.enq select:focus-visible,.enq textarea:focus-visible{outline:3px solid var(--moss);outline-offset:1px;border-color:var(--moss)}
.enq [aria-invalid="true"]{border-color:#8a2a1e;box-shadow:inset 0 0 0 1px #8a2a1e}
.enq-err{margin:6px 0 0;min-height:0;color:#8a2a1e;font-weight:700;font-size:1.0625rem}
.enq-err:empty{display:none}
.enq-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.enq-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.enq-foot p{margin:0;font-size:1.0625rem;color:var(--moss2);max-width:44ch}
.enq button[data-busy]{opacity:.7;pointer-events:none}
.enq-say{margin:0;font-weight:700}
.enq-say[data-state="bad"]{color:#8a2a1e;background:#fff;border:1px solid #8a2a1e;border-radius:10px;padding:12px 14px}

/* privacy, 404, thanks: no window, just the words */
.page-hero.plain .hero-grid{grid-template-columns:1fr}
.page-hero.plain .hero-copy{padding-bottom:clamp(40px,6vw,88px)}
.prose{max-width:680px}
.prose h2{font-size:clamp(1.35rem, 1.15rem + .6vw, 1.7rem);margin:1.6em 0 .5em}
.prose h2:first-child{margin-top:0}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.4em}

@media (max-width:900px){
  .cat{grid-template-columns:1fr}
  .cat-pic{max-width:260px}
  .quals{columns:1}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:560px){ .enq-pair{grid-template-columns:1fr} .t-top{display:block} .t-meta{margin-top:4px} }

/* the 2 hour pamper drawn to scale: each bar is as wide as its minutes, in the badge's colours */
.pause-top{margin-bottom:clamp(36px,4vw,56px)}
.pause-top h2{max-width:none;margin-bottom:.45em}
.pause-top .policy-intro{max-width:56ch;margin-bottom:20px}
.pause-top .offer-list{margin:0;max-width:560px}
.pause-plan{margin:0 0 28px}
.pause-plan ol{list-style:none;margin:0;padding:0;display:flex;gap:6px}
.pause-plan li{flex:var(--m) 1 0%;min-width:0;display:grid;gap:2px;align-content:start}
.pause-plan li::before{content:"";height:14px;border-radius:999px;background:var(--rose);margin-bottom:16px}
.pause-plan li:nth-child(2)::before{background:var(--duck)}
.pause-plan li:nth-child(3)::before{background:var(--butter)}
.pause-plan li:nth-child(4)::before{background:var(--peach)}
.pause-plan li:nth-child(5)::before{background:var(--heart)}
.pause-plan strong{font-family:var(--fd);font-weight:400;font-size:1.3rem;line-height:1.3}
.pause-plan span{color:var(--moss2);font-size:1.0625rem;padding-right:8px}
.pause-more{margin-top:8px;max-width:62ch}
.pause-more a{font-weight:700;text-underline-offset:.25em}

/* about letter: her rainbow, tiled faintly behind the words */
.letter{position:relative;isolation:isolate}
.letter::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url(../img/rh-pattern.webp) 0 0 / 320px 260px repeat;opacity:.09}
@media (min-width:901px){
  .letter::before{-webkit-mask-image:linear-gradient(90deg,var(--moss) calc(50% - 470px),transparent calc(50% - 380px),transparent calc(50% + 380px),var(--moss) calc(50% + 470px));mask-image:linear-gradient(90deg,var(--moss) calc(50% - 470px),transparent calc(50% - 380px),transparent calc(50% + 380px),var(--moss) calc(50% + 470px))}
}

/* reviews: one featured, then a wall; long ones open in place (no JS needed) */
.kw-pull{font-family:var(--fd);font-size:clamp(1.35rem, 1.15rem + .6vw, 1.7rem);line-height:1.2;margin:0 0 14px}
.kw-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px clamp(40px,6vw,104px);align-items:start;padding-top:28px;margin-bottom:clamp(56px,7vw,96px)}
.kw-feature .kw-pull{font-size:clamp(2rem, 1.3rem + 2.3vw, 3.3rem);line-height:1.1}
.rv-wall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(40px,5vw,64px) clamp(32px,4vw,64px);align-items:start}
.rv-wall .kw blockquote{font-size:1.0625rem;color:var(--moss2)}
.kw.long blockquote{margin-bottom:6px}
.rv-wall .kw-whole blockquote{font-family:var(--fd);font-size:clamp(1.35rem, 1.15rem + .6vw, 1.7rem);line-height:1.3;color:var(--moss)}
.kw.long blockquote p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;line-clamp:5;overflow:hidden}
.kw-tog{position:absolute;width:1px;height:1px;opacity:0;margin:0}
.kw-tog:checked + blockquote p{display:block;-webkit-line-clamp:unset;overflow:visible}
.kw-more-lab{display:inline-flex;align-items:center;min-height:44px;margin-bottom:8px;font-weight:700;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em;cursor:pointer}
.kw-more-lab .less,.kw-tog:checked ~ .kw-more-lab .more{display:none}
.kw-tog:checked ~ .kw-more-lab .less{display:inline}
.kw-tog:focus-visible ~ .kw-more-lab{outline:3px solid var(--moss);outline-offset:3px;border-radius:4px}

.two-up .care-list.cols{columns:2;column-gap:32px}

@media (max-width:1100px){ .rv-wall{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:1000px){
  .pause-plan ol{flex-direction:column;gap:20px}
  .pause-plan li{flex:none}
  .pause-plan li::before{width:calc(var(--m) / 30 * 100%);margin-bottom:10px}
}
@media (max-width:900px){
  .kw-feature{grid-template-columns:1fr}
  .two-up .care-list.cols{columns:1}
  .letter::before{opacity:.06}
}
@media (max-width:620px){ .rv-wall{grid-template-columns:1fr} }

/* wave joins, the Kinto shape: the field below rises into the one above, in its own colour.
   only between two flat colours, never under the arch or beside the photo strip */
.swell{position:relative}
.swell::before{
  content:"";position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:clamp(38px,4.6vw,78px);
  background:inherit;pointer-events:none;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0,40C160,80,320,80,480,48C640,16,800,16,960,40C1120,64,1280,64,1440,32L1440,80L0,80Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0,40C160,80,320,80,480,48C640,16,800,16,960,40C1120,64,1280,64,1440,32L1440,80L0,80Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.swell.rev::before{transform:scaleX(-1)}
