/* Osobní fotografie v úvodním bloku */
.section--hero-personal {
    position: relative;
    overflow: visible;
}

/* Nadpis nesmí zasahovat pod fotografii */
.section--hero-personal .hero__title,
.section--hero-personal .hero__perex {
    max-width: 68rem;
}

.hero-personal__photo {
    position: absolute;
    right: max(2.4rem, calc((100vw - 132rem) / 2 - 1rem));
    top: 7.5rem;
    bottom: auto;
    z-index: 1;
    width: clamp(36rem, 31vw, 50rem);
    pointer-events: none;
}

.hero-personal__photo picture,
.hero-personal__photo img {
    display: block;
    width: 100%;
    height: auto;
}

.hero-personal__photo img {
    display: block;
    width: 100%;
    height: auto;

    filter: drop-shadow(0 1.8rem 1.6rem rgba(0, 0, 0, 0.14));

    -webkit-mask-image: linear-gradient(
        to bottom,
        #000 0%,
        #000 88%,
        rgba(0, 0, 0, 0.85) 94%,
        transparent 100%
    );

    mask-image: linear-gradient(
        to bottom,
        #000 0%,
        #000 88%,
        rgba(0, 0, 0, 0.85) 94%,
        transparent 100%
    );
}

/*
 * Černý informační box již má z-index: 2.
 * Díky tomu zůstane případně před fotografií.
 */

 @media (max-width: 1199px) {
    .hero-personal__photo {
        right: 1rem;
        bottom: -13rem;
        width: 39rem;
    }

    .section--hero-personal .hero__title,
    .section--hero-personal .hero__perex {
        max-width: 62rem;
    }
}

@media (max-width: 991px) {
    .hero-personal__photo {
        display: none;
    }
}

/* Posun mořské sekce výše pod portrét */
@media (min-width: 992px) {
    .section--sub-hero {
        margin-top: -7rem;
        height: 51rem;
    }
}

/* Osobní značka v navigaci */
.personal-brand {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0.15rem;
    color: #1f3f7a;
    text-decoration: none;
    line-height: 1;
    white-space: nowrap;
}

.personal-brand:hover {
    text-decoration: none;
}

.personal-brand__name {
    display: block;
    font-size: 2.45rem;
    font-weight: 750;
    letter-spacing: -0.04em;
}

.personal-brand__support {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding-left: 0.1rem;
}

.personal-brand__support-text {
    color: #6b7280;
    font-size: 1.05rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

.personal-brand__neogy {
    display: block;
    width: 5.6rem;
    height: auto;
}


@media (max-width: 575px) {
    .personal-brand__name {
        font-size: 2.1rem;
    }

    .personal-brand__support {
        display: none;
    }
}

.section--personal-team {
    padding: 9rem 0 7rem;
    background: #fff;
}

.personal-team {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(34rem, 0.9fr);
    gap: 8rem;
    align-items: start;
}

.personal-team__eyebrow {
    margin: 0 0 1.2rem;
    color: #e95314;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.personal-team h2 {
    margin: 0 0 2.2rem;
    max-width: 62rem;
    font-size: 4rem;
    line-height: 1.08;
}

.personal-team p {
    max-width: 68rem;
    margin: 0 0 1.6rem;
    font-size: 1.7rem;
    line-height: 1.6;
}

.personal-team__phone {
    display: inline-flex;
    margin-top: 2rem;
    padding: 1.7rem 2.4rem;
    border: 1px solid #e95314;
    color: #e95314;
    font-size: 1.7rem;
    font-weight: 700;
    text-decoration: none;
    transition: 0.2s ease;
}

.personal-team__phone:hover {
    background: #e95314;
    color: #fff;
    text-decoration: none;
}

.personal-team__services {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
}

.personal-team__service {
    display: flex;
    align-items: center;
    min-height: 6.4rem;
    padding: 1.6rem;
    background: #f2f2f2;
    font-size: 1.55rem;
    font-weight: 650;
}

.personal-team__neogy {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.6rem;
    color: #6b7280;
    font-size: 1.35rem;
}

.personal-team__neogy img {
    width: 7rem;
    height: auto;
}

.personal-team__neogy strong {
    color: #111;
}

@media (max-width: 991px) {
    .personal-team {
        grid-template-columns: 1fr;
        gap: 3.5rem;
    }

    .personal-team h2 {
        font-size: 3.2rem;
    }
}

@media (max-width: 575px) {
    .section--personal-team {
        padding: 6rem 0 5rem;
    }

    .personal-team__services {
        grid-template-columns: 1fr;
    }

    .personal-team__phone {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}


/* ==========================================================
   Osobní kontaktní sekce v moři
   ========================================================== */

.section--contact-personal {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding-top: 8rem;
    padding-bottom: 8rem;
}

/* Obrázek moře dostaneme do vlastního stacking contextu */
.section--contact-personal > .parallax-bg {
    z-index: 0;
    object-position: 50% 55%;
}

/* Jemné ztmavení celé mořské plochy */
.section--contact-personal::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(0, 8, 12, 0.70) 0%,
            rgba(0, 8, 12, 0.43) 52%,
            rgba(0, 8, 12, 0.60) 100%
        );
}

.section--contact-personal .container {
    position: relative;
    z-index: 2;
}

/* Hlavní kontaktní panel */
.personal-contact-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 31rem;
    gap: 4rem;

    max-width: 112rem;
    margin: 0 auto;
    padding: 4.8rem;

    color: #fff;

    background:
        linear-gradient(
            120deg,
            rgba(1, 8, 12, 0.96),
            rgba(5, 13, 17, 0.86)
        );

    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 2.4rem;

    box-shadow:
        0 2.4rem 5rem rgba(0, 0, 0, 0.30);

    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.personal-contact-card__kicker {
    margin-bottom: 1.4rem;

    color: #e95314;

    font-size: 1.4rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.personal-contact-card h2 {
    margin: 0 0 1.6rem;

    color: #fff;

    font-size: 5rem;
    line-height: 1.05;
}

.personal-contact-card__lead {
    max-width: 67rem;
    margin: 0;

    color: rgba(255, 255, 255, 0.88);

    font-size: 1.85rem;
    line-height: 1.55;
}

.personal-contact-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;

    margin-top: 2.8rem;
}

/* Původní btn--border je připravený pro bílý podklad.
   Uvnitř tmavého panelu jej lokálně upravíme. */
.personal-contact-card .btn--border {
    color: #fff;
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.42);
}

.personal-contact-card .btn--border:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.78);
}

.personal-contact-card__points {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;

    margin-top: 2.2rem;
}

.personal-contact-card__points span {
    display: inline-flex;
    align-items: center;

    padding: 0.65rem 1.1rem;

    color: rgba(255, 255, 255, 0.88);
    background: rgba(255, 255, 255, 0.07);

    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 999px;

    font-size: 1.25rem;
    font-weight: 650;
}

/* Reference */
.personal-contact-proof {
    margin: 2.8rem 0 0;
    padding: 1.8rem 2rem;

    background: rgba(255, 255, 255, 0.08);

    border: 1px solid rgba(255, 255, 255, 0.18);
    border-left: 0.4rem solid #e95314;
    border-radius: 1.4rem;
}

.personal-contact-proof blockquote {
    margin: 0;
}

.personal-contact-proof blockquote p {
    margin: 0.5rem 0 1rem;

    color: rgba(255, 255, 255, 0.88);

    font-size: 1.5rem;
    line-height: 1.55;
}

.personal-contact-proof__stars {
    color: #f5a623;
    letter-spacing: 0.08em;
}

.personal-contact-proof figcaption {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;

    font-size: 1.35rem;
}

.personal-contact-proof figcaption span {
    color: rgba(255, 255, 255, 0.68);
}

/* Profil napravo */
.personal-contact-person {
    overflow: hidden;

    align-self: stretch;

    background: rgba(255, 255, 255, 0.10);

    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 1.8rem;
}

.personal-contact-person__photo {
    display: block;

    width: 100%;
    height: 23rem;

    object-fit: cover;
    object-position: 50% 20%;

    filter: grayscale(1);
}

.personal-contact-person__body {
    padding: 1.8rem;
}

.personal-contact-person__name {
    display: block;

    color: #fff;

    font-size: 2rem;
    line-height: 1.2;
}

.personal-contact-person__role {
    display: block;

    margin-top: 0.45rem;

    color: #f06a2d;

    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.35;
}

.personal-contact-person__reviews {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;

    margin-top: 1.6rem;
    padding: 1.2rem;

    color: #f06a2d;
    background: rgba(233, 83, 20, 0.10);

    border: 1px solid rgba(233, 83, 20, 0.42);
    border-radius: 1.2rem;
}

.personal-contact-person__reviews strong {
    color: #fff;
    font-size: 1.45rem;
}

.personal-contact-person__reviews small {
    color: rgba(255, 255, 255, 0.70);
    font-size: 1.05rem;
}

.personal-contact-person p {
    margin: 1.5rem 0 0;

    color: rgba(255, 255, 255, 0.76);

    font-size: 1.35rem;
    line-height: 1.55;
}

/* ==========================================================
   Responsivní chování
   ========================================================== */

@media (max-width: 991px) {
    .section--contact-personal {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }

    .personal-contact-card {
        grid-template-columns: 1fr;
        gap: 2.8rem;

        padding: 3.2rem;
    }

    .personal-contact-person {
        display: grid;
        grid-template-columns: 17rem 1fr;
    }

    .personal-contact-person__photo {
        height: 100%;
        min-height: 22rem;
    }
}

@media (max-width: 575px) {
    .section--contact-personal {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .personal-contact-card {
        padding: 2.2rem;
        border-radius: 1.6rem;
    }

    .personal-contact-card h2 {
        font-size: 3.8rem;
    }

    .personal-contact-card__lead {
        font-size: 1.65rem;
    }

    .personal-contact-card__actions {
        flex-direction: column;
    }

    .personal-contact-card__actions .btn {
        width: 100%;
        text-align: center;
    }

    .personal-contact-person {
        display: block;
    }

    .personal-contact-person__photo {
        height: 22rem;
    }
}




.section--tradespeople-hero {
    overflow: hidden;
    padding: 7rem 0 6rem;
    background: #fff;
}

.tradespeople-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(42rem, 0.95fr);
    gap: 6rem;
    align-items: center;
}

.tradespeople-hero__kicker {
    margin-bottom: 1.4rem;
    color: #e95314;
    font-size: 1.4rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.tradespeople-hero h1 {
    margin: 0 0 2rem;
    font-size: clamp(4.4rem, 5vw, 6.8rem);
    line-height: 1.02;
}

.tradespeople-hero p {
    max-width: 61rem;
    margin: 0 0 2.8rem;
    font-size: 1.85rem;
    line-height: 1.55;
}

.tradespeople-hero__visual {
    position: relative;
    z-index: 3;
    transform: translateY(4.5rem);
}

.tradespeople-hero__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 52%;
}

@media (max-width: 991px) {
    .tradespeople-hero {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .tradespeople-hero__visual {
        height: 34rem;
    }
}


.section--sub-hero--tradespeople::before {
    top: -5rem;
}

.section--sub-hero--tradespeople .sub-hero {
    margin-top: -5rem;
}


/* ==========================================================
   Jak postupuji + vybraná reference
   ========================================================== */

.section--how-i-work {
    padding: 10rem 0;
    background: #eef5f8;
}

.how-i-work {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(34rem, 0.82fr);
    gap: 7rem;
    align-items: start;
}

/* Levá část */

.how-i-work__eyebrow {
    margin: 0 0 1.2rem;
    color: #e95314;
    font-size: 1.4rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.how-i-work__content h2 {
    max-width: 68rem;
    margin: 0 0 1.8rem;
    font-size: 4rem;
    line-height: 1.08;
}

.how-i-work__intro {
    max-width: 70rem;
    margin: 0 0 4rem;
    color: #28333b;
    font-size: 1.8rem;
    line-height: 1.6;
}

/* Číslovaný postup */

.how-i-work__steps {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: how-i-work-step;
}

.how-i-work__step {
    position: relative;
    display: grid;
    grid-template-columns: 5.6rem minmax(0, 1fr);
    gap: 2rem;
    padding: 0 0 2.8rem;

    counter-increment: how-i-work-step;
}

.how-i-work__step:last-child {
    padding-bottom: 0;
}

/* Spojovací čára mezi kroky */

.how-i-work__step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 6rem;
    bottom: 0.4rem;
    left: 2.75rem;
    width: 0.2rem;
    background: rgba(233, 83, 20, 0.24);
}

/* Kroužek s automaticky dopočítaným číslem */

.how-i-work__number {
    position: relative;
    z-index: 1;

    display: grid;
    place-items: center;

    width: 5.6rem;
    height: 5.6rem;

    color: #e95314;
    background: #fff;

    border: 0.2rem solid #e95314;
    border-radius: 50%;

    box-shadow: 0 0.9rem 1.8rem rgba(28, 52, 64, 0.10);

    font-size: 2.1rem;
    font-weight: 800;
    line-height: 1;
}

.how-i-work__number::before {
    content: counter(how-i-work-step);
}

.how-i-work__step-content {
    padding-top: 0.35rem;
}

.how-i-work__step-content h3 {
    margin: 0 0 0.5rem;
    font-size: 2.1rem;
    line-height: 1.25;
}

.how-i-work__step-content p {
    max-width: 67rem;
    margin: 0;
    color: #394750;
    font-size: 1.6rem;
    line-height: 1.6;
}

/* Pravá část: reference */

.how-i-work__aside {
    height: 100%;
}

.how-i-work-proof {
    position: sticky;
    top: 10rem;

    overflow: hidden;

    min-height: 48rem;
    margin: 0;
    padding: 5.2rem 4.8rem 4.4rem;

    background: #fff;

    border-left: 0.5rem solid #e95314;

    box-shadow:
        0 1.8rem 4rem rgba(28, 52, 64, 0.12);
}

/* Dekorativní uvozovky vytvořené pouze přes CSS */

.how-i-work-proof::before {
    content: "“";
    position: absolute;
    top: 0.2rem;
    right: 2.2rem;

    color: rgba(233, 83, 20, 0.12);

    font-size: 19rem;
    font-weight: 800;
    line-height: 1;
    pointer-events: none;
}

.how-i-work-proof blockquote {
    position: relative;
    z-index: 1;
    margin: 0;
}

.how-i-work-proof blockquote p {
    margin: 0;
    color: #152438;
    font-size: 2.7rem;
    font-weight: 520;
    line-height: 1.28;
}

.how-i-work-proof figcaption {
    position: relative;
    z-index: 1;

    display: flex;
    flex-direction: column;
    gap: 0.25rem;

    margin-top: 3rem;
}

.how-i-work-proof figcaption strong {
    color: #152438;
    font-size: 1.65rem;
}

.how-i-work-proof figcaption span {
    color: #5d6971;
    font-size: 1.45rem;
}

.how-i-work-proof__link {
    position: relative;
    z-index: 1;

    display: inline-flex;
    gap: 0.7rem;

    margin-top: 4rem;

    color: #e95314;

    font-size: 1.55rem;
    font-weight: 750;
    text-decoration: none;
}

.how-i-work-proof__link:hover {
    color: #000;
    text-decoration: none;
}

/* ==========================================================
   Responsivní chování
   ========================================================== */

@media (max-width: 991px) {
    .section--how-i-work {
        padding: 8rem 0;
    }

    .how-i-work {
        grid-template-columns: 1fr;
        gap: 4.5rem;
    }

    .how-i-work__content h2 {
        font-size: 3.6rem;
    }

    .how-i-work-proof {
        position: relative;
        top: auto;

        min-height: auto;
    }
}

@media (max-width: 575px) {
    .section--how-i-work {
        padding: 6rem 0;
    }

    .how-i-work__content h2 {
        font-size: 3rem;
    }

    .how-i-work__intro {
        margin-bottom: 3.2rem;
        font-size: 1.65rem;
    }

    .how-i-work__step {
        grid-template-columns: 4.8rem minmax(0, 1fr);
        gap: 1.4rem;
        padding-bottom: 2.5rem;
    }

    .how-i-work__step:not(:last-child)::after {
        top: 5.2rem;
        left: 2.35rem;
    }

    .how-i-work__number {
        width: 4.8rem;
        height: 4.8rem;
        font-size: 1.85rem;
    }

    .how-i-work__step-content {
        padding-top: 0.1rem;
    }

    .how-i-work__step-content h3 {
        font-size: 1.85rem;
    }

    .how-i-work__step-content p {
        font-size: 1.5rem;
    }

    .how-i-work-proof {
        padding: 3.4rem 2.5rem 3rem;
    }

    .how-i-work-proof::before {
        top: 0.8rem;
        right: 1.2rem;
        font-size: 13rem;
    }

    .how-i-work-proof blockquote p {
        font-size: 2.15rem;
    }
}



/* ==========================================================
   Statistiky + reference drobných klientů
   ========================================================== */

.section--small-client-proof {
    padding: 10rem 0;
    background: #f7f5ef;
}


/* ==========================================================
   Úvodní text
   ========================================================== */

.small-client-proof__header {
    max-width: 82rem;
    margin-bottom: 4rem;
}

.small-client-proof__eyebrow {
    margin: 0 0 1.2rem;

    color: #e95314;

    font-size: 1.4rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.small-client-proof__header h2 {
    margin: 0 0 1.6rem;

    color: #152438;

    font-size: 4.6rem;
    line-height: 1.08;
}

.small-client-proof__lead {
    max-width: 76rem;
    margin: 0;

    color: #3f4d55;

    font-size: 1.8rem;
    line-height: 1.6;
}


/* ==========================================================
   Statistiky
   ========================================================== */

.proof-statistics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    overflow: hidden;

    background:
        linear-gradient(
            120deg,
            #07131d,
            #152438
        );

    border-radius: 2rem;

    box-shadow:
        0 2rem 4.5rem rgba(21, 36, 56, 0.18);
}

.proof-statistic {
    position: relative;

    min-height: 20rem;
    padding: 3rem 2.6rem;

    color: #fff;

    border-right: 1px solid rgba(255, 255, 255, 0.17);
}

.proof-statistic:last-child {
    border-right: 0;
}

/* Jemný dekorativní kroužek */

.proof-statistic::after {
    content: "";

    position: absolute;
    right: -2.5rem;
    bottom: -4.5rem;

    width: 12rem;
    height: 12rem;

    border: 1px solid rgba(233, 83, 20, 0.25);
    border-radius: 50%;
}

.proof-statistic__number {
    position: relative;
    z-index: 1;

    display: block;

    margin-bottom: 1.5rem;

    color: #f06a2d;

    font-size: 5rem;
    font-weight: 800;
    letter-spacing: -0.06em;
    line-height: 1;
}

.proof-statistic p {
    position: relative;
    z-index: 1;

    margin: 0;

    color: rgba(255, 255, 255, 0.83);

    font-size: 1.55rem;
    line-height: 1.5;
}

.proof-statistic b {
    color: #fff;
}

.proof-statistics__note {
    max-width: 92rem;
    margin: 1.4rem 0 0;

    color: #75818a;

    font-size: 1.25rem;
    line-height: 1.5;
}


/* ==========================================================
   Nadpis referencí
   ========================================================== */

.small-client-proof__reviews-heading {
    margin-top: 8rem;
    margin-bottom: 2.5rem;
}

.small-client-proof__reviews-heading h3 {
    max-width: 70rem;
    margin: 0;

    color: #152438;

    font-size: 3.4rem;
    line-height: 1.15;
}


/* ==========================================================
   Karty referencí
   ========================================================== */

.small-reviews {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.6rem;
}

.small-review {
    position: relative;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    min-height: 28rem;
    padding: 3rem;

    background: #fff;

    border: 1px solid rgba(21, 36, 56, 0.09);
    border-top: 0.35rem solid rgba(233, 83, 20, 0.72);
    border-radius: 1.4rem;

    box-shadow:
        0 1rem 2.5rem rgba(21, 36, 56, 0.06);

    transition:
        transform 220ms ease,
        box-shadow 220ms ease;
}

.small-review:hover {
    transform: translateY(-0.4rem);

    box-shadow:
        0 1.7rem 3.4rem rgba(21, 36, 56, 0.11);
}

/* První reference je výraznější.
   Rozbije pravidelnou mřížku, takže sekce nepůsobí jako zeď karet. */

.small-review--featured {
    grid-column: span 2;

    background:
        linear-gradient(
            135deg,
            #ffffff,
            #eef5f8
        );
}

.small-review::before {
    content: "“";

    position: absolute;
    top: 1rem;
    right: 1.8rem;

    color: rgba(233, 83, 20, 0.13);

    font-size: 10rem;
    font-weight: 800;
    line-height: 1;

    pointer-events: none;
}

.small-review__tag {
    position: relative;
    z-index: 1;

    display: inline-flex;
    align-self: flex-start;

    margin-bottom: 2.3rem;
    padding: 0.55rem 0.9rem;

    color: #b13b0b;
    background: rgba(233, 83, 20, 0.09);

    border-radius: 999px;

    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.small-review blockquote {
    position: relative;
    z-index: 1;

    margin: 0;
}

.small-review blockquote p {
    margin: 0;

    color: #253440;

    font-size: 1.6rem;
    line-height: 1.62;
}

.small-review--featured blockquote p {
    max-width: 69rem;

    font-size: 1.85rem;
}

.small-review__footer {
    position: relative;
    z-index: 1;

    display: flex;
    flex-direction: column;
    gap: 0.25rem;

    margin-top: 2.6rem;
    padding-top: 1.5rem;

 
}

.small-review__footer strong {
    color: #152438;

    font-size: 1.55rem;
}

.small-review__footer span {
    color: #76828a;

    font-size: 1.3rem;
}


/* ==========================================================
   Rozbalení dalších referencí bez JavaScriptu
   ========================================================== */

.small-reviews-more {
    margin-top: 2.4rem;
}

.small-reviews-more summary {
    display: inline-flex;
    align-items: center;
    gap: 1rem;

    padding: 1.4rem 1.8rem;

    color: #e95314;
    background: transparent;

    border: 1px solid #e95314;
    border-radius: 999px;

    font-size: 1.45rem;
    font-weight: 750;

    cursor: pointer;
    list-style: none;

    transition:
        color 220ms ease,
        background 220ms ease;
}

.small-reviews-more summary::-webkit-details-marker {
    display: none;
}

.small-reviews-more summary:hover {
    color: #fff;
    background: #e95314;
}

.small-reviews-more summary span {
    display: block;

    width: 0.9rem;
    height: 0.9rem;

    border-right: 0.2rem solid currentColor;
    border-bottom: 0.2rem solid currentColor;

    transform: rotate(45deg) translateY(-0.2rem);

    transition: transform 220ms ease;
}

.small-reviews-more[open] summary span {
    transform: rotate(225deg) translate(-0.15rem, -0.15rem);
}

.small-reviews--expanded {
    margin-top: 2.4rem;
}


/* ==========================================================
   Spodní tlačítko
   ========================================================== */

.small-client-proof__actions {
    display: flex;
    justify-content: center;

    margin-top: 4rem;
}


/* ==========================================================
   Responsivní chování
   ========================================================== */

@media (max-width: 991px) {
    .section--small-client-proof {
        padding: 8rem 0;
    }

    .small-client-proof__header h2 {
        font-size: 3.8rem;
    }

    .proof-statistics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .proof-statistic:nth-child(2) {
        border-right: 0;
    }

    .proof-statistic:nth-child(-n + 2) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.17);
    }

    .small-reviews {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .small-review--featured {
        grid-column: span 2;
    }
}

@media (max-width: 575px) {
    .section--small-client-proof {
        padding: 6rem 0;
    }

    .small-client-proof__header h2 {
        font-size: 3.1rem;
    }

    .small-client-proof__lead {
        font-size: 1.65rem;
    }

    .proof-statistics {
        grid-template-columns: 1fr;
    }

    .proof-statistic {
        min-height: auto;

        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.17);
    }

    .proof-statistic:last-child {
        border-bottom: 0;
    }

    .proof-statistic__number {
        font-size: 4.4rem;
    }

    .small-client-proof__reviews-heading {
        margin-top: 5.5rem;
    }

    .small-client-proof__reviews-heading h3 {
        font-size: 2.7rem;
    }

    .small-reviews {
        grid-template-columns: 1fr;
    }

    .small-review,
    .small-review--featured {
        grid-column: auto;

        min-height: auto;
        padding: 2.4rem;
    }

    .small-review--featured blockquote p {
        font-size: 1.65rem;
    }

    .small-reviews-more summary {
        width: 100%;
        justify-content: center;
    }
}



