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

html { font-size: 16px; scroll-behavior: smooth; }

body {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    line-height: 1.75;
    color: var(--color-coffee);
    background-color: var(--color-cream);
    -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a   { color: inherit; text-decoration: none; }

.container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 var(--space-sm);
}

.page-main { padding: 4rem 1rem; }
.section { padding: var(--space-lg) 0; }
.section--dark  { background-color: var(--color-brown); color: var(--color-ivory); }
.section--cream { background-color: var(--color-cream); color: var(--color-coffee); }

.section__label {
    font-family: var(--font-serif);
    font-size: var(--text-xs);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--color-coffee);
    margin-bottom: var(--space-xs);
}
.section--dark .section__label {
    color: inherit; /* ivory を section--dark から継承 */
}
.section__heading {
    font-family: var(--font-serif);
    font-size: var(--text-4xl);
    font-weight: 300;
    letter-spacing: 0.05em;
    margin-bottom: var(--space-md);
}
.section__text {
    font-size: var(--text-base);
    line-height: 1.75;
    max-width: 640px;
}
.section__text--gap { margin-top: 1.5em; }

/* 見出し内の任意の行を強制的に改行させないためのユーティリティ */
.nowrap { white-space: nowrap; }
@media (max-width: 480px) {
    .concept .section__heading { font-size: clamp(1.75rem, 8vw, 2.5rem); }
}

.btn {
    display: inline-block;
    padding: 0.75em 2.5em;
    border: 1px solid var(--color-coffee);
    font-family: var(--font-serif);
    font-size: var(--text-sm);
    letter-spacing: 0.1em;
    color: var(--color-coffee);
    cursor: pointer;
    transition: background-color var(--transition-base), color var(--transition-base);
}
.btn:hover {
    background-color: var(--color-coffee);
    color: var(--color-cream);
}
.btn--light {
    border-color: var(--color-offwhite);
    color: var(--color-offwhite);
}
.btn--light:hover {
    background-color: var(--color-offwhite);
    color: var(--color-brown);
}

.divider {
    border: none;
    border-top: 1px solid var(--color-gold);
}
.section--dark .divider {
    border-top-color: rgba(244, 241, 236, 0.55);
}

/* 内部ページ共通ヒーロー（MENU / WORKSPACE / ABOUT / ACCESS） */
.page-hero {
    padding: var(--space-xl) 0 var(--space-lg);
}
.page-hero__title {
    font-family: var(--font-serif);
    font-size: var(--text-4xl);
    font-weight: 300;
    letter-spacing: 0.1em;
    color: var(--color-ivory);
}

/* GSAPアニメーション用初期状態 */
.js-fade {
    opacity: 0;
    transform: translateY(24px);
}