:root {
  
  --bg: #f4f1e8;
   /* Linen paper */
  --ink: #3f392f;
   /* Bark brown type */
  --accent: #53634b;
   /* Deep sage links and buttons */
  --sage: #dce1cf;
   /* Soft leaf panels */
  --clay: #e4c5b2;
   /* Warm pottery panels */
  --clay-ink: #84553f;
   /* Clay accent text */
  --muted: #625e4f;
   /* Secondary text */
  --line: #b4b7a4;
   /* Hairline dividers */
  --white: #fffdf6;
   /* Light surfaces and button text */
  --font-display: 'Gilda Display', Georgia, serif;
   /* Calm classical headlines */
  --font-body: 'Nunito Sans', Arial, sans-serif;
   /* Warm, legible body */
  --gutter: clamp(22px, 5.2vw, 100px);
   /* Responsive outer margin */

}

*{
  box-sizing:border-box
}
[hidden]{
  display:none!important
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:24px
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:400 17px/1.65 var(--font-body);
  -webkit-font-smoothing:antialiased
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:none
}
a{
  color:inherit;
  text-underline-offset:5px
}
a,button,input,select,summary{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent
}
a,button,summary{
  min-height:44px
}
button,input,select,textarea{
  font:inherit
}
button,summary{
  cursor:pointer
}
:focus-visible{
  outline:3px solid var(--clay-ink);
  outline-offset:5px;
  box-shadow:0 0 0 3px var(--bg)
}
::selection{
  background:var(--clay);
  color:var(--ink)
}
h1,h2,h3,p,figure{
  margin:0
}
h1,h2,h3{
  font-family:var(--font-display);
  font-weight:400
}
h1{
  font-size:clamp(54px,7.4vw,112px);
  line-height:1.03;
  letter-spacing:-.055em
}
h2{
  font-size:clamp(38px,4.1vw,65px);
  line-height:1.13;
  letter-spacing:-.045em
}
h3{
  font-size:30px;
  line-height:1.2;
  letter-spacing:-.025em
}
p+p{
  margin-top:18px
}
img{
  display:block;
  max-width:100%;
  height:auto
}
fieldset{
  margin:0;
  padding:0;
  border:0;
  min-width:0
}
legend{
  font-weight:600
}
section{
  scroll-margin-top:24px
}
.skip{
  position:fixed;
  z-index:40;
  left:16px;
  top:12px;
  transform:translateY(-200%);
  background:var(--ink);
  color:var(--white);
  padding:12px 20px
}
.skip:focus{
  transform:none
}
.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px var(--gutter);
  gap:24px;
  border-bottom:1px solid var(--line);
  position:relative;
  z-index:10
}
.wordmark{
  text-transform:lowercase;
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  font:400 45px/1 var(--font-display);
  letter-spacing:-.06em
}
.wordmark img{
  width:30px;
  height:36px
}
.desktop-nav{
  display:flex;
  align-items:center;
  gap:clamp(16px,2.5vw,38px);
  font-size:15px
}
.desktop-nav a{
  display:flex;
  align-items:center;
  text-decoration:none
}
.desktop-nav a[aria-current=page]{
  text-decoration:underline;
  text-decoration-color:var(--accent);
  text-underline-offset:8px
}
.desktop-nav a:hover,.footer a:hover{
  color:var(--clay-ink)
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  background:var(--accent);
  color:var(--white);
  border:1px solid var(--accent);
  padding:13px 25px;
  border-radius:5px;
  font-size:16px;
  font-weight:600;
  text-decoration:none;
  line-height:1.5;
  transition:background .2s,transform .2s
}
.button:hover{
  background:var(--ink);
  border-color:var(--ink);
  transform:translateY(-2px)
}
.button span{
  font-size:21px;
  font-weight:400
}
.button.light{
  background:var(--white);
  color:var(--accent);
  border-color:var(--white)
}
.button.light:hover{
  background:var(--clay);
  border-color:var(--clay)
}
.button.outline{
  background:transparent;
  color:var(--ink);
  border-color:var(--ink)
}
.text-link{
  display:inline-flex;
  align-items:center;
  gap:26px;
  min-height:44px;
  text-decoration:none;
  border-bottom:1px solid var(--accent);
  font-weight:600
}
.text-link:hover{
  color:var(--clay-ink)
}
.mobile-nav{
  display:none
}
.eyebrow{
  font-size:12px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:25px
}
.eyebrow::before{
  content:"";
  display:inline-block;
  width:20px;
  height:1px;
  background:currentColor;
  vertical-align:middle;
  margin-right:12px
}
.section{
  padding:clamp(65px,7.5vw,120px) var(--gutter)
}
.section-heading{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:28px;
  margin-bottom:45px
}
.section-heading p{
  max-width:380px
}
.hero{
  overflow:clip;
  display:grid;
  grid-template-columns:1.06fr 1fr;
  align-items:center;
  gap:45px;
  padding:50px var(--gutter) 60px;
  max-width:1800px;
  margin:auto;
  position:relative
}
.hero h1 span{
  color:var(--accent)
}
.hero-copy{
  max-width:660px;
  position:relative;
  z-index:1
}
.hero-copy>p:not(.eyebrow){
  max-width:330px;
  margin-top:28px;
  font-size:18px
}
.hero .button{
  margin-top:28px
}
.hero-art{
  position:relative;
  padding:10px 35px 35px 15px
}
.leaf-frame{
  border-radius:48% 52% 33% 67% / 35% 41% 59% 65%;
  overflow:hidden;
  aspect-ratio:9/11;
  background:var(--sage)
}
.photo{
  width:100%;
  height:100%;
  object-fit:cover
}
.hero-art .leaf-frame{
  max-height:570px
}
.pressed{
  position:absolute;
  right:-36px;
  bottom:5%;
  width:36%;
  height:auto;
  transform:rotate(13deg);
  pointer-events:none
}
.hero-note{
  position:absolute;
  left:0;
  bottom:0;
  background:var(--bg);
  padding:16px 28px 10px 0;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase
}
.hero-note span{
  display:block;
  letter-spacing:0;
  text-transform:none;
  font:400 25px/1.4 var(--font-display);
  margin-top:6px
}
.subline{
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  margin:0 var(--gutter);
  padding:20px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  font-size:14px;
  color:var(--muted)
}
.manifesto{
  display:grid;
  grid-template-columns:1fr 1.8fr .6fr;
  align-items:start;
  gap:40px
}
.manifesto .eyebrow{
  margin-top:8px
}
.manifesto h2{
  max-width:660px
}
.manifesto .intro-copy p{
  max-width:480px;
  margin-top:26px
}
.botanical{
  width:160px;
  justify-self:end;
  transform:rotate(9deg)
}
.service-preview{
  background:var(--sage);
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:clamp(35px,7vw,110px);
  align-items:center
}
.service-preview .leaf-frame{
  max-height:580px;
  border-radius:35% 65% 57% 43% / 43% 30% 70% 57%
}
.service-lines{
  margin:32px 0 22px
}
.service-lines>a{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:center;
  border-top:1px solid #a0ac96;
  padding:22px 0;
  text-decoration:none
}
.service-lines>a:last-child{
  border-bottom:1px solid #a0ac96
}
.service-lines h3{
  font-size:28px
}
.service-lines small{
  font-size:15px;
  display:block;
  margin-top:6px
}
.service-lines .amount{
  font-size:16px;
  font-variant-numeric:tabular-nums
}
.room{
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:clamp(28px,6vw,90px);
  align-items:center
}
.room-image{
  aspect-ratio:8/5;
  overflow:hidden;
  border-radius:10px 10px 65px 10px
}
.room .text-link{
  margin-top:25px
}
.room h2+p{
  margin-top:24px
}
.quote-section{
  background:var(--clay);
  display:grid;
  grid-template-columns:.55fr 1.8fr .5fr;
  gap:30px;
  align-items:center
}
.quote-section blockquote{
  margin:0;
  font:400 clamp(29px,3.7vw,55px)/1.25 var(--font-display);
  letter-spacing:-.03em
}
.quote-section cite{
  display:block;
  font:400 15px/1.7 var(--font-body);
  margin-top:25px;
  letter-spacing:0
}
.quote-section .pressed-quote{
  max-height:250px;
  transform:rotate(20deg)
}
.visit-teaser{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:50px
}
.visit-teaser h2{
  margin-bottom:26px
}
.mini-hours{
  border-top:1px solid var(--line);
  align-self:center
}
.mini-hours>div{
  display:flex;
  gap:30px;
  justify-content:space-between;
  padding:14px 0;
  border-bottom:1px solid var(--line)
}
.closing{
  padding:65px var(--gutter);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:35px;
  background:var(--accent);
  color:var(--white)
}
.closing h2{
  font-size:clamp(38px,4.5vw,67px)
}
.closing .eyebrow{
  color:var(--white);
  margin-bottom:18px
}
.closing p:not(.eyebrow){
  margin-top:16px;
  max-width:440px
}
.footer{
  padding:56px var(--gutter) 30px
}
.footer-grid{
  display:grid;
  grid-template-columns:1.1fr 1fr 1fr 1fr;
  gap:35px
}
.footer .wordmark{
  font-size:54px;
  margin-bottom:14px
}
.footer h2{
  font:600 12px/1.5 var(--font-body);
  letter-spacing:.13em;
  text-transform:uppercase;
  margin-bottom:18px
}
.footer p,.footer address{
  font-size:15px;
  line-height:1.85;
  font-style:normal
}
.footer a:not(.button):not(.wordmark){
  min-height:44px;
  display:inline-flex;
  align-items:center
}
.footer .footer-address{
  display:block!important;
  line-height:1.8
}
.footer .button{
  margin-top:15px;
  font-size:15px;
  padding:10px 18px
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:25px;
  border-top:1px solid var(--line);
  margin-top:44px;
  padding-top:20px;
  font-size:13px;
  color:var(--muted)
}
.mobile-actions{
  display:none
}
.page-intro{
  padding:65px var(--gutter) 55px;
  display:grid;
  grid-template-columns:1.5fr .8fr;
  gap:70px;
  align-items:end
}
.page-intro h1{
  font-size:clamp(54px,6.5vw,94px)
}
.page-intro .intro-side{
  max-width:385px
}
.page-intro .button{
  margin-top:24px
}
.chapter{
  font-size:12px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:22px
}
.helper-section{
  padding-top:20px
}
.appointment-helper{
  background:var(--sage);
  padding:clamp(26px,4.4vw,66px);
  border-radius:10px 60px 10px 10px
}
.appointment-helper>summary{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  list-style:none;
  font:400 clamp(30px,3.4vw,49px)/1.2 var(--font-display);
  letter-spacing:-.035em
}
.appointment-helper>summary h2{
  font:inherit;
  letter-spacing:inherit
}
.appointment-helper>summary::-webkit-details-marker{
  display:none
}
.appointment-helper>summary::after{
  content:"+";
  font:400 28px/1 var(--font-body)
}
.appointment-helper[open]>summary::after{
  content:"−"
}
.helper-content{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:50px;
  padding-top:36px
}
.helper-controls fieldset+fieldset{
  margin-top:27px
}
.helper-controls legend{
  margin-bottom:14px;
  font-size:15px
}
.choices{
  display:flex;
  flex-wrap:wrap;
  gap:9px
}
.choice{
  position:relative
}
.choice input{
  position:absolute;
  width:1px;
  height:1px;
  clip-path:inset(50%)
}
.choice label{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:10px 18px;
  border:1px solid #6a795d;
  border-radius:4px;
  font-size:16px;
  cursor:pointer
}
.choice input:checked+label{
  background:var(--accent);
  color:var(--white);
  border-color:var(--accent)
}
.choice input:focus-visible+label{
  outline:3px solid var(--clay-ink);
  outline-offset:4px
}
.length-note{
  font-size:14px;
  color:var(--muted);
  margin-top:15px
}
.helper-results{
  background:var(--bg);
  padding:30px;
  align-self:stretch;
  border-radius:5px;
  display:flex;
  align-items:center
}
.estimate{
  width:100%
}
.estimate h3{
  font-size:28px
}
.estimate .estimate-price{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:15px;
  margin:23px 0 18px
}
.estimate-price strong{
  font:400 49px/1 var(--font-display)
}
.estimate-price span{
  font-size:17px
}
.estimate p{
  font-size:15px
}
.estimate .text-link{
  margin-top:18px;
  font-size:15px
}
.enhanced-summary{
  margin-top:27px;
  color:var(--accent);
  font-weight:600
}
.enhanced-summary[hidden]{
  display:none
}
.price-chapter{
  display:grid;
  grid-template-columns:.75fr 1.5fr;
  gap:70px;
  border-top:1px solid var(--line)
}
.price-chapter .chapter-copy p{
  margin-top:22px;
  max-width:330px
}
.price-table{
  width:100%;
  border-collapse:collapse;
  font-variant-numeric:tabular-nums;
  text-align:left;
  align-self:start
}
.price-table caption{
  text-align:left;
  font-size:15px;
  color:var(--muted);
  padding-bottom:15px
}
.price-table th{
  font-weight:600;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase
}
.price-table td,.price-table th{
  padding:18px 8px;
  border-bottom:1px solid var(--line)
}
.price-table td:first-child,.price-table th:first-child{
  padding-left:0
}
.price-table td:last-child,.price-table th:last-child{
  text-align:right;
  padding-right:0
}
.colour-note{
  background:var(--clay);
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:60px;
  align-items:center
}
.colour-note h2{
  max-width:520px
}
.colour-note .note-copy p{
  max-width:450px
}
.colour-note .text-link{
  margin-top:18px
}
.faq-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:65px
}
.faq-list details{
  border-top:1px solid var(--line);
  padding:0 0 16px
}
.faq-list details:last-child{
  border-bottom:1px solid var(--line)
}
.faq-list summary{
  padding:18px 0;
  font-size:18px;
  font-weight:600
}
.faq-list p{
  font-size:16px;
  margin-top:7px;
  padding-right:25px
}
.founder{
  padding-top:20px;
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:clamp(35px,8vw,130px);
  align-items:center
}
.portrait{
  aspect-ratio:4/5;
  overflow:hidden;
  border-radius:12px 12px 60px 12px
}
.founder .portrait{
  max-width:540px;
  border-radius:43% 57% 34% 66% / 33% 29% 71% 67%
}
.person-copy .eyebrow{
  margin-bottom:18px
}
.person-copy h2{
  font-size:clamp(48px,5vw,70px)
}
.person-copy .role{
  font-size:15px;
  color:var(--clay-ink);
  margin-top:10px
}
.person-copy .bio{
  margin-top:25px;
  max-width:440px
}
.specialities{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:26px 0
}
.specialities span{
  padding:7px 12px;
  border:1px solid var(--line);
  border-radius:4px;
  font-size:13px
}
.team-pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(30px,7vw,110px);
  background:var(--sage)
}
.team-person:nth-child(2){
  padding-top:100px
}
.team-person .portrait{
  max-height:500px;
  margin-bottom:30px
}
.team-person:nth-child(2) .portrait{
  border-radius:60px 12px 12px 12px
}
.team-person .bio{
  margin-top:18px;
  max-width:440px
}
.principles{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px
}
.principle-list{
  margin:0;
  list-style:none;
  padding:0;
  counter-reset:principle
}
.principle-list li{
  counter-increment:principle;
  display:grid;
  grid-template-columns:40px 1fr;
  gap:20px;
  border-top:1px solid var(--line);
  padding:22px 0
}
.principle-list li::before{
  content:"0" counter(principle);
  font:400 25px/1.3 var(--font-display);
  color:var(--clay-ink)
}
.principle-list h3{
  font-size:27px
}
.principle-list p{
  margin-top:10px
}
.gallery-intro{
  grid-template-columns:1.4fr 1fr
}
.gallery-mosaic{
  display:grid;
  grid-template-columns:1.1fr .75fr;
  gap:70px 100px;
  padding-top:10px;
  align-items:start
}
.gallery-item .gallery-frame{
  aspect-ratio:9/11;
  overflow:hidden;
  border-radius:14px
}
.gallery-item:nth-child(1) .gallery-frame{
  border-radius:42% 58% 32% 68% / 35% 38% 62% 65%
}
.gallery-item:nth-child(2){
  margin-top:135px
}
.gallery-item:nth-child(3){
  width:82%;
  margin-left:auto
}
.gallery-item:nth-child(3) .gallery-frame{
  border-radius:10px 65px 10px 10px
}
.gallery-item:nth-child(4){
  margin-top:110px
}
.gallery-item figcaption{
  margin-top:22px;
  display:grid;
  grid-template-columns:30px 1fr;
  gap:15px
}
.gallery-item .number{
  color:var(--clay-ink);
  font-size:13px;
  padding-top:5px
}
.gallery-item h2{
  font-size:32px
}
.gallery-item p{
  font-size:15px;
  margin-top:8px;
  max-width:300px
}
.gallery-ribbon{
  background:var(--sage);
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:60px;
  align-items:center
}
.gallery-ribbon .room-image{
  border-radius:10px 10px 60px 10px
}
.gallery-ribbon p{
  margin-top:24px
}
.book-layout{
  display:grid;
  grid-template-columns:1.1fr .85fr;
  gap:80px;
  padding-top:10px;
  align-items:start
}
.booking-panel{
  background:var(--sage);
  padding:clamp(28px,4.4vw,64px);
  border-radius:9px 60px 9px 9px
}
.booking-panel h2{
  font-size:clamp(34px,3.3vw,50px)
}
.booking-panel p{
  margin:24px 0
}
.booking-panel .button{
  width:100%;
  margin-bottom:14px
}
.booking-panel .phone-link{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  font-size:19px
}
.booking-panel .small{
  font-size:15px;
  color:var(--muted);
  margin:18px 0 0
}
.booking-aside .chapter{
  margin-top:16px
}
.booking-aside h2{
  font-size:36px;
  margin-bottom:25px
}
.booking-steps{
  list-style:none;
  padding:0;
  margin:0;
  counter-reset:step
}
.booking-steps li{
  counter-increment:step;
  display:grid;
  grid-template-columns:30px 1fr;
  gap:18px;
  border-top:1px solid var(--line);
  padding:20px 0
}
.booking-steps li::before{
  content:"0" counter(step);
  color:var(--clay-ink);
  font:400 24px/1.2 var(--font-display)
}
.booking-steps p{
  font-size:16px
}
.booking-form{
  display:grid;
  gap:20px;
  padding:32px;
  background:var(--sage);
  border-radius:8px
}
.booking-form label{
  display:block;
  font-weight:600;
  margin-bottom:6px
}
.booking-form :is(input,select,textarea){
  display:block;
  width:100%;
  min-height:48px;
  padding:11px 14px;
  color:var(--ink);
  background:var(--white);
  border:1px solid #6a795d;
  border-radius:4px
}
.booking-form textarea{
  resize:vertical;
  min-height:120px
}
.booking-form .field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.booking-form .consent{
  display:flex;
  align-items:start;
  gap:12px
}
.booking-form .consent input{
  width:20px;
  min-height:24px;
  flex:none
}
.booking-form .consent label{
  font-size:15px;
  font-weight:400
}
.booking-form .form-note{
  font-size:15px
}
.policy{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:65px;
  background:var(--clay)
}
.policy h2{
  max-width:420px
}
.policy .policy-copy{
  max-width:500px
}
.policy .text-link{
  margin-top:25px
}
.visit-layout{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:80px;
  padding-top:15px
}
.address-block{
  font:400 clamp(31px,3.5vw,49px)/1.25 var(--font-display);
  font-style:normal
}
.address-block a{
  display:block
}
.visit-details .text-link{
  margin-top:25px
}
.visit-details .phone{
  display:block;
  margin-top:22px;
  min-height:44px
}
.opening-times{
  background:var(--sage);
  padding:36px;
  border-radius:8px 50px 8px 8px
}
.opening-times h2{
  font-size:35px;
  margin-bottom:20px
}
.opening-times dl{
  margin:0
}
.opening-times dl>div{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:12px 0;
  border-top:1px solid #a0ac96
}
.opening-times dd{
  margin:0;
  font-variant-numeric:tabular-nums
}
.opening-times p{
  font-size:15px;
  margin-top:23px
}
.directions-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px
}
.directions-grid h2{
  margin-bottom:24px
}
.directions-grid p{
  max-width:490px
}
.access-notes{
  border-left:1px solid var(--line);
  padding-left:60px
}
.quiet-note{
  background:var(--clay);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:50px
}
.quiet-note p{
  max-width:520px
}
.legal-layout{
  display:grid;
  grid-template-columns:.6fr 1.2fr;
  gap:70px;
  padding-top:0
}
.legal-layout .botanical{
  justify-self:center;
  width:190px
}
.legal-copy{
  max-width:680px
}
.legal-copy section{
  padding:24px 0;
  border-top:1px solid var(--line)
}
.legal-copy h2{
  font-size:29px;
  margin-bottom:16px
}
.legal-copy .text-link{
  margin-top:18px
}
.lost{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  align-items:center;
  gap:70px;
  min-height:620px
}
.lost .botanical{
  width:270px;
  justify-self:center
}
.lost p:not(.eyebrow){
  margin-top:25px;
  max-width:350px
}
.lost .button{
  margin-top:28px
}
.lost .text-link{
  display:flex;
  width:max-content;
  margin-top:16px
}