/* ==========================================================
   Podnikatelské komunity na Facebooku
   ========================================================== */

.section--community-impact {
    padding: 9rem 0;
    background: #fff;
}

.community-impact {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(27rem, 36rem);
    gap: 5rem;
    align-items: center;

    overflow: hidden;

    padding: 5.8rem 6.2rem;

    color: #fff;

    background:
        linear-gradient(
            120deg,
            #07131d,
            #152438
        );

    border-radius: 2.4rem;

    box-shadow:
        0 2.2rem 4.8rem rgba(21, 36, 56, 0.18);
}

/* Jemné dekorativní kruhy v pozadí */

.community-impact::before,
.community-impact::after {
    content: "";

    position: absolute;

    border: 1px solid rgba(233, 83, 20, 0.22);
    border-radius: 50%;

    pointer-events: none;
}

.community-impact::before {
    right: -10rem;
    bottom: -16rem;

    width: 42rem;
    height: 42rem;
}

.community-impact::after {
    right: 8rem;
    top: -14rem;

    width: 30rem;
    height: 30rem;
}


/* ==========================================================
   Textová část
   ========================================================== */

.community-impact__content {
    position: relative;
    z-index: 2;
}

.community-impact__eyebrow {
    margin: 0 0 1.4rem;

    color: #f06a2d;

    font-size: 1.4rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.community-impact h2 {
    max-width: 83rem;
    margin: 0;

    color: #fff;

    font-size: 4.3rem;
    line-height: 1.08;
}

.community-impact__lead {
    max-width: 80rem;
    margin: 2rem 0 0;

    color: rgba(255, 255, 255, 0.84);

    font-size: 1.75rem;
    line-height: 1.62;
}


/* ==========================================================
   Čísla
   ========================================================== */

.community-impact__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;

    margin-top: 3rem;
}

.community-impact__stat {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;

    min-width: 15rem;
    padding: 1.4rem 1.6rem;

    background: rgba(255, 255, 255, 0.07);

    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 1.2rem;
}

.community-impact__stat strong {
    color: #f06a2d;

    font-size: 2.25rem;
    line-height: 1.1;
}

.community-impact__stat span {
    color: rgba(255, 255, 255, 0.72);

    font-size: 1.25rem;
    line-height: 1.35;
}


/* ==========================================================
   Hlavní myšlenka
   ========================================================== */

.community-impact__insight {
    max-width: 74rem;
    margin-top: 3rem;
    padding: 1.6rem 1.9rem;

    background: rgba(255, 255, 255, 0.07);

    border-left: 0.4rem solid #e95314;
    border-radius: 0 1.2rem 1.2rem 0;
}

.community-impact__insight strong {
    display: block;

    margin-bottom: 0.35rem;

    color: #fff;

    font-size: 1.45rem;
}

.community-impact__insight p {
    margin: 0;

    color: rgba(255, 255, 255, 0.82);

    font-size: 1.5rem;
    line-height: 1.55;
}


/* ==========================================================
   Volitelný textový odkaz
   ========================================================== */

.community-impact__link {
    display: inline-flex;
    gap: 0.7rem;

    margin-top: 2.5rem;

    color: #f06a2d;

    font-size: 1.55rem;
    font-weight: 750;
    text-decoration: none;
}

.community-impact__link:hover {
    color: #fff;
    text-decoration: none;
}


/* ==========================================================
   Grafika palce
   ========================================================== */

.community-impact__visual {
    position: relative;
    z-index: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 27rem;
}

.community-impact__visual-circle {
    position: absolute;

    width: 30rem;
    height: 30rem;

    background: rgba(233, 83, 20, 0.13);

    border: 1px solid rgba(233, 83, 20, 0.38);
    border-radius: 50%;
}

.community-impact__visual img {
    position: relative;
    z-index: 1;

    display: block;

    width: 25rem;
    max-width: 100%;
    height: auto;

    transform: rotate(-3deg);
}


/* ==========================================================
   Responsivní chování
   ========================================================== */

@media (max-width: 991px) {
    .section--community-impact {
        padding: 7rem 0;
    }

    .community-impact {
        grid-template-columns: minmax(0, 1fr) 23rem;
        gap: 2rem;

        padding: 4.5rem;
    }

    .community-impact h2 {
        font-size: 3.6rem;
    }

    .community-impact__visual {
        min-height: 29rem;
    }



    .community-impact__visual img {
        width: min(100%, 22rem);
    }
}

@media (max-width: 767px) {
    .community-impact {
        grid-template-columns: 1fr;
    }

    .community-impact__visual {
        min-height: 20rem;
        margin-top: 1rem;
    }

    .community-impact__visual-circle {
        width: 19rem;
        height: 19rem;
    }

    .community-impact__visual img {
        width: min(100%, 19rem);
    }
}

@media (max-width: 575px) {
    
    .section--community-impact {
    padding: 3.5rem 0 7rem;
    background: #fff;
    }

    .community-impact {
        padding: 3rem 2.3rem;

        border-radius: 1.6rem;
    }

    .community-impact h2 {
        font-size: 2.9rem;
    }

    .community-impact__lead {
        font-size: 1.6rem;
    }

    .community-impact__stats {
        flex-direction: column;
    }

    .community-impact__stat {
        min-width: auto;
    }
}


/* Menší mezera mezi logy klientů a blokem komunit */

.section--reference {
    padding-bottom: 2rem;
}

.section--community-impact {
    padding-top: 3.5rem;
    padding-bottom: 7rem;
}


/* Kompaktnější návaznost: Neogy → loga → komunity */

.section--personal-team {
    padding-bottom: 3rem;
}

.section--reference {
    padding-top: 2.5rem;
    padding-bottom: 1rem;
}

.section--community-impact {
    padding-top: 2.5rem;
}


.tradespeople-hero__visual {
    position: relative;
    z-index: 3;
    overflow: hidden;

    border-radius: 1.6rem;

    box-shadow:
        0 1.4rem 3rem rgba(21, 36, 56, 0.12);

    transform: translateY(4.5rem);
}

.tradespeople-hero__visual img {
    display: block;
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: 50% 52%;
}


/* ==========================================================
   Navigační mapa zkušeností: plynulá varianta referencí
   ========================================================== */

.section--experience-map {
    padding: 9rem 0 10rem;
    background: #eef5f8;
}

.experience-map {
    position: relative;
}


/* ==========================================================
   Skryté radio inputy
   Zůstávají ovladatelné klávesnicí.
   ========================================================== */

.experience-map__radio {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}


/* ==========================================================
   Úvodní text
   ========================================================== */

.experience-map__header {
    max-width: 88rem;
}

.experience-map__eyebrow {
    margin: 0 0 1.2rem;
    color: #e95314;
    font-size: 1.4rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.experience-map__header h2 {
    margin: 0;
    color: #152438;
    font-size: 4.6rem;
    line-height: 1.08;
}

.experience-map__lead {
    max-width: 76rem;
    margin: 1.8rem 0 0;
    color: #3f4d55;
    font-size: 1.8rem;
    line-height: 1.6;
}


/* ==========================================================
   Čtyři rovnocenné filtry
   ========================================================== */

.experience-map__navigation {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.4rem;
    margin-top: 4.4rem;
}

.experience-route-card {
    position: relative;
    display: block;
    cursor: pointer;
}

.experience-route-card__body {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 27rem;
    padding: 2.5rem;
    background: #fff;
    border: 1px solid rgba(21, 36, 56, 0.10);
    border-radius: 1.5rem;
    box-shadow: 0 1rem 2.7rem rgba(21, 36, 56, 0.07);
    transition:
        transform 220ms ease,
        color 220ms ease,
        background 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease;
}

.experience-route-card:hover .experience-route-card__body {
    transform: translateY(-0.45rem);
    box-shadow: 0 1.8rem 3.6rem rgba(21, 36, 56, 0.13);
}


/* ==========================================================
   Ikony karet
   SVG masky jsou vložené přímo v CSS.
   ========================================================== */

.experience-route-card__icon {
    position: absolute;
    top: 2.2rem;
    right: 2.2rem;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 4.4rem;
    height: 4.4rem;
    color: #e95314;
    background: rgba(233, 83, 20, 0.10);
    border: 1px solid rgba(233, 83, 20, 0.18);
    border-radius: 1.1rem;
    transition:
        color 220ms ease,
        background 220ms ease,
        border-color 220ms ease,
        transform 220ms ease;
}

.experience-route-card:hover .experience-route-card__icon {
    transform: translateY(-0.25rem);
}

.experience-route-card__icon::before {
    content: "";
    display: block;
    width: 2.35rem;
    height: 2.35rem;
    background: currentColor;
    -webkit-mask: var(--experience-icon) center / contain no-repeat;
    mask: var(--experience-icon) center / contain no-repeat;
}

.experience-route-card__icon--web {
    --experience-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 3h16a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm0 5v11h16V8H4Zm0-3v1h16V5H4Zm2 .5a.75.75 0 1 1 1.5 0 .75.75 0 0 1-1.5 0Zm3 0a.75.75 0 1 1 1.5 0 .75.75 0 0 1-1.5 0Z'/%3E%3C/svg%3E");
}

.experience-route-card__icon--growth {
    --experience-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 19h16v2H2V3h2v16Zm2-3.6 4.25-4.25 3 3L18.59 8.8H16V7h6v6h-1.8v-2.93l-6.95 6.95-3-3L7.4 16.8 6 15.4Z'/%3E%3C/svg%3E");
}

.experience-route-card__icon--strategy {
    --experience-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 1 0 20 10 10 0 0 1 0-20Zm0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm3.94 4.06-2.12 5.76-5.76 2.12 2.12-5.76 5.76-2.12Zm-3.35 3.35-1.18 1.18 1.18-.43.43-1.18-.43.43Z'/%3E%3C/svg%3E");
}

.experience-route-card__icon--specialist {
    --experience-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm0-6a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm0 8c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5Zm-5.48 4c.97-1.13 3.05-2 5.48-2s4.51.87 5.48 2H6.52ZM19 4h2v3h3v2h-3v3h-2V9h-3V7h3V4Z'/%3E%3C/svg%3E");
}


/* ==========================================================
   Text karet
   ========================================================== */

.experience-route-card__kicker {
    display: block;
    max-width: calc(100% - 5.4rem);
    margin-bottom: 1rem;
    color: #e95314;
    font-size: 1.2rem;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.experience-route-card__title {
    display: block;
    max-width: calc(100% - 3.7rem);
    color: #152438;
    font-size: 2rem;
    line-height: 1.22;
}

.experience-route-card__text {
    display: block;
    margin-top: 1.3rem;
    color: #52616a;
    font-size: 1.5rem;
    line-height: 1.55;
}

.experience-route-card__action {
    display: inline-flex;
    align-items: center;
    margin-top: auto;
    padding-top: 2rem;
    color: #e95314;
    font-size: 1.4rem;
    font-weight: 750;
}

.experience-route-card__action-active {
    display: none;
}


/* ==========================================================
   Aktivní karta
   Na desktopu zobáček vizuálně otevírá spodní oblast.
   ========================================================== */

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__body,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__body,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__body,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__body {
    color: #fff;
    background: linear-gradient(120deg, #07131d, #152438);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow: 0 2rem 4rem rgba(21, 36, 56, 0.22);
}

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__body::after,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__body::after,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__body::after,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__body::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -1rem;
    width: 2rem;
    height: 2rem;
    background: #142338;
    transform: translateX(-50%) rotate(45deg);
}

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__icon,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__icon,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__icon,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__icon {
    color: #fff;
    background: #e95314;
    border-color: #e95314;
}

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__title,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__title,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__title,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__title {
    color: #fff;
}

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__text,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__text,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__text,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__text {
    color: rgba(255, 255, 255, 0.76);
}

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__action-default,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__action-default,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__action-default,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__action-default {
    display: none;
}

#experience-web:checked
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__action-active,

#experience-growth:checked
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__action-active,

#experience-strategy:checked
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__action-active,

#experience-specialist:checked
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__action-active {
    display: inline;
}


/* ==========================================================
   Viditelné zaměření při ovládání klávesnicí
   ========================================================== */

#experience-web:focus-visible
~ .experience-map__navigation
label[for="experience-web"]
.experience-route-card__body,

#experience-growth:focus-visible
~ .experience-map__navigation
label[for="experience-growth"]
.experience-route-card__body,

#experience-strategy:focus-visible
~ .experience-map__navigation
label[for="experience-strategy"]
.experience-route-card__body,

#experience-specialist:focus-visible
~ .experience-map__navigation
label[for="experience-specialist"]
.experience-route-card__body,

#experience-all:focus-visible
~ .experience-map__drawer
.experience-map__selection-reset {
    outline: 0.3rem solid rgba(233, 83, 20, 0.34);
    outline-offset: 0.35rem;
}


/* ==========================================================
   Společná otevřená oblast
   Jeden klidný celek namísto řady samostatných boxů.
   ========================================================== */

.experience-map__drawer {
    overflow: hidden;
    margin-top: 1.5rem;
    background: rgba(255, 255, 255, 0.86);
    border-top: 0.35rem solid #e95314;
    box-shadow: 0 1.6rem 3.4rem rgba(21, 36, 56, 0.08);
}


/* ==========================================================
   Hlavička společné oblasti
   ========================================================== */

.experience-map__selection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3rem;
    padding: 3rem 3.2rem 2.4rem;
    border-bottom: 1px solid rgba(21, 36, 56, 0.10);
}

.experience-map__selection-content {
    min-width: 0;
}

.experience-map__selection-label {
    margin: 0 0 0.55rem;
    color: #e95314;
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: 0.10em;
    text-transform: uppercase;
}

.experience-map__selection-state {
    display: none;
}

.experience-map__selection-state h3 {
    margin: 0;
    color: #152438;
    font-size: 2.7rem;
    line-height: 1.15;
}

.experience-map__selection-state p {
    max-width: 84rem;
    margin: 0.75rem 0 0;
    color: #52616a;
    font-size: 1.5rem;
    line-height: 1.55;
}

#experience-all:checked
~ .experience-map__drawer
.experience-map__selection-state--all,

#experience-web:checked
~ .experience-map__drawer
.experience-map__selection-state--web,

#experience-growth:checked
~ .experience-map__drawer
.experience-map__selection-state--growth,

#experience-strategy:checked
~ .experience-map__drawer
.experience-map__selection-state--strategy,

#experience-specialist:checked
~ .experience-map__drawer
.experience-map__selection-state--specialist {
    display: block;
}

.experience-map__selection-reset {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1.15rem 1.55rem;
    color: #e95314;
    background: transparent;
    border: 1px solid #e95314;
    border-radius: 999px;
    font-size: 1.35rem;
    font-weight: 750;
    text-align: center;
    cursor: pointer;
    transition:
        color 220ms ease,
        background 220ms ease;
}

.experience-map__selection-reset:hover {
    color: #fff;
    background: #e95314;
}

#experience-all:checked
~ .experience-map__drawer
.experience-map__selection-reset {
    display: none;
}


/* ==========================================================
   Reference na společném pozadí
   ========================================================== */

.experience-reference-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 4.2rem;
    padding: 0 3.2rem;
}

.experience-reference {
    position: relative;
    padding: 3.1rem 0 3.2rem;
    border-bottom: 1px solid rgba(21, 36, 56, 0.11);
    animation: experience-card-appear 220ms ease;
}

.experience-reference:nth-last-child(-n + 2) {
    border-bottom: 0;
}

.experience-reference--featured {
    grid-column: 1 / -1;
    padding-top: 3.5rem;
    padding-bottom: 3.6rem;
    border-bottom: 1px solid rgba(21, 36, 56, 0.14);
}

.experience-reference::before {
    content: "“";
    position: absolute;
    top: 1.6rem;
    right: 0.4rem;
    color: rgba(233, 83, 20, 0.12);
    font-size: 9rem;
    font-weight: 800;
    line-height: 1;
    pointer-events: none;
}

