.home-spice-benefits { color-scheme: light; padding: clamp(40px, 6vw, 80px) 5.4%; color: var(--green); background: #eef1e7; border-block: 1px solid #d4dcc8; }
.home-benefits-inner { max-width: 1280px; margin-inline: auto; }
.home-benefits-heading { max-width: 720px; margin-bottom: 32px; }
.home-benefits-heading h2 { margin: 0; font: 700 var(--text-section)/1.2 var(--font-display); }
.home-benefits-heading h2 em { color: #9a6c2c; font-style: normal; }
.home-benefits-heading > p:last-child { margin: 20px 0 0; color: #555e50; line-height: 1.8; }
.home-benefits-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; padding: 0; margin: 0; list-style: none; }
.home-benefits-grid li { min-width: 0; }
.home-benefit-card { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid #ded5c3; border-radius: 16px; background: #fffdf8; transition: transform 180ms, box-shadow 180ms; }
.home-benefit-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px #102b2314; }
.home-benefit-card:focus-visible { outline-color: #86602b; outline-offset: 4px; }
.home-benefit-card img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.home-benefit-copy { display: flex; flex-direction: column; flex: 1; padding: 20px; }
.home-benefit-copy .home-spice-local { margin: 0 0 7px; color: #86602b; font-size: 12px; font-weight: 700; letter-spacing: 1px; }
.home-benefit-copy h3 { margin: 0; font: 700 25px/1.2 var(--font-display); }
.home-benefit-copy > p:not(.home-spice-local) { margin: 14px 0 20px; color: #555e50; font-size: 14px; line-height: 1.75; }
.home-benefit-more { display: flex; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 12px; border-top: 1px solid #ded5c3; color: #765323; font-size: 13px; font-weight: 700; }
.home-benefits-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; margin-top: 32px; }
.home-benefits-footer p { margin: 0; color: #555e50; font-size: 15px; }
@media (max-width: 1100px) { .home-benefits-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .home-spice-benefits { padding: 40px 7%; }.home-benefits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }.home-benefit-copy { padding: 16px; } }
@media (max-width: 440px) { .home-benefits-grid { grid-template-columns: minmax(0, 1fr); }.home-benefit-card img { aspect-ratio: 4 / 3; } }