/* Header: floating glass, clear navigation, keyboard and touch first. */
html{scroll-padding-top:116px}section[id]{scroll-margin-top:116px}
.header{position:sticky;top:14px;z-index:40;min-height:76px;margin-top:17px;padding:15px 23px;gap:22px;border:1px solid #dce6d4;border-radius:17px;background:#fbfdf8f2;box-shadow:0 8px 30px -22px #24452b30;transition:background .4s,box-shadow .4s,border-color .4s}
@supports(backdrop-filter:blur(14px)){.header{background:#fbfdf8da;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}}
.header.header-scrolled{background:#fbfdf8f2;border-color:#d0dfc6;box-shadow:0 14px 35px -20px #24452b3b}
.header>.brand{font-size:24px;letter-spacing:-1.05px;color:#244d38}.header .brand-logo{filter:drop-shadow(0 3px 5px #153a2510);transition:transform .4s cubic-bezier(.22,1,.36,1)}
.header nav{display:flex;align-items:center;gap:5px}.header nav a{position:relative;display:inline-flex;justify-content:center;align-items:center;min-height:42px;padding:10px 13px;border-radius:8px;color:#6d8364;font-size:12px;line-height:1.4;white-space:nowrap;transition:color .3s,background .3s}
.header nav a::after{content:'';position:absolute;left:13px;right:13px;bottom:6px;height:1px;background:linear-gradient(90deg,#89ad74,#c4d6b5);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.header>.button{min-height:43px;gap:15px;padding:12px 17px;border:1px solid #cadcbd;border-radius:9px;background:linear-gradient(135deg,#f3f8ec,#eaf2e1);color:#42663d;font-size:11px;box-shadow:0 3px 9px #24452b04;flex-shrink:0}.header>.button>span{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.header.header-enter>.brand,.header.header-enter>nav,.header.header-enter>.button{animation:header-in .85s cubic-bezier(.22,1,.36,1) both}.header.header-enter>nav{animation-delay:.07s}.header.header-enter>.button{animation-delay:.14s}
@keyframes header-in{from{opacity:0;translate:0 -8px}to{opacity:1;translate:0 0}}
@media(hover:hover) and (pointer:fine){.header>.brand:hover .brand-logo{transform:translateY(-2px)}.header nav a:hover{background:#edf4e6;color:#365d30}.header nav a:hover::after{transform:scaleX(1)}.header>.button:hover{background:#e3efd7;border-color:#b7cfa7;transform:translateY(-1px)}.header>.button:hover>span{transform:translate(2px,-2px)}}
.header a:focus-visible{outline:2px solid #7f9f6b;outline-offset:3px;border-radius:7px}
@media(max-width:1100px){.header{gap:16px;padding-inline:18px}.header nav{gap:1px}.header nav a{font-size:11px;padding-inline:9px}.header nav a::after{left:9px;right:9px}.header>.brand{font-size:22px}.header>.button{padding-inline:13px;gap:8px}}
@media(max-width:850px){.header{flex-wrap:wrap;gap:9px 16px;padding:13px 17px;top:10px}.header nav{order:3;width:100%;justify-content:space-between;padding-top:5px;border-top:1px solid #dfe8d8}.header nav a{flex:1;font-size:11px;min-height:42px;padding:10px 6px}.header>.button{margin-left:auto}.header>.brand{font-size:22px}html{scroll-padding-top:160px}section[id]{scroll-margin-top:160px}}
@media(max-width:480px){.header{top:8px;margin-top:11px;padding:12px 12px 9px;border-radius:13px;gap:9px}.header>.brand{font-size:19px;letter-spacing:-.8px}.header .brand-logo{width:28px!important;height:28px!important;margin-right:6px}.header>.button{font-size:10px;padding:10px 10px;min-height:40px;gap:5px}.header nav a{font-size:10px;min-height:42px;padding-inline:4px}.header nav{padding-top:3px}.header nav a::after{left:6px;right:6px}}
@media(prefers-reduced-motion:reduce){.header.header-enter>.brand,.header.header-enter>nav,.header.header-enter>.button{animation:none!important}.header,.header .brand-logo,.header nav a,.header nav a::after,.header>.button,.header>.button>span{transition:none}.header>.brand:hover .brand-logo,.header>.button:hover,.header>.button:hover>span{transform:none}}
/* Combine scroll padding and anchor margin without excessive empty space. */
html{scroll-padding-top:104px}section[id]{scroll-margin-top:16px}@media(max-width:850px){html{scroll-padding-top:144px}section[id]{scroll-margin-top:16px}}
