/*
Theme Name: Ekaaya
Version: 1.0	
*/

  :root {
    --cream: #FAF3E6;
    --sienna-ink: #8F5117;
    --olive-ink: #5F5D20;
    --olive-disp: #75722B;
    --cream-deep: #F2E9D7;
    --kraft: #EADCC0;
    --ink: #3F4435;
    --ink-soft: #5C5A48;
    --olive-dark: #50503F;
    --sienna: #A96A2A;
    --gold: #E3A82A;
    --olive: #878432;
    --rust: #C3782A;
    --bronze: #B6883B;
    --gold-v: #F5B315;
    --olive-v: #9BA82E;
    --rust-v: #E07B2A;
    --sienna-v: #CE8636;
    --sky-v: #8FBBD9;
    --terracotta-band: #D98544;
    --olive-band: #7C8A3A;
    --gold-band: #EAB94A;
    --cream-warm: #FBEDD4;
    --pad: clamp(4rem,8.5vw,8.5rem);
    --t-hero: clamp(2.5rem,5vw,5.9rem);
    --t-h2: clamp(1.9rem,3.3vw,3rem);
    --t-h3: clamp(1.1rem,1.35vw,1.3rem);
    --t-lead: clamp(1.05rem,1.25vw,1.3rem);
    --t-body: clamp(1rem,1.05vw,1.12rem);
    --t-small: clamp(.9rem,.95vw,1rem);
    --t-hand: clamp(1.2rem,1.7vw,1.6rem);
    --sp-1: .5rem;
    --sp-2: 1rem;
    --sp-3: 1.6rem;
    --sp-4: 2.4rem;
    --sp-5: 3.4rem;
    --measure: 34rem;
	  --hand: 'Caveat', cursive;
	      --terra: #9C5D1B;
	  --disp: 'Bricolage Grotesque', system-ui, sans-serif;
}

  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
  }

  :focus-visible {
    outline: none;
    outline-offset: 0;
    border-radius: 0;
  }

  .skip {
    position: absolute;
    left: -9999px;
    top: 0;
    background: var(--ink);
    color: var(--cream);
    padding: .7em 1.2em;
    z-index: 999;
    border-radius: 0 0 8px 0
  }

  .skip:focus {
    left: 0
  }

  html {
    scroll-behavior: smooth
  }

  body {
    background: var(--cream);
    color: var(--ink);
    font-family: 'Nunito Sans', sans-serif;
    overflow-x: hidden
  }

  /* ===== TOP HEADER (Greenhill pattern) ===== */
  .topbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 70;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: .9rem clamp(1.2rem, 3.5vw, 3rem);
    background: transparent;
    transition: background .4s ease, box-shadow .4s ease, padding .4s ease
  }

  .tb-logo {
    position: relative;
    display: block;
    line-height: 0;
    justify-self: center
  }

  .tb-logo img {
    height: 64px;
    width: auto;
    display: block;
    transition: height .4s ease, opacity .9s ease
  }

  .tb-right {
    display: flex;
    align-items: center;
    gap: .8rem;
    justify-self: end
  }

  .tb-btn {
    font-weight: 700;
    font-size: .92rem;
    text-decoration: none;
    border-radius: 10px;
    padding: .62em 1.3em;
    transition: color .9s ease, border-color .9s ease, background .25s ease, transform .25s ease
  }

  .tb-btn.ghost {
    color: var(--ink);
    border: 2px solid rgba(63, 68, 53, .45);
    background: rgba(250, 243, 230, .35)
  }

  .tb-btn.ghost:hover {
    border-color: var(--rust-v);
    color: var(--rust-v)
  }

  .tb-btn.solid {
    background: var(--rust-v);
    color: #fff
  }

  .tb-btn.solid:hover {
    background: #c96820
  }

  .tb-menu {
    display: flex;
    align-items: center;
    gap: .55rem;
    border: none;
    background: none;
    cursor: pointer;
    justify-self: start;
    font-family: inherit;
    font-weight: 700;
    font-size: .95rem;
    color: var(--ink);
    padding: .5em .4em;
    transition: color .9s ease
  }

  .tb-menu .bars {
    display: flex;
    flex-direction: column;
    gap: 4.5px
  }

  .tb-menu .bars i {
    display: block;
    width: 22px;
    height: 2.4px;
    background: var(--ink);
    border-radius: 2px;
    transition: transform .3s, background .9s ease
  }

  .tb-menu:hover .bars i:nth-child(1) {
    transform: translateY(-1px)
  }

  body.scrolled .topbar {
    background: rgba(250, 243, 230, .95);
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 18px rgba(60, 60, 45, .1);
    padding-top: .55rem;
    padding-bottom: .55rem
  }

  body.scrolled .topbar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 4px;
    background: linear-gradient(90deg, var(--sienna) 0 20%, var(--gold) 20% 40%, var(--olive) 40% 60%, var(--rust) 60% 80%, var(--bronze) 80% 100%)
  }
.campus-hero {
    padding-top: 150px !important;
}
  body.scrolled .tb-logo img {
    height: 48px
  }

  @media (max-width:900px) {
    .tb-btn.ghost {
      display: none
    }

    .tb-btn.solid {
      font-size: .82rem;
      padding: .55em 1em
    }

    .tb-logo img {
      height: 48px
    }

    body.scrolled .tb-logo img {
      height: 42px
    }
  }

  /* ===== MEGA MENU ===== */
  .megamenu {
    position: fixed;
    inset: 0;
    z-index: 90;
    background: var(--cream);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .35s ease
  }

  .megamenu.open {
    opacity: 1;
    pointer-events: auto
  }

  .mm-close {
    position: absolute;
    top: 1.4rem;
    right: 2rem;
    font-size: 2.4rem;
    border: none;
    background: none;
    color: var(--ink);
    cursor: pointer
  }

  .mm-links {
    display: flex;
    flex-direction: column;
    gap: clamp(.6rem, 2vh, 1.4rem);
    text-align: center
  }

  .mm-links a {
    max-width: none;
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    color: var(--ink);
    text-decoration: none;
    font-size: clamp(2rem, 5.4vh, 3.4rem);
    position: relative;
    display: inline-block;
    padding-bottom: 4px;
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .4s ease, transform .4s ease
  }

  .megamenu.open .mm-links a {
    opacity: 1;
    transform: none
  }

  .megamenu.open .mm-links a:nth-child(2) {
    transition-delay: .05s
  }

  .megamenu.open .mm-links a:nth-child(3) {
    transition-delay: .1s
  }

  .megamenu.open .mm-links a:nth-child(4) {
    transition-delay: .15s
  }

  .megamenu.open .mm-links a:nth-child(5) {
    transition-delay: .2s
  }

  .megamenu.open .mm-links a:nth-child(6) {
    transition-delay: .25s
  }

  .mm-links a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: 0;
    height: 5px;
    background: radial-gradient(circle 2.5px at 4px 50%, var(--gold) 96%, transparent) repeat-x;
    background-size: 11px 8px;
    transition: right .35s ease-out
  }

  .mm-links a:hover::after {
    right: 0
  }

  .mm-links .mm-cta {
    font-size: clamp(1.1rem, 2.4vh, 1.4rem);
    background: var(--rust-v);
    color: #fff;
    border-radius: 12px;
    padding: .7em 1.6em;
    margin-top: 1rem;
    align-self: center
  }

  .mm-links .mm-cta::after {
    display: none
  }

  .mm-peek {
    position: absolute;
    width: 56px;
    right: -64px;
    top: -18px;
    transform: rotate(8deg)
  }

  .mm-sleeper {
    position: absolute;
    left: 4%;
    bottom: 3%;
    width: 120px
  }

  .mm-bf {
    position: absolute;
    top: 12%;
    right: 10%;
    width: 52px;
    animation: hover 4s ease-in-out infinite
  }

  h1,
  h2,
  h3 {
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.1
  }

  h2 {
    font-size: var(--t-h2);
    max-width: 22ch
  }

  p {
    line-height: 1.7;
    color: var(--ink-soft);
    font-size: var(--t-body)
  }

  img {
    display: block;
    max-width: 100%
  }

  .wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1.25rem, 4vw, 3rem)
  }

  .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    background: var(--rust);
    color: #FFF9EE;
    font-weight: 700;
    font-size: 1.18rem;
    padding: 0.9em 2em;
    border-radius: 10px;
    text-decoration: none;
    transition: background .25s, transform .2s;
}

  .btn:hover {
    background: #c96820;
    transform: translateY(-1px);
}

  .btn:focus-visible {
    outline: 3px solid var(--ink);
    outline-offset: 3px
  }

  .pulse {
    animation: ctapulse 6s 3s ease-in-out infinite
  }

  @keyframes ctapulse {

    0%,
    88%,
    100% {
      box-shadow: 0 0 0 0 rgba(195, 120, 42, 0)
    }

    92% {
      box-shadow: 0 0 0 9px rgba(195, 120, 42, .18)
    }

    96% {
      box-shadow: 0 0 0 0 rgba(195, 120, 42, 0)
    }
  }

  .hand {
    font-family: 'Caveat', cursive;
    color: var(--sienna)
  }

  /* wavy underline: svg draws in when .inview */
  .uw {
    position: relative;
    display: inline-block
  }

  .uw svg {
    position: absolute;
    left: 0;
    bottom: -0.16em;
    width: 100%;
    height: 0.2em;
    overflow: visible
  }

  .uw svg path {
    fill: none;
    stroke-width: 4.5;
    stroke-linecap: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    transition: stroke-dashoffset 0.9s ease-out 0.35s
  }

  .inview .uw svg path,
  .uw.inview svg path {
    stroke-dashoffset: 0
  }

  /* reveal system */
  .rv {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .6s ease-out, transform .6s ease-out
  }

  .rv.inview {
    opacity: 1;
    transform: none
  }

  .rv.d1 {
    transition-delay: .08s
  }

  .rv.d2 {
    transition-delay: .16s
  }

  .rv.d3 {
    transition-delay: .24s
  }

  .rv.d4 {
    transition-delay: .32s
  }

  /* NAV */

  /* HERO */
  .hero {
    position: relative;
    min-height: 100vh;
    min-height: 100svh;
    display: grid;
    align-items: center;
    overflow: hidden;
    padding: calc(clamp(1.5rem, 4vw, 4rem) + 78px) 0 clamp(1.5rem, 4vw, 4rem)
  }

  .hero {
    transition: background 1.25s ease
  }

  .hero-sky {
    position: absolute;
    inset: 0;
    z-index: 0;
    transition: background 1.25s ease;
    pointer-events: none
  }

  .hero-sky::after {
    content: "";
    position: absolute;
    inset: 0;
    transition: background 1.25s ease;
    background: radial-gradient(120% 80% at var(--sunx, 82%) var(--suny, 18%), rgba(255, 214, 120, var(--glow, .35)) 0%, transparent 55%)
  }

  /* the orb never crosses the copy column */
  .tod-picker[hidden] {
    display: none
  }

  .tod-picker {
    position: absolute;
    top: 108px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 75;
    background: rgba(255, 255, 255, .9);
    border-radius: 24px;
    padding: 5px;
    display: flex;
    gap: 3px;
    align-items: center;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .12)
  }

  .tod-picker .tp-label {
    font-size: .72rem;
    opacity: .55;
    padding: 0 .5em;
    font-weight: 700
  }

  .tod-picker button {
    border: none;
    background: none;
    padding: .4em .85em;
    border-radius: 18px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 700;
    font-size: .78rem;
    color: var(--ink)
  }

  .tod-picker button.on {
    background: var(--rust-v);
    color: #fff
  }

  .hero-lede {
    max-width: 32rem;
    margin: var(--sp-3) 0 0;
    font-size: var(--t-lead);
    line-height: 1.65;
    color: var(--subc, var(--ink-soft));
    transition: color 1.25s ease
  }

  .hero-cta-row {
    display: flex;
    align-items: center;
    gap: clamp(.9rem, 1.5vw, 1.5rem);
    flex-wrap: wrap;
    margin-top: var(--sp-4)
  }

  .hero-cta {
    margin-top: 0
  }

  .hero-facts {
    margin: 0;
    font-size: var(--t-small);
    font-weight: 700;
    letter-spacing: .015em;
    color: var(--sienna);
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    transition: color 1.25s ease;
    white-space: nowrap
  }

  .hero-facts::before {
    content: "";
    flex: 0 0 auto;
    width: 9px;
    height: 11px;
    border-radius: 50%/54%;
    background: repeating-radial-gradient(ellipse at 50% 52%, transparent 0 1.4px, currentColor 1.4px 2.6px)
  }

  .hero .wrap {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1280px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
    gap: 2rem;
    align-items: center
  }

  .hero-scene {
    position: relative;
    min-height: clamp(330px, 48vh, 520px)
  }

  /* stage: characters normalized by HEIGHT so props don't distort scale */
  /* The school appears because the children are there. A different place each hour. */
  .sk {
    position: absolute;
    right: -10%;
    bottom: 4%;
    width: 130%;
    max-width: none;
    height: auto;
    z-index: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 1.9s ease;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 20%, #000 84%, transparent 100%),
      linear-gradient(90deg, transparent 0%, #000 15%, #000 100%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
    mask-image: linear-gradient(180deg, transparent 0%, #000 20%, #000 84%, transparent 100%),
      linear-gradient(90deg, transparent 0%, #000 15%, #000 100%)
  }

  body[data-tod="morning"] .sk-morning {
    opacity: .30
  }

  body[data-tod="noon"] .sk-noon {
    opacity: .34
  }

  body[data-tod="evening"] .sk-evening {
    opacity: .30;
    filter: sepia(.2)
  }


  /* the schoolyard: hopscotch on the ground */
  .hero-hop {
    position: absolute;
    left: 14%;
    bottom: 1%;
    width: 12%;
    height: auto;
    z-index: 0;
    pointer-events: none;
    transform: perspective(360px) rotateX(62deg);
    transform-origin: bottom center;
    color: var(--ink);
    opacity: 0;
    transition: opacity 1.9s ease
  }

  body[data-tod="morning"] .hero-hop,
  body[data-tod="noon"] .hero-hop,
  body[data-tod="evening"] .hero-hop {
    opacity: .36
  }

  .hero-stage {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 9%;
    height: 2px;
    z-index: 0;
    background: radial-gradient(circle 1.5px at 5px 50%, rgba(80, 80, 63, .42) 96%, transparent) repeat-x;
    background-size: 13px 3px;
    opacity: .6
  }

  .tod {
    position: absolute;
    bottom: 9%;
    z-index: 1;
    object-fit: contain;
    object-position: bottom center;
    transition: opacity .45s ease, filter 1.25s ease;
    transform-origin: 50% 100%
  }

  /* boxes sized to the viewport, not to the scene — so characters never shrink with it */
  .tod-reader {
    left: 0%;
    width: 30%;
    height: clamp(160px, 30vh, 265px)
  }

  .tod-waterer {
    left: 33%;
    width: 26%;
    height: clamp(150px, 28vh, 245px)
  }

  .tod-explorer {
    right: 0%;
    width: 34%;
    height: clamp(170px, 32vh, 280px)
  }

  .tod-shadow {
    position: absolute;
    bottom: calc(9% - 5px);
    height: 11px;
    border-radius: 50%;
    z-index: 1;
    background: radial-gradient(ellipse, rgba(80, 80, 63, .20), transparent 72%);
    transition: opacity 1.2s ease
  }

  .sh-reader {
    left: 2%;
    width: 22%
  }

  .sh-waterer {
    left: 35%;
    width: 19%
  }

  .sh-explorer {
    right: 2%;
    width: 26%
  }

  /* per-time sky elements */
  .sky-extra {
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease;
    pointer-events: none;
    z-index: 0
  }

  .sky-extra.on {
    opacity: 1
  }

  .sky-extra.always {
    opacity: 1
  }

  .sx-birds {
    top: 16%;
    left: -14%;
    width: clamp(64px, 8vw, 120px);
    animation: birdcross 30s linear infinite
  }

  /* fly in from the left, cross the sky with gentle rises and dips, exit right, repeat */
  @keyframes birdcross {
    0% {
      transform: translate(0, 0);
      opacity: 0
    }

    6% {
      opacity: .8
    }

    25% {
      transform: translate(38vw, -4vh)
    }

    50% {
      transform: translate(70vw, 3vh)
    }

    75% {
      transform: translate(104vw, -3vh)
    }

    92% {
      opacity: .8
    }

    100% {
      transform: translate(130vw, 1vh);
      opacity: 0
    }
  }

  @keyframes driftx2 {
    0% {
      transform: translate(0, 0)
    }

    50% {
      transform: translate(-60px, 6px)
    }

    100% {
      transform: translate(-130px, 0)
    }
  }

  .tod.breathe {
    animation: breathe 5s ease-in-out infinite
  }

  @keyframes breathe {

    0%,
    100% {
      transform: translateY(0)
    }

    50% {
      transform: translateY(-5px)
    }
  }

  .h1wrap {
    position: relative;
    display: inline-block
  }

  .becoming {
    font-size: clamp(3rem, 3.4vw, 6.2rem);
    font-weight: 500;
    line-height: .9;
    display: inline-block;
    transform: rotate(-2deg) translateX(.018em);
    margin-bottom: .04em
  }

  .hero h1 {
    font-size: var(--t-hero);
    margin-top: .05em;
    color: var(--h1c, var(--ink));
    transition: color 1.25s;
    font-weight: 500;
  }

  .loaded @keyframes hover {

    0%,
    100% {
      transform: translateY(0)
    }

    50% {
      transform: translateY(-8px)
    }
  }

  @keyframes breathe {

    0%,
    100% {
      transform: translateY(0) rotate(0deg)
    }

    50% {
      transform: translateY(-5px) rotate(.6deg)
    }
  }

  @keyframes pour {

    0%,
    100% {
      transform: rotate(0deg)
    }

    50% {
      transform: rotate(-2.2deg)
    }
  }

  .branch {
    position: absolute;
    opacity: .32;
    pointer-events: none;
    transition: opacity 1.25s ease, filter 1.25s ease
  }

  /* every hero element shifts with the hour */
  body[data-tod="morning"] .branch {
    opacity: .30;
    filter: saturate(1.02)
  }

  body[data-tod="noon"] .branch {
    opacity: .28;
    filter: none
  }

  body[data-tod="evening"] .branch {
    opacity: .34;
    filter: saturate(.9) sepia(.22) brightness(.96)
  }

  /* ground line */
  .hero-stage {
    transition: background 1.25s ease, opacity 1.25s ease
  }

  body[data-tod="evening"] .hero-stage {
    opacity: .5
  }

  .br-r {
    width: clamp(90px, 9.5vw, 190px);
    top: 3%;
    right: -1%
  }

  /* section seam (watercolor edge) */
  .seam {
	  margin-top:-30px;
    height: 46px;
    background: var(--cream-deep);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 46' preserveAspectRatio='none'%3E%3Cpath d='M0,26 C60,10 140,38 230,24 C330,8 400,36 500,22 C600,6 690,40 800,25 C900,10 1000,38 1100,20 C1150,12 1180,24 1200,18 L1200,46 L0,46 Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 46' preserveAspectRatio='none'%3E%3Cpath d='M0,26 C60,10 140,38 230,24 C330,8 400,36 500,22 C600,6 690,40 800,25 C900,10 1000,38 1100,20 C1150,12 1180,24 1200,18 L1200,46 L0,46 Z'/%3E%3C/svg%3E") center/100% 100% no-repeat
  }

  /* WHERE IT ALL BEGAN */
  .began {
    background: linear-gradient(160deg, #FBEBCB 0%, #F7E4C0 60%, #F3DEB4 100%);
    padding: var(--pad) 0;
    position: relative;
    overflow: hidden
  }

  .fdots {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0
  }

  .fd {
    position: absolute;
    width: 16px;
    height: 21px;
    border-radius: 50%/54%;
    opacity: .5;
    background: repeating-radial-gradient(ellipse at 50% 52%, transparent 0 1.8px, currentColor 1.8px 3.2px);
    animation: fdrift 7s ease-in-out infinite
  }

  @keyframes fdrift {

    0%,
    100% {
      transform: translateY(0)
    }

    50% {
      transform: translateY(-14px)
    }
  }

  .bflight {
    position: absolute;
    left: 3%;
    bottom: 5%;
    width: 43%;
    height: 38%;
    z-index: 0;
    pointer-events: none
  }

  .bflight path {
    fill: none;
    stroke: var(--sienna);
    stroke-width: 2.5;
    stroke-dasharray: 7 9;
    stroke-linecap: round;
    opacity: .6
  }

  .bfly {
    position: absolute;
    width: clamp(40px, 4.2vw, 66px);
    z-index: 1;
    pointer-events: none;
    transform: translate(-50%, -70%)
  }

  .jword {
    position: absolute;
    font-family: 'Caveat', cursive;
    color: var(--sienna);
    font-size: clamp(1.1rem, 1.6vw, 1.5rem);
    font-weight: 600;
    transform: translate(-50%, -140%);
    z-index: 4;
    pointer-events: none;
    white-space: nowrap;
    text-shadow: 0 1px 0 rgba(251, 235, 203, .95), 0 0 10px rgba(251, 235, 203, .9), 0 0 4px rgba(251, 235, 203, .9)
  }

  .jword::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -14px;
    transform: translateX(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--sienna);
    opacity: .7
  }

  .began .wrap {
    display: grid;
    grid-template-columns: .72fr 1.28fr;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: center
  }

  .printmask {
    position: relative;
    justify-self: end;
    width: 100%
  }

  .printmask .ph {
    width: 100%;
    max-width: 920px;
    height: auto;
    border-radius: 16px;
    display: block;
    box-shadow: 0 22px 60px rgba(80, 80, 63, .20)
  }

  /* SUNDIAL */
  .sundial {
    padding: var(--pad) 0;
    background: var(--cream)
  }

  .sundial-stage {
    position: relative;
    margin-top: var(--sp-5)
  }

  .slides {
    position: relative;
    width: 100%;
    aspect-ratio: 2.05;
    border-radius: 16px;
    overflow: hidden
  }

  .slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transform: scale(1.03);
    transition: opacity 1.1s ease, transform 6s linear
  }

  .slide.on {
    opacity: 1;
    transform: scale(1)
  }

  .sun-card {
    position: absolute;
    right: 3.5%;
    bottom: 8%;
    max-width: 340px;
    background: var(--cream);
    border-radius: 14px;
    padding: 1.4rem 1.5rem;
    border: 1px solid rgba(182, 136, 59, .35);
    box-shadow: 0 14px 34px rgba(60, 60, 45, .22)
  }

  .sun-card h3 {
    font-size: 1.35rem;
    margin-bottom: .1rem
  }

  .sun-card .hand {
    font-size: 1.3rem;
    display: block;
    margin-bottom: .5rem;
    color: var(--rust)
  }

  .sun-card p {
    font-size: .95rem;
    min-height: 4.4em;
    line-height: 1.6
  }

  .dots {
    display: flex;
    gap: 8px;
    margin-top: .9rem
  }

  .dots button {
    width: 10px;
    height: 13px;
    border-radius: 50%/54%;
    border: none;
    cursor: pointer;
    background: #D9CBAA;
    transition: background .3s
  }

  .dots button.on {
    background: var(--rust)
  }

  /* CONTINUUM */
  .continuum {
    background: linear-gradient(150deg, #EAF0E4, #E3EBD6);
    padding: var(--pad) 0;
    position: relative;
    overflow: hidden
  }

  .continuum .wm {
    position: absolute;
    left: -8%;
    top: -12%;
    width: 780px;
    height: 940px;
    opacity: .05;
    background: url('/wp-content/uploads/2026/07/ridge_olive.png') center/contain no-repeat;
    pointer-events: none
  }

  .continuum .wrap {
    display: grid;
    grid-template-columns: .82fr 1.18fr;
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
    position: relative
  }

  .continuum h2 {
    margin-bottom: var(--sp-2)
  }

  .continuum h3 {
    font-size: var(--t-h3);
    margin: var(--sp-2) 0 .2rem;
    color: var(--ink)
  }

  .continuum .sub {
    font-weight: 600;
    color: var(--ink-soft)
  }

  .continuum .body {
    margin-top: var(--sp-2)
  }

  .continuum .btn {
    margin-top: var(--sp-4)
  }

  .continuum .ph {
    border-radius: 16px;
    box-shadow: 0 14px 34px rgba(80, 80, 63, .14)
  }

  /* five print divider */
  .prints {
    display: flex;
    gap: 14px;
    justify-content: center;
    padding: 0 0 var(--sp-4)
  }

  .prints span {
    width: 22px;
    height: 29px;
    border-radius: 50%/54%;
    background: repeating-radial-gradient(ellipse at 50% 52%, transparent 0 2px, currentColor 2px 3.4px);
    opacity: .8
  }

  .prints .p1 {
    color: var(--sienna)
  }

  .prints .p2 {
    color: var(--gold)
  }

  .prints .p3 {
    color: var(--olive)
  }

  .prints .p4 {
    color: var(--rust)
  }

  .prints .p5 {
    color: var(--bronze)
  }

  /* GALLERY */
  .rhythm {
    padding: var(--pad) 0;
    background: var(--cream)
  }

  .rhythm .head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: var(--sp-5);
    flex-wrap: wrap
  }

  .rhythm .ggrid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 110px;
    gap: 18px
  }

  .gi {
    border-radius: 14px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 8px 22px rgba(80, 80, 63, .14);
    border: 3px solid transparent
  }

  .g1 {
    border-color: var(--gold)
  }

  .g2 {
    border-color: var(--rust)
  }

  .g3 {
    border-color: var(--olive)
  }

  .g4 {
    border-color: var(--sienna)
  }

  .gi>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2, .8, .3, 1)
  }

  .gi:hover>img {
    transform: scale(1.05)
  }

  .g5 .ovalwrap>img {
    width: 90%;
    height: 104%;
    object-fit: cover;
    margin: 0 auto;
}

  .g1 {
    grid-column: 1/8;
    grid-row: 1/4
  }

  .g1>img {
    animation: kenburns 22s ease-in-out infinite alternate
  }

  @keyframes kenburns {
    from {
      transform: scale(1)
    }

    to {
      transform: scale(1.07)
    }
  }
	
  .g2 {
    grid-column: 8/13;
    grid-row: 1/3;
    transform: rotate(0deg);
    transition: transform 1s cubic-bezier(.2, .8, .3, 1) .3s
  }

  .inview .g2 {
    transform: rotate(-2.4deg)
  }

  .g3 {
    grid-column: 8/13;
    grid-row: 3/6
  }

  .g4 {
    grid-column: 1/5;
    grid-row: 4/6
  }

  .g5 {
    grid-column: 5/8;
    grid-row: 4/6;
    box-shadow: none;
    overflow: visible
  }

  .g5 .ovalwrap {
    position: relative;
    width: 100%;
    height: 100%
  }

  .g5 img {
    clip-path: ellipse(44% 47% at 50% 50%)
  }
