:root{--tomato:#d8432f;--butter:#fff6dd;--crust:#3b2a20;--basil:#2f6b4f;--flour:#fffdf7;--steam:#8b7d6f;--crumb:#efe0bd}
*{box-sizing:border-box}body{margin:0;background:var(--butter);color:var(--crust);font:17px/1.7 "Avenir Next","Nunito","Segoe UI",sans-serif}
a{color:var(--tomato);text-underline-offset:3px;text-decoration-thickness:1.5px}a:hover{color:var(--basil)}
.counter{max-width:1040px;margin:0 auto;padding:0 18px}
.apron{background:var(--tomato);color:var(--flour)}
.apron .counter{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;padding-top:14px;padding-bottom:14px}
.apron .logo{font:italic 700 26px/1 Georgia,"Times New Roman",serif;color:var(--flour);text-decoration:none}
.shelf-nav{display:flex;flex-wrap:wrap;gap:6px}.shelf-nav a{color:var(--flour);text-decoration:none;font-size:14.5px;font-weight:600;background:rgba(255,255,255,.14);padding:4px 12px;border-radius:999px}.shelf-nav a:hover{background:var(--flour);color:var(--tomato)}
.gingham{height:14px;background:repeating-linear-gradient(90deg,var(--tomato) 0 14px,var(--flour) 14px 28px);opacity:.35}
.hello{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-items:center;padding:48px 0 30px}
.hello h1{font:italic 700 clamp(32px,5.6vw,56px)/1.05 Georgia,"Times New Roman",serif;margin:0}
.hello p{margin:0;font-size:18px;color:var(--steam)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;padding:10px 0 70px}
.index-card{display:block;background:var(--flour);border:1px solid var(--crumb);border-top:26px solid var(--basil);border-radius:6px;padding:20px 22px 22px;text-decoration:none;color:var(--crust);background-image:repeating-linear-gradient(var(--flour) 0 27px,#e9eef6 27px 28px);transform:rotate(-.4deg)}
.index-card:nth-child(even){transform:rotate(.5deg)}
.index-card:hover{border-top-color:var(--tomato);color:var(--crust)}
.index-card h2{font:italic 700 22px/1.25 Georgia,serif;margin:6px 0 8px}.index-card p{margin:0;font-size:15px;line-height:1.75;color:var(--steam)}
.course{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--basil)}
.method{max-width:700px;margin:0 auto;padding:40px 0 70px}
.method h1{font:italic 700 clamp(28px,4.8vw,44px)/1.1 Georgia,serif;margin:10px 0 14px}
.serves{font-size:18.5px;background:var(--flour);border:2px dashed var(--crumb);border-radius:10px;padding:14px 18px;margin:0 0 30px}
.method h2{font-size:20px;font-weight:700;color:var(--basil);margin:32px 0 8px}
.method ol,.method ul{padding-left:22px}.method li{margin:7px 0}.method ol li::marker{font-weight:700;color:var(--tomato)}
.tip{background:#e8f2ec;border-radius:10px;padding:12px 16px;font-size:15.5px}
.cooked{margin-top:36px;font-size:13.5px;color:var(--steam)}
.tea-towel{background:var(--crust);color:#e9dccb;font-size:14px}.tea-towel .counter{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px;padding-top:20px;padding-bottom:28px}.tea-towel a{color:var(--flour)}
@media(max-width:700px){.hello{grid-template-columns:1fr;padding-top:30px;gap:12px}.index-card,.index-card:nth-child(even){transform:none}body{font-size:16.5px}}