*{box-sizing:border-box}body{margin:0;background:#f8f7f3;color:#203632;font:17px/1.65 system-ui,-apple-system,Segoe UI,sans-serif}a{color:#145c4b}header{background:#fff;border-bottom:1px solid #ddd}nav,.wrap{max-width:1080px;margin:auto;padding:20px}nav{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}nav a{margin-right:14px}.brand{font-weight:800;font-size:22px;text-decoration:none;color:#203632}.hero{background:#e7ede7;padding:65px 20px}.hero>div{max-width:1080px;margin:auto}h1{font-size:clamp(32px,5vw,54px);line-height:1.13}h2{line-height:1.25;margin-top:35px}.eyebrow{color:#426d5d;text-transform:uppercase;letter-spacing:.12em;font-size:13px;font-weight:700}.lead{font-size:21px;max-width:780px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}.tile,article,.callout{background:white;border:1px solid #e1e4dd;border-radius:14px;padding:25px}.tile h2{font-size:22px;margin:0 0 8px}.tile p{margin:8px 0}.btn{display:inline-block;background:#245a4b;color:white;text-decoration:none;border-radius:8px;padding:12px 18px;font-weight:700;margin:10px 0}.btn:hover{background:#173e34}main.wrap{padding-top:36px;padding-bottom:65px}article{max-width:800px}article h1{font-size:clamp(30px,4vw,44px)}.note{background:#f0f3eb;border-left:4px solid #52765b;padding:15px}.crumb{font-size:14px;color:#59645f}.disclosure{font-size:14px;background:#f2f0e7;padding:12px}footer{background:#203632;color:white;padding:35px 20px}footer a{color:#e2e9e2}footer>div{max-width:1080px;margin:auto}ul{padding-left:22px}li{margin-bottom:9px}@media(max-width:600px){nav{display:block}nav a{display:inline-block;margin:6px 10px 6px 0}.hero{padding:40px 20px}}
/* Consistent shopping access and responsive guide layout */
header{position:sticky;top:0;z-index:30;box-shadow:0 2px 12px rgba(32,54,50,.06)}
nav{max-width:1200px;padding:10px 20px;flex-wrap:nowrap}
nav .navlinks{display:flex;align-items:center;flex-wrap:wrap;gap:2px}
nav .navlinks a{white-space:nowrap;font-size:14px}
.header-cta{margin:0;white-space:nowrap;font-size:14px;text-align:center}
.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:24px;align-items:start}
.content-layout article{min-width:0;max-width:none}
.guide-sidebar{position:static;min-width:0}
.sidebar-panel{background:#fff;border:1px solid #e1e4dd;border-radius:14px;padding:22px}
.sidebar-panel h2{font-size:21px;margin:0 0 12px}
.sidebar-panel h3{font-size:17px;margin:18px 0 6px}
.sidebar-panel ul{padding-left:18px}
.sidebar-panel .btn{font-size:14px;text-align:center}
.sidebar-disclosure{font-size:12px;color:#53645d}
.detail-sections{margin:28px 0}
a:focus-visible{outline:3px solid #b88940;outline-offset:3px}
@media(max-width:1000px){nav{flex-wrap:wrap}.navlinks{order:3;width:100%;justify-content:center}.content-layout{grid-template-columns:minmax(0,1fr) 235px}}
@media(max-width:720px){nav{display:flex;flex-wrap:wrap;gap:8px}.brand{font-size:18px}.header-cta{margin-left:auto;font-size:12px;padding:9px 11px}.navlinks{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;width:100%;padding-bottom:4px}.content-layout{grid-template-columns:1fr}.guide-sidebar{position:static}.hero{padding:35px 20px}}

article p{max-width:72ch}article h2{scroll-margin-top:110px}article ul{max-width:72ch}.btn:focus-visible{outline:3px solid #b88940;outline-offset:3px}@media(max-width:650px){header nav{gap:8px}.header-cta{font-size:13px;padding:10px 12px}.content-layout{display:block}.guide-sidebar{margin-top:24px}}

/* Mobile navigation: CTA and menu are always visible; brand yields on narrow screens. */
nav .nav-actions{display:flex;align-items:center;gap:10px;margin-left:auto;min-width:0}
nav .nav-actions .header-cta{margin:0}
.mobile-menu{display:none}
@media(max-width:720px){
 header nav{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;padding:10px 14px;min-height:62px}
 header nav .brand{font-size:16px;line-height:1.15;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 header nav .navlinks{display:none}
 header nav .nav-actions{flex-shrink:0;gap:8px}
 header nav .header-cta{font-size:12px;line-height:1.2;padding:10px 11px;white-space:nowrap}
 .mobile-menu{display:block;position:relative}
 .mobile-menu summary{display:flex;align-items:center;justify-content:center;cursor:pointer;list-style:none;width:42px;height:42px;border:1px solid #b9c9c1;border-radius:8px;background:#fff;color:#203632}
 .mobile-menu summary::-webkit-details-marker{display:none}
 .mobile-menu summary:focus-visible{outline:3px solid #b88940;outline-offset:2px}
 .hamburger-icon{display:flex;flex-direction:column;gap:4px}
 .hamburger-icon span{width:20px;height:2px;background:currentColor;border-radius:2px}
 .mobile-menu[open] .hamburger-icon span:nth-child(1){transform:translateY(6px) rotate(45deg)}
 .mobile-menu[open] .hamburger-icon span:nth-child(2){opacity:0}
 .mobile-menu[open] .hamburger-icon span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
 .mobile-menu-links{position:absolute;right:0;top:calc(100% + 10px);width:min(290px,calc(100vw - 28px));background:#fff;border:1px solid #dce3dd;border-radius:12px;box-shadow:0 12px 30px rgba(32,54,50,.15);padding:8px;display:flex;flex-direction:column;z-index:50}
 .mobile-menu-links a{display:block;margin:0;padding:11px 12px;color:#203632;text-decoration:none;border-radius:7px;font-size:15px}
 .mobile-menu-links a:hover,.mobile-menu-links a:focus-visible{background:#f0f3eb}
}
@media(max-width:430px){
 header nav .brand{font-size:14px}
 header nav .header-cta{font-size:11px;padding:9px 8px}
 header nav .nav-actions{gap:5px}
}
@media(max-width:350px){header nav .brand{display:none}}

/* Header layout: desktop navigation followed by shopping CTA. */
header nav .brand{flex:0 1 auto}
header nav .navlinks{order:1;margin-left:auto}
header nav .nav-actions{order:2;margin-left:0}
@media(max-width:1000px) and (min-width:721px){
 header nav .navlinks{order:1;width:auto;margin-left:auto;justify-content:flex-end}
 header nav .nav-actions{order:2;margin-left:0}
}
@media(max-width:720px){
 header nav{flex-wrap:nowrap}
 header nav .brand{order:0;flex:1 1 auto;margin-right:auto}
 header nav .navlinks{display:none}
 header nav .nav-actions{order:2;margin-left:auto;flex:0 0 auto}
 header nav .mobile-menu{display:block}
}
@media(max-width:390px){
 header nav .brand{font-size:12px}
 header nav .header-cta{font-size:11px;padding:9px 7px}
 header nav .nav-actions{gap:4px}
 .mobile-menu summary{width:40px;height:40px}
}