.experience-reference__tag {
    position: relative;
    z-index: 1;
    display: inline-flex;
    margin-bottom: 1.7rem;
    color: #b13b0b;
    font-size: 1.1rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.experience-reference blockquote {
    position: relative;
    z-index: 1;
    max-width: 72rem;
    margin: 0;
}

.experience-reference blockquote p {
    margin: 0;
    color: #253440;
    font-size: 1.6rem;
    line-height: 1.68;
}

.experience-reference--featured blockquote p {
    max-width: 96rem;
    font-size: 1.85rem;
}

.experience-reference__footer {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.22rem;
    margin-top: 2.1rem;
}

.experience-reference__footer strong {
    color: #152438;
    font-size: 1.5rem;
}

.experience-reference__footer span {
    color: #76828a;
    font-size: 1.28rem;
}

@keyframes experience-card-appear {
    from {
        opacity: 0;
        transform: translateY(0.7rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ==========================================================
   Filtrování bez JavaScriptu
   ========================================================== */

#experience-web:checked
~ .experience-map__drawer
.experience-reference-list
.experience-item:not(.experience-item--web) {
    display: none;
}

#experience-growth:checked
~ .experience-map__drawer
.experience-reference-list
.experience-item:not(.experience-item--growth) {
    display: none;
}

#experience-strategy:checked
~ .experience-map__drawer
.experience-reference-list
.experience-item:not(.experience-item--strategy) {
    display: none;
}

#experience-specialist:checked
~ .experience-map__drawer
.experience-reference-list
.experience-item:not(.experience-item--specialist) {
    display: none;
}


/* ==========================================================
   Případová studie: ukončovací horizontální pruh
   ========================================================== */

.experience-case-study {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(34rem, 0.88fr);
    gap: 4rem;
    overflow: hidden;
    margin-top: 0;
    padding: 4.1rem 3.2rem;
    color: #fff;
    background: linear-gradient(120deg, #07131d, #152438);
}

.experience-case-study::before,
.experience-case-study::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(233, 83, 20, 0.22);
    border-radius: 50%;
    pointer-events: none;
}

.experience-case-study::before {
    right: -12rem;
    bottom: -17rem;
    width: 38rem;
    height: 38rem;
}

.experience-case-study::after {
    right: 8rem;
    top: -13rem;
    width: 25rem;
    height: 25rem;
}

.experience-case-study__content,
.experience-case-study__facts {
    position: relative;
    z-index: 1;
}

.experience-case-study__eyebrow {
    margin: 0 0 1.15rem;
    color: #f06a2d;
    font-size: 1.25rem;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.experience-case-study h3 {
    max-width: 74rem;
    margin: 0;
    color: #fff;
    font-size: 3rem;
    line-height: 1.12;
}

.experience-case-study__lead {
    max-width: 73rem;
    margin: 1.55rem 0 0;
    color: rgba(255, 255, 255, 0.79);
    font-size: 1.58rem;
    line-height: 1.62;
}

.experience-case-study__link {
    display: inline-flex;
    margin-top: 2.2rem;
    color: #f06a2d;
    font-size: 1.48rem;
    font-weight: 750;
    text-decoration: none;
}

.experience-case-study__link:hover {
    color: #fff;
    text-decoration: none;
}

.experience-case-study__facts {
    align-self: center;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.experience-case-study__fact {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
    padding: 1.45rem 1.35rem;
    border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.experience-case-study__fact:first-child {
    border-left: 0;
}

.experience-case-study__fact strong {
    color: #f06a2d;
    font-size: 1.08rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.experience-case-study__fact span {
    color: rgba(255, 255, 255, 0.84);
    font-size: 1.34rem;
    line-height: 1.45;
}


/* ==========================================================
   Responsivní chování
   ========================================================== */

@media (max-width: 1199px) {
    .experience-case-study {
        grid-template-columns: minmax(0, 1fr) minmax(30rem, 0.82fr);
        gap: 3rem;
    }

    .experience-case-study__facts {
        grid-template-columns: 1fr;
    }

    .experience-case-study__fact {
        border-top: 1px solid rgba(255, 255, 255, 0.16);
        border-left: 0;
    }

    .experience-case-study__fact:first-child {
        border-top: 0;
    }
}

@media (max-width: 991px) {
    .section--experience-map {
        padding: 8rem 0;
    }

    .experience-map__header h2 {
        font-size: 3.8rem;
    }

    .experience-map__navigation {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.4rem;
        margin-top: 4rem;
    }

    .experience-route-card__body {
        min-height: 23rem;
        padding: 2.3rem;
    }

    /* Ve dvou sloupcích už zobáček nemíří přímo na oblast. */
    #experience-web:checked
    ~ .experience-map__navigation
    label[for="experience-web"]
    .experience-route-card__body::after,

    #experience-growth:checked
    ~ .experience-map__navigation
    label[for="experience-growth"]
    .experience-route-card__body::after,

    #experience-strategy:checked
    ~ .experience-map__navigation
    label[for="experience-strategy"]
    .experience-route-card__body::after,

    #experience-specialist:checked
    ~ .experience-map__navigation
    label[for="experience-specialist"]
    .experience-route-card__body::after {
        display: none;
    }

    .experience-map__drawer {
        margin-top: 1.8rem;
    }

    .experience-map__selection {
        align-items: flex-start;
    }

    .experience-reference-list {
        column-gap: 3rem;
        padding-right: 2.6rem;
        padding-left: 2.6rem;
    }

    .experience-case-study {
        grid-template-columns: 1fr;
        gap: 2.6rem;
        padding: 3.6rem 2.6rem;
    }

    .experience-case-study__facts {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .experience-case-study__fact {
        border-top: 0;
        border-left: 1px solid rgba(255, 255, 255, 0.16);
    }

    .experience-case-study__fact:first-child {
        border-left: 0;
    }
}

@media (max-width: 575px) {
    .section--experience-map {
        padding: 6rem 0;
    }

    .experience-map__header h2 {
        font-size: 3.1rem;
    }

    .experience-map__lead {
        font-size: 1.65rem;
    }

    .experience-map__navigation {
        grid-template-columns: 1fr;
        gap: 1rem;
        margin-top: 3.4rem;
    }

    .experience-route-card__body {
        min-height: auto;
        padding: 2rem 7rem 2rem 1.8rem;
    }

    .experience-route-card__icon {
        top: 1.7rem;
        right: 1.7rem;
        width: 4rem;
        height: 4rem;
    }

    .experience-route-card__icon::before {
        width: 2.1rem;
        height: 2.1rem;
    }

    .experience-route-card__kicker {
        font-size: 1.05rem;
    }

    .experience-route-card__title {
        max-width: none;
        font-size: 1.75rem;
    }

    .experience-route-card__text {
        margin-right: -5.2rem;
        font-size: 1.4rem;
    }

    .experience-route-card__action {
        margin-right: -5.2rem;
        padding-top: 1.3rem;
    }

    .experience-map__drawer {
        margin-top: 1.5rem;
        box-shadow: 0 1rem 2.6rem rgba(21, 36, 56, 0.07);
    }

    .experience-map__selection {
        flex-direction: column;
        gap: 1.6rem;
        padding: 2.2rem 1.8rem 1.9rem;
    }

    .experience-map__selection-state h3 {
        font-size: 2.15rem;
    }

    .experience-map__selection-state p {
        font-size: 1.4rem;
    }

    .experience-map__selection-reset {
        width: 100%;
    }

    .experience-reference-list {
        grid-template-columns: 1fr;
        padding: 0 1.8rem;
    }

    .experience-reference,
    .experience-reference--featured {
        grid-column: auto;
        padding: 2.5rem 0 2.6rem;
    }

    .experience-reference:nth-last-child(-n + 2) {
        border-bottom: 1px solid rgba(21, 36, 56, 0.11);
    }

    .experience-reference:last-child {
        border-bottom: 0;
    }

    .experience-reference::before {
        top: 1.35rem;
        font-size: 7.5rem;
    }

    .experience-reference blockquote p,
    .experience-reference--featured blockquote p {
        font-size: 1.52rem;
    }

    .experience-case-study {
        padding: 3rem 1.8rem;
    }

    .experience-case-study h3 {
        font-size: 2.4rem;
    }

    .experience-case-study__lead {
        font-size: 1.48rem;
    }

    .experience-case-study__facts {
        grid-template-columns: 1fr;
    }

    .experience-case-study__fact {
        border-top: 1px solid rgba(255, 255, 255, 0.16);
        border-left: 0;
    }

    .experience-case-study__fact:first-child {
        border-top: 0;
    }
}


/* ==========================================================
   Stránka Kdo jsem
   Klientsky orientovaná profilová stránka
   ========================================================== */

:root {
    --about-ink: #152438;
    --about-ink-deep: #07131d;
    --about-blue: #1f3f7a;
    --about-orange: #e95314;
    --about-orange-soft: #f06a2d;
    --about-sand: #f7f4ef;
    --about-grey: #f2f4f6;
    --about-muted: #667085;
    --about-line: rgba(21, 36, 56, 0.12);
}

.about-eyebrow {
    margin: 0 0 1.2rem;
    color: var(--about-orange);
    font-size: 1.28rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.35;
    text-transform: uppercase;
}

.about-text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    color: var(--about-orange);
    font-size: 1.55rem;
    font-weight: 750;
    line-height: 1.35;
    text-decoration: none;
    transition: gap 0.2s ease, color 0.2s ease;
}

.about-text-link:hover {
    gap: 1.2rem;
    color: #c7430d;
    text-decoration: none;
}

/* ==========================================================
   Hero
   ========================================================== */

.section--about-hero {
    position: relative;
    overflow: hidden;
    padding: 7.8rem 0 0;
    background:
        radial-gradient(circle at 76% 12%, rgba(233, 83, 20, 0.10), transparent 27rem),
        linear-gradient(180deg, #ffffff 0%, #f9fafb 100%);
}

.section--about-hero::after {
    content: "";
    position: absolute;
    right: -8rem;
    bottom: 0;
    width: 52rem;
    height: 52rem;
    border: 1px solid rgba(31, 63, 122, 0.08);
    border-radius: 50%;
    pointer-events: none;
}

.about-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(36rem, 0.9fr);
    gap: 4rem;
    align-items: end;
    min-height: 65rem;
}

.about-hero__content {
    position: relative;
    z-index: 2;
    align-self: center;
    padding: 1.5rem 0 7.5rem;
}

.about-hero h1 {
    max-width: 82rem;
    margin: 0;
    color: var(--about-ink);
    font-size: clamp(4.7rem, 5vw, 7.3rem);
    letter-spacing: -0.065em;
    line-height: 0.98;
}

.about-hero__lead {
    max-width: 72rem;
    margin: 2.8rem 0 0;
    color: #344054;
    font-size: 1.85rem;
    line-height: 1.62;
}

.about-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2.4rem;
    margin-top: 3.3rem;
}

.about-hero__proof {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    max-width: 71rem;
    margin-top: 5rem;
    border-top: 1px solid var(--about-line);
    border-bottom: 1px solid var(--about-line);
}

.about-hero__proof div {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1.65rem 1.7rem 1.7rem;
    border-left: 1px solid var(--about-line);
}

.about-hero__proof div:first-child {
    padding-left: 0;
    border-left: 0;
}

.about-hero__proof strong {
    color: var(--about-blue);
    font-size: 2.35rem;
    font-weight: 850;
    letter-spacing: -0.04em;
    line-height: 1;
}

.about-hero__proof span {
    color: #667085;
    font-size: 1.22rem;
    line-height: 1.4;
}

.about-hero__visual {
    position: relative;
    z-index: 1;
    min-height: 62rem;
}

.about-hero__visual picture,
.about-hero__visual img {
    display: block;
    width: 100%;
    height: auto;
}

.about-hero__visual picture {
    position: absolute;
    right: -2rem;
    bottom: 0;
    width: min(49rem, 100%);
}

.about-hero__visual img {
    filter: drop-shadow(0 2.2rem 2rem rgba(0, 0, 0, 0.16));
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 88%, rgba(0, 0, 0, 0.86) 94%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 88%, rgba(0, 0, 0, 0.86) 94%, transparent 100%);
}

.about-hero__caption {
    position: absolute;
    right: 0;
    bottom: 4.6rem;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    max-width: 24rem;
    padding: 1.55rem 1.8rem;
    background: rgba(7, 19, 29, 0.92);
    box-shadow: 0 1.5rem 3.5rem rgba(7, 19, 29, 0.2);
    color: #fff;
}

.about-hero__caption strong {
    font-size: 1.55rem;
    line-height: 1.2;
}

.about-hero__caption span {
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.2rem;
    line-height: 1.45;
}

.about-hero__route {
    position: absolute;
    right: 2.5rem;
    top: 7rem;
    width: 28rem;
    height: 28rem;
    border: 1px dashed rgba(31, 63, 122, 0.20);
    border-radius: 50%;
}

.about-hero__route::before,
.about-hero__route::after,
.about-hero__route span {
    content: "";
    position: absolute;
    width: 1rem;
    height: 1rem;
    border: 0.25rem solid #fff;
    border-radius: 50%;
    background: var(--about-orange);
    box-shadow: 0 0 0 0.2rem rgba(233, 83, 20, 0.18);
}

.about-hero__route::before {
    left: 3.2rem;
    top: 5rem;
}

.about-hero__route::after {
    right: 5rem;
    bottom: 2.4rem;
}

.about-hero__route span:nth-child(1) {
    right: 3.8rem;
    top: 5.2rem;
}

.about-hero__route span:nth-child(2) {
    left: 4.6rem;
    bottom: 4rem;
}

.about-hero__route span:nth-child(3) {
    left: 13.4rem;
    top: 13.4rem;
}

/* ==========================================================
   Diagnostika
   ========================================================== */

.section--about-diagnosis {
    padding: 8rem 0;
    color: #fff;
    background:
        linear-gradient(120deg, rgba(7, 19, 29, 0.98), rgba(21, 36, 56, 0.97)),
        url("../img/thesea.jpg") center / cover;
}

.about-diagnosis {
    display: grid;
    grid-template-columns: minmax(29rem, 0.88fr) minmax(0, 1.12fr);
    gap: 7rem;
    align-items: start;
}

.about-diagnosis h2 {
    max-width: 56rem;
    margin: 0;
    color: #fff;
    font-size: 4.4rem;
    letter-spacing: -0.055em;
    line-height: 1.04;
}

.about-diagnosis__lead {
    max-width: 74rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 1.75rem;
    line-height: 1.68;
}

.about-diagnosis__questions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin-top: 3rem;
    background: rgba(255, 255, 255, 0.16);
}

.about-diagnosis__questions div {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    min-height: 16rem;
    padding: 2rem 1.8rem;
    background: rgba(7, 19, 29, 0.78);
}

.about-diagnosis__questions strong {
    color: #fff;
    font-size: 1.55rem;
    line-height: 1.35;
}

.about-diagnosis__questions span {
    color: rgba(255, 255, 255, 0.66);
    font-size: 1.35rem;
    line-height: 1.5;
}

/* ==========================================================
   Přínosy a princip
   ========================================================== */

.section--about-benefits {
    padding: 10rem 0;
    background: #fff;
}

.about-section-heading {
    max-width: 92rem;
    margin: 0 auto;
    text-align: center;
}

.about-section-heading h2 {
    margin: 0;
    color: var(--about-ink);
    font-size: 4.65rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.about-section-heading > p:last-child {
    max-width: 77rem;
    margin: 2rem auto 0;
    color: #667085;
    font-size: 1.72rem;
    line-height: 1.66;
}

.about-benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.4rem;
    margin-top: 5.5rem;
}

.about-benefit-card {
    position: relative;
    min-height: 29rem;
    padding: 2.5rem 2.25rem;
    border-top: 0.35rem solid var(--about-orange);
    background: #f5f6f7;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.about-benefit-card:hover {
    transform: translateY(-0.5rem);
    box-shadow: 0 1.8rem 3.4rem rgba(21, 36, 56, 0.11);
}

.about-benefit-card__number {
    display: block;
    color: rgba(31, 63, 122, 0.33);
    font-size: 1.32rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.about-benefit-card h3 {
    margin: 3.5rem 0 0;
    color: var(--about-ink);
    font-size: 2.15rem;
    letter-spacing: -0.035em;
    line-height: 1.16;
}

.about-benefit-card p {
    margin: 1.45rem 0 0;
    color: #667085;
    font-size: 1.48rem;
    line-height: 1.62;
}

.about-principle {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr);
    gap: 2.2rem;
    max-width: 101rem;
    margin: 6rem auto 0;
    padding: 3.5rem 4rem 3.5rem 3.1rem;
    color: #fff;
    background: linear-gradient(120deg, var(--about-ink-deep), var(--about-ink));
    box-shadow: 0 2.4rem 5rem rgba(7, 19, 29, 0.16);
}

.about-principle__mark {
    color: var(--about-orange-soft);
    font-family: Georgia, serif;
    font-size: 10rem;
    line-height: 0.85;
}

.about-principle p {
    max-width: 80rem;
    margin: 0;
    font-size: 2.15rem;
    font-weight: 650;
    letter-spacing: -0.025em;
    line-height: 1.42;
}

.about-principle span {
    display: block;
    margin-top: 1.2rem;
    color: rgba(255, 255, 255, 0.64);
    font-size: 1.42rem;
    line-height: 1.55;
}

/* ==========================================================
   Typické situace
   ========================================================== */

.section--about-situations {
    padding: 10rem 0 9rem;
    background: var(--about-ink);
}

.about-section-heading--light h2 {
    color: #fff;
}

.about-section-heading--light > p:last-child {
    color: rgba(255, 255, 255, 0.7);
}

.about-situation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.2rem;
    margin-top: 5rem;
}

.about-situation-card {
    min-height: 30rem;
    padding: 2.4rem 2.2rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(7, 19, 29, 0.55);
    transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.about-situation-card:hover {
    transform: translateY(-0.45rem);
    border-color: rgba(240, 106, 45, 0.82);
    background: rgba(7, 19, 29, 0.85);
}

.about-situation-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.7rem;
    height: 4.7rem;
    border: 1px solid rgba(240, 106, 45, 0.58);
    border-radius: 50%;
    color: var(--about-orange-soft);
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1;
}

.about-situation-card h3 {
    margin: 3.1rem 0 0;
    color: #fff;
    font-size: 2.1rem;
    letter-spacing: -0.035em;
    line-height: 1.18;
}

.about-situation-card p {
    margin: 1.35rem 0 0;
    color: rgba(255, 255, 255, 0.68);
    font-size: 1.45rem;
    line-height: 1.62;
}

.about-situations__action {
    display: flex;
    justify-content: center;
    margin-top: 4.2rem;
}

/* ==========================================================
   Proces
   ========================================================== */

.section--about-process {
    padding: 10rem 0;
    background: var(--about-sand);
}

.about-process {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
    gap: 8rem;
    align-items: start;
}

.about-process__intro h2 {
    max-width: 59rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.35rem;
    letter-spacing: -0.055em;
    line-height: 1.04;
}

.about-process__intro p {
    max-width: 61rem;
    margin: 2rem 0 2.4rem;
    color: #667085;
    font-size: 1.68rem;
    line-height: 1.65;
}

.about-process__steps {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: about-process;
}

.about-process__steps li {
    position: relative;
    display: grid;
    grid-template-columns: 6.8rem minmax(0, 1fr);
    gap: 2rem;
    min-height: 14rem;
    padding: 0 0 3.2rem;
}

.about-process__steps li::before {
    content: "";
    position: absolute;
    left: 2.5rem;
    top: 5.3rem;
    bottom: 0;
    width: 1px;
    background: rgba(31, 63, 122, 0.20);
}

.about-process__steps li:last-child {
    min-height: 0;
    padding-bottom: 0;
}

.about-process__steps li:last-child::before {
    display: none;
}

.about-process__steps span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5.1rem;
    height: 5.1rem;
    border: 1px solid rgba(31, 63, 122, 0.22);
    border-radius: 50%;
    background: #fff;
    color: var(--about-blue);
    font-size: 1.22rem;
    font-weight: 850;
    letter-spacing: 0.06em;
}

.about-process__steps h3 {
    margin: 0.7rem 0 0;
    color: var(--about-ink);
    font-size: 2.05rem;
    letter-spacing: -0.03em;
    line-height: 1.2;
}

.about-process__steps p {
    max-width: 65rem;
    margin: 1rem 0 0;
    color: #667085;
    font-size: 1.5rem;
    line-height: 1.55;
}

/* ==========================================================
   Zkušenosti
   ========================================================== */

.section--about-experience {
    padding: 10rem 0;
    background: #fff;
}

.about-experience {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(34rem, 0.92fr);
    gap: 7rem;
    align-items: center;
}

.about-experience h2 {
    max-width: 74rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.45rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.about-experience__content p:not(.about-eyebrow) {
    max-width: 75rem;
    margin: 2rem 0 0;
    color: #667085;
    font-size: 1.68rem;
    line-height: 1.67;
}

.about-experience__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: rgba(21, 36, 56, 0.12);
}

.about-experience__stats div {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 14rem;
    padding: 2.4rem 2.1rem;
    background: #f5f6f7;
}

.about-experience__stats strong {
    color: var(--about-orange);
    font-size: 3.3rem;
    font-weight: 850;
    letter-spacing: -0.055em;
    line-height: 1;
}

.about-experience__stats span {
    color: #667085;
    font-size: 1.35rem;
    line-height: 1.5;
}

/* ==========================================================
   Tým
   ========================================================== */

.section--about-team {
    padding: 9rem 0;
    background: #f4f5f6;
}

.about-team {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(36rem, 0.92fr);
    gap: 7rem;
    align-items: center;
}

.about-team h2 {
    max-width: 71rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.25rem;
    letter-spacing: -0.055em;
    line-height: 1.04;
}

.about-team__content p:not(.about-eyebrow) {
    max-width: 72rem;
    margin: 1.9rem 0 0;
    color: #667085;
    font-size: 1.65rem;
    line-height: 1.65;
}

.about-team__services {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.about-team__services > span {
    display: flex;
    align-items: center;
    min-height: 7rem;
    padding: 1.55rem 1.5rem;
    border-left: 0.3rem solid rgba(233, 83, 20, 0.62);
    background: #fff;
    color: var(--about-ink);
    font-size: 1.42rem;
    font-weight: 700;
    line-height: 1.35;
}

.about-team__brand {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 7rem;
    padding: 1.4rem 1.65rem;
    background: var(--about-ink);
}

.about-team__brand small {
    color: rgba(255, 255, 255, 0.68);
    font-size: 1.22rem;
    line-height: 1.4;
}

.about-team__brand img {
    display: block;
    width: 8rem;
    height: auto;
    filter: brightness(0) invert(1);
}

/* ==========================================================
   FAQ
   ========================================================== */

.section--about-faq {
    padding: 10rem 0;
    background: #fff;
}

.about-faq {
    max-width: 100rem;
    margin: 4.6rem auto 0;
    border-top: 1px solid var(--about-line);
}

.about-faq details {
    border-bottom: 1px solid var(--about-line);
}

.about-faq summary {
    position: relative;
    padding: 2.4rem 5.4rem 2.4rem 0;
    color: var(--about-ink);
    cursor: pointer;
    font-size: 1.75rem;
    font-weight: 750;
    line-height: 1.4;
    list-style: none;
}

.about-faq summary::-webkit-details-marker {
    display: none;
}

.about-faq summary::after {
    content: "+";
    position: absolute;
    right: 0.5rem;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.3rem;
    height: 3.3rem;
    border: 1px solid rgba(233, 83, 20, 0.44);
    border-radius: 50%;
    color: var(--about-orange);
    font-size: 2.15rem;
    font-weight: 500;
    line-height: 1;
    transform: translateY(-50%);
}

.about-faq details[open] summary::after {
    content: "−";
}

.about-faq details p {
    max-width: 84rem;
    margin: -0.5rem 0 2.4rem;
    padding-right: 3rem;
    color: #667085;
    font-size: 1.55rem;
    line-height: 1.62;
}

/* ==========================================================
   Kontakt
   ========================================================== */

.section--about-contact {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 8rem 0;
}

.section--about-contact > .parallax-bg {
    z-index: 0;
    object-position: 50% 55%;
}

.section--about-contact::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg, rgba(0, 8, 12, 0.78), rgba(0, 8, 12, 0.56));
    pointer-events: none;
}

.section--about-contact .container {
    position: relative;
    z-index: 2;
}

.about-contact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 23rem;
    gap: 4rem;
    align-items: end;
    max-width: 111rem;
    margin: 0 auto;
    padding: 4.6rem 4.8rem 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.20);
    background: linear-gradient(120deg, rgba(1, 8, 12, 0.95), rgba(5, 13, 17, 0.84));
    box-shadow: 0 2.4rem 5rem rgba(0, 0, 0, 0.28);
    color: #fff;
}

