:root { color-scheme: light; --forest: #344c3c; --ink: #263c2e; --cream: #fffefa; --muted: #586452; --line: #d8decf; }
      * { box-sizing: border-box; }
      body { margin: 0; background: #f7f8f2; color: var(--ink); font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
      a { color: inherit; text-underline-offset: 4px; }
      a:focus-visible { outline: 3px solid #9cb778; outline-offset: 5px; }
      .wrap { width: min(1080px, calc(100% - 48px)); margin: auto; }
      header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 26px; }
      .wordmark { font-weight: 700; letter-spacing: -.035em; font-size: 24px; text-decoration: none; }
      nav { display: flex; flex-wrap: wrap; gap: 22px; font-size: 14px; }
      .hero { padding: 58px 64px; background: var(--forest); color: var(--cream); border-radius: 36px; }
      .hero-top { display: flex; align-items: center; gap: 26px; }
      .logo { width: 128px; height: 128px; flex: 0 0 128px; border-radius: 28px; }
      .eyebrow { margin: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
      h1 { margin: 0; font: 56px/1.05 Georgia, serif; letter-spacing: -.04em; }
      .tagline { margin: 12px 0 0; font-size: 17px; color: #e4ebd7; }
      .hero h2 { max-width: 670px; margin: 38px 0 18px; font: 44px/1.14 Georgia, serif; letter-spacing: -.035em; }
      .hero-copy { max-width: 680px; margin: 0; color: #edf2e4; font-size: 18px; }
      .button { display: inline-block; padding: 12px 22px; border-radius: 30px; background: #e4ebd7; color: var(--ink); text-decoration: none; font-weight: 700; }
      .hero .button { margin-top: 26px; }
      .availability { margin-top: 22px; padding-top: 20px; border-top: 1px solid #ffffff38; max-width: 700px; font-size: 14px; color: #edf2e4; }
      section { margin-top: 54px; }
      section h2 { margin: 0 0 16px; font: 32px/1.2 Georgia, serif; letter-spacing: -.025em; }
      .intro { max-width: 760px; color: var(--muted); }
      .steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
      .card { padding: 26px; border: 1px solid var(--line); border-radius: 24px; background: var(--cream); }
      .number { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #e4ebd7; font-weight: 700; }
      h3 { margin: 18px 0 10px; font-size: 18px; line-height: 1.3; }
      .card p { color: var(--muted); margin: 0; font-size: 15px; }
      .split { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; }
      .feature-list { padding-left: 20px; color: var(--muted); }
      .feature-list li { margin-bottom: 10px; }
      .plan { background: #edf2e4; border-color: #d8e2ca; }
      .plan h2 { font-size: 27px; }
      .price { margin: 18px 0; font-size: 34px; font-weight: 700; letter-spacing: -.04em; }
      .price span { font-size: 15px; font-weight: 400; letter-spacing: 0; }
      .plan p { font-size: 15px; color: var(--muted); }
      .allowances { padding: 0; list-style: none; margin: 18px 0; }
      .allowances li { padding-block: 7px; border-bottom: 1px solid #d8e2ca; }
      .note { padding: 22px 26px; background: var(--cream); border-left: 4px solid #9cb778; border-radius: 0 18px 18px 0; font-size: 15px; color: var(--muted); }
      footer { margin-top: 54px; border-top: 1px solid var(--line); padding: 28px 0 40px; font-size: 14px; color: var(--muted); }
      footer nav { margin: 18px 0; }
      footer p { margin: 8px 0; }
      @media (max-width: 720px) { .wrap { width: min(100% - 32px, 1080px); } header { align-items: flex-start; } nav { gap: 14px; } .hero { padding: 32px 26px; border-radius: 26px; } .hero-top { gap: 20px; } .logo { width: 96px; height: 96px; flex-basis: 96px; border-radius: 22px; } h1 { font-size: 40px; } .hero h2 { font-size: 34px; } .hero-copy { font-size: 17px; } .steps, .split { grid-template-columns: 1fr; } .split { gap: 24px; } section { margin-top: 36px; } }
      @media (max-width: 390px) { header { display: block; } header nav { margin-top: 14px; } .hero-top { display: block; } .hero-top div { margin-top: 18px; } h1 { font-size: 38px; } }
    
.breadcrumbs { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 24px; font-size:14px; color:var(--muted); }
.recipe-layout { display:grid; grid-template-columns:1.1fr 1fr; gap:32px; align-items:start; }
.recipe-photo { display:block; width:100%; height:auto; border-radius:24px; }
.recipe-heading { font:44px/1.12 Georgia,serif; letter-spacing:-.03em; margin:0 0 20px; }
.recipe-meta { display:flex; gap:22px; flex-wrap:wrap; font-size:15px; color:var(--muted); }
.recipe-steps { padding-left:24px; } .recipe-steps li { padding:0 0 20px 10px; } .recipe-steps h3 { margin:0 0 8px; }
.recipe-card-image { width:100%; height:180px; object-fit:cover; border-radius:14px; } .recipe-card-title { font-size:21px; }
.steps a { text-decoration:none; } .steps a:hover h2 { text-decoration:underline; }
@media(max-width:720px) { .recipe-layout { grid-template-columns:1fr; } .recipe-heading { font-size:34px; } }
@media print { header nav, footer nav, .button { display:none; } body { background:white; } .card { border:0; } }