/* Reference-inspired grainy mesh texture, with a quiet light surface for the copy. */
.hero{color:#152b1c;background-color:#eaf2db;background-image:linear-gradient(90deg,#f2f8e83d 0%,#f2f8e80a 48%,transparent 70%),url('/assets/hero-lime-grain.webp');background-size:cover;background-position:center;background-repeat:no-repeat}
.hero .hero-grid,.hero .hero-shade{display:none}
.hero h1{color:#152b1c}.hero h1 .accent-line{color:#365c27}
.hero .hero-bottom p{color:#2d402a}
.hero .button-light{background:#fafbf8;color:#193722;border:1px solid #19372260}
.hero .button-light>span{color:#152b1c;background:#b0ff00}
.hero .button-light:hover{background:#edf5e4;color:#193722}
.hero .reel-heading{color:#294626;font-weight:600}
.hero .hero-reel-video{border-color:#5b764c66;box-shadow:0 20px 55px #25482020}
.hero .hero-meta{color:#26401f}
.hero .motion-toggle{color:#193722;border-color:#5b764c80;background:#eff6e350}
.hero :is(a,button,video):focus-visible{outline:3px solid #193722;outline-offset:5px}
@media(max-width:760px){.hero{background-position:42% center;background-image:linear-gradient(180deg,#f2f8e838,transparent 70%),url('/assets/hero-lime-grain.webp')}}
/* Let the black navigation dissolve into the textured hero without a hard seam. */
.site-header{background:#111;border-bottom-color:transparent;box-shadow:none}
.hero:before{content:"";position:absolute;inset:0 0 auto;height:82px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#111 0,#17211980 7px,#243b2633 20px,#47633a0d 34px,transparent 52px),radial-gradient(ellipse at 88% 0,#11111133 0,#1e342314 30%,transparent 65%)}
@media(max-width:760px){.hero:before{height:50px;background:linear-gradient(180deg,#111 0,#1a2b1d70 6px,#35533424 17px,#526f3e08 27px,transparent 38px)}}

/* Carry the hero's pale lime into the introduction. */
.hero::after{content:"";position:absolute;inset:auto 0 0;height:110px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent,#e9f3d9)}
.hero+.ticker{color:#193722;background:linear-gradient(180deg,#e9f3d9 0%,#eef6e3 48%,#fafbf8 100%)}
@media(max-width:760px){.hero::after{height:80px}}