:root{color-scheme:light;--navy:#061f60;--ink:#172746;--muted:#526079;--paper:#f8f5ef;--line:#dbd8d1}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 system-ui,sans-serif}
a{color:inherit}
:focus-visible{outline:2px solid var(--navy);outline-offset:4px}
.skip{position:absolute;top:.5rem;left:1rem;z-index:2;padding:.6rem;background:white;transform:translateY(-200%)}
.skip:focus{transform:none}
header{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.45rem max(1rem,calc((100% - 74rem)/2));background:rgba(248,245,239,.96);border-bottom:1px solid var(--line)}
@supports (backdrop-filter:blur(12px)){header{background:rgba(248,245,239,.86);backdrop-filter:blur(12px)}}
@media (prefers-reduced-transparency:reduce){header{background:var(--paper);backdrop-filter:none}}
header nav{display:flex;gap:clamp(.25rem,2vw,1rem)}
header a{min-height:44px;display:flex;align-items:center;padding:.25rem;text-decoration:none;font-size:.875rem;font-weight:600}
header a:hover{text-decoration:underline}
.brand img{display:block;width:clamp(95px,22vw,145px);height:auto}
main{max-width:76rem;margin:auto;padding:clamp(1.5rem,4vw,3.5rem) 1rem 3rem}
.intro{margin-bottom:2.5rem}
.eyebrow{display:flex;align-items:center;gap:1rem;margin:0 0 .7rem;text-transform:uppercase;letter-spacing:.13em;font-size:.76rem;font-weight:650}
#demo{background:#ece1ce;color:#513921;padding:.2rem .5rem;border-radius:6px;letter-spacing:.06em}
h1{font:400 clamp(2.2rem,5vw,4.8rem)/1.02 Georgia,serif;letter-spacing:-.045em;margin:0;color:var(--navy)}
.intro h1+p{margin:.8rem 0 1.6rem;color:var(--muted)}
label{display:block;font-weight:600;font-size:.875rem;margin-bottom:.3rem}
input{width:min(100%,24rem);min-height:46px;border:1px solid #9ba1aa;border-radius:12px;padding:.55rem .75rem;background:white;color:var(--ink);font:inherit}
section+section{margin-top:2rem}
h2{font-size:1.14rem;margin:0 0 .65rem}
ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:.55rem;padding:0;margin:0}
li a{min-height:51px;height:100%;display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.65rem .85rem;border:1px solid var(--line);border-radius:12px;background:#fff;text-decoration:none;font-weight:600}
li a:hover{border-color:#949faf;background:#fdfbf7;color:var(--navy)}
li a span{color:var(--muted)}
@media(max-width:360px){header{padding-inline:.65rem}header nav{gap:.2rem}header a{font-size:.78rem}}