/* WeDelta / Living nature motion system — progressive enhancement only.
   Keeps content legible when JavaScript is disabled and honors reduced motion. */
:root{--motion-ease:cubic-bezier(.2,.8,.2,1);--motion-spring:cubic-bezier(.2,1.22,.32,1)}
.reading-progress{position:fixed;top:0;left:0;right:0;height:4px;z-index:140;pointer-events:none;background:linear-gradient(90deg,#7faf7c,#b8ca83,#3c8767);transform:scaleX(var(--read-progress,0));transform-origin:left center;box-shadow:0 0 15px rgba(110,159,103,.45)}
.site-header{transition:box-shadow .45s ease,background-color .45s ease}.site-header.is-scrolled{box-shadow:0 12px 32px rgba(28,76,50,.09);background:rgba(250,251,247,.97)}
.page-wipe{position:fixed;inset:0;z-index:180;background:linear-gradient(125deg,#eff5e6 15%,#dcebcf 65%,#bed6b5);clip-path:inset(100% 0 0 0);transition:clip-path .29s var(--motion-ease);pointer-events:none}.page-exit .page-wipe{clip-path:inset(0 0 0 0)}
.animated-hero{isolation:isolate}.animated-hero>.container{position:relative;z-index:2}.animated-hero::before{content:"";position:absolute;inset:-20%;z-index:0;pointer-events:none;background:radial-gradient(ellipse 28% 30% at var(--hero-x,68%) var(--hero-y,48%),rgba(195,227,172,.38),transparent 80%);opacity:.74;transition:opacity .2s}
body[data-page="about"] .page-hero{background:linear-gradient(130deg,#f8fcf4 0%,#ebf3e4 76%,#f4f8ed 100%)}
body[data-page="services"] .page-hero{background:linear-gradient(115deg,#fafbf6,#eaf5ed)}
body[data-page="mission"] .page-hero{background:linear-gradient(125deg,#f8fbf0,#e6f3df 70%,#faf9ed)}
body[data-page="work"] .page-hero{background:linear-gradient(125deg,#fafbf7,#eaf2e6 66%,#f6f0e8)}
body[data-page="contact"] .page-hero{background:linear-gradient(120deg,#f8faf4,#e8f4eb 74%,#eff4df)}
.floating-botanicals{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}.botanical{position:absolute;left:var(--x);top:var(--y);color:#6d9f74;opacity:.26;font-size:var(--sz,25px);line-height:1;filter:blur(var(--blur,0px));animation:drift-gentle var(--dur,11s) ease-in-out infinite alternate;animation-delay:var(--delay,0s);will-change:transform}.b-1{--x:5%;--y:19%;--sz:34px;--dur:9s}.b-2{--x:92%;--y:27%;--sz:32px;--dur:11s;--delay:-3s}.b-3{--x:80%;--y:76%;--sz:52px;--dur:15s;--delay:-5s;--blur:1px}.b-4{--x:17%;--y:85%;--sz:31px;--dur:13s;--delay:-6s}.b-5{--x:61%;--y:12%;--sz:24px;--dur:12s;--delay:-2s}.b-6{--x:44%;--y:69%;--sz:15px;--dur:8s;--delay:-4s}.b-7{--x:98%;--y:6%;--sz:42px;--dur:14s;--delay:-7s}
@keyframes drift-gentle{0%{transform:translate3d(-8px,10px,0) rotate(-24deg) scale(.82);opacity:.09}50%{opacity:.31}100%{transform:translate3d(25px,-25px,0) rotate(21deg) scale(1.18);opacity:.22}}
.animated-hero .eyebrow{animation:float-up .8s .1s both}.animated-hero h1{animation:float-up 1.05s .2s var(--motion-ease) both}.animated-hero p{animation:float-up .9s .46s var(--motion-ease) both}.animated-hero .hero-buttons{animation:float-up .9s .62s var(--motion-ease) both}.hero-art img{animation:landscape-breathe 10s ease-in-out infinite;transform-origin:50% 65%}.hero-art{transform:translate3d(var(--parallax-x,0px),var(--parallax-y,0px),0);transition:transform .4s var(--motion-ease)}
@keyframes float-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes landscape-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.026)}}
.hero-underline{height:25px;width:clamp(140px,27vw,290px);margin:-12px 0 21px}.hero-underline svg{width:100%;height:100%;overflow:visible}.hero-underline path{stroke-dasharray:340;stroke-dashoffset:340;animation:line-draw 1.7s .65s var(--motion-ease) forwards}.hero-underline circle{transform-origin:center;animation:pop-in .7s 1.6s both}
@keyframes line-draw{to{stroke-dashoffset:0}}@keyframes pop-in{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
.scroll-cue{position:absolute;bottom:19px;left:50%;z-index:4;transform:translateX(-50%);display:flex;flex-direction:column;gap:3px;align-items:center;color:#466e55;font-size:.61rem;letter-spacing:.19em;font-weight:800;opacity:.77;white-space:nowrap;transition:opacity .25s}.scroll-cue:hover{opacity:1}.scroll-cue-arrow{font-size:22px;line-height:1.4;animation:scroll-cue-bounce 2.4s ease-in-out infinite}
@keyframes scroll-cue-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
.hero{padding-bottom:115px}.page-hero{position:relative;padding-bottom:104px}
/* Intersection reveal: existing observer still controls .visible; add rhythm and variety. */
.reveal{transition-duration:.85s;transition-timing-function:var(--motion-ease);transition-delay:var(--stagger,0ms)}
.reveal:not(.visible){filter:blur(3px);transform:translate3d(0,26px,0) scale(.988)}.reveal.visible{filter:none}
.reveal.reveal-left:not(.visible){transform:translate3d(-34px,12px,0)}.reveal.reveal-right:not(.visible){transform:translate3d(34px,12px,0)}
.kinetic-heading .display-serif{background-image:linear-gradient(90deg,#245e48,#56936a,#245e48);background-size:220% auto;background-clip:text;-webkit-background-clip:text;color:transparent;animation:heading-breeze 9s linear infinite}
@keyframes heading-breeze{to{background-position:220% center}}
/* Hover moments are intentionally delicate. */
.btn{position:relative;overflow:hidden;isolation:isolate}.btn>.ripple-burst{position:absolute;border-radius:50%;background:rgba(255,255,255,.43);pointer-events:none;transform:translate(-50%,-50%) scale(0);animation:soft-ripple .65s ease-out forwards}.btn-secondary>.ripple-burst,.btn-lime>.ripple-burst{background:rgba(85,148,92,.26)}@keyframes soft-ripple{to{opacity:0;transform:translate(-50%,-50%) scale(4.5)}}
.btn .arrow,.card-link{transition:transform .25s var(--motion-spring),color .25s}.btn:hover .arrow{transform:translate(3px,-3px)}.card-link:hover{color:#4e956a}
.micro-motion{--tilt-x:0deg;--tilt-y:0deg;transition:transform .36s var(--motion-ease),border-color .34s,box-shadow .36s}
@media(hover:hover) and (pointer:fine){.micro-motion.visible:hover,.micro-motion:hover:not(.reveal){transform:perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(-8px);border-color:#accfa7;box-shadow:0 24px 55px rgba(23,71,55,.13)}.micro-motion:focus-within{box-shadow:0 0 0 3px rgba(128,173,122,.25)}}
.hover-glow::before{content:"";position:absolute;inset:0;background:radial-gradient(230px circle at var(--glow-x,50%) var(--glow-y,50%),rgba(212,235,199,.50),transparent 80%);opacity:0;pointer-events:none;z-index:0;transition:opacity .35s}.hover-glow:hover::before{opacity:1}.hover-glow>*{position:relative;z-index:1}
.icon-box{transition:transform .42s var(--motion-spring),background .3s}.micro-motion:hover .icon-box{transform:rotate(-13deg) scale(1.14);background:#dfefd7}
/* Connected steps, animated when observed (no invented metrics). */
.steps{position:relative}.steps::before{content:"";height:2px;background:linear-gradient(90deg,#bdd7a9,#719c76,#d0e3c6);position:absolute;top:31px;left:11%;right:11%;transform:scaleX(0);transform-origin:left;transition:transform 1.4s .16s var(--motion-ease)}.steps.is-inview::before{transform:scaleX(1)}.step-number{transition:transform .45s var(--motion-spring)}.step:hover .step-number{transform:rotate(-7deg) scale(1.12)}
/* Home: subtle living illustration and orbit. */
.garden-graphic .orbit-circle:first-child{border-style:dashed;animation:orbit-turn 28s linear infinite}.garden-graphic .orbit-circle:nth-child(2){animation:orbit-turn 38s linear infinite reverse}.garden-graphic .orbit-pill.one{animation:pill-drift 6.5s ease-in-out infinite}.garden-graphic .orbit-pill.two{animation:pill-drift 7.3s -2s ease-in-out infinite}
@keyframes orbit-turn{to{transform:rotate(360deg)}}@keyframes pill-drift{0%,100%{translate:0 0}50%{translate:0 -10px}}
/* About: a growing thread connects the process. */
.growth-track{position:relative;margin-top:55px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:42px 20px 16px;border-radius:24px;background:linear-gradient(105deg,#f0f7e9,#f9fbf5);border:1px solid #d4e3cf}.growth-line{position:absolute;top:71px;left:16.66%;right:16.66%;height:3px;background:#d4e5cf;border-radius:8px}.growth-line-fill{display:block;width:0;height:100%;border-radius:8px;background:linear-gradient(90deg,#5b9270,#bed59d);transition:width 1.8s .35s var(--motion-ease)}.growth-track.visible .growth-line-fill{width:100%}.growth-node{position:relative;display:grid;text-align:center;justify-items:center;gap:7px}.growth-seed{display:grid;place-items:center;position:relative;z-index:1;width:61px;height:61px;background:#fff;border:2px solid #b2d0ab;color:#4f8767;border-radius:50%;font-size:29px;box-shadow:0 8px 25px rgba(41,90,47,.1);transition:transform .4s var(--motion-spring)}.growth-node:hover .growth-seed{transform:scale(1.17) rotate(22deg)}.growth-node strong{font-size:1.1rem;color:var(--forest)}.growth-node small{color:var(--muted);font-size:.8rem}
/* Services + Work: animated filtering and item discovery. */
.filter{position:relative;overflow:hidden;transition:background .3s,border-color .3s,color .3s,transform .3s var(--motion-spring),box-shadow .3s}.filter:hover{transform:translateY(-3px)}.filter[aria-pressed="true"]{box-shadow:0 7px 19px rgba(23,71,55,.17)}.filter-info{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:-12px 0 26px;color:#60806a;font-size:.81rem;font-weight:700}.filter-hint{opacity:.7}.filter-item.filter-arrive{animation:card-arrive .55s var(--motion-spring) both;animation-delay:var(--item-delay,0ms)}@keyframes card-arrive{from{opacity:0;transform:translateY(22px) scale(.965)}to{opacity:1;transform:translateY(0) scale(1)}}
.faq-list details[open] p{animation:details-fade .34s ease both}@keyframes details-fade{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.faq-list summary:after{transition:transform .3s ease}.faq-list details[open] summary:after{transform:rotate(180deg)}
/* Mission: an organic hand-drawn vine grows across principles. */
.mission-bloom{max-width:820px;margin:28px auto 0;opacity:.85}.mission-bloom svg{width:100%;overflow:visible}.mission-stem{stroke:#8fad86;stroke-width:3.3;fill:none;stroke-linecap:round;stroke-dasharray:850;stroke-dashoffset:850;transition:stroke-dashoffset 2.2s .2s ease}.mission-bloom.visible .mission-stem{stroke-dashoffset:0}.mission-leaf{stroke:#91b18c;stroke-width:2.2;fill:#dceacb;opacity:0;transform:scale(.65);transform-origin:center;transition:opacity .6s 1s,transform .8s 1s var(--motion-spring)}.mission-bloom.visible .mission-leaf{opacity:1;transform:scale(1)}.number-card .number{transition:transform .4s var(--motion-spring),color .4s}.number-card:hover .number{transform:translateY(-6px);color:#397d57}
/* Work: concept icons and circular outlines gently come alive. */
.work-art::before{border-style:dashed;animation:orbit-turn 30s linear infinite}.work-art::after{animation:orbit-turn 23s linear infinite reverse}.work-art .work-icon{animation:project-float 7s ease-in-out infinite;transition:background .3s,border-radius .35s var(--motion-spring)}.work-card:hover .work-icon{border-radius:43% 30% 45% 32%;background:#f6fcf1}@keyframes project-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-9px) rotate(4deg)}}
.work-card details[open] p{animation:details-fade .4s both}.work-card details summary{transition:color .2s}.work-card details summary:hover{color:#4e9672}
/* Contact: a real (not fabricated) form-completion indicator and focus glow. */
.contact-form{position:relative;overflow:hidden}.contact-form::before{content:"";position:absolute;top:-130px;right:-130px;width:300px;height:300px;background:radial-gradient(circle,rgba(220,239,211,.8),transparent 67%);pointer-events:none}.contact-form>*{position:relative}.form-journey{margin:0 0 32px}.form-journey-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.77rem;font-weight:750;color:#587863;margin-bottom:9px}.journey-label span{display:inline-block;color:#77a479;animation:tiny-twinkle 4s ease-in-out infinite}@keyframes tiny-twinkle{50%{transform:scale(1.3) rotate(28deg)}}.form-journey-track{height:8px;border-radius:10px;background:#e7f0e3;overflow:hidden}.form-journey-fill{display:block;height:100%;width:0;background:linear-gradient(90deg,#7ba57d,#b7cc92);border-radius:10px;transition:width .6s var(--motion-ease)}.field{transition:transform .3s var(--motion-ease)}.field:focus-within{transform:translateY(-2px)}.field:focus-within label{color:#26804f}.field input,.field select,.field textarea{transition:box-shadow .3s,border-color .3s,background-color .3s}.field:focus-within input,.field:focus-within select,.field:focus-within textarea{background:#fff}.aside-panel{position:relative;overflow:hidden}.aside-panel::before{content:"✳";position:absolute;right:-12px;bottom:-90px;font-size:280px;color:rgba(123,172,115,.1);line-height:1;pointer-events:none;animation:orbit-turn 70s linear infinite}.aside-panel>*{position:relative}
/* Breakpoint protection. */
@media(max-width:820px){.floating-botanicals{opacity:.60}.scroll-cue{bottom:10px}.steps::before{display:none}.hero{padding-bottom:92px}.page-hero{padding-bottom:83px}}
@media(max-width:600px){.botanical{font-size:calc(var(--sz,25px) * .68)}.b-3,.b-7{display:none}.growth-track{gap:2px;padding:28px 8px}.growth-line{top:53px}.growth-seed{width:48px;height:48px;font-size:23px}.growth-node small{font-size:.69rem}.growth-node strong{font-size:.94rem}.filter-info{font-size:.76rem}.filter-hint{display:none}.scroll-cue{font-size:.56rem}.page-hero{padding-bottom:78px}}
@media(prefers-reduced-motion:reduce){.reading-progress{transition:none}.page-wipe,.floating-botanicals,.scroll-cue-arrow,.hero-art img,.animated-hero .eyebrow,.animated-hero h1,.animated-hero p,.animated-hero .hero-buttons,.hero-underline path,.hero-underline circle,.work-art .work-icon,.work-art::before,.work-art::after,.garden-graphic .orbit-circle,.garden-graphic .orbit-pill,.kinetic-heading .display-serif,.journey-label span,.aside-panel::before{animation:none!important}.page-wipe{display:none}.hero-underline path{stroke-dashoffset:0}.hero-underline circle{opacity:1;transform:none}.mission-stem{stroke-dashoffset:0}.mission-leaf{opacity:1;transform:none}.growth-line-fill{width:100%}.reveal:not(.visible),.reveal.reveal-left:not(.visible),.reveal.reveal-right:not(.visible){filter:none!important;opacity:1!important;transform:none!important}.filter-item.filter-arrive{animation:none}.btn>.ripple-burst{display:none}.micro-motion,.hero-art{transform:none!important}.animated-hero::before{transition:none}*{transition-duration:.01ms!important;animation-duration:.01ms!important}}
/* Avoid off-canvas reveal transforms producing horizontal scroll on phones. */
@media(max-width:820px){.reveal.reveal-left:not(.visible),.reveal.reveal-right:not(.visible){transform:translate3d(0,22px,0)}}