.g5 svg {
    position: absolute;
    inset: -4% -9.5%;
    width: 119%;
    height: 112%;
}
  .g5 svg ellipse {
    fill: none;
    stroke: #8a8570;
    stroke-linecap: round;
    opacity: .5
  }

  .g-butterfly {
    position: absolute;
    width: 54px !important;
    height: auto !important;
    object-fit: contain;
    top: -24px;
    right: 14px;
    z-index: 3;
    opacity: 0;
    transform: translateY(-16px);
    transition: opacity .7s ease-out 1.1s, transform .7s ease-out 1.1s
  }

  .inview .g-butterfly {
    opacity: 1;
    transform: none
  }

  /* ADMISSIONS */
  .admis {
    background: linear-gradient(155deg, #E07B2A, #C3782A 70%);
    padding: var(--pad) 0;
    position: relative;
    overflow: hidden;
    color: #FBEDD4
  }

  .admis h2 {
    color: #FFF7E9
  }

  .admis p {
    color: #FBEDD4
  }

  .admis .btn {
    background: #FBEDD4;
    color: #B65A2E
  }

  .admis .btn:hover {
    background: #fff
  }

  .admis .wash {
    position: absolute;
    right: -10%;
    bottom: -20%;
    width: 60%;
    height: 120%;
    border-radius: 48%;
    background: radial-gradient(ellipse at center, rgba(255, 247, 233, .15), transparent 65%);
    pointer-events: none
  }

  .admis .wrap {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
    position: relative
  }

  .admis .ph {
    border-radius: 16px;
    box-shadow: 0 14px 34px rgba(80, 80, 63, .14)
  }

  .ctarow {
    display: flex;
    align-items: flex-end;
    gap: 1.1rem;
    margin-top: var(--sp-4)
  }

  .btn .fp {
    display: inline-flex;
    align-items: center;
    width: 16px;
    height: 20px;
    flex: 0 0 auto;
    position: relative;
    top: .5px
  }

  .btn .fp svg {
    width: 100%;
    height: 100%;
    overflow: visible;
    display: block
  }

  .btn .fp path {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.15;
    transform-box: fill-box;
    transform-origin: center;
    transition: transform .45s cubic-bezier(.34, 1.4, .5, 1)
  }

  .btn:hover .fp .r1 {
    transform: scale(1.14)
  }

  .btn:hover .fp .r2 {
    transform: scale(1.08)
  }

  .btn:hover .fp .r3 {
    transform: scale(.9)
  }

  .cta-link {
    position: absolute;
    right: -30px;
    bottom: 2px;
    width: 44px;
    height: 30px;
    opacity: 0;
    transition: opacity .5s ease 1.1s
  }

  .admis.inview .cta-link {
    opacity: .7
  }

  /* HOW WE ARE */

  /* BANNER */
  .banner {
    position: relative;
    min-height: 74vh;
    display: flex;
    align-items: center;
    background: url('/wp-content/uploads/2026/07/outdoor_banner.jpg') center/cover no-repeat
  }

  .note {
    position: relative;
    max-width: 500px;
    margin-left: clamp(1.25rem, 7vw, 7rem);
    background: var(--cream);
    border-radius: 6px;
    padding: 2.6rem 2.6rem 2.4rem;
    box-shadow: 0 18px 44px rgba(40, 40, 30, .22);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M2,4 C20,1 45,3 70,2 C85,1.5 96,3 98,5 L99,50 L98,95 C80,98 55,96 30,97.5 C15,98 3,97 2,94 Z'/%3E%3C/svg%3E") center/100% 100%;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M2,4 C20,1 45,3 70,2 C85,1.5 96,3 98,5 L99,50 L98,95 C80,98 55,96 30,97.5 C15,98 3,97 2,94 Z'/%3E%3C/svg%3E") center/100% 100%
  }

  .note .hand {
    font-size: clamp(2.2rem, 3.4vw, 3.2rem);
    font-weight: 700;
    line-height: .8;
    display: block
  }

  .note h2 {
    font-size: var(--t-h2);
    margin: .05em 0 var(--sp-1)
  }

  .note p {
    font-size: var(--t-body);
    margin-bottom: var(--sp-3)
  }

  .note .btnwrap {
    position: relative;
    display: inline-block
  }

  .note .btnwrap img {
    position: absolute;
    width: 44px;
    top: -26px;
    left: -18px;
    transform: rotate(-8deg)
  }

  /* CARD STRIP */
  .strip {
    background: var(--cream);
    overflow: hidden
  }

  .mq {
    display: flex;
    gap: 3.4rem;
    align-items: flex-end;
    width: max-content;
    animation: drift 46s linear infinite
  }

  .strip:hover .mq {
    animation-play-state: paused
  }

  @keyframes drift {
    from {
      transform: translateX(0)
    }

    to {
      transform: translateX(-50%)
    }
  }

  .parade {
    position: relative;
    padding: calc(var(--pad)*.62) 0 calc(var(--pad)*.5)
  }

  .groundline {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 5.2rem;
    height: 3px;
    opacity: .35;
    background: radial-gradient(circle 1.6px at 4px 50%, var(--olive-dark) 96%, transparent) repeat-x;
    background-size: 11px 3px
  }

  .pitem {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    width: auto
  }

  .pitem img {
    height: 170px;
    width: auto;
    animation: breathe 5s ease-in-out infinite
  }

  .pitem:nth-child(2n) img {
    animation-delay: 1.1s
  }

  .pitem:nth-child(3n) img {
    animation-delay: 2.2s
  }

  .pitem .cap {
    font-family: 'Caveat', cursive;
    color: var(--sienna);
    font-size: 1.3rem;
    line-height: 1;
    text-align: center;
    white-space: nowrap
  }

  /* FOOTER */
  .footwrap {
    position: relative;
    margin-top: -8px
  }

  .torn {
    display: block;
    width: 100%;
    height: 52px;
    background: var(--kraft);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 52' preserveAspectRatio='none'%3E%3Cpath d='M0,34 L38,22 L74,36 L118,18 L166,32 L214,16 L262,34 L310,20 L360,38 L410,18 L462,30 L514,14 L568,32 L620,18 L676,36 L730,20 L788,34 L844,16 L900,30 L954,14 L1010,32 L1064,18 L1120,34 L1166,22 L1200,30 L1200,52 L0,52 Z'/%3E%3C/svg%3E") center/100% 100%;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 52' preserveAspectRatio='none'%3E%3Cpath d='M0,34 L38,22 L74,36 L118,18 L166,32 L214,16 L262,34 L310,20 L360,38 L410,18 L462,30 L514,14 L568,32 L620,18 L676,36 L730,20 L788,34 L844,16 L900,30 L954,14 L1010,32 L1064,18 L1120,34 L1166,22 L1200,30 L1200,52 L0,52 Z'/%3E%3C/svg%3E") center/100% 100%
  }

  footer {
    background: var(--kraft);
    text-align: center;
    padding: var(--sp-5) 1.5rem var(--sp-4);
    position: relative
  }

  footer .logo {
    height: 84px;
    margin: 0 auto 0.6rem;
    width: auto;
    opacity: 0;
    transform: translateY(10px);
    transition: all .8s ease-out
  }

  footer.inview .logo {
    opacity: 1;
    transform: none
  }

  footer .tag {
    font-size: 1.7rem;
    margin-bottom: 1.6rem;
    display: block
  }

  .flinks {
    display: flex;
    gap: clamp(1rem, 3vw, 2.4rem);
    justify-content: center;
    list-style: none;
    flex-wrap: wrap;
    margin-bottom: 1.1rem
  }

  .flinks a {
    color: var(--olive-dark);
    text-decoration: none;
    font-weight: 600;
    position: relative;
    padding-bottom: 2px
  }

  .flinks a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: -2px;
    height: 3px;
    background: radial-gradient(circle 2px at 3px 50%, var(--gold) 96%, transparent) repeat-x;
    background-size: 8px 6px;
    transition: right .3s ease-out
  }

  .flinks a:hover::after {
    right: 0
  }

  .contact {
    color: var(--ink-soft);
    font-size: var(--t-small);
    margin-bottom: var(--sp-3)
  }

  .contact span {
    margin: 0 .6rem;
    color: var(--sienna)
  }

  footer .prints {
    padding-bottom: 1rem
  }

  .socials {
    display: flex;
    gap: 1.1rem;
    justify-content: center;
    margin-bottom: 1.5rem
  }

  .socials a {
    color: var(--olive-dark);
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1.5px solid rgba(80, 80, 63, .35);
    transition: all .3s
  }

  .socials a:hover {
    color: var(--cream);
    background: var(--rust);
    border-color: var(--rust);
    transform: translateY(-3px) rotate(-4deg)
  }

  .socials svg {
    width: 17px;
    height: 17px
  }

  footer .prints span {
    opacity: 0;
    transform: translateY(6px);
    transition: all .5s ease-out
  }

  footer.inview .prints span {
    opacity: .8;
    transform: none
  }

  footer.inview .prints .p1 {
    transition-delay: .15s
  }

  footer.inview .prints .p2 {
    transition-delay: .3s
  }

  footer.inview .prints .p3 {
    transition-delay: .45s
  }

  footer.inview .prints .p4 {
    transition-delay: .6s
  }

  footer.inview .prints .p5 {
    transition-delay: .75s
  }

  .copy {
    font-size: .85rem;
    color: var(--ink-soft)
  }

  .popz {
    position: absolute;
    font-family: 'Caveat', cursive;
    color: var(--olive-dark);
    pointer-events: none;
    animation: popz 1.5s ease-out forwards;
    font-weight: 700
  }

  @keyframes popz {
    0% {
      opacity: 0;
      transform: translateY(0) scale(.7)
    }

    20% {
      opacity: .95
    }

    100% {
      opacity: 0;
      transform: translateY(-70px) scale(1.5) rotate(12deg)
    }
  }

  .sleeper {
    position: absolute;
    left: clamp(.6rem, 4vw, 4rem);
    bottom: 0;
    width: clamp(110px, 11vw, 170px)
  }

  .zz {
    position: absolute;
    left: calc(clamp(.6rem, 4vw, 4rem) + clamp(80px, 8vw, 130px));
    bottom: clamp(70px, 7vw, 110px);
    font-family: 'Caveat', cursive;
    color: var(--olive-dark);
    font-size: 1.3rem;
    opacity: .75
  }

  .zz span {
    display: inline-block;
    animation: floatz 3.4s ease-in-out infinite
  }

  .zz span:nth-child(2) {
    animation-delay: .5s;
    font-size: 1.05rem
  }

  .zz span:nth-child(3) {
    animation-delay: 1s;
    font-size: .85rem
  }

  @keyframes floatz {

    0%,
    100% {
      transform: translateY(0);
      opacity: .4
    }

    50% {
      transform: translateY(-9px);
      opacity: .95
    }
  }

  .sleeper {
    animation: sleepbreathe 4.5s ease-in-out infinite;
    transform-origin: 50% 100%
  }

  .sleeper:hover,
  .sleeper:focus-visible {
    animation-play-state: paused
  }

  @keyframes sleepbreathe {

    0%,
    100% {
      transform: scale(1)
    }

    50% {
      transform: scale(1.02) translateY(-2px)
    }
  }

  footer.inview .prints span {
    animation: printbob 3.8s ease-in-out infinite
  }

  footer.inview .prints .p2 {
    animation-delay: .4s
  }

  footer.inview .prints .p3 {
    animation-delay: .8s
  }

  footer.inview .prints .p4 {
    animation-delay: 1.2s
  }

  footer.inview .prints .p5 {
    animation-delay: 1.6s
  }
