:root{
      --ink:#292820;--muted:#59574b;--paper:#fbf8f0;--cream:#f3eadb;--edge:#ded4c2;
      --olive:#333825;--rust:#993f27;--terra:#e7ad8e;--display:"Playfair Display",Georgia,serif;
      --sans:"DM Sans",Arial,sans-serif;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans)}
    h1,h2,h3,p,figure{margin:0}
    h1,h2,h3{font-family:var(--display);line-height:1.08;font-weight:normal}
    h2{font-size:clamp(2.15rem,4.2vw,4.1rem);letter-spacing:-.059em}
    h3{font-size:1.6rem;letter-spacing:-.036em}
    img{display:block;max-width:100%;object-fit:cover}
    a{color:inherit}
    button{font:inherit;color:inherit}
    a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid #bc6949;outline-offset:4px}
    [id]{scroll-margin-top:100px}
    .wrap{width:min(100% - 96px,1232px);margin-inline:auto}
    .skip-link{position:fixed;top:1rem;left:1rem;transform:translateY(-200%);z-index:10;padding:.65rem 1rem;background:var(--paper)}
    .skip-link:focus{transform:none}
    .header{position:sticky;top:0;z-index:5;background:var(--paper);border-bottom:1px solid var(--edge)}
    .header-inner{min-height:76px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.6rem}
    .brand{display:inline-flex;align-items:center;gap:.72rem;width:max-content;text-decoration:none}
    .brand-mark{width:32px;height:32px;display:grid;place-items:center;background:var(--rust);color:white;border-radius:50%;font:italic 1.25rem/1 var(--display)}
    .brand-name{font:normal 1.48rem/1 var(--display);letter-spacing:-.055em}
    .brand-name span{color:var(--rust)}
    .nav{display:flex;gap:2.2rem;font-size:.92rem;font-weight:700}
    .nav a,.jump a,.footer-links a{text-decoration:none}
    .nav a:hover,.jump a:hover,.footer-links a:hover{text-decoration:underline;text-underline-offset:4px}
    .top-action{justify-self:end}
    .small-link{display:inline-flex;align-items:center;gap:.5rem;border:1px solid #c8bba6;padding:.45rem .78rem;border-radius:5px;font-size:.85rem;font-weight:700;text-decoration:none}
    .small-link:hover{background:var(--cream)}
    .nav-toggle{display:none}
    .hero{background:var(--cream);padding:57px 0 52px}
    .hero-grid{display:grid;grid-template-columns:minmax(0,.91fr) minmax(0,1.09fr);gap:clamp(2.5rem,5vw,4.7rem);align-items:center}
    .hero h1{font-size:clamp(5rem,8.85vw,8.65rem);letter-spacing:-.06em;line-height:.9;margin:0 0 1.55rem -.035em}
    .hero h2{font-size:clamp(1.55rem,2.55vw,2.2rem);letter-spacing:-.04em;margin:0 0 .68rem}
    .hero p{max-width:48ch;font-size:clamp(1rem,1.4vw,1.16rem);line-height:1.62;color:#494638}
    .hero-actions{margin-top:1.55rem;display:flex;align-items:center;flex-wrap:wrap;gap:.92rem 1.3rem}
    .button{display:inline-flex;align-items:center;justify-content:center;gap:.85rem;min-height:47px;padding:.57rem .95rem;background:var(--rust);color:white;border:1px solid var(--rust);border-radius:5px;font-weight:700;font-size:.9rem;text-decoration:none}
    .button:hover{background:#7d301d;border-color:#7d301d}
    .text-link{display:inline-flex;align-items:center;gap:.5rem;color:var(--rust);font-weight:700;font-size:.92rem;text-underline-offset:4px}
    .hero-figure img{width:100%;height:auto;aspect-ratio:1.44;border-radius:9px;background:#704735}
    figcaption{margin-top:.64rem;color:#60584b;font-size:.78rem}
    .jump{border-block:1px solid var(--edge)}
    .jump .wrap{display:flex;align-items:center;gap:1rem 1.9rem;flex-wrap:wrap;min-height:61px;padding-block:.52rem}
    .jump strong{font-size:.8rem;letter-spacing:.062em;text-transform:uppercase;color:var(--rust)}
    .jump a{font-size:.88rem;color:#4c493e}
    .section{padding-block:clamp(3.5rem,6.6vw,6.2rem)}
    .section-intro{margin-top:.7rem;color:var(--muted);max-width:65ch}
    .first-grid{display:grid;grid-template-columns:1fr .95fr;gap:clamp(2.5rem,7vw,6.5rem);align-items:start}
    .label-panel{border:1px solid var(--edge);border-radius:8px;background:#f5eee0;padding:clamp(1.2rem,3vw,2rem)}
    .label-panel h2{font-size:clamp(1.9rem,3vw,2.75rem)}
    .label-grid{display:grid;gap:.7rem;margin-top:1rem}
    .label-card{padding:.75rem .9rem;border:1px solid #dcd0ba;border-radius:5px;background:var(--paper)}
    .label-card b{display:block;color:#783322}
    .label-card p{color:var(--muted);font-size:.88rem}
    .temperature{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:.9rem;align-items:stretch;margin-top:2.2rem;padding:1.1rem;background:#e8e8d9;border:1px solid #d3d6c3;border-radius:7px}
    .temperature > div{padding:.45rem .7rem}
    .temperature h2{margin-bottom:.3rem;font-size:1.65rem;letter-spacing:-.037em}
    .temperature .temp{border-left:1px solid #c5c7b3;padding-left:1.2rem}
    .temp strong{font:normal clamp(2rem,3.2vw,3.1rem)/1 var(--display);letter-spacing:-.065em}
    .temperature p,.temperature a{font-size:.83rem}
    .temperature a{color:#454b30;text-underline-offset:3px}
    .cook{background:var(--olive);color:#fbf4e6}
    .cook .section-intro{color:#e0dfcf}
    .cook .text-link{color:#ffd2b8}
    .types{border-bottom:1px solid var(--edge)}
    .type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem;margin-top:1.6rem}
    .type{border:1px solid var(--edge);border-radius:8px;overflow:hidden;background:#fffaf0}
    .type img{width:100%;height:auto;aspect-ratio:1.55;background:#9a7052}
    .type-body{padding:1.05rem 1.15rem 1.25rem}
    .place{color:var(--rust);font-size:.78rem;font-weight:700;letter-spacing:.05em;margin-bottom:.33rem}
    .type-body p{margin-top:.55rem;color:var(--muted);font-size:.95rem}
    .compare h2,.serving h2,.faq h2{max-width:22ch}
    .compare-table{border:1px solid var(--edge);border-radius:7px;margin-top:1.35rem;overflow:hidden}
    table{border-collapse:collapse;width:100%;table-layout:fixed}
    th,td{padding:.85rem 1rem;text-align:left;vertical-align:top}
    thead{background:var(--olive);color:var(--paper)}
    thead th:first-child{width:24%}
    thead th:nth-child(2){width:42%}
    tbody tr:nth-child(odd){background:#f3eddf}
    tbody tr+tr{border-top:1px solid var(--edge)}
    tbody th{color:#4b442f}
    td{color:var(--muted)}
    .serving{background:#f1e5d7}
    .serving-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,7vw,6rem);align-items:start}
    .pairing{padding:.85rem 0;border-bottom:1px solid #d7cab7}
    .pairing:first-child{padding-top:.14rem}
    .pairing h3{font-size:1.47rem;margin-bottom:.3rem}
    .pairing p{color:var(--muted)}
    .sources{padding:1.25rem 0 1.55rem;border-top:1px solid var(--edge);color:var(--muted);font-size:.85rem}
    .sources h2{font:700 .9rem/1.4 var(--sans);letter-spacing:0;color:var(--ink);margin-bottom:.4rem}
    .sources a{color:var(--rust);text-underline-offset:3px}
    .footer{padding:1.3rem 0 1.45rem;background:var(--cream);border-top:1px solid var(--edge)}
    .footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.15rem;flex-wrap:wrap}
    .footer-links{display:flex;gap:.8rem 1.2rem;flex-wrap:wrap;font-size:.85rem}
    @media(max-width:900px){
      .wrap{width:calc(100% - 56px)}
      .hero{padding:41px 0 36px}
      .hero-grid{gap:2rem}
      .hero h1{font-size:clamp(3.7rem,10.3vw,6.2rem)}
      .nav{gap:1rem}
      .type-grid{gap:.85rem}
      .type-body{padding:.85rem}
    }
    @media(max-width:650px){
      [id]{scroll-margin-top:75px}
      .wrap{width:calc(100% - 36px)}
      .header-inner{min-height:59px;grid-template-columns:1fr auto;gap:.4rem}
      .header .nav{grid-row:2;grid-column:1/-1;flex-wrap:wrap;gap:.5rem 1.25rem;padding:.15rem 0 .7rem}
      .has-js .header .nav{display:none}
      .has-js .header .nav.is-open{display:flex}
      .has-js .nav-toggle{display:block;background:none;border:1px solid #d7ccb7;border-radius:5px;padding:.3rem .68rem;font-size:.86rem;font-weight:700}
      .top-action{display:none}
      .hero{padding:35px 0 28px}
      .hero-grid,.first-grid,.serving-grid{grid-template-columns:minmax(0,1fr);gap:1.55rem}
      .hero h1{font-size:clamp(3.45rem,14.4vw,5.25rem);margin-bottom:1rem}
      .hero h2{font-size:1.58rem}
      .hero p{font-size:1rem}
      .hero-actions{margin-top:1.13rem;gap:.64rem 1rem}
      .hero-figure img{aspect-ratio:1.52}
      .jump .wrap{gap:.3rem .95rem;padding-block:.68rem}
      .jump strong{flex-basis:100%}
      .jump a{font-size:.83rem}
      .section{padding-block:3.2rem}
      .temperature{grid-template-columns:1fr 1fr;margin-top:1.4rem;padding:.68rem;gap:.45rem}
      .temperature > div:first-child{grid-column:1/-1}
      .temperature .temp:nth-child(2){border-left:0}
      .type-grid{grid-template-columns:minmax(0,1fr)}
      .type img{aspect-ratio:1.68}
      .type-body h3{font-size:1.64rem}
      th,td{padding:.52rem .44rem;font-size:.8rem;overflow-wrap:anywhere}
    }
    @media(max-width:350px){
      .wrap{width:calc(100% - 28px)}
      .jump .wrap{gap:.25rem .75rem}
    }
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
    .jump .wrap{gap:.45rem clamp(.65rem,2.25vw,1.75rem)}
    .content-section{scroll-margin-top:96px}
    .section-head{display:flex;align-items:end;justify-content:space-between;gap:1.15rem;margin-bottom:.8rem}
    .section-head > div{min-width:0}
    .folds{margin-top:1.4rem;border-top:1px solid var(--edge)}
    .folds details{border-bottom:1px solid var(--edge)}
    .folds summary{position:relative;cursor:pointer;list-style:none;padding:.8rem 2rem .8rem 0;font-weight:700;line-height:1.45;min-height:45px}
    .folds summary::-webkit-details-marker{display:none}
    .folds summary::after{content:"";position:absolute;right:.2rem;top:50%;transform:translateY(-50%);width:.68rem;height:.68rem;color:var(--rust);background:linear-gradient(currentColor,currentColor) center/.68rem 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px .68rem no-repeat}
    .folds details[open] summary::after{background:linear-gradient(currentColor,currentColor) center/.68rem 1.5px no-repeat}
    .folds summary:hover{color:var(--rust)}
    .fold-answer{padding:.04rem 1.65rem 1rem 0;max-width:76ch;color:var(--muted);line-height:1.6}
    .fold-answer > * + *{margin-top:.64rem}
    .fold-answer ol,.fold-answer ul{margin-bottom:0;padding-left:1.25rem}
    .fold-answer li+li{margin-top:.3rem}
    .fold-answer a,.context-links a{color:var(--rust);font-weight:700;text-underline-offset:3px}
    .context-links{display:flex;flex-wrap:wrap;gap:.45rem 1.1rem;margin-top:1.05rem;font-size:.92rem}
    .context-links a:hover{text-decoration-thickness:2px}
    .labels-caption{margin-top:1rem;color:var(--muted);font-size:.81rem}
    .temperature .temp small{display:block;font-size:.81rem;margin-top:.15rem;color:#4e523d}
    .method-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin-top:1.45rem}
    .method-choice{display:block;min-width:0;padding:.9rem 1rem;border:1px solid #72765d;border-radius:6px;text-decoration:none;background:#3d432e}
    .method-choice:hover,.method-choice:focus-visible{background:#4a5137;border-color:#b5b69a}
    .method-choice strong{display:flex;justify-content:space-between;align-items:center;gap:.5rem;font:normal 1.4rem/1.12 var(--display);letter-spacing:-.015em;color:#fff3df}
    .method-choice span:last-child{display:block;margin-top:.42rem;color:#e0dfcd;font-size:.86rem;line-height:1.37}
    .method-choice strong span:last-child{display:inline;margin:0;color:#ffc6a3;font:normal .96rem/1 var(--sans)}
    .cook .folds,.cook .folds details{border-color:#72765d}
    .cook .folds summary::after,.cook .folds summary:hover,.cook .fold-answer a,.cook .context-links a{color:#ffd3b8}
    .cook .fold-answer{color:#f0eddf}
    .cook .context-links{border-top:1px solid #62674e;padding-top:.95rem}
    .type-grid{align-items:start}
    .type-body .folds{margin-top:.8rem}
    .type-body .folds summary{font-size:.87rem;padding-block:.56rem}
    .type-body .folds details{border-bottom:0}
    .type-body .fold-answer{font-size:.87rem;padding:0 1.25rem .3rem 0}
    .type-body .fold-answer p{font-size:inherit;margin:0}
    .type-body .fold-answer p + p{margin-top:.45rem}
    .serving .folds,.serving .folds details{border-color:#d7cab7}
    .serve-options{display:grid;gap:.74rem;align-self:end}
    .pairing h3 a{text-decoration-thickness:1px;text-underline-offset:5px}
    .faq-actions[hidden]{display:none}
    .faq-actions{cursor:pointer;background:transparent;border:1px solid #c9bda8;border-radius:5px;padding:.42rem .67rem;white-space:nowrap;font-size:.86rem;font-weight:700;min-height:42px}
    .faq-actions:hover{background:var(--cream)}
    .guide-map{padding-block:2rem 2.15rem;background:#f4eee1;border-top:1px solid var(--edge)}
    .guide-map h2{font-size:clamp(1.7rem,3vw,2.45rem)}
    .guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem 1.2rem;margin-top:1rem}
    .guide-grid a{padding:.35rem .2rem;color:#6f3222;text-underline-offset:4px;font-size:.94rem;font-weight:700}
    .sources{padding-top:.85rem}
    .sources .folds{margin-top:.3rem;border-top:0}
    .sources .folds details{border-bottom:0}
    .sources .fold-answer{max-width:95ch}
    @media(max-width:768px){.method-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}
    @media(max-width:650px){
      .content-section{scroll-margin-top:75px}
      .section-head{align-items:start}
      .faq .section-head{flex-wrap:wrap}
      .guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .method-choice{padding:.7rem .65rem}
      .method-choice strong{font-size:1.2rem}
      .fold-answer{padding-inline-end:.5rem}
      .type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .type-body h3{font-size:1.42rem}
      .type-body p{font-size:.88rem}
      .type-grid .type:last-child{grid-column:1/-1}
      .type-grid .type:last-child img{aspect-ratio:2.2}
    }
    @media(max-width:370px){.type-grid{grid-template-columns:1fr}.type-grid .type:last-child{grid-column:auto}}
    @media print{
      .header,.jump,.footer,.hero-actions,.faq-actions,.method-choices{display:none}
      .wrap{width:100%}
      .section{padding-block:1.25rem}
      .cook{color:#292820;background:#fff}
      .cook .fold-answer,.cook .section-intro,.cook .context-links a,.cook .fold-answer a{color:#292820}
      .cook .folds summary::after,.folds summary::after{display:none}
      details{break-inside:avoid}
      details:not([open])::details-content{content-visibility:visible;display:block}
    }