:root {
    --sr-container-width: 1200px;
    --sr-page-gutter: 40px;
    --sr-font-body: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --sr-font-heading: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --sr-blue: #0877f2;
    --sr-cyan: #08b7d9;
    --sr-dark: #142238;
    --sr-muted: #5d6b82;
    --sr-soft: #f4f8fb;
    --sr-border: #e5edf5;
    --sr-white: #ffffff;
    --sr-radius: 14px;
    --sr-shadow: 0 18px 45px rgba(20, 34, 56, 0.1);
    --sr-card-hover-y: -4px;
    --sr-card-hover-scale: 1.01;
    --sr-card-hover-shadow: 0 24px 58px rgba(20, 34, 56, 0.14);
    --sr-h1-size: 56px;
    --sr-h1-color: var(--sr-dark);
    --sr-h2-size: 42px;
    --sr-h2-color: var(--sr-dark);
    --sr-h3-size: 24px;
    --sr-h3-color: var(--sr-dark);
    --sr-p-size: 16px;
    --sr-p-color: var(--sr-muted);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    color: var(--sr-dark);
    font-family: var(--sr-font-body);
    line-height: 1.6;
    background: var(--sr-white);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--sr-font-heading);
}

h1 {
    color: var(--sr-h1-color);
    font-size: var(--sr-h1-size);
}

h2 {
    color: var(--sr-h2-color);
    font-size: var(--sr-h2-size);
}

h3 {
    color: var(--sr-h3-color);
    font-size: var(--sr-h3-size);
}

p {
    color: var(--sr-p-color);
    font-size: var(--sr-p-size);
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}