.about-contact__content {
    padding-bottom: 4.8rem;
}

.about-contact h2 {
    max-width: 76rem;
    margin: 0;
    color: #fff;
    font-size: 4rem;
    letter-spacing: -0.055em;
    line-height: 1.07;
}

.about-contact__content > p:not(.about-eyebrow) {
    max-width: 72rem;
    margin: 1.8rem 0 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: 1.65rem;
    line-height: 1.63;
}

.about-contact__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2rem;
    margin-top: 2.8rem;
}

.about-contact__mail {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.35rem;
}

.about-contact__mail:hover {
    color: var(--about-orange-soft);
}

.about-contact__person {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.about-contact__person picture,
.about-contact__person img {
    display: block;
    width: 100%;
    height: auto;
}

.about-contact__person picture {
    margin-top: auto;
}

.about-contact__person img {
    max-height: 32rem;
    object-fit: contain;
    object-position: bottom center;
    filter: drop-shadow(0 1.4rem 1.4rem rgba(0, 0, 0, 0.18));
}

.about-contact__person div {
    padding: 1.3rem 1.5rem;
    background: rgba(7, 19, 29, 0.82);
}

.about-contact__person strong,
.about-contact__person span {
    display: block;
}

.about-contact__person strong {
    color: #fff;
    font-size: 1.45rem;
    line-height: 1.3;
}

.about-contact__person span {
    margin-top: 0.2rem;
    color: rgba(255, 255, 255, 0.66);
    font-size: 1.18rem;
    line-height: 1.4;
}

/* ==========================================================
   Responzivita
   ========================================================== */

@media (max-width: 1199px) {
    .about-hero {
        grid-template-columns: minmax(0, 1.1fr) minmax(31rem, 0.72fr);
        gap: 2rem;
    }

    .about-hero h1 {
        font-size: 6.1rem;
    }

    .about-diagnosis,
    .about-process,
    .about-experience,
    .about-team {
        gap: 4.8rem;
    }

    .about-benefit-grid,
    .about-situation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about-benefit-card,
    .about-situation-card {
        min-height: 24rem;
    }
}

@media (max-width: 991px) {
    .section--about-hero {
        padding-top: 6rem;
    }

    .about-hero {
        display: block;
        min-height: 0;
    }

    .about-hero__content {
        padding: 0 0 6rem;
    }

    .about-hero h1 {
        max-width: 79rem;
        font-size: 5.4rem;
    }

    .about-hero__visual {
        display: none;
    }

    .about-diagnosis,
    .about-process,
    .about-experience,
    .about-team {
        grid-template-columns: 1fr;
        gap: 3.8rem;
    }

    .about-diagnosis__questions {
        margin-top: 2.5rem;
    }

    .about-section-heading h2,
    .about-diagnosis h2,
    .about-process__intro h2,
    .about-experience h2,
    .about-team h2,
    .about-contact h2 {
        font-size: 3.75rem;
    }

    .about-contact {
        grid-template-columns: minmax(0, 1fr) 18rem;
        padding-right: 3.5rem;
        padding-left: 3.5rem;
    }
}

@media (max-width: 767px) {
    .section--about-hero,
    .section--about-diagnosis,
    .section--about-benefits,
    .section--about-situations,
    .section--about-process,
    .section--about-experience,
    .section--about-team,
    .section--about-faq,
    .section--about-contact {
        padding-top: 6.5rem;
        padding-bottom: 6.5rem;
    }

    .about-hero__proof,
    .about-diagnosis__questions,
    .about-benefit-grid,
    .about-situation-grid,
    .about-experience__stats,
    .about-team__services {
        grid-template-columns: 1fr;
    }

    .about-hero__proof div,
    .about-hero__proof div:first-child {
        padding: 1.45rem 0;
        border-top: 1px solid var(--about-line);
        border-left: 0;
    }

    .about-hero__proof div:first-child {
        border-top: 0;
    }

    .about-diagnosis__questions div {
        min-height: 0;
    }

    .about-benefit-card,
    .about-situation-card {
        min-height: 0;
    }

    .about-principle {
        grid-template-columns: 1fr;
        gap: 0;
        padding: 2.7rem 2.5rem;
    }

    .about-principle__mark {
        height: 6.5rem;
        font-size: 9rem;
    }

    .about-principle p {
        font-size: 1.85rem;
    }

    .about-team__brand {
        grid-column: auto;
    }

    .about-contact {
        display: block;
        padding: 3rem 2.4rem;
    }

    .about-contact__content {
        padding-bottom: 0;
    }

    .about-contact__person {
        display: none;
    }
}

@media (max-width: 575px) {
    .section--about-hero {
        padding-top: 4.8rem;
        padding-bottom: 0;
    }

    .about-hero h1 {
        font-size: 4.25rem;
    }

    .about-hero__lead {
        font-size: 1.65rem;
    }

    .about-hero__actions {
        align-items: stretch;
        flex-direction: column;
        gap: 1.7rem;
    }

    .about-hero__actions .btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .about-section-heading h2,
    .about-diagnosis h2,
    .about-process__intro h2,
    .about-experience h2,
    .about-team h2,
    .about-contact h2 {
        font-size: 3.15rem;
    }

    .about-section-heading > p:last-child,
    .about-diagnosis__lead,
    .about-process__intro p,
    .about-experience__content p:not(.about-eyebrow),
    .about-team__content p:not(.about-eyebrow),
    .about-contact__content > p:not(.about-eyebrow) {
        font-size: 1.55rem;
    }

    .about-benefit-grid,
    .about-situation-grid {
        margin-top: 3.7rem;
    }

    .about-benefit-card,
    .about-situation-card {
        padding: 2rem 1.8rem;
    }

    .about-benefit-card h3,
    .about-situation-card h3 {
        margin-top: 2.5rem;
        font-size: 1.95rem;
    }

    .about-principle {
        margin-top: 4rem;
        padding: 2.4rem 2rem;
    }

    .about-process__steps li {
        grid-template-columns: 5.7rem minmax(0, 1fr);
        gap: 1.5rem;
    }

    .about-process__steps li::before {
        left: 2.15rem;
        top: 4.7rem;
    }

    .about-process__steps span {
        width: 4.5rem;
        height: 4.5rem;
        font-size: 1.1rem;
    }

    .about-faq summary {
        padding-right: 4.7rem;
        font-size: 1.58rem;
    }

    .about-contact__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .about-contact__actions .btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}

/* ==========================================================
   BLOG: detail článku bez pravého sloupce
   ========================================================== */

.blog-article-page {
    background: #fff;
    color: #102033;
}

.blog-main {
    overflow: hidden;
}

/* Hlavička článku je široká, ale text zůstává pod kontrolou. */
.blog-article-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 7.5rem 0 6.2rem;
    background:
        radial-gradient(95rem 25rem at 9% 22%, rgba(238, 225, 186, 0.30), transparent 72%),
        radial-gradient(85rem 24rem at 35% 76%, rgba(232, 213, 230, 0.32), transparent 76%),
        radial-gradient(80rem 22rem at 92% 45%, rgba(213, 236, 233, 0.32), transparent 72%),
        #fbfaf8;
    border-top: 1px solid rgba(16, 32, 51, 0.05);
    border-bottom: 1px solid rgba(16, 32, 51, 0.07);
}

.blog-article-hero::before,
.blog-article-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: -8vw;
    width: 116vw;
    height: 15rem;
    pointer-events: none;
    border-radius: 50%;
    border-top: 1px solid rgba(31, 63, 122, 0.06);
}

.blog-article-hero::before {
    top: 3rem;
    transform: rotate(5deg);
}

.blog-article-hero::after {
    bottom: -8rem;
    transform: rotate(-3deg);
}

.blog-article-hero__inner {
    max-width: 98rem;
    margin: 0 auto;
}

.blog-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    align-items: center;
    margin-bottom: 3.8rem;
    color: #6f7b88;
    font-size: 1.35rem;
    line-height: 1.4;
}

.blog-breadcrumb a {
    color: #53657a;
    text-decoration: none;
}

.blog-breadcrumb a:hover {
    color: #dc581e;
    text-decoration: underline;
}

.blog-article-hero__kicker {
    margin: 0 0 1.5rem;
    color: #dc581e;
    font-size: 1.35rem;
    font-weight: 780;
    letter-spacing: 0.13em;
    line-height: 1.3;
    text-transform: uppercase;
}

.blog-article-hero h1 {
    max-width: 92rem;
    margin: 0;
    color: #0d1c31;

    font-size: clamp(3.8rem, 3.9vw, 5.2rem);

    font-weight: 780;
    letter-spacing: -0.045em;
    line-height: 1.075;
}

.blog-article-hero__excerpt {
    max-width: 83rem;
    margin-top: 3rem;
    color: #344457;
    font-size: 2.15rem;
    line-height: 1.62;
}

.blog-article-hero__excerpt p {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
}

.blog-article-section {
    padding: 7.5rem 0 9rem;
    background: #fff;
}

/*
 * Vnější obal článku lícuje s hlavičkou článku.
 * Samotný text zůstává užší, aby se dobře četl i na širokém monitoru.
 * Obrázky a tabulky lze v obsahu rozšířit pomocí tříd .alignwide a .alignfull.
 */
.blog-article {
    max-width: 98rem;
    margin: 0 auto;
}

.blog-article-content,
.blog-article-meta,
.blog-admin-tools {
    max-width: 78rem;
}

.blog-admin-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem 1.35rem;
    align-items: center;
    margin: 0 0 3.5rem;
    padding: 1.4rem 1.6rem;
    color: #26384b;
    background: #fff8ed;
    border: 1px solid rgba(220, 88, 30, 0.27);
    border-left: 0.4rem solid #dc581e;
    border-radius: 0.7rem;
    font-size: 1.4rem;
    line-height: 1.45;
}

.blog-admin-tools a {
    color: #b84516;
    font-weight: 700;
}

.blog-article-content {
    color: #243548;
    font-size: 1.84rem;
    line-height: 1.78;
}

.blog-article-content > *:first-child {
    margin-top: 0;
}

.blog-article-content p,
.blog-article-content li {
    font-size: inherit;
    line-height: inherit;
}

.blog-article-content p {
    margin: 0 0 1.7em;
}

.blog-article-content h2,
.blog-article-content h3,
.blog-article-content h4,
.blog-article-content h5,
.blog-article-content h6 {
    color: #102033;
    font-weight: 770;
    letter-spacing: -0.025em;
}

.blog-article-content h2 {
    margin: 2em 0 0.72em;
    font-size: 3.25rem;
    line-height: 1.16;
}

.blog-article-content h3 {
    margin: 1.8em 0 0.65em;
    font-size: 2.55rem;
    line-height: 1.2;
}

.blog-article-content h4 {
    margin: 1.65em 0 0.55em;
    font-size: 2.1rem;
    line-height: 1.3;
}

.blog-article-content a {
    color: #c84f1c;
    text-decoration: underline;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.16em;
}

.blog-article-content a:hover {
    color: #8e3511;
}

.blog-article-content ul,
.blog-article-content ol {
    margin: 0 0 1.7em;
    padding-left: 1.5em;
}

.blog-article-content li {
    margin: 0.42em 0;
    padding-left: 0.18em;
}

.blog-article-content li::marker {
    color: #dc581e;
    font-weight: 750;
}

.blog-article-content blockquote {
    margin: 2.4em 0;
    padding: 1.2em 1.45em;
    color: #26384b;
    background: #f6f9fb;
    border-left: 0.45rem solid #dc581e;
}

.blog-article-content blockquote p:last-child {
    margin-bottom: 0;
}

.blog-article-content img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 0.55rem;
}

.blog-article-content figure {
    margin: 2.5em 0;
}

.blog-article-content figcaption,
.blog-article-content .wp-element-caption {
    margin-top: 0.75rem;
    color: #687686;
    font-size: 1.35rem;
    font-style: italic;
    line-height: 1.45;
}

.blog-article-content .alignwide,
.blog-article-content .wp-block-image.alignwide,
.blog-article-content .wp-block-table.alignwide {
    width: min(98rem, calc(100vw - 3rem));
    max-width: none;
    margin-right: auto;
    margin-left: 50%;
    transform: translateX(-50%);
}

.blog-article-content .alignfull,
.blog-article-content .wp-block-image.alignfull {
    width: min(118rem, calc(100vw - 3rem));
    max-width: none;
    margin-right: auto;
    margin-left: 50%;
    transform: translateX(-50%);
}

.blog-article-content iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    border: 0;
}

.blog-article-content .wp-block-columns {
    display: flex;
    gap: 2.4rem;
    align-items: flex-start;
    margin: 2.3em 0;
    padding: 2rem;
    background: #f7f9fb;
    border: 1px solid rgba(16, 32, 51, 0.09);
}

.blog-article-content .wp-block-column {
    flex: 1 1 0;
    min-width: 0;
}

.blog-article-content .wp-block-column > *:last-child {
    margin-bottom: 0;
}

.blog-article-content details,
.blog-article-content .wp-block-details {
    margin: 2.1em 0;
    padding: 0;
    background: #f8fafb;
    border: 1px solid rgba(16, 32, 51, 0.14);
    border-radius: 0.65rem;
}

.blog-article-content summary,
.blog-article-content .wp-block-details summary {
    cursor: pointer;
    padding: 1.2rem 1.45rem;
    color: #102033;
    background: #f1f5f7;
    font-size: 1.65rem;
    font-weight: 760;
    line-height: 1.45;
}

.blog-article-content details > *:not(summary) {
    margin-right: 1.45rem;
    margin-left: 1.45rem;
}

.blog-article-content details > *:last-child {
    margin-bottom: 1.45rem;
}

.blog-article-content table {
    width: 100%;
    margin: 2em 0;
    border-collapse: collapse;
    font-size: 1.55rem;
    line-height: 1.55;
}

.blog-article-content th,
.blog-article-content td {
    padding: 1rem 1.1rem;
    text-align: left;
    vertical-align: top;
    border: 1px solid rgba(16, 32, 51, 0.14);
}

.blog-article-content th {
    color: #102033;
    background: #f1f5f7;
    font-weight: 760;
}

.blog-article-content pre {
    overflow-x: auto;
    margin: 2em 0;
    padding: 1.4rem;
    color: #edf3f7;
    background: #0e1b2a;
    border-radius: 0.65rem;
    font-size: 1.45rem;
    line-height: 1.6;
}

.blog-article-content code {
    padding: 0.12em 0.32em;
    background: #f1f4f6;
    border-radius: 0.3rem;
    font-size: 0.9em;
}

.blog-article-content pre code {
    padding: 0;
    color: inherit;
    background: transparent;
}

.blog-article-content hr {
    height: 1px;
    margin: 3.3em 0;
    background: rgba(16, 32, 51, 0.16);
    border: 0;
}

.blog-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 5.5rem;
    padding-top: 2rem;
    color: #6e7c8a;
    border-top: 1px solid rgba(16, 32, 51, 0.13);
    font-size: 1.4rem;
    line-height: 1.5;
}

.blog-article-meta strong {
    color: #405268;
}

@media (max-width: 991px) {
    .blog-article-page {
        padding-top: 8rem;
    }

    .blog-article-hero {
        padding: 6.5rem 0 5.5rem;
    }

    .blog-article-hero__inner {
        max-width: 82rem;
    }
}

@media (max-width: 767px) {
    .blog-article-hero {
        padding: 5.1rem 0 4.7rem;
    }

    .blog-breadcrumb {
        margin-bottom: 2.8rem;
    }

   .blog-article-hero h1 {
        font-size: clamp(3.2rem, 8vw, 4.1rem);
        line-height: 1.1;
    }

    .blog-article-hero__excerpt {
        margin-top: 2.25rem;
        font-size: 1.85rem;
        line-height: 1.58;
    }

    .blog-article-section {
        padding: 5rem 0 6.5rem;
    }

    .blog-article-content {
        font-size: 1.72rem;
        line-height: 1.72;
    }

    .blog-article-content h2 {
        font-size: 2.8rem;
    }

    .blog-article-content h3 {
        font-size: 2.3rem;
    }

    .blog-article-content .wp-block-columns {
        display: block;
        padding: 1.6rem;
    }

    .blog-article-content .wp-block-column + .wp-block-column {
        margin-top: 1.7rem;
    }
}

@media (max-width: 575px) {
    .blog-article-page .personal-brand__name {
        font-size: 1.95rem;
    }

    .blog-article-hero {
        padding-top: 4.4rem;
    }

    .blog-article-hero__kicker {
        font-size: 1.2rem;
    }

    .blog-article-content {
        font-size: 1.66rem;
    }

    .blog-admin-tools {
        align-items: flex-start;
        flex-direction: column;
    }
}

.blog-article {
    width: 100%;
    max-width: 98rem;
    margin-right: auto;
    margin-left: auto;
}

.blog-article-content,
.blog-article-meta,
.blog-admin-tools {
    width: 100%;
    max-width: 78rem;
    margin-right: auto;
    margin-left: 0;
}
/* ==========================================================
   BLOG: výpis článků bez pravého sloupce
   ========================================================== */

.blog-index-page {
    color: #102033;
    background: #fff;
}

.blog-index-main {
    overflow: hidden;
}

.blog-index-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 8.4rem 0 8rem;
    background:
        radial-gradient(88rem 28rem at 10% 12%, rgba(238, 225, 186, 0.34), transparent 72%),
        radial-gradient(78rem 26rem at 45% 92%, rgba(232, 213, 230, 0.33), transparent 74%),
        radial-gradient(74rem 25rem at 95% 44%, rgba(213, 236, 233, 0.38), transparent 72%),
        #fbfaf8;
    border-top: 1px solid rgba(16, 32, 51, 0.05);
    border-bottom: 1px solid rgba(16, 32, 51, 0.07);
}

.blog-index-hero::before,
.blog-index-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: -7vw;
    width: 115vw;
    height: 15rem;
    pointer-events: none;
    border-radius: 50%;
    border-top: 1px solid rgba(31, 63, 122, 0.065);
}

.blog-index-hero::before {
    top: 2.5rem;
    transform: rotate(4deg);
}

.blog-index-hero::after {
    bottom: -8rem;
    transform: rotate(-3deg);
}

.blog-index-hero__inner {
    max-width: 94rem;
}

.blog-index-eyebrow {
    margin: 0 0 1.35rem;
    color: #dc581e;
    font-size: 1.32rem;
    font-weight: 780;
    letter-spacing: 0.14em;
    line-height: 1.35;
    text-transform: uppercase;
}

.blog-index-hero h1 {
    max-width: 92rem;
    margin: 0;
    color: #0d1c31;
    font-size: clamp(4.7rem, 5.6vw, 7.4rem);
    font-weight: 790;
    letter-spacing: -0.056em;
    line-height: 1.02;
}

.blog-index-hero__lead {
    max-width: 77rem;
    margin: 2.5rem 0 0;
    color: #344457;
    font-size: 2.05rem;
    line-height: 1.62;
}

.blog-index-editorial {
    padding: 6.4rem 0 7.6rem;
    background: #fff;
}

.blog-index-section-heading {
    display: flex;
    gap: 4rem;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 2.2rem;
}

.blog-index-section-heading h2 {
    max-width: 79rem;
    margin: 0;
    color: #102033;
    font-size: clamp(3.4rem, 4vw, 5rem);
    font-weight: 780;
    letter-spacing: -0.045em;
    line-height: 1.08;
}

.blog-index-section-heading > p {
    max-width: 54rem;
    margin: 0;
    color: #5b6978;
    font-size: 1.58rem;
    line-height: 1.62;
}

