:root{
    --green:#0F8A44;
    --green-dark:#0B6E36;
    --cream:#FDF8EC;
    --yellow:#F7C948;
    --orange:#F28C28;
    --ink:#000000;
    --white:#ffffff;
    --maxw:1100px;
    --gutter:22px;
    --border:4px;
    --shadow:8px 8px 0 #000;
    --shadow-sm:4px 4px 0 #000;
    --sp:76px;          /* consistent vertical section rhythm */
    --block-gap:44px;   /* consistent gutter between major grid columns */
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:"Inter","Helvetica Neue",Roboto,Arial,sans-serif;
    color:var(--ink);
    background:var(--cream);
    font-size:17px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  /* Graph-paper grid overlay on major sections */
  .grid-bg{
    background-image:
      linear-gradient(rgba(0,0,0,.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,0,0,.05) 1px, transparent 1px);
    background-size:26px 26px;
  }
  h1,h2,h3,h4{
    font-family:"Archivo Black","Arial Black",Impact,sans-serif;
    line-height:.98;margin:0 0 .5em;font-weight:400;
    text-transform:uppercase;letter-spacing:-.02em;
  }
  h1{font-size:2.3rem;}
  h2{font-size:1.9rem;}
  h3{font-size:1.15rem;}
  h4{font-size:1rem;}
  p{margin:0 0 1rem;}
  a{color:var(--green-dark);text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);}
  section{padding:var(--sp) 0;border-bottom:var(--border) solid #000;}
  .eyebrow{
    display:inline-block;text-transform:uppercase;letter-spacing:0;
    font-family:"Archivo Black","Arial Black",sans-serif;
    font-size:.74rem;font-weight:400;background:#000;color:#fff;
    padding:6px 12px;margin-bottom:16px;border:var(--border) solid #000;
  }
  .lead{font-size:1.1rem;max-width:660px;}
  .center{text-align:center;}
  .center .lead{margin-left:auto;margin-right:auto;}
  .hl{background:var(--green);color:#fff;padding:0 6px;box-decoration-break:clone;-webkit-box-decoration-break:clone;}
  .hl-y{background:var(--yellow);color:#000;padding:0 6px;box-decoration-break:clone;-webkit-box-decoration-break:clone;}
  .hl-k{background:#000;color:#fff;padding:0 6px;box-decoration-break:clone;-webkit-box-decoration-break:clone;}

  /* Pills / labels */
  .pill{
    display:inline-flex;align-items:center;gap:7px;text-transform:uppercase;
    font-size:.72rem;font-weight:800;letter-spacing:.04em;
    border:3px solid #000;background:#fff;padding:6px 12px;min-height:30px;
  }
  .pill .dot{font-size:.7rem;line-height:1;color:var(--green);}

  /* Buttons */
  .btn{
    display:inline-flex;align-items:center;gap:9px;justify-content:center;
    min-height:48px;padding:13px 22px;
    font-family:"Archivo Black","Arial Black",sans-serif;font-weight:400;
    text-transform:uppercase;letter-spacing:0;font-size:.95rem;
    border:var(--border) solid #000;cursor:pointer;background:#fff;color:#000;
    box-shadow:var(--shadow-sm);transition:transform .1s ease, box-shadow .1s ease;
  }
  /* Press: element nudges toward its shadow, shadow shrinks */
  .btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 #000;}
  .btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 #000;}
  .btn:focus-visible{outline:3px solid var(--green);outline-offset:3px;}
  .btn-wa{background:var(--green);color:#fff;}
  .btn-call{background:var(--yellow);color:#000;}
  .btn-outline{background:#fff;color:#000;}
  .btn svg{width:20px;height:20px;flex:0 0 auto;}

  /* Header */
  header.site{
    position:sticky;top:0;z-index:50;background:var(--cream);
    border-bottom:var(--border) solid #000;
  }
  .navbar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:70px;}
  .logo{display:flex;align-items:center;gap:10px;
    font-family:"Archivo Black","Arial Black",sans-serif;font-size:1.3rem;
    color:#000;letter-spacing:-.03em;text-transform:uppercase;}
  .logo svg{width:38px;height:38px;flex:0 0 auto;border:3px solid #000;}
  .nav-links{display:none;gap:20px;}
  .nav-links a{color:#000;font-weight:800;font-size:.92rem;text-transform:uppercase;letter-spacing:-.01em;}
  .nav-links a:hover{background:var(--yellow);}
  .nav-cta{display:flex;align-items:center;gap:10px;}
  .nav-cta .btn{padding:10px 15px;min-height:46px;font-size:.85rem;}
  .nav-cta .btn-icon .lbl{display:none;}
  @media(min-width:520px){.nav-cta .btn-icon .lbl{display:inline;}}
  @media(min-width:960px){.nav-links{display:flex;}}

  /* ============================ HERO ============================ */
  .hero{padding:52px 0 60px;}
  .hero-grid{display:grid;gap:var(--block-gap);align-items:center;}
  .hero h1{font-size:2.5rem;}
  .hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:24px;}
  .hero-panel{
    background:#fff;border:var(--border) solid #000;box-shadow:var(--shadow);
    padding:28px 26px;
  }
  .hero-note{
    margin-top:20px;font-size:.95rem;border:3px solid #000;background:var(--yellow);
    padding:12px 14px;font-weight:600;display:flex;align-items:flex-start;gap:9px;
  }
  .hero-note svg{width:20px;height:20px;flex:0 0 auto;margin-top:2px;}
  /* Word-rise entrance on the headline */
  .hero-title .w{display:inline-block;}
  .hero-media{position:relative;transform:rotate(-1.5deg);}
  .hero-frame{
    border:var(--border) solid #000;box-shadow:var(--shadow);background:#000;
    overflow:hidden;position:relative;aspect-ratio:4/5;
  }
  .hero-frame video,.hero-frame img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  }
  .hero-media .circle{
    position:absolute;width:118px;height:118px;border-radius:50%;background:var(--green);
    border:var(--border) solid #000;top:-20px;right:-14px;z-index:3;
    display:flex;align-items:center;justify-content:center;text-align:center;
    color:#fff;font-family:"Archivo Black",sans-serif;font-size:.82rem;line-height:1;
    text-transform:uppercase;transform:rotate(8deg);box-shadow:var(--shadow-sm);
  }
  .hero-media .tilt{
    position:absolute;bottom:-18px;left:-14px;background:var(--yellow);
    border:var(--border) solid #000;box-shadow:var(--shadow-sm);
    padding:10px 14px;transform:rotate(-4deg);z-index:3;
    font-family:"Archivo Black",sans-serif;text-transform:uppercase;font-size:.8rem;
  }
  @media(min-width:960px){
    .hero-grid{grid-template-columns:1.02fr .98fr;}
    .hero h1{font-size:3.1rem;}
    .hero-frame{aspect-ratio:4/5;height:100%;}
  }

  /* Marquee ticker */
  .marquee{
    background:#000;color:var(--cream);overflow:hidden;white-space:nowrap;
    border-bottom:var(--border) solid #000;
  }
  .marquee__track{
    display:inline-block;white-space:nowrap;padding:13px 0;
    font-family:"Archivo Black","Arial Black",sans-serif;text-transform:uppercase;
    font-size:1rem;letter-spacing:.02em;will-change:transform;
    animation:marq 26s linear infinite;
  }
  .marquee__track span{padding:0;}
  .marquee .dotm{color:var(--yellow);}
  @keyframes marq{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* ============================ FEATURES ============================ */
  .features{background:var(--white);}
  .cards{display:grid;gap:0;grid-template-columns:1fr;margin-top:38px;
    border:var(--border) solid #000;box-shadow:var(--shadow);background:#000;}
  @media(min-width:620px){.cards{grid-template-columns:1fr 1fr;}}
  @media(min-width:980px){.cards{grid-template-columns:1fr 1fr 1fr;}}
  .card{
    background:var(--cream);padding:24px;
    border-right:var(--border) solid #000;border-bottom:var(--border) solid #000;
    transition:background .12s ease;
  }
  .card:hover{background:#fff;}
  .card .idx{font-family:"Archivo Black",sans-serif;font-size:1.5rem;color:var(--green);
    display:inline-flex;align-items:center;gap:10px;}
  .card .rule{height:3px;background:#000;margin:10px 0 14px;}
  .card h3{margin-bottom:8px;}
  .card p{margin:0;font-size:.98rem;}

  /* ============================ ACTIVITIES ============================ */
  .act-grid{display:grid;gap:0;grid-template-columns:1fr;margin-top:38px;
    border:var(--border) solid #000;box-shadow:var(--shadow);}
  @media(min-width:740px){.act-grid{grid-template-columns:1fr 1fr;}}
  .act{background:#fff;border-right:var(--border) solid #000;border-bottom:var(--border) solid #000;
    display:flex;flex-direction:column;transition:background .12s ease;}
  .act:hover{background:var(--cream);}
  .act .ph{aspect-ratio:16/10;overflow:hidden;border-bottom:var(--border) solid #000;position:relative;background:#000;}
  .act .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
  .act:hover .ph img{transform:scale(1.05);}
  .act .body{padding:20px 22px;}
  .act .tag{font-family:"Archivo Black",sans-serif;font-size:.7rem;text-transform:uppercase;background:var(--yellow);border:2px solid #000;padding:3px 8px;display:inline-block;transform:rotate(-2deg);}
  .act h3{margin:12px 0 6px;}
  .act p{margin:0;font-size:.98rem;}

  /* ============================ SPLIT (parties / cafe) ============================ */
  .split{display:grid;gap:0;align-items:stretch;grid-template-columns:1fr;
    border:var(--border) solid #000;box-shadow:var(--shadow);background:#fff;margin-top:8px;}
  .split .txt{padding:34px 30px;display:flex;flex-direction:column;justify-content:center;
    border-bottom:var(--border) solid #000;}
  .split .txt .btn{align-self:flex-start;}
  .split .ph{position:relative;overflow:hidden;background:#000;aspect-ratio:4/3;}
  .split .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
  @media(min-width:880px){
    .split{grid-template-columns:1fr 1fr;}
    .split .txt{border-bottom:0;border-right:var(--border) solid #000;}
    .split .ph{aspect-ratio:auto;min-height:100%;}
    .split.rev .ph{order:2;}
    .split.rev .txt{order:1;border-right:0;border-left:var(--border) solid #000;}
  }
  .ticks{list-style:none;padding:0;margin:0 0 22px;}
  .ticks li{position:relative;padding-left:30px;margin-bottom:12px;font-weight:600;}
  .ticks li svg{position:absolute;left:0;top:2px;width:22px;height:22px;color:var(--green);}
  .parties{background:var(--white);}
  /* dashed inner border stitched look */
  .stitched{position:relative;}
  .stitched::after{
    content:"";position:absolute;inset:8px;border:2px dashed #000;pointer-events:none;z-index:2;
  }
  /* Box-in-a-box nesting */
  .nest{
    background:var(--green);border:var(--border) solid #000;box-shadow:var(--shadow);
    padding:22px;
  }
  .nest .split{box-shadow:none;margin-top:0;}
  @media(max-width:600px){.nest{padding:12px;}}

  /* ============================ GALLERY ============================ */
  .gallery{background:var(--green);color:#fff;}
  .gallery .eyebrow{background:var(--yellow);color:#000;}
  .gallery .hl-y{background:#fff;color:#000;}
  .grid-g{display:grid;gap:0;grid-template-columns:repeat(2,1fr);margin-top:38px;
    border:var(--border) solid #000;box-shadow:var(--shadow);}
  @media(min-width:780px){.grid-g{grid-template-columns:repeat(4,1fr);}}
  .grid-g .g{overflow:hidden;aspect-ratio:1/1;position:relative;background:#000;
    border-right:var(--border) solid #000;border-bottom:var(--border) solid #000;}
  .grid-g .g.wide{grid-column:span 2;aspect-ratio:2/1;}
  .grid-g img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .25s ease;}
  .grid-g .g:hover img{transform:scale(1.05);}

  /* ============================ BOOKS STRIP ============================ */
  .books{background:var(--yellow);}
  .books .wrap{display:grid;gap:var(--block-gap);align-items:center;grid-template-columns:1fr;}
  @media(min-width:840px){.books .wrap{grid-template-columns:1.15fr .85fr;}}
  .books .eyebrow{background:#000;color:#fff;}
  .books h2{color:#000;}
  .books p{color:#000;}
  .book-covers{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
  .book-covers img{width:100%;border:3px solid #000;box-shadow:var(--shadow-sm);background:#fff;}
  .books .btn-wa{background:#000;color:#fff;}

  /* ============================ FAQ ============================ */
  .faq details{
    background:#fff;border:var(--border) solid #000;margin-bottom:14px;
    box-shadow:var(--shadow-sm);transition:transform .1s ease, box-shadow .1s ease;
  }
  .faq summary{
    list-style:none;cursor:pointer;padding:18px 52px 18px 18px;font-weight:800;
    position:relative;font-size:1rem;text-transform:uppercase;letter-spacing:-.01em;min-height:44px;
  }
  .faq summary::-webkit-details-marker{display:none;}
  .faq summary::before{
    content:"\25A0";color:var(--green);margin-right:10px;font-size:.72rem;
    position:relative;top:-1px;
  }
  .faq details:nth-child(even) summary::before{color:var(--yellow);}
  .faq summary::after{
    content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);
    font-family:"Archivo Black",sans-serif;font-size:1.4rem;line-height:1;
  }
  .faq details[open] summary::after{content:"\2212";}
  .faq details[open] summary{background:var(--green);color:#fff;border-bottom:3px solid #000;}
  .faq details[open] summary::before{color:#fff;}
  .faq .ans{padding:16px 18px;}
  .faq .ans p{margin:0;}

  /* ============================ LOCATION ============================ */
  .location{background:var(--white);}
  .loc-grid{display:grid;gap:0;grid-template-columns:1fr;margin-top:38px;
    border:var(--border) solid #000;box-shadow:var(--shadow);background:#fff;}
  @media(min-width:880px){.loc-grid{grid-template-columns:1fr 1fr;}}
  .loc-info{padding:30px 28px;border-bottom:var(--border) solid #000;}
  @media(min-width:880px){.loc-info{border-bottom:0;border-right:var(--border) solid #000;}}
  .loc-info .row{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px;}
  .loc-info .row svg{width:24px;height:24px;color:#000;flex:0 0 auto;margin-top:2px;}
  .loc-info .row b{display:block;margin-bottom:2px;text-transform:uppercase;font-family:"Archivo Black",sans-serif;font-size:.85rem;}
  .map-frame{overflow:hidden;min-height:340px;background:#fff;}
  .map-frame iframe{width:100%;height:100%;min-height:360px;border:0;display:block;}

  /* ============================ REVIEWS ============================ */
  .reviews{background:var(--cream);}
  .rev-note{
    background:#fff;border:var(--border) solid #000;box-shadow:var(--shadow);
    padding:30px 26px;text-align:center;max-width:660px;margin:24px auto 0;position:relative;
  }
  .rev-note p{margin:0;font-weight:600;}
  .rev-note a{font-weight:800;background:var(--yellow);padding:0 5px;}

  /* ============================ FOOTER ============================ */
  footer.site{background:#000;color:#fff;padding:56px 0 60px;border-top:var(--border) solid #000;}
  .foot-grid{display:grid;gap:32px;grid-template-columns:1fr;}
  @media(min-width:780px){.foot-grid{grid-template-columns:1.3fr 1fr 1fr;}}
  footer.site .logo{color:#fff;margin-bottom:14px;}
  footer.site .logo svg{border-color:#fff;}
  footer.site h4{color:var(--yellow);margin:0 0 14px;}
  footer.site a{color:#fff;}
  footer.site a:hover{background:var(--green);}
  .foot-links{list-style:none;padding:0;margin:0;}
  .foot-links li{margin-bottom:10px;font-weight:600;}
  .foot-contact div{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;font-size:.96rem;}
  .foot-contact svg{width:19px;height:19px;color:var(--yellow);flex:0 0 auto;margin-top:2px;}
  .copyright{border-top:3px solid var(--yellow);margin-top:34px;padding-top:20px;font-size:.86rem;font-weight:600;}

  /* ============================ STICKY MOBILE BAR ============================ */
  .mobar{
    position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:0;
    background:#fff;border-top:var(--border) solid #000;
  }
  .mobar a{
    flex:1;display:flex;align-items:center;justify-content:center;gap:8px;
    min-height:58px;font-family:"Archivo Black","Arial Black",sans-serif;
    text-transform:uppercase;font-size:1rem;
  }
  .mobar .m-wa{background:var(--green);color:#fff;border-right:var(--border) solid #000;}
  .mobar .m-call{background:var(--yellow);color:#000;}
  .mobar svg{width:21px;height:21px;}
  @media(min-width:960px){.mobar{display:none;}}

  /* ============================ SCROLL-REVEAL ANIMATION ============================ */
  .reveal{opacity:0;transform:translateY(26px);
    transition:opacity .45s cubic-bezier(.2,.7,.2,1), transform .45s cubic-bezier(.2,.7,.2,1);}
  .reveal.in{opacity:1;transform:none;}

  /* ============================ INTENTIONAL ROTATION ACCENTS ============================ */
  /* Kept sparingly: highlight knockout blocks + hero badges + activity tags only */
  .ibk,.ibk-y,.ibk-g{
    display:inline-block;padding:.03em .28em;line-height:1;border-radius:0;
    -webkit-box-decoration-break:clone;box-decoration-break:clone;
  }
  .ibk{background:#000;color:var(--cream);transform:rotate(-1.5deg);}
  .ibk-y{background:var(--yellow);color:#000;transform:rotate(1.5deg);}
  .ibk-g{background:var(--green);color:#fff;transform:rotate(-1.5deg);}
  .eyebrow{transform:rotate(-1deg);}

  /* Asymmetric section head */
  .sec-head{
    display:grid;gap:18px;grid-template-columns:1fr;align-items:end;
    text-align:left;margin-bottom:6px;
  }
  .sec-head .sh-title h2{margin-bottom:0;}
  .sec-head .sh-copy .lead{margin:0;max-width:none;}
  @media(min-width:820px){
    .sec-head{grid-template-columns:64% 36%;gap:var(--block-gap);}
  }

  /* ============================ JUNGLE DECOR LAYER ============================ */
  /* Flat, black-outlined jungle accents sit BEHIND content (z-index:0) inside a
     clipped layer, so they never cover headlines, photos or CTAs and never cause
     horizontal overflow. Content wraps stay above at z-index:1. */
  .deco-host{position:relative;}
  .deco-host > .wrap{position:relative;z-index:1;}
  .deco-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
  .deco{position:absolute;pointer-events:none;}
  .dsvg{display:block;width:100%;height:100%;overflow:visible;}
  /* Leaf colour variants driven by currentColor on reusable leaf symbols */
  .lf-green{color:var(--green);}
  .lf-greend{color:var(--green-dark);}
  .lf-yellow{color:var(--yellow);}
  .lf-cream{color:var(--cream);}
  .lf-orange{color:var(--orange);}

  /* Playful micro-motion (kept snappy, no layout shift) */
  @keyframes wwSway{0%,100%{transform:rotate(-3.5deg);}50%{transform:rotate(3.5deg);}}
  @keyframes wwBob{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
  .ww-sway{transform-origin:top center;animation:wwSway 4.6s ease-in-out infinite;}
  .ww-sway.s2{animation-duration:5.5s;animation-delay:-1.4s;}
  .ww-bob{animation:wwBob 3.3s ease-in-out infinite;}
  .ww-bob.b2{animation-duration:4s;animation-delay:-1.1s;}

  /* Monkey peeks on scroll-reveal (rides the existing .reveal.in system) */
  .card{overflow:visible;}
  .ww-peek{transform:translateY(42px) rotate(-4deg);opacity:0;
    transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .45s ease;}
  .reveal.in .ww-peek{transform:translateY(0) rotate(-4deg);opacity:1;}

  /* Repeating leaf divider band */
  .leaf-strip{background:var(--green);border-top:var(--border) solid #000;
    border-bottom:var(--border) solid #000;overflow:hidden;height:46px;
    display:flex;align-items:center;justify-content:center;gap:22px;}
  .leaf-strip svg{width:30px;height:30px;flex:0 0 auto;display:block;}
  @media(max-width:600px){.leaf-strip{height:36px;gap:12px;}.leaf-strip svg{width:24px;height:24px;}}

  /* Mobile: thin out the decor so nothing clutters or overflows at 375px */
  @media(max-width:820px){.deco.m-hide{display:none;}}
  @media(max-width:600px){.deco.s-hide{display:none;}}

  /* ============================ MOBILE SCALING ============================ */
  @media(max-width:959px){
    :root{--shadow:5px 5px 0 #000;--shadow-sm:3px 3px 0 #000;--sp:52px;--gutter:16px;--block-gap:28px;}
    footer.site{padding-bottom:90px;}
    body{padding-bottom:0;}
  }
  @media(max-width:600px){
    h1,.hero h1{font-size:2.05rem;}
    h2{font-size:1.55rem;}
    .hero{padding:34px 0 44px;}
    .hero-media{transform:none;margin-top:8px;}
    .hero-frame{aspect-ratio:3/4;}
    .hero-media .circle{width:96px;height:96px;font-size:.72rem;top:-14px;right:-8px;}
    .hero-media .tilt{font-size:.72rem;padding:8px 11px;bottom:-14px;left:-8px;}
    .hero-cta .btn,.split .txt .btn{width:100%;}
    .lead{font-size:1.02rem;}
  }

  @media(prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    .reveal{opacity:1;transform:none;transition:none;}
    .marquee__track{animation:none;}
    .hero-title .w{opacity:1 !important;transform:none !important;animation:none !important;}
    .btn:hover,.card:hover,.act:hover{transform:none;}
    .ww-sway,.ww-bob{animation:none !important;}
    .ww-peek{transition:none !important;opacity:1;transform:translateY(0) rotate(-4deg);}
  }