/* Kok Tutoring: overrides on top of the Classical design system (scheme 1c, navy and brass).
   Carried over from the <helmet> of the Claude Design export. Tokens: design/HANDOFF.md, section 7. */
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
:root {
  --color-bg: #f4f3f0; --color-surface: #e9e7e1; --color-text: #1a2233; --color-accent: #2c4466; --color-accent-2: #a77c3a;
  --color-divider: color-mix(in srgb, #1a2233 16%, transparent);
  --color-neutral-100: #f7f6f3; --color-neutral-200: #e9e7e1; --color-neutral-300: #d4d4d2; --color-neutral-400: #b5b8bd; --color-neutral-500: #959aa3; --color-neutral-600: #777d88; --color-neutral-700: #5a616d; --color-neutral-800: #3f4653; --color-neutral-900: #262d3a;
  --color-accent-100: #eef2f8; --color-accent-200: #d7e0ed; --color-accent-300: #b3c3db; --color-accent-400: #849dc0; --color-accent-500: #5a77a0; --color-accent-600: #3e5a82; --color-accent-700: #2c4466; --color-accent-800: #1f3250; --color-accent-900: #142238;
  --color-accent-2-100: #fbf3e6; --color-accent-2-200: #f2e0c2; --color-accent-2-300: #e2c592; --color-accent-2-400: #c9a264; --color-accent-2-500: #a77c3a; --color-accent-2-600: #8a6429; --color-accent-2-700: #6c4d1e; --color-accent-2-800: #4f3815; --color-accent-2-900: #34250e;
}
body { margin: 0; text-wrap: pretty; background: var(--color-bg); overflow-x: clip; }
.plate { border-color: var(--color-accent-2) !important; }
@media (max-width: 859px) { .btn { min-height: 44px; } .card-kicker { font-size: 12px !important; } footer a { display: inline-flex; align-items: center; min-height: 44px; } }
a { color: var(--color-accent-700); text-decoration-color: var(--color-accent); text-underline-offset: 3px; }
a:hover { color: var(--color-accent-900); }
summary::-webkit-details-marker { display: none; }

/* Links styled as buttons keep their button colors */
a.btn-primary, a.btn-primary:hover { color: var(--color-accent); }
a.btn-secondary, a.btn-secondary:hover { color: var(--color-text); }

/* Skip link: off screen until focused */
.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 10; padding: 10px 16px; background: var(--color-surface); border: 1px solid var(--color-accent); border-radius: var(--radius-sm); color: var(--color-text); }
.skip-link:focus { left: 16px; }
#main:focus { outline: none; }

/* Header: full menu at 1000px and up, menu button below */
.nav-wide { display: flex; flex-wrap: nowrap; gap: 28px; align-items: center; margin-left: auto; }
.nav-mobile { flex-basis: 100%; display: flex; flex-direction: column; border-top: 1px solid var(--color-divider); padding-bottom: 16px; }
.nav-mobile[hidden] { display: none; }
@media (max-width: 999px) { .nav-wide { display: none; } }
@media (min-width: 1000px) { .nav-toggle, .nav-mobile { display: none !important; } }

/* Book page: calendar spans two columns at 760px and up */
@media (min-width: 760px) { .cal-col { grid-column: span 2; } }
