/* ==========================================================================
   ADVANCE ver2 — Modern / Clean Preset
   Applied when: theme option design_preset = "modern"

   Clean sans-serif, light backgrounds, generous white space,
   subtle shadows, medium border-radius.
   ========================================================================== */

:root {
  /* Colors */
  --color-primary: #2563eb;
  --color-secondary: #475569;
  --color-accent: #0d9488;
  --color-bg: #ffffff;
  --color-text: #1e293b;
  --color-text-light: #64748b;
  --color-border: #e2e8f0;

  /* Typography */
  --font-family: 'Noto Sans JP', sans-serif;
  --font-weight-heading: 700;
  --font-weight-body: 400;

  /* Spacing */
  --spacing-section-s: clamp(30px, 4vw, 50px);
  --spacing-section-m: clamp(50px, 6vw, 80px);
  --spacing-section-l: clamp(70px, 8vw, 120px);
  --spacing-section-xl: clamp(90px, 10vw, 160px);

  /* Buttons */
  --btn-radius: 8px;
  --btn-padding: 0.8em 2em;
  --btn-font-size: 0.95rem;
  --btn-primary-bg: var(--color-primary);
  --btn-primary-text: #ffffff;
  --btn-secondary-bg: var(--color-secondary);
  --btn-secondary-text: #ffffff;
  --btn-outline-border: var(--color-primary);
  --btn-outline-text: var(--color-primary);
  --btn-text-color: var(--color-primary);

  /* Shadows */
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-card-hover: 0 4px 12px rgba(0, 0, 0, 0.08);

  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
}