h2.rv.d1.inview {
    max-width: 100%;
}
  @keyframes printbob {

    0%,
    100% {
      transform: translateY(0)
    }

    50% {
      transform: translateY(-5px)
    }
  }

  .chalksec {
    background: linear-gradient(155deg, #7C8A3A, #6B7830 80%);
    padding: var(--pad) 0;
    color: #F4F0DE
  }

  .chalksec .hand {
    color: #EAD98A !important
  }

  .board {
    position: relative;
    background: linear-gradient(135deg, #2f3a38, #26302e);
    border-radius: 10px;
    border: 12px solid #6b4f34;
    box-shadow: inset 0 0 60px rgba(0, 0, 0, .4), 0 18px 40px rgba(0, 0, 0, .22);
    aspect-ratio: 16/7;
    max-width: 820px;
    margin: 0 auto;
    cursor: crosshair;
    touch-action: none;
    overflow: hidden
  }

  .board canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%
  }

  .board .bhint {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Caveat", cursive;
    color: rgba(255, 255, 255, .35);
    font-size: 1.9rem;
    pointer-events: none;
    transition: opacity .4s
  }

  .board.used .bhint {
    opacity: 0
  }

  .ctools {
    display: flex;
    gap: .5rem;
    justify-content: center;
    align-items: center;
    margin: 1.1rem 0;
    flex-wrap: wrap
  }

  .chalk {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 2px solid rgba(0, 0, 0, .15);
    cursor: pointer;
    transition: transform .2s;
    padding: 0
  }

  .chalk.on {
    transform: scale(1.3);
    border-color: var(--ink)
  }

  .cclear {
    border: none;
    background: none;
    color: #FCE9E0;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    padding: .5em .9em;
    text-decoration: underline
  }

  .chalkset {
    display: flex;
    gap: .5rem
  }

  .ctype {
    display: flex;
    gap: .6rem;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: .4rem
  }

  .ctype input {
    font-family: inherit;
    font-size: .98rem;
    padding: .72em 1em;
    border-radius: 10px;
    width: min(360px, 80vw);
    border: 2px solid rgba(252, 250, 240, .35);
    background: rgba(252, 250, 240, .1);
    color: #FCFAF0
  }
.ctype input::placeholder, .ctype input::-moz-placeholder, .ctype input::-webkit-input-placeholder, .ctype textarea::-webkit-input-placeholder{color:rgba(252,250,240,.55)
}

	.ww-form-row input::placeholder, .ww-form-row textarea::placeholder {
		color: #fff !important;
	}
    .ww-form-row input::-webkit-input-placeholder, .ww-form-row textarea::-webkit-input-placeholder{
		color: #fff !important;
	}
	.ww-form-row input::-moz-placeholder, .ww-form-row textarea::-moz-placeholder{
		color: #fff !important;
	}
	.ww-form-row input:-ms-input-placeholder, .ww-form-row textarea:-ms-input-placeholder  { 
		color: #fff !important;
	}


  .ctype input:focus {
    border-color: #FCFAF0;
    outline: none;
    background: rgba(252, 250, 240, .16)
  }

  .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap
  }

  .csend {
    font-size: 1rem
  }

  .cmsg {
    text-align: center;
    min-height: 1.3em;
    color: #FCFAF0;
    font-weight: 700;
    margin-bottom: 1rem
  }

  .wallhead {
    font-family: 'Caveat', cursive;
    color: #EAD98A;
    text-align: center;
    font-size: 1.7rem;
    margin: 1.6rem 0 .8rem;
    font-weight: 600;
	  max-width:100%;
  }

  .wondergrid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 12px;
    margin-top: 1rem
  }

  .wallcard {
    background: #2f3a38;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .25);
    border: 2px solid rgba(252, 250, 240, .25);
    animation: pop .4s ease-out
  }

  .wallcard img {
    width: 100%;
    border-radius: 5px;
    display: block
  }

  .wallcard .q {
    font-family: "Caveat", cursive;
    color: #e9e4d2;
    font-size: 28px;
    padding: 0 0 20px 0;
    line-height: 26px;
	  min-height:50px;
  }

  .wallcard .who {
    font-size: .75rem;
    color: #C9D6B8;
    padding: .35rem .4rem 0;
    font-weight: 700
  }

  @keyframes pop {
    from {
      opacity: 0;
      transform: scale(.92)
    }

    to {
      opacity: 1;
      transform: none
    }
  }

  /* WONDER BOX */
  .wonder {
    position: fixed;
    right: clamp(.9rem, 3vw, 2.2rem);
    bottom: clamp(.9rem, 3vw, 2.2rem);
    z-index: 80
  }

  .wbtn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px;
    position: relative;
    display: flex;
    align-items: center;
    filter: drop-shadow(0 4px 8px rgba(60, 60, 45, .25))
  }

  .wbtn img {
    width: 58px;
    transform-origin: center;
    will-change: transform;
    animation: wflutter 12s linear infinite
  }

  .wbtn:hover img {
    animation-play-state: paused
  }

  /* one continuous, never-ending flight — erratic on both axes like a real butterfly,
   drifting out and weaving back, then doing it again. It never stops. */
  @keyframes wflutter {
    0% {
      transform: translate(0px, 0px) rotate(2deg) scaleX(1)
    }

    12% {
      transform: translate(-40px, -14px) rotate(-8deg) scaleX(.9)
    }

    25% {
      transform: translate(-64px, -44px) rotate(-4deg) scaleX(1)
    }

    37% {
      transform: translate(-58px, -76px) rotate(6deg) scaleX(.9)
    }

    50% {
      transform: translate(-30px, -92px) rotate(8deg) scaleX(1)
    }

    62% {
      transform: translate(6px, -84px) rotate(4deg) scaleX(.9)
    }

    75% {
      transform: translate(30px, -54px) rotate(-4deg) scaleX(1)
    }

    87% {
      transform: translate(24px, -22px) rotate(-8deg) scaleX(.9)
    }

    100% {
      transform: translate(0px, 0px) rotate(2deg) scaleX(1)
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .wbtn img {
      animation: none
    }
  }

  .wtag {
    position: absolute;
    right: calc(100% - 4px);
    top: 50%;
    transform: translateY(-50%) translateX(8px);
    white-space: nowrap;
    font-family: "Caveat", cursive;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--sienna);
    background: var(--cream);
    border: 1.5px solid var(--gold);
    border-radius: 20px 20px 4px 20px;
    padding: .3rem .8rem;
    box-shadow: 0 4px 14px rgba(185, 121, 52, .22);
    opacity: 0;
    pointer-events: none;
    transition: opacity .5s ease, transform .5s ease
  }

  .wtag.show {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
    animation: wtagbob 2.4s ease-in-out infinite 1s
  }

  @keyframes wtagbob {

    0%,
    100% {
      transform: translateY(-50%) translateX(0)
    }

    50% {
      transform: translateY(-54%) translateX(-3px)
    }
  }

  .wonder.opened .wtag {
    display: none
  }

  .wcard {
    position: absolute;
    right: 0;
    bottom: 74px;
    width: min(320px, 86vw);
    background: var(--cream);
    border: 1.5px solid rgba(80, 80, 63, .5);
    border-radius: 8px;
    padding: 1.5rem 1.4rem 1.2rem;
    box-shadow: 0 16px 40px rgba(40, 40, 30, .22);
    opacity: 0;
    transform: translateY(12px) scale(.97);
    pointer-events: none;
    transition: opacity .35s ease-out, transform .35s ease-out
  }

  .wcard.open {
    opacity: 1;
    transform: none;
    pointer-events: auto
  }

  .wcard .hand {
    font-size: 1.4rem;
    display: block;
    margin-bottom: .7rem;
    border-bottom: 1.5px solid var(--sienna);
    padding-bottom: .35rem;
    width: max-content;
    max-width: 100%
  }

  .wq {
    font-size: 1.15rem;
    color: var(--ink);
    font-weight: 600;
    line-height: 1.45;
    min-height: 3.2em;
    transition: opacity .25s
  }

  .wq.flip {
    opacity: 0
  }

  .wmore {
    background: none;
    border: none;
    color: var(--rust);
    font-weight: 700;
    font-size: .95rem;
    cursor: pointer;
    font-family: 'Nunito Sans', sans-serif;
    padding: 0;
    margin-top: .9rem;
    text-decoration: underline wavy 2px var(--rust);
    text-underline-offset: 5px
  }

  .wclose {
    position: absolute;
    top: .7rem;
    right: .9rem;
    background: none;
    border: none;
    font-size: 1.1rem;
    color: var(--ink-soft);
    cursor: pointer
  }

  /* responsive */
  @media (max-width:900px) {

    .began .wrap,
    .continuum .wrap,
    .admis .wrap {
      grid-template-columns: 1fr
    }

    .hero .wrap {
      grid-template-columns: 1fr
    }

    .hero-scene {
      min-height: 280px
    }

    .flight {
      display: none
    }

    .rhythm .ggrid {
      grid-auto-rows: 90px
    }

    .g1 {
      grid-column: 1/13;
      grid-row: 1/4
    }

    .g2 {
      grid-column: 1/7;
      grid-row: 4/6
    }

    .g3 {
      grid-column: 7/13;
      grid-row: 4/7
    }

    .g4 {
      grid-column: 1/7;
      grid-row: 6/8
    }

    .g5 {
      grid-column: 7/13;
      grid-row: 7/9
    }

    .sun-card {
      position: static;
      max-width: none;
      margin-top: 1rem
    }

    .slides {
      aspect-ratio: 1.5
    }

    .note {
      margin: 6rem auto 3rem;
      max-width: 88%
    }

    .banner {
      align-items: flex-end
    }
  }

  @media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
      animation: none !important;
      transition: none !important
    }

    .rv,
    .char,
    .g-butterfly,
    footer .logo,
    footer .prints span {
      opacity: 1 !important;
      transform: none !important
    }

    .uw svg path,
    .dashcircle ellipse,
    .flight .draw {
      stroke-dashoffset: 0 !important
    }

    .inview .g2 {
      transform: rotate(-2.4deg)
    }
  }

  .growtree {
    position: fixed;
    left:3%;
    top: 0;
    width: 92px;
    height: 100vh;
    z-index: 40;
    pointer-events: none;
    opacity: .9;
    --tree-ink: #7A4E1F;
    /* strong warm-dark core; the cream halo handles dark bands */
    --tree-leaf-ridge: rgba(255, 255, 255, .6)
  }

  .growtree svg {
    width: 100%;
    height: 100%;
    overflow: visible
  }

  .growtree path {
    fill: none;
    stroke: var(--tree-ink);
    stroke-linecap: round
  }

  .gt-trunk {
    stroke-width: 5.5
  }

  .gt-b {
    stroke-width: 3.2
  }

  .gt-leaves g {
    opacity: 0;
    transition: opacity .45s ease
  }

  @media (min-width:1440px) and (max-width:1600px) {
    .growtree {
      left: 3%;
      width: 104px
    }
  }

  @media (max-width:1439px) {
    .growtree {
      display: none
    }
  }

  @media (prefers-reduced-motion:reduce) {
    .growtree path {
      stroke-dashoffset: 0 !important
    }
  }

/* About us page */

.pghero {
  position: relative;
  padding: calc(96px + clamp(2.5rem, 5vw, 4.5rem)) 0 clamp(3rem, 6vw, 5.5rem);
  background: linear-gradient(160deg, #FBEBCB 0%, #F7E4C0 60%, #F3DEB4 100%);
  overflow: hidden
}

.pghero .wrap {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center
}

.eyebrow {
  display: block;
  font-family: 'Caveat', cursive;
  color: var(--sienna);
  font-size: var(--t-hand);
  margin-bottom: .15rem
}

.pghero h1 {
  font-size: clamp(2.3rem, 4.3vw, 4.1rem);
  color: var(--sienna);
  max-width: 11ch;
  line-height: 1.06;
  font-weight:500;
}
.pghero.about-hero{
	padding-top:60px;
}
.pghero .lede {
  margin-top: var(--sp-3);
  font-size: var(--t-lead);
  max-width: var(--measure)
}

.qblock {
  margin-top: var(--sp-4);
  max-width: var(--measure)
}

.qblock b {
  display: block;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  color: var(--ink);
  font-size: var(--t-body);
  margin-bottom: .3rem
}

.qblock p+b {
  margin-top: var(--sp-3)
}

.becomes {
  font-family: 'Caveat', cursive;
  color: var(--olive-disp);
  font-size: clamp(1.5rem, 2vw, 1.9rem);
  display: inline-block;
  margin-top: .35rem
}

.heroart {
  position: relative
}

.qscene {
  position: relative;
  width: 100%;
  aspect-ratio: 1196/1380
}

.qscene .ql {
  position: absolute;
  height: auto;
  will-change: transform
}

.q-mark {
  left: 25.08%;
  top: 6.5%;
  width: 57.69%;
  animation: qfloat 11s ease-in-out infinite
}

.q-dot {
  left: 38.04%;
  top: 55.5%;
  width: 25.92%;
  animation: qbob 7.5s ease-in-out infinite
}

.q-ground {
  left: 22%;
  bottom: 6.5%;
  width: 52%;
  opacity: .7
}

.m-point {
  left: 20.5%;
  bottom: 9.5%;
  width: 11.5%;
  animation: mpoint 5.5s ease-in-out infinite;
  transform-origin: 50% 100%
}

.m-reach {
  left: 40.5%;
  bottom: 9.5%;
  width: 10.5%;
  animation: mreach 4.5s ease-in-out infinite;
  transform-origin: 50% 100%
}

.m-read {
  left: 59%;
  bottom: 8.4%;
  width: 13%;
  animation: qbreathe 7s ease-in-out infinite;
  transform-origin: 50% 100%
}

@keyframes mpoint {

  0%,
  100% {
    transform: scaleX(-1) translateY(0) rotate(0)
  }

  50% {
    transform: scaleX(-1) translateY(-2px) rotate(-1.2deg)
  }
}

@keyframes mreach {

  0%,
  100% {
    transform: translateY(0) scaleY(1)
  }

  45% {
    transform: translateY(-5px) scaleY(1.03)
  }
}

@keyframes qfloat {

  0%,
  100% {
    transform: translateY(0) rotate(-0.5deg)
  }

  50% {
    transform: translateY(-14px) rotate(0.6deg)
  }
}

@keyframes qbob {

  0%,
  100% {
    transform: translateY(0) scale(1)
  }

  50% {
    transform: translateY(-7px) scale(1.02)
  }
}

@keyframes qbreathe {

  0%,
  100% {
    transform: scaleY(1) translateY(0)
  }

  50% {
    transform: scaleY(1.008) translateY(-1.5px)
  }
}

.qleaves {
  position: absolute;
  inset: 0;
  pointer-events: none
}

.qleaves .lf {
  position: absolute;
  height: auto;
  transform-origin: 50% 50%;
  animation: qdrift var(--dur, 10s) ease-in-out var(--del, 0s) infinite;
  will-change: transform
}

@keyframes qdrift {

  0%,
  100% {
    transform: translate(0, 0) rotate(0)
  }

  33% {
    transform: translate(var(--dx), calc(var(--dy) * -1)) rotate(var(--rot))
  }

  66% {
    transform: translate(calc(var(--dx) * -0.6), var(--dy)) rotate(calc(var(--rot) * -0.7))
  }
}

@media (prefers-reduced-motion:reduce) {

  .q-mark,
  .q-dot,
  .q-chars {
    animation: none
  }

  .qleaves {
    display: none
  }
}

.band {
  position: relative;
  padding: var(--pad) 0;
  overflow: hidden
}

.band.deep {
  background: var(--cream-deep)
}

.band.plain {
  background: var(--cream)
}

.story .storygrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center
}

.story .lead-in {
  margin-top: var(--sp-3);
  font-size: var(--t-lead);
  max-width: var(--measure)
}

.story .truth {
  margin: var(--sp-4) 0 0;
  padding-left: 1.15rem;
  border-left: 3px solid var(--gold);
  max-width: var(--measure)
}

.story .truth b {
  display: block;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  color: var(--ink);
  font-size: var(--t-h3);
  line-height: 1.4
}

.story .truth em {
  font-style: normal;
  display: block;
  margin-top: .4rem;
  color: var(--ink-soft);
  font-size: var(--t-body);
  line-height: 1.7
}

.beatwrap {
  margin-top: clamp(2.6rem, 5vw, 4.4rem)
}

.beats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.6rem, 3vw, 2.8rem) clamp(2rem, 4vw, 3.6rem)
}

.beat {
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 1.1rem;
  align-items: start
}

.beat b {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  color: var(--sienna-ink);
  font-size: var(--t-body)
}

.beat p {
  display: inline;
  font-size: var(--t-small);
  line-height: 1.65
}

.storyart {
  position: relative
}

.storyart img.plate {
  width: 100%;
  height: auto
}

.vm {
  background: linear-gradient(150deg, #DCE7CE, #CFDDBC)
}

.vm .wrap {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center
}

.vmart {
  position: relative
}

.vmart img.plate {
  width: 100%;
  height: auto;
  display: block
}

.vmart img.trunk {
  position: relative;
  z-index: 1
}

.vmart img.canopy {
  position: absolute;
  inset: 0;
  z-index: 2;
  transform-origin: 50% 64.2%;
  animation: sway 9s ease-in-out infinite;
  will-change: transform
}

@keyframes sway {

  0%,
  100% {
    transform: rotate(-0.55deg)
  }

  35% {
    transform: rotate(0.5deg)
  }

  65% {
    transform: rotate(-0.22deg)
  }
}

.leafdrift {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: visible;
  z-index: 2
}

.leafdrift .lf {
  position: absolute;
  overflow: visible;
  opacity: 0;
  animation: leaffall var(--dur, 9s) ease-in-out var(--del, 0s) infinite;
  will-change: transform, opacity
}

@keyframes leaffall {
  0% {
    opacity: 0;
    transform: translate(0, 0) rotate(0)
  }

  12% {
    opacity: .85
  }

  55% {
    opacity: .8;
    transform: translate(calc(var(--sw) * 1), 34px) rotate(var(--rot))
  }

  100% {
    opacity: 0;
    transform: translate(calc(var(--sw) * -0.6), 88px) rotate(calc(var(--rot) * -1.4))
  }
}

@media (prefers-reduced-motion:reduce) {
  .vmart img.canopy {
    animation: none
  }

  .leafdrift {
    display: none
  }
}

.vmrow {
  margin-top: var(--sp-5);
  max-width: 38rem
}

.vmrow:first-of-type {
  margin-top: var(--sp-4)
}

.vmrow .kicker {
  display: block;
  font-family: 'Caveat', cursive;
  color: var(--olive-ink);
  font-size: 1.35rem;
  margin-bottom: .1rem;
  line-height: 1
}

.vmrow h3 {
  color: var(--ink);
  font-size: clamp(1.15rem, 1.5vw, 1.45rem);
  margin-bottom: .55rem
}

.ess {
  background: linear-gradient(155deg, #B0631E, #9C5619 72%);
  color: #FDF3E0
}

.ess h2 {
  color: #FFF7E9
}

.ess .uw svg path {
  stroke: #FFE0A6 !important
}

.ess .intro p {
  color: #FDF3E0
}

.ess .dim p {
  color: #FBEEDC
}

.ess .dim h3 {
  color: #FFF7E9
}

.ess .dim .ico {
  background: #FBF2E2;
  border-radius: 50%;
  padding: 14px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .14)
}

.ess .dim .sub {
  color: #FDF3E0 !important;
  opacity: .92
}

.ess .ridge {
  position: absolute;
  left: -8%;
  top: -12%;
  width: 780px;
  height: 940px;
  opacity: .09;
  background: url('/wp-content/uploads/2026/07/ridge_olive.png') center/contain no-repeat;
  pointer-events: none
}

.ess .wrap {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start
}

.ess .intro {
  position: sticky;
  top: 120px
}

.ess .intro p {
  margin-top: var(--sp-3);
  max-width: 26rem
}

.dims {
  display: grid;
  gap: clamp(2rem, 3.4vw, 3rem)
}

.dim {
  display: grid;
  grid-template-columns: 78px 1fr;
  gap: 1.5rem;
  align-items: start
}

.dim .ico {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center
}

.dim .ico img {
  width: 100%;
  height: auto
}

.dim h3 {
  font-size: clamp(1.4rem, 2.1vw, 1.85rem);
  color: var(--ink);
  line-height: 1.05
}

.dim .sub {
  display: block;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: .95rem;
  margin: .25rem 0 .6rem
}

.dim.heart .sub {
  color: var(--rust)
}

.dim.mind .sub {
  color: #A87F14
}

.dim.body .sub {
  color: var(--olive)
}

.dim.soul .sub {
  color: var(--bronze)
}

.dim p {
  font-size: var(--t-small);
  max-width: 36rem
}

.vals {
  background: linear-gradient(160deg, #FBEBCB 0%, #F7E4C0 62%, #F3DEB4 100%)
}

.vals .vhead {
  max-width: 44rem
}

.vals .say {
  margin-top: var(--sp-3);
  font-size: var(--t-lead);
  max-width: 34rem
}

.vals .em {
  display: block;
  margin-top: .6rem;
  font-family: 'Caveat', cursive;
  color: var(--sienna);
  font-size: clamp(1.35rem, 1.9vw, 1.75rem);
  line-height: 1.3
}

.vgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(2rem, 3.4vw, 3.2rem) clamp(1.6rem, 3vw, 3rem);
  margin-top: var(--sp-5)
}

.vitem {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 1.2rem;
  align-items: start
}

.vitem .ico {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center
}

.vitem .ico img {
  width: 100%;
  height: auto
}

.vitem h3 {
  font-size: clamp(1.15rem, 1.5vw, 1.35rem);
  color: var(--ink);
  margin-bottom: .3rem
}

.vitem p {
  font-size: var(--t-small);
  line-height: 1.6
}

.threec .top {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center
}

.threec h2 {
  max-width: 15ch;
  line-height: 1.14
}

.venn {
  position: relative;
  width: 100%;
  padding: 1rem 0 1.4rem
}

.venn .plateWrap {
  position: relative;
  width: 100%
}

.venn .plateWrap img {
  width: 100%;
  height: auto
}

.vhint {
  display: block;
  margin-top: 0;
  font-family: 'Caveat', cursive;
  color: var(--olive-ink);
  font-size: clamp(1rem, 1.25vw, 1.2rem);
  opacity: .85;
  transition: opacity .4s
}

.threec.whole .vhint {
  opacity: 0
}

.wholeperson {
  display: block;
  margin-top: 1.1rem;
  font-family: 'Caveat', cursive;
  color: var(--ink-soft);
  font-size: clamp(1.35rem, 1.9vw, 1.75rem);
  line-height: 1.2
}
.plateWrap {
  position: relative
}

.vbase {
  transition: filter .5s ease, opacity .5s ease
}

#venn.lit .vbase {
  filter: saturate(.45) opacity(.62)
}

.vlift {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  z-index: 1;
  background: url('/wp-content/uploads/2026/07/3c_venn.webp') center/100% 100% no-repeat;
  filter: saturate(1.7) contrast(1.14);
  transition: opacity .45s ease, transform .6s cubic-bezier(.2, .9, .3, 1)
}

.l-competent {
  clip-path: circle(23.43% at 50.0% 35.0%)
}

.l-compassionate {
  clip-path: circle(23.43% at 32.8% 64.4%)
}

.l-conscious {
  clip-path: circle(23.43% at 67.2% 64.4%)
}

#venn.on-competent .l-competent,
#venn.on-compassionate .l-compassionate,
#venn.on-conscious .l-conscious {
  opacity: 1;
  transform: scale(1.018)
}

.vhit {
  position: absolute;
  border: 0;
  background: none;
  padding: 0;
  cursor: pointer;
  z-index: 3;
  border-radius: 50%;
  width: 46.86%;
  aspect-ratio: 1/1;
  transform: translate(-50%, -50%)
}

.vhit:focus-visible {
  outline: 3px solid var(--rust);
  outline-offset: 4px
}

.h-competent {
  left: 50.0%;
  top: 35.0%
}

.h-compassionate {
  left: 32.8%;
  top: 64.4%
}

.h-conscious {
  left: 67.2%;
  top: 64.4%
}


#venn.on-competent~* .vt.competent {}

