:root {
    --kozaru-black: #050505;
    --kozaru-ink: #111111;
    --kozaru-charcoal: #1a1a1a;
    --kozaru-crimson: #c5161d;
    --kozaru-crimson-dark: #8f1016;
    --kozaru-white: #ffffff;
    --kozaru-bone: #f7f4ef;
    --kozaru-grey: #77716a;
    --kozaru-border: rgba(0, 0, 0, 0.12);
    --kozaru-border-light: rgba(255, 255, 255, 0.14);
    --kozaru-shadow: 0 16px 48px rgba(0, 0, 0, 0.12);
    --kozaru-shadow-soft: 0 10px 28px rgba(0, 0, 0, 0.08);
    --kozaru-radius: 8px;
    --kozaru-radius-sm: 6px;
    --kozaru-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --kozaru-display: "Arial Black", Impact, var(--kozaru-font);
    --kozaru-max: 1180px;
    --kozaru-wide: 1360px;
    --tatami-site-bg: var(--kozaru-bone);
    --tatami-site-text: var(--kozaru-ink);
    --tatami-surface: var(--kozaru-white);
    --tatami-surface-alt: var(--kozaru-bone);
    --tatami-border: var(--kozaru-border);
    --tatami-header-bg: var(--kozaru-black);
    --tatami-header-text: var(--kozaru-white);
    --tatami-header-link: rgba(255, 255, 255, 0.86);
    --tatami-header-muted: rgba(255, 255, 255, 0.68);
    --tatami-header-border: rgba(255, 255, 255, 0.12);
    --tatami-header-hover: rgba(255, 255, 255, 0.09);
    --tatami-header-button-border: rgba(255, 255, 255, 0.44);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
    margin: 0;
    background: var(--tatami-site-bg);
    color: var(--tatami-site-text);
    font-family: var(--kozaru-font);
    font-size: 16px;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
}

a {
    color: var(--kozaru-crimson);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
}

a:hover,
a:focus {
    color: var(--kozaru-crimson-dark);
}

img,
svg,
video {
    max-width: 100%;
    height: auto;
}

button,
input,
textarea,
select {
    font: inherit;
}

button,
a,
input,
textarea,
select {
    outline-offset: 3px;
}

:focus-visible {
    outline: 3px solid var(--kozaru-crimson);
}

.screen-reader-text,
.skip-link {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.skip-link:focus {
    z-index: 99999;
    top: 1rem;
    left: 1rem;
    width: auto;
    height: auto;
    padding: 0.75rem 1rem;
    background: var(--kozaru-white);
    color: var(--kozaru-ink);
    clip: auto;
    border: 2px solid var(--kozaru-crimson);
    border-radius: var(--kozaru-radius);
    box-shadow: var(--kozaru-shadow-soft);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: inherit;
    line-height: 1.1;
    letter-spacing: 0;
}

h1,
h2 {
    font-family: var(--kozaru-display);
    font-weight: 900;
}

p {
    margin-top: 0;
}

.kozaru-eyebrow {
    margin: 0 0 0.75rem;
    color: var(--kozaru-crimson);
    font-size: 0.8rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.kozaru-brand-image {
    display: block;
    width: auto;
    height: auto;
}


body.tatami-scheme-white-on-black {
    --tatami-site-bg: var(--kozaru-black);
    --tatami-site-text: var(--kozaru-white);
    --tatami-surface: var(--kozaru-ink);
    --tatami-surface-alt: var(--kozaru-black);
    --tatami-border: rgba(255, 255, 255, 0.16);
    --tatami-header-bg: var(--kozaru-black);
    --tatami-header-text: var(--kozaru-white);
    --tatami-header-link: rgba(255, 255, 255, 0.86);
    --tatami-header-muted: rgba(255, 255, 255, 0.68);
    --tatami-header-border: rgba(255, 255, 255, 0.14);
    --tatami-header-hover: rgba(255, 255, 255, 0.1);
    --tatami-header-button-border: rgba(255, 255, 255, 0.46);
}

body.tatami-scheme-black-on-white {
    --tatami-site-bg: var(--kozaru-white);
    --tatami-site-text: var(--kozaru-black);
    --tatami-surface: var(--kozaru-white);
    --tatami-surface-alt: #f3f3f3;
    --tatami-border: rgba(0, 0, 0, 0.14);
    --tatami-header-bg: var(--kozaru-white);
    --tatami-header-text: var(--kozaru-black);
    --tatami-header-link: rgba(0, 0, 0, 0.82);
    --tatami-header-muted: rgba(0, 0, 0, 0.58);
    --tatami-header-border: rgba(0, 0, 0, 0.13);
    --tatami-header-hover: rgba(0, 0, 0, 0.06);
    --tatami-header-button-border: rgba(0, 0, 0, 0.26);
}

body.tatami-scheme-classic {
    --tatami-site-bg: var(--kozaru-bone);
    --tatami-site-text: var(--kozaru-ink);
    --tatami-surface: var(--kozaru-white);
    --tatami-surface-alt: var(--kozaru-bone);
    --tatami-border: var(--kozaru-border);
    --tatami-header-bg: var(--kozaru-black);
    --tatami-header-text: var(--kozaru-white);
    --tatami-header-link: rgba(255, 255, 255, 0.86);
    --tatami-header-muted: rgba(255, 255, 255, 0.68);
    --tatami-header-border: rgba(255, 255, 255, 0.12);
    --tatami-header-hover: rgba(255, 255, 255, 0.09);
    --tatami-header-button-border: rgba(255, 255, 255, 0.44);
}

.is-style-tatami-white-on-black,
.tatami-colour-white-on-black {
    color: var(--kozaru-white);
    background: var(--kozaru-black);
}

.is-style-tatami-black-on-white,
.tatami-colour-black-on-white {
    color: var(--kozaru-black);
    background: var(--kozaru-white);
}

.is-style-tatami-white-on-black a,
.tatami-colour-white-on-black a {
    color: var(--kozaru-white);
}

.is-style-tatami-black-on-white a,
.tatami-colour-black-on-white a {
    color: var(--kozaru-black);
}