@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#14243a;--ink:#17283d;--muted:#718096;--line:#e6ebf1;--paper:#f5f7fa}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;min-height:100vh}
.page-shell{max-width:1440px;margin:auto;padding:0 6.1%}
.topbar{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.brand-mark{width:43px;height:43px;border-radius:12px;background:var(--navy);color:white;display:grid;place-items:center;font:800 25px Manrope,sans-serif;box-shadow:0 5px 14px #14243a24}
.brand-copy{display:flex;flex-direction:column;gap:3px}
.brand-copy strong{font:800 14px Manrope,sans-serif;letter-spacing:1.7px}
.brand-copy small{font-size:9px;letter-spacing:2px;color:#7b8795;font-weight:700}
.status{font-size:10px;letter-spacing:1.2px;color:#647386;font-weight:700;display:flex;align-items:center;gap:8px}
.status i{width:7px;height:7px;border-radius:50%;background:#27a779;box-shadow:0 0 0 4px #27a7791c}
.hero{padding:65px 0 48px;max-width:780px}
.eyebrow,.section-kicker{font-size:10px;letter-spacing:2px;font-weight:800;color:#718096}
.eyebrow{display:flex;align-items:center;gap:9px}
.eyebrow span{width:22px;height:2px;background:#b78c54}
h1{font:800 clamp(36px,5vw,58px)/1.12 Manrope,sans-serif;letter-spacing:-2.3px;color:var(--navy);margin:20px 0 15px}
h1 em{font-style:normal;color:#9a7a50}
.intro{font-size:15px;line-height:1.8;color:#718096;max-width:600px;margin:0}
.hero-meta{margin-top:28px;display:flex;align-items:center;gap:12px;font-size:9px;font-weight:800;letter-spacing:1.35px;color:#8792a0}
.meta-icon{width:25px;height:25px;border:1px solid #dce2e9;border-radius:7px;display:grid;place-items:center;color:#9a7a50;font-size:15px}
.meta-line{width:35px;height:1px;background:#d8dfe7}
.applications{padding:28px 0 72px;border-top:1px solid var(--line)}
.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:23px;gap:20px}
.section-kicker{font-size:9px;color:#a1845f}
h2{font:800 24px Manrope,sans-serif;letter-spacing:-.7px;margin:7px 0 0;color:var(--navy)}
.search-box{height:42px;width:min(260px,100%);display:flex;align-items:center;gap:9px;padding:0 13px;background:white;border:1px solid #e4e9ef;border-radius:9px}
.search-box svg{width:16px;height:16px;fill:none;stroke:#8793a1;stroke-width:1.8;stroke-linecap:round}
.search-box input{border:0;outline:0;background:transparent;width:100%;font:12px 'DM Sans',sans-serif;color:var(--ink)}
.search-box:focus-within{border-color:#9a7a50;box-shadow:0 0 0 3px #9a7a5015}
.menu-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.menu-card{position:relative;min-height:190px;background:white;border:1px solid #e8edf2;border-radius:13px;padding:20px 19px 18px;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.menu-card:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--accent)}
.menu-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px #1c30450f;border-color:#d9e0e8}
.menu-card:focus-visible{outline:3px solid #b78c54;outline-offset:3px}
.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.icon-wrap{width:43px;height:43px;border-radius:11px;background:var(--tint);display:grid;place-items:center;color:var(--accent)}
.icon-wrap svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.open-icon{font-size:18px;color:#aab3bf;transition:color .2s,transform .2s}
.menu-card:hover .open-icon{color:var(--accent);transform:translate(2px,-2px)}
.card-index{font-size:9px;letter-spacing:1.35px;font-weight:800;color:#9aa5b2;margin-bottom:8px}
.menu-card strong{font:700 15px/1.4 Manrope,sans-serif;color:#1c2e43}
.card-description{font-size:11px;line-height:1.55;color:#85909d;margin-top:7px}
.tone-blue{--accent:#477aa9;--tint:#eaf1f8}.tone-green{--accent:#398a73;--tint:#e8f3ef}.tone-orange{--accent:#b78242;--tint:#f8f0e5}.tone-purple{--accent:#796ca8;--tint:#f0edf8}.tone-rose{--accent:#b66d7c;--tint:#f8ecef}.tone-teal{--accent:#398c91;--tint:#e8f4f4}.tone-slate{--accent:#66798f;--tint:#edf1f5}
.empty-state{padding:28px;text-align:center;color:#718096;font-size:13px;background:white;border:1px dashed #d9e0e8;border-radius:12px}
footer{border-top:1px solid var(--line);min-height:70px;display:flex;justify-content:space-between;align-items:center;gap:15px;color:#9aa4b0;font-size:9px;letter-spacing:1.1px;font-weight:700}
footer b{color:#b78c54;padding:0 5px}
@media(max-width:1050px){.menu-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.page-shell{padding:0 4%}}
@media(max-width:700px){.topbar{height:74px}.hero{padding:48px 0 36px}h1{letter-spacing:-1.5px}.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.menu-card{min-height:178px;padding:16px 14px}.card-top{margin-bottom:18px}.menu-card strong{font-size:13px}.card-description{font-size:10px}.section-heading{align-items:start;flex-direction:column}.search-box{width:100%}footer{align-items:flex-start;justify-content:center;flex-direction:column;padding:18px 0;gap:7px}}
@media(max-width:380px){.menu-grid{grid-template-columns:1fr}.menu-card{min-height:155px}.card-top{margin-bottom:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}