/* ==========================================================
 *
 *  NASTAVENÍ SMA FRAMEWORKU
 *
 * ========================================================== */

:root {
    --font-family-headings: 'Inter', sans-serif;
    --font-family-body: 'Inter', sans-serif;

    --color-main: #4f56c9;
    --color-main-accent: #383e95;
    --color-main-text: #ffffff;

    --color-alt: #c94f56;
    --color-alt-accent: #95383e;
    --color-alt-text: #ffffff;

    --color-text-main: #20283B;
    --color-text-muted: #626B80;

    --radius: 0.25rem;
    /* Základní zaoblení Bootstrapu přebírá hodnotu ze SMA frameworku. */
    --bs-border-radius: var(--radius);
    --site-color-border: #e5e7eb;
    --site-section-spacing: 2rem;
}

/* ==========================================================
 *
 *  ZÁKLADNÍ STYLY WEBU
 *
 * ========================================================== */

/* Rozestupy sekcí */

@media (min-width: 992px) {
    :root {
        --site-section-spacing: 3rem;
    }
}

section {
    padding-top: var(--site-section-spacing);
    padding-bottom: var(--site-section-spacing);
    margin-top: 0;
    margin-bottom: 0;
}

/* Typografie */

body {
    font-size: 1rem;
    line-height: 1.6;
    font-weight: 400;
}

/* Menší popisy a formulářové popisky mají jednotnou velikost. */
.site-text-small,
.form-label {
    font-size: 0.875rem;
}

.form-label {
    font-weight: 500;
}

/* Drobné doplňující poznámky */
.site-text-caption {
    font-size: 0.8125rem;
}

:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) {
    color: var(--color-text-main);
    margin-top: 0;
    text-align: inherit;
}

/* Krátké nadpisy klientů, služeb a formuláře */
.h6 {
    font-weight: 700;
    margin-bottom: 0.5rem;
}

/* Bílé nadpisy v sekcích s tmavým projektovým pozadím */
section.site-section--dark :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6) {
    color: white;
}

/* Rukopisný podpis */

.site-signature {
    font-family: 'Caveat', cursive;
    font-size: 2rem;
    line-height: 1.2;
}

/* Výrazný počet let zkušeností místo fotografie */
.site-experience-number {
    font-size: clamp(6rem, 15vw, 12rem);
    line-height: 0.9;
    letter-spacing: -0.05em;
    display: inline;
}

/* Seznamy v obsahových sekcích */

section ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

section ul > li {
    position: relative;
    padding-left: 2rem;
}

section ul > li + li {
    margin-top: 0.5rem;
}

section ul > li::before {
    content: "—";
    position: absolute;
    left: 0;
    color: var(--color-text-muted);
}

/* Ohraničení sekce a oddělovače mezi sloupci */

.site-section--bordered {
    border-top: 1px solid var(--site-color-border);
    border-bottom: 1px solid var(--site-color-border);
}

@media (min-width: 768px) {
    .site-columns-divided--md > .col + .col {
        border-left: 1px solid var(--site-color-border);
    }
}

/* Světlé a tmavé sekce */


section.site-section--light {
    background-color: color-mix(in srgb, var(--color-main) 10%, white);
}

section.site-section--dark {
    background-color: color-mix(in srgb, var(--color-main) 30%, black);
    color: white;
}

/* Oddělovače sloupců od šířky lg */

@media (min-width: 992px) {
    .site-columns-divided--lg > .col + .col {
        border-left: 1px solid var(--site-color-border);
    }
}


.sma-bg--gradient-main {
    color: white;
}
