
.portfolio-redesign .page .grass-divider{width:100%;max-width:100%;margin:52px 0 0;transform:none;padding-bottom:8px}
.portfolio-redesign footer.contact-section{padding-bottom:0;position:relative}
.portfolio-redesign footer.contact-section .footer-bottom{border-bottom:0;padding-bottom:0}
.portfolio-redesign .grass-surface{height:106px}
.portfolio-redesign .grass-divider>span{position:absolute;top:0;left:0;right:0;opacity:0;transition:opacity .25s;font-size:12px}
.portfolio-redesign .grass-divider:hover>span,.portfolio-redesign .grass-divider:focus-within>span{opacity:1}
.footer-gradient{height:130px;margin-top:-32px}
.contact-section:before{content:'';position:absolute;z-index:-1;pointer-events:none;inset:60px -120px -100px;background:radial-gradient(ellipse at 50% 100%,#cadfba70,transparent 70%)}
:root[data-theme=dark] .contact-section:before{background:radial-gradient(ellipse at 50% 100%,#42694750,transparent 70%)}
.portfolio-redesign .intro{margin-bottom:0}


/* Root the taller grass at the final footer edge. */
.portfolio-redesign .page{padding-bottom:0}
.portfolio-redesign .page .grass-divider{margin-top:56px;padding-bottom:0;overflow:hidden}
.portfolio-redesign .grass-surface{height:180px}
.portfolio-redesign .grass-surface svg{height:180px}
.footer-gradient{display:none}
.contact-section:before{inset:auto;bottom:0;left:calc(50% - var(--grass-viewport,100vw)/2);width:var(--grass-viewport,100vw);height:340px;background:linear-gradient(180deg,transparent,#edf4e955 40%,#cbdcbb99)}
:root[data-theme=dark] .contact-section:before{background:linear-gradient(180deg,transparent,#18261e55 40%,#2d483399)}
@media(max-width:700px){.portfolio-redesign .grass-surface,.portfolio-redesign .grass-surface svg{height:150px}}


/* The field reaches both viewport edges; glow stays behind the contact text. */
.portfolio-redesign .page .grass-divider{width:var(--grass-viewport,100vw);max-width:none;margin-left:calc(50% - var(--grass-viewport,100vw)/2);overflow:visible}
.portfolio-redesign .grass-surface{overflow:hidden}
.portfolio-redesign .grass-surface svg{width:calc(100% + 32px);max-width:none;margin-left:-16px;mask-image:none}
.firefly-field{position:absolute;inset:auto 0 0;height:330px;overflow:hidden;pointer-events:none;z-index:2}
.firefly{position:absolute;bottom:65px;left:var(--start);width:4px;height:4px;border-radius:50%;background:#fff2a1;box-shadow:0 0 5px 2px #e5ed8f99,0 0 16px 5px #badb6f55;opacity:0;animation:firefly-rise var(--flight) ease-out forwards}
.firefly:after{content:'';position:absolute;inset:-3px;border-radius:50%;background:#eef2a244;animation:firefly-glow .9s ease-in-out infinite alternate}
@keyframes firefly-rise{0%{opacity:.25;transform:translate(0,0) scale(.5)}8%{opacity:.95}35%{transform:translate(var(--drift-a),-80px)}65%{opacity:.8;transform:translate(var(--drift-b),-150px)}85%{opacity:.6}100%{opacity:0;transform:translate(var(--drift-a),-260px) scale(.65)}}
@keyframes firefly-glow{to{opacity:.25;transform:scale(.7)}}
@media(prefers-reduced-motion:reduce){.firefly{animation:firefly-fade 2s ease-out forwards}.firefly:after{animation:none}@keyframes firefly-fade{20%,65%{opacity:.8}100%{opacity:0}}}


.butterfly{position:absolute;bottom:100px;left:var(--start);width:22px;height:20px;opacity:0;animation:butterfly-flight var(--flight) ease-in-out forwards}
.butterfly svg{display:block;width:100%;height:100%;overflow:visible}
.butterfly-wing{fill:var(--wing-color);stroke:#fff9;stroke-width:.65;transform-origin:16px 14px;animation:butterfly-flap var(--flap) ease-in-out infinite alternate}
.butterfly .right-wing{animation-delay:-.08s}
.butterfly-body{fill:none;stroke:#5b5d53;stroke-width:1.2;stroke-linecap:round}
@keyframes butterfly-flap{from{transform:scaleX(1)}to{transform:scaleX(.22)}}
@keyframes butterfly-flight{0%{opacity:.5;transform:translate(0,0) rotate(-9deg)}8%{opacity:1}30%{transform:translate(var(--drift-a),-90px) rotate(12deg)}55%{transform:translate(var(--drift-b),-145px) rotate(-10deg)}80%{opacity:1;transform:translate(var(--drift-a),-205px) rotate(8deg)}100%{opacity:0;transform:translate(var(--drift-b),-270px) rotate(-6deg)}}
@media(prefers-reduced-motion:reduce){.butterfly{animation:firefly-fade 2s ease-out forwards}.butterfly-wing{animation:none}}


.butterfly{width:32px;height:28px}
.butterfly-wing{stroke:none;fill:none;transform-origin:16px 14px;animation:butterfly-flap var(--flap) cubic-bezier(.45,0,.55,1) infinite alternate}
.butterfly .right-wing{animation-delay:0s}
.wing-outline{fill:#343b35}
.wing-fill{fill:var(--wing-color)}
.wing-veins{fill:none;stroke:#343b35;stroke-width:1;stroke-linecap:square}
.wing-specks{fill:#fff5ce}
@keyframes butterfly-flap{0%{transform:scaleX(1)}100%{transform:scaleX(.12)}}
@media(prefers-reduced-motion:reduce){.butterfly-wing{animation:none}}


/* A quiet footer caption and a document-positioned return link. */
.portfolio-redesign .grass-divider>span{opacity:1;font-size:12px;line-height:28px}
.portfolio-redesign .page .grass-divider>.footer-back-top{position:absolute;right:40px;top:0;z-index:3;font-size:13px;line-height:28px;color:var(--muted)}
.firefly-field{height:650px;overflow:hidden}
@keyframes butterfly-flight{
  0%{opacity:.2;transform:translate(0,0) rotate(0deg)}
  12%{opacity:1}
  22%{transform:translate(var(--x1),var(--y1)) rotate(var(--bank))}
  42%{opacity:1;transform:translate(var(--x2),var(--y2)) rotate(calc(var(--bank)*-.6))}
  62%{opacity:.75;transform:translate(var(--x3),var(--y3)) rotate(calc(var(--bank)*.45))}
  82%{opacity:.25;transform:translate(var(--x4),var(--y4)) rotate(calc(var(--bank)*-.3))}
  96%,100%{opacity:0;transform:translate(var(--end-x),var(--end-y)) rotate(var(--bank))}
}
@media(max-width:700px){.portfolio-redesign .page .grass-divider>.footer-back-top{right:20px;font-size:12px}}