.vheart {
  position: absolute;
  left: 50%;
  top: 54.6%;
  width: 19%;
  aspect-ratio: .78;
  transform: translate(-50%, -50%) scale(.86);
  z-index: 2;
  pointer-events: none;
  background: url('/wp-content/uploads/2026/07/3c_venn.webp') no-repeat;
  background-size: 526% 526%;
  background-position: 50% 54.6%;
  clip-path: ellipse(50% 50% at 50% 50%);
  opacity: 0;
  filter: saturate(1.5) contrast(1.3);
  transition: opacity .8s ease .1s, transform .9s cubic-bezier(.2, .9, .3, 1) .1s
}

#venn.whole .vheart {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1)
}

#venn.whole .vbase {
  filter: none;
  opacity: 1
}

.vwhole {
  margin-top: 1.1rem;
  font-family: 'Caveat', cursive;
  color: var(--sienna);
  font-size: clamp(1.15rem, 1.5vw, 1.4rem);
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .7s ease .3s, transform .7s ease .3s
}

#venn.whole~.vwhole,
.threec.whole .vwhole {
  opacity: 1;
  transform: none
}

@media (hover:none) {
  .vhit {
    cursor: default
  }
}

.vrings {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  z-index: 2;
  pointer-events: none
}

.vt {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 41px;
  letter-spacing: .06em;
  text-anchor: middle;
  opacity: 0
}

.inview .vt {
  opacity: 1
}


.vt {
  transition: opacity .9s ease-out .5s, fill .9s ease-out .5s
}

.inview .vt {
  transition: opacity .28s cubic-bezier(.33, 0, .2, 1), fill .28s cubic-bezier(.33, 0, .2, 1)
}

#venn.lit .vt {
  opacity: .26
}

#venn.on-competent .vt.competent,
#venn.on-compassionate .vt.compassionate,
#venn.on-conscious .vt.conscious {
  opacity: 1
}

#venn.on-competent .vt.competent {
  fill: #7E5A0E
}

#venn.on-compassionate .vt.compassionate {
  fill: #4E4C1A
}

#venn.on-conscious .vt.conscious {
  fill: #7E4514
}

.vt.competent {
  fill: #9A6E12
}

.vt.compassionate {
  fill: #6F6C26
}

.vt.conscious {
  fill: #9E5A1D
}

@media (max-width:980px) {
  .vt {
    font-size: 52px
  }
}

.ccards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.4rem;
  margin-top: var(--sp-5)
}

.ccard {
  position: relative;
  background: var(--cream);
  border: none;
  border-radius: 16px;
  padding: 1.8rem 1.6rem
}

.ccard h3 {
  color: var(--sienna-ink);
  font-size: 1.05rem;
  line-height: 1.3;
  margin-bottom: .75rem
}

.ccard p {
  font-size: var(--t-small)
}

.diff {
  position: relative
}

.diff h2 {
  margin: 0 auto;
  text-align: center;
  max-width: 24ch
}

.dpairs {
  margin-top: var(--sp-5);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.4rem, 2.6vw, 2.2rem) clamp(1.6rem, 3vw, 2.6rem)
}

.dpair {
  position: relative;
  background: var(--cream);
  border-radius: 16px;
  padding: 1.6rem 1.6rem 1.7rem;
  transition: transform .3s cubic-bezier(.2, .9, .3, 1)
}

.dpair:hover {
  transform: translateY(-3px)
}

.dpair .asp {
  display: block;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: clamp(1.15rem, 1.45vw, 1.35rem);
  letter-spacing: -.01em;
  color: var(--sienna);
  line-height: 1.15;
  margin-bottom: .9rem;
  position: relative
}

.dpair .asp::after {
  content: "";
  display: block;
  width: 34px;
  height: 2.5px;
  margin-top: .5rem;
  border-radius: 2px;
  background: var(--rust);
  opacity: .55
}

.dpair .most {
  display: block;
  font-size: .92rem;
  line-height: 1.5;
  color: #6E6A5A;
  padding-left: .9rem;
  border-left: 2px solid rgba(110, 106, 90, .28);
  margin-bottom: .9rem
}

.dpair .most em {
  font-style: normal;
  display: block;
  font-size: .74rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #6E6A5A;
  opacity: .85;
  margin-bottom: .2rem
}

.dpair .us {
  display: block;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: clamp(1rem, 1.2vw, 1.14rem);
  line-height: 1.42;
  color: var(--ink)
} 
.wpcf7 form.sent .wpcf7-response-output, .wpcf7 form.invalid .wpcf7-response-output {
    border: none;
    padding: 0;
	 text-align: left;
    float: left;
    width: 100%;
    margin: 20px 0 0 0;
}
@media (max-width:980px) {
      .dpairs {
        grid-template-columns:1fr
      }
    }
    .stop {
      background:linear-gradient(155deg, #6A7730, #556122 82%); color:#FDF3E0; overflow:hidden
    }

    .stop h2 {
      color:#FCFAF0; max-width:16ch
    }

    .stop .eyebrow {
      color:#EAD98A
    }

    .stop .shead {
      max-width:46rem
    }

    .stop .shead p {
      color:#FDF3E0; max-width:34rem; margin-top:var(--sp-3)
    }

    .sgrid {
      margin-top:var(--sp-5); display:flex; flex-wrap:wrap; gap:.85rem 1rem; max-width:58rem
    }

    .chip {
      position:relative; appearance:none; cursor:pointer;
      font-family:'Bricolage Grotesque', sans-serif; font-weight:700;
      font-size:clamp(.95rem, 1.12vw, 1.08rem); letter-spacing:-.005em;
      color:#FDF3E0; background:rgba(255, 255, 255, .07);
      border:1.5px solid rgba(234, 217, 138, .42); border-radius:999px;
      padding:.72em 1.25em; line-height:1.2;
      transition:background .25s, border-color .25s, color .35s, opacity .5s, transform .3s
    }

    .chip:hover:not(:disabled) {
      background:rgba(255, 255, 255, .13); border-color:rgba(234, 217, 138, .85);
      transform:translateY(-1px)
    }

    .chip:focus-visible {
      outline:3px solid #EAD98A; outline-offset:3px
    }

    .chip span {
      position:relative; z-index:1
    }

    .chip:disabled {
      cursor:default
    }

    .chip .strk {
      position:absolute; left:6%; right:6%; top:50%; width:88%; height:1.5em;
      transform:translateY(-50%); overflow:visible; pointer-events:none; z-index:2
    }

    .chip .strk path {
      fill:none; stroke:#F0D46A; stroke-width:2.4; stroke-linecap:round;
      stroke-dasharray:1; stroke-dashoffset:1;
      transition:stroke-dashoffset .42s cubic-bezier(.55, 0, .35, 1)
    }

    .chip.struck {
      background:rgba(0, 0, 0, .16); border-color:rgba(234, 217, 138, .7)
    }

    .chip.struck .strk path {
      stroke-dashoffset:0
    }

    .chip.faded {
      opacity:.3
    }

    .chip.given-back {
      background:#FBEEDC; border-color:#FBEEDC; color:#3F4435;
      transform:translateY(-2px) scale(1.02);
      box-shadow:0 8px 22px rgba(0, 0, 0, .16)
    }

    .chip.given-back .strk path {
      stroke-dashoffset:1; transition:stroke-dashoffset .55s cubic-bezier(.4, 0, .2, 1)
    }

    .sout {
      margin-top:var(--sp-5); opacity:0; transform:translateY(10px);
      transition:opacity .8s cubic-bezier(.2, .9, .3, 1), transform .8s cubic-bezier(.2, .9, .3, 1)
    }

    .sout.show {
      opacity:1; transform:none
    }

    .sout .big {
      font-family:'Bricolage Grotesque', sans-serif; font-weight:700;
      font-size:clamp(2.4rem, 5vw, 4.2rem); line-height:1; color:#FCFAF0; letter-spacing:-.02em
    }

    .sout .small {
      margin-top:.9rem; font-family:'Caveat', cursive; color:#EAD98A !important;
      font-size:clamp(1.25rem, 1.7vw, 1.6rem); line-height:1.35; max-width:34rem
    }

    @media (max-width:760px) {
      .sgrid {
        gap:.7rem
      }

      .chip {
        padding:.65em 1.05em
      }
    }

    .close {
      position:relative; overflow:hidden; isolation:isolate
    }

    .close .bg {
      width:100%; height:auto; display:block
    }

    .close::before {
      content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
      background:linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 70%)
    }

    .close .inner {
		position: absolute;
		z-index: 2;
		left: 50%;
		top: 10%;
		transform: translateX(-50%);
		text-align: center;
	}

   .close h2 {
		color: var(--ink);
		min-width: 300px;
		text-shadow: 0 1px 0 rgba(255,250,235,.55);
		text-align: center;
		margin: 0 auto;
	}

    .close .walk {
      display:block; margin-top:.7rem; font-family:'Caveat', cursive;
      color:#5E3A14; font-size:clamp(1.4rem, 2.5vw, 2.2rem); line-height:1.15
    }

    .close .btn {
      margin-top:clamp(1rem, 2vw, 1.8rem);
      box-shadow:0 8px 24px rgba(120, 80, 30, .22)
    }

    .masc {
      position:absolute; pointer-events:none; z-index:3
    }

    .masc img {
      width:100%; height:auto
    }

    .masc.peek {
      width:clamp(64px, 7vw, 104px); left:2.2%; bottom:7%
    }

    .masc.reach {
      width:clamp(58px, 6vw, 92px); right:2%; top:6%; animation:hover 5s ease-in-out infinite
    }

    .masc.point {
      width:clamp(60px, 6.5vw, 96px); left:1.5%; top:34%; transform:scaleX(-1)
    }

    .masc.wave {
      width:clamp(58px, 6vw, 90px); left:2%; bottom:6%
    }

    .masc.reading {
      width:clamp(60px, 6.4vw, 98px); left:4%; bottom:4%
    }

    @media (max-width:1100px) {
      .masc {
        display:none
      }
    }

    @media (max-width:980px) {
      .pghero .wrap, .story .storygrid, .vm .wrap, .ess .wrap, .threec .top {
        grid-template-columns:1fr
      }

      .beats {
        grid-template-columns:1fr
      }

      .doodle {
        display:none
      }

      .pghero h1 {
        max-width:none
      }

      .heroart {
        margin-top:var(--sp-4)
      }

      .storyart {
        margin-top:var(--sp-4); max-width:520px; margin-inline:auto
      }

      .vmart {
        max-width:420px; margin:0 auto var(--sp-4)
      }

      .ess .intro {
        position:static
      }

      .dim {
        grid-template-columns:58px 1fr; gap:1.1rem
      }

      .dim .ico {
        width:58px; height:58px
      }

      .vgrid {
        grid-template-columns:1fr; gap:var(--sp-4)
      }

      .vitem {
        grid-template-columns:56px 1fr; gap:1rem
      }

      .vitem .ico {
        width:56px; height:56px
      }

      .ccards {
        grid-template-columns:1fr
      }

      .venn {
        padding-top:2.2rem
      }

      .vlabel {
        font-size:.85rem
      }

      .dtable {
        overflow-x:auto
      }

      .dtable table {
        min-width:640px
      }
    }

    @media (max-width:760px) {
      .close .bg {
        height:min(52vh, 320px); object-fit:cover; object-position:50% 58%
      }

      .close::before {
        background:none
      }

      .close .inner {
        position:static; transform:none; width:auto; padding:2rem 1.4rem 2.6rem; background:var(--cream)
      }

      .close h2 {
        max-width:none; text-shadow:none
      }
    }

    .sk-frame {
      position:absolute; inset:-10px; width:calc(100% + 20px); height:calc(100% + 20px);
      pointer-events:none; overflow:visible; z-index:0
    }

    .sk-frame path {
      fill:none; stroke-linecap:round; stroke-linejoin:round
    }

    .doodle {
      position:absolute; z-index:4; pointer-events:none; font-family:'Caveat', cursive;
      color:var(--sienna); font-size:clamp(1rem, 1.3vw, 1.35rem); line-height:1.25; max-width:11rem;
      opacity:0; transform:translateY(8px) rotate(var(--rot, -3deg));
      transition:opacity .7s ease-out .3s, transform .7s ease-out .3s
    }

    .inview .doodle, .doodle.inview {
      opacity:.92; transform:translateY(0) rotate(var(--rot, -3deg))
    }

    .doodle .arrow {
      position:absolute; overflow:visible
    }

    .doodle .arrow path {
      fill:none; stroke:var(--sienna); stroke-width:1.6; stroke-linecap:round;
      stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1s ease-out .5s
    }

    .inview .doodle .arrow path {
      stroke-dashoffset:0
    }

    .trail {
      position:absolute; left:0; right:0; height:120px; pointer-events:none; z-index:1; overflow:visible
    }

    .trail path {
      fill:none; stroke:var(--bronze); stroke-width:2; stroke-linecap:round;
      stroke-dasharray:2 9; opacity:.5
    }

    .trail .bf {
      width:30px
    }

    .tear {
      position:absolute; left:0; right:0; height:26px; pointer-events:none; z-index:2
    }

    .tear.top {
      top:-1px
    }

    .tear.bot {
      bottom:-1px
    }

    .tear svg {
      width:100%; height:100%; display:block
    }

    .numring {
      position:relative; width:46px; height:46px; flex:0 0 auto; display:grid; place-items:center
    }

    .numring svg {
      position:absolute; inset:0; width:100%; height:100%; overflow:visible
    }

    .numring svg path {
      fill:none; stroke-width:2; stroke-linecap:round;
      stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset .9s ease-out
    }

    .inview .numring svg path {
      stroke-dashoffset:0
    }

    .numring b {
      position:relative; font-family:'Caveat', cursive; font-weight:700;
      font-size:1.5rem; line-height:1; color:var(--ink)
    }
.ww-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 20px;
}
.ww-tagline {
    color: #ffd861;
    font-style: italic;
    text-align: center;
    font-size: 1.4rem;
    margin-bottom: 10px;
}
.ww-board-frame {
    border: 8px solid #5a3a22;
    border-radius: 4px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.3);
}
#wwCanvas {
    display: block;
    width: 100%;
    height: auto;
    background-color: #1e331e;
    cursor: crosshair;
}
.ww-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 15px 0;
    color: #fff;
    font-family: sans-serif;
}
.chalk-label { font-size: 1.1rem; color: #F4F0DE; font-family: 'Nunito Sans', sans-serif; }
.text-link {
    background: none;
    border: none;
    color: #F4F0DE;
    cursor: pointer;
	text-decoration:none;
    font-size: 1.1rem;
	font-family: 'Nunito Sans', sans-serif;
}
.chalk-btn {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
}
.chalk-btn.active { border-color: #fff; }
.color-white { background: #ffffff; }
.color-yellow { background: #ffcc00; }
.color-orange { background: #ff6600; }
.color-green { background: #66cc33; }
.ww-input-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-top: 20px;
    width: 100%;
}
.ww-input-row input[type="text"] {
    width: 100%;
    max-width: 400px;
    padding: 10px;
    border: none;
    border-radius: 4px;
}
.ww-input-row button {
    background: #e67e22;
    color: white;
    font-weight: bold;
    border: none;
    padding: 12px 24px;
    border-radius: 4px;
    cursor: pointer;
}
.ww-main-title {
    font-size: 3rem;
    color: #fff;
    text-align: center;
    font-style: italic;
    margin: 40px 0 20px 0;
}
.ww-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}
.ww-card {
    background: #2c3e50; 
    border-radius: 6px;
    padding: 25px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    min-height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.ww-card-text p {
    color: #7f8c8d; 
    font-size: 1.2rem;
    margin: 0;
}
.ww-card-meta {
    text-align: right;
    color: #7f8c8d;
    font-size: 0.9rem;
} 
.ww-input-form {
    width: 100%;
    margin: 25px 0;
    font-family: Arial, sans-serif;
    color: #fff;
}

.ww-form-row {
    margin-bottom: 15px;
    width: 100%;
}
.ww-form-row button{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    background: var(--rust-v);
    color: var(--cream);
    font-weight: 700;
    font-size: 1rem;
    padding: 0.9em 2em;
    border-radius: 10px;
    text-decoration: none;
    transition: background .25s, transform .2s;
	cursor:pointer;
}

.ww-form-row.double {
    display: flex;
    gap: 20px;
}

.ww-field-group {
    display: flex;
    flex-direction: column;
    flex: 1;
}
.ww-field-group label {
    font-weight: bold;
    margin-bottom: 6px;
    color: #ffd861;
}
.ww-field-group option {
    color: #000;
    background: transparent;
}
.ww-field-group input[type="text"],
.ww-field-group select,
.ww-field-group textarea {
    font-family: inherit;
    font-size: .98rem;
    padding: .72em 1em;
    border-radius: 10px;
    width: min(360px,80vw);
    border: 2px solid rgba(252,250,240,.35);
    background: rgba(252,250,240,.1);
    color: #FCFAF0;
	width:100%;
}
.ww-field-group textarea {
    resize: vertical;
} 
	
@media screen and (max-width: 600px) {
    .ww-form-row.double {
        flex-direction: column;
        gap: 15px;
    }
} 
.ww-card {
    background: #2c3e50; 
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
}

.ww-card-image img {
    width: 100%;
    height: auto;
    border-radius: 4px;
    margin-bottom: 12px;
    border: 1px solid #34495e;
}
.ww-card-text {
    flex-grow: 1;
    margin-bottom: 15px;
}
.ww-message-bubble {
    color: #ffd861 !important;
    font-size: 1.25rem;
    line-height: 1.4;
    font-style: italic;
    margin: 5px 0 0 0;
    word-break: break-word;
}
.ww-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    font-size: 0.9rem;
    color: #bdc3c7; 
}
.ww-meta-author {
    font-size: 15px;
    color: #C9D6B8;
    padding:0;
    font-weight: 600;
}

.ww-meta-role {
    background: rgba(255, 255, 255, 0.1);
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.chero{background:var(--cream)}
.chero .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;
  gap:clamp(1.75rem,2vw,4rem)}
.chero h1{color:var(--sienna);max-width:12ch}
.chero .lede{max-width:30rem;color:var(--ink)}

.cwall{display:grid;grid-template-columns:repeat(3,1fr);align-items:start;
  gap:clamp(.8rem,1.5vw,1.4rem);padding-block:clamp(.4rem,1vw,1rem)}
.cframe{display:block;text-decoration:none;color:inherit;--ac:var(--olive)}
.cframe:nth-child(3n+2){margin-top:clamp(20px,3vw,42px)}
.cpic{display:block;background:#50503F;padding:clamp(5px,.6vw,8px);border-radius:4px;
  box-shadow:0 14px 26px rgba(55,44,20,.18),0 3px 7px rgba(55,44,20,.10);
  transition:transform .35s ease,box-shadow .35s ease}
.cmat{display:block;background:var(--cream-warm);padding:clamp(7px,.9vw,12px);border-radius:1px}
.cframe img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:1px;
  box-shadow:0 0 0 1px rgba(80,80,63,.12)}
.cplate{display:flex;align-items:center;justify-content:center;gap:.45rem;margin-top:.55rem;
  font-family:'Caveat',cursive;font-size:1.2rem;color:var(--olive-ink);text-align:center;line-height:1.1}
.cplate::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--ac);flex:0 0 auto}
.cframe:hover .cpic,.cframe:focus-visible .cpic{transform:translateY(-6px);
  box-shadow:0 22px 38px rgba(55,44,20,.24),0 5px 10px rgba(55,44,20,.14)}
.cframe:focus-visible{outline:none}
.cframe:focus-visible .cpic{outline:3px solid var(--ac);outline-offset:4px}

/* stub anchors — replaced section-by-section as we build */
.cstub{border-top:3px solid var(--ac);--ac:var(--olive);background:var(--cream)}
.cstub .eyebrow{color:var(--olive-ink);font-family:'Caveat',cursive}
.cstub h2{font-size:var(--t-h2);color:var(--ink);max-width:22ch;margin-top:.15rem;line-height:1.1}
.cstub .lede{margin-top:var(--sp-2);color:var(--ink-soft);font-size:var(--t-body)}
.chero{background:var(--cream);min-height:82vh;display:flex;align-items:center;padding-block:clamp(3rem,6vw,5rem)}
.chero>.wrap{width:100%}
.chero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.chero-copy .eyebrow{margin-bottom:.3rem}
.chero-copy h1{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--sienna);font-size:clamp(2.4rem,5vw,3.6rem);line-height:1.02;margin:0 0 .8rem}
.chero-lead{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;color:var(--ink);font-size:clamp(1.2rem,2.2vw,1.6rem);line-height:1.3;margin:0 0 1.1rem;max-width:26ch}
.chero-body{color:var(--ink-soft);font-size:1.06rem;line-height:1.6;margin:0 0 .8rem;max-width:40ch}
.chero-note{font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:1.5rem;margin:0 0 1.5rem}
.chero-art{position:relative;min-height:360px;display:flex;align-items:center;justify-content:center}
.chero-art img{position:relative}
.chero-art .m1 {
    width: min(270px,50%);
    max-width: 300px;
    z-index: 2;
}.chero-art .m2{display:none}
.chero-art .m3{display:none}

