@font-face{font-family:"Figtree";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/figtree-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Figtree";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/figtree-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Figtree";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/figtree-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Young Serif";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/young-serif-latin-400-normal.woff2") format("woff2")}
:root{
  --green:#1F5D2B;
  --leaf:#3AA52E;
  --red:#C21F1B;
  --sun:#F6C945;
  --ink:#16241A;
  --chalk:#FBFAF6;
  --line:#D5DDD3;
  --radius:6px;
  --serif:"Young Serif",Georgia,serif;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--chalk);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--green)}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;margin:0 0 .5em;color:var(--ink)}
h1{font-size:clamp(2.4rem,5.6vw,4.2rem);letter-spacing:-.01em}
h2{font-size:clamp(1.8rem,3.6vw,2.6rem)}
h3{font-size:1.3rem}
p{margin:0 0 1em;max-width:62ch}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px;border-radius:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:0}

/* header */
.top{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem clamp(1rem,4vw,3rem);background:rgba(251,250,246,.95);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:.6rem}
.brand-name{display:flex;gap:.3em;white-space:nowrap}
.brand img{height:37px;width:auto}
.brand-main{font-family:var(--serif);font-size:1.3rem}
.brand-sub{font-family:var(--serif);font-size:1.3rem}
.top nav{display:flex;align-items:center;gap:1.4rem}
.top nav a{text-decoration:none;color:var(--ink);font-weight:500}
.top nav a:hover{color:var(--green)}
.top nav a.btn{color:#fff}

/* buttons */
.btn{display:inline-block;background:var(--green);color:#fff;text-decoration:none;font-weight:700;padding:.85rem 1.5rem;border-radius:var(--radius);border:2px solid var(--green);font-family:inherit;font-size:1rem;cursor:pointer;transition:background .15s,color .15s}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn-small{padding:.5rem 1rem}
.btn-ghost{background:transparent;color:var(--green)}
.btn-ghost:hover{background:var(--green);color:#fff;border-color:var(--green)}
.btn-full{width:100%}

/* hero */
.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding:clamp(2.5rem,6vw,5rem) clamp(1rem,4vw,3rem) clamp(3rem,6vw,5rem);max-width:1240px;margin:0 auto}
.lead{font-size:1.25rem;max-width:44ch}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.hero-visual{position:relative;padding-bottom:2.5rem}
.hero-photo{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius);margin-left:auto;max-width:520px}

/* ticket: the one memorable element */
.ticket{position:relative;background:var(--sun);color:var(--ink);padding:1.8rem 1.6rem 1.5rem;border-radius:4px;
  -webkit-mask:radial-gradient(circle 11px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 11px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 11px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 11px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat}
.ticket-title{font-family:var(--serif);font-size:1.4rem;margin:0 0 .9rem;padding-bottom:.8rem;border-bottom:2px dashed var(--ink)}
.ticket dl{margin:0}
.ticket dl div{display:flex;gap:1rem;padding:.5rem 0;border-bottom:1px dashed rgba(22,36,26,.35)}
.ticket dl div:last-child{border-bottom:0}
.ticket dt{flex:0 0 4.6rem;font-weight:700}
.ticket dd{margin:0}
.ticket-hero{position:absolute;left:0;bottom:0;width:min(330px,80%);transform:rotate(-2.2deg);transform-origin:bottom left;animation:print .9s cubic-bezier(.2,.8,.2,1) both;box-shadow:0 12px 30px -12px rgba(0,0,0,.35)}
@keyframes print{from{transform:translateY(-36px) rotate(0);opacity:0}to{transform:translateY(0) rotate(-2.2deg);opacity:1}}

/* sections */
.section{max-width:1240px;margin:0 auto;padding:clamp(3rem,7vw,6rem) clamp(1rem,4vw,3rem)}
.section-head{max-width:60ch;margin-bottom:2.5rem}
.section-head p{color:#3C5142}

/* services: ruled list, not cards */
.service-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(2rem,5vw,5rem)}
.service-list li{border-top:2px solid var(--ink);padding:1.2rem 0 1.6rem}
.service-list p{margin:0}

/* gallery mosaic */
.gallery{max-width:1240px;margin:0 auto;padding:0 clamp(1rem,4vw,3rem) clamp(2rem,5vw,4rem);display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,19vw,240px);gap:.8rem}
.gallery figure{margin:0;overflow:hidden;border-radius:var(--radius);background:var(--line)}
.gallery img{width:100%;height:100%;object-fit:cover}
.g-wide{grid-column:span 2}
.g-tall{grid-row:span 2}

/* how it works */
.how{background:var(--green);max-width:none;color:#fff}
.how>*{max-width:1240px;margin-left:auto;margin-right:auto}
.how h2,.how h3{color:#fff}
.steps{list-style:none;counter-reset:s;margin:2rem auto 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,4vw,3rem)}
.steps li{counter-increment:s;position:relative;padding-top:3.2rem}
.steps li::before{content:counter(s);position:absolute;top:0;left:0;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--sun);color:var(--ink);font-family:var(--serif);display:grid;place-items:center}
.steps p{color:#DCEBDD;margin:0}

/* menus */
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.chip{font:inherit;font-weight:500;background:transparent;color:var(--ink);border:2px solid var(--ink);border-radius:99px;padding:.35rem 1rem;cursor:pointer;transition:background .15s,color .15s}
.chip:hover{background:var(--line)}
.chip.is-on{background:var(--ink);color:#fff}
.menu-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(2rem,5vw,5rem)}
.menu{border-top:2px solid var(--ink);padding:1.2rem 0 2rem}
.menu header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.8rem}
.menu h3{margin:0}
.price{margin:0;white-space:nowrap;font-size:.95rem;color:#3C5142}
.price span{font-family:var(--serif);font-size:1.9rem;color:var(--red);margin-right:.15rem}
.menu dl{margin:0 0 1rem}
.menu dl div{display:grid;grid-template-columns:7.2rem 1fr;gap:.8rem;padding:.35rem 0}
.menu dt{font-weight:700;color:var(--green)}
.menu dd{margin:0}
.pdf{font-size:.95rem;font-weight:500}

/* pricing */
.pricing{background:#EEF3EC;max-width:none}
.pricing-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,4vw,3.5rem)}
.pricing h2{font-size:1.6rem}
.tick,.plain{list-style:none;margin:0 0 1rem;padding:0}
.tick li{padding:.3rem 0 .3rem 1.8rem;position:relative}
.tick li::before{content:"";position:absolute;left:0;top:.7rem;width:.9rem;height:.5rem;border-left:3px solid var(--leaf);border-bottom:3px solid var(--leaf);transform:rotate(-45deg)}
.plain li{padding:.45rem 0;border-bottom:1px dashed var(--line)}
.note{color:#3C5142}
.kids{margin:0}
.kids div{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px dashed #AAB9A8}
.kids dt{font-weight:500}
.kids dd{margin:0;font-weight:700;color:var(--red)}

/* story */
.story{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.story-quote{background:var(--green);color:#fff;padding:clamp(1.8rem,4vw,3rem);border-radius:var(--radius)}
.story-quote p{font-family:var(--serif);font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.25;margin:0}

/* team: collapsible, with a small carousel */
.team{padding-top:0}
.team-box{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.team-box summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:1.1rem 0;font-family:var(--serif);font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1.12}
.team-box summary::-webkit-details-marker{display:none}
.team-box summary::after{content:"+";font-family:var(--sans);font-size:2rem;color:var(--green);transition:transform .2s}
.team-box[open] summary::after{transform:rotate(45deg)}
.team-body{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:start;padding:.5rem 0 2.2rem}
.carousel{min-width:0}
.track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--radius);gap:0}
.track::-webkit-scrollbar{display:none}
.track figure{flex:0 0 100%;margin:0;scroll-snap-align:center}
.track img{width:100%;aspect-ratio:3/2;object-fit:cover}
.track img.pos-top{object-position:50% 22%}
.ctrl{display:flex;align-items:center;gap:.9rem;margin-top:.7rem}
.ctrl button{width:2.6rem;height:2.6rem;border-radius:50%;border:2px solid var(--ink);background:transparent;color:var(--ink);font-size:1.5rem;line-height:1;cursor:pointer;transition:background .15s,color .15s}
.ctrl button:hover{background:var(--ink);color:#fff}
.count{font-weight:500}
.team-text h3{margin:0 0 .15rem}
.team-text .role{margin-bottom:1.6rem;font-weight:700;color:var(--green)}

/* booking */
.book{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.contact-lines a{font-weight:700}
.ticket-form{max-width:640px}
.field{margin-bottom:1rem;flex:1}
.row{display:flex;gap:1rem}
.field label{display:block;font-weight:700;font-size:.95rem;margin-bottom:.25rem}
input,select,textarea{width:100%;font:inherit;color:var(--ink);background:var(--chalk);border:2px solid var(--ink);border-radius:var(--radius);padding:.65rem .75rem}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--green);outline-offset:1px}
.form-msg{background:var(--ink);color:#fff;padding:.7rem 1rem;border-radius:var(--radius);margin-bottom:1rem}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.ticket-form .btn{background:var(--ink);border-color:var(--ink)}
.ticket-form .btn:hover{background:var(--green);border-color:var(--green)}

/* footer */
.foot{background:var(--ink);color:#D3E0D3;text-align:center;padding:3rem 1rem}
.foot img{margin:0 auto 1rem;background:var(--chalk);border-radius:var(--radius);padding:.7rem 1rem;width:170px;height:auto}
.foot p{margin:0 auto .4rem}
.foot-links{display:flex;justify-content:center;flex-wrap:wrap;gap:1.4rem;margin:.8rem auto 1.2rem}
.foot-links a{color:#fff;font-weight:500}
.foot-small{font-size:.9rem;opacity:.7}

/* thanks page */
.thanks{min-height:70vh;display:grid;place-items:center;padding:3rem 1rem;text-align:center}
.thanks div{max-width:520px}
.thanks p{margin-left:auto;margin-right:auto}

/* responsive */
@media (max-width:900px){
  .hero,.story,.book,.team-body{grid-template-columns:1fr}
  .hero-photo{max-width:none;aspect-ratio:4/3}
  .hero-visual{padding-bottom:0}
  .ticket-hero{position:relative;width:min(340px,88%);margin-top:-3.2rem;margin-left:.4rem}
  .steps,.pricing-grid{grid-template-columns:1fr}
  .service-list,.menu-grid{grid-template-columns:1fr}
  .top nav a:not(.btn){display:none}
  .gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(140px,34vw,230px)}
  .g-wide{grid-column:span 2}
}
@media (max-width:520px){
  .row{flex-direction:column;gap:0}
  .menu dl div{grid-template-columns:1fr;gap:0}
  .brand-main,.brand-sub{font-size:1.05rem}
  .brand{gap:.45rem}
  .brand img{height:30px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ticket-hero{animation:none}
  *{transition:none!important}
}

/* checkboxes and policy page */
.check{display:flex;gap:.6rem;align-items:flex-start;margin-bottom:.9rem;font-size:.95rem;font-weight:400}
.check input{width:1.25rem;height:1.25rem;margin-top:.15rem;flex:0 0 auto;accent-color:var(--ink)}
.check span{flex:1}
.ticket-form .check a{color:var(--ink);font-weight:700}
.field-note{font-size:.9rem;margin:.25rem 0 0}
.policy{max-width:760px;margin:0 auto;padding:clamp(2.5rem,6vw,4.5rem) clamp(1rem,4vw,2rem) 4rem}
.policy h1{font-size:clamp(2rem,5vw,3rem)}
.policy h2{font-size:1.4rem;margin-top:2.2rem}
.policy ul{padding-left:1.2rem}
.policy li{margin-bottom:.4rem}
.policy .updated{color:#3C5142}
