/* =====================================================
   ДОБРЫХ ДЕЛ МАСТЕР
   Global Styles
===================================================== */

/* ---------- Reset ---------- */

*,
*::before,
*::after {

    margin: 0;
    padding: 0;
    box-sizing: border-box;

}

/* ---------- Variables ---------- */

:root {

    /* ===== Brand Colors ===== */

    --color-primary: #2563EB;
    --color-primary-hover: #1D4ED8;

    --color-dark: #2F343A;
    --color-dark-light: #4B5563;

    --color-gray: #6B7280;
    --color-light: #F5F7FA;

    --color-border: #D9DEE5;

    --color-white: #FFFFFF;

    /* ===== Layout ===== */

    --container-width: 1200px;

    --header-height: 120px;

    --border-radius: 14px;

    --transition: .25s ease;

    /* ===== Shadows ===== */

    --shadow-small: 0 6px 16px rgba(0,0,0,.05);

    --shadow-medium: 0 14px 34px rgba(0,0,0,.08);

}

/* ---------- Base ---------- */

html {

    scroll-behavior: smooth;

}

body {

    font-family: "Inter", sans-serif;

    font-size: 16px;

    line-height: 1.7;

    color: var(--color-dark);

    background: var(--color-white);

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

}

/* ---------- Typography ---------- */

h1,
h2,
h3,
h4,
h5,
h6 {

    font-weight: 700;

    line-height: 1.2;

    color: var(--color-dark);

}

h1 {

    letter-spacing: -.03em;

}

h2 {

    letter-spacing: -.02em;

}

p {

    color: var(--color-gray);

}

strong {

    color: var(--color-dark);

}

/* ---------- Links ---------- */

a {

    color: inherit;

    text-decoration: none;

    transition: var(--transition);

}

/* ---------- Lists ---------- */

ul {

    list-style: none;

}

/* ---------- Images ---------- */

img {

    display: block;

    max-width: 100%;

    height: auto;

}

/* ---------- Buttons ---------- */

button {

    font: inherit;

    border: none;

    background: none;

    cursor: pointer;

}

/* ---------- Layout ---------- */

.container {

    width: min(var(--container-width), calc(100% - 40px));

    margin: 0 auto;

}

section {

    padding: 80px 0;

}

/* ---------- Buttons ---------- */

.button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    padding: 14px 30px;

    background: var(--color-primary);

    color: var(--color-white);

    border-radius: var(--border-radius);

    font-size: 15px;

    font-weight: 600;

    transition: var(--transition);

    box-shadow: var(--shadow-small);

}

.button:hover {

    background: var(--color-primary-hover);

    transform: translateY(-2px);

    box-shadow: var(--shadow-medium);

}

/* ---------- Cards ---------- */

.card {

    background: var(--color-white);

    border: 1px solid var(--color-border);

    border-radius: var(--border-radius);

    box-shadow: var(--shadow-small);

}

/* ---------- Utility ---------- */

.text-center {

    text-align: center;

}

.hidden {

    display: none;

}