/* Sustainability page: shared header and footer retain their existing styles. */
.sustainability-page { --sus-green: #174B35; --sus-ivory: #F5F1E8; --sus-sage: #B6CBAF; --sus-charcoal: #202722; background: var(--sus-ivory); color: var(--sus-charcoal); }
.sus-container { width: min(1320px, calc(100% - 96px)); margin-inline: auto; }
.sustainability-page main h1, .sustainability-page main h2, .sustainability-page main h3 { margin: 0; text-transform: none; letter-spacing: -.04em; }
.sustainability-page main h1, .sustainability-page main h2 { color: var(--sus-green); font-family: Georgia, serif; font-weight: 700; }
.sustainability-page main h1 { font-size: clamp(42px, 4.55vw, 68px); line-height: 1.1; }
.sustainability-page main h2 { font-size: clamp(34px, 3.5vw, 49px); line-height: 1.15; }
.sustainability-page main h3 { font-size: 20px; font-weight: 700; line-height: 1.35; letter-spacing: -.025em; color: var(--sus-green); }
.sustainability-page main em { font-family: Georgia, serif; color: #111111; font-weight: 700; letter-spacing: inherit; }
.sustainability-page main p { font-size: 15px; line-height: 1.85; color: #111111; }
.sustainability-page main .sus-kicker { margin: 0 0 24px; color: var(--sus-green); font-size: 11px; line-height: 1.6; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.sus-section .sus-kicker { display: inline-block; padding: 7px 12px; border-radius: 4px; background: #e7eedf; }
.sus-section h2::after { content: ''; display: block; width: 52px; height: 3px; margin-top: 20px; background: var(--sus-green); }
.sus-circular .sus-kicker { background: #2b5d45; }
.sus-circular h2::after { background: var(--sus-sage); }
.sus-cta h2::after { margin-inline: auto; }
.sus-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 65px; padding-block: 64px 70px; }
.sus-hero-copy { animation: sus-enter .5s ease-out both; }
.sus-hero-copy .sus-hero-line { margin-block: 28px 16px; color: var(--sus-green); font-weight: 600; font-size: 17px; line-height: 1.6; }
.sus-hero-copy > p:not(.sus-kicker) { max-width: 510px; }
.sus-hero-photo { position: relative; margin: 0; min-width: 0; height: 550px; border-radius: 12px 90px 12px 12px; overflow: hidden; }
.sus-hero-photo img { height: 100%; width: 100%; object-fit: cover; object-position: 62% center; }
.sus-hero-photo figcaption { position: absolute; inset: auto 0 0; padding: 55px 26px 24px; color: #fff; font-size: 12px; background: linear-gradient(transparent, rgb(10 33 23 / 80%)); }
.sus-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.sus-button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 16px; padding: 14px 20px; color: white; background: var(--sus-green); border: 1px solid var(--sus-green); border-radius: 5px; font-size: 13px; line-height: 1.4; transition: background .2s, transform .2s; text-align: center; }
.sus-button:hover { background: #103b28; transform: translateY(-2px); }
.sus-button-outline { background: transparent; color: var(--sus-green); }
.sus-button-outline:hover { background: #e7ecdf; }
.sustainability-page main a:focus-visible { outline: 2px solid var(--sus-green); outline-offset: 5px; }
.sus-section-nav { border-block: 1px solid #dce2d5; background: #edf0e6; }
.sus-section-nav > div { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 70px; padding-block: 15px; }
.sus-section-nav a { min-height: 44px; display: inline-flex; align-items: center; font-size: 13px; color: var(--sus-green); }
.sus-section-nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.sus-section { padding-block: 90px; }
.sus-heading-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 85px; align-items: start; }
.sus-copy p { margin: 0 0 18px; }
.sus-environment, .sus-governance { background: white; }
.sus-subheading { margin-block: 50px 22px; }
.sus-subheading p { margin: 10px 0 0; }
.sus-targets { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.sus-target { padding: 32px; border: 1px solid #d7e2d2; border-radius: 10px; background: #f1f5ed; }
.sus-target-top { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; margin-bottom: 20px; }
.sus-target-top strong { font: 500 68px/1 Manrope, sans-serif; letter-spacing: -.06em; color: var(--sus-green); }
.sus-target-top span { padding: 6px 10px; border: 1px solid #bacbb3; border-radius: 4px; font-size: 11px; color: var(--sus-green); }
.sus-target p { margin-block: 14px 22px; }
.sus-target-note { padding-top: 16px; border-top: 1px solid #d0ddc9; color: #111111; font-size: 11px; line-height: 1.7; }
.sustainability-page main .sus-grid-heading { margin-block: 44px 22px; }
.sus-priority-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.sus-card { padding: 24px 20px; border: 1px solid #dfe6db; border-radius: 8px; background: white; min-width: 0; transition: transform .2s, box-shadow .2s, border-color .2s; }
.sus-card:hover { transform: translateY(-4px); box-shadow: 0 10px 25px rgb(23 75 53 / 7%); border-color: #b5c9a9; }
.sus-icon { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; background: #eef3e9; color: var(--sus-green); margin-bottom: 22px; flex-shrink: 0; }
.sus-icon svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }
.sustainability-page main .sus-card h3 { font-size: 17px; }
.sustainability-page main .sus-card p { margin: 12px 0 0; font-size: 13px; line-height: 1.8; }
.sus-social-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 85px; align-items: center; }
.sus-social-layout .sus-copy { margin-top: 28px; }
.sus-social-photo { margin: 0; }
.sus-social-photo img { width: 100%; height: 360px; object-fit: cover; border-radius: 12px; }
.sus-social-photo figcaption { margin-top: 12px; color: #111111; font-size: 11px; line-height: 1.7; }
.sus-social-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.sus-social-closing { padding: 24px 0 0; margin: 24px 0 0; border-top: 1px solid #d4dcce; }
.sus-transparency { display: flex; align-items: center; gap: 22px; margin-top: 30px; padding: 26px 30px; background: #edf3e7; border-left: 3px solid var(--sus-green); border-radius: 0 8px 8px 0; }
.sus-transparency .sus-icon { margin: 0; background: white; }
.sus-transparency p { margin: 0; max-width: 950px; }
.sus-circular { background: var(--sus-green); color: white; }
.sus-circular-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 85px; align-items: center; }
.sus-circular h2, .sus-circular .sus-kicker { color: white !important; }
.sus-circular h2 em { color: var(--sus-sage); }
.sus-circular p { color: #111111 !important; }
.sus-circular h2 + p { margin-top: 26px; }
.sus-circular figure { margin: 0; }
.sus-circular img { width: 100%; height: 470px; object-fit: cover; border-radius: 12px; }
.sus-circular figcaption { margin-top: 14px; color: #111111; font-size: 11px; line-height: 1.7; }
.sus-resource-cycle { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 26px; padding-top: 22px; border-top: 1px solid #567964; font-size: 12px; line-height: 1.8; color: #111111; }
.sus-cta { text-align: center; }
.sus-cta .sus-actions { justify-content: center; }
.sus-cta .sus-hashtags { margin-top: 36px; font-size: 12px; }
@keyframes sus-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1100px) {
 .sus-container { width: calc(100% - 48px); }
 .sus-hero, .sus-heading-grid, .sus-social-layout, .sus-circular-grid { gap: 36px; }
 .sus-hero-photo { height: 540px; }
 .sus-priority-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
 .sus-priority-grid .sus-card:last-child { grid-column: span 2; }
 .sus-social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .sus-section-nav > div { gap: 12px 40px; }
}
@media (max-width: 760px) {
 .sus-container { width: calc(100% - 36px); }
 .sus-hero { grid-template-columns: 1fr; padding-block: 40px; gap: 30px; }
 .sus-hero-photo { height: 360px; border-top-right-radius: 60px; }
 .sus-section { padding-block: 55px; }
 .sus-heading-grid, .sus-social-layout, .sus-circular-grid { grid-template-columns: 1fr; gap: 26px; }
 .sus-heading-grid .sus-copy { margin-top: 0; }
 .sus-section-nav > div { gap: 8px 20px; justify-content: space-between; }
 .sus-subheading { margin-top: 36px; }
 .sus-targets { grid-template-columns: 1fr; }
 .sus-target { padding: 26px; }
 .sus-priority-grid, .sus-social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
 .sus-card { padding: 22px 18px; }
 .sus-priority-grid .sus-card:last-child { grid-column: 1 / -1; }
 .sus-social-photo img, .sus-circular img { height: 330px; }
 .sus-transparency { align-items: flex-start; padding: 24px 20px; gap: 16px; }
 .sus-resource-cycle { font-size: 11px; }
 .sus-cta .sus-actions { flex-direction: column; align-items: stretch; }
}
@media (max-width: 400px) {
 .sus-priority-grid, .sus-social-grid { grid-template-columns: 1fr; }
 .sus-target-top strong { font-size: 62px; }
 .sus-hero .sus-actions { flex-direction: column; align-items: stretch; }
 .sus-hero-photo { height: 300px; }
 .sus-cta .sus-hashtags { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 .sus-hero-copy { animation: none; }
 .sus-card, .sus-button { transition: none; }
 .sus-card:hover, .sus-button:hover { transform: none; }
}

/* Typography integration for the shared site base. */
.sustainability-page main { font-family: DM Sans, Arial, sans-serif; }

/* Let the dedicated square banner show all three edible product categories. */
.sus-hero-photo{height:auto;aspect-ratio:1 / 1}
.sus-hero-photo img{object-position:center}
