/* Accessible, high-contrast, responsive style sheet
   - Designed for good NVDA/LR screen-reader experience and high Lighthouse/accessibility scores
   - Includes: readable type, clear focus styles, skip-link, responsive layout, reduced-motion support
*/
:root{
  --bg: #ffffff;
  --text: #0b0b0b;
  --muted: #444444;
  --brand: #0b66ff; /* link / primary */
  --brand-dark: #084bb5;
  --success: #0a8a3e;
  --error: #c92a2a;
  --accent: #ffb703;
  --max-width: 980px;
  --gap: 1rem;
}

/* Base */
*{box-sizing:border-box}
html{font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; font-size:18px; line-height:1.45; background:var(--bg); color:var(--text);}
body{margin:0; padding:0 1rem; -webkit-font-smoothing:antialiased;}

/* Utility: visually-hidden for screen readers */
.visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;border:0;padding:0;margin:-1px}

/* Skip link (visible on keyboard focus) */
.skip-link{position:absolute;left:1rem;top:1rem;background:var(--brand);color:#fff;padding:0.5rem .75rem;border-radius:4px;z-index:1000;transform:translateY(-120%);transition:transform .18s ease;}
.skip-link:focus{transform:translateY(0);}

/* Layout container */
.container{max-width:var(--max-width);margin:0 auto;padding:1.25rem;}

/* Headings */
h1,h2,h3,h4{color:var(--text);margin:0 0 .5rem;font-weight:600}
h1{font-size:2rem}
h2{font-size:1.5rem}
@media (min-width:900px){h1{font-size:2.4rem}h2{font-size:1.8rem}}

p{margin:0 0 1rem;color:var(--muted)}

/* Links */
a{color:var(--brand);text-decoration:underline;text-decoration-thickness:1px}
a:hover,a:focus{color:var(--brand-dark)}

/* Focus styles (only show when keyboard navigating) */
:focus{outline:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* Buttons */
button, .btn{display:inline-block;padding:.5rem .9rem;border-radius:6px;border:2px solid transparent;background:var(--brand);color:#fff;cursor:pointer;font-weight:600}
button:hover, .btn:hover{background:var(--brand-dark)}
button:disabled, .btn[disabled]{opacity:.5;cursor:not-allowed}

/* Forms */
label{display:block;margin-bottom:.25rem;font-weight:600}
input[type="text"], input[type="email"], textarea, select{width:100%;padding:.5rem .65rem;border:1px solid #cfcfcf;border-radius:6px;background:#fff;color:var(--text)}
input:focus, textarea:focus, select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(11,102,255,0.12)}

/* Accessible tables */
table{width:100%;border-collapse:collapse;margin-bottom:1rem}
th,td{padding:.5rem .75rem;border:1px solid #e6e6e6;text-align:left}
th{background:#f7f7f7;font-weight:700}
caption{caption-side:top;text-align:left;padding:.25rem 0;font-size:.95rem}

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

/* Cards */
.card{background:#fff;border:1px solid #e9e9e9;border-radius:10px;padding:1rem;margin-bottom:1rem;box-shadow:0 1px 2px rgba(15,15,15,0.03)}

/* Navigation */
.nav{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.nav a{padding:.4rem .6rem;border-radius:6px}

/* Footer */
.footer{font-size:.9rem;color:var(--muted);padding:1rem 0;border-top:1px solid #f0f0f0}

/* Responsive helpers */
.row{display:flex;flex-wrap:wrap;margin:calc(-1 * var(--gap)) 0}
.col{padding:var(--gap)}
.col-1{flex:1 1 100%}
@media(min-width:700px){.col-2{flex:1 1 50%}}

/* High-contrast mode support for users who prefer it */
@media (prefers-contrast: more){
  :root{--text:#000;--muted:#222;--brand:#0047bb}
  body{background:#fff}
  .card{border-color:#cfcfcf}
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* Small-screen improvements */
@media (max-width:420px){html{font-size:17px}h1{font-size:1.6rem}}

/* Helpful utility classes */
.center{text-align:center}
.muted{color:var(--muted)}
.small{font-size:.95rem}

/* Ensure visible focus on interactive elements like links inside lists */
a:focus-visible, button:focus-visible, input:focus-visible{box-shadow:0 0 0 3px rgba(11,102,255,0.12);border-radius:6px}

/* Make skip link tabbable early for NVDA users */
a.skip-link{top:0}