@import url("./experience.css?v=animation-polish-20260925-2");

/* Reuse the v2 preview unchanged within the existing homepage section. */
.ne-landing-watering{background:#fff}
.ne-landing-watering .v4-section__head>div{max-width:760px}
.ne-landing-watering [data-ne-pending]:disabled{cursor:default}
/* The page already adds 104px (88px on compact nav) of scroll padding. */
body.noot-v4 main .ne-landing-watering #root-ecosystem-view{scroll-margin-top:-19px}
@media(max-width:900px){body.noot-v4 main .ne-landing-watering #root-ecosystem-view{scroll-margin-top:-9px}}
@media(min-width:761px) and (max-width:900px){body.noot-v4 main .ne-landing-watering #root-ecosystem-view{scroll-margin-top:-5px}}
html:has(#root-ecosystem-view:target){scroll-behavior:auto}

/* Keep the animation shortcut distinct from the surrounding nav row. */
body.noot-v4 .site-header .nav-animation-chip{isolation:isolate;display:inline-flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:6px;min-height:44px;padding:8px 10px;border:1px solid var(--v4-forest);border-radius:10px;background:var(--v4-forest);color:#fff;font-size:11px;font-weight:800;line-height:1.2;white-space:nowrap}
body.noot-v4 .desktop-nav .nav-animation-chip{position:relative}
body.noot-v4 .site-header .nav-animation-chip::before{content:"";position:absolute;z-index:-1;inset:-10px;padding:10px;border-radius:18px;background:linear-gradient(120deg,rgba(255,255,255,.95) 0%,rgba(220,247,228,.9) 34%,rgba(0,155,73,.66) 68%,rgba(255,255,255,.82) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none;animation:noot-nav-animation-pulse 2.4s ease-in-out infinite}
body.noot-v4 .site-header .nav-animation-chip>span{flex:0 0 auto;white-space:nowrap;line-height:1.2}
body.noot-v4 .site-header .nav-animation-chip::after{display:none}
body.noot-v4 .site-header .nav-animation-chip:hover,body.noot-v4 .site-header .nav-animation-chip:focus-visible,body.noot-v4 .site-header .nav-animation-chip[aria-current="location"]{border-color:var(--v4-green);background:var(--v4-forest);color:#fff}
body.noot-v4 .site-header .nav-animation-chip:focus-visible{outline:2px solid var(--v4-green);outline-offset:3px}
body.noot-v4 .site-header .nav-animation-chip svg{width:16px;height:16px;flex:0 0 16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:#fff}
body.noot-v4 .site-header .nav-animation-chip .nav-animation-chip__cube path{fill:none;stroke:currentColor;stroke-width:1.8}
body.noot-v4 .site-header .nav-animation-chip .nav-animation-chip__play{width:14px;height:14px;flex-basis:14px}
body.noot-v4 .site-header .nav-animation-chip .nav-animation-chip__play path{fill:currentColor;stroke:none}
@keyframes noot-nav-animation-pulse{0%,100%{opacity:.42;transform:scale(.985)}50%{opacity:.92;transform:scale(1)}}
@media(max-width:360px){body.noot-v4 .mobile-nav .nav-animation-chip{gap:4px;padding-inline:6px;font-size:10px}body.noot-v4 .mobile-nav .nav-animation-chip .nav-animation-chip__cube{width:14px;height:14px;flex-basis:14px}}
@media(prefers-reduced-motion:reduce){body.noot-v4 .site-header .nav-animation-chip::before{animation:none;opacity:.65;transform:none}}
