html {font-size:16px}
body {font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;min-height:100%}
img, picture, svg {max-width:100%;height:auto;display:block}
.container img {object-fit:cover}
:focus {outline:none}
:focus-visible {outline:2px solid transparent;box-shadow:0 0 0 4px rgba(34,197,94,0.12);border-radius:8px}
a:focus-visible, button:focus-visible {box-shadow:0 0 0 4px rgba(59,130,246,0.14);border-radius:8px}
header a:focus-visible {box-shadow:0 0 0 4px rgba(125,211,252,0.10)}
#mobileMenu {transition:opacity .28s ease,transform .28s ease}
#mobileMenu.hidden {opacity:0;transform:translateY(-6px);pointer-events:none}
#mobileMenu.visible {opacity:1;transform:translateY(0)}
.slide-in {animation:slide-in 360ms cubic-bezier(.2,.8,.2,1) both}
@keyframes slide-in {0% {transform:translateY(10px);opacity:0}100% {transform:translateY(0);opacity:1}}
.lock-scroll {overflow:hidden;height:100vh}
.button-disabled {opacity:.5;pointer-events:none}
.cookie-enter {animation:cookie-in .36s cubic-bezier(.2,.8,.2,1) both}
@keyframes cookie-in {0% {transform:translateY(8px) scale(.98);opacity:0}100% {transform:translateY(0) scale(1);opacity:1}}
.card-hover {transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s}
.card-hover:hover {transform:translateY(-6px);box-shadow:0 12px 30px rgba(2,6,23,0.08)}
.iconify {display:inline-block;vertical-align:middle}
.visually-hidden {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce) { .slide-in,.cookie-enter,.card-hover {transition:none;animation:none} }
@media (max-width:640px) { .container {padding-left:1rem;padding-right:1rem} header .h-16 {height:56px} }
/* Accessibility: ensure minimum text contrast on dark backgrounds */
.bg-dark-safe {color:rgba(255,255,255,0.95)}
/* Utility to ensure image containers cannot overflow their parent */
.img-frame {overflow:hidden;border-radius:16px}
/* Ensure headings scale reasonably on small screens */
h1 {font-family:Merriweather,Georgia,serif;font-size:1.625rem}
@media (min-width:768px) { h1 {font-size:2.25rem} }
h2 {font-family:Merriweather,Georgia,serif;font-size:1.25rem}
button[aria-disabled="true"] {pointer-events:none;opacity:.6}
