/* Self-hosted fonts (SIL Open Font License 1.1, see /fonts/LICENSE-*.txt). */
@font-face{font-family:'Frank Ruhl BSD';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/frank-ruhl-libre-bsd.woff2) format('woff2')}
@font-face{font-family:'Albert Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/albert-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Albert Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/albert-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Albert Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/albert-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:Literata;font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/literata-latin-opsz-normal.woff2) format('woff2-variations')}
@font-face{font-family:Literata;font-style:italic;font-weight:200 900;font-display:swap;src:url(/fonts/literata-latin-opsz-italic.woff2) format('woff2-variations')}

/* Keep the hidden attribute authoritative over component display rules. */
[hidden]{display:none!important}
:root{--forest:#032A23;--pine:#06594B;--kid:#127566;--gold:#D6C28F;--goldink:#7A6330;--ivory:#F3F1EA;--sage:#A9C2B6;--mist:#EEF3F0;--ink:#10201B;--slate:#4B5C56;--line:#D5DED9;--nav:79px;--ease:cubic-bezier(.3,.7,.2,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:#FFFFFF;font-family:'Albert Sans',Arial,sans-serif;color:var(--ink);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%}
a{color:var(--pine)}
h1,h2,h3{font-family:Literata,Georgia,serif;font-weight:500;color:var(--forest);margin:0;letter-spacing:-0.01em;text-wrap:balance}
h1 em,h2 em,h3 em{font-style:italic;font-weight:400;color:var(--pine)}
p{margin:0}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px;position:relative}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--forest);color:var(--ivory);padding:10px 16px}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--goldink);outline-offset:4px}

/* section labels: a sprig from the logo and a quiet italic line */
.eye{display:inline-flex;align-items:center;gap:12px;font:italic 400 19px/1.3 Literata,Georgia,serif;color:var(--goldink)}
.eye::before{content:"";width:42px;height:17px;flex:none;background-color:currentColor;-webkit-mask:url(../img/sprig.svg) no-repeat left center/contain;mask:url(../img/sprig.svg) no-repeat left center/contain}
.eye.on-dark{color:var(--gold)}

/* buttons: the open ring closes on hover */
.btn,.btn2{display:inline-flex;align-items:center;gap:16px;min-height:54px;padding:0 16px 0 24px;font:600 13px/1.2 'Albert Sans',Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border-radius:2px;border:1.5px solid var(--forest);cursor:pointer}
.btn{background:var(--forest);color:var(--ivory);transition:background .3s,border-color .3s}
.btn:hover{background:var(--pine);border-color:var(--pine);color:var(--ivory)}
.btn2{color:var(--forest);background:linear-gradient(var(--forest),var(--forest)) no-repeat bottom/100% 0%;transition:background-size .45s var(--ease),color .3s}
.btn2:hover{background-size:100% 100%;color:var(--ivory)}
.btn.light{background:var(--ivory);border-color:var(--ivory);color:var(--forest)}
.btn.light:hover{background:#fff;border-color:#fff}
.ring{width:26px;height:26px;flex:none;overflow:visible}
.ring circle{fill:none;stroke:var(--gold);stroke-width:1.5;stroke-dasharray:80 20;stroke-dashoffset:-35;transition:stroke-dasharray .5s var(--ease)}
.ring path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.btn:hover .ring circle,.btn2:hover .ring circle{stroke-dasharray:100 0}
.btn2 .ring circle,.btn.light .ring circle{stroke:var(--goldink)}
.btn2:hover .ring circle{stroke:var(--gold)}

/* links: a gold line draws in from the left */
.lnk{color:var(--pine);text-decoration:none;padding-bottom:3px;background-image:linear-gradient(var(--goldink),var(--goldink)),linear-gradient(rgba(6,89,75,.28),rgba(6,89,75,.28));background-size:0% 1.5px,100% 1px;background-position:0 100%,0 100%;background-repeat:no-repeat;transition:background-size .5s var(--ease),color .2s}
.lnk:hover{color:var(--forest);background-size:100% 1.5px,100% 1px}
.alink{display:inline-flex;align-items:center;gap:6px;color:var(--forest);font-weight:600;font-size:15px;text-decoration:none;padding-bottom:4px;background-image:linear-gradient(var(--goldink),var(--goldink));background-size:0% 1.5px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .5s var(--ease);border:0;background-color:transparent;cursor:pointer;font-family:inherit}
.alink svg{width:16px;height:16px}
.alink svg path{fill:none;stroke:var(--goldink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transform:translateX(-3px);transition:transform .45s var(--ease)}
.alink:hover,.card:hover .alink,.aud:hover .alink,.page:hover .alink{background-size:100% 1.5px}
.alink:hover svg path,.card:hover .alink svg path,.aud:hover .alink svg path,.page:hover .alink svg path{transform:translateX(1px)}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:#FFFFFF;border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:16px;padding-bottom:16px}
.nav img{height:46px;display:block}
.nav ul{display:flex;align-items:center;gap:30px;list-style:none;margin:0;padding:0;font-size:15px}
.nav ul a.lnk{color:var(--ink);background-size:0% 1.5px,0% 1px}
.nav ul a.lnk:hover{background-size:100% 1.5px,0% 1px}
.nav .btn{min-height:46px;font-size:12px}
.menu-btn{display:none;align-items:center;gap:10px;min-height:44px;padding:0;background:none;border:0;font:italic 400 17px/1 Literata,Georgia,serif;color:var(--forest);cursor:pointer}
/* two lines that cross into an X */
.menu-btn svg{width:42px;height:42px;flex:none;overflow:visible}
.menu-btn path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;transform-box:view-box;transform-origin:21px 21px;transition:transform .45s var(--ease)}
.menu-btn[aria-expanded="true"] .l1{transform:rotate(45deg) translateY(3px)}
.menu-btn[aria-expanded="true"] .l2{transform:rotate(-45deg) translateY(-3px)}
.menu-btn .lbl{display:grid}
.menu-btn .lbl b{grid-area:1/1;font-weight:400;transition:opacity .3s,transform .4s var(--ease)}
.menu-btn .lbl b+b{opacity:0;transform:translateY(6px)}
.menu-btn[aria-expanded="true"] .lbl b{opacity:0;transform:translateY(-6px)}
.menu-btn[aria-expanded="true"] .lbl b+b{opacity:1;transform:none}
.nav .right{display:flex;align-items:center;gap:30px}

/* hero */
.hero{position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,580px);gap:48px;align-items:end;padding-top:40px}
.hero .wrap{container-type:inline-size}
/* The ground line sits 20% up the scene (canvas ratio 460/720) plus the 64px
   control row; keep the buttons a clear 40px above it at any scene width. */
