/* Farming page specific styles - keep minimal and complementary to base.css */

/* Hero */
.hero { position: relative; padding-block: var(--space-10) var(--space-8); }
.hero__inner { position: relative; }
.hero__media { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); }
.hero__content { margin-top: var(--space-8); }
.hero__actions { display: flex; gap: var(--space-4); flex-wrap: wrap; }

@media (min-width: 900px) {
  .hero { padding-block: var(--space-14) var(--space-10); }
  .hero__content { position: relative; margin-top: calc(var(--space-10) * -1); background: color-mix(in srgb, var(--color-surface) 88%, transparent); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: var(--space-8); box-shadow: var(--shadow-sm); }
}

/* Sub-navigation */
.subnav { position: sticky; top: 64px; z-index: 40; background: var(--color-surface); border-block: 1px solid var(--gray-200); }
.subnav__list { display: flex; gap: clamp(12px, 2vw, 24px); padding-block: var(--space-4); overflow-x: auto; scrollbar-width: thin; }
.subnav__list a { color: var(--color-text); font-weight: 600; white-space: nowrap; padding: 6px 8px; border-radius: var(--radius-md); }
.subnav__list a:hover { background: var(--gray-100); text-decoration: none; }
.subnav__list a.is-active { color: #fff; background: var(--color-primary); }

/* Section spacing */
.section { padding-block: var(--space-12); }
.section .section__intro { margin-bottom: var(--space-6); color: var(--gray-700); }

/* Feature list */
.feature-list { display: grid; gap: var(--space-6); padding-left: 0; }
.feature-list li { list-style: none; }

/* CTA box */
.cta-box { background: var(--gray-50); }

/* Simple responsive helpers */
.flex-wrap { flex-wrap: wrap; }

/* Chat widget minimal styling (complements footer markup) */
.chat-toggle { position: fixed; right: 16px; bottom: 16px; z-index: 70; padding: 10px 14px; border-radius: var(--radius-round); border: 1px solid var(--gray-300); background: var(--color-primary); color: #fff; box-shadow: var(--shadow-md); font-weight: 700; }
.chat-toggle:hover { filter: brightness(0.95); }

.chat-panel { position: fixed; right: 16px; bottom: 72px; width: min(360px, calc(100vw - 32px)); max-height: min(70vh, 640px); display: flex; flex-direction: column; background: var(--color-surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); transform: translateY(8px); opacity: 0; pointer-events: none; transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.chat-panel[aria-hidden="false"] { opacity: 1; transform: translateY(0); pointer-events: auto; }
.chat-panel__header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) var(--space-6); border-bottom: 1px solid var(--gray-200); }
.chat-panel__body { padding: var(--space-6); overflow: auto; }
.chat-close { width: 36px; height: 36px; border-radius: var(--radius-md); border: 1px solid var(--gray-300); background: var(--color-surface); font-size: 1.25rem; line-height: 1; }
.chat-close:hover { background: var(--gray-100); }