.blog-index-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.62rem;
    align-items: center;
    color: #6d7986;
    font-size: 1.27rem;
    font-weight: 620;
    letter-spacing: 0.02em;
    line-height: 1.45;
}

.blog-featured {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(36rem, 0.82fr);
    min-height: 47rem;
    overflow: hidden;
    color: #fff;
    background: #102033;
    box-shadow: 0 2.1rem 4.8rem rgba(16, 32, 51, 0.18);
}

.blog-featured__media,
.blog-card__media {
    position: relative;
    display: block;
    overflow: hidden;
    background:
        radial-gradient(circle at 22% 27%, rgba(255, 255, 255, 0.16), transparent 24%),
        linear-gradient(130deg, #173653, #1e5f6d 68%, #d8b77b);
}

.blog-featured__media::after,
.blog-card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(130deg, rgba(8, 22, 39, 0.06), rgba(8, 22, 39, 0.22));
    transition: background-color 250ms ease;
}

.blog-featured__media img,
.blog-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 480ms ease;
}

.blog-featured:hover .blog-featured__media img,
.blog-card:hover .blog-card__media img {
    transform: scale(1.045);
}

.blog-card__media--placeholder::before {
    content: "";
    position: absolute;
    right: -10%;
    bottom: -31%;
    width: 78%;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    box-shadow:
        0 0 0 2.8rem rgba(255, 255, 255, 0.045),
        0 0 0 5.7rem rgba(255, 255, 255, 0.03);
}

.blog-card__placeholder-mark {
    position: absolute;
    top: 2.5rem;
    left: 2.5rem;
    width: 5.1rem;
    height: 0.42rem;
    background: rgba(255, 255, 255, 0.78);
}

.blog-card__placeholder-mark::after {
    content: "";
    position: absolute;
    top: 1.15rem;
    left: 0;
    width: 3.2rem;
    height: 0.42rem;
    background: rgba(255, 255, 255, 0.46);
}

.blog-featured__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 4.8rem 4.9rem 4.6rem;
}

.blog-featured__label {
    margin: 0 0 1.4rem;
    color: #f06a2d;
    font-size: 1.25rem;
    font-weight: 780;
    letter-spacing: 0.13em;
    line-height: 1.35;
    text-transform: uppercase;
}

.blog-featured .blog-index-meta {
    color: rgba(255, 255, 255, 0.68);
}

.blog-featured h2 {
    margin: 1.3rem 0 0;
    font-size: clamp(3rem, 3vw, 4.3rem);
    font-weight: 760;
    letter-spacing: -0.045em;
    line-height: 1.08;
}

.blog-featured h2 a {
    color: #fff;
    text-decoration: none;
}

.blog-featured h2 a:hover {
    color: #fff;
    text-decoration: underline;
    text-decoration-thickness: 0.07em;
    text-underline-offset: 0.13em;
}

.blog-featured__excerpt {
    margin: 2rem 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.68rem;
    line-height: 1.63;
}

.blog-read-more {
    display: inline-flex;
    gap: 0.85rem;
    align-items: center;
    width: fit-content;
    margin-top: 2.5rem;
    color: #dc581e;
    font-size: 1.52rem;
    font-weight: 760;
    line-height: 1.35;
    text-decoration: none;
}

.blog-read-more span {
    font-size: 1.85rem;
    line-height: 1;
    transition: transform 220ms ease;
}

.blog-read-more:hover {
    color: #b84516;
    text-decoration: none;
}

.blog-read-more:hover span {
    transform: translateX(0.42rem);
}

.blog-featured .blog-read-more {
    color: #f06a2d;
}

.blog-featured .blog-read-more:hover {
    color: #fff;
}

.blog-secondary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2.5rem;
    margin-top: 2.7rem;
}

.blog-card {
    display: grid;
    grid-template-columns: minmax(18rem, 0.88fr) minmax(0, 1.12fr);
    min-height: 29rem;
    overflow: hidden;
    background: #f7f9fa;
    border: 1px solid rgba(16, 32, 51, 0.09);
    transition:
        transform 240ms ease,
        box-shadow 240ms ease,
        border-color 240ms ease;
}

.blog-card:hover {
    border-color: rgba(220, 88, 30, 0.28);
    box-shadow: 0 1.25rem 3rem rgba(16, 32, 51, 0.12);
    transform: translateY(-0.35rem);
}

.blog-card__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 2.7rem 2.6rem 2.45rem;
}

.blog-card h3 {
    margin: 1.05rem 0 0;
    color: #102033;
    font-size: 2.25rem;
    font-weight: 760;
    letter-spacing: -0.035em;
    line-height: 1.16;
}

.blog-card h3 a {
    color: inherit;
    text-decoration: none;
}

.blog-card h3 a:hover {
    color: #c84f1c;
}

.blog-card p {
    margin: 1.25rem 0 0;
    color: #4d5d6d;
    font-size: 1.48rem;
    line-height: 1.58;
}

.blog-card .blog-read-more {
    margin-top: auto;
    padding-top: 2rem;
    font-size: 1.4rem;
}

.blog-index-stream-section {
    padding: 6.2rem 0 7.2rem;
    background: #eef5f8;
}

.blog-index-section-heading--stream {
    margin-bottom: 2.2rem;
}

.blog-stream {
    background: rgba(255, 255, 255, 0.78);
    border-top: 0.4rem solid #dc581e;
}

.blog-stream-item {
    padding: 2.8rem 3.2rem 2.9rem;
    border-bottom: 1px solid rgba(16, 32, 51, 0.12);
    transition: background-color 220ms ease;
}

.blog-stream-item:hover {
    background: #fff;
}

.blog-stream-item__date {
    margin-top: 0.75rem;
    color: #71808e;
    font-size: 1.31rem;
    font-weight: 670;
    line-height: 1.45;
}

.blog-index-meta--stream {
    margin-bottom: 0.55rem;
    color: #dc581e;
}

.blog-stream-item h3 {
    margin: 0;
    color: #102033;
    font-size: 2.55rem;
    font-weight: 760;
    letter-spacing: -0.035em;
    line-height: 1.16;
}

.blog-stream-item h3 a {
    color: inherit;
    text-decoration: none;
}

.blog-stream-item h3 a:hover {
    color: #c84f1c;
}

.blog-stream-item p {
    max-width: 93rem;
    margin: 1rem 0 0;
    color: #536272;
    font-size: 1.55rem;
    line-height: 1.62;
}


@media (max-width: 1199px) {
    .blog-featured {
        grid-template-columns: minmax(0, 1fr) minmax(34rem, 0.9fr);
    }

    .blog-featured__content {
        padding: 4.1rem 3.8rem;
    }

    .blog-secondary-grid {
        gap: 1.8rem;
    }

    .blog-card {
        display: block;
    }

    .blog-card__media {
        height: 19.5rem;
    }
}

@media (max-width: 991px) {
    .blog-index-hero {
        padding-top: 14rem;
        padding-bottom: 6.8rem;
    }

    .blog-index-editorial {
        padding: 6.7rem 0 7.2rem;
    }

    .blog-featured {
        display: block;
        min-height: auto;
    }

    .blog-featured__media {
        height: 39rem;
    }

    .blog-index-stream-section {
        padding: 6.8rem 0 7.6rem;
    }
}

@media (max-width: 767px) {
    .blog-index-hero {
        padding-top: 12.5rem;
        padding-bottom: 5.7rem;
    }

    .blog-index-hero h1 {
        font-size: clamp(4.1rem, 11vw, 5.5rem);
        line-height: 1.035;
    }

    .blog-index-hero__lead {
        margin-top: 2.1rem;
        font-size: 1.82rem;
        line-height: 1.58;
    }

    .blog-index-editorial,
    .blog-index-stream-section {
        padding-top: 5.6rem;
        padding-bottom: 6.2rem;
    }

    .blog-index-section-heading {
        display: block;
        margin-bottom: 2.6rem;
    }

    .blog-index-section-heading h2 {
        font-size: 3.6rem;
    }

    .blog-index-section-heading > p {
        margin-top: 1.6rem;
    }

    .blog-featured__media {
        height: 27rem;
    }

    .blog-featured__content {
        padding: 3.2rem 2.7rem 3.4rem;
    }

    .blog-featured h2 {
        font-size: 3.15rem;
    }

    .blog-secondary-grid {
        grid-template-columns: 1fr;
        gap: 1.7rem;
        margin-top: 1.8rem;
    }

    .blog-card__media {
        height: 22rem;
    }

    .blog-stream-item {
        padding: 2.35rem 2rem 2.45rem;
    }

    .blog-stream-item h3 {
        font-size: 2.25rem;
    }
}

@media (max-width: 575px) {
    .blog-index-page .personal-brand__name {
        font-size: 1.95rem;
    }

    .blog-index-hero h1 {
        font-size: 4rem;
    }

    .blog-featured__media {
        height: 22rem;
    }

    .blog-featured__content {
        padding: 2.7rem 2.15rem 3rem;
    }

    .blog-featured h2 {
        font-size: 2.72rem;
    }

    .blog-featured__excerpt {
        font-size: 1.56rem;
    }

    .blog-card__body {
        padding: 2.35rem 2.05rem 2.2rem;
    }

    .blog-card h3 {
        font-size: 2.15rem;
    }

    .blog-stream-item p {
        font-size: 1.48rem;
    }
}


/* ==========================================================
   Kontaktní stránka
   Vložte na konec assets/css/custom.css
   ========================================================== */

.section--contact-page-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 67rem;
    padding: 15rem 0 9rem;
    color: #fff;
}

.section--contact-page-hero > .parallax-bg {
    z-index: 0;
    object-position: 50% 54%;
}

.section--contact-page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(0, 9, 14, 0.88) 0%, rgba(2, 18, 28, 0.75) 50%, rgba(0, 9, 14, 0.70) 100%);
}

.section--contact-page-hero::after {
    content: "";
    position: absolute;
    right: -13rem;
    bottom: -18rem;
    z-index: 1;
    width: 49rem;
    height: 49rem;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 50%;
    box-shadow:
        0 0 0 7rem rgba(255, 255, 255, 0.035),
        0 0 0 14rem rgba(255, 255, 255, 0.022);
}

.section--contact-page-hero .container {
    position: relative;
    z-index: 2;
}

.contact-page-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(34rem, 44rem);
    gap: 7rem;
    align-items: center;
}

.contact-page-eyebrow {
    margin: 0 0 1.2rem;
    color: #f06a2d;
    font-size: 1.35rem;
    font-weight: 780;
    letter-spacing: 0.13em;
    line-height: 1.3;
    text-transform: uppercase;
}

.contact-page-hero h1 {
    max-width: 77rem;
    margin: 0;
    color: #fff;
    font-size: clamp(5rem, 7vw, 8rem);
    letter-spacing: -0.065em;
    line-height: 0.98;
}

.contact-page-hero__lead {
    max-width: 72rem;
    margin: 2.6rem 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1.95rem;
    line-height: 1.62;
}

.contact-page-hero__points {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 3rem;
}

.contact-page-hero__points span {
    display: inline-flex;
    align-items: center;
    padding: 0.75rem 1.25rem;
    color: rgba(255, 255, 255, 0.90);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.19);
    border-radius: 999px;
    font-size: 1.3rem;
    font-weight: 680;
}