.hero-text{display:flex;flex-direction:column;gap:22px;--scene-w:580px;padding-bottom:calc(var(--scene-w) * 0.1278 + 64px + 40px)}
.hero h1{font-size:clamp(38px,4.1vw,54px);line-height:1.05;letter-spacing:-0.02em}
.hero-text>p{text-wrap:pretty}
.hero-text>p{font-size:19px;max-width:540px;color:#2C3D37}
.hero-text>p.sub{font-size:17px;color:var(--slate);margin-top:-8px}
.hero .ctas{display:grid;width:fit-content;max-width:100%;gap:14px;margin-top:6px}
.hero .ctas>a{justify-content:space-between}
.scene{position:relative}
.scene canvas{display:block;width:100%;height:auto;aspect-ratio:720/460;-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}
.scene .art{position:relative}
.sky{position:absolute;left:-3000px;width:6000px;top:-1600px;bottom:20%;background:var(--mist);z-index:-2}
.horizon{position:absolute;left:-3000px;width:6000px;top:80%;height:1px;background:var(--sage);z-index:-1}
.scene-ctl{display:flex;justify-content:space-between;gap:22px;align-items:center;padding:2px 0 18px}
.ghost{background:none;border:0;padding:8px 0;min-height:44px;font:italic 400 16px/1 Literata,Georgia,serif;color:var(--slate);cursor:pointer}
.ghost:hover{color:var(--forest)}
.cue{display:flex;text-decoration:none;align-items:center;gap:10px;font:italic 400 15px/1 Literata,Georgia,serif;color:var(--slate);opacity:0;transition:opacity .8s}
.cue.on{opacity:1}
.cue i{display:block;width:1px;height:26px;background:var(--sage);position:relative;overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-10px;width:1px;height:10px;background:var(--goldink);animation:drip 1.8s ease-in-out infinite}
@keyframes drip{to{transform:translateY(36px)}}

/* moments and the before/after stage */
.band{background:var(--mist)}
.sec{padding-top:104px;padding-bottom:104px}
.head{display:flex;flex-direction:column;gap:18px;max-width:760px}
.head h2{font-size:42px;line-height:1.14}
.mo-prompt{margin-top:40px;font:italic 400 19px/1.3 Literata,Georgia,serif;color:var(--goldink)}
/* the six situations read as a list of voices; choosing one opens our answer beside it */
.moments{position:relative;margin-top:20px;width:52%;min-height:420px}
.mo{border-top:1px solid var(--sage)}
.mo:last-child{border-bottom:1px solid var(--sage)}
.mo-q{margin:0;font:inherit}
.mo-q button{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;padding:18px 0 18px 18px;background:none;border:0;border-left:2px solid transparent;text-align:left;cursor:pointer;font:italic 400 20px/1.35 Literata,Georgia,serif;color:var(--slate);transition:color .3s,border-color .3s,padding .4s var(--ease)}
.mo-q button:hover{color:var(--forest)}
.mo.on .mo-q button{color:var(--forest);border-left-color:var(--goldink);padding-left:24px}
.mo-q i{flex:none;width:9px;height:9px;border-right:1.5px solid var(--goldink);border-top:1.5px solid var(--goldink);transform:rotate(45deg);opacity:0;transition:opacity .3s,transform .4s var(--ease)}
.mo.on .mo-q i,.mo-q button:hover i{opacity:1}
.mo-q button{position:relative}
.mo-q button::after{content:"";position:absolute;left:-2px;bottom:-1px;height:1.5px;width:0;background:var(--goldink)}
.moments.cycling .mo.on .mo-q button::after{animation:moTick var(--cycle,7s) linear forwards}
@keyframes moTick{to{width:calc(100% + 2px)}}
.mo-a{position:absolute;left:calc(100% + 64px);top:0;width:calc(92% - 64px);display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding-top:22px;border-top:2px solid var(--gold);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .45s,transform .55s var(--ease),visibility 0s .45s}
.mo.on .mo-a{opacity:1;visibility:visible;transform:none;transition:opacity .45s .1s,transform .55s var(--ease) .1s,visibility 0s}
.mo-l{font:italic 400 17px/1 Literata,Georgia,serif;color:var(--goldink)}
.mo-a p{font:400 24px/1.45 Literata,Georgia,serif;color:var(--forest);max-width:520px}
.mo-g{font-size:14px;color:var(--slate)}
.ba-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:80px;padding-top:56px;border-top:1px solid var(--sage)}
.ba-top h3{font-size:32px;line-height:1.2}
.ba-top p{color:var(--slate);max-width:640px;margin-top:12px}
.seg{display:inline-flex;border:1px solid #6F857B;border-radius:24px;padding:3px;background:#FFFFFF}
.seg button{min-height:42px;padding:0 18px;border:0;border-radius:20px;background:transparent;font:500 15px/1 'Albert Sans',Arial,sans-serif;color:var(--forest);cursor:pointer;transition:background .3s,color .3s}
.seg button[aria-pressed="true"]{background:var(--forest);color:var(--ivory)}
/* one family's finances: loose threads in every direction, then one tree with three branches */
.board{position:relative;margin-top:40px;min-height:500px}
.scatter{position:absolute;inset:0}
.mlist{display:none}
.cols{display:grid;grid-template-columns:170px repeat(4,minmax(0,1fr));gap:32px;align-items:start;position:relative}
.famcell{padding-top:96px;display:flex;justify-content:center}
.board.plan{min-height:0;padding-top:0}
.board.plan .famcell{padding-top:0;justify-content:flex-start}
.board.plan .threads{top:0}
.fam{display:flex;flex-direction:column;align-items:center;gap:8px;width:180px;text-align:center;z-index:2}
.scatter .fam{position:absolute;left:calc(50% - 90px);top:calc(50% - 72px)}
.fam .dot{width:72px;height:72px;border-radius:50%;background:var(--forest);display:flex;align-items:center;justify-content:center}
.fam .dot img{width:42px}
.fam b{font:500 19px/1.2 Literata,Georgia,serif;color:var(--forest)}
.fam small{font-size:13px;color:var(--slate);line-height:1.35}
.col{display:flex;flex-direction:column;gap:22px;min-width:0}
.colhead{display:flex;align-items:center;gap:12px;opacity:0;transition:opacity .6s .35s}
.plan .colhead{opacity:1}
.colhead .ic{width:50px;height:50px;flex:none;border-radius:50%;background:#FFFFFF;display:flex;align-items:center;justify-content:center}
.colhead .ic img{width:30px}
.colhead h4{margin:0;font:500 24px/1.1 Literata,Georgia,serif;color:var(--forest)}
.colhead small{display:block;font:italic 400 15px/1.3 Literata,Georgia,serif;color:var(--goldink);margin-top:2px}
.items{display:flex;flex-direction:column;gap:20px;position:relative;padding-left:14px}
.items::before{content:"";position:absolute;left:24.5px;top:14px;bottom:14px;width:1.5px;background:var(--sage);opacity:0;transition:opacity .6s .6s}
.plan .items::before{opacity:1}
.bi{display:flex;gap:12px;align-items:flex-start;width:230px;max-width:100%;position:relative;z-index:1}
.scatter .bi{position:absolute;width:min(230px,22%)}
.cols .bi{width:auto}
.bi .mk{flex:none;width:22px;height:22px;margin-top:2px;border-radius:50%;border:1.5px solid var(--goldink);background:var(--mist);color:var(--goldink);display:flex;align-items:center;justify-content:center;font:600 12px/1 'Albert Sans',Arial,sans-serif;transition:background .5s,border-color .5s,color .5s}
.bi .mk svg{display:none;width:12px;height:12px}
.plan .bi .mk{background:var(--pine);border-color:var(--pine);color:var(--ivory)}
.plan .bi .mk span{display:none}
.plan .bi .mk svg{display:block}
.bi b{display:block;font:500 18px/1.25 Literata,Georgia,serif;color:var(--forest)}
.bi .was,.bi .now{display:block;font-size:14px;line-height:1.4;color:var(--slate);margin-top:2px}
.bi .now{display:none;color:var(--pine)}
.plan .bi .now{display:block}
.plan .bi .was{display:none}
.bi.merged{position:absolute;left:14px;top:0;opacity:0}
svg.threads{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.threads path{fill:none;stroke-width:1.5}
.ba-cap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;margin-top:28px;font-size:16px;color:var(--ink)}
.ba-cap b{font-weight:600;color:var(--forest)}
.ba-cap small{font-size:13px;color:var(--slate)}
@media (max-width:960px){
  .moments{width:100%;min-height:0}
  .mo-a{position:static;width:auto;border-top:0;padding:0 0 22px 24px;display:none;opacity:1;visibility:visible;transform:none}
  .mo.on .mo-a{display:flex}
  .mo-a p{font-size:19px}
  .mo-q button{font-size:18px}
  .mo-q i{opacity:1;transform:rotate(135deg)}
  .mo.on .mo-q i{transform:rotate(-45deg)}
  .cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
  .famcell{grid-column:1/-1;padding-top:0;justify-content:flex-start}
  .plan .fam{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;width:auto;text-align:left}
  .plan .fam .dot{grid-row:1/3}
  .plan .fam b{align-self:end}
  .plan .fam small{align-self:start}
  .plan .fam .dot{width:56px;height:56px}
  .plan .fam .dot img{width:32px}
}
@media (max-width:760px){
  .board{min-height:0}
  .board:not(.plan) .cols{display:none}
  .mlist{display:flex;flex-direction:column;gap:18px}
  .board.plan .mlist{display:none}
  .mlist .fam{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;width:auto;text-align:left;margin-bottom:8px}
  .mlist .fam .dot{grid-row:1/3}
  .mlist .fam b{align-self:end}
  .mlist .fam small{align-self:start}
  .mlist .fam .dot{width:56px;height:56px}
  .mlist .fam .dot img{width:32px}
  .mlist .bi{width:auto;max-width:calc(100% - 30px)}
  .mlist .bi .was{color:var(--goldink)}
  .cols{grid-template-columns:minmax(0,1fr);gap:28px}
  .scatter .bi{width:46%}
  .scatter .fam{left:calc(50% - 90px);top:calc(50% - 60px)}
  .ba-cap{grid-template-columns:minmax(0,1fr)}
  .ba-top h3{font-size:26px}
}

/* the story: the tree grows as you read */
.story-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.story-head h2{font-size:44px;line-height:1.12;max-width:640px}
.story-head p{max-width:460px;color:var(--slate)}
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,640px);gap:64px;margin-top:24px}
.stick{grid-column:2;grid-row:1;align-self:start;position:sticky;top:max(calc(var(--nav) + 16px),calc(var(--nav) + (100vh - var(--nav) - 600px) / 2));z-index:2}
.chapters{grid-column:1;grid-row:1}
.panel{position:relative}
/* the scene has no box: its sky melts into the page at the edges and the roots fade into the soil */
.panel canvas{display:block;width:100%;height:auto;aspect-ratio:720/560;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 80%,transparent 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 80%,transparent 100%);mask-composite:intersect}
.steps-ind{display:flex;gap:6px;padding:4px 8% 0;list-style:none;margin:0}
.steps-ind li{flex:1;display:flex;flex-direction:column;gap:8px;font:italic 400 15px/1.2 Literata,Georgia,serif;color:#8A9A94;transition:color .4s}
.steps-ind li.on{color:var(--forest)}
.steps-ind b{display:block;height:2px;background:var(--line);position:relative;overflow:hidden;border-radius:2px}
.steps-ind b i{position:absolute;inset:0;background:var(--goldink);transform-origin:left;transform:scaleX(0)}
.stick .film{margin-top:4px}
.chapter{height:165vh;position:relative}
.chapter:last-child{height:140vh}
/* each chapter's text holds still beside the scene while its part of the story plays, then hands over to the next */
.ch-in.flow{position:relative;top:auto}
.ch-in{position:sticky;top:calc(var(--nav) + var(--sh,0px) + 24px);min-height:calc(100vh - var(--nav) - var(--sh,0px) - 48px);display:flex;flex-direction:column;justify-content:center;gap:16px;will-change:opacity,transform}
.chapter .ic{width:64px;height:64px;border-radius:50%;background:var(--mist);display:flex;align-items:center;justify-content:center}
.chapter .ic img{width:40px}
.chapter .n{font:italic 400 17px/1 Literata,Georgia,serif;color:var(--goldink)}
.chapter h3{font-size:40px;line-height:1.1}
.chapter .lead{font:500 22px/1.4 Literata,Georgia,serif;color:var(--forest)}
.chapter p{max-width:520px}
.chapter .pull{font:italic 400 19px/1.45 Literata,Georgia,serif;color:var(--pine);border-left:2px solid var(--gold);padding-left:18px}
.chapter .qs{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.chapter .qs span{font-size:14px;color:var(--slate)}
.chapter .qs q{display:block;font:400 17px/1.45 Literata,Georgia,serif;color:var(--forest);quotes:none}

/* cards, lists */
.card{position:relative;background:#FFFFFF;border:1px solid var(--line);border-radius:6px;padding:36px 32px 32px;transition:border-color .35s;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:14px}
.card::before{content:"";position:absolute;top:-1px;left:32px;width:40px;height:2px;background:var(--gold);transition:width .6s var(--ease)}
.card:hover{border-color:var(--sage)}
.card:hover::before{width:calc(100% - 64px)}
.card h3{font-size:26px;line-height:1.2}
.card p{color:var(--slate);font-size:15px}
.card .alink{margin-top:auto;align-self:flex-start}
/* who we help: each audience stands on its own patch of ground; the gold strip grows along it on hover */
#who-we-help .grid3{column-gap:48px;row-gap:44px}
.aud{position:relative;display:flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--ink)}
.aud .vig{display:block;width:100%;max-width:260px;height:auto;margin:0 0 -13px}
.aud .grd{position:relative;height:1px;background:var(--sage);margin-bottom:14px}
.aud .grd::before{content:"";position:absolute;left:0;top:-1px;width:48px;height:3px;background:var(--gold);transition:width .6s var(--ease)}
.aud:hover .grd::before,.aud:focus-visible .grd::before{width:100%}
.aud .vig g{transition:transform .6s var(--ease)}
.aud h3{font-size:26px;line-height:1.2}
.aud p{color:var(--slate);font-size:15px;max-width:340px}
.aud .alink{margin-top:auto;align-self:flex-start}
/* resources: each article is a page with a turned corner */
.page{position:relative;display:flex;flex-direction:column;gap:14px;min-height:250px;padding:34px 30px 28px;background:var(--mist);color:var(--ink);text-decoration:none;clip-path:polygon(0 0,calc(100% - 34px) 0,100% 34px,100% 100%,0 100%);transition:background .35s}
.page::after{content:"";position:absolute;right:0;top:0;width:34px;height:34px;background:linear-gradient(to bottom left,transparent 50%,var(--sage) 50%);transition:width .45s var(--ease),height .45s var(--ease)}
.page::before{content:"";position:absolute;left:30px;top:0;width:40px;height:2px;background:var(--gold);transition:width .6s var(--ease)}
.page:hover{background:#E6EEEA}
.page:hover::before{width:calc(100% - 100px)}
.page:hover::after{width:42px;height:42px}
.page h3{font-size:24px;line-height:1.25}
.page .alink{margin-top:auto;align-self:flex-start}
.more-m{display:none !important}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:40px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:56px}
.svcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,auto);grid-auto-flow:column;column-gap:48px;list-style:none;margin:0;padding:0}
.svc{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 0;border-top:1px solid var(--line);color:var(--forest)}
.svc span{font:500 21px/1.3 Literata,Georgia,serif}
.svc small{font:italic 400 16px/1 Literata,Georgia,serif;color:var(--goldink)}
.why{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 48px}
.why div{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:22px}
.why .num{font:400 40px/1 Literata,Georgia,serif;color:var(--goldink)}
.why h3{font-size:24px}
.why p{color:var(--slate)}
.dark{background:var(--forest);color:var(--ivory)}
.dark h2{color:var(--ivory)}
.dark h2 em{color:var(--gold)}
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;position:relative;list-style:none;margin:56px 0 0;padding:0}
.steps::before{content:"";position:absolute;left:36px;right:36px;top:36px;height:1px;background:#1F4F45}
.step{display:flex;flex-direction:column;gap:16px;position:relative}
.step svg{flex:none}
.step h3{font-size:22px;line-height:28px;color:var(--ivory)}
.step p{font-size:15px;color:#AFC0B8;margin-top:8px}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font:500 21px/1.35 Literata,Georgia,serif;color:var(--forest)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:12px;height:12px;flex:none;border-right:1.5px solid var(--goldink);border-bottom:1.5px solid var(--goldink);transform:rotate(45deg) translate(-3px,-3px);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(225deg) translate(-3px,-3px)}
.faq details p{padding:0 0 24px;color:var(--slate);max-width:760px}
.ezra{display:grid;grid-template-columns:300px minmax(0,1fr);gap:56px;align-items:center}
.photo{width:280px;height:280px;border-radius:50%;background:#FFFFFF;border:1.5px dashed var(--sage);display:flex;align-items:center;justify-content:center;text-align:center;padding:40px;font-size:14px;color:var(--slate)}
.ezra blockquote{margin:0;font:400 24px/1.5 Literata,Georgia,serif;color:var(--forest);max-width:680px}
.closing{position:relative;overflow:hidden}
.closing .wm{position:absolute;right:-90px;bottom:-120px;width:520px;opacity:.07}
.closing h2{font-size:48px;line-height:1.1;max-width:860px}
.contact-row{display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-top:8px}
.contact-row a.lnk{color:var(--ivory);background-image:linear-gradient(var(--gold),var(--gold)),linear-gradient(rgba(243,241,234,.3),rgba(243,241,234,.3))}
.contacts{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:18px;font-size:15px;color:#AFC0B8}
.contacts a{color:var(--ivory);text-decoration:none}
footer{background:#021F1A;color:#AFC0B8;font-size:14px}
footer .wrap{padding-top:56px;padding-bottom:40px;display:flex;flex-direction:column;gap:32px}
footer .top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px;align-items:flex-start}
footer a{color:var(--ivory);text-decoration:none}
footer nav ul{display:flex;flex-wrap:wrap;gap:22px;list-style:none;margin:0;padding:0}
footer .legal{border-top:1px solid #1F4F45;padding-top:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:12px}
footer .legal a{color:#AFC0B8}

/* the full story, in a dialog */
dialog.filmbox{border:0;padding:0;border-radius:12px;width:min(920px,calc(100vw - 32px));background:#FFFFFF;box-shadow:0 24px 80px rgba(3,42,35,.35);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain}
html.film-open,html.film-open body{overflow:hidden;overscroll-behavior:none}
dialog.filmbox::backdrop{background:rgba(2,31,26,.72)}
.filmbox canvas{display:block;width:100%;height:auto;aspect-ratio:720/560}
.filmbox .bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:6px 20px}
.filmbox .bar div{display:flex;gap:22px}

@media (max-width:1100px){
  .hero .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
  .hero-text{--scene-w:calc((100cqw - 32px) / 2)}
  .steps{grid-template-columns:minmax(0,1fr);gap:0;max-width:680px}
  .steps::before{left:36px;right:auto;top:36px;bottom:72px;width:1px;height:auto}
  .step{flex-direction:row;gap:28px;align-items:flex-start;padding-bottom:36px}
  .step:last-child{padding-bottom:0}
  .step .tx{padding-top:22px}
}
@media (max-width:960px){
  .menu-btn{display:inline-flex}
  .nav .right{gap:18px}
  .nav nav ul{display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:#FFFFFF;border-bottom:1px solid var(--line);box-shadow:0 18px 30px -24px rgba(3,42,35,.4);padding:6px max(20px,env(safe-area-inset-left,0px)) 14px;
    visibility:hidden;opacity:0;clip-path:inset(0 0 100% 0);transition:clip-path .45s var(--ease),opacity .3s,visibility 0s .45s}
  .nav nav ul.open{visibility:visible;opacity:1;clip-path:inset(0 0 -40px 0);transition:clip-path .5s var(--ease),opacity .2s,visibility 0s}
  .nav nav ul li{opacity:0;transform:translateY(-8px);transition:opacity .25s,transform .35s var(--ease)}
  .nav nav ul.open li{opacity:1;transform:none;transition:opacity .4s,transform .5s var(--ease)}
  .nav nav ul.open li:nth-child(2){transition-delay:.05s}
  .nav nav ul.open li:nth-child(3){transition-delay:.1s}
  .nav nav ul.open li:nth-child(4){transition-delay:.15s}
  .nav nav ul li a.lnk{display:block;padding:15px 0;border-top:1px solid var(--line);font:400 21px/1.2 Literata,Georgia,serif;color:var(--forest);background-image:none}
  .nav nav ul li:first-child a.lnk{border-top:0}
  .hero .wrap{grid-template-columns:minmax(0,1fr);gap:8px;padding-top:48px}
  .hero-text{padding-bottom:0}
  .scene{max-width:620px;width:100%;margin:0 auto}
  .story{grid-template-columns:minmax(0,1fr);gap:0}
  .stick{grid-column:1;top:var(--nav);background:#FFFFFF;padding:6px 20px 8px;margin:0 -20px;box-shadow:0 12px 16px -14px rgba(3,42,35,.18)}
  .panel{max-width:520px;margin:0 auto}
  .panel{width:min(100%,calc(38vh * 720 / 560))}
  .panel canvas{width:100%}
  .steps-ind{width:min(100%,520px)}
  .steps-ind li{font-size:13px;white-space:nowrap}
  .steps-ind{max-width:520px;margin:0 auto}
  .stick .film{display:none}
  .chapters{grid-row:2}
  .chapter{height:150vh}
  .chapter:last-child{height:120vh}
  .ch-in{top:calc(var(--nav) + var(--sh,0px) + 12px);min-height:calc(100vh - var(--nav) - var(--sh,0px) - 24px);justify-content:flex-start;padding-top:8px}
  .grid3{gap:20px}
  .page{padding:30px 22px 24px;min-height:0}
  .page .alink{margin-top:18px}
  .page::before{left:22px}
  .split{grid-template-columns:minmax(0,1fr);gap:28px}
  .ezra{grid-template-columns:minmax(0,1fr);gap:32px}
}
@media (max-width:760px){
  :root{--nav:67px}
  .wrap{padding:0 20px}
  .nav .wrap{padding-top:10px;padding-bottom:10px}
  .nav img{height:40px}
  .nav .right{gap:10px}
  .menu-btn .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .nav .btn{min-height:44px;padding:0 10px 0 14px;gap:8px;white-space:nowrap;letter-spacing:.08em;font-size:11px}
  .hero h1{font-size:40px}
  .hero-text>p{font-size:17px}
  .hero-text>p.sub{font-size:16px}
  .cue{display:none}
  .scene-ctl{justify-content:flex-end}
  .sec{padding-top:72px;padding-bottom:72px}
  .head h2,.story-head h2{font-size:32px}
  .grid3,.svcs,.why{grid-template-columns:minmax(0,1fr)}
  .more-d{display:none !important}
  .more-m{display:flex !important;justify-content:space-between;margin-top:24px}
  .svcs{grid-template-rows:none;grid-auto-flow:row}
  .chapter h3{font-size:32px}
  .chapter .lead{font-size:19px}
  .closing h2{font-size:34px}
  .photo{width:220px;height:220px}
  .btn,.btn2{letter-spacing:.1em}
}
@media (max-height:820px){
  .chapter .ic{display:none}
  .chapter h3{font-size:34px}
  .chapter .lead{font-size:19px}
  .chapter p,.chapter .qs q{font-size:16px}
  .chapter .pull{font-size:17px}
  .ch-in{gap:12px}
}
@media (max-width:960px) and (max-height:760px){
  .panel{width:min(100%,calc(30vh * 720 / 560))}
  .chapter h3{font-size:28px}
  .chapter .n{display:none}
  .chapter p,.chapter .qs q{font-size:15px;line-height:1.5}
  .chapter .qs span{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}

/* ================= inner pages ================= */
.nav ul a.lnk[aria-current="page"]{color:var(--forest);background-size:100% 1.5px,0% 1px}

/* page opening: soft sky, a ground line, and (on some pages) a small scene */
.phero{position:relative;overflow:hidden;background:var(--mist);border-bottom:1px solid var(--sage)}
.phero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:48px;align-items:end;padding-top:64px;padding-bottom:0}
.phero.plain .wrap{grid-template-columns:minmax(0,1fr);padding-bottom:72px}
.phero .txt{display:flex;flex-direction:column;gap:20px;padding-bottom:64px}
.phero h1{font-size:clamp(38px,4.6vw,60px);line-height:1.05;letter-spacing:-0.02em}
.phero .lead{font-size:19px;line-height:1.6;color:#2C3D37;max-width:620px;text-wrap:pretty}
.phero .sub{font-size:15px;color:var(--slate)}
.scene-sm{position:relative;align-self:end}
.scene-sm canvas{display:block;width:100%;height:auto;aspect-ratio:720/560;max-width:100%;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 12%,#000 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 12%,#000 100%);mask-composite:intersect}
.soft canvas{display:block;width:100%;height:auto;aspect-ratio:720/560;max-width:100%;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 80%,transparent 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 10%,#000 80%,transparent 100%);mask-composite:intersect}
.jump{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:6px}
.jump a{display:inline-flex;align-items:center;gap:10px;font:italic 400 19px/1 Literata,Georgia,serif;color:var(--forest);text-decoration:none;padding-bottom:4px;background:linear-gradient(var(--goldink),var(--goldink)) no-repeat 0 100%/0% 1.5px;transition:background-size .5s var(--ease)}
.jump a:hover{background-size:100% 1.5px}
.jump img{width:26px;height:26px}

/* a leafy bullet list */
.leafs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.leafs li{position:relative;padding-left:34px}
.leafs li::before{content:"";position:absolute;left:0;top:.45em;width:24px;height:10px;background:var(--goldink);-webkit-mask:url(../img/sprig.svg) no-repeat left center/contain;mask:url(../img/sprig.svg) no-repeat left center/contain}

/* who we help: one audience at a time, each with its own small scene */
.audsec{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:start;padding-top:96px;padding-bottom:96px;border-top:1px solid var(--line)}
.audsec:first-of-type{border-top:0}
.audsec .art{position:sticky;top:calc(var(--nav) + 48px)}
.audsec .vig{display:block;width:100%;max-width:420px;height:auto;margin-bottom:-2px}
.audsec .grd{position:relative;height:1px;background:var(--sage);max-width:420px}
.audsec .grd::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:3px;background:var(--gold);transition:width 1.1s var(--ease)}
.audsec.seen .grd::before{width:100%}
.audsec .body{display:flex;flex-direction:column;gap:22px}
.audsec h2{font-size:clamp(30px,3.2vw,40px);line-height:1.12}
.audsec .body>p{font-size:18px;max-width:600px}
.voices{display:flex;flex-direction:column;gap:12px;padding:20px 0 4px;border-top:1px solid var(--line)}
.voices span{font-size:14px;color:var(--slate)}
.voices q{display:block;font:italic 400 20px/1.4 Literata,Georgia,serif;color:var(--forest);quotes:none}
.fit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
.fit h2{font-size:clamp(30px,3.4vw,42px);line-height:1.14}
.fit p{font-size:18px}

/* services: three steps, each with the tree at that stage */
.stepsec{padding-top:104px;padding-bottom:104px}
.stepsec.band{border-top:1px solid var(--sage);border-bottom:1px solid var(--sage)}
.stephead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:56px;align-items:center}
.stephead .t{display:flex;flex-direction:column;gap:16px}
.stephead .ic{width:64px;height:64px;border-radius:50%;background:#FFFFFF;display:flex;align-items:center;justify-content:center}
.band .stephead .ic{background:#FFFFFF}
.stepsec:not(.band) .stephead .ic{background:var(--mist)}
.stephead .ic img{width:40px}
.stephead .n{font:italic 400 17px/1 Literata,Georgia,serif;color:var(--goldink)}
.stephead h2{font-size:clamp(40px,4.4vw,56px);line-height:1.04}
.stephead .pull{font:italic 400 21px/1.45 Literata,Georgia,serif;color:var(--pine);border-left:2px solid var(--gold);padding-left:18px;max-width:560px}
.stephead p{max-width:560px}
.svcrows{margin-top:56px;display:flex;flex-direction:column}
.svcrow{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) repeat(3,minmax(0,1fr));gap:32px;padding:30px 0 34px;border-top:1px solid var(--sage)}
.svcrow::before{content:"";position:absolute;left:0;top:-1px;width:48px;height:3px;background:var(--gold);transition:width .7s var(--ease)}
.svcrow:hover::before{width:100%}
.svcrow h3{font-size:26px;line-height:1.2}
.svcrow .alink{margin-top:14px}
.svcrow dl{margin:0;display:contents}
.svcrow .cell{display:flex;flex-direction:column;gap:6px}
.svcrow dt{font:italic 400 15px/1.2 Literata,Georgia,serif;color:var(--goldink)}
.svcrow dd{margin:0;font-size:16px;color:var(--ink)}

/* about */
.ezhero .wrap{grid-template-columns:300px minmax(0,1fr);align-items:center;padding-bottom:72px}
.ezhero .txt{padding-bottom:0}
.storygrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:56px}
.storygrid .side{position:sticky;top:calc(var(--nav) + 40px);align-self:start;display:flex;flex-direction:column;gap:14px}
.prose{display:flex;flex-direction:column;gap:22px;max-width:680px}
.prose p{font:400 20px/1.65 Literata,Georgia,serif;color:var(--ink)}
.prose p.first::first-letter{float:left;font:500 64px/0.9 Literata,Georgia,serif;color:var(--forest);margin:6px 10px 0 0}
.prose .turn{font:italic 400 24px/1.4 Literata,Georgia,serif;color:var(--pine)}
.note{font-size:14px;color:var(--slate);border-left:2px solid var(--sage);padding-left:14px}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:44px}
.three .it{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--sage);padding-top:24px;position:relative}
.three .it::before{content:"";position:absolute;left:0;top:-1px;width:48px;height:3px;background:var(--gold)}
.three .it img{width:44px}
.three h3{font-size:28px}
.principles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 48px;margin-top:48px;list-style:none;padding:0}
.principles li{font:italic 400 22px/1.35 Literata,Georgia,serif;color:var(--forest);padding:14px 0 14px 34px;border-top:1px solid var(--line);position:relative}
.principles li::before{content:"";position:absolute;left:0;top:1.15em;width:22px;height:9px;background:var(--goldink);-webkit-mask:url(../img/sprig.svg) no-repeat left center/contain;mask:url(../img/sprig.svg) no-repeat left center/contain}
.bigquote{font:400 clamp(26px,3vw,36px)/1.35 Literata,Georgia,serif;color:var(--ivory);max-width:900px;margin:0}
.bigquote em{color:var(--gold)}
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 48px;list-style:none;padding:0;margin:40px 0 0}
.values li{font:500 30px/1.2 Literata,Georgia,serif;color:var(--forest);padding:22px 0;border-top:1px solid var(--sage)}
.feel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px;margin-top:44px}
.feel h3{font-size:24px;margin-bottom:16px}

/* resources */
.tabs{display:flex;flex-wrap:wrap;gap:6px 26px;margin-top:8px;border-bottom:1px solid var(--line)}
.tabs button{background:none;border:0;padding:12px 0 14px;font:400 16px/1 'Albert Sans',Arial,sans-serif;color:var(--slate);cursor:pointer;position:relative}
.tabs button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--goldink);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.tabs button[aria-pressed="true"]{color:var(--forest)}
.tabs button[aria-pressed="true"]::after{transform:scaleX(1)}
.tabs button:hover{color:var(--forest)}
.count{font:italic 400 16px/1 Literata,Georgia,serif;color:var(--goldink);margin-top:28px}
.empty{color:var(--slate);margin-top:24px}
.gloss{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:56px}
.gloss dl{margin:0;display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--sage)}
.gloss dl div{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:18px 0;border-bottom:1px solid var(--sage)}
.gloss dt{font:500 20px/1.3 Literata,Georgia,serif;color:var(--forest)}
.gloss dt small{display:block;font:400 15px/1.4 'Albert Sans',Arial,sans-serif;color:var(--slate);margin-top:2px;direction:rtl;text-align:left}
.gloss dd{margin:0;color:var(--ink)}

/* article */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--slate);list-style:none;margin:0;padding:0}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--sage)}
.crumbs a{color:var(--slate)}
.arthead .wrap{grid-template-columns:minmax(0,820px)}
.meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:var(--slate)}
.article{display:grid;grid-template-columns:minmax(0,720px) minmax(0,1fr);gap:72px;padding-top:72px;padding-bottom:96px}
.article .prose h2{font-size:30px;margin-top:20px}
.ph{color:var(--slate);background:repeating-linear-gradient(90deg,var(--mist) 0 12px,transparent 12px 16px) bottom/100% 1px no-repeat;font-style:italic}
.term{background:var(--mist);border-left:2px solid var(--gold);padding:20px 24px;display:flex;flex-direction:column;gap:4px}
.term small{font:italic 400 15px/1 Literata,Georgia,serif;color:var(--goldink)}
.term b{font:500 22px/1.3 Literata,Georgia,serif;color:var(--forest)}
.disclaim{font-size:14px;color:var(--slate);border-top:1px solid var(--line);padding-top:18px}
.aside{position:sticky;top:calc(var(--nav) + 40px);align-self:start;display:flex;flex-direction:column;gap:32px}
.ask{display:flex;flex-direction:column;gap:14px;padding-top:22px;border-top:2px solid var(--gold)}
.ask h3{font-size:24px}
.related{display:flex;flex-direction:column;gap:0;list-style:none;padding:0;margin:0}
.related li{border-top:1px solid var(--line)}
.related a{display:block;padding:16px 0;font:400 18px/1.35 Literata,Georgia,serif;color:var(--forest);text-decoration:none}
.related a:hover{color:var(--pine)}

