html:has(.healthy-guide) { scroll-behavior:auto; }
/* Guide owns screen gutters, chapter insets and space between each instruction. */
.healthy-guide { margin:0; overflow-x:visible; background:#f5f8f5; color:#26392b; font-family:'Noto Sans Thai',Tahoma,sans-serif; line-height:1.8; }
.healthy-guide * { box-sizing:border-box; }
.healthy-guide a { color:#194e31; text-underline-offset:4px; cursor:pointer; }
.healthy-guide a:hover { color:#0b652e; text-decoration-thickness:2px; }
.healthy-guide a:active { color:#10341f; }
.healthy-guide a:focus-visible { outline:3px solid #b91c1c; outline-offset:5px; }
.healthy-guide .guide-skip { position:absolute; top:8px; left:16px; padding:10px 16px; background:white; transform:translateY(-180%); z-index:2; }
.healthy-guide .guide-skip:focus { transform:none; }
.healthy-guide .guide-top { display:flex; justify-content:space-between; gap:16px; padding:16px max(20px,calc((100vw - 1080px)/2)); border-bottom:1px solid #dce6de; background:white; font-size:.9rem; }
.healthy-guide .guide-top a { min-height:44px; display:flex; align-items:center; font-weight:700; }
.healthy-guide .guide-top span { align-self:center; }
.healthy-guide .guide-main { width:min(1080px,100%); margin:auto; padding:0 24px 48px; }
.healthy-guide .guide-intro { padding:44px 0 32px; max-width:760px; }
.healthy-guide .guide-intro img { float:right; margin:0 0 16px 20px; }
.healthy-guide .guide-kicker { color:#47634e; font-size:.85rem; font-weight:700; margin:0 0 8px; }
.healthy-guide h1 { font-size:clamp(2rem,5vw,3.4rem); line-height:1.3; letter-spacing:-.02em; margin:12px 0 20px; color:#194e31; }
.healthy-guide h2 { font-size:clamp(1.5rem,3vw,2rem); margin:0 0 8px; line-height:1.4; color:#194e31; }
.healthy-guide h3 { font-size:1.2rem; line-height:1.5; margin:0 0 20px; }
.healthy-guide p { margin:8px 0; }
.healthy-guide .guide-caption { font-size:.85rem; color:#526657; }
.healthy-guide .guide-contents { scroll-margin-top:16px; margin:0 0 48px; padding:24px; border:1px solid #dce6de; border-radius:20px; background:white; }
.healthy-guide .guide-contents > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:20px; }
.healthy-guide .guide-contents a { display:flex; align-items:center; gap:12px; min-height:64px; padding:12px; border:1px solid #dce6de; border-radius:12px; text-decoration:none; font-weight:700; }
.healthy-guide .guide-contents a:hover { background:#edf5ee; border-color:#194e31; }
.healthy-guide .guide-contents b { flex:none; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:#194e31; color:white; line-height:1; }
.healthy-guide .guide-chapter { scroll-margin-top:24px; margin-top:48px; border-top:2px solid #194e31; padding-top:24px; }
.healthy-guide .guide-chapter > header { margin-bottom:28px; }
.healthy-guide .guide-step { display:grid; grid-template-columns:minmax(0,430px) minmax(0,1fr); align-items:start; gap:36px; background:white; padding:24px; border:1px solid #dce6de; border-radius:20px; margin:20px 0; }
.healthy-guide .guide-picture { min-width:0; }
.healthy-guide .guide-picture a { display:block; }
.healthy-guide .guide-picture img { display:block; width:100%; height:auto; border:1px solid #dce6de; border-radius:12px; }
.healthy-guide .guide-picture p { text-align:center; font-size:.8rem; color:#526657; }
.healthy-guide .guide-instructions { min-width:0; padding-top:4px; overflow-wrap:anywhere; }
.healthy-guide ol { list-style:none; counter-reset:steps; padding:0; margin:0; }
.healthy-guide li { counter-increment:steps; position:relative; padding-left:44px; margin:0 0 24px; }
.healthy-guide li::before { content:counter(steps); position:absolute; left:0; top:0; width:30px; height:30px; background:#b91c1c; color:white; border-radius:50%; text-align:center; font-weight:800; line-height:30px; }
.healthy-guide .guide-note { background:#eaf2eb; padding:20px 24px; border-left:4px solid #194e31; border-radius:0 12px 12px 0; overflow-wrap:anywhere; }
.healthy-guide .guide-chapter-links { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin:16px 0; }
.healthy-guide .guide-chapter-links a { display:flex; align-items:center; min-height:44px; }
.healthy-guide .guide-footer { padding-top:32px; margin-top:48px; border-top:1px solid #dce6de; }
@media(max-width:760px) {
  .healthy-guide .guide-main { padding:0 20px 32px; }
  .healthy-guide .guide-top { flex-wrap:wrap; padding:12px 20px; gap:0 12px; }
  .healthy-guide .guide-top span { font-size:.8rem; }
  .healthy-guide .guide-intro { padding-top:28px; }
  .healthy-guide .guide-contents { padding:20px; }
  .healthy-guide .guide-contents > div { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .healthy-guide .guide-step { grid-template-columns:minmax(0,1fr); padding:20px; gap:20px; }
  .healthy-guide .guide-picture { width:min(430px,100%); margin:auto; }
  .healthy-guide .guide-note { padding:16px 20px; }
}
@media(max-width:420px) {
  .healthy-guide .guide-contents > div { grid-template-columns:minmax(0,1fr); }
  .healthy-guide .guide-main { padding-inline:16px; }
  .healthy-guide .guide-step { padding:16px; }
}
@media print {
  .healthy-guide { background:white; }
  .healthy-guide .guide-top,.healthy-guide .guide-skip,.healthy-guide .guide-chapter-links { display:none; }
  .healthy-guide .guide-main { width:100%; padding:0; }
  .healthy-guide .guide-chapter { break-before:page; }
  .healthy-guide .guide-step { break-inside:avoid; grid-template-columns:minmax(0,40%) minmax(0,1fr); gap:20px; }
  .healthy-guide .guide-contents a { color:#194e31; }
}