@charset "utf-8";

:root {
  --df-color-bg: #f7f8f6;
  --df-color-surface: #eef3ee;
  --df-color-surface-strong: #e8eff3;
  --df-color-text: #203447;
  --df-color-muted: #566776;
  --df-color-line: #d6dfdd;
  --df-color-primary: #253f54;
  --df-color-primary-hover: #162e42;
  --df-color-on-primary: #ffffff;
  --df-color-accent: #ed762a;
  --df-color-accent-dark: #b74f13;
  --df-font-sans: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --df-font-serif: "Noto Serif JP", "Yu Mincho", serif;
  --df-font-body: "Zen Kaku Gothic New", var(--df-font-sans);
  --df-font-heading: var(--df-font-sans);
  --df-font-display: var(--df-font-heading);
  --df-font-size-display: clamp(36px, 3.5vw, 54px);
  --df-font-size-h1: clamp(34px, 3.6vw, 44px);
  --df-font-size-h2: clamp(26px, 2.35vw, 36px);
  --df-font-size-h3: clamp(20px, 2vw, 28px);
  --df-font-size-body: 16px;
  --df-font-size-caption: 13px;
  --df-font-weight-heading: 800;
  --df-line-height-heading: 1.4;
  --df-line-height-body: 1.85;
  --df-letter-spacing-heading: -.035em;
  --df-letter-spacing-body: .01em;
  --df-content-max: 1200px;
  --df-gutter: clamp(20px, 4vw, 72px);
  --df-space-xs: 8px;
  --df-space-sm: 16px;
  --df-space-md: 24px;
  --df-space-lg: 40px;
  --df-space-xl: 64px;
  --df-section-space: clamp(58px, 6vw, 82px);
  --df-section-space-compact: clamp(40px, 5vw, 64px);
  --df-card-grid-gap: clamp(16px, 2vw, 32px);
  --df-radius: 8px;
  --df-radius-control: 999px;
  --df-radius-panel: 8px;
  --df-shadow-card: 10px 10px 0 #dce8e5;
  --df-shadow-floating: 0 16px 40px rgb(31 41 51 / 12%);
  --df-transition-duration: 180ms;
  --df-transition-easing: ease;
}