.cform{background:#5F6A29}
.cform-head{text-align:center;max-width:54ch;margin:0 auto var(--sp-4)}
.cform-head h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:#FFF7EA;font-size:var(--t-h2);margin:0 0 .6rem}
.cform-head p{color:#EFE7D2;font-size:var(--t-lead);line-height:1.55;margin:0}
.cf{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:1.1rem;background:#FFFDF7;padding:clamp(1.8rem,3.5vw,2.8rem);border-radius:24px;box-shadow:0 20px 46px rgba(30,38,15,.24)}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem; margin-bottom:20px;}
.cf-field{display:flex;flex-direction:column;gap:.4rem}
.cf-field label{font-family:'Nunito Sans',sans-serif;font-weight:700;font-size:.92rem;color:var(--ink-soft); display: inline-block; width: 100%; text-align: left;}
.cf-field input, .cf-field select, .cf-field textarea {
    padding: .85rem 1rem;
    border: 1.6px solid rgba(143,81,23,.24);
    border-radius: 12px;
    background: #FFFFFF;
    font-family: 'Nunito Sans',sans-serif;
    font-size: 1rem;
    color: var(--ink);
    transition: border-color .2s,box-shadow .2s;
	width:100%;
}
.cf-field input:focus,.cf-field select:focus,.cf-field textarea:focus{outline:none;border-color:var(--rust);box-shadow:0 0 0 3px rgba(195,120,42,.16)}
.cf-field select{appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%238F5117' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.4rem}
.cf-field select:invalid{color:#a99a80}
.cf-field textarea{min-height:80px;resize:vertical;line-height:1.5}
.cf-full{grid-column:1/-1}
.cf-err{font-size:.82rem;color:#A8432C;font-family:'Nunito Sans',sans-serif;min-height:0;opacity:0;transition:opacity .2s}
.cf-err.show{opacity:1}
.cf-field.bad input,.cf-field.bad select,.cf-field.bad textarea{border-color:#C55A3A}
.cf-submit{align-self:flex-start;margin-top:.4rem;border:none;cursor:pointer;font-size:1.02rem; float:left; margin-top:20px;}
.cf-thanks{display:none;text-align:center;padding:2.2rem 1.5rem;background:#FFFDF7;border:1.6px solid rgba(95,106,41,.3);border-radius:16px}
.cf-thanks.show{display:block}
.cf-thanks h3{font-family:'Bricolage Grotesque',sans-serif;color:var(--olive);font-size:1.6rem;margin:0 0 .5rem}
.cf-thanks p{color:var(--ink-soft);margin:0}

.cvisit{display:grid;grid-template-columns:1fr 1.15fr;min-height:440px}
.cvisit-info{background:#9C5D1B;color:var(--cream);padding:clamp(2.4rem,4vw,3.6rem);display:flex;flex-direction:column;justify-content:center}
.cvisit-info h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:clamp(1.8rem,3vw,2.4rem);margin:0 0 .9rem;color:#FFF7EA}
.cvisit-info p{font-size:1.05rem;line-height:1.6;margin:0 0 1.8rem;max-width:38ch;color:#FFF4E6}
.cvisit-info p{color:#FFF4E6}
.cvisit-details{display:flex;flex-direction:column;gap:.9rem;font-size:1rem;line-height:1.5;color:#FFF4E6}
.cvisit-details a{color:#FFF7EA;text-decoration:none;border-bottom:1px solid rgba(255,247,234,.4)}
.cvisit-row{display:flex;align-items:flex-start;gap:.65rem}
.cvisit-row svg{width:20px;height:20px;flex:0 0 auto;margin-top:2px;stroke:#FFF7EA;fill:none;stroke-width:1.7}
.cvisit-map{position:relative;background:var(--kraft);min-height:340px}
.cvisit-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cvisit-map .map-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--ink-soft);font-family:'Caveat',cursive;font-size:1.3rem;padding:1.5rem}

.careers{background:#FBEDD4}
.careers-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.careers-copy .eyebrow{margin-bottom:.3rem}
.careers-intro{text-align:center;max-width:680px;margin:0 auto}
.careers-intro h2{max-width:none;margin-inline:auto}
.careers-intro p{max-width:none;margin:0 auto 0}
.careers-copy h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--olive);font-size:clamp(1.9rem,3.4vw,2.6rem);line-height:1.06;margin:0 auto;max-width:16ch}
.careers-copy p{color:var(--ink-soft);font-size:1.08rem;line-height:1.65;margin:0 auto;max-width:46ch}
.careers-art{display:flex;justify-content:center}
.careers-art img{width:min(290px,78%);max-width:305px;transform:rotate(2deg);filter:drop-shadow(0 10px 18px rgba(90,60,25,.12))}

.ccta{position:relative;min-height:580px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.ccta-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.ccta::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(63,68,53,.34),rgba(63,68,53,.5));z-index:1}
.ccta-inner{position:relative;z-index:2;padding:2rem;max-width:44ch}
.ccta-inner h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:#FFFDF7;font-size:clamp(2rem,4vw,3rem);line-height:1.05;margin:0 0 .8rem}
.ccta-inner p{color:#F6EEDD;font-size:1.15rem;line-height:1.5;margin:0 0 1.7rem}
.ccta-inner .btn{background:#FBF6EA;color:#B65A2E;padding:1.05rem 2.6rem;font-size:1.12rem;font-weight:800;border-radius:16px;box-shadow:0 10px 26px rgba(60,40,15,.28)}
.ccta-inner .btn:hover{background:#fff;transform:translateY(-2px)}

@media (max-width:820px){
  .chero-grid,.careers-grid{grid-template-columns:1fr}
  .chero-art{order:-1;min-height:auto;max-width:360px;margin:0 auto}
  .cvisit{grid-template-columns:1fr}
  .cvisit-map{min-height:300px}
  .careers-art{order:-1}
}
@media (max-width:640px){ .cf-row{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ .cf-field input,.cf-field select,.cf-field textarea,.cf-err{transition:none} }


/* ---- contact page: texture & warmth ---- */
.fp-deco{position:absolute;pointer-events:none;z-index:0;opacity:.09}
.fp-deco .fp-svg{width:100%;height:auto;display:block}
.fp-deco.d-olive .fp-svg ellipse,.fp-deco.d-olive .fp-svg circle{stroke:var(--olive);fill:var(--olive)}
.fp-deco.d-gold .fp-svg ellipse,.fp-deco.d-gold .fp-svg circle{stroke:var(--gold);fill:var(--gold)}
.fp-cream{opacity:.16}
.fp-cream .fp-svg ellipse,.fp-cream .fp-svg circle{stroke:#FBEEDA;fill:#FBEEDA}
.chero,.cform,.careers{position:relative;overflow:hidden}
.chero .wrap,.cform .wrap,.careers .wrap{position:relative;z-index:2}
/* hero */
.chero-blob{position:absolute;right:6%;top:14%;width:min(560px,44vw);height:min(560px,44vw);z-index:0;pointer-events:none;
  background:radial-gradient(closest-side,rgba(227,168,42,.20),rgba(227,168,42,.06) 62%,transparent 74%)}
.chero-underline{position:absolute;left:0;bottom:-.65rem;width:min(430px,90%);height:14px;overflow:visible}
.chero-underline path{fill:none;stroke:var(--gold);stroke-width:3.4;stroke-linecap:round;opacity:.9}
.chero-copy h1{position:relative;display:inline-block; max-width:100%;}
.chero-art{z-index:2}
.chero-art img{filter:drop-shadow(0 10px 18px rgba(90,60,25,.12));animation:cfloat 6s ease-in-out infinite}
.chero-art .m2{animation-delay:.8s}.chero-art .m3{animation-delay:1.6s}
@keyframes cfloat{0%,100%{transform:var(--rot) translateY(0)}50%{transform:var(--rot) translateY(-10px)}}
.chero-art .m1 {
    --rot: rotate(0deg);
}/* botanical branch accents */
.branch-deco{position:absolute;z-index:1;pointer-events:none;opacity:.32;filter:saturate(.95) sepia(.12)}
.branch-tr{top:-10px;right:-14px;width:min(240px,26vw);transform:scaleX(-1) rotate(4deg)}
.branch-bl{left:-20px;bottom:-24px;width:min(220px,24vw);transform:rotate(-6deg)}
.careers-branch{top:-8px;right:4%;width:min(190px,20vw);opacity:.3}
@media (prefers-reduced-motion:reduce){ .chero-art img{animation:none} }
@media (max-width:820px){ .chero-blob{right:auto;left:50%;transform:translateX(-50%);top:auto;bottom:0} .branch-tr,.branch-bl{display:none} }


.careers .cf{margin-top:clamp(2rem,4.5vw,3.2rem)}
.hf-head{text-align:center;margin-bottom:.5rem}
.hf-head h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--olive);font-size:clamp(1.4rem,2.6vw,1.9rem);margin:0 0 .3rem}
.hf-head p{color:var(--ink-soft);margin:0;font-size:1rem}
.hf-note{text-align:center;font-size:.92rem;color:var(--ink-soft);margin:.4rem 0 0}
.hf-note a{color:var(--rust);font-weight:700}

.wa-fab{position:fixed;right:28px;bottom:28px;z-index:80;width:58px;height:58px;border-radius:50%;
  background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(20,80,40,.32);transition:transform .18s}
.wa-fab:hover{transform:scale(1.07)}
.wa-fab svg{width:40px;height:40px}
@media (prefers-reduced-motion:reduce){.wa-fab{transition:none}}
@media (max-width:900px){ .chero .wrap{grid-template-columns:1fr} }
@media (max-width:560px){
  .cwall{grid-template-columns:1fr 1fr;gap:1rem}
  .cframe:nth-child(3n+2){margin-top:0}
}
@media (prefers-reduced-motion:reduce){
  .cpic{transition:none}
  .cframe:hover .cpic,.cframe:focus-visible .cpic{transform:none}
}


/* ---- campus named-place sections ---- */
.csec{background:var(--cream);--ac:var(--olive)}
.csec .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  gap:clamp(2rem,5vw,4.5rem);align-items:center}
.csec .eyebrow{display:flex;align-items:center;gap:.55rem;font-family:'Caveat',cursive;color:var(--olive-ink)}
.csec .eyebrow::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ac);flex:0 0 auto}
.csec h2{font-size:var(--t-h2);color:var(--ink);max-width:15ch;margin:.35rem 0 var(--sp-3);line-height:1.08}
.csec p{font-size:var(--t-lead);color:var(--ink);max-width:var(--measure);line-height:1.55}
.csec .hand{display:inline-block;margin-top:var(--sp-3);font-family:'Caveat',cursive;
  font-size:var(--t-hand);color:var(--olive-ink)}
.csec-art{margin:0;max-width:460px;justify-self:center;width:100%}
.cpic2{display:block;background:#50503F;padding:clamp(6px,.7vw,10px);border-radius:5px;
  box-shadow:0 18px 34px rgba(55,44,20,.18),0 4px 9px rgba(55,44,20,.10)}
.cmat2{display:block;background:var(--cream-warm);padding:clamp(10px,1.4vw,18px);border-radius:1px}
.csec-art img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:1px;
  box-shadow:0 0 0 1px rgba(80,80,63,.12)}
@media (max-width:820px){
  .csec .wrap{grid-template-columns:1fr;gap:clamp(1.4rem,5vw,2.4rem)}
  .csec-art{max-width:360px}
}


/* ---- feature list (thematic sections) ---- */
.cfeats{margin-top:var(--sp-4);display:flex;flex-direction:column;gap:1.05rem;max-width:var(--measure)}
.cfeat{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:start}
.cfeat .fic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:rgba(135,132,50,.14);flex:0 0 auto}
.cfeat .fic svg{width:22px;height:22px;fill:none;stroke:var(--olive-ink);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.cfeat .ftx b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--ink);font-size:var(--t-body);margin-bottom:.12rem;line-height:1.2}
.cfeat .ftx span{color:var(--ink-soft);font-size:var(--t-small);line-height:1.45}


/* ---- §2 Nature triptych ---- */
.nsec{background:var(--cream)}
.nsec-head{max-width:58ch;margin:0 auto var(--sp-5);text-align:center}
.nsec-head h2{font-size:var(--t-h2);color:var(--ink);line-height:1.08;margin-bottom:var(--sp-3)}
.nsec-head p{font-size:var(--t-lead);color:var(--ink);line-height:1.55}
.ntrip{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,3vw,2.6rem);align-items:start}
.nvig{margin:0}
.nvig img{display:block;width:100%;height:auto;aspect-ratio:1/1}
.nvig figcaption{margin-top:.5rem;text-align:center;padding-inline:.4rem}
.nvig figcaption b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--olive-ink);font-size:var(--t-body);margin-bottom:.2rem;line-height:1.2}
.nvig figcaption span{color:var(--ink-soft);font-size:var(--t-small);line-height:1.45}
@media (max-width:820px){
  .ntrip{grid-template-columns:1fr;gap:clamp(1.8rem,6vw,2.6rem);max-width:420px;margin-inline:auto}
}
.ssec{background:var(--cream)}
.ssec-head{max-width:60ch;margin:0 auto var(--sp-5);text-align:center}
.ssec-head h2{font-size:var(--t-h2);color:var(--ink);line-height:1.08;margin-bottom:var(--sp-3)}
.ssec-head p{font-size:var(--t-lead);color:var(--ink);line-height:1.55;max-width:58ch;margin-inline:auto}
.ssec-head p + p{margin-top:var(--sp-2)}
.sflow{position:relative;max-width:540px;margin:0 auto;display:flex;flex-direction:column;gap:0}
.sstation{display:grid;grid-template-columns:72px 1fr;gap:clamp(1rem,2.4vw,1.6rem);
  align-items:center;min-height:96px;position:relative;z-index:1}
.sglyph{width:72px;height:72px;border-radius:50%;background:#EFE1CE;display:grid;place-items:center}
.sglyph svg{width:42px;height:42px}
.sglyph :is(path,circle,rect){fill:none;stroke:var(--sienna-ink);stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.stext b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--sienna-ink);font-size:var(--t-lead);margin-bottom:.15rem;line-height:1.15}
.stext span{color:var(--ink-soft);font-size:var(--t-body);line-height:1.45}
.sspine{position:absolute;left:0;top:12px;bottom:12px;width:72px;z-index:0}
.sspine path{fill:none;stroke:var(--sienna);stroke-width:1.5;stroke-linecap:round}
.ssec .sspine path,.ssec .sglyph :is(path,circle,rect){stroke-dasharray:1;stroke-dashoffset:1}
.ssec.inview .sspine path{stroke-dashoffset:0;transition:stroke-dashoffset 1.3s ease .1s}
.ssec.inview .sstation .sglyph :is(path,circle,rect){stroke-dashoffset:0;transition:stroke-dashoffset .9s ease}
.ssec.inview .sstation:nth-child(2) .sglyph :is(path,circle,rect){transition-delay:.30s}
.ssec.inview .sstation:nth-child(3) .sglyph :is(path,circle,rect){transition-delay:.50s}
.ssec.inview .sstation:nth-child(4) .sglyph :is(path,circle,rect){transition-delay:.70s}

@media (max-width:560px){
  .sstation{grid-template-columns:60px 1fr;min-height:84px}
  .sglyph{width:60px;height:60px}.sglyph svg{width:34px;height:34px}
  .sspine{width:60px}
}
@media (prefers-reduced-motion:reduce){
  .ssec .sspine path,.ssec .sglyph :is(path,circle,rect){stroke-dashoffset:0;transition:none}
}

.lhero{position:relative;overflow:hidden;
  background:linear-gradient(160deg,#FBE7C2 0%,#F7E1BA 55%,#F3DBB0 100%);
  padding:calc(96px + clamp(2rem,4vw,3.5rem)) 0 0}
.lhero{padding-bottom:0}
.lhero .wrap{display:grid;grid-template-columns:.78fr 1.22fr;
  gap:clamp(1rem,3vw,2.5rem);align-items:center}
.lhero .copy{padding-bottom:clamp(2.5rem,5vw,4.5rem)}
.lhero .eyebrow{display:block;font-family:'Caveat',cursive;color:var(--sienna);
  font-size:var(--t-hand);margin-bottom:.1rem;letter-spacing:.01em}
.lhero h1{font-family:'Bricolage Grotesque',sans-serif;line-height:1.06;letter-spacing:-.01em;max-width:12ch;
  font-size:clamp(2.3rem,4.3vw,4.1rem);color:var(--ink);font-weight:700}
.lhero h1 .thin{display:block;text-transform:none;font-weight:500;letter-spacing:-.01em;
  font-size:.62em;color:var(--sienna);margin-bottom:.1em}
.lhero .lede{margin-top:var(--sp-3);font-size:var(--t-lead);color:var(--sienna-ink);
  max-width:30rem;line-height:1.6}
.lhero .btn{margin-top:var(--sp-4)}
.lheroart{position:relative;align-self:center;justify-self:end;width:100%}
.lheroart .plate{width:100%;max-width:none;height:auto;display:block}
.lheroart .drift{position:absolute;inset:0;pointer-events:none;overflow:visible}
.lheroart .lf{position:absolute;height:auto;opacity:0;transform-origin:50% 50%;
  animation:qdrift var(--dur,11s) ease-in-out var(--del,0s) infinite;will-change:transform}
.beyond{background:var(--cream-deep);position:relative;overflow:hidden}
.beyond .whead{text-align:center;max-width:46rem;margin:0 auto var(--sp-5)}
.beyond h2{color:var(--sienna);font-size:var(--t-h2);letter-spacing:-.01em;line-height:1.08}
.beyond .lead-in{margin-top:var(--sp-3);font-size:var(--t-lead);color:var(--ink);line-height:1.6}
.l2flow {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: clamp(1rem,2vw,1rem);
    max-width: 74rem;
    margin-inline: auto;
}
gap:clamp(1rem,3vw,3rem);max-width:64rem;margin-inline:auto}
.l2word{text-align:center}
.l2word .l2big{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:clamp(1.9rem,4vw,3.4rem);line-height:1;letter-spacing:-.02em}
.l2word.u .big{color:var(--olive-ink)}
.l2word.a .big{color:var(--sienna)}
.l2word .l2lbl{display:inline-block;margin-top:.7rem;font-family:'Bricolage Grotesque',sans-serif;
  font-weight:700;font-size:clamp(.82rem,1vw,.95rem);letter-spacing:.02em;
  padding:.35em 1em;border-radius:999px;line-height:1.3}
.l2word.u .l2lbl{background:rgba(135,132,50,.16);color:var(--olive-ink)}
.l2word.a .l2lbl{background:rgba(195,120,42,.15);color:var(--sienna-ink)}
.l2word .l2det{margin-top:1.1rem;font-size:var(--t-small);color:var(--ink-soft);line-height:1.55;
  max-width:20rem;margin-inline:auto}
.l2word .l2det b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--ink);margin-bottom:.3rem;font-size:var(--t-body)}
.l2line{width:clamp(60px,10vw,150px);height:60px;overflow:visible}
.l2line path{fill:none;stroke:var(--rust);stroke-width:2.4;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s ease-out .2s}
.beyond.inview .l2line path{stroke-dashoffset:0}
.l2line .head{opacity:0;transition:opacity .3s ease 1.1s}
.beyond.inview .l2line .head{opacity:1}
.beyond .together{margin-top:var(--sp-5);text-align:center;font-size:var(--t-lead);color:var(--ink);
  line-height:1.6;max-width:44rem;margin-inline:auto}
@media (max-width:760px){
  .l2flow{grid-template-columns:1fr;gap:1.5rem}
  .l2line{transform:rotate(90deg);width:60px;margin-inline:auto}
}
.eway{background:var(--cream)}
.eway .whead{text-align:center;max-width:44rem;margin-inline:auto}
.eway h2{color:var(--sienna);font-size:var(--t-h2);letter-spacing:-.01em;line-height:1.08}
.eway .esub2{margin-top:var(--sp-2);font-family:'Caveat',cursive;color:var(--olive-disp);
  font-size:clamp(1.3rem,1.8vw,1.7rem)}
.pillars{margin-top:var(--sp-5);display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(1.4rem,3vw,3rem)}
.pillar{position:relative;text-align:center}
.pillar .art{width:100%;max-width:300px;margin:0 auto var(--sp-3);display:block;
  aspect-ratio:auto;object-fit:contain}
.pillar h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:clamp(1.15rem,1.5vw,1.42rem);letter-spacing:-.005em;line-height:1.15;margin-bottom:.7rem}
.pillar.c1 h3{color:var(--sienna-ink)}
.pillar.c2 h3{color:#8A6410}
.pillar.c3 h3{color:var(--olive-ink)}
.pillar .desc{font-size:var(--t-small);color:var(--ink-soft);line-height:1.6;max-width:26rem;margin-inline:auto}
.pillar .tags{margin-top:1rem;display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.pillar .tags span{font-size:.78rem;font-family:'Bricolage Grotesque',sans-serif;font-weight:600;
  padding:.3em .8em;border-radius:999px;line-height:1.3}
.pillar.c1 .tags span{background:rgba(195,120,42,.13);color:var(--sienna-ink)}
.pillar.c2 .tags span{background:rgba(227,168,42,.16);color:#8A6410}
.pillar.c3 .tags span{background:rgba(135,132,50,.14);color:var(--olive-ink)}
@media (max-width:820px){ .pillars{grid-template-columns:1fr;gap:var(--sp-5);max-width:24rem;margin-inline:auto} }

.cont{background:linear-gradient(150deg,#DCE7CE,#CFDDBC);position:relative;overflow:hidden}
.cont .chead{max-width:34rem;position:relative;z-index:2; left: clamp(1rem, 4vw, 4rem);}
.cont h2{color:var(--ink);font-size:clamp(2.1rem,3.6vw,3.3rem);letter-spacing:-.015em;line-height:1;font-weight:700}
.cont .kick{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--olive-ink);font-size:var(--t-body);margin-top:var(--sp-3)}
.cont .cintro{margin-top:var(--sp-3);max-width:32rem}
.cont .cintro p{color:var(--ink-soft);font-size:var(--t-small);line-height:1.6;margin-top:.7rem}
.cont .cintro p:first-child{color:#7E4E12;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:var(--t-body)}

.road{position:relative;margin-top:clamp(2rem,5vw,4rem);min-height:clamp(420px,40vw,600px)}
.roadpath{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:0}
.roadpath .trail{fill:none;stroke:#C89B5C;stroke-width:26;stroke-linecap:round;opacity:.4}
.roadpath .trailink{fill:none;stroke:#B0812F;stroke-width:2.5;stroke-linecap:round;
  stroke-dasharray:8 12;stroke-dashoffset:1;opacity:.7}
.roadpath .trailink.draw{stroke-dasharray:1;stroke-dashoffset:1;
  transition:stroke-dashoffset 2s ease-out}
.cont.inview .roadpath .trailink.draw{stroke-dashoffset:0}

.walker{position:absolute;z-index:2;
  opacity:0;transform:translateY(14px);transition:opacity .7s ease-out,transform .7s ease-out}
.walker.on{opacity:1;transform:none}
.walker img{width:100%;height:auto;display:block;filter:drop-shadow(0 6px 10px rgba(90,70,30,.15))}
.w1{left:7%;bottom:3%;width:clamp(64px,7vw,92px)}   /* seedling — smallest */
.w2{left:44%;top:36%;width:clamp(80px,9vw,116px);transform:translateY(14px) translateX(-50%)}  /* growing */
.w2.on{transform:translateX(-50%)}
.w3{right:6%;top:8%;width:clamp(96px,11vw,144px)}   /* grown — largest */

.waymark{position:absolute;z-index:3;max-width:min(240px,34vw);
  opacity:0;transform:translateY(16px);transition:opacity .7s ease-out .15s,transform .7s ease-out .15s}
.waymark.on{opacity:1;transform:none}
.waymark .num{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:var(--rust);color:#FFF7E9;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:1.2rem;margin-bottom:.7rem}
.waymark h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:clamp(1.05rem,1.4vw,1.3rem);color:var(--ink);margin-bottom:.4rem}
.waymark p{font-size:var(--t-small);color:var(--ink-soft);line-height:1.5}
.m1{left:clamp(1rem,4vw,4rem);bottom:26%}
.m2{left:50%;top:14%;transform:translateX(-50%) translateY(16px);text-align:center}
.m2.on{transform:translateX(-50%)}
.m3{right:clamp(1rem,4vw,4rem);top:42%;text-align:right}
.m3 .num{margin-left:auto}

@media (max-width:820px){
  .road{min-height:0;display:flex;flex-direction:column;gap:var(--sp-4);padding-left:1rem}
  .roadpath{display:none}
  .walker{position:relative;opacity:1;transform:none;left:auto;right:auto;top:auto;bottom:auto;
    width:64px;margin-bottom:-1rem}
  .w2,.w2.on{transform:none}
  .waymark{position:relative;opacity:1;transform:none;left:auto;right:auto;top:auto;bottom:auto;
    max-width:none;text-align:left !important;border-left:3px solid var(--rust);padding-left:1rem}
  .m2,.m2.on,.m3{transform:none;text-align:left}
  .m3 .num{margin-left:0}
}
.iact{background:var(--cream-deep)}
.iact .ihead{max-width:52rem}
.iact h2{color:var(--ink);font-size:var(--t-h2);letter-spacing:-.015em;line-height:1.05}
.iact .kick{display:block;margin-top:var(--sp-3);font-family:'Bricolage Grotesque',sans-serif;
  font-weight:700;color:var(--sienna-ink);font-size:var(--t-body)}
.iact .lead{margin-top:var(--sp-3);font-size:var(--t-body);color:var(--ink-soft);line-height:1.6;max-width:44rem}
.iactbadge{display:inline-block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--sienna-ink);background:rgba(195,120,42,.14);padding:.05em .5em;border-radius:7px;letter-spacing:.01em}
.iact .ipaths{margin-top:var(--sp-4);font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--olive-ink);font-size:clamp(1.05rem,1.4vw,1.3rem);line-height:1.4;max-width:46rem}
.iacttabs{margin-top:var(--sp-5);display:flex;gap:.6rem;flex-wrap:wrap;border-bottom:2px solid rgba(150,120,70,.18)}
.iacttab{appearance:none;border:0;background:none;cursor:pointer;padding:.9rem 1.4rem;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:clamp(1rem,1.3vw,1.2rem);
  color:var(--ink-soft);position:relative;transition:color .25s;border-radius:10px 10px 0 0}
.iacttab:hover{color:var(--ink)}
.iacttab[aria-selected="true"]{color:var(--sienna-ink)}
.iacttab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;
  background:var(--rust);border-radius:3px 3px 0 0}
.iacttab:focus-visible{outline:2px solid var(--rust);outline-offset:2px}
.iactpanel{margin-top:var(--sp-4);min-height:230px}
.iactframe{display:none}
.iactframe.on{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;
  animation:iactfade .45s ease-out}
@keyframes iactfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.iactframe .fkick{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--ink);
  font-size:clamp(1.1rem,1.5vw,1.4rem)}
.iactframe .fdesc{font-size:var(--t-body);color:var(--ink-soft);line-height:1.6;max-width:46rem}
.farc{margin-top:var(--sp-3);display:flex;align-items:center;gap:clamp(.6rem,2vw,1.6rem);flex-wrap:wrap}
.fstep{display:flex;align-items:center;gap:.7rem}
.fstep .dot{width:16px;height:16px;border-radius:50%;flex:0 0 auto}
.farc.c1 .fstep .dot{background:var(--rust)}
.farc.c2 .fstep .dot{background:var(--gold)}
.farc.c3 .fstep .dot{background:var(--olive)}
.fstep .lbl{font-family:'Caveat',cursive;font-size:clamp(1.3rem,1.8vw,1.7rem);color:var(--ink)}
.farrow{width:clamp(28px,4vw,52px);height:14px;flex:0 0 auto;overflow:visible}
.farrow path{fill:none;stroke:var(--bronze);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:1;stroke-dashoffset:1}
.iactframe.on .farrow path{animation:farrowdraw .6s ease-out forwards}
.iactframe.on .farrow:nth-of-type(2) path{animation-delay:.15s}
@keyframes farrowdraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.iactframe.on{animation:none}.iactframe.on .farrow path{animation:none;stroke-dashoffset:0}}

@media (max-width:640px){
  .iacttabs{flex-direction:column;border-bottom:0;gap:.3rem}
  .iacttab{text-align:left;border:0;border-left:3px solid transparent;border-radius:0}
  .iacttab[aria-selected="true"]{border-left-color:var(--rust)}
  .iacttab[aria-selected="true"]::after{display:none}
  .farc{flex-direction:column;align-items:flex-start;gap:.5rem}
  .farrow{transform:rotate(90deg);margin-left:6px}
}

/* ── 6. GROWTH GUIDED (warm peach, 4 clean cards) ── */
.growth{background:linear-gradient(160deg,#6C7C32 0%,#5E6E28 55%,#4E5D22 100%)}
.growth h2{text-align:center;color:var(--cream);font-size:var(--t-h2);letter-spacing:-.01em;
  max-width:24ch;margin-inline:auto;line-height:1.08}
.ggrid{margin-top:var(--sp-5);display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,1.8vw,1.5rem);align-items:stretch}
.gcard{background:var(--cream-warm);border-radius:18px;
  padding:1.8rem 1.5rem 2rem;display:flex;flex-direction:column;
  transition:transform .3s,background .3s;box-shadow:0 12px 30px rgba(35,45,18,.20)}
.gcard:hover{transform:translateY(-4px);background:#FFFEFB}
.gcard .ico{width:52px;height:52px;margin-bottom:1.1rem;border-radius:14px;display:grid;place-items:center}
.gcard.g1 .ico{background:rgba(195,120,42,.14)}
.gcard.g2 .ico{background:rgba(227,168,42,.18)}
.gcard.g3 .ico{background:rgba(135,132,50,.15)}
.gcard.g4 .ico{background:rgba(182,136,59,.16)}
.gcard .ico svg{width:28px;height:28px}
.gcard h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;line-height:1.18;
  font-size:clamp(1.05rem,1.25vw,1.2rem);margin-bottom:.55rem}
.gcard.g1 h3{color:var(--sienna-ink)}.gcard.g2 h3{color:#8A6410}
.gcard.g3 h3{color:var(--olive-ink)}.gcard.g4 h3{color:var(--sienna-ink)}
.gcard p{font-size:var(--t-small);color:var(--ink-soft);line-height:1.5;margin-top:auto}
.gcard {
    background: var(--cream-warm);
    border-radius: 18px;
    padding: 1.8rem 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    transition: transform .3s,background .3s;
    box-shadow: 0 12px 30px rgba(35,45,18,.20);
}
@media (max-width:900px){ .ggrid{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .ggrid{grid-template-columns:1fr} }

/* ── 7. EKAAYA ENRICHMENT — the campus you explore (light) ── */
.enrich{background:linear-gradient(160deg,#FBEBCB 0%,#F7E4C0 60%,#F3DEB4 100%);color:var(--ink);overflow:hidden}
.enrich .ehead{text-align:center;max-width:46rem;margin:0 auto var(--sp-3)}
.enrich h2{color:var(--sienna);font-size:var(--t-h2);letter-spacing:-.01em}
.enrich .esub{color:var(--olive-disp);font-family:'Caveat',cursive;font-size:clamp(1.3rem,1.8vw,1.7rem);margin-top:.4rem}
.enrich .hint{display:block;margin-top:.6rem;font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:clamp(1rem,1.25vw,1.2rem)}

.scene{position:relative;margin-top:var(--sp-3);max-width:860px;margin-inline:auto}
.scene + .scene{margin-top:var(--sp-3)}
.scene .glabel{display:block;text-align:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sienna-ink);margin-bottom:.5rem}
.scene .stage-img{width:100%;height:auto;display:block}
.scene .hotspots{position:absolute;inset:0}
.hot{position:absolute;transform:translate(-50%,-50%);width:clamp(38px,3.6vw,50px);height:clamp(38px,3.6vw,50px);
  border-radius:50%;border:0;cursor:pointer;padding:0;z-index:4;
  background:#FFFFFF;box-shadow:0 4px 14px rgba(120,80,30,.35);
  display:grid;place-items:center;
  transition:transform .2s ease,box-shadow .2s ease}
/* the + symbol */
.hot::before{content:"";width:44%;height:2.5px;background:var(--rust);border-radius:2px;grid-area:1/1}
.hot::after{content:"";width:2.5px;height:44%;background:var(--rust);border-radius:2px;grid-area:1/1;
  transition:transform .3s ease}
/* a pulsing ring around the pin so it draws the eye */
.hot .ring{position:absolute;inset:-6px;border-radius:50%;border:2.5px solid var(--rust);
  opacity:.55;animation:hotring 2s ease-out infinite;pointer-events:none}
@keyframes hotring{0%{transform:scale(.85);opacity:.6}70%{transform:scale(1.5);opacity:0}100%{opacity:0}}
.hot:hover,.hot:focus-visible{transform:translate(-50%,-50%) scale(1.12);
  box-shadow:0 6px 20px rgba(120,80,30,.45);outline:none}
.hot.active{background:var(--rust)}
.hot.active::before,.hot.active::after{background:#FFF}
.hot.active::after{transform:rotate(90deg)}   /* + becomes × */
.hot.active .ring{animation:none;opacity:0}
/* a little label that pops on hover so it's obvious what each is */
.hot .htip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);
  background:var(--ink);color:#FFF9EE;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:.72rem;letter-spacing:.02em;white-space:nowrap;padding:.35em .7em;border-radius:8px;
  opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.hot:hover .htip,.hot:focus-visible .htip{opacity:1;transform:translateX(-50%)}
.hot .htip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  border:5px solid transparent;border-top-color:var(--ink)}
@media (prefers-reduced-motion:reduce){.hot .ring{animation:none}}

/* the card that appears when you tap a hotspot */
.scene .popcard{margin-top:1rem;background:var(--cream);border-radius:16px;padding:1.5rem 1.6rem;
  box-shadow:0 10px 30px rgba(120,90,40,.1);
  max-height:0;opacity:0;overflow:hidden;transform:translateY(-6px);
  transition:max-height .45s ease,opacity .4s ease,transform .45s ease,padding .45s ease}
.scene .popcard.show{max-height:280px;opacity:1;transform:none}
.scene .popcard h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:clamp(1.1rem,1.4vw,1.35rem);color:var(--sienna-ink);margin-bottom:.2rem}
.scene .popcard .who{display:block;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--olive-ink);margin-bottom:.6rem}
.scene .popcard p{font-size:var(--t-small);color:var(--ink-soft);line-height:1.55}

/* the 3 abstract activities as a quiet strip below */
.estrip{max-width:1000px;margin:var(--sp-4) auto 0;display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(1rem,2.4vw,2rem)}
.estrip .item{text-align:center;padding:1.2rem 1rem;border-top:2px solid rgba(195,120,42,.3)}
.estrip .item h4{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:clamp(1rem,1.2vw,1.15rem);color:var(--ink);margin-bottom:.2rem}
.estrip .item .who{display:block;font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--sienna-ink);margin-bottom:.5rem}
.estrip .item p{font-size:var(--t-small);color:var(--ink-soft);line-height:1.5}
.l2word.d .l2big {
    color: #8A6A1B;
}
.l2word.d .l2lbl {
    background: rgba(227,168,42,.2);
    color: var(--sienna-ink);
}
.visit-section.close h2{
	text-align:left;
} 
@media (max-width:820px){
  .estrip{grid-template-columns:1fr;gap:1rem}
  /* on mobile, hotspots are hard to tap — show all cards stacked instead */
  .scene .hotspots{display:none}
  .scene .mobilecards{display:grid;gap:.8rem;margin-top:1rem}
}
.scene .mobilecards{display:none}
@media (max-width:820px){
  .scene .mobilecards{display:grid}
  .scene .mc{background:var(--cream);border-radius:14px;padding:1.1rem 1.2rem;border-left:4px solid var(--rust)}
  .scene .mc h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.05rem;color:var(--sienna-ink);margin-bottom:.15rem}
  .scene .mc .who{display:block;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--olive-ink);margin-bottom:.4rem}
  .scene .mc p{font-size:var(--t-small);color:var(--ink-soft);line-height:1.5}
}

