/* Selected palette/type. Spacing, timing and layout values are recommended starting points. */
@font-face {font-family:Manrope;src:url('../fonts/Manrope-Medium-500.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap;}
:root {
 --color-bg:#111210; --color-text:#F5F4EE; --color-accent:#D99067;
 --color-muted:#A5A79F; --font-sans:Manrope,Arial,sans-serif;
 --space-1:4px; --space-2:8px; --space-3:16px; --space-4:24px;
 --space-5:40px; --space-6:64px; --space-7:96px;
 --page-gutter:clamp(24px,4vw,64px); --content-max:1440px;
}
body {margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);font-weight:500;line-height:1.5;}
a,button {color:inherit;}
.interactive {transition:color 160ms ease;}
@media(hover:hover) {.interactive:hover {color:var(--color-accent);}}
.interactive:active {color:var(--color-accent);}
.interactive:focus-visible {color:var(--color-accent);outline:2px solid var(--color-accent);outline-offset:5px;}
.text-link:hover {text-decoration:underline;text-underline-offset:.2em;}
.icon-button {min-width:44px;min-height:44px;}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after {scroll-behavior:auto!important;animation:none!important;transition:none!important;}}
/* JS must also respect reduced motion: use a still poster, no automatic reel playback. */