/* A quiet recipe index for Kerr Bloom Co. */
.recipes-page { --paper:#faf9f6; --wash:#eef1eb; --line:#d8dfd7; --ink:#253b36; --muted:#596860; --accent:#386458; }
.recipes-page .page-shell { max-width:1140px; padding-top:64px; }
.recipes-page .recipe-intro { margin-bottom:44px; max-width:680px; }
.recipes-page .recipe-intro h1 { font-size:clamp(3.2rem,6vw,5.3rem); line-height:1.04; }
.recipes-page .recipe-intro p:last-child { max-width:470px; font-size:1rem; }
.recipe-navigation { display:flex; justify-content:center; align-items:center; gap:12px; padding:22px 0 36px; flex-wrap:wrap; }
.recipe-navigation > span { color:var(--muted); font-size:.9rem; margin-right:12px; }
.recipe-navigation a { border:1px solid var(--line); border-radius:50px; padding:10px 24px; text-decoration:none; background:white; }
.recipe-navigation a:hover { background:var(--wash); border-color:var(--accent); }
.recipe-navigation a span { font-size:.7rem; margin-left:12px; color:var(--muted); }
.recipe-category { border-top:1px solid var(--line); margin-top:24px; }
.recipe-category > summary { padding:32px 0; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.recipe-category h2 { font-size:2.6rem; margin:3px 0 8px; }
.category-eyebrow { font-size:.7rem; text-transform:uppercase; letter-spacing:.17em; color:var(--accent); }
.category-description { color:var(--muted); font-size:.95rem; }
.recipes-page summary { cursor:pointer; list-style:none; }
.recipes-page summary::-webkit-details-marker { display:none; }
.recipes-page summary:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.expand-icon { display:block; position:relative; width:30px; height:30px; flex:0 0 30px; }
.expand-icon::before,.expand-icon::after { content:''; position:absolute; top:14px; left:7px; height:1px; width:16px; background:var(--accent); }
.expand-icon::after { transform:rotate(90deg); }
details[open] > summary > .expand-icon::after { transform:rotate(0); }
.recipe-list { padding-bottom:18px; }
.recipe-entry { border-top:1px solid var(--line); scroll-margin-top:24px; }
.recipe-entry:last-child { border-bottom:1px solid var(--line); }
.recipe-entry > summary { display:flex; align-items:center; gap:24px; padding:20px 8px; }
.recipe-entry > summary:hover { background:#f1f3ed; }
.recipe-thumb { width:88px; height:88px; flex:0 0 88px; object-fit:cover; border-radius:3px; }
.recipe-monogram { display:flex; align-items:center; justify-content:center; background:#e9eee5; color:#788d79; font:italic 32px var(--serif); }
.recipe-monogram span { margin:15px 0 0 -6px; }
.recipe-summary-copy { flex:1; min-width:0; }
.recipe-title { display:block; font:400 clamp(1.3rem,2.5vw,1.75rem)/1.2 var(--serif); letter-spacing:-.02em; }
.recipe-description { display:block; margin-top:7px; font-size:.86rem; color:var(--muted); }
.recipe-content { padding:28px 8px 36px; }
.recipes-page .recipe-feature { padding-top:22px; margin-bottom:18px; border-top:0; gap:36px; }
.recipes-page .recipe-feature h2 { font-size:2rem; }
.recipes-page .recipe-feature figcaption { font-size:.8rem; color:var(--muted); margin-top:8px; }
.back-to-recipes { display:block; width:fit-content; margin:24px auto 0; font-size:.85rem; color:var(--accent); }
.kitchen-note { margin:64px auto 0; padding:24px 0; border-top:1px solid var(--line); max-width:740px; color:var(--muted); }
.kitchen-note summary { font-family:var(--serif); font-size:1.4rem; margin-bottom:16px; }
.kitchen-note summary::after { content:' +'; }
.kitchen-note[open] summary::after { content:' −'; }
@media(max-width:700px) {
  .recipes-page .page-shell { padding-top:40px; }
  .recipe-entry > summary { gap:14px; padding:18px 0; }
  .recipe-thumb { width:64px; height:64px; flex-basis:64px; }
  .recipe-description { font-size:.8rem; line-height:1.5; }
  .recipe-content { padding:12px 0 28px; }
  .recipe-navigation > span { width:100%; text-align:center; margin:0 0 4px; }
  .recipe-category > summary { padding:24px 0; }
  .recipe-category h2 { font-size:2.25rem; }
  .category-description { font-size:.86rem; }
}
@media print {
  .recipe-navigation,.back-to-recipes,.recipe-entry > summary,.recipe-category > summary,.kitchen-note { display:none; }
  .recipe-category::details-content,.recipe-entry::details-content { display:block; content-visibility:visible; }
  .recipe-entry,.recipe-category { border:0; }
}

/* Photography, warm paper, and a little character. */
.recipes-page { --paper:#fbf8f1; --wash:#eeeee3; --line:#d8d4c5; --ink:#293c36; --muted:#596158; --accent:#3b5a46; }
.recipes-page .site-header { background:#fbf8f1; }
.recipes-page .page-shell { max-width:1380px; padding-top:36px; }
.recipe-hero { display:grid; grid-template-columns:1fr 1fr; background:#eeeddf; margin-bottom:36px; }
.recipe-hero-copy { padding:clamp(28px,5vw,72px); align-self:center; }
.recipe-hero-copy .kicker { font-size:.7rem; letter-spacing:.2em; margin-bottom:24px; }
.recipe-hero h1 { font-size:clamp(3.2rem,5.5vw,5.8rem); line-height:1.03; letter-spacing:-.045em; margin-bottom:28px; }
.recipe-hero h1 em { font-weight:400; color:#6b6241; }
.recipe-hero-copy > p:not(.kicker) { max-width:370px; line-height:1.8; font-size:1rem; color:var(--muted); }
.recipe-hero-button { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; background:#d7b75b; color:#26392f; padding:15px 22px; margin:10px 0 32px; font-size:.8rem; text-decoration:none; }
.recipe-hero-button:hover { background:#c8a445; color:#26392f; }
.hero-footnote { display:block; color:#676653; font:italic 1.1rem var(--serif); }
.recipe-hero-photo { position:relative; min-height:580px; }
.recipe-hero-photo img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:50% 55%; }
.recipe-hero-photo figcaption { position:absolute; bottom:0; left:0; right:0; background:#263b32; color:#fffaf1; padding:14px 22px; font-size:.75rem; }
.recipe-hero-photo figcaption a { display:flex; justify-content:space-between; align-items:center; gap:12px; text-decoration:none; }
.recipe-hero-photo figcaption a:hover { color:#e6c774; }
.recipe-navigation { justify-content:flex-start; padding:24px 0; border-bottom:1px solid var(--line); margin-bottom:36px; }
.recipe-navigation > span { margin-right:auto; font:italic 1.3rem var(--serif); color:var(--ink); }
.recipe-navigation a { background:transparent; border:0; border-bottom:1px solid var(--accent); border-radius:0; padding:10px 18px; }
.recipe-category { margin:0 0 42px; border-top:0; }
.recipe-category > summary { padding:22px 0 32px; }
.recipe-category h2 { font-size:3.4rem; }
.category-eyebrow { letter-spacing:.2em; }
.recipe-entry > summary { padding:22px 0; gap:28px; }
.recipe-thumb { width:120px; height:112px; flex-basis:120px; border-radius:0; }
.recipe-monogram { background:#e9e7da; color:#7b805f; font-size:40px; border:1px solid #d9dac9; }
.recipe-title { font-size:clamp(1.5rem,2.7vw,2rem); }
.recipe-description { font-size:.9rem; }
.recipe-entry > summary:hover { background:#f1eee4; }
#sweet > summary h2 { color:#795342; }
#savory > summary h2 { color:#3b5a46; }
.recipes-page .site-footer { background:#e8e9dd; }
@media(min-width:1000px) {
  .recipes-page .site-header { display:flex; align-items:center; justify-content:space-between; gap:36px; padding:26px 48px; }
  .recipes-page .brand-lockup strong { font-size:1.8rem; }
  .recipes-page .brand-lockup small { font-size:.63rem; text-align:left; }
  .recipes-page .site-nav { margin:0; gap:25px; }
}
@media(max-width:760px) {
  .recipe-hero { grid-template-columns:1fr; }
  .recipe-hero-copy { padding:36px 28px; }
  .recipe-hero h1 { font-size:clamp(2.7rem,9vw,4rem); }
  .recipe-hero-photo { min-height:360px; }
  .recipe-hero-photo img { object-position:50% 64%; }
  .recipe-hero-button { margin-bottom:24px; }
  .hero-footnote { font-size:1rem; }
  .recipe-navigation { justify-content:center; gap:8px; margin-bottom:20px; }
  .recipe-navigation > span { margin:0 0 10px; font-size:1.2rem; flex-basis:100%; text-align:center; }
  .recipe-thumb { width:76px; height:86px; flex-basis:76px; }
  .recipe-entry > summary { gap:14px; }
  .recipe-title { font-size:1.4rem; }
  .recipe-description { font-size:.8rem; }
  .recipe-category h2 { font-size:2.8rem; }
}
@media print { .recipe-hero { display:none; } }