/* --- 8. CLOSING BANNER --- */
.close{position:relative;overflow:hidden;isolation:isolate}
.close .bg{width:100%;height:auto;display:block}
.close::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 70%)}
.close .inner{position:absolute;z-index:2;left:clamp(1.6rem,7%,6rem);top:10%;transform:none;
  width:min(440px,44%);text-align:left}
.close h2{color:var(--ink);margin:0;max-width:15ch;
  text-shadow:0 1px 0 rgba(255,250,235,.55)}
.close .walk{display:block;margin-top:.7rem;font-family:'Caveat',cursive;
  color:#5E3A14;font-size:clamp(1.4rem,2.5vw,2.2rem);line-height:1.15}
.close .btn{margin-top:clamp(1rem,2vw,1.8rem);
  box-shadow:0 8px 24px rgba(120,80,30,.22)}

.masc{position:absolute;pointer-events:none;z-index:3}
.masc img{width:100%;height:auto}
.masc.peek{width:clamp(64px,7vw,104px);left:2.2%;bottom:7%}
.masc.reach{width:clamp(58px,6vw,92px);right:2%;top:6%;animation:hover 5s ease-in-out infinite}
.masc.point{width:clamp(60px,6.5vw,96px);left:1.5%;top:34%;transform:scaleX(-1)}
.masc.wave{width:clamp(58px,6vw,90px);left:2%;bottom:6%}
.masc.reading{width:clamp(60px,6.4vw,98px);left:4%;bottom:4%}
.cards-new .g1, .cards-new .g2, .cards-new .g3, .cards-new .g4 {
    grid-column: inherit; 
	    grid-row: 1 / 3;
}
@media (max-width:1100px){ .masc{display:none} }
@media (max-width:980px){
  .pghero .wrap,.story .storygrid,.vm .wrap,.ess .wrap,.threec .top{grid-template-columns:1fr}
  .beats{grid-template-columns:1fr}
  .pghero h1{max-width:none}
  .heroart{margin-top:var(--sp-4)}
  .storyart{margin-top:var(--sp-4);max-width:520px;margin-inline:auto}
  .ess .intro{position:static}
  .dim{grid-template-columns:58px 1fr;gap:1.1rem}
  .dim .ico{width:58px;height:58px}
  .vgrid{grid-template-columns:1fr;gap:var(--sp-4)}
  .vitem{grid-template-columns:56px 1fr;gap:1rem}
  .vitem .ico{width:56px;height:56px}
  .ccards{grid-template-columns:1fr}
  .venn{padding-top:2.2rem}
  .vlabel{font-size:.85rem}
}
@media (max-width:760px){
  .close .bg{height:min(52vh,320px);object-fit:cover;object-position:50% 58%}
  .close::before{background:none}
  .close .inner{position:static;transform:none;width:auto;text-align:center;padding:2rem 1.4rem 2.6rem;background:var(--cream)}
  .close h2{max-width:none;text-shadow:none}
}

/* ============================================================
   THE HAND-DRAWN LAYER  (v11.2)
   The homepage's charm is the SKETCH on top of the watercolour —
   wavy underlines, the dotted butterfly path, the hopscotch grid,
   the chalk wall. About had none of it. This is that layer.
   Every stroke is generated with jitter at runtime, so no two are alike.
   ============================================================ */

/* rough frames drawn by JS into an SVG that sits behind its parent */
.sk-frame{position:absolute;inset:-10px;width:calc(100% + 20px);height:calc(100% + 20px);
  pointer-events:none;overflow:visible;z-index:0}
.sk-frame path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.inview .doodle,.doodle.inview{opacity:.92;transform:translateY(0) rotate(var(--rot,-3deg))}
.inview .doodle .arrow path{stroke-dashoffset:0}

/* the dotted trail that threads the page together — the butterfly's route */
.trail{position:absolute;left:0;right:0;height:120px;pointer-events:none;z-index:1;overflow:visible}
.trail path{fill:none;stroke:var(--bronze);stroke-width:2;stroke-linecap:round;
  stroke-dasharray:2 9;opacity:.5}
.trail .bf{width:30px}

/* torn paper edge between bands — no more hard horizontal lines */
.tear{position:absolute;left:0;right:0;height:26px;pointer-events:none;z-index:2}
.tear.top{top:-1px}
.tear.bot{bottom:-1px}
.tear svg{width:100%;height:100%;display:block}

/* a hand-drawn circled number — like a kid numbering their own list */
.numring{position:relative;width:46px;height:46px;flex:0 0 auto;display:grid;place-items:center}
.numring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.numring svg path{fill:none;stroke-width:2;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .9s ease-out}
.inview .numring svg path{stroke-dashoffset:0}
.numring b{position:relative;font-family:'Caveat',cursive;font-weight:700;
  font-size:1.5rem;line-height:1;color:var(--ink)}

/* ============================================================
   LEARNING AT EKAAYA — v1
   Inquiry with intention. Action with meaning.
   The whole page is one movement: understanding -> application.
   ============================================================ */

/* ── 1. HERO ── */
.lhero{position:relative;overflow:hidden;
  background:linear-gradient(160deg,#FBE7C2 0%,#F7E1BA 55%,#F3DBB0 100%);
  padding:calc(96px + clamp(2rem,4vw,3.5rem)) 0 0}
.lhero{padding-bottom:0}
.lhero .wrap{display:grid;grid-template-columns:.78fr 1.22fr;
  gap:clamp(1rem,3vw,2.5rem);align-items:center}
.lhero .copy{padding-bottom:clamp(2.5rem,5vw,4.5rem)}
.lhero .eyebrow{display:block;font-family:'Caveat',cursive;color:var(--sienna);
  font-size:var(--t-hand);margin-bottom:.1rem;letter-spacing:.01em}
.lhero h1{font-family:'Bricolage Grotesque',sans-serif;line-height:1.06;letter-spacing:-.01em;max-width:12ch;
  font-size:clamp(2.3rem,4.3vw,4.1rem);color:var(--ink);font-weight:700}
.lhero h1 .thin{display:block;text-transform:none;font-weight:500;letter-spacing:-.01em;
  font-size:.62em;color:var(--sienna);margin-bottom:.1em}
.lhero .lede{margin-top:var(--sp-3);font-size:var(--t-lead);color:var(--sienna-ink);
  max-width:30rem;line-height:1.6}
.lhero .btn{margin-top:var(--sp-4)}
.lheroart{position:relative;align-self:center;justify-self:end;width:100%}
.lheroart .plate{width:100%;max-width:none;height:auto;display:block}
/* soft cream vignette so the plate's paper edge melts into the band */

.lheroart .drift{position:absolute;inset:0;pointer-events:none;overflow:visible}
.lheroart .lf{position:absolute;height:auto;opacity:0;transform-origin:50% 50%;
  animation:qdrift var(--dur,11s) ease-in-out var(--del,0s) infinite;will-change:transform}

/* ── 2. BEYOND ACADEMICS (deep cream — the understanding→action journey) ── */
.beyond{background:var(--cream-deep);position:relative;overflow:hidden}
.beyond .whead{text-align:center;max-width:46rem;margin:0 auto var(--sp-5)}
.beyond h2{color:var(--sienna);font-size:var(--t-h2);letter-spacing:-.01em;line-height:1.08}
.beyond .lead-in{margin-top:var(--sp-3);font-size:var(--t-lead);color:var(--ink);line-height:1.6}
/* the journey: two big words, a drawn line between, pillar detail hanging beneath each */

.l2word{text-align:center}
.l2word .l2big{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  font-size:clamp(1.9rem,4vw,3rem);line-height:1;letter-spacing:-.02em}
.l2word.u .big{color:var(--olive-ink)}
.l2word.a .big{color:var(--sienna)}

.l2word .l2lbl{display:inline-block;margin-top:.7rem;font-family:'Bricolage Grotesque',sans-serif;
  font-weight:700;font-size:clamp(.82rem,1vw,.95rem);letter-spacing:.02em;
  padding:.35em 1em;border-radius:999px;line-height:1.3}
.l2word.u .l2lbl{background:rgba(135,132,50,.16);color:var(--olive-ink)}
.l2word.a .l2lbl{background:rgba(195,120,42,.15);color:var(--sienna-ink)}
.l2word .l2det{margin-top:1.1rem;font-size:var(--t-small);color:var(--ink-soft);line-height:1.55;
  max-width:20rem;margin-inline:auto}
.l2word .l2det b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;
  color:var(--ink);margin-bottom:.3rem;font-size:var(--t-body)}
.l2line {width: clamp(60px,10vw,70px); height: 60px; overflow: visible;}
.l2line path{fill:none;stroke:var(--rust);stroke-width:2.4;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s ease-out .2s}
.beyond.inview .l2line path{stroke-dashoffset:0}
.l2line .head{opacity:0;transition:opacity .3s ease 1.1s}
.beyond.inview .l2line .head{opacity:1}
.beyond .together{margin-top:var(--sp-5);text-align:center;font-size:var(--t-lead);color:var(--ink);
  line-height:1.6;max-width:44rem;margin-inline:auto}
@media (max-width:760px){
  .l2flow{grid-template-columns:1fr;gap:1.5rem}
  .l2line{transform:rotate(90deg);width:60px;margin-inline:auto}
}
.sglyph {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #FCF5E8;
    display: grid;
    place-items: center;
}
.nsec {
    background: #E8ECD6;
} 
.ssec {
    background: #F5E3D2;
} 

.wsec {
    background: #ECE0C4;
}
.whead-wrap{text-align:center;max-width:60ch;margin:0 auto var(--sp-4)}
.whead{font-size:var(--t-h2);color:var(--ink);line-height:1.08}
.wsub{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;color:var(--sienna-ink);font-size:var(--t-lead);margin-top:.5rem}
.wintro{color:var(--ink);font-size:var(--t-lead);line-height:1.55;max-width:54ch;margin:var(--sp-2) auto 0}

.wstage{position:relative;max-width:1120px;margin:0 auto}
.whorlsvg{width:100%;height:auto;display:block}
.wsec .wring,.wsec .wlead{stroke-dasharray:1;stroke-dashoffset:1}
.wsec .wleaddot{opacity:0}
.wsec.inview .wring{stroke-dashoffset:0;transition:stroke-dashoffset 1s ease;transition-delay:calc(var(--i,0)*.05s)}
.wsec.inview .wlead{stroke-dashoffset:0;transition:stroke-dashoffset .7s ease .9s}
.wsec.inview .wleaddot{opacity:1;transition:opacity .3s ease 1.5s}

.wlabel{position:absolute;width:25%}
.wlabel b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--cink);font-size:var(--t-body);line-height:1.15}
.wlabel i{display:block;font-family:'Caveat',cursive;font-style:normal;color:var(--cink);font-size:var(--t-hand);margin:.05rem 0 .2rem}
.wlabel p{color:var(--ink);font-size:var(--t-small);line-height:1.45;margin-top:.15rem}
.wl-tl{left:1%;top:5%;text-align:right}
.wl-r{right:1%;top:36%;text-align:left}
.wl-bl{left:1%;bottom:5%;text-align:right}

