.button{justify-content:center;gap:.65rem;border:1px solid transparent;border-radius:2px;letter-spacing:.015em;transition:background-color .18s ease,border-color .18s ease,color .18s ease}
.button:hover{transform:none}
.button.secondary{border-color:var(--olive)}
.offer-panel [data-offer-buy]{justify-content:space-between}
.text-link,.journal-read,.soil-guide-process{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;transition:text-decoration-color .18s ease,color .18s ease}
.text-link:hover,.journal-read:hover,.soil-guide-process:hover{opacity:1;color:var(--olive);text-decoration-color:var(--brass)}
.offer-open-button{letter-spacing:.01em;text-underline-offset:5px}
.deal-label,.offer-panel-kicker{letter-spacing:.1em;font-weight:500}
.deal-saving>span{letter-spacing:.06em;font-weight:500}
.hero-description,.intro-body p,.preview-description{text-wrap:pretty}
.product-info .product-description ul{padding-left:1.2rem;margin:1rem 0}
.product-info .product-description li{margin:.45rem 0}
.button:focus-visible,.text-link:focus-visible,.journal-read:focus-visible{outline:2px solid var(--brass);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.button,.text-link,.journal-read,.soil-guide-process{transition:none}}

@media(max-width:900px){
 .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(88px,28%);gap:0 1rem;padding:1.8rem 6% 2rem;align-items:center}
 .hero-copy{display:contents}
 .hero-copy>*{grid-column:1/-1}
 .hero-copy>.eyebrow{grid-row:1;margin-bottom:.5rem}
 .hero h1{grid-column:1;grid-row:2;margin:.75rem 0 1rem;font-size:clamp(1.75rem,7.5vw,4rem);line-height:1.03;overflow-wrap:normal}
 .hero>.hero-image{display:block;grid-column:2;grid-row:2;position:relative;height:clamp(140px,38vw,210px);min-height:0;background:transparent;overflow:visible}
 .hero>.hero-image img{position:absolute;width:100%;height:100%;object-fit:contain;object-position:center}
 .hero>.hero-image figcaption{position:absolute;right:0;bottom:-.7rem;max-width:100%;font-size:.75rem;line-height:1.2;text-align:center;padding:0;background:var(--cream)}
 .hero .hero-description{margin:1.35rem 0;max-width:50ch}
 .hero .launch-offer{width:100%;margin-bottom:0}
 .hero .worm-scene{width:100%;margin-top:1.5rem}
}