/* Full-width artwork remains intact; all text surfaces use shared theme tokens. */
.oil-palm-data { width: 100%; margin: 0; padding: 0; }
.oil-palm-data img { display: block; width: 100%; height: auto; }
.oil-palm-innovation { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; padding-block: clamp(48px, 6vw, 96px); background: var(--paper); }
.oil-palm-media, .oil-palm-copy { min-width: 0; }
.oil-palm-media img { display: block; width: 100%; height: auto; }
.oil-palm-copy { padding-inline: clamp(24px, 4vw, 72px); }
.oil-palm-copy h2 { color: var(--ink); font-size: clamp(2rem, 3vw, 3rem); line-height: 1.2; overflow-wrap: anywhere; margin-bottom: 1.5rem; }
.oil-palm-copy h2::before { content: ''; display: block; width: 44px; height: 2px; background: var(--gold); margin-bottom: 1.5rem; }
.oil-palm-copy p { color: var(--ink); line-height: 1.85; max-width: 65ch; }
/* Reuse main.js's reveal state while keeping content visible without JavaScript. */
.oil-palm-page .reveal { opacity: 1; transform: none; transition: none; }
@media (prefers-reduced-motion: no-preference) {
  .oil-palm-page .reveal.in { animation: oil-palm-enter .6s ease both; }
}
@keyframes oil-palm-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (max-width: 800px) {
  .oil-palm-innovation { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .oil-palm-copy { width: min(calc(100% - 36px), var(--container)); margin-inline: auto; padding: 0; }
}
@media (max-width: 480px) {
  .oil-palm-copy { width: calc(100% - 28px); }
}