.contact-page-direct {
    padding: 3rem;
    background: rgba(1, 8, 12, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 2rem;
    box-shadow: 0 2.5rem 5rem rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.contact-page-direct__label {
    margin: 0 0 1rem;
    color: rgba(255, 255, 255, 0.68);
    font-size: 1.35rem;
    font-weight: 720;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.contact-page-direct__item {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-top: 1rem;
    padding: 1.55rem 0;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    text-decoration: none;
    transition: 180ms ease;
}

.contact-page-direct__item:hover {
    color: #f06a2d;
    text-decoration: none;
}

.contact-page-direct__icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 4.8rem;
    height: 4.8rem;
    color: #f06a2d;
    background: rgba(233, 83, 20, 0.12);
    border: 1px solid rgba(233, 83, 20, 0.44);
    border-radius: 50%;
}

.contact-page-direct__item span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.22rem;
}

.contact-page-direct__item small {
    color: rgba(255, 255, 255, 0.64);
    font-size: 1.18rem;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.contact-page-direct__item strong {
    overflow-wrap: anywhere;
    font-size: 1.9rem;
    line-height: 1.25;
}

.contact-page-direct__note {
    margin: 2.1rem 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 1.4rem;
    line-height: 1.58;
}

.section--contact-page-process {
    padding: 9rem 0;
    background: #fff;
}

.contact-page-section-heading {
    max-width: 81rem;
    margin-bottom: 4rem;
}

.contact-page-section-heading h2 {
    margin: 0;
    color: #102033;
    font-size: clamp(3.6rem, 4vw, 5.1rem);
    letter-spacing: -0.055em;
    line-height: 1.06;
}

.contact-page-process {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.contact-page-process li {
    min-height: 24rem;
    padding: 2.9rem 2.7rem;
    background: #eef5f8;
    border-top: 0.4rem solid #e95314;
}

.contact-page-process li > span,
.contact-page-reason__number {
    display: block;
    color: #e95314;
    font-size: 1.35rem;
    font-weight: 820;
    letter-spacing: 0.12em;
}

.contact-page-process h3 {
    margin: 2.7rem 0 0;
    color: #102033;
    font-size: 2.35rem;
    line-height: 1.16;
}

.contact-page-process p {
    margin: 1.05rem 0 0;
    color: #4a5b68;
    font-size: 1.55rem;
    line-height: 1.62;
}

.section--contact-page-reasons {
    padding: 9rem 0;
    background: #102033;
}

.contact-page-section-heading--light h2 {
    color: #fff;
}

.contact-page-reasons {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.contact-page-reason {
    min-height: 31rem;
    padding: 3rem 2.7rem;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.contact-page-reason h3 {
    margin: 3.3rem 0 0;
    color: #fff;
    font-size: 2.35rem;
    line-height: 1.18;
}

.contact-page-reason p {
    margin: 1.15rem 0 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.55rem;
    line-height: 1.62;
}

.section--contact-page-billing {
    padding: 5.8rem 0 6.5rem;
    background: #eef5f8;
}

.contact-page-billing {
    display: grid;
    grid-template-columns: minmax(24rem, 0.85fr) minmax(27rem, 1fr) minmax(23rem, 0.75fr);
    gap: 4rem;
    align-items: start;
    max-width: 104rem;
    margin: 0 auto;
    padding: 3rem 3.4rem;
    background: rgba(255, 255, 255, 0.74);
    border-left: 0.35rem solid #e95314;
}

.contact-page-billing h2 {
    margin: 0;
    color: #102033;
    font-size: 3rem;
    letter-spacing: -0.045em;
    line-height: 1.1;
}

.contact-page-billing__address {
    color: #394750;
    font-size: 1.48rem;
    font-style: normal;
    line-height: 1.62;
}

.contact-page-billing__address strong {
    color: #102033;
}

.contact-page-billing__ids p {
    display: grid;
    grid-template-columns: 5rem 1fr;
    gap: 0.8rem;
    margin: 0 0 0.55rem;
    color: #102033;
    font-size: 1.45rem;
    line-height: 1.4;
}

.contact-page-billing__ids span {
    color: #71808e;
    font-size: 1.18rem;
    font-weight: 760;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.contact-page-billing__ids small {
    display: block;
    margin-top: 0.75rem;
    color: #71808e;
    font-size: 1.25rem;
}

@media (max-width: 991px) {
    .section--contact-page-hero {
        min-height: auto;
        padding: 13rem 0 7rem;
    }

    .contact-page-hero {
        grid-template-columns: 1fr;
        gap: 3.5rem;
    }

    .contact-page-direct {
        max-width: 59rem;
    }

    .contact-page-process,
    .contact-page-reasons {
        grid-template-columns: 1fr;
    }

    .contact-page-process li,
    .contact-page-reason {
        min-height: auto;
    }

    .contact-page-billing {
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem 3rem;
    }

    .contact-page-billing > div:first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 575px) {
    .section--contact-page-hero {
        padding: 11rem 0 5.5rem;
    }

    .contact-page-hero h1 {
        font-size: 5rem;
    }

    .contact-page-hero__lead {
        font-size: 1.72rem;
    }

    .contact-page-direct {
        padding: 2.1rem;
        border-radius: 1.5rem;
    }

    .contact-page-direct__item strong {
        font-size: 1.6rem;
    }

    .section--contact-page-process,
    .section--contact-page-reasons {
        padding: 6.2rem 0;
    }

    .contact-page-section-heading {
        margin-bottom: 2.8rem;
    }

    .contact-page-section-heading h2 {
        font-size: 3.55rem;
    }

    .contact-page-process li,
    .contact-page-reason {
        padding: 2.35rem 2.1rem;
    }

    .section--contact-page-billing {
        padding: 4.4rem 0 5rem;
    }

    .contact-page-billing {
        grid-template-columns: 1fr;
        gap: 2.2rem;
        padding: 2.4rem 2.1rem;
    }

    .contact-page-billing > div:first-child {
        grid-column: auto;
    }
}


/* ==========================================================
   404 stránka
   ========================================================== */

.section--error-page {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 68rem;
    padding: 9rem 0;
    background: #07131d;
}

.section--error-page > .parallax-bg {
    z-index: 0;
    object-position: 50% 55%;
}

.section--error-page::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(
            100deg,
            rgba(2, 10, 16, 0.96) 0%,
            rgba(4, 18, 27, 0.86) 48%,
            rgba(5, 21, 30, 0.67) 100%
        );
}

.section--error-page .container {
    position: relative;
    z-index: 2;
}

.error-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(27rem, 33rem);
    gap: 7rem;
    align-items: end;
    max-width: 112rem;
    margin: 0 auto;
}

.error-page__content {
    position: relative;
    max-width: 74rem;
}

.error-page__eyebrow {
    margin: 0 0 1.7rem;
    color: #f06a2d;
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.error-page__code {
    margin: 0 0 -2rem;
    color: rgba(255, 255, 255, 0.13);
    font-size: clamp(10rem, 17vw, 18rem);
    font-weight: 900;
    letter-spacing: -0.12em;
    line-height: 0.72;
}

.error-page h1 {
    max-width: 73rem;
    margin: 0;
    color: #fff;
    font-size: clamp(4.8rem, 6vw, 7.4rem);
    letter-spacing: -0.065em;
    line-height: 0.98;
}

.error-page__lead {
    max-width: 67rem;
    margin: 2.2rem 0 0;
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.85rem;
    line-height: 1.58;
}

.error-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    margin-top: 3.1rem;
}

.error-page .btn--border {
    color: #fff;
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.5);
}

.error-page .btn--border:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.88);
}

.error-page__note {
    max-width: 66rem;
    margin: 2.5rem 0 0;
    color: rgba(255, 255, 255, 0.66);
    font-size: 1.4rem;
    line-height: 1.62;
}

.error-page__note a {
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: rgba(240, 106, 45, 0.8);
    text-underline-offset: 0.22em;
}

.error-page__links {
    padding: 2.5rem;
    background: rgba(1, 8, 12, 0.62);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 1.8rem;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.error-page__links > p {
    margin: 0 0 1rem;
    color: #f06a2d;
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.error-page__links a {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1.45rem 0;
    color: rgba(255, 255, 255, 0.68);
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    font-size: 1.35rem;
    line-height: 1.35;
    text-decoration: none;
    transition: 0.2s ease;
}

.error-page__links a:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.error-page__links a:hover {
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
}

.error-page__links strong {
    color: #fff;
    font-size: 1.85rem;
    line-height: 1.25;
}

.error-page__links a:hover strong {
    color: #f06a2d;
}

@media (max-width: 991px) {
    .section--error-page {
        min-height: auto;
        padding: 7rem 0;
    }

    .error-page {
        grid-template-columns: 1fr;
        gap: 4rem;
        align-items: start;
    }

    .error-page__links {
        max-width: 55rem;
    }
}

@media (max-width: 575px) {
    .section--error-page {
        padding: 5.5rem 0;
    }

    .error-page__code {
        margin-bottom: -1.1rem;
        font-size: 10rem;
    }

    .error-page h1 {
        font-size: 5rem;
    }

    .error-page__lead {
        font-size: 1.7rem;
    }

    .error-page__actions {
        flex-direction: column;
    }

    .error-page__actions .btn {
        width: 100%;
        text-align: center;
    }

    .error-page__links {
        padding: 2.1rem;
        border-radius: 1.4rem;
    }
}
/* ==========================================================
   Kolik stojí online marketing — vstupní stránka / cenik.tpl
   ========================================================== */

.section--pricing-hero {
    overflow: hidden;
    padding: 8.5rem 0 8rem;
    background:
        radial-gradient(circle at 92% 10%, rgba(207, 224, 236, 0.72), transparent 30rem),
        linear-gradient(120deg, #ffffff 0%, #ffffff 62%, #f1f6f8 100%);
}

.pricing-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(36rem, 0.75fr);
    gap: 7rem;
    align-items: center;
}

.pricing-eyebrow {
    margin: 0 0 1.2rem;
    color: #e95314;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1.35;
    text-transform: uppercase;
}

.pricing-hero h1 {
    max-width: 75rem;
    margin: 0;
    color: #07131d;
    font-size: clamp(5rem, 6vw, 7.6rem);
    letter-spacing: -0.07em;
    line-height: 0.98;
}

.pricing-hero__lead {
    max-width: 72rem;
    margin: 2.4rem 0 0;
    color: #263943;
    font-size: 2rem;
    line-height: 1.58;
}

.pricing-hero__note {
    max-width: 70rem;
    margin: 1.6rem 0 0;
    color: #64737c;
    font-size: 1.45rem;
    line-height: 1.62;
}

.pricing-hero__actions,
.pricing-contact__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    margin-top: 3rem;
}

.pricing-hero__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 2.7rem;
}

.pricing-hero__badges span {
    padding: 0.75rem 1.1rem;
    color: #41535d;
    background: #fff;
    border: 1px solid #d5e0e5;
    border-radius: 999px;
    font-size: 1.22rem;
    font-weight: 700;
}

.pricing-budget-map {
    position: relative;
    overflow: hidden;
    padding: 3.2rem;
    color: #fff;
    background:
        linear-gradient(145deg, rgba(7, 19, 29, 0.99), rgba(21, 36, 56, 0.96));
    border-radius: 2.4rem;
    box-shadow: 0 2.5rem 5rem rgba(21, 48, 62, 0.2);
}

.pricing-budget-map::after {
    content: "";
    position: absolute;
    right: -8rem;
    bottom: -8rem;
    width: 20rem;
    height: 20rem;
    border: 3rem solid rgba(233, 83, 20, 0.16);
    border-radius: 50%;
}

.pricing-budget-map__eyebrow {
    margin: 0 0 0.8rem;
    color: #f06a2d;
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.pricing-budget-map h2 {
    max-width: 35rem;
    margin: 0;
    color: #fff;
    font-size: 3.8rem;
    letter-spacing: -0.055em;
    line-height: 1.03;
}

.pricing-budget-map__layers {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 1rem;
    margin-top: 2.8rem;
}

.pricing-budget-map__layer {
    display: grid;
    grid-template-columns: 4.4rem minmax(0, 1fr);
    gap: 1.2rem;
    align-items: center;
    padding: 1.45rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 1.3rem;
}

.pricing-budget-map__layer > span {
    display: grid;
    place-items: center;
    width: 4.4rem;
    height: 4.4rem;
    color: #fff;
    background: rgba(233, 83, 20, 0.82);
    border-radius: 50%;
    font-size: 1.35rem;
    font-weight: 850;
}

.pricing-budget-map__layer strong,
.pricing-budget-map__layer small {
    display: block;
}

.pricing-budget-map__layer strong {
    color: #fff;
    font-size: 1.65rem;
    line-height: 1.2;
}

.pricing-budget-map__layer small {
    margin-top: 0.3rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.25rem;
    line-height: 1.35;
}

.pricing-budget-map__footnote {
    position: relative;
    z-index: 1;
    margin: 2.2rem 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.35rem;
    line-height: 1.55;
}

.section--pricing-scenarios,
.section--pricing-list,
.section--pricing-faq {
    padding: 9rem 0;
    background: #fff;
}

.pricing-heading {
    max-width: 82rem;
    margin-bottom: 4rem;
}

.pricing-heading h2,
.pricing-methodology h2,
.pricing-mid-cta h2,
.pricing-contact h2 {
    margin: 0;
    color: #07131d;
    font-size: clamp(3.7rem, 4.1vw, 5.3rem);
    letter-spacing: -0.06em;
    line-height: 1.03;
}

.pricing-heading > p:last-child,
.pricing-methodology p,
.pricing-mid-cta p,
.pricing-contact p {
    margin: 1.7rem 0 0;
    color: #3d4d55;
    font-size: 1.75rem;
    line-height: 1.64;
}

.pricing-scenarios {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.pricing-scenario {
    position: relative;
    overflow: hidden;
    min-height: 36rem;
    padding: 2.8rem;
    background: #f2f6f7;
    border-top: 0.45rem solid #b8cbd3;
}

.pricing-scenario--highlight {
    background: #e5eff3;
    border-color: #e95314;
}

.pricing-scenario__label {
    margin: 0 0 1.3rem;
    color: #e95314;
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.pricing-scenario h3 {
    min-height: 6.5rem;
    margin: 0;
    color: #152438;
    font-size: 2.35rem;
    letter-spacing: -0.035em;
    line-height: 1.16;
}

.pricing-scenario__price {
    margin: 2.8rem 0 0;
    color: #07131d;
    font-size: 3.3rem;
    font-weight: 850;
    letter-spacing: -0.055em;
    line-height: 1;
}

.pricing-scenario__price span {
    color: #6a7d86;
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: 0;
}

.pricing-scenario > p:last-child {
    margin: 2rem 0 0;
    color: #42545d;
    font-size: 1.55rem;
    line-height: 1.58;
}

.pricing-scenarios__disclaimer {
    margin: 2.3rem 0 0;
    color: #708089;
    font-size: 1.35rem;
    line-height: 1.55;
}

.section--pricing-principles {
    padding: 8.5rem 0;
    color: #fff;
    background: linear-gradient(120deg, #07131d, #152438);
}

.pricing-heading--light h2 {
    color: #fff;
}

.pricing-principles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.2rem;
}

.pricing-principles article {
    padding: 2.5rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.pricing-principles span {
    color: #f06a2d;
    font-size: 1.35rem;
    font-weight: 850;
    letter-spacing: 0.08em;
}

.pricing-principles h3 {
    margin: 1.2rem 0 0;
    color: #fff;
    font-size: 2.2rem;
    letter-spacing: -0.035em;
    line-height: 1.2;
}

.pricing-principles p {
    margin: 1.25rem 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 1.5rem;
    line-height: 1.6;
}

.section--pricing-list {
    background: #eef5f8;
}

.pricing-list {
    display: grid;
    gap: 1rem;
}

.pricing-item {
    background: #fff;
    border: 1px solid #d8e4e8;
    transition: 0.2s ease;
}

.pricing-item[open] {
    border-color: rgba(233, 83, 20, 0.55);
    box-shadow: 0 1.5rem 3.2rem rgba(30, 61, 74, 0.1);
}

.pricing-item summary {
    display: grid;
    grid-template-columns: 6.2rem minmax(0, 1fr) minmax(18rem, auto) 2.8rem;
    gap: 1.7rem;
    align-items: center;
    min-height: 10.5rem;
    padding: 1.8rem 2.2rem;
    cursor: pointer;
    list-style: none;
}

.pricing-item summary::-webkit-details-marker {
    display: none;
}

.pricing-item__icon {
    display: grid;
    place-items: center;
    width: 6.2rem;
    height: 6.2rem;
    color: #e95314;
    background: #fdf0eb;
    border-radius: 50%;
    font-size: 1.15rem;
    font-weight: 850;
    letter-spacing: -0.02em;
    text-align: center;
}

.pricing-item__heading strong,
.pricing-item__heading small,
.pricing-item__range,
.pricing-item__range small {
    display: block;
}

.pricing-item__heading strong {
    color: #152438;
    font-size: 2.05rem;
    line-height: 1.2;
}

.pricing-item__heading small {
    margin-top: 0.45rem;
    color: #71808a;
    font-size: 1.32rem;
    line-height: 1.4;
}

.pricing-item__range {
    color: #152438;
    font-size: 1.75rem;
    font-weight: 850;
    line-height: 1.2;
    text-align: right;
}

.pricing-item__range small {
    margin-top: 0.3rem;
    color: #7b8990;
    font-size: 1.2rem;
    font-weight: 700;
}

.pricing-item__toggle {
    position: relative;
    width: 2.5rem;
    height: 2.5rem;
}

.pricing-item__toggle::before,
.pricing-item__toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.8rem;
    height: 0.2rem;
    background: #e95314;
    transform: translate(-50%, -50%);
    transition: 0.2s ease;
}

.pricing-item__toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.pricing-item[open] .pricing-item__toggle::after {
    transform: translate(-50%, -50%) rotate(0);
}

.pricing-item__content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(28rem, 0.42fr);
    gap: 3.2rem;
    padding: 0 2.2rem 2.5rem 10.1rem;
}

.pricing-item__content h3 {
    margin: 0;
    color: #152438;
    font-size: 1.55rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.pricing-item__content ul {
    display: grid;
    gap: 0.65rem;
    margin: 1.3rem 0 0;
    padding-left: 1.8rem;
}

.pricing-item__content li,
.pricing-item__warning p {
    color: #465861;
    font-size: 1.48rem;
    line-height: 1.58;
}

.pricing-item__warning {
    padding: 1.8rem;
    background: #f2f6f7;
    border-left: 0.35rem solid #e95314;
}

.pricing-item__warning p {
    margin: 0.9rem 0 0;
}

.section--pricing-mid-cta {
    padding: 7rem 0;
    background: #fff;
}

.pricing-mid-cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(24rem, 0.32fr);
    gap: 5rem;
    align-items: center;
    padding: 4.2rem;
    background: #e7f0f3;
    border-left: 0.55rem solid #e95314;
}

.pricing-mid-cta p {
    max-width: 76rem;
}

.pricing-mid-cta__action {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
}

.pricing-mid-cta__action > a:last-child {
    color: #40525b;
    font-size: 1.35rem;
    line-height: 1.45;
}

.pricing-mid-cta__action > a:last-child:hover {
    color: #e95314;
    text-decoration: none;
}

.pricing-faq {
    display: grid;
    gap: 1rem;
    max-width: 98rem;
}

.pricing-faq details,
.pricing-methodology details {
    background: #fff;
    border: 1px solid #d9e4e8;
}

.pricing-faq details[open],
.pricing-methodology details[open] {
    border-color: rgba(233, 83, 20, 0.55);
}

.pricing-faq summary,
.pricing-methodology summary {
    position: relative;
    padding: 2rem 5.5rem 2rem 2.2rem;
    color: #152438;
    cursor: pointer;
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.35;
    list-style: none;
}

.pricing-faq summary::-webkit-details-marker,
.pricing-methodology summary::-webkit-details-marker {
    display: none;
}

.pricing-faq summary::after,
.pricing-methodology summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 2.2rem;
    color: #e95314;
    font-size: 2.6rem;
    font-weight: 500;
    line-height: 1;
    transform: translateY(-50%);
}

.pricing-faq details[open] summary::after,
.pricing-methodology details[open] summary::after {
    content: "−";
}

.pricing-faq details p {
    max-width: 89rem;
    margin: 0;
    padding: 0 2.2rem 2.2rem;
    color: #50616a;
    font-size: 1.55rem;
    line-height: 1.62;
}

.section--pricing-methodology {
    padding: 7rem 0;
    background: #eef5f8;
}

.pricing-methodology {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(32rem, 0.55fr);
    gap: 4rem;
    align-items: start;
}

.pricing-methodology p {
    max-width: 76rem;
    font-size: 1.55rem;
}

.pricing-methodology details {
    background: rgba(255, 255, 255, 0.7);
}

.pricing-methodology ul {
    display: grid;
    gap: 0.9rem;
    margin: 0;
    padding: 0 2.2rem 2.2rem 4rem;
}

.pricing-methodology li {
    color: #50616a;
    font-size: 1.38rem;
    line-height: 1.5;
}

.pricing-methodology a {
    color: #d94f12;
}

.section--pricing-contact {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 8rem 0;
}

.section--pricing-contact > .parallax-bg {
    z-index: 0;
    object-position: 50% 56%;
}

.section--pricing-contact::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(100deg, rgba(2, 10, 16, 0.95), rgba(4, 18, 27, 0.76));
}

.section--pricing-contact .container {
    position: relative;
    z-index: 2;
}

.pricing-contact {
    max-width: 88rem;
    padding: 4rem;
    color: #fff;
    background: rgba(1, 8, 12, 0.78);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 2rem;
    box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.pricing-contact h2 {
    max-width: 82rem;
    color: #fff;
}

.pricing-contact p {
    max-width: 76rem;
    color: rgba(255, 255, 255, 0.82);
}

.pricing-contact .btn--border {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.55);
}

.pricing-contact .btn--border:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 991px) {
    .section--pricing-hero {
        padding: 7rem 0;
    }

    .pricing-hero,
    .pricing-methodology {
        grid-template-columns: 1fr;
        gap: 3.5rem;
    }

    .pricing-budget-map {
        max-width: 65rem;
    }

    .pricing-scenarios,
    .pricing-principles {
        grid-template-columns: 1fr;
    }

    .pricing-scenario {
        min-height: auto;
    }

    .pricing-scenario h3 {
        min-height: auto;
    }

    .pricing-item summary {
        grid-template-columns: 5.4rem minmax(0, 1fr) 2.5rem;
        gap: 1.35rem;
    }

    .pricing-item__icon {
        width: 5.4rem;
        height: 5.4rem;
    }

    .pricing-item__range {
        grid-column: 2;
        text-align: left;
    }

    .pricing-item__toggle {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .pricing-item__content {
        grid-template-columns: 1fr;
        gap: 1.8rem;
        padding-left: 9rem;
    }

    .pricing-mid-cta {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
}

@media (max-width: 575px) {
    .section--pricing-hero,
    .section--pricing-scenarios,
    .section--pricing-list,
    .section--pricing-faq,
    .section--pricing-contact {
        padding: 5.5rem 0;
    }

    .pricing-hero h1 {
        font-size: 5.2rem;
    }

    .pricing-hero__lead {
        font-size: 1.72rem;
    }

    .pricing-hero__actions,
    .pricing-contact__actions {
        flex-direction: column;
    }

    .pricing-hero__actions .btn,
    .pricing-contact__actions .btn {
        width: 100%;
        text-align: center;
    }

    .pricing-budget-map,
    .pricing-contact {
        padding: 2.2rem;
        border-radius: 1.5rem;
    }

    .pricing-budget-map h2 {
        font-size: 3.3rem;
    }

    .pricing-budget-map__layer {
        grid-template-columns: 3.7rem minmax(0, 1fr);
        padding: 1.15rem;
    }

    .pricing-budget-map__layer > span {
        width: 3.7rem;
        height: 3.7rem;
        font-size: 1.18rem;
    }

    .pricing-scenario,
    .pricing-principles article {
        padding: 2.2rem;
    }

    .pricing-item summary {
        grid-template-columns: minmax(0, 1fr) 2.5rem;
        min-height: auto;
        padding: 1.7rem;
    }

    .pricing-item__icon {
        display: none;
    }

    .pricing-item__heading strong {
        font-size: 1.78rem;
    }

    .pricing-item__range {
        grid-column: 1;
        font-size: 1.55rem;
    }

    .pricing-item__toggle {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .pricing-item__content {
        padding: 0 1.7rem 1.9rem;
    }

    .pricing-mid-cta {
        padding: 2.5rem 2.1rem;
    }

    .pricing-faq summary,
    .pricing-methodology summary {
        padding: 1.7rem 4.8rem 1.7rem 1.7rem;
        font-size: 1.6rem;
    }

    .pricing-faq details p {
        padding: 0 1.7rem 1.8rem;
        font-size: 1.48rem;
    }

    .pricing-contact h2 {
        font-size: 3.7rem;
    }
}

/* ==========================================================
   Rozšíření pro zachování informačního a SEO pokrytí
   ========================================================== */

.section--pricing-needs {
    padding: 8rem 0;
    background: #f8fbfc;
}

.pricing-needs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
}

.pricing-need {
    display: grid;
    grid-template-columns: 4.8rem minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
    padding: 2.4rem;
    color: #152438;
    background: #fff;
    border: 1px solid #d9e5e9;
    text-decoration: none;
    transition: 0.2s ease;
}

.pricing-need:hover {
    border-color: rgba(233, 83, 20, 0.72);
    box-shadow: 0 1.2rem 2.8rem rgba(30, 61, 74, 0.08);
    text-decoration: none;
    transform: translateY(-0.2rem);
}

.pricing-need > span {
    display: grid;
    place-items: center;
    width: 4.8rem;
    height: 4.8rem;
    color: #e95314;
    background: #fdf0eb;
    border-radius: 50%;
    font-size: 1.3rem;
    font-weight: 850;
}

.pricing-need h3 {
    margin: 0;
    color: #152438;
    font-size: 2rem;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.pricing-need p {
    margin: 0.65rem 0 0;
    color: #63747d;
    font-size: 1.48rem;
    line-height: 1.55;
}

.section--pricing-context {
    padding: 8.5rem 0;
    background: #fff;
}

.pricing-context {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(30rem, 0.42fr);
    gap: 5rem;
    align-items: start;
}

.pricing-context__content {
    max-width: 85rem;
}

.pricing-context h2 {
    margin: 0;
    color: #07131d;
    font-size: clamp(3.7rem, 4.1vw, 5.3rem);
    letter-spacing: -0.06em;
    line-height: 1.03;
}

.pricing-context__content > p:not(.pricing-eyebrow) {
    margin: 1.55rem 0 0;
    color: #3d4d55;
    font-size: 1.68rem;
    line-height: 1.68;
}

.pricing-context__aside {
    padding: 2.8rem;
    background: #e7f0f3;
    border-left: 0.45rem solid #e95314;
}

.pricing-context__aside-label {
    margin: 0;
    color: #e95314;
    font-size: 1.22rem;
    font-weight: 850;
    letter-spacing: 0.11em;
    line-height: 1.35;
    text-transform: uppercase;
}

.pricing-context__aside h3 {
    margin: 1.05rem 0 0;
    color: #152438;
    font-size: 2.35rem;
    letter-spacing: -0.035em;
    line-height: 1.2;
}

.pricing-context__aside p:not(.pricing-context__aside-label) {
    margin: 1.3rem 0 0;
    color: #52636c;
    font-size: 1.5rem;
    line-height: 1.62;
}

.pricing-context__aside a {
    display: inline-flex;
    margin-top: 1.8rem;
    color: #d94f12;
    font-size: 1.5rem;
    font-weight: 800;
    text-decoration: none;
}

.pricing-context__aside a:hover {
    text-decoration: underline;
}

@media (max-width: 991px) {
    .pricing-context {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .pricing-context__aside {
        max-width: 72rem;
    }
}

@media (max-width: 767px) {
    .section--pricing-needs,
    .section--pricing-context {
        padding: 6.5rem 0;
    }

    .pricing-needs {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575px) {
    .section--pricing-needs,
    .section--pricing-context {
        padding: 5.5rem 0;
    }

    .pricing-need {
        grid-template-columns: 4.2rem minmax(0, 1fr);
        gap: 1.2rem;
        padding: 1.8rem;
    }

    .pricing-need > span {
        width: 4.2rem;
        height: 4.2rem;
        font-size: 1.18rem;
    }

    .pricing-need h3 {
        font-size: 1.78rem;
    }

    .pricing-context__content > p:not(.pricing-eyebrow) {
        font-size: 1.55rem;
    }

    .pricing-context__aside {
        padding: 2.2rem;
    }
}

/* ==========================================================
   Ceník: tematické oblasti podle přínosu pro zákazníka
   ========================================================== */

.section--pricing-themes {
    padding: 9rem 0;
    background: #f8fbfc;
}

.pricing-themes {
    display: grid;
    gap: 2.4rem;
    margin-top: 4rem;
}

.pricing-theme {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(31rem, 39rem);
    gap: 3.4rem;
    align-items: start;
    padding: 3.6rem;
    background: #fff;
    border: 1px solid #d9e5e9;
    box-shadow: 0 1.4rem 3.4rem rgba(30, 61, 74, 0.07);
}

.pricing-theme__content {
    min-width: 0;
}

.pricing-theme__eyebrow {
    margin: 0;
    color: #e95314;
    font-size: 1.22rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    line-height: 1.4;
    text-transform: uppercase;
}

.pricing-theme h3 {
    margin: 0.9rem 0 0;
    color: #07131d;
    font-size: clamp(3.1rem, 3.6vw, 4.5rem);
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.pricing-theme__lead {
    max-width: 77rem;
    margin: 1.45rem 0 0;
    color: #4b5d66;
    font-size: 1.62rem;
    line-height: 1.65;
}

.pricing-theme__services {
    display: grid;
    gap: 0.8rem;
    margin-top: 2.6rem;
}

.pricing-theme-service {
    overflow: hidden;
    background: #f8fbfc;
    border: 1px solid #d9e5e9;
}

.pricing-theme-service summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 2.4rem;
    gap: 1.4rem;
    align-items: center;
    min-height: 7rem;
    padding: 1.5rem 1.7rem;
    cursor: pointer;
    list-style: none;
}

.pricing-theme-service summary::-webkit-details-marker {
    display: none;
}

.pricing-theme-service summary:hover {
    background: #fff;
}

.pricing-theme-service__heading {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.pricing-theme-service__heading strong {
    color: #152438;
    font-size: 1.68rem;
    letter-spacing: -0.02em;
    line-height: 1.28;
}

.pricing-theme-service__heading small {
    color: #6a7b83;
    font-size: 1.34rem;
    line-height: 1.45;
}

.pricing-theme-service__range {
    color: #d94f12;
    font-size: 1.45rem;
    font-weight: 850;
    line-height: 1.35;
    text-align: right;
    white-space: nowrap;
}

.pricing-theme-service__range small {
    display: block;
    color: #7b8a91;
    font-size: 1.15rem;
    font-weight: 700;
}

.pricing-theme-service__toggle {
    position: relative;
    width: 2.4rem;
    height: 2.4rem;
}

.pricing-theme-service__toggle::before,
.pricing-theme-service__toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.5rem;
    height: 0.2rem;
    background: #e95314;
    transform: translate(-50%, -50%);
    transition: transform 0.2s ease;
}

.pricing-theme-service__toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.pricing-theme-service[open] .pricing-theme-service__toggle::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.pricing-theme-service .pricing-item__content {
    padding: 0 1.7rem 1.8rem;
    border-top: 1px solid #e2ebee;
}

.pricing-theme-service .pricing-item__content > div:first-child {
    padding-top: 1.55rem;
}

.pricing-theme__visual {
    position: sticky;
    top: 10rem;
}

.pricing-theme__image-placeholder {
    display: flex;
    flex-direction: column;
    justify-content: end;
    aspect-ratio: 520 / 360;
    min-height: 25rem;
    padding: 2.2rem;
    color: rgba(255, 255, 255, 0.92);
    background:
        linear-gradient(145deg, rgba(7, 19, 29, 0.88), rgba(21, 36, 56, 0.82)),
        repeating-linear-gradient(135deg, rgba(255,255,255,0.08) 0 1px, transparent 1px 18px);
    border: 1px dashed rgba(255, 255, 255, 0.40);
}

.pricing-theme__image-placeholder span {
    color: #f06a2d;
    font-size: 1.18rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.pricing-theme__image-placeholder strong {
    display: block;
    margin-top: 0.75rem;
    color: #fff;
    font-size: 2.55rem;
    letter-spacing: -0.04em;
    line-height: 1.05;
}

.pricing-theme__image-placeholder small {
    display: block;
    margin-top: 1.05rem;
    color: rgba(255, 255, 255, 0.68);
    font-size: 1.25rem;
}

/* Sekce zdrojů zůstává jako stručné vysvětlení metodiky bez odkazů ven. */
.pricing-methodology {
    grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 1099px) {
    .pricing-theme {
        grid-template-columns: minmax(0, 1fr) minmax(27rem, 32rem);
        gap: 2.6rem;
        padding: 3rem;
    }
}

@media (max-width: 899px) {
    .section--pricing-themes {
        padding: 7rem 0;
    }

    .pricing-theme {
        grid-template-columns: 1fr;
    }

    .pricing-theme__visual {
        position: static;
        grid-row: 1;
    }

    .pricing-theme__image-placeholder {
        min-height: auto;
    }
}

@media (max-width: 575px) {
    .section--pricing-themes {
        padding: 5.5rem 0;
    }

    .pricing-themes {
        gap: 1.6rem;
        margin-top: 3rem;
    }

    .pricing-theme {
        gap: 2.2rem;
        padding: 1.8rem;
    }

    .pricing-theme h3 {
        font-size: 3rem;
    }

    .pricing-theme__lead {
        font-size: 1.52rem;
    }

    .pricing-theme-service summary {
        grid-template-columns: minmax(0, 1fr) 2.2rem;
        gap: 1rem;
        min-height: auto;
        padding: 1.45rem;
    }

    .pricing-theme-service__range {
        grid-column: 1;
        margin-top: 0.45rem;
        font-size: 1.38rem;
        text-align: left;
        white-space: normal;
    }

    .pricing-theme-service__range small {
        display: inline;
        margin-left: 0.25rem;
    }

    .pricing-theme-service__toggle {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .pricing-theme-service .pricing-item__content {
        padding: 0 1.45rem 1.55rem;
    }

    .pricing-theme__image-placeholder {
        padding: 1.8rem;
    }

    .pricing-theme__image-placeholder strong {
        font-size: 2.25rem;
    }
}


/* ==========================================================
   Úvodní obrázek ceníku
   Nahrazuje tmavý box „Není to jen cena reklamy“
   ========================================================== */

.pricing-hero__image-wrap {
    overflow: hidden;

    width: 100%;
    height: 40rem;

    border-radius: 2.4rem;

    box-shadow:
        0 2.5rem 5rem rgba(21, 48, 62, 0.20);
}

.pricing-hero__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: 50% 50%;
}

/* Po přesunu obrázku pod text nebude na tabletu zbytečně vysoký */
@media (max-width: 991px) {
    .pricing-hero__image-wrap {
        max-width: 65rem;
        height: auto;

        aspect-ratio: 16 / 10;
    }
}

@media (max-width: 575px) {
    .pricing-hero__image-wrap {
        border-radius: 1.5rem;
    }
}

/* ==========================================================
   Stránka: Konzultace online marketingu
   Doplňky k designovému systému stránky Kdo jsem
   ========================================================== */

.section--consult-hero .about-hero h1 {
    max-width: 88rem;
}

/* Výstupy konzultace */
.section--consult-outcomes {
    padding: 10rem 0;
    background: #fff;
}

.consult-outcome-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.4rem;
    margin-top: 5.5rem;
}

.consult-outcome-card {
    min-height: 25rem;
    padding: 2.5rem 2.25rem;
    border: 1px solid rgba(21, 36, 56, 0.10);
    border-top: 0.35rem solid var(--about-orange);
    background: #f7f8f9;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.consult-outcome-card:hover {
    transform: translateY(-0.5rem);
    box-shadow: 0 1.8rem 3.4rem rgba(21, 36, 56, 0.10);
}

.consult-outcome-card > span {
    display: block;
    color: rgba(31, 63, 122, 0.34);
    font-size: 1.32rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.consult-outcome-card h3 {
    margin: 3.2rem 0 0;
    color: var(--about-ink);
    font-size: 2.1rem;
    letter-spacing: -0.035em;
    line-height: 1.18;
}

.consult-outcome-card p {
    margin: 1.4rem 0 0;
    color: #667085;
    font-size: 1.48rem;
    line-height: 1.62;
}

.consult-principle {
    margin-top: 5.5rem;
}

/* Důkazy z referencí */
.section--consult-evidence {
    padding: 10rem 0;
    background: #f3f5f6;
}

.consult-evidence {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(34rem, 0.94fr);
    gap: 6.5rem;
    align-items: center;
}

.consult-evidence__intro h2 {
    max-width: 76rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.45rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.consult-evidence__intro p:not(.about-eyebrow) {
    max-width: 76rem;
    margin: 2rem 0 0;
    color: #667085;
    font-size: 1.66rem;
    line-height: 1.67;
}

.consult-evidence__intro .consult-method-note {
    color: #7b8791;
    font-size: 1.3rem;
    line-height: 1.58;
}

.consult-evidence__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: rgba(21, 36, 56, 0.12);
}

.consult-evidence__stats div {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    min-height: 15rem;
    padding: 2.4rem 2.1rem;
    background: #fff;
}

.consult-evidence__stats strong {
    color: var(--about-orange);
    font-size: 3.3rem;
    font-weight: 850;
    letter-spacing: -0.055em;
    line-height: 1;
}

.consult-evidence__stats span {
    color: #667085;
    font-size: 1.34rem;
    line-height: 1.5;
}

.consult-review-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.4rem;
    margin-top: 5rem;
}

.consult-review-card {
    position: relative;
    min-height: 32rem;
    margin: 0;
    padding: 3rem 2.6rem 2.5rem;
    overflow: hidden;
    border-left: 0.35rem solid var(--about-orange);
    background: #fff;
    box-shadow: 0 1.5rem 3.2rem rgba(21, 36, 56, 0.08);
}

.consult-review-card::before {
    content: "“";
    position: absolute;
    top: -2.1rem;
    right: 1.5rem;
    color: rgba(233, 83, 20, 0.10);
    font-family: Georgia, serif;
    font-size: 15rem;
    line-height: 1;
    pointer-events: none;
}

.consult-review-card blockquote,
.consult-review-card figcaption {
    position: relative;
    z-index: 1;
}

.consult-review-card blockquote {
    margin: 0;
}

.consult-review-card blockquote p {
    margin: 0;
    color: var(--about-ink);
    font-size: 1.62rem;
    font-weight: 570;
    line-height: 1.58;
}

.consult-review-card figcaption {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-top: 2.4rem;
}

.consult-review-card figcaption strong {
    color: var(--about-ink);
    font-size: 1.46rem;
}

.consult-review-card figcaption span {
    color: #7a8790;
    font-size: 1.26rem;
    line-height: 1.45;
}

.consult-process__steps li {
    min-height: 11rem;
}

.consult-experience__stats strong {
    font-size: 2.55rem;
    line-height: 1.08;
}

@media (max-width: 1199px) {
    .consult-review-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .consult-outcome-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .consult-outcome-card,
    .consult-review-card {
        min-height: 0;
    }
}

@media (max-width: 991px) {
    .consult-evidence {
        grid-template-columns: 1fr;
        gap: 3.8rem;
    }

    .consult-evidence__intro h2 {
        font-size: 3.75rem;
    }
}

@media (max-width: 767px) {
    .section--consult-outcomes,
    .section--consult-evidence {
        padding-top: 6.5rem;
        padding-bottom: 6.5rem;
    }

    .consult-outcome-grid,
    .consult-evidence__stats,
    .consult-review-grid {
        grid-template-columns: 1fr;
    }

    .consult-outcome-grid {
        margin-top: 4rem;
    }

    .consult-review-grid {
        margin-top: 4rem;
    }
}

@media (max-width: 575px) {
    .consult-evidence__intro h2 {
        font-size: 3.25rem;
    }

    .consult-outcome-card,
    .consult-review-card {
        padding: 2.2rem 2rem;
    }
}


/* ==========================================================
   Konzultace online marketingu: vizuální předěl s daty
   Fotografie přes celou šířku, text bez dalšího boxu
   ========================================================== */

.section--consult-data {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: 47rem;
    overflow: hidden;
    padding: 7rem 0;
    background: #0a151d;
}

/*
 * Samostatný obal ořízne okraje rozostřeného obrázku.
 * Obrázek se zvětšuje rovnoměrně pomocí transformace, takže se nedeformuje.
 */
.consult-data__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.consult-data__bg {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: 50% 58%;
    filter: blur(1px);
    transform: scale(1.02);
    transform-origin: center;
}

/* Přechod nechává čitelný text vlevo a fotografii notebooku viditelnou napravo. */
.section--consult-data::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(
            90deg,
            rgba(4, 13, 19, 0.97) 0%,
            rgba(4, 13, 19, 0.93) 30%,
            rgba(4, 13, 19, 0.76) 48%,
            rgba(4, 13, 19, 0.30) 72%,
            rgba(4, 13, 19, 0.08) 100%
        );
}

/* Jemné ztmavení spodní části pomůže při různých ořezech fotografie. */
.section--consult-data::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(0deg, rgba(2, 9, 13, 0.28), transparent 46%);
}

.section--consult-data .container {
    position: relative;
    z-index: 2;
    width: 100%;
}

.consult-data__content {
    max-width: 70rem;
    color: #fff;
}

.consult-data__content .about-eyebrow {
    margin-bottom: 1.15rem;
    color: var(--about-orange-soft);
}

.consult-data__content h2 {
    max-width: 67rem;
    margin: 0;
    color: #fff;
    font-size: 4.65rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.consult-data__content p:not(.about-eyebrow) {
    max-width: 66rem;
    margin: 1.7rem 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 1.66rem;
    line-height: 1.66;
}

.consult-data__content .consult-data__note {
    max-width: 63rem;
    margin-top: 2.4rem;
    padding-left: 1.7rem;
    color: rgba(255, 255, 255, 0.90);
    border-left: 0.3rem solid var(--about-orange-soft);
}

.consult-data__note strong {
    color: #fff;
}

@media (max-width: 991px) {
    .section--consult-data {
        min-height: 44rem;
        padding: 6.5rem 0;
    }

    .consult-data__bg {
        object-position: 57% 58%;
    }

    .section--consult-data::before {
        background:
            linear-gradient(
                90deg,
                rgba(4, 13, 19, 0.97) 0%,
                rgba(4, 13, 19, 0.92) 42%,
                rgba(4, 13, 19, 0.62) 72%,
                rgba(4, 13, 19, 0.34) 100%
            );
    }

    .consult-data__content {
        max-width: 64rem;
    }

    .consult-data__content h2 {
        font-size: 4rem;
    }
}

@media (max-width: 767px) {
    .section--consult-data {
        min-height: 0;
        padding: 6rem 0;
    }

    .consult-data__bg {
        object-position: 62% 56%;
        filter: blur(1.5px);
    }

    .section--consult-data::before {
        background: rgba(4, 13, 19, 0.80);
    }

    .consult-data__content h2 {
        font-size: 3.45rem;
    }

    .consult-data__content p:not(.about-eyebrow) {
        font-size: 1.55rem;
        line-height: 1.62;
    }
}

@media (max-width: 575px) {
    .section--consult-data {
        padding: 5.2rem 0;
    }

    .consult-data__content h2 {
        font-size: 3.1rem;
    }

    .consult-data__content .consult-data__note {
        margin-top: 2rem;
        padding-left: 1.35rem;
    }
}

/* ==========================================================
   Konzultace online marketingu: AI a zkušený konzultant
   Jediný kompaktní panel místo několika samostatných boxů
   ========================================================== */

.section--consult-ai {
    padding: 8rem 0;
    background: #eef5f8;
}

.consult-ai-panel {
    position: relative;
    overflow: hidden;
    padding: 5.8rem 6.2rem 4.8rem;
    color: #fff;
    background: linear-gradient(120deg, #07131d, #152438);
    border-radius: 2.4rem;
    box-shadow: 0 2.2rem 4.8rem rgba(21, 36, 56, 0.18);
}

/* Jemná dekorace zůstává pouze v pozadí panelu.
   Ilustrace konzultanta a robota už nemá vlastní kruhové podbarvení. */
.consult-ai-panel::before {
    content: "";
    position: absolute;
    right: -12rem;
    top: -17rem;
    width: 42rem;
    height: 42rem;
    border: 1px solid rgba(233, 83, 20, 0.22);
    border-radius: 50%;
    pointer-events: none;
}

.consult-ai {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(21rem, 29rem);
    gap: 4rem;
    align-items: center;
}

.consult-ai__intro h2 {
    max-width: 78rem;
    margin: 0;
    color: #fff;
    font-size: 4.3rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.consult-ai__intro p:not(.about-eyebrow) {
    max-width: 82rem;
    margin: 1.8rem 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.66rem;
    line-height: 1.67;
}

.consult-ai__intro strong {
    color: #fff;
}

/* Obrázek není další karta. Konzultant a robot volně sedí přímo v panelu.
   PNG má kolem postav transparentní prostor, proto ilustraci zvětšíme pomocí transformace.
   Nemění se tím šířka textového sloupce ani rozložení tabulky. */
.consult-ai__visual {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 25rem;
}

.consult-ai__visual picture,
.consult-ai__visual img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
}

.consult-ai__visual img {
    max-width: 31rem;
    object-fit: contain;
    transform: scale(1.38);
    transform-origin: center center;
    filter: drop-shadow(0 1.5rem 1.8rem rgba(0, 0, 0, 0.18));
}

/* Srovnání je součástí panelu. Nemá vlastní kartu, stín ani barevné hlavičkové bloky. */
.consult-ai-table__wrap {
    position: relative;
    z-index: 1;
    margin-top: 4rem;
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, 0.20);
    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
}

.consult-ai-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.consult-ai-table th,
.consult-ai-table td {
    text-align: left;
    vertical-align: top;
}

.consult-ai-table th {
    padding: 1.6rem 2rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 1.38rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.3;
    text-transform: uppercase;
}

.consult-ai-table th + th {
    color: #f06a2d;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.consult-ai-table td {
    position: relative;
    padding: 1.55rem 2rem 1.55rem 4.4rem;
    color: rgba(255, 255, 255, 0.70);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    font-size: 1.52rem;
    line-height: 1.55;
}

.consult-ai-table td + td {
    color: #fff;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
    font-weight: 620;
}

.consult-ai-table td::before {
    content: "✓";
    position: absolute;
    top: 1.7rem;
    left: 2rem;
    color: rgba(255, 255, 255, 0.65);
    font-size: 1.35rem;
    font-weight: 850;
    line-height: 1;
}

.consult-ai-table td + td::before {
    color: #f06a2d;
}

/* Závěr je pouze integrované zvýraznění, nikoliv další velký box. */
.consult-ai__conclusion {
    position: relative;
    z-index: 1;
    max-width: 106rem;
    margin-top: 3rem;
    padding: 1.55rem 1.9rem;
    background: rgba(255, 255, 255, 0.07);
    border-left: 0.4rem solid #e95314;
    border-radius: 0 1.2rem 1.2rem 0;
}

.consult-ai__conclusion h3 {
    margin: 0;
    color: #fff;
    font-size: 1.88rem;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.consult-ai__conclusion p {
    margin: 0.75rem 0 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.46rem;
    line-height: 1.6;
}

@media (max-width: 991px) {
    .section--consult-ai {
        padding: 7rem 0;
    }

    .consult-ai-panel {
        padding: 4.5rem;
    }

    .consult-ai {
        grid-template-columns: minmax(0, 1fr) 22rem;
        gap: 2rem;
    }

    .consult-ai__intro h2 {
        font-size: 3.75rem;
    }

    .consult-ai__visual {
        min-height: 22rem;
        width: 22rem;
        height: 22rem;
    }

    .consult-ai__visual img {
        max-width: 24rem;
        transform: scale(1.24);
    }
}

@media (max-width: 767px) {
    .section--consult-ai {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }

    .consult-ai-panel {
        padding: 3.4rem 2.5rem 3rem;
        border-radius: 1.6rem;
    }

    .consult-ai {
        grid-template-columns: 1fr;
        gap: 1.6rem;
    }

    .consult-ai__visual {
        justify-self: center;
        min-height: 17rem;
        width: 19rem;
    }

    .consult-ai__visual img {
        max-width: 20rem;
        transform: scale(1.12);
    }

    .consult-ai-table__wrap {
        margin-top: 2.8rem;
        overflow: visible;
    }

    .consult-ai-table,
    .consult-ai-table tbody,
    .consult-ai-table tr,
    .consult-ai-table td {
        display: block;
        width: 100%;
    }

    .consult-ai-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .consult-ai-table tr + tr {
        border-top: 1px solid rgba(255, 255, 255, 0.18);
    }

    .consult-ai-table td {
        padding: 3.9rem 0 1.35rem;
        border-top: 0;
        font-size: 1.46rem;
    }

    .consult-ai-table td + td {
        padding-top: 3.9rem;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        border-left: 0;
    }

    .consult-ai-table td::before {
        content: attr(data-label);
        top: 1.35rem;
        left: 0;
        color: rgba(255, 255, 255, 0.64);
        font-size: 1.16rem;
        letter-spacing: 0.055em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    .consult-ai-table td + td::before {
        color: #f06a2d;
    }

    .consult-ai__conclusion {
        margin-top: 2.5rem;
        padding: 1.4rem 1.55rem;
    }
}

@media (max-width: 575px) {
    .consult-ai__intro h2 {
        font-size: 3.05rem;
    }

    .consult-ai__intro p:not(.about-eyebrow) {
        font-size: 1.55rem;
    }

    .consult-ai__conclusion h3 {
        font-size: 1.75rem;
    }
}


/* ==========================================================
   Konzultace online marketingu: diagnostické vzorce z praxe
   Statistiky bez obalového boxu + kompaktní rozbalovací řádky
   ========================================================== */

.section--consult-patterns {
    scroll-margin-top: 10rem;
}

/* Orientační statistiky: samostatná dvousloupcová sada bez boxu */

.consult-pattern-stats {
    max-width: 112rem;
    margin: 5rem auto 0;
}

.consult-pattern-stats__eyebrow {
    margin: 0;
    color: var(--about-orange-soft);
    font-size: 1.2rem;
    font-weight: 820;
    letter-spacing: 0.075em;
    line-height: 1.35;
    text-transform: uppercase;
}

.consult-pattern-stats h3 {
    max-width: 70rem;
    margin: 0.9rem 0 0;
    color: #fff;
    font-size: 2.35rem;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.consult-pattern-stats__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 4.6rem;
    max-width: 112rem;
    margin: 2.5rem 0 0;
    padding: 0;
    list-style: none;
}

.consult-pattern-stat {
    display: grid;
    grid-template-columns: 6.4rem minmax(0, 1fr);
    gap: 1.45rem;
    align-items: center;
    min-width: 0;
    min-height: 9.1rem;
    padding: 1.35rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.consult-pattern-stat:nth-child(-n + 2) {
    border-top: 0;
}

.consult-pattern-stat__value {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    width: 6.1rem;
    height: 6.1rem;
    border: 1px solid rgba(240, 106, 45, 0.68);
    border-radius: 50%;
    color: var(--about-orange-soft);
    background: rgba(7, 19, 29, 0.22);
    font-size: 2.35rem;
    font-weight: 850;
    letter-spacing: -0.065em;
    line-height: 6rem;
}

.consult-pattern-stat__value small {
    margin-left: 0.12rem;
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.consult-pattern-stat__content p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.43rem;
    line-height: 1.5;
}

.consult-pattern-stat__content > span {
    display: block;
    margin-top: 0.4rem;
    color: rgba(255, 255, 255, 0.48);
    font-size: 1.16rem;
    font-weight: 720;
    letter-spacing: 0.035em;
    line-height: 1.35;
    text-transform: uppercase;
}

.consult-patterns__method {
    max-width: 100rem;
    margin: 2rem auto 0;
    color: rgba(255, 255, 255, 0.52);
    font-size: 1.23rem;
    line-height: 1.58;
}

.consult-patterns__method--stats {
    max-width: 112rem;
    margin-top: 1.45rem;
}

/* Rozbalovací diagnostické řádky */

.consult-pattern-list {
    max-width: 112rem;
    margin: 4.3rem auto 0;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.consult-pattern {
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(7, 19, 29, 0.34);
    transition: background 0.2s ease;
}

.consult-pattern:hover,
.consult-pattern[open] {
    background: rgba(7, 19, 29, 0.72);
}

.consult-pattern summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 3.2rem;
    gap: 1.5rem;
    align-items: center;
    padding: 2.15rem 2.4rem;
    color: #fff;
    cursor: pointer;
    list-style: none;
}

.consult-pattern summary::-webkit-details-marker {
    display: none;
}

.consult-pattern summary:focus-visible {
    outline: 0.2rem solid var(--about-orange-soft);
    outline-offset: -0.2rem;
}

.consult-pattern__title {
    color: #fff;
    font-size: 2.05rem;
    font-weight: 720;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.consult-pattern__toggle {
    position: relative;
    width: 3.2rem;
    height: 3.2rem;
    border: 1px solid rgba(240, 106, 45, 0.62);
    border-radius: 50%;
}

.consult-pattern__toggle::before,
.consult-pattern__toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.2rem;
    height: 0.15rem;
    background: var(--about-orange-soft);
    transform: translate(-50%, -50%);
    transition: transform 0.2s ease;
}

.consult-pattern__toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.consult-pattern[open] .consult-pattern__toggle::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.consult-pattern__body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.12);
}

.consult-pattern__answer {
    min-height: 17rem;
    padding: 2.15rem 2.4rem 2.35rem;
    background: rgba(7, 19, 29, 0.76);
}

.consult-pattern__answer strong {
    display: block;
    color: var(--about-orange-soft);
    font-size: 1.25rem;
    font-weight: 820;
    letter-spacing: 0.075em;
    line-height: 1.35;
    text-transform: uppercase;
}

.consult-pattern__answer p {
    margin: 1.05rem 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 1.48rem;
    line-height: 1.64;
}

@media (max-width: 991px) {
    .consult-pattern-stats__items {
        column-gap: 2.8rem;
    }

    .consult-pattern-stat {
        grid-template-columns: 5.8rem minmax(0, 1fr);
        gap: 1.2rem;
    }

    .consult-pattern-stat__value {
        width: 5.5rem;
        height: 5.5rem;
        font-size: 2.15rem;
        line-height: 5.4rem;
    }
}

@media (max-width: 767px) {
    .consult-pattern-stats {
        margin-top: 3.8rem;
    }

    .consult-pattern-stats h3 {
        font-size: 1.95rem;
    }

    .consult-pattern-stats__items {
        grid-template-columns: 1fr;
        margin-top: 1.7rem;
    }

    .consult-pattern-stat,
    .consult-pattern-stat:nth-child(-n + 2) {
        grid-template-columns: 5.4rem minmax(0, 1fr);
        gap: 1.1rem;
        min-height: 0;
        padding: 1.2rem 0;
        border-top: 1px solid rgba(255, 255, 255, 0.14);
    }

    .consult-pattern-stat:first-child {
        border-top: 0;
    }

    .consult-pattern-stat__value {
        width: 5rem;
        height: 5rem;
        font-size: 1.95rem;
        line-height: 4.9rem;
    }

    .consult-pattern-stat__value small {
        font-size: 1.05rem;
    }

    .consult-pattern-stat__content p {
        font-size: 1.36rem;
    }

    .consult-pattern-list {
        margin-top: 3.4rem;
    }

    .consult-pattern summary {
        grid-template-columns: minmax(0, 1fr) 2.9rem;
        gap: 1rem;
        padding: 1.75rem 1.4rem;
    }

    .consult-pattern__title {
        font-size: 1.68rem;
    }

    .consult-pattern__toggle {
        width: 2.9rem;
        height: 2.9rem;
    }

    .consult-pattern__body {
        grid-template-columns: 1fr;
    }

    .consult-pattern__answer {
        min-height: 0;
        padding: 1.8rem 1.6rem 2rem;
    }
}


/* ==========================================================
   Stránka: Jak pracuji
   Doplňky k designovému systému stránky Kdo jsem
   ========================================================== */

.section--work-hero .about-hero h1 {
    max-width: 92rem;
    font-size: clamp(4.55rem, 4.85vw, 7rem);
}

.section--work-hero .about-hero__lead {
    max-width: 76rem;
}

/* ==========================================================
   V čem je rozdíl
   ========================================================== */

.section--work-difference {
    padding: 9.5rem 0;
    color: #fff;
    background:
        radial-gradient(circle at 90% 0%, rgba(233, 83, 20, 0.16), transparent 30rem),
        linear-gradient(122deg, #07131d, #152438);
}

.work-difference {
    max-width: 116rem;
    margin: 0 auto;
}

.work-difference__intro {
    display: grid;
    grid-template-columns: minmax(28rem, 0.88fr) minmax(0, 1.12fr);
    gap: 6.5rem;
    align-items: end;
}

.work-difference__intro .about-eyebrow {
    grid-column: 1 / -1;
    margin-bottom: -4.8rem;
}

.work-difference__intro h2 {
    max-width: 66rem;
    margin: 0;
    color: #fff;
    font-size: 4.55rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.work-difference__intro > p:last-child {
    max-width: 65rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: 1.72rem;
    line-height: 1.68;
}

.work-compare {
    margin-top: 5.2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.20);
}

.work-compare__head,
.work-compare__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 0;
}

.work-compare__head span {
    /* Vyvážený prostor nad i pod záhlavím tabulky. */
    padding: 1.35rem 2.2rem 1.25rem;
    color: rgba(255, 255, 255, 0.48);
    font-size: 1.18rem;
    font-weight: 820;
    letter-spacing: 0.09em;
    line-height: 1.35;
    text-transform: uppercase;
}

.work-compare__head span:last-child {
    color: var(--about-orange-soft);
    border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.work-compare__row {
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.work-compare__row p {
    margin: 0;
    padding: 2rem 2.2rem;
    color: rgba(255, 255, 255, 0.58);
    font-size: 1.48rem;
    line-height: 1.58;
}

.work-compare__row p:last-child {
    color: rgba(255, 255, 255, 0.92);
    border-left: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.035);
}

.work-compare__row strong {
    font-weight: 690;
}

.work-research-note {
    max-width: 90rem;
    margin: 2.4rem 0 0;
    color: rgba(255, 255, 255, 0.58);
    font-size: 1.28rem;
    line-height: 1.62;
}

.work-research-note a {
    color: var(--about-orange-soft);
    font-weight: 740;
    text-decoration: underline;
    text-underline-offset: 0.22rem;
}

/* ==========================================================
   Postup spolupráce
   ========================================================== */

.section--work-process {
    padding: 10rem 0;
    background: #fff;
}

.work-process {
    display: grid;
    grid-template-columns: minmax(0, 0.94fr) minmax(39rem, 1.06fr);
    gap: 7rem;
    align-items: start;
    max-width: 116rem;
    margin: 0 auto;
}

.work-process__intro h2 {
    max-width: 60rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.6rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.work-process__intro p:not(.about-eyebrow) {
    max-width: 67rem;
    margin: 1.8rem 0 0;
    color: #667085;
    font-size: 1.66rem;
    line-height: 1.67;
}

.work-process__steps {
    margin: 0;
    padding: 0;
    list-style: none;
}

.work-process__steps li {
    position: relative;
    display: grid;
    grid-template-columns: 6.4rem minmax(0, 1fr);
    gap: 1.9rem;
    padding: 0 0 3.2rem;
}

.work-process__steps li::before {
    content: "";
    position: absolute;
    left: 2.95rem;
    top: 6rem;
    bottom: 0.4rem;
    width: 1px;
    background: rgba(31, 63, 122, 0.20);
}

.work-process__steps li:last-child {
    padding-bottom: 0;
}

.work-process__steps li:last-child::before {
    display: none;
}

.work-process__steps span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6rem;
    height: 6rem;
    border: 1px solid rgba(233, 83, 20, 0.36);
    border-radius: 50%;
    color: var(--about-orange);
    background: #fff8f4;
    font-size: 1.2rem;
    font-weight: 850;
    letter-spacing: 0.06em;
}

.work-process__steps h3 {
    margin: 0.25rem 0 0;
    color: var(--about-ink);
    font-size: 2.05rem;
    letter-spacing: -0.035em;
    line-height: 1.18;
}

.work-process__steps p {
    margin: 0.8rem 0 0;
    color: #667085;
    font-size: 1.46rem;
    line-height: 1.62;
}

/* ==========================================================
   Praktické přínosy
   ========================================================== */

.section--work-outcomes {
    padding: 10rem 0;
    background: #f6f7f8;
}

.work-outcome-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.4rem;
    margin-top: 5.4rem;
}

.work-outcome {
    min-height: 26rem;
    padding: 2.55rem 2.25rem;
    border: 1px solid rgba(21, 36, 56, 0.10);
    border-top: 0.35rem solid var(--about-orange);
    background: #fff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.work-outcome:hover {
    transform: translateY(-0.45rem);
    box-shadow: 0 1.8rem 3.4rem rgba(21, 36, 56, 0.10);
}

.work-outcome > span {
    display: block;
    color: rgba(31, 63, 122, 0.34);
    font-size: 1.25rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.work-outcome h3 {
    margin: 3.2rem 0 0;
    color: var(--about-ink);
    font-size: 2.12rem;
    letter-spacing: -0.035em;
    line-height: 1.17;
}

.work-outcome p {
    margin: 1.35rem 0 0;
    color: #667085;
    font-size: 1.46rem;
    line-height: 1.62;
}

/* ==========================================================
   Důkazy z referencí
   ========================================================== */

.section--work-proof {
    padding: 10rem 0;
    background: #fff;
}

.work-proof {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(43rem, 1.08fr);
    gap: 6rem;
    align-items: start;
    max-width: 116rem;
    margin: 0 auto;
}

.work-proof__intro h2 {
    max-width: 67rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.45rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.work-proof__intro p:not(.about-eyebrow) {
    max-width: 66rem;
    margin: 1.8rem 0 0;
    color: #667085;
    font-size: 1.64rem;
    line-height: 1.68;
}

.work-proof__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--about-line);
    border-left: 1px solid var(--about-line);
}

.work-proof__stats div {
    min-height: 15.8rem;
    padding: 2rem;
    border-right: 1px solid var(--about-line);
    border-bottom: 1px solid var(--about-line);
    background: #f8f9fa;
}

.work-proof__stats strong {
    display: block;
    color: var(--about-blue);
    font-size: 4rem;
    font-weight: 860;
    letter-spacing: -0.07em;
    line-height: 1;
}

.work-proof__stats small {
    margin-left: 0.18rem;
    font-size: 1.85rem;
    letter-spacing: -0.02em;
}

.work-proof__stats span {
    display: block;
    margin-top: 1.1rem;
    color: #667085;
    font-size: 1.34rem;
    line-height: 1.5;
}

.work-featured-quote {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 25rem;
    gap: 3rem;
    align-items: end;
    max-width: 116rem;
    margin: 5.5rem auto 0;
    padding: 3.5rem 3.7rem;
    color: #fff;
    background:
        radial-gradient(circle at 90% 0%, rgba(233, 83, 20, 0.20), transparent 24rem),
        #07131d;
}

.work-featured-quote blockquote {
    margin: 0;
}

.work-featured-quote blockquote p {
    margin: 0;
    color: #fff;
    font-size: 2.6rem;
    font-weight: 640;
    letter-spacing: -0.045em;
    line-height: 1.27;
}

.work-featured-quote figcaption {
    display: flex;
    flex-direction: column;
    gap: 0.38rem;
    padding-left: 2.1rem;
    border-left: 1px solid rgba(255, 255, 255, 0.22);
}

.work-featured-quote figcaption strong {
    color: #fff;
    font-size: 1.58rem;
    line-height: 1.3;
}

.work-featured-quote figcaption span {
    color: rgba(255, 255, 255, 0.67);
    font-size: 1.28rem;
    line-height: 1.45;
}

.work-featured-quote figcaption a {
    margin-top: 1rem;
    color: var(--about-orange-soft);
    font-size: 1.26rem;
    font-weight: 760;
    text-decoration: underline;
    text-underline-offset: 0.24rem;
}

.work-quote-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    max-width: 116rem;
    margin: 0 auto;
    border-right: 1px solid var(--about-line);
    border-bottom: 1px solid var(--about-line);
    border-left: 1px solid var(--about-line);
}

.work-quote-list figure {
    margin: 0;
    padding: 2.8rem 3rem;
    border-left: 1px solid var(--about-line);
    background: #fff;
}

.work-quote-list figure:first-child {
    border-left: 0;
}

.work-quote-list blockquote {
    margin: 0;
}

.work-quote-list blockquote p {
    margin: 0;
    color: #344054;
    font-size: 1.58rem;
    line-height: 1.62;
}

.work-quote-list figcaption {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-top: 1.6rem;
}

.work-quote-list figcaption strong {
    color: var(--about-ink);
    font-size: 1.38rem;
}

.work-quote-list figcaption span {
    color: #667085;
    font-size: 1.22rem;
}

.work-proof__action {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.8rem 2.5rem;
    max-width: 116rem;
    margin: 3rem auto 0;
}

.work-proof__action p {
    max-width: 58rem;
    margin: 0;
    color: #7a8492;
    font-size: 1.22rem;
    line-height: 1.56;
}

/* ==========================================================
   Upřímné vymezení
   ========================================================== */

.section--work-fit {
    padding: 10rem 0;
    color: #fff;
    background:
        radial-gradient(circle at 8% 100%, rgba(31, 63, 122, 0.30), transparent 30rem),
        #07131d;
}

.work-fit {
    max-width: 116rem;
    margin: 0 auto;
}

.work-fit__intro {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 6rem;
    align-items: end;
}

.work-fit__intro .about-eyebrow {
    grid-column: 1 / -1;
    margin-bottom: -4.8rem;
}

.work-fit__intro h2 {
    max-width: 67rem;
    margin: 0;
    color: #fff;
    font-size: 4.45rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.work-fit__intro > p:last-child {
    max-width: 65rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.66rem;
    line-height: 1.68;
}

.work-fit__columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin-top: 5.2rem;
    background: rgba(255, 255, 255, 0.17);
}

.work-fit__column {
    padding: 2.8rem 3rem 3.1rem;
    background: rgba(7, 19, 29, 0.84);
}

.work-fit__label {
    max-width: 46rem;
    margin: 0;
    color: var(--about-orange-soft);
    font-size: 1.33rem;
    font-weight: 820;
    letter-spacing: 0.06em;
    line-height: 1.42;
    text-transform: uppercase;
}

.work-fit__column ul {
    margin: 2rem 0 0;
    padding: 0;
    list-style: none;
}

.work-fit__column li {
    position: relative;
    margin-top: 1.05rem;
    padding-left: 2rem;
    color: rgba(255, 255, 255, 0.80);
    font-size: 1.48rem;
    line-height: 1.52;
}

.work-fit__column li:first-child {
    margin-top: 0;
}

.work-fit__column li::before {
    position: absolute;
    left: 0;
    top: 0.06rem;
    color: var(--about-orange-soft);
    font-size: 1.38rem;
    font-weight: 850;
}

.work-fit__column--yes li::before {
    content: "+";
}

.work-fit__column--no li::before {
    content: "−";
}

.work-fit__note {
    max-width: 90rem;
    margin: 2.6rem 0 0;
    color: rgba(255, 255, 255, 0.56);
    font-size: 1.32rem;
    line-height: 1.63;
}

/* ==========================================================
   Silné stránky
   ========================================================== */

.section--work-strengths {
    padding: 10rem 0;
    background: #f6f7f8;
}

.work-strengths {
    display: grid;
    grid-template-columns: minmax(0, 0.94fr) minmax(42rem, 1.06fr);
    gap: 6.5rem;
    align-items: start;
    max-width: 116rem;
    margin: 0 auto;
}

.work-strengths__intro h2 {
    max-width: 66rem;
    margin: 0;
    color: var(--about-ink);
    font-size: 4.35rem;
    letter-spacing: -0.06em;
    line-height: 1.04;
}

.work-strengths__intro p:not(.about-eyebrow) {
    max-width: 65rem;
    margin: 1.8rem 0 0;
    color: #667085;
    font-size: 1.62rem;
    line-height: 1.68;
}

.work-strengths__list {
    border-top: 1px solid var(--about-line);
}

.work-strengths__list article {
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
    gap: 2rem;
    padding: 1.7rem 0;
    border-bottom: 1px solid var(--about-line);
}

.work-strengths__list strong {
    color: var(--about-blue);
    font-size: 1.55rem;
    line-height: 1.35;
}

.work-strengths__list p {
    margin: 0;
    color: #667085;
    font-size: 1.42rem;
    line-height: 1.6;
}

/* ==========================================================
   CTA
   ========================================================== */

.section--work-contact {
    padding-top: 9rem;
    padding-bottom: 9rem;
}

/* ==========================================================
   Responzivita stránky Jak pracuji
   ========================================================== */

@media (max-width: 1199px) {
    .work-difference__intro,
    .work-process,
    .work-proof,
    .work-fit__intro,
    .work-strengths {
        gap: 4.8rem;
    }

    .work-outcome-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .work-outcome {
        min-height: 22rem;
    }
}

@media (max-width: 991px) {
    .section--work-hero .about-hero h1 {
        font-size: 5.2rem;
    }

    .work-difference__intro,
    .work-process,
    .work-proof,
    .work-fit__intro,
    .work-strengths {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .work-difference__intro .about-eyebrow,
    .work-fit__intro .about-eyebrow {
        grid-column: auto;
        margin-bottom: -1.3rem;
    }

    .work-difference__intro h2,
    .work-process__intro h2,
    .work-proof__intro h2,
    .work-fit__intro h2,
    .work-strengths__intro h2 {
        font-size: 3.75rem;
    }

    .work-featured-quote {
        grid-template-columns: 1fr;
        gap: 2.2rem;
    }

    .work-featured-quote figcaption {
        padding-top: 1.6rem;
        padding-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.22);
        border-left: 0;
    }
}

@media (max-width: 767px) {
    .section--work-difference,
    .section--work-process,
    .section--work-outcomes,
    .section--work-proof,
    .section--work-fit,
    .section--work-strengths,
    .section--work-contact {
        padding-top: 6.5rem;
        padding-bottom: 6.5rem;
    }

    .work-compare__head {
        display: none;
    }

    .work-compare__row {
        grid-template-columns: 1fr;
    }

    .work-compare__row p,
    .work-compare__row p:last-child {
        padding: 1.6rem 1.4rem;
        border-left: 0;
    }

    .work-compare__row p:first-child {
        padding-bottom: 0.9rem;
        font-size: 1.34rem;
    }

    .work-compare__row p:last-child {
        padding-top: 1rem;
        background: rgba(255, 255, 255, 0.035);
    }

    .work-outcome-grid,
    .work-proof__stats,
    .work-quote-list,
    .work-fit__columns {
        grid-template-columns: 1fr;
    }

    .work-outcome {
        min-height: 0;
    }

    .work-quote-list figure,
    .work-quote-list figure:first-child {
        border-top: 1px solid var(--about-line);
        border-left: 0;
    }

    .work-quote-list figure:first-child {
        border-top: 0;
    }

    .work-proof__action {
        align-items: stretch;
        flex-direction: column;
    }

    .work-proof__action .btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .work-strengths__list article {
        grid-template-columns: 1fr;
        gap: 0.6rem;
    }
}

@media (max-width: 575px) {
    .section--work-hero .about-hero h1 {
        font-size: 4.05rem;
    }

    .work-difference__intro h2,
    .work-process__intro h2,
    .work-proof__intro h2,
    .work-fit__intro h2,
    .work-strengths__intro h2 {
        font-size: 3.12rem;
    }

    .work-process__steps li {
        grid-template-columns: 5.3rem minmax(0, 1fr);
        gap: 1.3rem;
    }

    .work-process__steps li::before {
        left: 2.35rem;
        top: 5rem;
    }

    .work-process__steps span {
        width: 4.9rem;
        height: 4.9rem;
        font-size: 1.05rem;
    }

    .work-process__steps h3 {
        font-size: 1.83rem;
    }

    .work-outcome-grid {
        margin-top: 3.8rem;
    }

    .work-outcome {
        padding: 2rem 1.8rem;
    }

    .work-outcome h3 {
        margin-top: 2.4rem;
        font-size: 1.95rem;
    }

    .work-proof__stats div {
        min-height: 0;
        padding: 1.7rem;
    }

    .work-featured-quote {
        margin-top: 4rem;
        padding: 2.4rem 2rem;
    }

    .work-featured-quote blockquote p {
        font-size: 2.06rem;
    }

    .work-quote-list figure {
        padding: 2.2rem 2rem;
    }

    .work-fit__column {
        padding: 2.3rem 2rem 2.5rem;
    }
}