@media (max-width:860px){
  /* stack cleanly on mobile: whorl on top, colour-coded systems below */
  .wstage{max-width:520px}
  .wsec .wlead,.wsec .wleaddot{display:none}
  .wlabel{position:static;width:auto;text-align:left!important;padding-left:1.5rem;position:relative}
  .wlabel::before{content:"";position:absolute;left:0;top:.4em;width:12px;height:12px;border-radius:50%;background:var(--c)}
  .wlabel + .wlabel{margin-top:var(--sp-3)}
  .wl-tl{margin-top:var(--sp-4)}
}
@media (prefers-reduced-motion:reduce){
  .wsec .wring,.wsec .wlead{stroke-dashoffset:0;transition:none}
  .wsec .wleaddot{opacity:1;transition:none}
}

.ctaw{position:relative;padding:0;background:var(--cream);overflow:hidden}
.ctaw-bg{display:block;width:100%;height:auto}
.ctaw-inner{position:absolute;left:clamp(1.6rem,7%,6rem);top:50%;transform:translateY(-50%);
  width:min(420px,34%);z-index:2}
.ctaw-inner h2{font-size:var(--t-h2);color:var(--sienna);line-height:1.08;margin:0 0 .55rem;max-width:15ch}
.ctaw-sub{color:var(--ink);font-size:var(--t-body);line-height:1.55;margin:0 0 1.3rem;max-width:34ch}
@media (max-width:720px){
  .ctaw-inner{position:static;transform:none;width:auto;text-align:center;padding:1.6rem 1.4rem 2.4rem}
  .ctaw-inner h2{max-width:none;margin-inline:auto}
}

.cframe{cursor:pointer;border:none;background:none;padding:0;font:inherit;text-align:inherit;width:100%}
.clightbox{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:5vw}
.clightbox[hidden]{display:none}
.clb-backdrop{position:absolute;inset:0;background:rgba(60,45,25,.55)}
.clb-panel{position:relative;z-index:1;margin:0;max-width:min(660px,92vw);background:var(--cream-warm);
  padding:clamp(10px,1.4vw,18px);border-radius:8px;box-shadow:0 30px 70px rgba(40,30,15,.45)}
.clb-img{display:block;width:100%;height:auto;border-radius:3px}
.clb-name{text-align:center;font-family:'Caveat',cursive;color:var(--olive-ink);font-size:1.45rem;margin:.5rem 0 .1rem}
.clb-close{position:absolute;top:-16px;right:-16px;width:42px;height:42px;border-radius:50%;border:none;
  background:var(--cream);color:var(--ink);font-size:1.6rem;line-height:1;cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.28)}
.clb-close:focus-visible{outline:3px solid var(--rust);outline-offset:2px}

.findsec {
    background: #FAEAD0;
}
.find-head{text-align:center;max-width:56ch;margin:0 auto var(--sp-5)}
.find-head h2{font-size:var(--t-h2);color:var(--ink);line-height:1.08;margin-bottom:var(--sp-3)}
.find-head p{font-size:var(--t-lead);color:var(--ink);line-height:1.55}
.find-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(2rem,4vw,3.6rem);align-items:center}
.find-opts{display:flex;flex-direction:column;gap:.7rem}
.find-opt{display:flex;align-items:center;gap:.75rem;width:100%;text-align:left;
  padding:.78rem 1rem;background:#F5EDDE;border:1.5px solid #E7D9C0;border-left:5px solid var(--ac);
  border-radius:14px;font-family:'Caveat',cursive;font-size:clamp(1.32rem,2.1vw,1.6rem);color:var(--ink);
  cursor:pointer;transition:background .2s,box-shadow .2s,transform .2s,border-color .2s;--ac:var(--olive)}
.find-opt::before{content:"";width:13px;height:13px;border-radius:50%;background:var(--ac);flex:0 0 auto}
.find-opt::after{content:"\2192";margin-left:auto;font-family:'Nunito Sans',sans-serif;font-size:1.05rem;
  color:var(--acink);opacity:.4;transition:opacity .2s,transform .2s;flex:0 0 auto}
.find-opt:hover{background:#FBF4E7;transform:translateX(3px);box-shadow:0 5px 16px rgba(90,70,30,.10)}
.find-opt:hover::after{opacity:.9;transform:translateX(3px)}
.find-opt.sel{background:#FFFDF8;border-color:var(--ac);box-shadow:0 8px 22px rgba(90,70,30,.14)}
.find-opt.sel::after{opacity:1}
.find-opt:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.find-reveal{display:grid;place-items:center}
.find-canvas{width:100%}
.find-card{margin:0;max-width:480px;margin-inline:auto;opacity:0;transform:translateY(10px);
  transition:opacity .45s ease,transform .45s ease}
.find-card.in{opacity:1;transform:none}
.find-card img{display:block;width:100%;height:auto;aspect-ratio:1/1}
.find-card figcaption{text-align:center;margin-top:.8rem}
.find-card b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--ink);font-size:1.4rem}
.find-card span{display:block;color:var(--ink-soft);font-size:var(--t-body);margin:.2rem 0 .95rem}
.find-closer{display:inline-flex;align-items:center;gap:.35rem;font-family:'Bricolage Grotesque',sans-serif;
  font-weight:600;font-size:.95rem;color:#FFF7E9;background:#8F5117;border:none;border-radius:999px;
  padding:.55rem 1.15rem;cursor:pointer;transition:background .2s,transform .2s}
