/* Variables, reset, typography */
:root {
    --color-bg: #f8f9fa;
    --color-text: #111111;
    --color-text-light: #666666;
    --color-border: #e0e0e0;
    --color-border-dark: #111111;
    --color-white: #ffffff;
    --color-accent: #000000;

    /* Previous: --font-en: 'Inter', sans-serif; */
    /* Previous: --font-ja: 'Inter', 'Noto Sans JP', sans-serif; */
    --font-en: "Noto Sans JP", Helvetica, Arial, ヒラギノ角ゴ, 游ゴシック, メイリオ, sans-serif;
    --font-ja: "Noto Sans JP", Helvetica, Arial, ヒラギノ角ゴ, 游ゴシック, メイリオ, sans-serif;

    --container-width: 1400px;
    --padding-x: 5vw;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-ja);
    color: var(--color-text);
    background-color: var(--color-bg);
    line-height: 1.6;
    font-size: 16px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: inherit;
    text-decoration: none;
    transition: opacity 0.3s ease;
}

a:hover {
    opacity: 0.6;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

/* Prevent WordPress layout from shrinking the front-page hero */
main {
    display: block;
}