
:root { font-family: system-ui, sans-serif; color: #25312a; }
body { margin: 0; background: #fafaf7; }
header { background: #31543b; color: white; padding: 1.5rem; }
header a { color: white; }
main { max-width: 1050px; margin: auto; padding: 2rem 1rem; }
h1, h2 { line-height: 1.3; }
a { color: #24613b; }
.search { width: 100%; max-width: 500px; padding: .8rem;
          font-size: 1rem; box-sizing: border-box; }
.recipe-list { columns: 2; padding-left: 1.5rem; }
.recipe-list li { margin: .6rem 0; break-inside: avoid; }
.recipe-image { text-align: center; }
.recipe-image img { max-width: 100%; max-height: 420px; height: auto; }
.duo-grid { display: grid; grid-template-columns: 1fr 1.5fr;
            gap: 2rem; }
.duo-grid > div { min-width: 0; }
li { margin-bottom: .5rem; }
nav { margin: 1.5rem 0; display: flex; gap: 1rem;
      justify-content: space-between; flex-wrap: wrap; }
footer { margin-top: 3rem; padding: 1rem; text-align: center;
         border-top: 1px solid #ddd; }
@media (max-width: 650px) {
    .duo-grid { grid-template-columns: 1fr; }
    .recipe-list { columns: 1; }
}
