/* A quiet motion and depth layer. Content is visible without JavaScript. */
:root{--ease-out:cubic-bezier(.22,1,.36,1)}
header{transition:box-shadow .35s ease,background-color .35s ease}header.has-depth{box-shadow:0 5px 24px #102c250c;background:#f6f5eef5}
.button{transition:background-color .2s ease,box-shadow .25s ease,transform .25s var(--ease-out)}.button>span,.quiet-link>span,.guide-teasers b{transition:transform .3s var(--ease-out)}.button:active{transform:translateY(1px)}.button:focus-visible>span,.quiet-link:focus-visible>span{transform:translate(2px,-2px)}
@media(hover:hover) and (pointer:fine){.button:hover{box-shadow:0 7px 18px #102c2515}.button:hover>span,.quiet-link:hover>span,.guide-teasers>a:hover b{transform:translate(3px,-3px)}nav>a{position:relative}nav>a::after{content:"";position:absolute;bottom:4px;left:0;right:0;height:1px;background:var(--forest);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-out)}nav>a:hover::after{transform:scaleX(1)}.news-card img{transition:transform .65s var(--ease-out)}.news-image-link:hover img{transform:scale(1.035)}}
.hero-message{box-shadow:0 18px 40px #102c2526;border-top:1px solid #ffffff26}.hero-portrait{filter:drop-shadow(7px 10px 12px #102c250a)}
.depth-foliage{position:absolute;pointer-events:none;user-select:none;z-index:4;width:220px;height:auto;object-fit:contain;filter:drop-shadow(3px 8px 6px #102c2510)}.hero>.depth-foliage{right:-32px;bottom:-32px;width:245px;transform:rotate(-12deg)}
.life-collage::before{content:"";position:absolute;inset:18px -14px 78px 22px;background:#e2e7d6;transform:rotate(3deg);z-index:-1}.life-collage{isolation:isolate}.life-main{box-shadow:0 12px 30px #102c250d}.life-detail{box-shadow:0 12px 30px #102c2520}.coastal-scene{isolation:isolate}.coastal-scene::before{content:"";position:absolute;inset:28px -16px 70px 25px;border:1px solid #97aa8c;transform:rotate(3deg);z-index:-1}.scene-label{box-shadow:0 12px 28px #102c2518}.keys-cutout{filter:drop-shadow(5px 10px 8px #102c251a)}
.guide-hero figure{position:relative;isolation:isolate;margin:12px 12px 0 0}.guide-hero figure::before{content:"";position:absolute;inset:-13px 18px 44px -14px;background:#e2e7d6;transform:rotate(-3deg);z-index:-1}.guide-hero figure>img:not(.depth-foliage){box-shadow:0 12px 30px #102c2512}.guide-hero figure>.depth-foliage{width:175px;height:auto;right:-35px;bottom:18px;transform:rotate(9deg)}.guide-hero figcaption{position:relative;z-index:5;padding-right:100px}.news-image-link{box-shadow:0 8px 22px #102c2508}.article-cover{position:relative}.article-cover::before{content:"";position:absolute;inset:12px -10px 38px 12px;border:1px solid #c3cdb7;z-index:-1;transform:rotate(.65deg)}
.questions-intro>img{box-shadow:10px 12px 0 #e2e7d6}.reading-aside{background:linear-gradient(130deg,#ecefe4,transparent 80%);padding:25px 22px 20px;border-top:2px solid #8b9d76}.reading-aside .eyebrow{font-size:10px}.guide-teasers>a{transition:border-color .25s ease}.guide-teasers>a:focus-visible{background:#edf0e5}.guide-teasers>a:hover{border-color:#8caa56}
@keyframes settle-in{from{opacity:.25;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes photo-in{from{opacity:.4;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes dialog-in{from{opacity:.5;translate:0 10px;scale:.985}to{opacity:1;translate:0 0;scale:1}}
@keyframes veil-in{from{opacity:0}to{opacity:1}}
.motion-enter{animation:settle-in .7s var(--ease-out) both;animation-delay:var(--reveal-delay,0ms)}
.hero-portrait,.hero-message{animation:photo-in .85s var(--ease-out) both}.hero-message{animation-duration:.65s}
dialog[open]{animation:dialog-in .28s var(--ease-out) both}dialog[open]::backdrop{animation:veil-in .22s ease both}
summary b{transition:transform .25s var(--ease-out)}
@media(max-width:900px){nav.open{animation:photo-in .25s var(--ease-out) both}}
@media(max-width:650px){.hero>.depth-foliage{width:150px;right:-35px;bottom:-12px}.life-collage::before{inset:15px -7px 73px 30px}.coastal-scene::before{inset:20px 5px 65px 20px}.guide-hero figure{margin:10px 7px 0}.guide-hero figure::before{inset:-10px 12px 40px -10px}.guide-hero figure>.depth-foliage{width:125px;right:-22px;bottom:21px}.guide-hero figcaption{padding-right:55px}.article-cover::before{inset:8px -5px 38px 7px}.reading-aside{padding-inline:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motion-enter{opacity:1!important;transform:none!important}.hero-portrait,.hero-message,dialog[open],nav.open{translate:none!important;scale:none!important;opacity:1!important}}