.hero-photo { position:absolute; inset:-34% 0; z-index:-2; opacity:.62; background:linear-gradient(90deg,rgba(12,46,38,.7),rgba(19,53,44,.2)),url('/assets/web/hero-parallax.jpg') center/cover; }
.experience-gallery { padding:124px 0 132px; background:#f2ede3; }
.experience-heading { display:grid; grid-template-columns:1fr .72fr; gap:9%; align-items:end; margin-bottom:45px; }
.experience-heading h2 { margin:0; }
.experience-heading>p { max-width:430px; margin:0 0 6px; color:#52665e; font-size:var(--text); line-height:1.9; }
.experience-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:16px; }
.experience-grid figure { grid-column:span 4; min-height:280px; margin:0; position:relative; overflow:hidden; background:#315d4d; }
.experience-grid .experience-feature { grid-column:span 8; min-height:420px; }
.experience-grid img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform .45s ease; }
.experience-grid figure:nth-child(3) { grid-column:span 6; }
.experience-grid figure:nth-child(4) { grid-column:span 6; }
.experience-grid figure:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,34,29,.62),transparent 45%); pointer-events:none; }
.experience-grid figcaption { position:absolute; z-index:1; left:22px; right:22px; bottom:20px; color:#fff; font:var(--text)/1.5 var(--mono); letter-spacing:.06em; text-shadow:0 1px 10px rgba(7,31,25,.6); }
.experience-grid figure:hover img { transform:scale(1.035); }
@media (max-width:760px) { .hero-photo { opacity:.46; background-position:58% center; }.experience-gallery { padding:78px 0 82px; }.experience-heading { grid-template-columns:1fr; gap:20px; margin-bottom:29px; }.experience-heading>p { font-size:var(--text); }.experience-grid { grid-template-columns:1fr; gap:12px; }.experience-grid figure,.experience-grid .experience-feature,.experience-grid figure:nth-child(4),.experience-grid figure:nth-child(5) { grid-column:auto; min-height:245px; }.experience-grid .experience-feature { min-height:285px; } }
.card-body { background:linear-gradient(0deg,rgba(30,35,33,.72),rgba(30,35,33,.08)),url('/assets/web/body-reflection.jpg') center/cover; }.card-body:before,.card-body:after { display:none; }
.card-rotation { background:linear-gradient(0deg,rgba(19,53,44,.76),rgba(19,53,44,.08)),url('/assets/web/rotation.jpg') center/cover; }.card-rotation:before,.card-rotation:after { display:none; }
.video-showcase { padding:0 0 135px; overflow:hidden; }.video-showcase .section-title { margin-bottom:36px; }.rail-controls { display:flex; gap:8px; }.rail-controls button { width:42px; height:42px; border:1px solid var(--ink); border-radius:50%; background:transparent; font-size:var(--text); cursor:pointer; }.rail-controls button:hover { background:var(--green); color:#fff; }
.video-rail { display:flex; gap:18px; overflow-x:auto; padding:0 max(0px, calc((100vw - min(1336px, calc(100vw - 64px))) / 2)) 14px 0; scroll-snap-type:x mandatory; scrollbar-width:thin; }.video-card { flex:0 0 min(74vw,620px); scroll-snap-align:start; }.video-card iframe { display:block; width:100%; aspect-ratio:16/9; border:0; background:#173a31; }.video-card h3 { margin:13px 0 0; font:600 var(--text) var(--display); }
.programs-hero { padding:195px 0 112px; color:#f9f6ef; background:linear-gradient(105deg,rgba(12,46,38,.93),rgba(19,53,44,.55)),url('/assets/web/hero.jpg') center/cover; }.programs-hero h1 { max-width:900px; margin:0 0 25px; }.programs-hero h1 em { color:var(--lime); }.programs-hero p:last-child { max-width:570px; color:#d5e0d9; font-size:var(--text); line-height:1.9; }
.programs-index { padding:82px 0 135px; }.format-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:25px; }.format-card { display:grid; grid-template-columns:185px 1fr; min-height:245px; background:var(--sand); }.format-card img { width:100%; height:100%; object-fit:cover; }.format-card>div { padding:25px 27px; }.format-card span { color:var(--moss); font:var(--text) var(--mono); letter-spacing:.08em; }.format-card h2 { margin:10px 0 5px; font:600 29px/1.25 var(--display); }.format-card p { margin:0; color:#52665e; font-size:var(--text); line-height:1.75; }.format-card .format-subtitle { margin-bottom:13px; color:var(--moss); font-weight:700; }
@media (max-width:760px) { .video-showcase { padding-bottom:82px; }.video-showcase .section-title { align-items:flex-end; }.rail-controls button { width:38px; height:38px; }.video-rail { gap:13px; padding-right:20px; }.video-card { flex-basis:82vw; }.video-card h3 { font-size:var(--text); }.programs-hero { padding:150px 0 76px; }.programs-hero h1 { font-size:46px; }.programs-hero p:last-child { font-size:var(--text); }.programs-index { padding:52px 0 80px; }.format-grid { grid-template-columns:1fr; gap:14px; }.format-card { grid-template-columns:125px 1fr; min-height:185px; }.format-card>div { padding:18px; }.format-card h2 { margin-top:6px; font-size:24px; }.format-card p { font-size:var(--text); } }
.article-figure { margin:38px 0 42px; }.article-figure img { display:block; width:100%; max-height:650px; object-fit:contain; background:#f2ede3; }.article-figure figcaption { margin-top:9px; color:#63756d; font-size:var(--text); line-height:1.6; }.article-content>.article-figure:first-of-type { margin-top:0; }
@media (max-width:760px) { .article-figure { margin:30px 0 34px; }.article-figure img { max-height:460px; } }
.dynamic-post img { display:block; width:100%; max-height:650px; margin:30px 0; object-fit:contain; background:#f2ede3; }
@media (max-width:760px) { .dynamic-post img { max-height:460px; margin:24px 0; } }
.brand.brand-image { display:block; width:142px; line-height:0; }.brand-image img { display:block; width:100%; height:auto; }
.hero h1 em { position:relative; z-index:0; text-shadow:0 2px 18px rgba(7,31,25,.9),0 0 2px rgba(7,31,25,.9); }
.hero-action { min-width:0; justify-content:center; padding:15px 23px; color:#12342b; background:var(--lime); border-color:var(--lime); font-weight:700; box-shadow:0 7px 20px rgba(0,0,0,.18); }.hero-action:hover { background:#f2ff8a; border-color:#f2ff8a; }
@media (max-width:760px) { .brand.brand-image { width:119px; }.hero-actions { width:100%; gap:12px; }.hero-action { width:100%; } }
.principle-icon { width:64px; height:64px; object-fit:contain; margin:0 0 22px; opacity:1; }.principle-list article>span { display:block; }
.experience-outdoor img { object-position:center 48%; }.experience-workshop img { object-position:center 20%; }
.clients { padding:120px 0 124px; background:var(--cream); border-top:1px solid var(--line); }.clients-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:42px; }.clients-heading .eyebrow { margin:0; }.clients-heading h2 { margin:0; }.client-logo-grid { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }.client-logo-grid figure { height:146px; display:grid; place-items:center; margin:0; padding:23px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#fbf9f4; }.client-logo-grid img { display:block; width:100%; height:100%; max-width:190px; max-height:100px; object-fit:contain; }
.programs-intro { max-width:660px; margin:23px 0 0; color:#52665e; font-size:var(--text); line-height:1.85; }.programs .section-title { margin-bottom:48px; }
.outcomes { background:var(--sand); padding:113px 0; }.outcomes-intro { display:grid; grid-template-columns:1fr .78fr; gap:10%; align-items:end; margin-bottom:55px; }.outcomes-intro h2 { margin:0; }.outcomes-intro>p { margin:0; color:#52665e; line-height:1.9; }.outcome-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(23,53,45,.18); border:1px solid rgba(23,53,45,.18); }.outcome-grid article { min-height:300px; padding:28px; position:relative; overflow:hidden; isolation:isolate; background:var(--sand); }.outcome-grid img { position:absolute; right:-2%; bottom:-8%; z-index:0; width:auto; height:85%; margin:0; object-fit:contain; opacity:.16; filter:saturate(1.15); }.outcome-grid h3 { position:relative; z-index:1; margin:0 0 6px; font:600 25px var(--display); }.outcome-grid strong { position:relative; z-index:1; display:block; margin-bottom:13px; font-size:var(--text); line-height:1.65; }.outcome-grid p { position:relative; z-index:1; margin:0; color:#52665e; font-size:var(--text); line-height:1.8; }
@media (max-width:760px) { .principle-icon { width:54px; height:54px; margin-bottom:17px; }.clients { padding:78px 0 82px; }.clients-heading { display:block; margin-bottom:28px; }.clients-heading .eyebrow { margin-bottom:12px; }.client-logo-grid { grid-template-columns:repeat(2,1fr); }.client-logo-grid figure { height:116px; padding:18px; }.client-logo-grid img { max-width:150px; max-height:80px; }.programs-intro { font-size:var(--text); }.outcomes { padding:76px 0; }.outcomes-intro { grid-template-columns:1fr; gap:20px; margin-bottom:32px; }.outcome-grid { grid-template-columns:1fr; }.outcome-grid article { min-height:260px; padding:24px; }.outcome-grid img { right:-1%; bottom:-10%; width:auto; height:78%; margin:0; opacity:.13; } }

/* Motion: only active when JS adds .motion (respects prefers-reduced-motion) */
@keyframes rise-in { from { opacity:0; transform:translate3d(0,30px,0); } to { opacity:1; transform:none; } }
.motion .hero-copy>.eyebrow,.motion .hero-title>span,.motion .hero-title>em,.motion .hero-intro,.motion .hero-actions { animation:rise-in 1s cubic-bezier(.2,.7,.2,1) both; }
.motion .hero-copy>.eyebrow { animation-delay:.1s; }
.motion .hero-title>span { animation-delay:.24s; }
.motion .hero-title>em { animation-delay:.4s; }
.motion .hero-intro { animation-delay:.62s; }
.motion .hero-actions { animation-delay:.8s; }
.motion .reveal { opacity:0; transform:translate3d(0,28px,0); transition:opacity .9s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0s); }
.motion .reveal.is-in { opacity:1; transform:none; }
.program-card { transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s; }
.program-card:hover { transform:translateY(-6px); box-shadow:0 24px 42px rgba(19,53,44,.24); }
.client-logo-grid img { transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.client-logo-grid figure:hover img { transform:scale(1.08); }
.principle-icon { transition:transform .45s cubic-bezier(.2,.7,.2,1); }
.principle-list article:hover .principle-icon { transform:translateY(-6px); }
.outcome-grid img { transition:opacity .45s,transform .6s cubic-bezier(.2,.7,.2,1); }
.outcome-grid article:hover img { opacity:.3; transform:translate3d(-8px,-8px,0) scale(1.05); }
.journal-card h3 { transition:color .3s; }
.journal-card:hover h3 { color:var(--moss); }
.outcome-grid article:nth-child(2) img { right:-10%; }
/* Parallax: scroll-driven CSS animations run on the compositor, so they stay smooth. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .hero { view-timeline:--hero block; }
    .hero-photo { will-change:transform; animation:hero-photo-lag linear both; animation-timeline:--hero; animation-range:exit 0% exit 100%; }
    @keyframes hero-photo-lag { from { transform:translate3d(0,0,0); } to { transform:translate3d(0,20.2%,0); } }
  }
}
@media (max-width:760px) {
  .hero h1 { font-size:min(49px,12vw); }
  .hero-title>span { white-space:nowrap; }
  .programs-title>span { white-space:normal; }
  .intro-title>span { text-wrap:balance; }
}
@media (max-width:760px) { .showcase-creation { --pin:17vw; } }
/* Collective-creation: photo is a background layer that lags behind the page (same technique as the hero). */
.showcase-creation { position:relative; width:100%; max-width:100%; overflow:hidden; isolation:isolate; aspect-ratio:2560/1259; max-height:860px; background:#f2ede3; }
/* Keep this moving background in a normal stacking layer. Safari can incorrectly clip a transformed, negative-z layer on very wide viewports. */
.showcase-photo { position:absolute; top:-34%; bottom:-34%; left:50%; width:100vw; margin-left:-50vw; z-index:0; pointer-events:none; background:url('/assets/web/collective-creation.jpg') center/cover; }
.showcase-band { position:relative; z-index:1; background:var(--green); color:#fbf8f3; }
.showcase-copy { display:grid; grid-template-columns:1.15fr .85fr; gap:8%; align-items:end; padding-block:clamp(44px,5vw,72px); }
.showcase-copy .eyebrow { grid-column:1/-1; margin:0 0 -4px; color:var(--lime); }
.showcase-copy h2 { margin:0; }
.showcase-copy h2 em { color:var(--lime); font-style:normal; }
.showcase-copy p:not(.eyebrow) { max-width:440px; margin:0 0 6px; color:#d5e0d9; font-size:var(--text); line-height:1.9; }
@media (max-width:760px) { .showcase-copy { grid-template-columns:1fr; gap:18px; padding-block:38px 46px; }.showcase-copy p:not(.eyebrow) { font-size:var(--text); margin:0; } }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion:no-preference) {
    .showcase-creation { view-timeline:--showcase block; }
    .showcase-photo { will-change:transform; animation:showcase-far linear both; animation-timeline:--showcase; animation-range:cover 0% cover 100%; }
    @keyframes showcase-far { from { transform:translate3d(0,-20.2%,0); } to { transform:translate3d(0,20.2%,0); } }
  }
}
@media (max-width:960px) { .principles-copy span,.programs-title>span,.principles-title>span,.principles-title>em { white-space:normal; } }
.site-header { position:fixed; transition:transform .35s cubic-bezier(.2,.7,.2,1),background-color .3s,box-shadow .3s; }
.site-header.is-floating { background:rgba(19,53,44,.96); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 6px 24px rgba(7,31,25,.28); }
.site-header.is-floating .nav-shell { border-bottom-color:transparent; }
.site-header.is-hidden { transform:translateY(-100%); }
.clients-more { margin:20px 0 0; text-align:right; font:var(--label) var(--mono); letter-spacing:.06em; color:#52665e; }
.dynamic-post blockquote { margin:44px 0; padding:4px 0 4px 26px; border-left:4px solid var(--lime); box-shadow:-1px 0 0 var(--moss); color:var(--moss); font:600 clamp(22px,3vw,28px)/1.75 var(--display); letter-spacing:.01em; }
.dynamic-post blockquote p { margin:0; font:inherit; }