/* Approved Get involved design, scoped to its Elementor shortcode. */
@scope (.em-involved-page) {
/* Get involved page styles. */
  
  :scope { --cream:#F0EBDD; --page:#FAF9F4; --sage:#E3EBE2; --dark:#102A1B; --ink:#14291D; --deep:#102A1B; --deeper:#0B2115; --body:#5C6B61; --green:#23843B; --sun:#F5DC9F; --sunD:#F5DC9F; --gold:#D9A441; --line:#E1E6DD;
          --font-head:'Newsreader', Georgia, serif; --font-body:'Geist', Arial, sans-serif; }
  * { box-sizing:border-box; } 
  :scope { margin:0; background:var(--page); font-family:var(--font-body); color:var(--ink); overflow-x:hidden; }
  .shell { max-width:1120px; margin:0 auto; padding:0 20px; }
  .eyebrow { display:flex; align-items:center; gap:14px; color:var(--green); font-weight:700; font-size:13px; letter-spacing:.2em; text-transform:uppercase; margin:0 0 16px; }
  .eyebrow::before { content:""; width:34px; height:2px; background:currentColor; }
  h1, h2 { font-family:var(--font-head); font-weight:500; letter-spacing:-.02em; line-height:1.04; margin:0; } h2 { font-size:clamp(32px,4.8vw,50px); }
  .lead { font-size:clamp(17px,2.2vw,20px); line-height:1.65; color:var(--body); margin:0; }
  .rise { opacity:0; transform:translateY(28px); transition:opacity .7s, transform .9s cubic-bezier(.2,.8,.3,1); transition-delay:calc(var(--d,0) * .12s); } .in .rise { opacity:1; transform:none; }
  .fill { display:inline-flex; align-items:center; gap:10px; background:var(--green); color:#fff; font:600 16px var(--font-body); padding:14px 20px; border-radius:3px; text-decoration:none; transition:transform .3s cubic-bezier(.3,1.7,.5,1); } .fill:hover { transform:translateY(-2px) rotate(-1deg); }
  .lk { display:inline-flex; align-items:center; gap:10px; font:600 16px/1.2 var(--font-body); color:var(--ink); text-decoration:none; }
  .lk svg, .fill svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; flex:none; }
  .lk-u { padding-bottom:5px; background:linear-gradient(var(--sunD),var(--sunD)) 0 100% / 0 4px no-repeat, linear-gradient(currentColor,currentColor) 0 100% / 100% 1.5px no-repeat; transition:background-size .45s cubic-bezier(.2,.8,.3,1); } .lk-u:hover { background-size:100% 4px, 100% 1.5px; }
  .lk-t .tr { display:inline-flex; align-items:center; } .lk-t .tr i { display:block; height:2px; width:14px; background:currentColor; border-radius:2px; transition:width .35s cubic-bezier(.3,1.6,.5,1); } .lk-t .tr svg { width:11px; height:11px; margin-left:-9px; stroke-width:2.4; } .lk-t:hover .tr i { width:38px; }
  .mk { background:linear-gradient(var(--sunD),var(--sunD)) 0 90% / 0 34% no-repeat; padding:0 4px; margin:0 -4px; transition:background-size .8s ease .5s; } .in .mk { background-size:100% 34%; }

  /* scroll progress with a leaf riding the end */
  .prog { position:fixed; top:0; left:0; right:0; height:4px; z-index:70; background:rgba(20,41,29,.06); } .prog i { position:absolute; inset:0; background:var(--green); transform-origin:left; transform:scaleX(var(--p,0)); }
  .prog b { position:absolute; top:-8px; left:calc(var(--p,0) * (100% - 22px)); width:22px; height:22px; border-radius:50%; background:var(--green); display:grid; place-items:center; box-shadow:0 2px 0 rgba(0,0,0,.15); } .prog b svg { width:12px; height:12px; fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

  /* A photo band right under the menu. */
  .cover { position:relative; background:var(--cream); }
  .crumb { display:flex; align-items:center; gap:10px; margin:0 0 14px; font-size:13px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(241,235,221,.85); } .crumb a { color:inherit; text-decoration:none; } .crumb a:hover { text-decoration:underline; text-underline-offset:4px; } .crumb i { width:5px; height:5px; border-radius:50%; background:var(--gold); }
  .cover h1 { font-size:clamp(56px,10.5vw,124px); line-height:.94; letter-spacing:-.035em; margin:0; } .cover h1 em { font-style:italic; color:var(--gold); }
  /* the cover photo */
  .cv.a { position:relative; height:clamp(400px,66vh,620px); overflow:hidden; background:var(--deeper); color:#fff; }
  /* The shared backdrop component frames the cover image. */
  .cv.a::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,38,25,.25) 0%,rgba(12,38,25,.2) 35%,rgba(12,38,25,.86) 100%); }
  .cv.a .ttl { position:absolute; z-index:2; left:0; right:0; bottom:0; padding-bottom:72px; }
  .tcap { display:none; position:absolute; z-index:3; right:24px; bottom:84px; max-width:250px; background:var(--sun); color:var(--ink); padding:16px 20px 14px; font-family:'Caveat',cursive; font-weight:600; font-size:25px; line-height:1.1; rotate:3deg; box-shadow:0 12px 24px rgba(0,0,0,.25); } .tcap::before { content:""; position:absolute; top:-12px; left:50%; width:84px; height:24px; margin-left:-42px; background:rgba(255,255,255,.7); rotate:-3deg; } @media (min-width:900px) { .tcap { display:block; } }
  /* the next section slides over the photo like a sheet of paper */
  .sheet { position:relative; z-index:2; margin-top:-32px; border-radius:32px 32px 0 0; background:var(--page); }
  /* ===== APPROACH: a path that draws itself, with a little marker walking along it ===== */
  .appr { padding:84px 0 96px; background:var(--cream); }
  .tl { position:relative; display:grid; gap:44px; margin-top:52px; } @media (min-width:860px) { .tl { grid-template-columns:repeat(3,1fr); gap:44px; margin-top:64px; } }
  .pth { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
  .pth path { fill:none; stroke-linecap:round; stroke-linejoin:round; } .pth .bg { stroke:#AEBBAF; stroke-width:3; stroke-dasharray:1 10; } .pth .fg { stroke:var(--deep); stroke-width:3.5; }
  .walker { position:absolute; left:-15px; top:-15px; width:30px; height:30px; border-radius:50%; background:var(--gold); display:grid; place-items:center; box-shadow:0 3px 0 rgba(12,38,25,.25); z-index:2; } .walker svg { width:16px; height:16px; fill:none; stroke:var(--deeper); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; animation:em-involved-bob 2.4s ease-in-out infinite; }
  .tn { position:relative; z-index:1; padding-left:96px; } .tn:nth-of-type(2) .nd { left:24px; }
  .nd { position:absolute; left:0; top:0; width:60px; height:60px; border-radius:50%; background:var(--cream); border:2px solid var(--deep); display:grid; place-items:center; font-family:var(--font-head); font-style:italic; font-size:24px; color:var(--deep); transition:background .4s, color .4s, transform .5s cubic-bezier(.3,2.2,.5,1), box-shadow .4s; }
  .nd.on { background:var(--deep); color:var(--cream); transform:scale(1.1); box-shadow:0 0 0 6px rgba(217,164,65,.38); }
  .tn .lab { font-size:12px; font-weight:700; letter-spacing:.18em; color:var(--green); margin:6px 0 8px; } .tn h3 { font-family:var(--font-head); font-weight:500; font-size:clamp(26px,3vw,32px); line-height:1.1; margin:0 0 10px; } .tn p { margin:0; font-size:16.5px; line-height:1.6; color:var(--body); max-width:380px; }
  @media (min-width:860px) { .tn { padding-left:0; } .nd { position:relative; left:auto !important; margin-bottom:22px; } .tn:nth-of-type(1) .nd { margin-top:34px; } .tn:nth-of-type(2) .nd { margin-top:100px; } .tn:nth-of-type(3) .nd { margin-top:10px; } .tn .lab { margin-top:0; } }

  
  /* ===== GET INVOLVED ===== */
  @keyframes em-involved-bob { 50% { transform:translateY(-9px) rotate(1.2deg); } }
  .sheet { padding:72px 0 8px; } .sh { display:grid; gap:14px; margin-bottom:34px; } @media (min-width:860px) { .sh { grid-template-columns:1fr 1fr; align-items:end; gap:56px; } }
  .intro2 { display:grid; gap:22px; } @media (min-width:860px) { .intro2 { grid-template-columns:1fr 1fr; gap:64px; align-items:start; } }
  .intro2 h2 { font-size:clamp(34px,5vw,54px); } .intro2 .txt { margin:0 0 16px; font-size:18px; line-height:1.65; color:var(--body); max-width:520px; }
  .direct { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin:0; font-size:16px; color:var(--body); }
  .ways { padding:56px 0 84px; } .wgrid { display:grid; gap:20px; } @media (min-width:860px) { .wgrid { grid-template-columns:repeat(3,1fr); gap:22px; } }
  .way { position:relative; display:flex; flex-direction:column; background:var(--c); border-radius:22px; padding:26px 24px 26px; min-height:340px; opacity:0; transform:translateY(46px) rotate(var(--r)); transition:opacity .5s calc(var(--i) * .14s), transform .9s cubic-bezier(.3,1.5,.5,1) calc(var(--i) * .14s), box-shadow .3s; }
  .in .way { opacity:1; transform:none; } .in .way:hover { transform:translateY(-6px) rotate(-.6deg); box-shadow:0 14px 0 var(--cs); transition-delay:0s; }
  .way .no { font-size:12px; font-weight:700; letter-spacing:.16em; color:#4A5B4E; } .way .disc { position:absolute; top:20px; right:20px; width:58px; height:58px; border-radius:50%; background:rgba(255,255,255,.65); display:grid; place-items:center; animation:em-involved-bob 5s ease-in-out infinite; } .way .disc svg { width:27px; height:27px; fill:none; stroke:var(--ink); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
  .way .word { display:block; margin:46px 0 14px; font-family:var(--font-head); font-style:italic; font-size:clamp(56px,7vw,76px); line-height:.95; letter-spacing:-.03em; color:#46584B; }
  .way h3 { font-family:var(--font-head); font-weight:600; font-size:26px; margin:0 0 10px; } .way p { margin:0 0 12px; font-size:16px; line-height:1.55; color:#34463A; }
  .mlink { margin-top:auto; align-self:flex-start; font:inherit; font-weight:600; font-size:15.5px; color:var(--ink); background:linear-gradient(rgba(255,255,255,.75),rgba(255,255,255,.75)) 0 100% / 100% 34% no-repeat; border:0; padding:2px 4px; margin-left:-4px; border-radius:3px; cursor:pointer; display:inline-flex; align-items:center; gap:9px; transition:background-size .35s cubic-bezier(.2,.8,.3,1); } .mlink:hover { background-size:100% 100%; }
  .mlink svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:transform .3s cubic-bezier(.3,1.8,.5,1); } .mlink:hover svg { transform:translate(3px,-3px); } .mlink:focus-visible { outline:3px solid var(--green); outline-offset:3px; }
  .cta { position:relative; overflow:hidden; background:var(--deep); color:var(--cream); padding:84px 0 92px; }
  .cta::before { content:""; position:absolute; right:-90px; top:-110px; width:320px; height:320px; border-radius:50%; border:1.5px solid rgba(241,235,221,.14); animation:em-involved-bob 7s ease-in-out infinite; }
  .cta .shell { position:relative; display:grid; gap:34px; align-items:center; } @media (min-width:900px) { .cta .shell { grid-template-columns:1.25fr 1fr; gap:72px; } }
  .cta .eyebrow { color:#9ED8A8; } .cta h2 { color:#fff; font-size:clamp(34px,5vw,54px); } .cta h2 em { font-style:italic; color:var(--gold); } .cta p.t { margin:16px 0 0; color:rgba(241,235,221,.8); font-size:17.5px; line-height:1.6; max-width:460px; }
  .cact { display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:14px; }
  .gbtn { display:inline-flex; align-items:center; gap:10px; font:600 16px/1.2 var(--font-body); color:var(--ink); background:var(--gold); border:0; border-radius:3px; padding:14px 20px; cursor:pointer; transition:transform .3s cubic-bezier(.3,1.7,.5,1); } .gbtn:hover { transform:translateY(-2px) rotate(-1deg); background:var(--sun); } .gbtn svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; } .gbtn:focus-visible { outline:3px solid #9ED8A8; outline-offset:3px; }
  .cact .note { margin:0; font-size:13.5px; color:rgba(241,235,221,.7); } .cact .alt { color:#9ED8A8; font-weight:600; text-decoration:none; font-size:15.5px; margin-top:6px; } .cact .alt:hover { text-decoration:underline; text-underline-offset:4px; }
  .tcap { display:block; } @media (max-width:899px) { .tcap { display:none; } }
  @media (prefers-reduced-motion: reduce) { * { animation:none !important; transition:none !important; } .way { opacity:1; transform:none; } }

  
}
.em-involved-page :is(h1,h2,h3) {font-family:var(--em-font-heading,Newsreader,Georgia,serif)!important;}

/* Elementor Kit and Caridad provide explicit global heading/button colours.
   Keep the approved page treatments local rather than changing Site Settings. */
.em-site .em-involved-page .cover h1 {color:#fff!important;}
.em-site .em-involved-page .cover h1 em {color:#D9A441!important;}
.em-site .em-involved-page .way .mlink {
  display:inline-flex!important;
  width:fit-content!important;
  min-height:0!important;
  padding:2px 4px!important;
  border:0!important;
  border-radius:3px!important;
  box-shadow:none!important;
  background-color:transparent!important;
  background-image:linear-gradient(rgba(255,255,255,.75),rgba(255,255,255,.75))!important;
  background-position:0 100%!important;
  background-size:100% 34%!important;
  background-repeat:no-repeat!important;
  color:#14291D!important;
  text-transform:none!important;
  font:600 15.5px/1.2 var(--em-font-body,Geist,Arial,sans-serif)!important;
}
.em-site .em-involved-page .way .mlink:is(:hover,:focus-visible) {background-size:100% 100%!important;}
.em-site .em-involved-page .cta .gbtn {
  display:inline-flex!important;
  width:fit-content!important;
  padding:14px 20px!important;
  border:0!important;
  border-radius:3px!important;
  box-shadow:none!important;
  background:#D9A441!important;
  color:#14291D!important;
  text-transform:none!important;
  font:600 16px/1.2 var(--em-font-body,Geist,Arial,sans-serif)!important;
}
.em-site .em-involved-page .cta .gbtn:is(:hover,:focus-visible) {background:#F5DC9F!important;transform:translateY(-2px) rotate(-1deg)!important;}