:root {
    --font-body: "Noto Sans JP", "Helvetica Neue", Arial, sans-serif;
    --font-heading: "M PLUS Rounded 1c", "Noto Sans JP", sans-serif;
    --color-text: #1f2933;
    --color-muted: #64748b;
    --color-surface: #ffffff;
    --color-surface-blue: #eef8ff;
    --color-primary: #7dc7eb;
    --color-primary-dark: #2f86b6;
    --color-accent: #f5b86f;
    --color-border: rgba(85, 132, 163, 0.16);
    --shadow-soft: 0 24px 70px rgba(60, 105, 135, 0.16);
    --shadow-card: 0 18px 44px rgba(42, 84, 111, 0.12);
    --radius-large: 32px;
    --radius-medium: 22px;
    --container: 1120px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--color-text);
    font-family: var(--font-body);
    line-height: 1.7;
    background:
        radial-gradient(circle at top left, rgba(219, 244, 255, 0.86), transparent 34rem),
        linear-gradient(180deg, #ffffff 0%, #f8fcff 44%, #ffffff 100%);
}

img {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
select {
    font: inherit;
}

h1,
h2,
h3,
p {
    overflow-wrap: anywhere;
}