@supports selector(:has(*)) {
  
  .helper-results .estimate{
  display:none
}

  .appointment-helper:has(#length-short:checked):has(#service-cut:checked) [data-estimate="short-cut"],
  .appointment-helper:has(#length-medium:checked):has(#service-cut:checked) [data-estimate="medium-cut"],
  .appointment-helper:has(#length-long:checked):has(#service-cut:checked) [data-estimate="long-cut"],
  .appointment-helper:has(#length-short:checked):has(#service-colour:checked) [data-estimate="short-colour"],
  .appointment-helper:has(#length-medium:checked):has(#service-colour:checked) [data-estimate="medium-colour"],
  .appointment-helper:has(#length-long:checked):has(#service-colour:checked) [data-estimate="long-colour"],
  .appointment-helper:has(#length-short:checked):has(#service-treatment:checked) [data-estimate="short-treatment"],
  .appointment-helper:has(#length-medium:checked):has(#service-treatment:checked) [data-estimate="medium-treatment"],
  .appointment-helper:has(#length-long:checked):has(#service-treatment:checked) [data-estimate="long-treatment"]{
  display:block
}


}

@supports not selector(:has(*)){
  .helper-results{
  display:block
}
.estimate+.estimate{
  margin-top:28px;
  padding-top:28px;
  border-top:1px solid var(--line)
}

}

@media(min-width:1700px){
  .hero{
  padding-top:70px;
  padding-bottom:80px
}
.hero-art .leaf-frame{
  max-height:680px
}
.hero h1{
  font-size:125px
}

}

@media(max-width:1100px){
  .desktop-nav{
  gap:19px
}
.header{
  padding-top:20px;
  padding-bottom:20px
}
.desktop-nav .button{
  padding:11px 17px
}
.manifesto{
  grid-template-columns:.65fr 1.8fr
}
.manifesto .botanical{
  display:none
}
.footer-grid{
  grid-template-columns:1.2fr 1fr;
  gap:40px 65px
}
.hero{
  gap:25px
}
.price-chapter{
  gap:45px
}
.gallery-mosaic{
  gap:60px
}
.book-layout{
  gap:45px
}
.visit-layout{
  gap:45px
}

}

@media(max-width:800px){
  body{
  padding-bottom:calc(72px + env(safe-area-inset-bottom));
  font-size:16px
}
.header{
  padding:17px var(--gutter)
}
.wordmark{
  font-size:40px
}
.wordmark img{
  width:25px;
  height:30px
}
.desktop-nav{
  display:none
}
.mobile-nav{
  display:block
}
.mobile-nav>summary{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  list-style:none;
  font-size:15px
}
.mobile-nav>summary::-webkit-details-marker{
  display:none
}
.mobile-nav>summary::after{
  content:"+";
  font-size:24px
}
.mobile-nav[open]>summary::after{
  content:"−"
}
.mobile-nav nav{
  position:absolute;
  top:100%;
  left:0;
  right:0;
  display:grid;
  padding:20px var(--gutter) 28px;
  background:var(--bg);
  border-bottom:1px solid var(--line);
  box-shadow:0 14px 24px #3f392f10
}
.mobile-nav nav a{
  padding:12px 0;
  text-decoration:none;
  border-bottom:1px solid var(--line)
}
.mobile-nav nav a[aria-current=page]{
  color:var(--accent);
  text-decoration:underline
}
.mobile-nav nav .button{
  margin-top:15px;
  padding:12px 20px
}
.mobile-actions{
  position:fixed;
  z-index:30;
  bottom:0;
  left:0;
  right:0;
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  background:var(--bg);
  border-top:1px solid var(--accent);
  padding-bottom:env(safe-area-inset-bottom)
}
.mobile-actions a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:64px;
  text-decoration:none;
  font-size:15px;
  font-weight:600
}
.mobile-actions a:first-child{
  background:var(--accent);
  color:var(--white)
}
.mobile-actions a+a{
  border-left:1px solid var(--line)
}
.hero{
  padding-top:33px;
  padding-bottom:38px;
  grid-template-columns:1fr;
  gap:25px
}
.hero .eyebrow{
  margin-bottom:22px
}
.hero h1{
  font-size:clamp(56px,12.7vw,90px)
}
.hero-copy>p:not(.eyebrow){
  font-size:16px;
  max-width:300px;
  margin-top:24px
}
.hero .button{
  margin-top:22px
}
.hero-art{
  width:90%;
  margin-left:auto;
  padding:10px 10px 30px 20px
}
.hero-art .leaf-frame{
  aspect-ratio:1.04;
  max-height:430px
}
.hero-art .photo{
  object-position:center 45%
}
.pressed{
  right:-13px;
  bottom:12%;
  width:33%
}
.hero-note{
  font-size:12px;
  padding-right:20px
}
.hero-note span{
  font-size:22px
}
.subline{
  font-size:13px;
  gap:8px
}
.manifesto{
  grid-template-columns:1fr;
  gap:0
}
.manifesto .eyebrow{
  margin-top:0
}
.manifesto .intro-copy p{
  max-width:430px
}
.service-preview{
  grid-template-columns:1fr;
  gap:45px
}
.service-preview .leaf-frame{
  aspect-ratio:1.2;
  max-height:350px;
  width:90%;
  margin:auto
}
.service-preview .photo{
  object-position:center 43%
}
.room{
  grid-template-columns:1fr;
  gap:32px
}
.room-image{
  aspect-ratio:1.2;
  border-radius:8px 8px 45px 8px
}
.quote-section{
  grid-template-columns:1fr;
  gap:6px
}
.quote-section .eyebrow{
  margin-bottom:22px
}
.quote-section blockquote{
  font-size:34px
}
.quote-section .pressed-quote{
  display:none
}
.visit-teaser{
  grid-template-columns:1fr;
  gap:35px
}
.closing{
  display:block;
  padding:50px var(--gutter)
}
.closing .button{
  margin-top:28px
}
.footer-grid{
  grid-template-columns:1fr 1fr;
  gap:32px 24px
}
.footer-grid>div:first-child{
  grid-column:1/-1
}
.footer-grid>div:last-child{
  grid-column:1/-1
}
.footer-bottom{
  display:block
}
.footer-bottom p{
  margin:0
}
.section-heading{
  display:block
}
.section-heading p{
  margin-top:20px
}
.page-intro{
  padding:45px var(--gutter) 42px;
  grid-template-columns:1fr;
  gap:25px
}
.page-intro h1{
  font-size:clamp(53px,12vw,79px)
}
.page-intro .eyebrow{
  margin-bottom:22px
}
.page-intro .button{
  margin-top:20px
}
.page-intro .intro-side{
  max-width:440px
}
.helper-content{
  grid-template-columns:1fr;
  gap:25px;
  padding-top:26px
}
.appointment-helper{
  padding:26px 22px;
  border-radius:7px 40px 7px 7px
}
.appointment-helper>summary{
  font-size:32px
}
.helper-results{
  padding:25px
}
.choices{
  gap:7px
}
.choice label{
  padding:10px 13px;
  font-size:15px
}
.price-chapter{
  grid-template-columns:1fr;
  gap:25px
}
.price-chapter .chapter-copy p{
  max-width:440px;
  margin-top:18px
}
.price-table td,.price-table th{
  padding:17px 6px;
  font-size:15px
}
.price-table th{
  font-size:12px
}
.price-table caption{
  font-size:13px
}
.colour-note{
  grid-template-columns:1fr;
  gap:28px
}
.faq-grid{
  grid-template-columns:1fr;
  gap:30px
}
.founder{
  grid-template-columns:1fr;
  gap:35px
}
.founder .portrait{
  max-height:440px;
  width:92%;
  margin:auto;
  aspect-ratio:1
}
.founder .photo{
  object-position:center 28%
}
.team-pair{
  grid-template-columns:1fr;
  gap:48px
}
.team-person:nth-child(2){
  padding-top:0
}
.team-person .portrait{
  width:86%;
  max-height:390px;
  margin-left:auto;
  margin-right:0
}
.team-person:nth-child(2) .portrait{
  margin-left:0;
  margin-right:auto
}
.principles{
  grid-template-columns:1fr;
  gap:35px
}
.gallery-mosaic{
  grid-template-columns:1fr 1fr;
  gap:40px 18px
}
.gallery-item:nth-child(1){
  grid-column:1/-1;
  width:95%
}
.gallery-item:nth-child(1) .gallery-frame{
  aspect-ratio:1.1
}
.gallery-item:nth-child(2){
  margin-top:0
}
.gallery-item:nth-child(3){
  width:100%;
  margin-top:55px
}
.gallery-item:nth-child(4){
  grid-column:1/-1;
  width:82%;
  margin:0 0 0 auto
}
.gallery-item figcaption{
  grid-template-columns:1fr;
  gap:5px;
  margin-top:16px
}
.gallery-item h2{
  font-size:27px
}
.gallery-item p{
  font-size:14px
}
.gallery-item .number{
  padding:0
}
.gallery-ribbon{
  grid-template-columns:1fr;
  gap:32px
}
.book-layout{
  grid-template-columns:1fr;
  gap:40px
}
.booking-panel{
  padding:30px 23px
}
.booking-aside .chapter{
  margin-top:0
}
.policy{
  grid-template-columns:1fr;
  gap:28px
}
.visit-layout{
  grid-template-columns:1fr;
  gap:40px
}
.opening-times{
  padding:28px 24px
}
.opening-times dl>div{
  font-size:15px
}
.directions-grid{
  grid-template-columns:1fr;
  gap:40px
}
.access-notes{
  padding:35px 0 0;
  border-left:0;
  border-top:1px solid var(--line)
}
.quiet-note{
  display:block
}
.quiet-note p{
  margin-top:22px
}
.legal-layout{
  grid-template-columns:1fr;
  gap:20px
}
.legal-layout .botanical{
  display:none
}
.lost{
  grid-template-columns:1fr;
  gap:25px;
  min-height:0
}
.lost .botanical{
  width:150px;
  justify-self:end;
  max-height:220px
}
.booking-form .field-row{
  grid-template-columns:1fr
}
.footer{
  padding-bottom:30px
}

}

@media(max-width:360px){
  .hero h1{
  font-size:47px
}
.hero-art{
  width:95%
}
.page-intro h1{
  font-size:42px
}
.footer-grid{
  grid-template-columns:1fr
}
.footer-grid>div{
  grid-column:auto!important
}
.choice label{
  padding:10px 11px
}
.gallery-item h2{
  font-size:24px
}
.gallery-mosaic{
  column-gap:14px
}
.appointment-helper>summary{
  font-size:28px
}

}

@media(prefers-reduced-motion:reduce){
  html{
  scroll-behavior:auto
}
*,*::before,*::after{
  animation:none!important;
  transition:none!important
}
.button:hover{
  transform:none
}

}


/* Comfortable mobile reading and full-size contact targets. */
.subline a,.visit-details p>a,.legal-copy p>a,.booking-steps p>a{
  display:inline-flex;
  align-items:center;
  min-height:44px
}

@media(max-width:800px){
  .hero-copy>p:not(.eyebrow),.manifesto p,.service-lines small,.room p,.visit-teaser p,.closing p:not(.eyebrow),.footer p,.footer address,.footer .button,.subline,.length-note,.estimate p,.estimate .text-link,.price-table td,.price-table th[scope=row],.price-table caption,.faq-list p,.person-copy .role,.team-person .role,.gallery-item p,.booking-panel .small,.opening-times dl>div,.opening-times p,.booking-form .form-note,.booking-form .consent label{
  font-size:16px
}
.price-table th[scope=row]{
  text-transform:none;
  letter-spacing:0
}
.footer-bottom{
  font-size:16px
}

}


.colour-chapter{
  background:var(--sage);
  grid-template-columns:.85fr 1.2fr .65fr;
  gap:42px;
  align-items:center
}
.colour-art .leaf-frame{
  aspect-ratio:9/11;
  border-radius:40% 60% 33% 67% / 37% 32% 68% 63%
}
.colour-art figcaption{
  font-size:12px;
  margin-top:16px;
  letter-spacing:.05em
}
.closing :focus-visible{
  outline-color:var(--white);
  box-shadow:0 0 0 3px var(--ink)
}

@media(max-width:1100px){
  .colour-chapter{
  grid-template-columns:1fr 1.4fr
}
.colour-art{
  grid-column:1/-1;
  width:220px;
  justify-self:end
}
.colour-art .leaf-frame{
  aspect-ratio:1.3
}

}

@media(max-width:800px){
  .colour-chapter{
  grid-template-columns:1fr;
  gap:26px
}
.colour-art{
  width:82%;
  grid-column:auto;
  justify-self:center
}
.colour-art .leaf-frame{
  aspect-ratio:1.3
}
.quote-section cite,.specialities span{
  font-size:16px
}

}


strong{font-weight:600}
.quote-section .eyebrow,.policy .eyebrow,.colour-note .eyebrow,.quiet-note .eyebrow{color:var(--ink)}
.person-copy .text-link,.team-person .text-link{display:inline-block;padding:8px 0;min-height:44px}