:root{color-scheme:dark}

html{scroll-behavior:smooth}

body{font-size:16px}

.navlink{display:inline-flex;align-items:center;justify-content:center;border-radius:0.75rem;padding:0.5rem 0.75rem;font-size:0.95rem;font-weight:600;color:rgb(226 232 240);transition:background-color .2s ease,color .2s ease,transform .2s ease}
.navlink:hover{background-color:rgba(255,255,255,.08);color:#fff}
.navlink:focus{outline:2px solid rgba(94,234,212,.7);outline-offset:2px}

.mobilelink{display:flex;align-items:center;justify-content:center;border-radius:0.9rem;padding:0.9rem 1rem;font-size:1.5rem;line-height:1.25;font-weight:700;color:#fff;background-color:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);transition:transform .2s ease,background-color .2s ease,opacity .2s ease}
.mobilelink:hover{background-color:rgba(255,255,255,.10);transform:translateY(-1px)}
.mobilelink:focus{outline:2px solid rgba(94,234,212,.7);outline-offset:2px}

.card{border-radius:1rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);padding:1.25rem;box-shadow:0 10px 30px rgba(2,6,23,.12);transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}
.card:hover{transform:translateY(-2px);background:rgba(255,255,255,.06);box-shadow:0 18px 44px rgba(2,6,23,.18)}
.card:focus-within{outline:2px solid rgba(94,234,212,.7);outline-offset:2px}

.cardIcon{display:inline-flex;height:2.75rem;width:2.75rem;align-items:center;justify-content:center;border-radius:0.9rem;border:1px solid rgba(255,255,255,.10)}
.cardTitle{margin-top:0.75rem;font-family:ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;font-size:1.25rem;line-height:1.4;color:#fff}
.cardText{margin-top:0.5rem;font-size:0.95rem;line-height:1.6;color:rgb(226 232 240)}
.cardLink{margin-top:0.9rem;display:inline-flex;align-items:center;gap:0.4rem;font-size:0.95rem;font-weight:700;color:rgb(153 246 228);text-decoration:none}
.cardLink:hover{color:#fff}
.cardLink:focus{outline:2px solid rgba(94,234,212,.7);outline-offset:2px;border-radius:0.5rem}

.footerlink{color:rgb(203 213 225);text-decoration:none;transition:color .2s ease}
.footerlink:hover{color:#fff}
.footerlink:focus{outline:2px solid rgba(94,234,212,.7);outline-offset:2px;border-radius:0.5rem}

*:focus-visible{outline:2px solid rgba(94,234,212,.7);outline-offset:2px}

img{max-width:100%;height:auto;display:block}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.navlink,.mobilelink,.card{transition:none}}