:root {
    --red: #C0001A;
    --red-dark: #8B0012;
    --red-light: #E8002A;
    --black: #111111;
    --white: #FFFFFF;
    --gray-light: #F5F5F3;
    --gray-mid: #E0DEDD;
    --gray-dark: #535353;
    --font-display: 'Cormorant Garamond', Georgia, serif;
    --font-sans: 'Noto Sans JP', sans-serif;
    --font-bebas: 'Bebas Neue', sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    background: var(--white);
    color: var(--black);
    font-family: var(--font-sans);
    font-size: 14px;
    font-weight: 300;
    overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--red); }

/* ===================== HEADER ===================== */
.site-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1000;
    background: var(--white);
    border-bottom: 1px solid var(--gray-mid);
}

.header-top {
    background: var(--black);
    color: var(--white);
    font-size: 11px;
    letter-spacing: 0.15em;
    padding: 6px 0;
    text-align: center;
}

.header-main {
    padding: 14px 0;
}

.logo {
    font-family: var(--font-bebas);
    font-size: 2.2rem;
    letter-spacing: 0.08em;
    color: var(--black);
    line-height: 1;
}

.logo span { color: var(--red); }

.header-nav {
    display: flex;
    align-items: center;
    gap: 28px;
}

.header-nav a {
    font-size: 11px;
    letter-spacing: 0.12em;
    font-weight: 500;
    text-transform: uppercase;
    transition: color 0.2s;
}

.header-icons {
    display: flex;
    gap: 18px;
    font-size: 1.1rem;
}

.header-icons a { transition: color 0.2s; }
.header-icons a:hover { color: var(--red); }

/* Section offset for fixed header */
.section-anchor { padding-top: 100px; margin-top: -100px; }