/* Recipes page specific styles */
.page-intro { padding: var(--space-16) 0 var(--space-12); }
.section { padding: var(--space-16) 0; }
.section--alt { background: var(--gray-50); }

/* Grid helpers for media + text split */
.seasonal-grid, .gadgets-grid, .healthy-grid { gap: var(--space-10); align-items: center; }
@media (min-width: 900px) {
  .seasonal-grid, .gadgets-grid, .healthy-grid { grid-template-columns: 1.2fr 1fr; }
  .gadgets-grid { grid-template-columns: 1fr 1.2fr; }
}

.seasonal-figure img, .gadgets-figure img, .healthy-figure img { width: 100%; height: auto; object-fit: cover; }

/* Chips */
.chip-group { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); margin-bottom: var(--space-6); }
.chip { display: inline-flex; align-items: center; padding: 0.5rem 0.75rem; border-radius: var(--radius-pill); border: 1px solid var(--gray-300); background: var(--color-surface); color: var(--color-text); box-shadow: var(--shadow-sm); transition: background-color var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard), transform var(--duration-fast) var(--ease-standard); }
.chip:hover { background: var(--gray-100); }
.chip.is-active, .chip[aria-selected="true"] { border-color: var(--color-primary-400); background: rgba(123,179,143,0.08); }

/* Badges stack */
.badges { display: flex; gap: var(--space-3); margin-top: var(--space-3); }

/* CTA rows */
.cta-row { margin-top: var(--space-8); display: flex; justify-content: center; }

/* Ingredient actions */
.ingredient-actions { margin-top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); }
.ingredient-actions .ingredient-list { padding-left: 1.25rem; }

/* Reviews */
.review__title { font-weight: 600; margin-bottom: var(--space-2); }
.review__rating { color: var(--color-warning); margin-bottom: var(--space-3); }

/* Accessible video modal */
.video-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; padding: var(--space-6); z-index: 1000; }
.video-modal[aria-hidden="false"] { display: flex; }
.video-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.video-modal__dialog { position: relative; z-index: 1; width: min(100%, 900px); background: var(--color-surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.video-modal__header { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) var(--space-6); border-bottom: 1px solid var(--gray-200); }
.video-modal__close { background: transparent; border: none; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.video-modal__body { padding: var(--space-6); }
.video-modal__ratio { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.video-modal__ratio iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Small polish tweaks */
.page-intro p { color: var(--gray-700); }

@media (prefers-reduced-motion: reduce) {
  .chip, .btn { transition-duration: 0.01ms !important; }
}
