:root{
  --yew:#22301f;
  --moss:#56643a;
  --sage:#9aa77a;
  --stone:#d8bf8a;
  --stone-2:#c9ab6d;
  --oat:#ece3cf;
  --oat-2:#e2d6ba;
  --catmint:#8d8bb5;
  --bark:#3b2f22;
  --serif:"Young Serif", Georgia, serif;
  --sans:"Figtree", "Gill Sans", sans-serif;
  --gut:clamp(20px,4.5vw,80px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .23 0 0 0 0 .18 0 0 0 0 .13 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}

body{margin:0;background:var(--oat);color:var(--bark);font-family:var(--sans);font-size:clamp(16px,1.08vw,19px);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;background:var(--grain);pointer-events:none;z-index:100;mix-blend-mode:multiply;opacity:.55}
a{color:inherit}
:focus-visible{outline:2px solid var(--moss);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;letter-spacing:-.01em}

.top{position:fixed;inset:0 0 auto;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:14px var(--gut);transition:background .3s,box-shadow .3s}
.top.solid{background:rgba(236,227,207,.94);backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(59,47,34,.12)}
.mark{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--serif);font-size:24px;color:var(--yew)}
.mark svg{width:42px;height:42px}
.top nav{display:flex;gap:28px;align-items:center;font-size:15px;font-weight:500}
.top nav a{text-decoration:none;color:var(--yew)}
.top nav a:hover{text-decoration:underline;text-underline-offset:4px}
.top-cta{background:var(--yew);color:var(--oat)!important;padding:10px 18px;border-radius:40px}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 26px;border-radius:40px;font:inherit;font-weight:600;text-decoration:none;border:0;cursor:pointer;transition:transform .2s,background .2s}
.btn-yew{background:var(--yew);color:var(--oat)}
.btn-yew:hover{background:#2f4229}
.btn-soft{background:rgba(255,255,255,.45);color:var(--yew);box-shadow:inset 0 0 0 1.5px var(--yew)}

/* hero */
.hero{position:relative;min-height:100vh;overflow:hidden;background:linear-gradient(#e9dcbc 0%,#efe4c9 40%,#ece3cf 60%)}
.hills{position:absolute;inset:0;width:100%;height:100%}
.hero-copy{position:relative;z-index:2;padding:136px var(--gut) 0;max-width:1060px}
.hero-small{font-size:15px;font-weight:500;color:var(--moss);margin:0 0 18px}
.hero h1{font-size:clamp(46px,5.2vw,96px);line-height:1.02;color:var(--yew);max-width:11.5em;margin-bottom:26px}
.hero-lede{max-width:33em;font-size:clamp(17px,1.25vw,21px);margin:0 0 32px;color:#4a3d2d}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}

.note{position:absolute;z-index:3;right:var(--gut);top:150px;width:min(380px,32vw);background:#f6f0e2;border-radius:22px;padding:20px 20px 16px;box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 24px 50px -24px rgba(34,48,31,.45);transform:rotate(1.2deg)}
.note::before{content:"";position:absolute;top:-12px;left:50%;width:90px;height:24px;transform:translateX(-50%) rotate(-3deg);background:rgba(216,191,138,.75);border-radius:2px}
.note-head{display:flex;gap:14px;align-items:flex-start;padding-bottom:12px;border-bottom:1px dashed rgba(59,47,34,.25);margin-bottom:12px}
.note-head strong{display:block;font-family:var(--serif);font-weight:400;font-size:19px;color:var(--yew);line-height:1.2}
.note-head span{display:block;font-size:14px;color:#6a5a45;line-height:1.4;margin-top:4px}
.note-dots{display:flex;gap:3px;align-items:center;height:38px;flex:none;padding-top:2px}
.note-dots i{width:5px;height:5px;border-radius:50%;background:var(--catmint);animation:dot 1.1s ease-in-out infinite alternate}
.note-dots i:nth-child(2n){animation-delay:-.4s}.note-dots i:nth-child(3n){animation-delay:-.7s}
@keyframes dot{to{height:24px;border-radius:4px}}
.chat{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:250px;font-size:15px;line-height:1.4}
.chat li{max-width:86%;padding:9px 13px;border-radius:16px;animation:pop .45s cubic-bezier(.2,.9,.3,1.2) both}
.chat .agent{background:#fff;border-bottom-left-radius:4px;align-self:flex-start;color:var(--bark)}
.chat .caller{background:var(--moss);color:#f6f0e2;border-bottom-right-radius:4px;align-self:flex-end}
.chat .booked{align-self:stretch;max-width:none;background:var(--stone);color:var(--yew);border-radius:12px;font-weight:600;display:flex;gap:10px;align-items:center}
.chat .booked svg{width:20px;height:20px;flex:none}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.97)}}

/* intro */
.intro{background:var(--yew);color:var(--oat);padding:120px var(--gut) 110px;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.7fr);gap:6vw;align-items:end}
.intro-big{font-family:var(--serif);font-size:clamp(28px,2.7vw,48px);line-height:1.22;margin:0;max-width:22em}
.intro-facts{list-style:none;margin:0;padding:0;display:grid;gap:18px;font-size:16px;color:#cfc6ad}
.intro-facts li{border-top:1px solid rgba(236,227,207,.22);padding-top:12px}
.intro-facts b{display:block;font-family:var(--serif);font-weight:400;font-size:30px;color:var(--stone)}

/* seasons */
.seasons{background:var(--oat-2)}
.seasons-pin{height:100vh;display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:4vw;align-items:center;padding:90px var(--gut) 30px}
.seasons h2{font-size:clamp(40px,3.8vw,70px);line-height:1.02;color:var(--yew)}
.seasons-sub{color:#6a5a45;margin:14px 0 30px;max-width:24em}
.month-wheel{position:relative;width:min(220px,40vw);aspect-ratio:1}
.month-wheel svg{width:100%;height:100%}
.month-wheel span{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--serif);font-size:clamp(24px,2vw,32px);color:var(--yew)}
.seasons-note{font-size:clamp(18px,1.4vw,23px);font-family:var(--serif);line-height:1.35;max-width:16em;margin-top:28px;color:var(--yew);min-height:3em}
.plan-wrap{height:100%;max-height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center}
.plan-wrap svg{width:100%;height:100%;filter:drop-shadow(0 18px 30px rgba(59,47,34,.18))}

/* how */
.how{padding:140px var(--gut) 120px;position:relative}
.title{font-size:clamp(38px,3.6vw,66px);line-height:1.05;color:var(--yew);max-width:15em;margin-bottom:56px}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3vw;position:relative;counter-reset:s}
.steps::before{content:"";position:absolute;left:30px;right:6%;top:30px;border-top:2px dashed var(--stone-2)}
.steps li{position:relative;counter-increment:s}
.stone{display:grid;place-items:center;width:62px;height:56px;background:var(--stone);border-radius:46% 54% 42% 58%/55% 45% 55% 45%;box-shadow:inset -4px -5px 0 rgba(59,47,34,.14),inset 3px 3px 0 rgba(255,255,255,.35);margin-bottom:24px;position:relative}
.steps li:nth-child(2) .stone{border-radius:58% 42% 55% 45%/45% 58% 42% 55%;width:58px}
.steps li:nth-child(3) .stone{border-radius:40% 60% 48% 52%/60% 40% 60% 40%;width:66px}
.steps li:nth-child(4) .stone{border-radius:55% 45% 60% 40%/50% 50% 50% 50%}
.stone::after{content:counter(s);font-family:var(--serif);font-size:24px;color:var(--yew)}
.steps h3{font-size:clamp(22px,1.7vw,29px);color:var(--yew);margin-bottom:10px}
.steps p{margin:0 0 14px;max-width:24em}
.steps small{font-size:14px;font-weight:600;color:var(--moss)}

/* labels */
.labels{padding:120px var(--gut) 140px;background:var(--moss);color:var(--oat);overflow:hidden}
.labels .title{color:var(--oat);margin:0}
.labels-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:70px;flex-wrap:wrap}
.labels-head p{margin:0;font-size:17px}
.labels-head b{font-family:var(--serif);font-weight:400;font-size:56px;color:var(--stone);vertical-align:-8px;margin-right:6px}
.label-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2.4vw;align-items:start}
.tag{margin:0;position:relative;background:#f2e8d2;color:var(--bark);padding:56px 24px 64px;border-radius:12px 12px 6px 6px;clip-path:polygon(0 0,100% 0,100% 88%,50% 100%,0 88%);
  background-image:repeating-linear-gradient(91deg,rgba(150,112,60,.06) 0 2px,transparent 2px 9px),var(--grain)}
.tag::before{content:"";position:absolute;top:18px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--moss);box-shadow:inset 0 2px 2px rgba(0,0,0,.25)}
.tag:nth-child(1){transform:rotate(-2.2deg)}.tag:nth-child(2){transform:rotate(1.6deg) translateY(30px)}.tag:nth-child(3){transform:rotate(-1deg) translateY(-10px)}.tag:nth-child(4){transform:rotate(2.4deg) translateY(20px)}
.tag blockquote{margin:0 0 18px;font-family:var(--serif);font-size:clamp(17px,1.3vw,21px);line-height:1.38;color:var(--yew)}
.tag figcaption{font-size:14px;font-weight:600;color:#6a5a45}

/* where */
.where{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:5vw;align-items:center;padding:130px var(--gut)}
.where-text p{max-width:30em}
.where-small{color:#7a6a52;font-style:italic}
#contours{width:100%;height:auto}

/* visit */
.visit{padding:20px var(--gut) 140px}
.visit-card{background:var(--yew);color:var(--oat);border-radius:28px;padding:clamp(28px,4vw,64px);display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:4vw;position:relative;overflow:hidden}
.visit-card::before{content:"";position:absolute;right:-120px;top:-120px;width:380px;height:380px;border-radius:50%;border:1.5px dashed rgba(216,191,138,.3)}
.visit .title{color:var(--oat);margin-bottom:20px}
.visit-intro p{color:#d4ccb4;max-width:26em}
.visit-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;position:relative}
.cal{background:#f4ecda;color:var(--bark);border-radius:20px;padding:22px}
.cal-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.cal-top strong{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--yew)}
.cal-nav{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--yew);background:none;font-size:20px;line-height:1;cursor:pointer;color:var(--yew)}
.cal-dow,.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
.cal-dow span{font-size:12px;color:#8a7a62;padding-bottom:4px}
.cal-grid button{aspect-ratio:1;border:0;border-radius:50%;background:none;font:inherit;font-size:15px;cursor:pointer;color:var(--yew);font-weight:600;position:relative}
.cal-grid button:disabled{color:#bcae92;font-weight:400;cursor:default}
.cal-grid button:not(:disabled)::after{content:"";position:absolute;left:50%;bottom:4px;width:4px;height:4px;border-radius:50%;background:var(--sage);transform:translateX(-50%)}
.cal-grid button:not(:disabled):hover{background:var(--oat-2)}
.cal-grid button[aria-pressed="true"]{background:var(--moss);color:#f6f0e2}
.cal-grid button[aria-pressed="true"]::after{background:var(--stone)}
.slots{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.slots button{flex:1 1 30%;padding:9px 6px;border-radius:30px;border:1.5px solid var(--oat-2);background:#fff;font:inherit;font-size:14px;cursor:pointer;color:var(--yew)}
.slots button[aria-checked="true"]{background:var(--stone);border-color:var(--stone);font-weight:600}
.enquiry{display:grid;grid-template-columns:1fr;gap:12px;align-content:start}
.enquiry label{display:flex;flex-direction:column;gap:5px}
.enquiry label span{font-size:13px;color:#cfc6ad}
.enquiry input,.enquiry select,.enquiry textarea{font:inherit;font-size:15px;padding:12px 14px;border-radius:12px;border:1px solid rgba(236,227,207,.2);background:rgba(236,227,207,.08);color:var(--oat)}
.enquiry ::placeholder{color:rgba(236,227,207,.45)}
.enquiry select option{color:var(--bark)}
.enq-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}
.enq-foot p{margin:0;font-size:14px;color:#cfc6ad}
.enq-foot b{color:var(--stone);font-weight:600}
.enquiry .btn-yew{background:var(--stone);color:var(--yew)}
.enq-done{margin:0;background:rgba(216,191,138,.18);padding:12px 14px;border-radius:12px}

/* footer */
.foot{background:var(--yew);color:#cfc6ad;position:relative}
.wall{display:block;width:100%;height:clamp(70px,9vw,170px);background:var(--oat)}
.foot-inner{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.3fr 1fr;gap:30px;padding:50px var(--gut) 50px;font-size:15px}
.foot-name{font-family:var(--serif);font-size:24px;color:var(--oat);margin:0}
.foot-inner p{margin:0}
.foot-fine{font-style:italic}

@media (max-width:1000px){
  .top nav a:not(.top-cta){display:none}
  .hero{min-height:auto;padding-bottom:40px}
  .hero-copy{padding-top:120px}
  .hills{height:100%}
  .note{position:relative;right:auto;top:auto;width:auto;margin:40px var(--gut) 0;transform:none}
  .intro,.where,.visit-card,.visit-grid{grid-template-columns:1fr}
  .seasons-pin{grid-template-columns:1fr;height:100vh;padding-top:80px;gap:8px;grid-template-rows:auto 1fr}
  .seasons-sub{display:none}
  .month-wheel{width:96px;margin-top:6px}
  .month-wheel span{font-size:15px}
  .plan-wrap{align-items:flex-start;height:auto}
  .seasons-pin{align-items:start}
  .seasons-text{flex-direction:row!important;flex-wrap:wrap;gap:0 18px;align-items:center}
  .seasons-text h2{width:100%}
  .seasons-note{flex:1;min-width:0}
  .seasons-text h2{font-size:34px}
  .seasons-note{margin-top:8px;min-height:2.6em;font-size:17px}
  .seasons-text{display:flex;flex-direction:column}
  .steps{grid-template-columns:1fr 1fr;row-gap:44px}
  .steps::before{display:none}
  .label-row{grid-template-columns:1fr 1fr;row-gap:50px}
  .foot-inner{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .steps,.label-row{grid-template-columns:1fr}
  .tag{transform:none!important}
  .mark{font-size:20px}
  .top-cta{padding:9px 14px;font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}