/* contact */
.cflow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;padding:0;margin:8px 0 0;counter-reset:c}
.cflow li{display:flex;gap:16px;align-items:center;font-size:16px;line-height:1.45;color:var(--ink)}
.cflow li::before{counter-increment:c;content:counter(c);flex:none;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--goldink);display:flex;align-items:center;justify-content:center;font:500 18px/1 Literata,Georgia,serif;color:var(--forest)}
.contactgrid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:72px;padding-top:80px;padding-bottom:104px}
.form{display:flex;flex-direction:column;gap:34px}
.form h2{font-size:34px}
.fgroup{display:flex;flex-direction:column;gap:18px;border:0;margin:0;padding:0;min-width:0}
.fgroup legend{font:italic 400 18px/1.3 Literata,Georgia,serif;color:var(--goldink);padding:0;margin-bottom:6px}
.frow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label,.qlabel{font-size:14px;font-weight:600;color:var(--forest)}
.field input,.field select,.field textarea{font:400 17px/1.4 'Albert Sans',Arial,sans-serif;color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid var(--sage);border-radius:0;padding:10px 0;width:100%;transition:border-color .3s}
.field textarea{min-height:120px;resize:vertical;border:1.5px solid var(--sage);border-radius:2px;padding:12px 14px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--goldink)}
.field.bad input,.field.bad textarea{border-color:#A1442F}
.field .err{font-size:13px;color:#A1442F;display:none}
.field.bad .err{display:block}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips label{position:relative;cursor:pointer}
.chips input{position:absolute;opacity:0;width:1px;height:1px}
.chips span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border:1px solid var(--sage);border-radius:22px;font-size:15px;color:var(--forest);background:#FFFFFF;transition:background .25s,color .25s,border-color .25s}
.chips input:checked+span{background:var(--forest);border-color:var(--forest);color:var(--ivory)}
.chips input:focus-visible+span{outline:2px solid var(--goldink);outline-offset:3px}
.privacy{font-size:14px;color:var(--slate);max-width:620px}
.sent{display:none;flex-direction:column;gap:16px;align-items:flex-start;padding:40px 0;border-top:2px solid var(--gold)}
.form.done .sent{display:flex}
.form.done .formbody{display:none}
.sent h2{font-size:36px}
.ways{display:flex;flex-direction:column;gap:40px;position:sticky;top:calc(var(--nav) + 40px);align-self:start}
.book{position:relative;display:flex;flex-direction:column;gap:14px;padding:32px 28px 28px;background:var(--mist);clip-path:polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,0 100%)}
.book::after{content:"";position:absolute;right:0;top:0;width:30px;height:30px;background:linear-gradient(to bottom left,transparent 50%,var(--sage) 50%)}
.book h3{font-size:26px}
.reach{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.reach li{display:flex;flex-direction:column;gap:2px;padding:16px 0;border-top:1px solid var(--line)}
.reach small{font:italic 400 15px/1 Literata,Georgia,serif;color:var(--goldink)}
.reach a,.reach span.v{font:400 20px/1.3 Literata,Georgia,serif;color:var(--forest);text-decoration:none;user-select:all}

/* simple text pages */
.legal .prose p{font:400 18px/1.65 'Albert Sans',Arial,sans-serif}
.legal h2{font-size:28px;margin-top:12px}

@media (max-width:960px){
  .phero .wrap,.ezhero .wrap{grid-template-columns:minmax(0,1fr);gap:24px}
  .phero .txt{padding-bottom:0}
  .scene-sm{max-width:520px;width:100%;margin:0 auto}
  .ezhero .wrap{padding-bottom:56px}
  .audsec{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:64px;padding-bottom:64px}
  .audsec .art{position:static}
  .fit,.storygrid,.gloss,.article,.contactgrid{grid-template-columns:minmax(0,1fr);gap:36px}
  .storygrid .side,.aside,.ways{position:static}
  .stephead{grid-template-columns:minmax(0,1fr);gap:24px}
  .stephead .soft{max-width:460px}
  .svcrow{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 24px}
  .svcrow .name{grid-column:1/-1}
  .three,.values{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .phero .wrap{padding-top:44px}
  .phero.plain .wrap{padding-bottom:48px}
  .stepsec{padding-top:64px;padding-bottom:64px}
  .svcrow{grid-template-columns:minmax(0,1fr);gap:14px}
  .three,.values,.principles,.feel,.frow,.cflow{grid-template-columns:minmax(0,1fr)}
  .values li{font-size:26px;padding:16px 0}
  .gloss dl div{grid-template-columns:minmax(0,1fr);gap:6px}
  .prose p{font-size:18px}
  .contactgrid{padding-top:48px;padding-bottom:64px}
}

/* home services list: each line links to its step on the Services page */
.svc{padding:0}
.svclink{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:22px 0;text-decoration:none;color:var(--forest)}
.svclink span{padding-bottom:3px;background:linear-gradient(var(--goldink),var(--goldink)) no-repeat 0 100%/0% 1.5px;transition:background-size .5s var(--ease)}
.svclink:hover span{background-size:100% 1.5px}

/* Former inline styles from the approved build (CSP forbids style attributes). */
.u-text-16{font-size:16px}
.u-logo-44{height:44px;width:auto;align-self:flex-start}
.u-address{font-style:normal;display:flex;flex-direction:column;gap:4px}
.u-tagline{font-family:Literata,Georgia,serif;font-style:italic;color:var(--gold)}
.u-row-18{display:flex;gap:18px}
.u-stack-14{display:flex;flex-direction:column;gap:14px}
.u-stack-26{display:flex;flex-direction:column;gap:26px}
.u-text-17{font-size:17px}
.u-mt-10{margin-top:10px}
.u-svg-label-ivory{font:500 22px Literata,Georgia,serif;fill:#F3F1EA}
.u-pb-0{padding-bottom:0}
.u-row-center{display:flex;justify-content:center}
.u-stack-20-start{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.u-border-top{border-top:1px solid var(--line)}
.u-pt-56{padding-top:56px}
.u-mt-24{margin-top:24px}
.u-svg-quote{font:italic 400 17px/1.2 Literata,Georgia,serif;color:var(--forest)}
.u-svg-label-gold{font:500 22px Literata,Georgia,serif;fill:#D6C28F}
.u-heading-34{font-size:34px;line-height:1.15}
.u-note{font-size:15px;color:var(--slate)}
.u-row-split{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px}
.u-stack-34{display:flex;flex-direction:column;gap:34px}
.u-muted-mt-8{color:var(--slate);margin-top:8px}
.u-muted{color:var(--slate)}
.u-self-start{align-self:flex-start}
.u-items-start{align-items:flex-start}
.form-status{color:var(--forest);background:var(--mist);border-left:3px solid var(--gold);padding:12px 16px}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.cf-turnstile{min-height:65px}
.form-status.error{background:#F6E9E5;border-left-color:#A1442F;color:#5E2618}
@media (min-width:761px) and (max-width:1100px){.board{min-height:680px}}
img.photo{padding:0;border:0;object-fit:cover;background:var(--mist)}

/* ways to work with us: what each costs, before anyone calls */
.u-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.u-mt{margin-top:72px}
.workways{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:48px}
.offer{position:relative;display:flex;flex-direction:column;gap:12px;padding:32px 32px 28px;background:var(--mist);color:var(--ink);text-decoration:none;border-top:3px solid var(--gold);transition:background .35s}
a.offer:hover{background:#E6EEEA}
.offer.annual{background:var(--forest);color:var(--ivory);border-top-color:var(--gold)}
a.offer.annual:hover{background:#06352D}
.offer h3{font-size:28px;line-height:1.2}
.offer.annual h3,.offer.annual .paid dd{color:var(--ivory)}
.offer p{color:var(--slate);font-size:16px;max-width:520px}
.offer.annual p{color:#C9D6D0}
.offer .tag{align-self:flex-start;font:600 12px/1 'Albert Sans',Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:7px 10px;border-radius:3px;background:#FFFFFF;color:var(--pine)}
.offer.annual .tag{background:var(--gold);color:var(--forest)}
.offer .alink{margin-top:14px;align-self:flex-start}
.offer.annual .alink{color:var(--ivory)}
.offer.annual .alink svg path{stroke:var(--gold)}
.offer.annual .paid{border-top-color:#1F4F45}
.offer.annual .paid dt{color:var(--gold)}
.paid{margin:auto 0 0;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.paid dt,.feebox>span:first-child,.bsa .k,.minor{font:600 13px/1.3 'Albert Sans',Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--goldink)}
.paid dd{margin:0;font:500 20px/1.35 Literata,Georgia,serif;color:var(--forest)}
.tbc{display:inline;background:#FBF1D3;color:#6B5420;font:italic 400 .9em/1.4 'Albert Sans',Arial,sans-serif;padding:1px 6px;border-radius:3px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.freeline{display:flex;align-items:center;gap:16px;margin-top:24px;padding:18px 24px;border:1px solid var(--line);border-radius:4px;background:#FFFFFF}
.freeline img{width:30px;height:30px;flex:none}
.freeline p{margin:0;font-size:16px;color:var(--slate)}
.freeline strong{color:var(--forest);font-weight:600}
.paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:44px}
.path{display:flex;flex-direction:column;gap:16px;padding:30px 28px 26px;border:1px solid var(--line);border-radius:4px;text-decoration:none;color:var(--ink);transition:border-color .3s,background .3s}
.path:hover{border-color:var(--sage);background:var(--mist)}
.path q{font:italic 400 22px/1.35 Literata,Georgia,serif;color:var(--forest);quotes:"\201C" "\201D"}
.path .ans{color:var(--slate);font-size:16px}
.path .ans b{color:var(--ink);font-weight:600}
.path .alink{margin-top:auto}
.path:hover .alink{background-size:100% 1.5px}
.sub2{font-size:17px;color:var(--slate);max-width:520px}
.prods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.prods h3{font-size:22px;margin-bottom:14px}
.incl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.incl li{position:relative;padding-left:26px;font-size:16px;line-height:1.5}
.incl li::before{content:"";position:absolute;left:2px;top:.42em;width:12px;height:7px;border-left:2px solid var(--pine);border-bottom:2px solid var(--pine);transform:rotate(-45deg)}
.bsa{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin:64px 0 0;padding:0;counter-reset:b}
.bsa li{display:flex;flex-direction:column;gap:10px;padding:28px;background:#FFFFFF;border-top:3px solid var(--gold)}
.bsa h3{font-size:24px}
.bsa p{color:var(--slate);font-size:16px}
.feebox{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding:20px 22px;background:var(--forest);color:var(--ivory);border-radius:4px;align-self:stretch;max-width:420px}
.feebox>span:first-child{color:var(--gold)}
.feebox b{font:500 24px/1.2 Literata,Georgia,serif}
.feebox .tbc{align-self:flex-start}
.minor{margin:0 0 18px}
.minor.u-mt{margin-top:72px}
.lifemoments{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.lifemoment{display:flex;flex-direction:column;gap:10px;padding:24px 22px;background:var(--mist)}
.lifemoment img{width:34px;height:34px}
.lifemoment h4{margin:0;font:500 21px/1.25 Literata,Georgia,serif;color:var(--forest)}
.lifemoment p{margin:0;color:var(--slate);font-size:15.5px}
.cmpwrap{overflow-x:auto}
.cmp{width:100%;border-collapse:collapse;font-size:16px}
.cmp th,.cmp td{text-align:left;vertical-align:top;padding:16px 18px;border-bottom:1px solid var(--line)}
.cmp thead th{font:500 20px/1.25 Literata,Georgia,serif;color:var(--forest);border-bottom:2px solid var(--sage)}
.cmp thead th small{display:block;margin-top:6px;font:600 12px/1 'Albert Sans',Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--goldink)}
.cmp tbody th{font-weight:600;color:var(--ink);width:34%}
.cmp td{color:var(--slate)}
.cmp .hl{background:var(--mist);color:var(--ink)}
.cmp thead .hl{border-top:3px solid var(--gold)}
.reassure{margin:28px 0 0;font:italic 400 21px/1.4 Literata,Georgia,serif;color:var(--forest)}
.stagemap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:44px;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.stage{display:flex;flex-direction:column;gap:10px;padding:26px 24px;border-right:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background .3s}
.stage:nth-child(4){border-right:0}
.stage:hover{background:var(--mist)}
.stage img{width:36px;height:36px}
.stage h3{font-size:24px}
.stage p{margin:0;color:var(--slate);font-size:15.5px}
.band-plan{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;padding:18px 24px;background:var(--forest);color:#C9D6D0;font-size:16px}
.band-plan b{font:500 20px/1.3 Literata,Georgia,serif;color:var(--gold)}
.thinking .sec{padding-bottom:0}
.thinking .lead{font-size:19px;color:#2C3D37;max-width:620px}
@media (max-width:1100px){
  .lifemoments{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stagemap{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stage:nth-child(2){border-right:0}
  .stage:nth-child(-n+2){border-bottom:1px solid var(--line)}
}
@media (max-width:960px){
  .workways,.paths,.bsa{grid-template-columns:minmax(0,1fr)}
  .workways,.paths{max-width:640px}
}
@media (max-width:760px){
  .offer{padding:26px 22px 22px}
  .offer h3{font-size:24px}
  .freeline{align-items:flex-start;padding:16px 18px}
  .prods,.lifemoments,.stagemap{grid-template-columns:minmax(0,1fr)}
  .stage{border-right:0;border-bottom:1px solid var(--line)}
  .minor.u-mt{margin-top:56px}
  .cmp{font-size:14.5px}
  .cmp th,.cmp td{padding:12px 10px}
  .cmp thead th{font-size:16px}
  .cmp tbody th{width:30%}
}
.three.four{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
@media (max-width:1100px){.three.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.three.four{grid-template-columns:minmax(0,1fr)}}

/* questions open and close smoothly: site.js animates the height */
.faq details{overflow:hidden}
.faq details p{transition:opacity .35s var(--ease)}
.faq details.closing p{opacity:0}
/* LinkedIn links */
.u-li{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500;color:inherit;text-decoration:none}
.u-li:hover{text-decoration:underline;text-underline-offset:3px}
.u-li .li{width:15px;height:auto;aspect-ratio:100/95.56;fill:currentColor;flex:none;margin-top:-2px}
.ezhero .u-li{color:var(--pine);margin-top:-4px}
.ezlinks{align-items:center;flex-wrap:wrap;gap:12px 24px}
.ezlinks .u-li{color:var(--pine)}
@media (min-width:961px){.cols .colhead{min-height:70px}}
/* one family, with a plan: the family sits on its own row above the four stages, so each stage gets
   real width; four across on wide screens, two by two on laptops and tablets, one column on phones */
.cols{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 32px}
.famcell{grid-column:1/-1;padding-top:0;justify-content:flex-start}
.plan .fam{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;width:auto;text-align:left}
.plan .fam .dot{grid-row:1/3;width:56px;height:56px}
.plan .fam .dot img{width:32px}
.plan .fam b{align-self:end}
.plan .fam small{align-self:start}
@media (max-width:1200px){.cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 40px}}
@media (max-width:760px){.cols{grid-template-columns:minmax(0,1fr);gap:28px}}
/* "on this page" links at the top of Services: a row on wide screens, a tidy stacked list on phones */
.toc{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:6px}
.toc a{display:inline-flex;align-items:center;gap:8px;font:italic 400 19px/1.3 Literata,Georgia,serif;color:var(--forest);text-decoration:none;padding-bottom:4px;background:linear-gradient(var(--goldink),var(--goldink)) no-repeat 0 100%/0% 1.5px;transition:background-size .5s var(--ease)}
.toc a:hover{background-size:100% 1.5px}
.toc svg{width:15px;height:15px;flex:none}
.toc svg path{fill:none;stroke:var(--goldink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:760px){
  .toc{display:flex;flex-direction:column;gap:0;margin-top:10px;border-top:1px solid var(--sage)}
  .toc a{justify-content:space-between;padding:14px 2px;border-bottom:1px solid var(--sage);background:none;font-size:18px}
}
@media (min-width:761px) and (max-width:1100px){
  .toc{display:grid;grid-template-columns:repeat(2,max-content);gap:12px 48px}
}
/* Before / The switch / After: rise in one by one, then the gold line draws across */
.bsa li{position:relative;border-top:0;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.bsa li::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--gold);transform-origin:left}
.bsa li:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(3,42,35,.08)}
.bsa.anim li{opacity:0;transform:translateY(26px)}
.bsa.anim li::before{transform:scaleX(0)}
.bsa.anim.seen li{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .8s var(--ease),box-shadow .45s var(--ease)}
.bsa.anim.seen li::before{transform:scaleX(1);transition:transform .9s var(--ease)}
.bsa.anim.seen li:nth-child(1){transition-delay:0s}
.bsa.anim.seen li:nth-child(2){transition-delay:.18s}
.bsa.anim.seen li:nth-child(3){transition-delay:.36s}
.bsa.anim.seen li:nth-child(1)::before{transition-delay:.35s}
.bsa.anim.seen li:nth-child(2)::before{transition-delay:.53s}
.bsa.anim.seen li:nth-child(3)::before{transition-delay:.71s}
.bsa.anim.seen li:hover{transform:translateY(-4px);transition-delay:0s}
/* the license line, pinned to the bottom of the screen on every page */
.licbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;flex-wrap:wrap;justify-content:center;padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px));background:rgba(3,42,35,.96);color:#C9D6D0;font-size:13px;line-height:1.35;text-align:center;transition:transform .4s var(--ease)}
.licbar>span+span::before{content:"·";margin:0 10px;color:var(--gold)}
.licbar .lb-short{display:none}
.licbar.off{transform:translateY(100%)}
@media (max-width:760px){
  .licbar{font-size:12px;padding:6px 12px calc(6px + env(safe-area-inset-bottom,0px))}
  .licbar>span+span::before{margin:0 7px}
  .licbar .lb-long{display:none}
  .licbar .lb-short{display:inline}
}
@media print{.licbar{display:none}}
@media (max-width:760px){.cflow{gap:16px}}
@media (max-width:379px){.licbar{font-size:11px;padding-left:8px;padding-right:8px}.licbar>span+span::before{margin:0 5px}}
/* footer: brand, then two tidy columns (Explore, Get in touch), then the license line and legal links */
footer .wrap{padding-top:64px;padding-bottom:36px;gap:40px}
.ftop{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:40px 48px;align-items:start}
.fbrand{display:flex;flex-direction:column;gap:14px}
.fcol{display:flex;flex-direction:column;gap:14px}
.fh{margin:0;font:600 12px/1.3 'Albert Sans',Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.flinks{display:flex;flex-direction:column;gap:10px;list-style:none;margin:0;padding:0;font-size:15px}
.flinks a,.fcontact a{color:var(--ivory);text-decoration:none;background:linear-gradient(var(--gold),var(--gold)) no-repeat 0 100%/0% 1px;padding-bottom:2px;transition:background-size .4s var(--ease)}
.flinks a:hover,.fcontact a:hover{background-size:100% 1px}
.fcontact{font-style:normal;display:flex;flex-direction:column;gap:12px;font-size:15px}
.fphone{display:flex;flex-direction:column;gap:2px}
.fphone small{font-size:12px;color:#8FA59C}
.fcontact .u-li{align-self:flex-start;gap:9px}
.fcontact .u-li:hover{text-decoration:none}
footer .legal{gap:12px 32px;align-items:baseline;padding-top:24px}
footer .legal p{margin:0}
.lic{display:flex;flex-wrap:wrap;gap:2px 0;line-height:1.6}
.lic span{white-space:nowrap}
.lic span:not(:last-child)::after{content:"·";margin:0 8px;color:#5E7A70}
.flegal{display:flex;flex-wrap:wrap;gap:8px 20px;white-space:nowrap}
@media (max-width:1100px){
  .ftop{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fbrand{grid-column:1/-1;flex-direction:row;align-items:center;gap:20px}
  .fbrand .u-tagline{padding-left:20px;border-left:1px solid #1F4F45}
}
@media (max-width:760px){
  footer .wrap{padding-top:48px;gap:32px}
  .ftop{gap:32px 20px}
  .fbrand{flex-direction:column;align-items:flex-start;gap:12px}
  .fbrand .u-tagline{padding-left:0;border-left:0}
  .flinks{display:grid;grid-template-columns:repeat(2,max-content);gap:10px 28px}
  .fcol:last-child{grid-column:1/-1}
  footer .legal{flex-direction:column;gap:14px}
  .lic{flex-direction:column;gap:2px}
  .lic span{white-space:normal}
  .lic span:not(:last-child)::after{content:none}
}
/* footer spacing: both columns share one rhythm, so their rows line up; the columns sit together on the right */
footer .wrap{padding-top:64px;padding-bottom:32px;gap:44px}
.ftop{grid-template-columns:minmax(0,1fr) auto auto;column-gap:clamp(48px,8vw,120px)}
.fcol{gap:16px}
.flinks,.fcontact{gap:0}
.flinks li,.fcontact>*{min-height:34px;display:flex;align-items:center}
.fphone{flex-direction:row;flex-wrap:wrap;align-items:center;gap:0 10px}
.fphone small{font-size:12px}
.fcontact .u-li{align-self:flex-start}
footer .legal{padding-top:22px}
@media (max-width:1100px){
  .ftop{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
}
@media (max-width:760px){
  .flinks{display:grid;grid-template-columns:repeat(2,max-content);column-gap:36px}
  footer .wrap{padding-top:48px;padding-bottom:28px;gap:32px}
}
.legal .prose ul{margin:0;padding-left:22px;font-size:18px;line-height:1.65}
.legal .prose li+li{margin-top:6px}
.legal .prose a{color:var(--pine)}
/* the phone / email menu: a small card in the middle of the screen, a sheet from the bottom on phones */
dialog.cmenu{border:0;padding:0;border-radius:12px;width:min(360px,calc(100vw - 32px));background:#FFFFFF;color:var(--ink);box-shadow:0 24px 70px rgba(3,42,35,.3)}
dialog.cmenu::backdrop{background:rgba(2,31,26,.45)}
.cm-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 18px 10px 22px}
.cm-t{font:500 19px/1.3 Literata,Georgia,serif;color:var(--forest);overflow-wrap:anywhere}
.cm-x{flex:none;width:34px;height:34px;border:0;border-radius:50%;background:var(--mist);color:var(--forest);font-size:22px;line-height:1;cursor:pointer}
.cm-x:hover{background:#E1EAE5}
.cm-l{display:flex;flex-direction:column;padding:4px 10px 12px}
.cm-i{display:flex;align-items:center;gap:14px;width:100%;padding:11px 12px;border:0;border-radius:8px;background:none;color:var(--ink);text-decoration:none;text-align:left;font:inherit;cursor:pointer}
.cm-i:hover,.cm-i:focus-visible{background:var(--mist)}
.cm-i svg{flex:none;width:36px;height:36px;padding:8px;border-radius:50%;background:var(--mist);fill:none;stroke:var(--pine);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cm-i:hover svg{background:#FFFFFF}
.cm-i span{display:flex;flex-direction:column;gap:1px;min-width:0}
.cm-i b{font-weight:600;font-size:15.5px;color:var(--forest)}
.cm-i small{font-size:13px;color:var(--slate);overflow-wrap:anywhere}
.cm-i.ok b{color:var(--pine)}
.cm-i.ok svg{background:var(--pine);stroke:#FFFFFF}
@media (max-width:760px){
  dialog.cmenu{margin:auto 0 0;width:100%;max-width:100%;border-radius:16px 16px 0 0;padding-bottom:env(safe-area-inset-bottom,0px)}
  .cm-i{padding:13px 12px}
}
/* privacy and accessibility links in the footer light up on hover */
footer .flegal a{transition:color .3s;background:linear-gradient(var(--gold),var(--gold)) no-repeat 0 100%/0% 1px;padding-bottom:2px;transition:color .3s,background-size .4s var(--ease)}
footer .flegal a:hover,footer .flegal a:focus-visible{color:var(--ivory);background-size:100% 1px}
/* footer contact lines: the hover underline runs under the text only, not across the whole row */
.fcontact>*{align-self:flex-start}
/* about: a mosaic of Ezra's IDF photos under his story */
.ezphotos .wrap{padding-bottom:96px}
.mosaic{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr);grid-template-rows:270px 270px;gap:14px}
.mosaic figure{margin:0;overflow:hidden;border-radius:6px;background:var(--mist)}
.mosaic img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mosaic figure:hover img{transform:scale(1.035)}
.m-vineyard{grid-column:1;grid-row:1/3}.m-vineyard img{object-position:76% 40%}
.m-tree{grid-column:2/4;grid-row:1}.m-tree img{object-position:50% 38%}
.m-rest{grid-column:2;grid-row:2}.m-rest img{object-position:50% 40%}
.m-tank{grid-column:3;grid-row:2}.m-tank img{object-position:52% 45%}
.mcap{margin:14px 0 0;font:italic 400 16px/1.4 Literata,Georgia,serif;color:var(--slate)}
@media (max-width:960px){.mosaic{grid-template-rows:220px 220px}}
@media (max-width:760px){
  .ezphotos .wrap{padding-bottom:64px}
  .mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:140px;gap:10px}
  .m-vineyard{grid-column:1/3;grid-row:span 2}
  .m-tree{grid-column:1/3;grid-row:span 2}
  .m-rest,.m-tank{grid-column:auto;grid-row:auto}
}
@media (prefers-reduced-motion:reduce){.mosaic img{transition:none}.mosaic figure:hover img{transform:none}}
/* the bottom two photos run a little taller, so less of each is cropped away */
.mosaic{grid-template-rows:270px 340px}
@media (max-width:960px){.mosaic{grid-template-rows:220px 290px}}
@media (max-width:760px){
  .mosaic{grid-template-rows:none;grid-auto-rows:140px}
  .m-rest,.m-tank{grid-row:span 2;height:100%}
  .m-rest img{object-position:50% 35%}
  .m-tank img{object-position:56% 50%}
}
/* three ways to work with us */
.workways.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.suits{margin:0;font-size:14.5px;line-height:1.5;color:var(--slate)}
.suits b{font-weight:600;color:var(--forest)}
.offer.annual .suits{color:#C9D6D0}
.offer.annual .suits b{color:var(--ivory)}
#review .suits{margin-top:18px}
.paths.four{grid-template-columns:repeat(2,minmax(0,1fr))}
.band .lifemoment{background:#FFFFFF}
@media (max-width:1100px){.workways.three{grid-template-columns:minmax(0,1fr);max-width:640px}}
@media (max-width:960px){.paths.four{grid-template-columns:minmax(0,1fr)}}
@media (min-width:761px) and (max-width:1100px){.toc{grid-template-columns:repeat(3,max-content)}}
@media (min-width:761px) and (max-width:1180px){.toc{display:grid;grid-template-columns:repeat(3,max-content);gap:12px 48px}}
/* staging only: the form is shown for review and says so */
.form-preview{margin:0;padding:12px 16px;border-radius:4px;background:#FBF1D3;color:#5C4818;font-size:14.5px;line-height:1.5}
.sent .preview-note{margin:-4px 0 4px;font-size:14px;color:var(--goldink)}
/* the three ways, side by side: equal columns on wide screens, one small card per row on phones */
.cmp3{table-layout:fixed;border-collapse:separate;border-spacing:0;background:#FFFFFF;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.cmp3 col.c0{width:24%}
.cmp3 thead th{padding:22px 20px 18px;vertical-align:bottom;border-bottom:1px solid var(--sage);font-size:19px;line-height:1.25}
.cmp3 thead th small{margin-top:8px}
.cmp3 th,.cmp3 td{padding:16px 20px;border-bottom:1px solid var(--line);line-height:1.5}
.cmp3 tbody tr:last-child th,.cmp3 tbody tr:last-child td{border-bottom:0}
.cmp3 tbody th{font-size:15px;color:var(--forest);background:#FBFCFB;width:auto}
.cmp3 td{font-size:15px}
.cmp3 .hl{background:var(--mist)}
.cmp3 thead .hl{border-top:0;box-shadow:inset 0 3px 0 var(--gold)}
.cmp3 tbody tr:last-child td,.cmp3 tbody tr:last-child th{padding-top:20px;padding-bottom:20px;font-weight:600;color:var(--forest)}
.cmp3 .tbc{font-weight:400}
@media (max-width:760px){
  .cmp3,.cmp3 tbody,.cmp3 tr,.cmp3 th,.cmp3 td{display:block;width:100%}
  .cmp3{border:0;background:none;border-radius:0}
  .cmp3 colgroup,.cmp3 thead{display:none}
  .cmp3 tr{margin-bottom:14px;background:#FFFFFF;border:1px solid var(--line);border-radius:6px;overflow:hidden}
  .cmp3 tbody th{padding:12px 16px;background:var(--forest);color:var(--ivory);font-size:15px;border:0}
  .cmp3 td{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:12px;padding:11px 16px;border-bottom:1px solid var(--line)}
  .cmp3 td:last-child{border-bottom:0}
  .cmp3 td::before{content:attr(data-col);font-size:12.5px;font-weight:600;color:var(--goldink)}
  .cmp3 tbody tr:last-child td{padding-top:11px;padding-bottom:11px;border-bottom:1px solid var(--line)}
  .cmp3 tbody tr:last-child td:last-child{border-bottom:0}
  .cmp3 tbody tr:last-child th{padding-top:12px;padding-bottom:12px;color:var(--ivory)}
}
/* Services: the client journey (understand, recommend, implement, stay alongside) */
.jr-ring{width:64px;height:64px;flex:none;display:block}
.jr-ring .t{fill:#FFFFFF;stroke:var(--line);stroke-width:1.5}
.jr-ring .a{fill:none;stroke:var(--goldink);stroke-width:2.2;stroke-linecap:round}
.jr-ring text{font:500 26px Literata,Georgia,serif;fill:var(--forest)}
.dark .jr-ring .t{fill:var(--forest);stroke:#1F4F45}
.dark .jr-ring .a{stroke:var(--gold)}
.dark .jr-ring text{fill:var(--gold)}
.jr-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;list-style:none;margin:18px 0 6px;padding:0;position:relative;max-width:980px}
.jr-rail::before{content:"";position:absolute;left:32px;right:32px;top:32px;height:1px;background:var(--sage)}
.jr-rail li{position:relative}
.jr-rail a{display:flex;flex-direction:column;gap:14px;text-decoration:none;color:var(--ink)}
.jr-rail .jr-ring{transition:transform .45s var(--ease)}
.jr-rail a:hover .jr-ring{transform:translateY(-3px)}
.jr-t{display:flex;flex-direction:column;gap:2px}
.jr-t b{font:500 21px/1.25 Literata,Georgia,serif;color:var(--forest);padding-bottom:3px;align-self:flex-start;background:linear-gradient(var(--goldink),var(--goldink)) no-repeat 0 100%/0% 1.5px;transition:background-size .5s var(--ease)}
.jr-rail a:hover .jr-t b{background-size:100% 1.5px}
.jr-t small{font-size:15px;color:var(--slate)}
.jr-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:72px;align-items:start}
.jr-head{display:flex;flex-direction:column;gap:18px}
.jr-head .jr-ring{margin-bottom:4px}
.jr-head h2{font-size:42px;line-height:1.14}
.jr-head p{font-size:17px;color:var(--slate);max-width:520px}
.jr-head .jr-pull{font:italic 400 21px/1.45 Literata,Georgia,serif;color:var(--forest);border-left:2px solid var(--gold);padding-left:18px;margin-top:6px}
.jr-body{padding-top:96px}
.jr-body .prods h4{font:500 21px/1.3 Literata,Georgia,serif;color:var(--forest);margin:0 0 14px}
.jr-note{margin:28px 0 0;padding:18px 22px;border:1px solid var(--line);border-radius:4px;background:#FFFFFF;font-size:16px;color:var(--slate)}
.band .jr-note{background:var(--mist)}
.jr-note b{color:var(--forest);font-weight:600}
.jr.dark .jr-head p{color:#C9D6D0}
.jr.dark .jr-head .jr-lead{font:400 24px/1.4 Literata,Georgia,serif;color:var(--ivory)}
.jr-claims{display:flex;flex-direction:column;gap:14px;padding:34px 34px 32px;background:var(--ivory);color:var(--ink);border-radius:4px;border-top:3px solid var(--gold)}
.jr-tag{align-self:flex-start;font:600 12px/1 'Albert Sans',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--goldink)}
.jr-claims h3{font-size:28px;line-height:1.2;color:var(--forest)}
.jr-claims h3 em{color:var(--goldink)}
.jr-claims p{font-size:17px;color:var(--slate)}
.jr-also{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.jr-also li{display:flex;flex-direction:column;gap:6px;border-top:1px solid #1F4F45;padding-top:18px}
.jr-also b{font:500 20px/1.3 Literata,Georgia,serif;color:var(--ivory)}
.jr-also span{font-size:15.5px;color:#AFC0B8}
.jr-paid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.jr-paid div{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:22px}
.jr-paid h3{font-size:22px}
.jr-paid p{font-size:16px;color:var(--slate)}
.jr-quote figure{margin:0 auto;max-width:860px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:22px}
.jr-quote blockquote{margin:0;font:400 28px/1.45 Literata,Georgia,serif;color:var(--forest);text-wrap:pretty}
.jr-quote figcaption{font:italic 400 19px/1.3 Literata,Georgia,serif;color:var(--goldink)}
.jr-quote figcaption::before{content:"";display:block;width:56px;height:1px;background:var(--gold);margin:0 auto 18px}
@media (max-width:1100px){
  .jr-split{gap:48px}
  .jr-body{padding-top:84px}
}
@media (max-width:960px){
  .jr-split{grid-template-columns:minmax(0,1fr);gap:36px}
  .jr-body{padding-top:0}
  .jr-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
  .jr-rail::before{display:none}
}
@media (max-width:760px){
  .jr-head h2{font-size:32px}
  .jr-rail{grid-template-columns:minmax(0,1fr);gap:0;margin-top:10px}
  .jr-rail::before{display:block;left:24px;right:auto;top:24px;bottom:24px;width:1px;height:auto}
  .jr-rail a{flex-direction:row;align-items:center;gap:18px;padding:8px 0}
  .jr-rail .jr-ring{width:48px;height:48px}
  .jr-t b{font-size:19px}
  .jr-claims{padding:26px 22px}
  .jr-claims h3{font-size:24px}
  .jr-also,.jr-paid{grid-template-columns:minmax(0,1fr)}
  .jr-quote blockquote{font-size:22px}
}
.howwe .jr-rail{margin-top:52px;max-width:none}
.howwe-paid{margin:44px 0 0;padding-top:22px;border-top:1px solid var(--line);font-size:16px;color:var(--slate);max-width:820px}
@media (max-width:760px){.howwe .jr-rail{margin-top:32px}.howwe-paid{margin-top:28px}}
/* About: Ezra's success quote as the page's headline */
.phero h1.ezquote{font-size:clamp(28px,2.9vw,40px);line-height:1.25;letter-spacing:-0.01em;max-width:760px;text-wrap:pretty}
/* FAQ: keep the rotated chevron inside the clipped row */
.faq summary::after{margin-right:6px}
/* footer credit: plain text, with The Orchestra's own wordmark that lights up on hover */
footer .credit{flex-basis:100%;margin:0;color:#5E7A70;font-size:12px;line-height:1.6}
footer .orchlink{display:inline-block;color:#8FA59C;vertical-align:baseline;transition:color .3s,transform .3s var(--ease)}
footer .orchlink .orch{display:inline-block;height:.86em;width:auto;overflow:visible;vertical-align:-.04em;margin-left:2px}
footer .orchlink:hover,footer .orchlink:focus-visible{color:#FFFFFF}
footer .orchlink:hover .orch,footer .orchlink:focus-visible .orch{filter:drop-shadow(.35px 0 0 currentColor) drop-shadow(-.35px 0 0 currentColor)}
/* dark sections: buttons, the journey rail, quotes and values on forest */
.dark .btn2{color:var(--ivory);border-color:var(--ivory);background-image:linear-gradient(var(--ivory),var(--ivory))}
.dark .btn2:hover{color:var(--forest)}
.dark .btn2 .ring circle{stroke:var(--gold)}
.dark .btn2:hover .ring circle{stroke:var(--goldink)}
.dark .sub2{color:#C9D6D0}
.dark .jr-rail::before{background:#1F4F45}
.dark .jr-t b{color:var(--ivory);background-image:linear-gradient(var(--gold),var(--gold))}
.dark .jr-t small{color:#AFC0B8}
.dark .howwe-paid{border-top-color:#1F4F45;color:#AFC0B8}
.dark .howwe-paid .lnk{color:var(--ivory);background-image:linear-gradient(var(--gold),var(--gold)),linear-gradient(rgba(243,241,234,.35),rgba(243,241,234,.35))}
.jr-quote.dark blockquote{color:var(--ivory)}
.jr-quote.dark figcaption{color:var(--gold)}
.dark .values li{color:var(--ivory);border-top-color:#1F4F45}
/* Services step four closes on Ezra's own words, inside the same dark section */
.jr-q{grid-column:1/-1;margin:24px 0 0;padding-top:64px;border-top:1px solid #1F4F45;display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}
.jr-q blockquote{margin:0 auto;max-width:860px;font:400 26px/1.5 Literata,Georgia,serif;color:var(--ivory);text-wrap:pretty}
.jr-q figcaption{font:italic 400 19px/1.3 Literata,Georgia,serif;color:var(--gold)}
.jr-q figcaption::before{content:"";display:block;width:56px;height:1px;background:var(--gold);margin:0 auto 18px}
@media (max-width:960px){.jr-q{margin-top:12px;padding-top:44px}}
@media (max-width:760px){.jr-q blockquote{font-size:21px}}
/* homepage: Ezra's vision opens the one-family example, as a statement in the site's own voice */
.vision{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:start;margin-top:88px;padding-top:64px;border-top:1px solid var(--sage)}
.vision-mark{width:56px;height:56px;margin-top:4px}
.vision-txt{display:flex;flex-direction:column;gap:14px}
.vision-txt p{margin:0;font:400 31px/1.32 Literata,Georgia,serif;color:var(--forest);max-width:900px;letter-spacing:-.005em;text-wrap:pretty}
.vision-txt em{color:var(--pine)}
.vision+.ba-top{margin-top:56px;padding-top:0;border-top:0}
@media (max-width:760px){.vision{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:64px;padding-top:44px}.vision-mark{display:none}.vision-txt p{font-size:23px}.vision+.ba-top{margin-top:40px}}
.legal .prose .updated{font-size:15px;color:var(--slate)}
/* contact form: optional detail when the situation is "Other" */
.sit-other{margin-top:16px;max-width:520px}
.sit-other[hidden]{display:none}
.field .opt{font-weight:400;color:var(--slate)}
/* Hero fit: Ezra's longer intro still has to sit on one screen. A wider text
   column takes the headline to three lines, the buttons sit side by side,
   and shorter screens get a tighter scale. The scene narrows to match. */
@media (min-width:1101px){
  .hero .wrap{grid-template-columns:minmax(0,1.25fr) minmax(0,500px);gap:40px;padding-top:32px}
  .hero-text{--scene-w:500px;gap:18px}
  .hero h1{font-size:clamp(40px,3.7vw,54px)}
  .hero-text>p{max-width:620px}
  .hero-text>p.sub{max-width:600px}
  .hero .ctas{gap:12px;margin-top:8px}
}
@media (min-width:961px) and (max-height:900px){
  .hero .wrap{padding-top:24px}
  .hero-text{gap:14px}
  .hero h1{font-size:clamp(36px,3.3vw,46px)}
  .hero-text>p{font-size:17px;line-height:1.55}
  .hero-text>p.sub{font-size:15.5px}
}
/* hero buttons never break their label across two lines */
.hero .ctas>a{white-space:nowrap}
/* בסייעתא דשמיא: small and quiet in the header's top corner */
.nav .bsd{position:absolute;top:3px;right:40px;font:400 11px/1 'Frank Ruhl BSD','Frank Ruhl Libre',serif;color:#8A9A94;letter-spacing:.02em;pointer-events:none;user-select:none}
@media (max-width:760px){.nav .bsd{right:20px;top:2px;font-size:10px}}
