/*
 * SWRC Corporate Site - Design Tokens
 * References: Yamacs (Layout/Whitespace) + n-ssi.co.jp (SBI Minimal Color)
 * Direction: Trust / Safety / Expertise
 */

:root {
    /* === Brand Colors === */
    --color-primary: #1a1a2e;
    --color-primary-light: #2d2d44;
    --color-primary-dark: #0f0f1a;
    --color-accent: #c41e3a;
    --color-accent-light: #d93251;
    --color-accent-subtle: rgba(196, 30, 58, 0.06);

    /* === Neutral Scale === */
    --color-text: #1a1a1a;
    --color-text-secondary: #64748b;
    --color-text-tertiary: #94a3b8;
    --color-border: #e2e8f0;
    --color-border-light: #f1f5f9;
    --color-bg: #f5f5f7;
    --color-bg-subtle: #f8fafc;
    --color-bg-muted: #f1f5f9;

    /* === Typography === */
    --font-display: 'Poppins', 'Noto Sans JP', sans-serif;
    --font-body: 'Gothic MB101', 'Noto Sans JP', sans-serif;
    --letter-spacing-tight: -0.02em;
    --letter-spacing-normal: 0.01em;
    --letter-spacing-wide: 0.08em;
    --letter-spacing-wider: 0.15em;

    /* === Shadows === */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06), 0 2px 4px rgba(0, 0, 0, 0.02);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.03);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.1), 0 8px 20px rgba(0, 0, 0, 0.04);
    --shadow-hover: 0 16px 48px rgba(0, 0, 0, 0.08), 0 6px 16px rgba(0, 0, 0, 0.03);

    /* === Border Radius === */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-full: 9999px;

    /* === Compatibility aliases (subpage inline styles) === */
    /* 旧デザインのCSS変数名との互換用。新規コードでは --color-* 系を使うこと */
    --white: #ffffff;
    --primary-color: #1a1a2e;
    --text-color: #1a1a1a;
    --border-color: #e2e8f0;
    /* === Transitions === */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: 0.2s var(--ease-out);
    --transition-base: 0.4s var(--ease-out);
    --transition-slow: 0.6s var(--ease-out);
    --transition-slower: 0.8s var(--ease-out);
}