/*
 * JiMEAS/Werth design system foundation layer.
 *
 * This file defines the approved runtime foundation vocabulary for future
 * theme integration. It is intentionally not enqueued yet, so updating it
 * should not change existing homepage or page rendering.
 */

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src:
    local("S-Core Dream Thin"),
    local("SCDream1"),
    url("../fonts/s-core-dream/s-core-dream-100.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src:
    local("S-Core Dream ExtraLight"),
    local("SCDream2"),
    url("../fonts/s-core-dream/s-core-dream-200.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src:
    local("S-Core Dream Light"),
    local("SCDream3"),
    url("../fonts/s-core-dream/s-core-dream-300.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    local("S-Core Dream Regular"),
    local("SCDream4"),
    url("../fonts/s-core-dream/s-core-dream-400.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src:
    local("S-Core Dream Medium"),
    local("SCDream5"),
    url("../fonts/s-core-dream/s-core-dream-500.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src:
    local("S-Core Dream Bold"),
    local("SCDream6"),
    url("../fonts/s-core-dream/s-core-dream-600.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    local("S-Core Dream ExtraBold"),
    local("SCDream7"),
    url("../fonts/s-core-dream/s-core-dream-700.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src:
    local("S-Core Dream Heavy"),
    local("SCDream8"),
    url("../fonts/s-core-dream/s-core-dream-800.otf") format("opentype");
}

@font-face {
  font-family: "S-Core Dream";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src:
    local("S-Core Dream Black"),
    local("SCDream9"),
    url("../fonts/s-core-dream/s-core-dream-900.otf") format("opentype");
}

:root {
  /* Brand */
  --color-primary-900: #0c2340;
  --color-secondary-600: #18489c;
  --color-accent-500: #00a3e0;

  /* Neutral */
  --color-neutral-900: #191b23;
  --color-neutral-700: #434655;
  --color-neutral-600: #5a6776;
  --color-neutral-500: #a5acb2;
  --color-neutral-400: #9da5ab;
  --color-neutral-300: #9cb6d1;
  --color-neutral-200: #d3dce8;
  --color-neutral-100: #F8F9FC;
  /* --color-neutral-100: #f5f7fa; */

  /* Background / Surface */
  --color-bg-base: #ffffff;
  --color-bg-subtle: #F8F9FC;
  /* --color-bg-subtle: #f5f7fa; */
  --color-bg-dark: #0c2340;
  --color-surface-base: #ffffff;
  --color-surface-subtle: #F8F9FC;
  /* --color-surface-subtle: #f5f7fa; */
  --color-surface-dark: #0c2340;
  --color-surface-inverse: #2e3039;

  /* Text */
  --color-text-primary: #0c2340;
  --color-text-strong: #191b23;
  --color-text-secondary: #434655;
  --color-text-muted: #a5acb2;
  --color-text-on-dark: #ffffff;
  --color-text-on-dark-sub: #9cb6d1;
  --color-text-link: #0081c9;
  --color-text-accent: #00a3e0;

  /* Border */
  --color-border-default: #a5acb2;
  --color-border-subtle: #d3dce8;
  --color-border-strong: #9da5ab;
  --color-border-on-dark: rgba(255, 255, 255, 0.2);

  /* Interaction */
  --color-focus-ring: #00a3e0;
  --color-cta-primary-bg: #00a3e0;
  --color-cta-primary-text: #ffffff;
  --color-cta-secondary-bg: #0c2340;
  --color-cta-secondary-text: #ffffff;
  --color-link-default: #0081c9;
  --color-link-hover: #00a3e0;

  /* Status */
  --color-status-info: #0081c9;
  --color-status-success: #1f7a4d;
  --color-status-warning: #bc4800;
  --color-status-error: #b32020;

  /* Partner / Service Exceptions */
  --color-kakao: #fae100;
  --color-kakao-text: #191600;

  /* Typography / Families */
  --font-family-en: "Space Grotesk", "Noto Sans KR", "Inter", Arial, sans-serif;
  --font-family-ko: "Noto Sans KR", sans-serif;
  --font-family-mixed: "Space Grotesk", "Noto Sans KR", "Inter", Arial, sans-serif;

  /* Typography / Weights */
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Typography / Display */
  --font-size-display: 4.5rem;
  --line-height-display: 1.05;
  --letter-spacing-display: 0;

  /* Typography / Headings */
  --font-size-h1: 3.5rem;
  --line-height-h1: 1.08;
  --letter-spacing-h1: 0;
  --font-size-h2: 2.75rem;
  --line-height-h2: 1.12;
  --letter-spacing-h2: 0;
  --font-size-h3: 2rem;
  --line-height-h3: 1.18;
  --letter-spacing-h3: 0;
  --font-size-h4: 1.5rem;
  --line-height-h4: 1.25;
  --letter-spacing-h4: 0;

  /* Typography / Body */
  --font-size-body: 1rem;
  --line-height-body: 1.65;
  --letter-spacing-body: 0;
  --font-size-small: 0.875rem;
  --line-height-small: 1.55;
  --letter-spacing-small: 0;
  --font-size-caption: 0.75rem;
  --line-height-caption: 1.45;
  --letter-spacing-caption: 0;

  /* Layout / Rail */
  --layout-stage-max: 1440px;
  --layout-content-max: 1216px;
  --layout-content-wide: 1376px;
  --layout-content-standard: 1280px;
  --layout-page-gutter: clamp(32px, 4vw, 72px);
  --layout-page-gutter-fixed: 32px;
  --layout-rail-offset: max(var(--layout-page-gutter), calc(50% - 608px));
  --layout-content-rail: min(calc(100% - var(--layout-page-gutter) - var(--layout-page-gutter)), var(--layout-content-max));

  /* Header / Admin Bar */
  --header-height-desktop: 80px;
  --header-height-mobile: 72px;
  --header-rail-gutter: max(32px, calc((100% - var(--layout-stage-max)) / 2 + 32px));
  --admin-bar-offset-none: 0px;
  --admin-bar-offset-desktop: 32px;
  --admin-bar-offset-mobile: 46px;

  /* Spacing */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-18: 72px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --space-36: 144px;

  /* Radius */
  --radius-none: 0;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Shadow / Elevation */
  --shadow-none: none;
  --shadow-card: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --shadow-soft: 0 1px 1px rgba(0, 0, 0, 0.05);
  --shadow-raised: 0 2px 4px -2px rgba(0, 0, 0, 0.1), 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  --shadow-panel: 0 24px 40px rgba(16, 24, 40, 0.12);
  --shadow-media: 0 40px 80px rgba(0, 0, 0, 0.45);
  --shadow-focus-blue: 0 0 10px rgba(37, 99, 235, 0.4);

  /* Motion */
  --duration-fast: 160ms;
  --duration-base: 180ms;
  --duration-emphasis: 220ms;
  --duration-slow: 420ms;
  --ease-standard: ease;
  --motion-logo-scroll: 32s linear infinite;
  --motion-marquee: 34s linear infinite;

  /* Layer / Effects */
  --z-base: 0;
  --z-raised: 1;
  --z-overlay: 2;
  --z-popover: 3;
  --z-modal: 100;
  --z-header: 80;
  --z-skip-link: 1000;
  --blur-glass-sm: blur(2px);
  --blur-glass: blur(6px);
  --blur-glass-lg: blur(8px);
}

.jw-reg-mark {
  font-size: 0.58em;
  line-height: 0;
  vertical-align: super;
}

.cm-security-honeypot {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}