.find-closer::after{content:"\2197"}
.find-closer:hover{background:#7A4513;transform:translateY(-1px)}
.find-closer:focus-visible{outline:3px solid var(--rust);outline-offset:2px}
.cards-new .ggrid {
    margin-top: var(--sp-5);
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: clamp(1rem,1.8vw,1.5rem);
    align-items: stretch;
	
} 

.admhero{background:var(--cream);padding-top:clamp(72px,7vw,98px)}
.admhero-media{position:relative}
.admhero-bg{display:block;width:100%;height:auto}
.admhero-inner{position:absolute;left:clamp(1.5rem,7%,6rem);top:50%;transform:translateY(-50%);
  width:min(480px,40%);z-index:2}
.admhero-inner h1{font-size:clamp(2.1rem,4vw,3.6rem);color:var(--sienna);line-height:1.06;
  margin:0 0 var(--sp-3);max-width:15ch;letter-spacing:-.01em}
.admhero-inner p{color:var(--ink);font-size:var(--t-body);line-height:1.55;margin:0 0 .9rem;max-width:44ch}
.admhero-inner p:last-child{margin-bottom:0}
@media (max-width:820px){
  .admhero-inner{position:static;transform:none;width:auto;padding:1.6rem 1.4rem 2.2rem}
  .admhero-inner h1{max-width:none}
}






/* ---- signpost bands (policies / fees / calendar family) ---- */
.sign{position:relative;overflow:hidden;background:var(--sign,#5F6A29);color:var(--cream);
  padding:clamp(3.6rem,7vw,6rem) 0;margin:clamp(2.4rem,5vw,4rem) 0;isolation:isolate}
.sign-edge{position:absolute;left:0;right:0;width:100%;height:22px;display:block;z-index:1;pointer-events:none}
.sign-edge.top{top:-1px}
.sign-edge.bot{bottom:-1px}
.sign-edge path{fill:var(--cream)}
.sign-mark{position:absolute;right:clamp(-20px,2vw,60px);top:50%;transform:translateY(-50%);height:132%;
  z-index:0;pointer-events:none;display:flex;align-items:center}
.sign-mark svg{height:100%;width:auto;display:block}
.sign .wrap{position:relative;z-index:2}
.sign h2{font-size:var(--t-h2);color:var(--cream);line-height:1.08;margin:0 0 var(--sp-3);max-width:16ch}
.sign p{color:#FBF5E9;font-size:var(--t-lead);line-height:1.55;max-width:46ch;margin:0 0 var(--sp-4)}
.sign-btn{position:relative;display:inline-flex;align-items:center;gap:.5rem;
  padding:.95rem 1.9rem;background:none;border:none;color:var(--cream);cursor:pointer;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1rem;text-decoration:none;
  transition:transform .22s ease}
.sign-btn svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sign-btn svg path{fill:none;stroke:var(--cream);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sign-btn span{position:relative;z-index:1}
.sign-btn .ext{font-size:.78rem;opacity:.85;font-weight:600}
.sign-btn:hover{transform:translateY(-2px)}
.sign-btn:hover svg path{stroke-width:2.6}
.sign-btn:focus-visible{outline:3px solid var(--cream);outline-offset:6px;border-radius:30px}
@media (max-width:820px){
  .sign-mark{right:-40px;height:96%;opacity:.6}
  .sign p{max-width:none}
}
@media (prefers-reduced-motion:reduce){ .sign-btn{transition:none} }




/* ---- §3 admissions process — scroll-scrub walk ---- */
.procsec{background:var(--cream);position:relative}
.proc-sticky{padding-block:clamp(3rem,6vw,4.8rem);display:flex;flex-direction:column;align-items:center}
.proc-head{text-align:center;max-width:60ch;margin:0 auto var(--sp-4)}
.proc-head h2{font-size:var(--t-h2);color:var(--ink);line-height:1.1}
.proc-hint{font-family:'Caveat',cursive;color:var(--sienna-ink);opacity:.7;font-size:1.25rem;margin-top:1.2rem}
.journey{position:relative;width:min(1040px,92vw);margin:0 auto}
.jpath{width:100%;height:auto;display:block;overflow:visible}
.jline-bg{fill:none;stroke:#8F5117;stroke-opacity:.24;stroke-width:2;stroke-dasharray:1.5 11;stroke-linecap:round}
.jline-fg{fill:none;stroke:#C3782A;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.jdot{fill:var(--cream);stroke:#C3782A;stroke-width:3}
.jstop.done .jdot{fill:#C3782A}
.jnum{font-family:'Caveat',cursive;font-size:26px;fill:var(--sienna-ink);text-anchor:middle;font-weight:700}
.jname{font-family:'Bricolage Grotesque',sans-serif;font-size:19px;font-weight:600;fill:var(--ink);text-anchor:middle}
.jstop{opacity:.45;transition:opacity .3s ease}
.jstop.active,.jstop.done{opacity:1}
.jg-layer{position:absolute;left:0;top:0;transform-origin:bottom center;transform:scale(.52);opacity:0;transition:opacity .22s ease;pointer-events:none;z-index:3;filter:drop-shadow(0 7px 9px rgba(90,60,25,.16));will-change:left,top,transform,opacity}
.jg-layer.on{opacity:1}
.proc-mobile{display:none}
@media (max-width:780px){
  .journey,.proc-hint{display:none}
  .proc-mobile{display:block;list-style:none;margin:1rem auto 0;max-width:24rem;padding:0;position:relative}
  .proc-mobile::before{content:"";position:absolute;left:20px;top:12px;bottom:12px;width:2px;
    background:repeating-linear-gradient(#C3782A 0 3px,transparent 3px 12px)}
  .proc-mobile li{position:relative;padding:0 0 1.8rem 3.4rem;min-height:2.4rem}
  .proc-mobile li::before{content:attr(data-n);position:absolute;left:8px;top:-2px;width:26px;height:26px;
    display:grid;place-items:center;border-radius:50%;background:var(--cream);border:2.5px solid #C3782A;
    font-family:'Caveat',cursive;font-weight:700;color:var(--sienna-ink);font-size:1.1rem}
  .proc-mobile b{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;color:var(--ink);font-size:1.05rem}
}
@media (prefers-reduced-motion:reduce){ .jline-fg{stroke-dashoffset:0} }


/* ---- §4 application form — handwriting on cream ---- */
.afsec{background:var(--cream)}
.af-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.af-copy h2{font-size:var(--t-h2);color:var(--sienna);line-height:1.08;margin:0 0 var(--sp-3);max-width:12ch}
.af-copy p{color:var(--ink);font-size:var(--t-lead);line-height:1.55;max-width:40ch;margin:0 0 var(--sp-4)}
.af-contact{display:flex;flex-direction:column;gap:.7rem;margin-top:var(--sp-3)}
.af-contact a{display:inline-flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none;font-size:var(--t-body)}
.af-contact svg{width:20px;height:20px;stroke:var(--sienna-ink);fill:none;stroke-width:1.7;flex:0 0 auto}
.af-contact a:hover{color:var(--sienna-ink)}
.af-contact a:hover svg{stroke:var(--rust)}

.af-form{max-width:640px}
.af-row{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1.8rem}
.af-field{margin-bottom:1.7rem}
.af-field.full{grid-column:1/-1}
.af-field label{display:block;font-family:'Caveat',cursive;font-size:1.3rem;color:var(--sienna-ink);margin-bottom:.1rem;line-height:1.2}
.af-input,.af-select{width:100%;background:transparent;border:none;border-bottom:1.6px solid rgba(143,81,23,.38);
  padding:.45rem .15rem;font-family:'Nunito Sans',sans-serif;font-size:1.05rem;color:var(--ink);
  transition:border-color .2s,border-width .2s}
.af-input:focus,.af-select:focus{outline:none;border-bottom:2.4px solid var(--rust)}
.af-input::placeholder{color:#b0a288}
.af-selwrap{position:relative}
.af-select{appearance:none;-webkit-appearance:none;padding-right:2rem;cursor:pointer;color:var(--ink)}
.af-select:invalid{color:#b0a288}
.af-chev{position:absolute;right:.2rem;top:50%;transform:translateY(-30%);width:18px;height:12px;pointer-events:none}
.af-textarea{width:100%;height:100px;background:transparent;border:none;color:var(--ink);
  font-family:'Nunito Sans',sans-serif;font-size:1.05rem;line-height:2rem;padding:.15rem;resize:vertical;
  background-image:repeating-linear-gradient(transparent 0,transparent calc(2rem - 1.6px),rgba(143,81,23,.28) calc(2rem - 1.6px),rgba(143,81,23,.28) 2rem)}
.af-textarea:focus{outline:none}
.af-textarea::placeholder{color:#b0a288}

.af-submit{position:relative;display:inline-flex;align-items:center;gap:.55rem;margin-top:.6rem;
  padding:1rem 2.1rem;background:#5F6A29;color:var(--cream);border:none;cursor:pointer;border-radius:30px;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1rem;transition:transform .2s,background .2s}
.af-submit svg.edge{position:absolute;inset:-3px;width:calc(100% + 6px);height:calc(100% + 6px);overflow:visible}
.af-submit svg.edge path{fill:none;stroke:#5F6A29;stroke-width:1.6;opacity:.0}
.af-submit .arw{transition:transform .2s}
.af-submit:hover{background:#525b23;transform:translateY(-2px)}
.af-submit:hover .arw{transform:translateX(3px)}
.af-submit:focus-visible{outline:3px solid var(--rust);outline-offset:3px}
.af-note{font-size:var(--t-small);color:var(--ink-soft);margin-top:.9rem}

.af-thanks{display:none;padding:1.4rem 0}
.af-thanks.show{display:block}
.af-thanks .tick{width:52px;height:52px;border-radius:50%;background:#5F6A29;display:grid;place-items:center;margin-bottom:1rem}
.af-thanks .tick svg{width:26px;height:26px;stroke:var(--cream);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.af-thanks h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;color:var(--ink);font-size:1.5rem;margin:0 0 .4rem}
.af-thanks p{color:var(--ink);font-size:var(--t-body);line-height:1.55;max-width:38ch}
.af-err{border-bottom-color:var(--rust)!important}
.af-errmsg{color:#a8321f;font-size:var(--t-small);margin-top:.25rem;display:none}
.af-errmsg.show{display:block}

@media (max-width:820px){
  .af-grid{grid-template-columns:1fr;gap:var(--sp-4)}
  .af-row{grid-template-columns:1fr}
}


/* ---- §5 fees signpost (mirror of §2, terracotta) ---- */
.sign--mirror .sign-mark{right:auto;left:clamp(-30px,1vw,40px)}
.sign-copy{max-width:34rem}
.sign--mirror .sign-copy{margin-left:auto}
.sign--mirror h2,.sign--mirror p{max-width:none}
@media (max-width:820px){ .sign--mirror .sign-mark{left:-40px;right:auto} .sign--mirror .sign-copy{margin-left:0} }

#fees .sign-mark{right:auto;left:clamp(-10px,2vw,44px);width:auto;height:auto;top:50%;transform:translateY(-50%);display:block}
.sign-hand{width:clamp(235px,24vw,350px);height:auto;opacity:.7;display:block}

/* ---- §6 gold band: dark-ink variant ---- */
.sign-lite h2{color:var(--ink)}
.sign-lite p{color:#453A18}
.sign-lite .sign-btn{color:var(--ink)}
.sign-lite .sign-btn svg path{stroke:var(--ink)}
.sign-lite .sign-btn:focus-visible{outline-color:var(--ink)}
.sign-lite .sign-edge path{fill:var(--cream)}


/* ---- §7 FAQs — wonderings ---- */
.faqsec{background:var(--cream)}
.faq-head{max-width:48rem;margin:0 auto var(--sp-4)}
.faq-head .eyebrow{font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:1.5rem;display:block;margin-bottom:.1rem}
.faq-head h2{font-size:var(--t-h2);color:var(--sienna);line-height:1.05}
.faq-list{max-width:48rem;margin:0 auto;display:flex;flex-direction:column;gap:.9rem}
.wq{background:#FBF6EA;border:1.6px solid rgba(143,81,23,.2);border-radius:16px;
  padding:1.15rem 1.35rem;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s}
.wq:hover{border-color:rgba(143,81,23,.42);box-shadow:0 6px 18px rgba(90,60,25,.06)}
.wq:focus-visible{outline:3px solid var(--sienna-ink);outline-offset:3px}
.wq-head{display:flex;justify-content:space-between;align-items:center;gap:1.2rem}
.wq-q{font-family:'Bricolage Grotesque',sans-serif;font-weight:600;color:var(--ink);font-size:1.12rem;line-height:1.3}
.wq-chev{width:20px;height:13px;flex:0 0 auto;transition:transform .3s ease}
.wq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.wq-a p{color:var(--ink-soft);line-height:1.6;font-size:1rem;margin:0;padding-top:.85rem}
.wq.open{border-color:rgba(143,81,23,.45);background:#FCF8EF}
.wq.open .wq-chev{transform:rotate(180deg)}
.wq.open .wq-a{max-height:16rem}
@media (prefers-reduced-motion:reduce){ .wq-a,.wq-chev{transition:none} }


/* ---- merged fees + calendar duo block ---- */
.duo{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;
  margin:clamp(2.4rem,5vw,4rem) 0;isolation:isolate}
.duo-edge{position:absolute;left:0;right:0;width:100%;height:22px;z-index:3;pointer-events:none}
.duo-edge.top{top:-1px} .duo-edge.bot{bottom:-1px} .duo-edge path{fill:var(--cream)}
.duo-panel{padding:clamp(2.8rem,4vw,4.4rem) clamp(1.8rem,3.2vw,3.4rem);
  display:flex;flex-direction:column;align-items:flex-start;gap:1.05rem;position:relative;min-width:0}
.duo-fees{background:#9C5D1B}
.duo-cal{background:#E3A82A}
.duo-art{width:100%;height:clamp(170px,15.5vw,230px);display:flex;align-items:flex-end;justify-content:flex-start;margin-bottom:1.4rem}
.duo-fees .duo-art img{height:100%;width:auto;max-width:82%;opacity:1;display:block}
.duo-cal-art{height:86%;width:auto;display:block}
.duo h2{font-size:clamp(1.7rem,2.3vw,2.4rem);line-height:1.08;margin:0;max-width:15ch}
.duo p{font-size:var(--t-body);line-height:1.55;margin:0;max-width:40ch}
.duo-fees h2{color:var(--cream)} .duo-fees p{color:#FBF5E9}
.duo-cal h2{color:var(--ink)} .duo-cal p{color:#453A18}
.duo-btn{position:relative;display:inline-flex;align-items:center;gap:.5rem;margin-top:auto;
  padding:.9rem 1.8rem;background:none;border:none;cursor:pointer;text-decoration:none;
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1rem;transition:transform .22s ease}
.duo-btn svg.edge{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.duo-btn svg.edge path{fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.duo-btn span{position:relative;z-index:1}.duo-btn .ext{font-size:.78rem;opacity:.85;font-weight:600}
.duo-btn:hover{transform:translateY(-2px)} .duo-btn:hover svg.edge path{stroke-width:2.6}
.duo-fees .duo-btn{color:var(--cream)} .duo-fees .duo-btn svg.edge path{stroke:var(--cream)}
.duo-cal .duo-btn{color:var(--ink)} .duo-cal .duo-btn svg.edge path{stroke:var(--ink)}
.duo-btn:focus-visible{outline:3px solid currentColor;outline-offset:4px;border-radius:30px}
@media (max-width:820px){ .duo{grid-template-columns:1fr} }
@media (max-width:820px){ .find-grid{grid-template-columns:1fr;gap:var(--sp-4)} }
@media (prefers-reduced-motion:reduce){ .find-card{transition:none} } 
.ctaw-loc{display:inline-flex;align-items:flex-start;gap:.7rem;margin:1.9rem auto 0;padding:1.1rem 1.6rem;background:rgba(255,253,247,.92);border:1.6px solid rgba(143,81,23,.3);border-radius:18px;text-align:left;max-width:40ch;box-shadow:0 8px 22px rgba(90,60,25,.07)}
.ctaw-pin{width:26px;height:28px;flex:0 0 auto;margin-top:3px}
.ctaw-loc address{font-style:normal;color:var(--ink);font-size:var(--t-body);line-height:1.5}
.ctaw-loc strong{display:block;color:var(--sienna);font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:1.1rem;margin-bottom:.2rem}
.af-select{
    background: url(/wp-content/uploads/2026/07/down-chevron.png) no-repeat;
    background-position: 100% center;
    background-size: 26px;
	color: #3f4435;
} 
.af-select:invalid {
   color: #b0a288;
}
.band{position:relative;overflow:hidden}
.band.deep{background:var(--cream-deep)}
.band.plain{background:var(--cream)}


/* ---- x-factor: ask Ekaaya (a real message exchange) ---- */
.asksec{background:var(--cream)}
.ask-head{max-width:52ch;margin:0 auto var(--sp-4);text-align:center}
.ask-head .eyebrow{font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:1.55rem;display:block;margin-bottom:.1rem}
.ask-head h2{font-size:var(--t-h2);color:var(--sienna);line-height:1.05;margin:0 0 .5rem}
.ask-head p{color:var(--ink-soft);font-size:var(--t-lead);line-height:1.5;margin:0}
.chat{max-width:660px;margin:0 auto;border:1.6px solid rgba(143,81,23,.22);border-radius:26px;overflow:hidden;
  background:#FBF6EA;box-shadow:0 18px 44px rgba(90,60,25,.09)}
.chat-bar{display:flex;align-items:center;gap:.6rem;padding:.85rem 1.2rem;background:linear-gradient(#F2E6CE,#ECDCC0);border-bottom:1.5px solid rgba(143,81,23,.16)}
.chat-bar .ava svg{width:34px;height:34px;display:block}
.chat-bar b{font-family:'Bricolage Grotesque',sans-serif;color:var(--sienna);font-size:1.05rem}
.chat-bar .st{margin-left:auto;font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:1.25rem}
.chat-thread{padding:1.3rem 1.2rem;display:flex;flex-direction:column;gap:.85rem;max-height:440px;overflow-y:auto}
.msg{display:flex;gap:.5rem;max-width:84%;align-items:flex-end;animation:msgIn .32s ease}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg.ek{align-self:flex-start}
.msg.parent{align-self:flex-end;flex-direction:row-reverse}
.msg .ava svg{width:30px;height:30px;display:block}
.msg.parent .ava{width:30px;height:30px;border-radius:50%;background:#BC9346;flex:0 0 auto}
.bub{padding:.72rem 1rem;border-radius:20px;line-height:1.5;font-size:1rem}
.msg.ek .bub{background:#fff;border:1.5px solid rgba(143,81,23,.16);color:var(--ink);border-bottom-left-radius:6px}
.msg.parent .bub{background:#9C5D1B;color:var(--cream);border-bottom-right-radius:6px}
.typing .bub{display:inline-flex;gap:5px;padding:.9rem 1rem}
.typing i{width:7px;height:7px;border-radius:50%;background:rgba(143,81,23,.45);display:block;animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.chat-asks{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem 1.2rem;border-top:1.5px solid rgba(143,81,23,.16);background:#F6EEDD}
.chat-hint{width:100%;font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:1.2rem;margin:0 0 .1rem}
.chat-chip{padding:.55rem 1.05rem;border-radius:30px;background:#fff;border:1.5px solid rgba(143,81,23,.3);
  font-family:'Nunito Sans',sans-serif;font-size:.94rem;color:var(--ink);cursor:pointer;transition:background .2s,border-color .2s,transform .15s}
.chat-chip:hover{border-color:rgba(143,81,23,.5);transform:translateY(-1px)}
.chat-chip:focus-visible{outline:3px solid var(--sienna-ink);outline-offset:3px}
.chat-chip.used{opacity:.35;pointer-events:none;text-decoration:line-through}
.chat-cta{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1.2rem;border-radius:30px;background:#5F6A29;color:var(--cream);
  text-decoration:none;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:.94rem}
.chat-cta:hover{background:#525b23}
.cf-field input[type=file] {
   width: 100%;
   max-width: 100%;
   color: #444;
   padding:12px 20px !important;
   border-radius: 10px;
   margin-bottom: 0;
   font-size: 14px !important;
     color: #919191 !important;
   font-weight:500 !important;
   font-family: "Manrope", sans-serif;
}

.cf-field input[type=file]::file-selector-button {
  margin-right: 10px;
  padding: 10px 20px;
  border-radius: 5px;
  color: #fff;
  border:none !important;
  background:#C3782A;
  cursor: pointer;
  transition: background .2s ease-in-out;
  height: 32px;
  line-height: 10px !important;
  font-family: "Manrope", sans-serif;
  font-size:16px;
  font-weight:500;
}
@media (prefers-reduced-motion:reduce){ .msg{animation:none} .typing i{animation:none} }



@media (prefers-reduced-motion:reduce){.wa-fab{transition:none}}

/* ---- Learning facilities ---- */
.lfac{background:var(--cream);position:relative}
.lfac-head{text-align:center;max-width:54ch;margin:0 auto clamp(2rem,4vw,3rem)}
.lfac-head h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--sienna-ink);font-size:clamp(1.9rem,3.4vw,2.6rem);margin:.2rem 0 .5rem}
.lfac-head p{color:var(--ink-soft);font-size:1.08rem;line-height:1.5;margin:0}
.lfac-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.5vw,1.8rem)}
.lfac-card{background:#FFFDF7;border:1.5px solid rgba(143,81,23,.15);border-radius:20px;padding:clamp(1.7rem,2.6vw,2.3rem) clamp(1.3rem,2vw,1.7rem);text-align:center;box-shadow:0 8px 22px rgba(90,60,25,.06);transition:transform .2s,box-shadow .2s}
.lfac-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(90,60,25,.11)}
.lfac-icon{width:68px;height:68px;margin:0 auto 1.1rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(195,120,42,.11)}
.lfac-icon svg{width:36px;height:36px;color:var(--sienna-ink)}
.lfac-icon img{
	width:75%;
}
.lfac-card h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--sienna);font-size:1.22rem;margin:0 0 .55rem}
.lfac-card p{color:var(--ink-soft);font-size:.97rem;line-height:1.6;margin:0}
@media (max-width:820px){.lfac-grid{grid-template-columns:1fr;max-width:440px;margin-inline:auto}}
@media (prefers-reduced-motion:reduce){.lfac-card{transition:none}}

/* ---- Learning facilities (reveal-on-hover) ---- */
.lfac{background:var(--cream)}
.lfac-head{text-align:center;max-width:56ch;margin:0 auto clamp(2rem,4vw,3rem)}
.lfac-head h2{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--sienna-ink);font-size:clamp(1.9rem,3.4vw,2.6rem);margin:.2rem 0 .5rem}
.lfac-head p{color:var(--ink-soft);font-size:1.06rem;line-height:1.5;margin:0}
.lfac-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.4rem)}
.lfac-card{position:relative;height:220px;border:none;padding:0;border-radius:20px;background:#FFFDF7;box-shadow:0 8px 22px rgba(90,60,25,.07);overflow:hidden;cursor:pointer;font-family:inherit;text-align:center;transition:box-shadow .22s,transform .22s}
.lfac-card:hover,.lfac-card:focus-visible{box-shadow:0 16px 34px rgba(90,60,25,.14);transform:translateY(-3px);outline:none}
.lfac-face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.85rem;padding:1.4rem;transition:opacity .25s}
.lfac-icon{width:66px;height:66px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(195,120,42,.12)}
.lfac-icon svg{width:36px;height:36px;color:var(--sienna-ink)}
.lfac-title{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--sienna);font-size:1.18rem;line-height:1.15}
.lfac-hint{font-family:'Caveat',cursive;color:var(--sienna-ink);font-size:1.15rem;line-height:1;opacity:.9}
.lfac-back{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;
  padding:1.5rem 1.4rem;background:var(--olive-band,#5F6A29);opacity:0;transform:translateY(10px);transition:opacity .25s,transform .25s;overflow-y:auto}
.lfac-bt{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:#FFF7EA;font-size:1.1rem}
.lfac-bp{color:#F1EAD3;font-size:.9rem;line-height:1.5}
.lfac-card:hover .lfac-face,.lfac-card:focus-visible .lfac-face,.lfac-card.open .lfac-face{opacity:0;pointer-events:none}
.lfac-card:hover .lfac-back,.lfac-card:focus-visible .lfac-back,.lfac-card.open .lfac-back{opacity:1;transform:none}
@media (max-width:900px){.lfac-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.lfac-grid{grid-template-columns:1fr;max-width:420px;margin-inline:auto}}
@media (prefers-reduced-motion:reduce){.lfac-card,.lfac-face,.lfac-back{transition:none}}
@media screen and (max-width: 767px){
	.lhero .wrap {
		display: flex;
		flex-direction: column;
		gap: 0;
	}
	.lhero .copy{
		padding:0;
	}
	.road .walker.on{
		display:none;
	} 
	.road .waymark {
		width: 95%;
	}
	.cards-new .ggrid {
		grid-template-columns: 1fr;
	} 
	.cards-new .g1{
		grid-column: 1/13;
		grid-row: 1/3;
	}
	.cards-new .g2 {
		grid-column: 1/13;
		grid-row: 3/5;
	}
	.cards-new .g3 {
		grid-column: 1/13;
		grid-row: 5/7;
	}
	.cards-new .g4 {
		grid-column: 1/13;
		grid-row: 7/9;
	}
	.scene .popcard{
		display:none;
	}
	.wonder-wall-section .ww-container {
		max-width: 100%;
		margin: 0 auto;
		padding: 0;
	}
	.cont .chead {
		max-width:90%;
	} 
	.proc-sticky {
		padding: 0;
	} 
	.af-row {
		gap: 0;
	} 
	.af-field br {
		display: none;
	} 
	#fees{
		margin: 0;
	} 
	.procsec {
		padding: 0 12px;
	}
	.cf-row {
		gap: 0;
		margin-bottom:0;
	}
	.cf-field{
		margin-bottom:10px;
	}
	.chero{
		padding-top:100px !important;
	} 
	.began .bflight {
		width: 93%;
		height: 140px;
	} 
	section#about{
		padding-bottom:200px;
	}
	footer .copy{
		margin-bottom: 50px !important;
	}
	.pghero.about-hero{
		padding-top:60px;
	}
} 
.ld-sec{padding:82px 24px 90px;max-width:1180px;margin:0 auto}
.ld-eyebrow{font-family:var(--hand);font-size:1.45rem;color:var(--terra);margin:0 0 6px}
.ld-h2{font-family:var(--disp);font-weight:600;font-size:clamp(1.9rem,3.6vw,2.9rem);
  line-height:1.14;letter-spacing:-.015rem;margin:0 0 14px;color:var(--ink);max-width:20ch}
.ld-intro{max-width:54ch;font-size:1rem;line-height:1.65;color:#6a6858;margin:0 0 42px}
.ld-row{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,3vw,40px);align-items:end;max-width:960px;margin:0 auto}
.ld-fig{position:relative;background:none;border:0;padding:0;margin:0;cursor:pointer;
  font-family:inherit;color:inherit;text-align:center;display:block;width:100%;
  -webkit-tap-highlight-color:transparent}
.ld-fig:focus-visible{outline:3px solid var(--terra);outline-offset:8px;border-radius:4px}
.ld-plate{display:block;width:100%;height:auto;
  transform:scale(.93) translateY(8px);
  opacity:.34; filter:saturate(.28);
  transition:transform .55s cubic-bezier(.22,.61,.36,1),opacity .55s ease,filter .55s ease}
.ld-fig[aria-selected="true"] .ld-plate{transform:scale(1) translateY(0);opacity:1;filter:saturate(1)}
.ld-name{font-family:var(--disp);font-weight:600;font-size:1.12rem;margin:12px 0 2px;
  color:var(--ink);opacity:.4;transition:opacity .45s ease}
.ld-role{font-family:var(--hand);font-size:1.18rem;color:var(--terra);
  opacity:.35;transition:opacity .45s ease}
.ld-fig[aria-selected="true"] .ld-name,
.ld-fig[aria-selected="true"] .ld-role{opacity:1}
.ld-rule{display:block;width:132px;height:11px;margin:7px auto 0;overflow:visible}
.ld-rule path{fill:none;stroke:var(--gold);stroke-width:3.2;stroke-linecap:round;
  stroke-dasharray:150;stroke-dashoffset:150;transition:stroke-dashoffset .6s ease .08s}
.ld-fig[aria-selected="true"] .ld-rule path{stroke-dashoffset:0}
.ld-panel{position:relative;margin-top:38px;padding:34px clamp(22px,4vw,46px) 36px;
  min-height:var(--panel-h,330px)}
.ld-panel::before{content:"";position:absolute;inset:0;
  background:rgba(95,106,41,.05);border-radius:18px;pointer-events:none}
.ld-bio{position:relative;opacity:1;transition:opacity .32s ease}
.ld-panel.is-swapping .ld-bio{opacity:0}
.ld-who{font-family:var(--hand);font-size:1.42rem;color:var(--olive);margin:0 0 16px}
.ld-body{columns:2;column-gap:clamp(28px,4vw,54px);column-fill:balance;max-width:940px;
  font-size:.97rem;line-height:1.6;color:#5b5a4e}
.ld-body p{margin:0 0 1em}
.ld-body p:last-child{margin-bottom:0}
.we-do {
    display: block;
    font-size: .74rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--olive-disp);
    margin-bottom: .2rem;
    font-weight: 700;
    font-family: 'Nunito Sans', sans-serif;
    padding-top: 20px;
    position: relative;
}
.dpair .we-do::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: .5rem;
    vertical-align: -1px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 20'><g fill='none' stroke='%23C3782A' stroke-width='1.5' > <path d='M8,10 m-6,0 a6,7 0 1,0 12,0 a6,7 0 1,0 -12,0' /> <path d='M8,10 m-3.4,0 a3.4,4 0 1,0 6.8,0 a3.4,4 0 1,0 -6.8,0' /> <path d='M8,10 m-1.1,0 a1.1,1.4 0 1,0 2.2,0 a1.1,1.4 0 1,0 -2.2,0' /> </g> </svg>") center/contain no-repeat;
    position: absolute;
    top: 0;
} 
.copy a {
    text-decoration: none;
    color: #984a0c;
}
@media (prefers-reduced-motion:reduce){
  .ld-plate,.ld-name,.ld-role,.ld-bio,.ld-rule path{transition-duration:.01ms}
}
@media (max-width:900px){
  .ld-sec{padding:64px 20px 80px}
  .ld-body{columns:1}
  .ld-panel{margin-top:34px;padding:30px 20px 34px}
  .ld-name{font-size:.98rem}
  .ld-role{font-size:1.05rem}
  .ld-rule{width:96px}
}