/* ===== Base ===== */
:root {
  --bg: #fdfcf7;      /* 背景：柔らかいベージュ */
  --fg: #2c2c2c;      /* 文字：濃いグレーで目に優しい */
  --muted: #555555;   /* サブテキスト：落ち着いたトーン */
  --line: #e0ddd5;    /* 区切り線：淡いベージュ寄り */
  --accent: #d97706;  /* 強調色：温かみのあるオレンジ */
}

/* ダークモード切替は削除してライト固定 */



*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font); line-height:1.7; color:var(--fg); background:var(--bg);}

/* ===== Layout ===== */
.wrap{max-width:980px; margin:0 auto; padding:var(--space);}
header{position:sticky; top:0; background:var(--bg); border-bottom:1px solid var(--line); z-index:10;}
.brand{font-weight:700; letter-spacing:.2px}
nav{display:flex; align-items:center; gap:16px; padding:12px 0;}
.nav-right{margin-left:auto; display:flex; gap:12px;}
.lang{font-size:14px; color:var(--muted)}
.lang a{color:inherit; text-decoration:none}
main{padding:32px 0;}
section{margin:40px 0;}
footer{border-top:1px solid var(--line); padding:16px 0; color:var(--muted); font-size:14px}

/* ===== Typography ===== */
h1{font-size:clamp(28px,4vw,36px); margin:.2em 0;}
h2{font-size:clamp(20px,3vw,24px); margin:1.2em 0 .5em;}
p,li{font-size:16px}
ul{padding-left:1.2em}

/* ===== Buttons ===== */
.btn{display:inline-block; padding:10px 16px; border-radius:var(--radius); text-decoration:none; transition:.15s}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--accent); color:#fff; border:1px solid transparent}
.btn.ghost{border:1px solid var(--fg); color:var(--fg)}

/* ===== Cards (任意) ===== */
.card{border:1px solid var(--line); border-radius:var(--radius); padding:18px}

/* ===== Links ===== */
a{color:var(--accent); text-underline-offset:2px}
nav a{color:var(--fg); text-decoration:none}