/* ==========================================================================
   GLOBAL TOKENS AND SHARED COMPONENTS
   Loaded on every public page. Keep this file limited to reusable rules.
   ========================================================================== */

:root {
    --sym-color-bg: #ffffff;
    --sym-color-surface: #ffffff;
    --sym-color-surface-soft: #f6f8ff;
    --sym-color-surface-blue: #eef4ff;
    --sym-color-text: #111827;
    --sym-color-muted: #64748b;
    --sym-color-border: #dbe3ef;
    --sym-color-primary: #315ee8;
    --sym-color-primary-hover: #2448c8;
    --sym-color-primary-soft: #edf3ff;
    --sym-color-violet: #7c3aed;
    --sym-color-pink: #db2777;
    --sym-color-teal: #0f8f82;
    --sym-color-amber: #d97706;
    --sym-color-success: #15803d;
    --sym-shadow-soft: 0 12px 32px rgba(30, 58, 138, 0.08);
    --sym-shadow-card: 0 8px 22px rgba(15, 23, 42, 0.055);
    --sym-radius-sm: 8px;
    --sym-radius-md: 12px;
    --sym-radius-lg: 18px;
    --sym-container: 1180px;
    --sym-font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --sym-font-symbol: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols 2", "Arial Unicode MS", sans-serif;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--sym-color-bg);
    color: var(--sym-color-text);
    font-family: var(--sym-font-system);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

img,
svg {
    max-width: 100%;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    text-underline-offset: 0.16em;
}

/* Shared centered container. */
.sym-container {
    width: min(calc(100% - 32px), var(--sym-container));
    margin-inline: auto;
}

/* Screen-reader utility. Keep focusable content accessible. */
.screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.screen-reader-text:focus {
    position: fixed !important;
    z-index: 99999;
    top: 12px;
    left: 12px;
    width: auto !important;
    height: auto !important;
    padding: 12px 16px !important;
    margin: 0 !important;
    clip: auto !important;
    background: #ffffff;
    color: #111827;
    border: 2px solid var(--sym-color-primary);
    border-radius: var(--sym-radius-sm);
}

/* Shared focus treatment; visible for keyboard users only. */
:where(a, button, input, summary):focus-visible {
    outline: 3px solid rgba(49, 94, 232, 0.28);
    outline-offset: 3px;
}

/* GeneratePress header refinements. */
.site-header,
.main-navigation {
    background: #ffffff;
}

.site-header {
    border-bottom: 1px solid var(--sym-color-border);
    box-shadow: 0 2px 14px rgba(15, 23, 42, 0.025);
}

.inside-header {
    padding-block: 16px;
}

.site-logo img {
    width: auto;
    max-height: 38px;
}

.main-navigation .main-nav ul li a {
    font-weight: 600;
}

/* Footer baseline. */
.site-footer {
    border-top: 1px solid var(--sym-color-border);
}

/* Mobile global refinements. */
@media (max-width: 768px) {
    .sym-container {
        width: min(calc(100% - 24px), var(--sym-container));
    }

    .inside-header {
        padding: 12px;
    }
}

/* Respect reduced-motion preferences globally. */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}