/* ==========================================================================

   BP-Mona – Sekce úvodní stránky

   Modrá (#01244F) + Oranžová (#EE6303) | Světlý theme

   ========================================================================== */



/* --- Global body font --- */

body {

    font-family: var(--flavor-font-body);

    color: var(--flavor-text);

}

:is(.is-layout-flow,.is-layout-constrained)>*:where(:not(h1,h2,h3,h4,h5,h6)) {

    margin-block-end: 0!important;

}



/* Reset margin-block on headings inside BPM sections too */

section[class*="bpm-"] :is(.is-layout-flow,.is-layout-constrained)>*:where(h1,h2,h3,h4,h5,h6) {

    margin-block-end: 0 !important;

    margin-block-start: 0 !important;

}

section{

    margin-block-start: 0 !important;

    margin-block-end: 0 !important;

}

/* ==========================================================================

   Gutenberg Block Reset – prevent WP defaults inside BPM sections

   ========================================================================== */



/* Force full-width backgrounds on all BPM sections */

section.bpm-hero,

section.bpm-services,

section.bpm-about,

section.bpm-specialty,

section.bpm-why,

section.bpm-stats,

section.bpm-references,

section.bpm-news,

section.bpm-cta,

section.bpm-contact {

    max-width: none !important;

    width: 100% !important;

    box-sizing: border-box;

}



/* Gutenberg alignfull support */

.alignfull[class*="bpm-"] {

    max-width: none !important;

    width: 100vw;

    margin-left: calc(-50vw + 50%);

    margin-right: calc(-50vw + 50%);

}



/* Reset ONLY anonymous wp-block-group wrappers (no BPM class) inside BPM sections */

section[class*="bpm-"] .wp-block-group:not([class*="bpm-"]) {

    max-width: none;

    padding: 0;

    margin: 0;

    box-sizing: border-box;

}



section[class*="bpm-"] :where(.wp-block-heading) {

    margin-top: 0;

    margin-bottom: 0;

    max-width: none;

}



section[class*="bpm-"] :where(p) {

    margin-top: 0;

    margin-bottom: 0;

    max-width: none;

}



section[class*="bpm-"] :where(.wp-block-image) {

    margin: 0;

    max-width: none;

}



section[class*="bpm-"] :where(.wp-block-image) img {

    display: block;

    max-width: 100%;

    height: auto;

}



section[class*="bpm-"] :where(.wp-block-buttons) {

    gap: 0;

    margin: 0;

}



/* Reset constrained layout – but preserve BPM-classed elements */

section[class*="bpm-"] :where(.is-layout-constrained) > :not([class*="bpm-"]) {

    max-width: none;

    margin-left: 0 !important;

    margin-right: 0 !important;

}



/* ---- Breathing room: restore spacing between elements ---- */



/* Badge → heading */

section[class*="bpm-"] .bpm-hero__badge {

    margin-bottom: 1.5rem;

}



/* Heading → desc / text */

section[class*="bpm-"] :where(.bpm-hero__heading) {

    margin-bottom: 1.5rem;

}



section[class*="bpm-"] :where(.bpm-hero__desc) {

    margin-bottom: 2.5rem !important;

}



/* Section headers */

section[class*="bpm-"] .bpm-section-header :where(.bpm-section-header__label) {

    margin-bottom: 1rem;

}



section[class*="bpm-"] .bpm-section-header :where(.bpm-section-header__title) {

    margin-bottom: 1rem;

}



section[class*="bpm-"] .bpm-section-header :where(.bpm-section-header__desc) {

    margin-bottom: 2rem !important;

}



/* About section spacing */

section[class*="bpm-"] :where(.bpm-about__label) {

    margin-bottom: 1rem;

}



section[class*="bpm-"] :where(.bpm-about__title) {

    margin-bottom: 1.25rem;

}



section[class*="bpm-"] :where(.bpm-about__text) {

    margin-bottom: 1rem;

}



section[class*="bpm-"] :where(.bpm-about__text):last-of-type {

    margin-bottom: 2rem;

}



/* Specialty spacing */

section[class*="bpm-"] :where(.bpm-specialty__label) {

    margin-bottom: 1rem;

}



section[class*="bpm-"] :where(.bpm-specialty__title) {

    margin-bottom: 1.25rem;

}



section[class*="bpm-"] :where(.bpm-specialty__text) {

    margin-bottom: 2rem !important;

}



section[class*="bpm-"] :where(.bpm-specialty__feature-title) {

    margin-bottom: 0.2rem;

}



/* Service card spacing */

section[class*="bpm-"] .bpm-services__card :where(.wp-block-heading) {

    margin-bottom: 0.5rem;

}



/* Why card spacing */

section[class*="bpm-"] .bpm-why__card :where(.wp-block-heading) {

    margin-bottom: 0.5rem;

}



/* References card spacing */

section[class*="bpm-"] .bpm-references__card-body :where(.bpm-references__card-tag) {

    margin-bottom: 0.75rem;

}



section[class*="bpm-"] .bpm-references__card-body :where(.wp-block-heading) {

    margin-bottom: 0.5rem;

}



/* News card spacing */

section[class*="bpm-"] .bpm-news__card-body :where(.bpm-news__card-date) {

    margin-bottom: 0.5rem;

}



section[class*="bpm-"] .bpm-news__card-body :where(.wp-block-heading) {

    margin-bottom: 0.5rem;

}



section[class*="bpm-"] .bpm-news__card-body :where(.bpm-news__card-excerpt) {

    margin-bottom: 1rem;

}



/* CTA spacing */

section[class*="bpm-"] :where(.bpm-cta__title) {

    margin-bottom: 1.25rem;

}



section[class*="bpm-"] :where(.bpm-cta__desc) {

    margin-bottom: 2.5rem;

}



/* Contact card spacing */

section[class*="bpm-"] .bpm-contact__card :where(.bpm-contact__card-label) {

    margin-bottom: 0.25rem;

}



section[class*="bpm-"] .bpm-contact__card :where(.bpm-contact__card-value) + :where(.bpm-contact__card-note) {

    margin-top: 0.15rem;

}



/* ---- Dark section text color enforcement ---- */



/* Hero – all text must be white */

.bpm-hero,

.bpm-hero .wp-block-group,

.bpm-hero .wp-block-heading,

.bpm-hero p,

.bpm-hero h1,

.bpm-hero h2,

.bpm-hero h3 {

    color: #ffffff;

}



.bpm-hero .bpm-hero__heading {

    color: #ffffff !important;

}



.bpm-hero .bpm-hero__heading span {

    color: var(--flavor-accent);

}



.bpm-hero .bpm-hero__desc {

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

}



.bpm-hero .bpm-hero__badge {

    color: var(--flavor-accent-light);

}



/* Specialty – all text must be white */

.bpm-specialty,

.bpm-specialty .wp-block-group,

.bpm-specialty .wp-block-heading,

.bpm-specialty p,

.bpm-specialty h2,

.bpm-specialty h3 {

    color: #ffffff;

}



.bpm-specialty .bpm-specialty__title {

    color: #ffffff !important;

}



.bpm-specialty .bpm-specialty__title span {

    color: var(--flavor-accent);

}



.bpm-specialty .bpm-specialty__label {

    color: var(--flavor-accent);

}



.bpm-specialty .bpm-specialty__text {

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

}



.bpm-specialty .bpm-specialty__feature-desc {

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

}



/* CTA – also dark background */

.bpm-cta,

.bpm-cta .wp-block-group,

.bpm-cta .wp-block-heading,

.bpm-cta p,

.bpm-cta h2 {

    color: #ffffff;

}



.bpm-cta .bpm-cta__title {

    color: #ffffff !important;

}



.bpm-cta .bpm-cta__title span {

    color: var(--flavor-accent);

}



.bpm-cta .bpm-cta__desc {

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

}



/* ==========================================================================

   0. Decorative SVG Patterns (inline backgrounds)

   ========================================================================== */

.bpm-pattern-dots {

    background-image: radial-gradient(circle, var(--flavor-primary) 1px, transparent 1px);

    background-size: 24px 24px;

    opacity: 0.04;

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

}



.bpm-pattern-diagonal {

    background-image: repeating-linear-gradient(

        -45deg,

        transparent,

        transparent 10px,

        rgba(1, 36, 79, 0.02) 10px,

        rgba(1, 36, 79, 0.02) 20px

    );

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

}



.bpm-pattern-grid {

    background-image:

        linear-gradient(rgba(1, 36, 79, 0.03) 1px, transparent 1px),

        linear-gradient(90deg, rgba(1, 36, 79, 0.03) 1px, transparent 1px);

    background-size: 60px 60px;

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

}



.bpm-pattern-circles {

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

    overflow: hidden;

}



.bpm-pattern-circles::before,

.bpm-pattern-circles::after {

    content: "";

    position: absolute;

    border-radius: 50%;

    border: 1px solid rgba(238, 99, 3, 0.08);

}



.bpm-pattern-circles::before {

    width: 400px;

    height: 400px;

    top: -200px;

    right: -100px;

}



.bpm-pattern-circles::after {

    width: 300px;

    height: 300px;

    bottom: -150px;

    left: -100px;

}



/* ==========================================================================

   1. HERO

   ========================================================================== */



.bpm-hero {

    position: relative;

    background:

        /* Velký oranžový glow vpravo nahoře */

        radial-gradient(ellipse 55% 65% at 85% 15%, rgba(238, 99, 3, 0.10) 0%, transparent 70%),

        /* Menší oranžový glow vlevo dole */

        radial-gradient(ellipse 40% 50% at 10% 85%, rgba(238, 99, 3, 0.06) 0%, transparent 60%),

        /* Hloubkové modré vrstvy */

        radial-gradient(ellipse 80% 60% at 20% 80%, rgba(10, 58, 115, 0.7) 0%, transparent 70%),

        radial-gradient(ellipse 60% 70% at 80% 20%, rgba(1, 26, 56, 0.6) 0%, transparent 60%),

        /* Základ */

        linear-gradient(165deg, var(--flavor-primary-dark) 0%, var(--flavor-primary) 40%, var(--flavor-primary-light) 80%, #0d4a8a 100%);

    overflow: hidden;

    min-height: 100vh;

    display: flex;

    align-items: center;

    width: 100vw;

    margin-left: calc(-50vw + 50%);

    margin-right: calc(-50vw + 50%);

    box-sizing: border-box;

}



/* Velký oranžový kruh – pravý horní roh */

.bpm-hero::before {

    content: "";

    position: absolute;

    top: -15%;

    right: -10%;

    width: 650px;

    height: 650px;

    background: radial-gradient(circle, rgba(238, 99, 3, 0.09) 0%, rgba(238, 99, 3, 0.03) 45%, transparent 70%);

    border-radius: 50%;

    filter: blur(60px);

    pointer-events: none;

    z-index: 0;

}



/* Oranžový glow – levý spodní roh */

.bpm-hero::after {

    content: "";

    position: absolute;

    bottom: -10%;

    left: -5%;

    width: 400px;

    height: 400px;

    background: radial-gradient(circle, rgba(238, 99, 3, 0.06) 0%, transparent 65%);

    border-radius: 50%;

    filter: blur(50px);

    pointer-events: none;

    z-index: 0;

}



/* Overlay – diagonální oranžové pruhy + šum + vigneta */

.bpm-hero__overlay {

    position: absolute;

    inset: 0;

    z-index: 0;

}



/* Diagonální oranžový accent – dvě vrstvy */

.bpm-hero__overlay::before {

    content: "";

    position: absolute;

    top: -30%;

    right: -5%;

    width: 60%;

    height: 160%;

    background:

        linear-gradient(

            160deg,

            transparent 20%,

            rgba(238, 99, 3, 0.09) 30%,

            rgba(238, 99, 3, 0.05) 42%,

            transparent 55%

        ),

        linear-gradient(

            120deg,

            transparent 40%,

            rgba(238, 99, 3, 0.04) 50%,

            transparent 60%

        );

    transform: rotate(-12deg);

    pointer-events: none;

}



/* Vigneta (horní/spodní) + jemný noise */

.bpm-hero__overlay::after {

    content: "";

    position: absolute;

    inset: 0;

    background:

        linear-gradient(to top, rgba(255, 255, 255, 0.05) 0%, transparent 15%),

        linear-gradient(to bottom, rgba(0, 0, 0, 0.10) 0%, transparent 25%),

        url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");

    pointer-events: none;

}



/* Oranžové tečkové matrice */

.bpm-hero__dots {

    position: absolute;

    width: 200px;

    height: 200px;

    background-image: radial-gradient(circle, rgba(238, 99, 3, 0.28) 1.5px, transparent 1.5px);

    background-size: 18px 18px;

    pointer-events: none;

    z-index: 0;

}



.bpm-hero__dots--top {

    top: 6%;

    right: 5%;

    opacity: 0.55;

}



/* Jemná mřížka přes celé pozadí */

.bpm-hero__dots--top::before {

    content: "";

    position: fixed;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-image:

        linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),

        linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);

    background-size: 80px 80px;

    pointer-events: none;

    z-index: -1;

}



/* Oranžový ring kolem top dots */

.bpm-hero__dots--top::after {

    content: "";

    position: absolute;

    top: -40px;

    right: -40px;

    width: 280px;

    height: 280px;

    border-radius: 50%;

    border: 1.5px solid rgba(238, 99, 3, 0.10);

    pointer-events: none;

}



.bpm-hero__dots--bottom {

    bottom: 10%;

    left: 3%;

    width: 140px;

    height: 140px;

    opacity: 0.35;

}



/* Větší geometrický ring – vlevo dole */

.bpm-hero__dots--bottom::before {

    content: "";

    position: absolute;

    bottom: -80px;

    left: 40px;

    width: 240px;

    height: 240px;

    border-radius: 50%;

    border: 1px solid rgba(238, 99, 3, 0.07);

    pointer-events: none;

}



/* Menší ring – tečkovaný */

.bpm-hero__dots--bottom::after {

    content: "";

    position: absolute;

    bottom: 20px;

    left: -60px;

    width: 160px;

    height: 160px;

    border-radius: 50%;

    border: 1px dashed rgba(238, 99, 3, 0.06);

    pointer-events: none;

}



/* Inner container */

.bpm-hero__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

    padding: 8rem 2rem 4rem;

    width: 100%;

}



/* 2-column grid */

.bpm-hero__row {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 3.5rem;

    align-items: center;

}



/* Left column – text */

.bpm-hero__content {

    color: var(--flavor-white);

}



.bpm-hero__badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    background: rgba(238, 99, 3, 0.12);

    border: 1px solid rgba(238, 99, 3, 0.25);

    color: var(--flavor-accent-light);

    padding: 0.45rem 1rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.82rem;

    font-weight: 600;

    letter-spacing: 0.03em;

    margin-bottom: 1.5rem;

    text-transform: uppercase;

}



.bpm-hero__badge i {

    font-size: 0.75rem;

}



.bpm-hero__heading {

    font-family: var(--flavor-font-heading);

    font-size: clamp(2.2rem, 4.5vw, 3.4rem);

    font-weight: 800;

    line-height: 1.08;

    margin: 0 0 1.25rem;

    letter-spacing: -0.02em;

}



.bpm-hero__heading span {

    color: var(--flavor-accent);

}



.bpm-hero__desc {

    font-size: 1.08rem;

    line-height: 1.7;

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

    margin: 0 0 2rem;

    max-width: 520px;

}



.bpm-hero__actions {

    display: flex;

    gap: 1rem;

    flex-wrap: wrap;

    margin-bottom: 2rem !important;

    margin-top: 2rem !important;

}



.bpm-hero__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.6rem;

    padding: 0.9rem 1.75rem;

    border-radius: var(--flavor-radius-sm);

    font-weight: 700;

    font-size: 0.92rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    border: none;

    cursor: pointer;

}



.bpm-hero__btn--primary {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-hero__btn--primary:hover {

    background: var(--flavor-accent-light);

    box-shadow: 0 6px 32px rgba(238, 99, 3, 0.45);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



.bpm-hero__btn--secondary {

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

    color: var(--flavor-white);

    border: 1px solid rgba(255, 255, 255, 0.15);

}



.bpm-hero__btn--secondary:hover {

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

    border-color: rgba(255, 255, 255, 0.3);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



/* Trust badges – below buttons */

.bpm-hero__trust {

    display: flex;

    gap: 1.25rem 1.75rem;

    flex-wrap: wrap;

    padding-top: 0.25rem;

}



.bpm-hero__trust-item {

    display: flex;

    align-items: center;

    gap: 0.45rem;

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

    font-size: 0.82rem;

}



.bpm-hero__trust-item i {

    color: var(--flavor-accent);

    font-size: 0.85rem;

}



/* Right column – image */

.bpm-hero__image {

    position: relative;

}



.bpm-hero__image-frame {

    position: relative;

    border-radius: var(--flavor-radius);

    overflow: hidden;

    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.3);

}



.bpm-hero__image-frame img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

    aspect-ratio: 4/3;

}



.bpm-hero__image-frame::after {

    content: "";

    position: absolute;

    inset: 0;

    border: 1px solid rgba(255, 255, 255, 0.08);

    border-radius: var(--flavor-radius);

    pointer-events: none;

}



/* Floating stat badge – 34+ let */

.bpm-hero__stat {

    position: absolute;

    bottom: -1.25rem;

    left: -1.25rem;

    background: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    padding: 1rem 1.4rem;

    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18), 0 2px 8px rgba(0, 0, 0, 0.08);

    display: flex;

    align-items: center;

    gap: 0.85rem;

    z-index: 2;

}







.bpm-hero__stat-icon {

    width: 2.8rem;

    height: 2.8rem;

    background: linear-gradient(135deg, var(--flavor-accent), var(--flavor-accent-light));

    border-radius: 10px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-white);

    font-size: 1.1rem;

    flex-shrink: 0;

}



.bpm-hero__stat-number {

    font-family: var(--flavor-font-heading);

    font-size: 1.5rem;

    font-weight: 800;

    color: var(--flavor-primary);

    line-height: 1;

}



.bpm-hero__stat-label {

    font-size: 0.75rem;

    color: var(--flavor-text-muted);

    font-weight: 500;

    margin-top: 0.1rem;

}



/* Responsive */

@media (max-width: 900px) {

    .bpm-hero {

        min-height: auto;

    }

    .bpm-hero__inner {

        padding: 7rem 1.5rem 3rem;

    }

    .bpm-hero__row {

        grid-template-columns: 1fr;

        gap: 2.5rem;

    }

    .bpm-hero__image {

        order: -1;

        max-width: 480px;

    }

    .bpm-hero__stat {

        bottom: -1rem;

        left: 1rem;

    }

}



@media (max-width: 480px) {

    .bpm-hero__inner {

        padding: 5rem 1.25rem 2.5rem;

    }

    .bpm-hero__actions {

        flex-direction: column;

    }

    .bpm-hero__btn {

        justify-content: center;

    }

    .bpm-hero__stat {

        left: 0.5rem;

        bottom: -0.75rem;

        padding: 0.75rem 1rem;

    }

    .bpm-hero__stat-icon {

        width: 2.2rem;

        height: 2.2rem;

        font-size: 0.9rem;

    }

    .bpm-hero__stat-number {

        font-size: 1.2rem;

    }

}



/* ==========================================================================

   2. SLUŽBY (Services)

   ========================================================================== */

.bpm-services {

    position: relative;

    background: var(--flavor-bg);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-services__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

}



/* Section header (reusable) */

.bpm-section-header {

    text-align: center;

    margin-bottom: 4rem;

}



.bpm-section-header__label {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    color: var(--flavor-accent);

    font-size: 0.82rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.1em;

    margin-bottom: 1rem;

}



.bpm-section-header__label::before,

.bpm-section-header__label::after {

    content: "";

    width: 24px;

    height: 2px;

    background: var(--flavor-accent);

    border-radius: 1px;

}



.bpm-section-header__title {

    font-family: var(--flavor-font-heading);

    font-size: clamp(1.8rem, 4vw, 2.8rem);

    font-weight: 800;

    color: var(--flavor-primary);

    margin: 0 0 1rem;

    line-height: 1.15;

    letter-spacing: -0.02em;

}



.bpm-section-header__desc {

    font-size: 1.05rem;

    color: var(--flavor-text-muted);

    max-width: 600px;

    margin: 0 auto;

    line-height: 1.65;

}



/* Services grid */

.bpm-services__grid {

    display: grid;

    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));

    gap: 1.5rem;

}



.bpm-services__card {

    position: relative;

    background: var(--flavor-white);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius);

    padding: 2rem 1.75rem;

    transition: all var(--flavor-speed) var(--flavor-ease);

    overflow: hidden;

    text-decoration: none;

    color: inherit;

    display: block;

    cursor: pointer;

}



.bpm-services__card::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    height: 3px;

    background: linear-gradient(90deg, var(--flavor-accent), var(--flavor-accent-light));

    transform: scaleX(0);

    transform-origin: left;

    transition: transform var(--flavor-speed) var(--flavor-ease);

}



.bpm-services__card:hover {

    transform: translateY(-6px);

    box-shadow: var(--flavor-shadow-md);

    border-color: rgba(238, 99, 3, 0.15);

}



.bpm-services__card:hover::before {

    transform: scaleX(1);

}



.bpm-services__card-icon {

    width: 3.5rem;

    height: 3.5rem;

    background: var(--flavor-bg-cool);

    border-radius: 12px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 1.25rem;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-services__card:hover .bpm-services__card-icon {

    background: var(--flavor-accent);

}



.bpm-services__card-icon i {

    font-size: 1.5rem;

    color: var(--flavor-accent);

    transition: color var(--flavor-speed) var(--flavor-ease);

}



.bpm-services__card:hover .bpm-services__card-icon i {

    color: var(--flavor-white);

}



.bpm-services__card-title {

    font-family: var(--flavor-font-heading);

    font-size: 1.15rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.5rem;

}



.bpm-services__card-desc {

    font-size: 0.9rem;

    color: var(--flavor-text-muted);

    line-height: 1.6;

    margin: 0;

}



/* ==========================================================================

   3. O NÁS (About / History)

   ========================================================================== */

.bpm-about {

    position: relative;

    background: var(--flavor-bg-warm);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 4rem;

    align-items: center;

}



.bpm-about__image {

    position: relative;

}



.bpm-about__image-main {

    border-radius: var(--flavor-radius);

    overflow: hidden;

    box-shadow: var(--flavor-shadow-lg);

}



.bpm-about__image-main img {

    width: 100%;

    display: block;

    aspect-ratio: 4/5;

    object-fit: cover;

}



/* Orange stripe accent behind image */

.bpm-about__image::before {

    content: "";

    position: absolute;

    top: 2rem;

    left: -1rem;

    width: 100%;

    height: 100%;

    background: var(--flavor-accent);

    border-radius: var(--flavor-radius);

    z-index: -1;

    opacity: 0.12;

}



/* Year badge */

.bpm-about__year-badge {

    position: absolute;

    top: -1rem;

    right: -1rem;

    background: var(--flavor-primary);

    color: var(--flavor-white);

    padding: 1.25rem;

    border-radius: var(--flavor-radius-sm);

    text-align: center;

    box-shadow: var(--flavor-shadow-md);

    z-index: 2;

}



.bpm-about__year-badge-number {

    display: block;

    font-family: var(--flavor-font-heading);

    font-size: 2rem;

    font-weight: 800;

    line-height: 1;

    color: var(--flavor-accent);

}



.bpm-about__year-badge-text {

    display: block;

    font-size: 0.7rem;

    text-transform: uppercase;

    letter-spacing: 0.1em;

    margin-top: 0.25rem;

    opacity: 0.8;

}



.bpm-about__content {

    padding: 1rem 0;

}



.bpm-about__label {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    color: var(--flavor-accent);

    font-size: 0.82rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.1em;

    margin-bottom: 1rem;

}



.bpm-about__title {

    font-family: var(--flavor-font-heading);

    font-size: clamp(1.8rem, 3.5vw, 2.5rem);

    font-weight: 800;

    color: var(--flavor-primary);

    margin: 0 0 1.25rem;

    line-height: 1.15;

}



.bpm-about__title span {

    color: var(--flavor-accent);

}



.bpm-about__text {

    font-size: 1rem;

    line-height: 1.75;

    color: var(--flavor-text-muted);

    margin: 0 0 2rem;

}



.bpm-about__values {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 1rem;

    margin-bottom: 2rem !important;

    margin-top: 2rem !important;

}



.bpm-about__value {

    display: flex;

    align-items: center;

    gap: 0.75rem;

    font-size: 0.95rem;

    font-weight: 600;

    color: var(--flavor-primary);

}



.bpm-about__value i {

    width: 2rem;

    height: 2rem;

    background: rgba(238, 99, 3, 0.1);

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-accent);

    font-size: 0.85rem;

    flex-shrink: 0;

}



.bpm-about__btn {

    display: inline-flex;

    align-items: center;

    margin-top: 1rem;

    gap: 0.6rem;

    padding: 0.9rem 2rem;

    background: var(--flavor-primary);

    color: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    font-weight: 700;

    font-size: 0.95rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about__btn:hover {

    background: var(--flavor-primary-light);

    transform: translateY(-2px);

    box-shadow: var(--flavor-shadow-md);

    color: var(--flavor-white);

}



.bpm-about__btn--outline {

    background: transparent;

    border: 2px solid var(--flavor-primary);

    color: var(--flavor-primary);

}



.bpm-about__btn--outline:hover {

    background: var(--flavor-primary);

    color: var(--flavor-white);

}



@media (max-width: 900px) {

    .bpm-about__inner {

        grid-template-columns: 1fr;

        gap: 3rem;

    }

    .bpm-about__image { max-width: 480px; margin: 0 auto; }

}



/* ==========================================================================

   4. NAŠE SPECIALITA

   ========================================================================== */

.bpm-specialty {

    position: relative;

    background: var(--flavor-primary);

    padding: 6rem 2rem;

    overflow: hidden;

    color: var(--flavor-white);

}



.bpm-specialty__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 4rem;

    align-items: center;

}



.bpm-specialty__content {

    position: relative;

}



.bpm-specialty__label {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    color: var(--flavor-accent);

    font-size: 0.82rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.1em;

    margin-bottom: 1rem;

}



.bpm-specialty__title {

    font-family: var(--flavor-font-heading);

    font-size: clamp(1.8rem, 3.5vw, 2.5rem);

    font-weight: 800;

    margin: 0 0 1.25rem;

    line-height: 1.15;

}



.bpm-specialty__title span {

    color: var(--flavor-accent);

}



.bpm-specialty__text {

    font-size: 1.05rem;

    line-height: 1.75;

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

    margin: 0 0 2rem;

}



.bpm-specialty__features {

    display: flex;

    flex-direction: column;

    gap: 1rem;

    margin-bottom: 2.5rem;

}



.bpm-specialty__feature {

    display: flex;

    align-items: flex-start;

    gap: 1rem;

    padding: 1rem 1.25rem;

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

    border: 1px solid rgba(255, 255, 255, 0.08);

    border-radius: var(--flavor-radius-sm);

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-specialty__feature:hover {

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

    border-color: rgba(238, 99, 3, 0.3);

}



.bpm-specialty__feature-icon {

    width: 2.5rem;

    height: 2.5rem;

    background: rgba(238, 99, 3, 0.15);

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-accent);

    font-size: 1rem;

    flex-shrink: 0;

}



.bpm-specialty__feature-title {

    font-weight: 700;

    font-size: 0.95rem;

    margin-bottom: 0.2rem;

}



.bpm-specialty__feature-desc {

    font-size: 0.85rem;

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

    line-height: 1.5;

}



.bpm-specialty__actions {

    margin-top: 1.5rem;

}



.bpm-specialty__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    padding: 0.75rem 1.5rem;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    font-weight: 600;

    font-size: 0.9rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-specialty__btn:hover {

    background: var(--flavor-accent-light);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



.bpm-specialty__images {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 1rem;

}



.bpm-specialty__img {

    border-radius: var(--flavor-radius-sm);

    overflow: hidden;

}



.bpm-specialty__img img {

    width: 100%;

    display: block;

    object-fit: cover;

    aspect-ratio: 1;

    transition: transform 0.6s var(--flavor-ease);

}



.bpm-specialty__img:hover img {

    transform: scale(1.05);

}



.bpm-specialty__img:first-child {

    grid-row: 1 / 3;

}



.bpm-specialty__img:first-child img {

    aspect-ratio: auto;

    height: 100%;

}



@media (max-width: 900px) {

    .bpm-specialty__inner {

        grid-template-columns: 1fr;

        gap: 3rem;

    }

}



/* ==========================================================================

   5. PROČ MY (Why Choose Us)

   ========================================================================== */

.bpm-why {

    position: relative;

    background: var(--flavor-bg);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-why__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-why__grid {

    display: grid;

    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));

    gap: 2rem;

}



.bpm-why__card {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    padding: 2.25rem 2rem;

    border: 1px solid var(--flavor-border);

    text-align: center;

    transition: all var(--flavor-speed) var(--flavor-ease);

    position: relative;

}



.bpm-why__card:hover {

    transform: translateY(-6px);

    box-shadow: var(--flavor-shadow-md);

}



.bpm-why__card-icon {

    width: 4rem;

    height: 4rem;

    background: linear-gradient(135deg, var(--flavor-primary), var(--flavor-primary-light));

    border-radius: 14px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 1.5rem;

    color: var(--flavor-white);

    font-size: 1.5rem;

    transform: rotate(-6deg);

    transition: transform var(--flavor-speed) var(--flavor-ease);

}



.bpm-why__card:hover .bpm-why__card-icon {

    transform: rotate(0deg) scale(1.05);

}



.bpm-why__card-title {

    font-family: var(--flavor-font-heading);

    font-size: 1.15rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.5rem;

}



.bpm-why__card-desc {

    font-size: 0.9rem;

    color: var(--flavor-text-muted);

    line-height: 1.65;

    margin: 0;

}



/* ==========================================================================

   6. ČÍSLA (Stats Counter)

   ========================================================================== */

.bpm-stats {

    position: relative;

    background: var(--flavor-bg-warm);

    padding: 5rem 2rem;

    overflow: hidden;

}



.bpm-stats__inner {

    position: relative;

    z-index: 1;

    max-width: 1100px;

    margin: 0 auto;

}



.bpm-stats__grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 2rem;

}



.bpm-stats__item {

    text-align: center;

    padding: 2rem 1rem;

    position: relative;

}



.bpm-stats__item::after {

    content: "";

    position: absolute;

    right: 0;

    top: 20%;

    height: 60%;

    width: 1px;

    background: var(--flavor-border);

}



.bpm-stats__item:last-child::after {

    display: none;

}



.bpm-stats__number {

    font-family: var(--flavor-font-heading);

    font-size: clamp(2.5rem, 5vw, 3.5rem);

    font-weight: 800;

    color: var(--flavor-accent);

    line-height: 1;

    margin-bottom: 0.5rem;

}



.bpm-stats__number span {

    color: var(--flavor-primary);

}



.bpm-stats__label {

    font-size: 0.85rem;

    color: var(--flavor-text-muted);

    text-transform: uppercase;

    letter-spacing: 0.08em;

    font-weight: 600;

}



@media (max-width: 768px) {

    .bpm-stats__grid {

        grid-template-columns: 1fr 1fr;

    }

    .bpm-stats__item:nth-child(2)::after {

        display: none;

    }

}



@media (max-width: 480px) {

    .bpm-stats__grid { grid-template-columns: 1fr; }

    .bpm-stats__item::after { display: none; }

}



/* ==========================================================================

   7. REFERENCE (Portfolio)

   ========================================================================== */

.bpm-references {

    position: relative;

    background: var(--flavor-bg-cool);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-references__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-references__grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1.5rem;

}



.bpm-references__card {

    position: relative;

    border-radius: var(--flavor-radius);

    overflow: hidden;

    background: var(--flavor-white);

    box-shadow: var(--flavor-shadow-sm);

    transition: all var(--flavor-speed-slow) var(--flavor-ease);

}



.bpm-references__card:hover {

    transform: translateY(-6px);

    box-shadow: var(--flavor-shadow-lg);

}



.bpm-references__card-image {

    overflow: hidden;

    aspect-ratio: 16/10;

}



.bpm-references__card-image img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform 0.6s var(--flavor-ease);

}



.bpm-references__card:hover .bpm-references__card-image img {

    transform: scale(1.05);

}



.bpm-references__card-body {

    padding: 1.5rem;

}



.bpm-references__card-tag {

    display: inline-block;

    background: rgba(238, 99, 3, 0.08);

    color: var(--flavor-accent);

    font-size: 0.75rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.06em;

    padding: 0.3rem 0.8rem;

    border-radius: var(--flavor-radius-pill);

    margin-bottom: 0.75rem;

}



.bpm-references__card-title {

    font-family: var(--flavor-font-heading);

    font-size: 1.1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.4rem;

}



.bpm-references__card-desc {

    font-size: 0.88rem;

    color: var(--flavor-text-muted);

    line-height: 1.55;

    margin: 0;

}



/* First card spans 2 rows */

.bpm-references__card--featured {

    grid-row: 1 / 3;

}



.bpm-references__card--featured .bpm-references__card-image {

    aspect-ratio: auto;

    height: 60%;

}



@media (max-width: 900px) {

    .bpm-references__grid {

        grid-template-columns: 1fr 1fr;

    }

    .bpm-references__card--featured {

        grid-row: auto;

        grid-column: 1 / -1;

    }

}



@media (max-width: 600px) {

    .bpm-references__grid { grid-template-columns: 1fr; }

}



/* ==========================================================================

   8. NOVINKY (News)

   ========================================================================== */

.bpm-news {

    position: relative;

    background: var(--flavor-bg);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-news__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-news__grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 2rem;

}



.bpm-news__card {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    overflow: hidden;

    border: 1px solid var(--flavor-border);

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-news__card:hover {

    transform: translateY(-6px);

    box-shadow: var(--flavor-shadow-md);

    border-color: rgba(238, 99, 3, 0.12);

}



.bpm-news__card-image {

    position: relative;

    overflow: hidden;

    aspect-ratio: 16/9;

}



.bpm-news__card-image img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform 0.6s var(--flavor-ease);

}



.bpm-news__card:hover .bpm-news__card-image img {

    transform: scale(1.05);

}



.bpm-news__card-body {

    padding: 1.5rem;

}



.bpm-news__card-date {

    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

    font-size: 0.8rem;

    color: var(--flavor-text-light);

    margin-bottom: 0.75rem;

}



.bpm-news__card-date i {

    color: var(--flavor-accent);

}



.bpm-news__card-title {

    font-family: var(--flavor-font-heading);

    font-size: 1.1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.5rem;

    line-height: 1.35;

}



.bpm-news__card-title a {

    color: inherit;

    text-decoration: none;

    transition: color var(--flavor-speed) ease;

}



.bpm-news__card-title a:hover {

    color: var(--flavor-accent);

}



.bpm-news__card-excerpt {

    font-size: 0.9rem;

    color: var(--flavor-text-muted);

    line-height: 1.6;

    margin: 0 0 1rem;

}



.bpm-news__card-link {

    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

    color: var(--flavor-accent);

    font-weight: 600;

    font-size: 0.88rem;

    text-decoration: none;

    transition: all var(--flavor-speed) ease;

}



.bpm-news__card-link i {

    transition: transform var(--flavor-speed) ease;

    font-size: 0.75rem;

}



.bpm-news__card-link:hover {

    color: var(--flavor-accent-dark);

}



.bpm-news__card-link:hover i {

    transform: translateX(4px);

}



/* News card as full link */

a.bpm-news__card {

    display: block;

    text-decoration: none;

    color: inherit;

}



/* "Všechny novinky" button */

.bpm-news__footer {

    display: flex;

    justify-content: center;

    gap: 1rem;

    flex-wrap: wrap;

    margin-top: 3rem;

}



.bpm-news__all-btn {

    display: inline-flex;

    align-items: center;

    gap: 0.6rem;

    padding: 0.85rem 2rem;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    font-weight: 700;

    font-size: 0.92rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-news__all-btn:hover {

    background: var(--flavor-accent-light);

    box-shadow: 0 6px 32px rgba(238, 99, 3, 0.4);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



/* Card type badge */

.bpm-news__card-badge {

    position: absolute;

    top: 10px;

    left: 10px;

    display: inline-flex;

    align-items: center;

    gap: 4px;

    padding: 4px 10px;

    font-size: 0.72rem;

    font-weight: 700;

    border-radius: 6px;

    color: #fff;

    text-transform: uppercase;

    letter-spacing: 0.03em;

    z-index: 2;

}



.bpm-news__card-badge--aktualita {

    background: var(--flavor-accent);

}



.bpm-news__card-badge--akce {

    background: var(--flavor-primary);

}



/* Outline button variant */

.bpm-news__all-btn--outline {

    background: transparent;

    color: var(--flavor-accent);

    border: 2px solid var(--flavor-accent);

    box-shadow: none;

}



.bpm-news__all-btn--outline:hover {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    box-shadow: var(--flavor-shadow-accent);

}



@media (max-width: 900px) {

    .bpm-news__grid { grid-template-columns: 1fr 1fr; }

}



@media (max-width: 600px) {

    .bpm-news__grid { grid-template-columns: 1fr; }

}



/* ==========================================================================

   9. CTA (Call to Action)

   ========================================================================== */

.bpm-cta {

    position: relative;

    background: linear-gradient(160deg, var(--flavor-primary-dark), var(--flavor-primary) 50%, var(--flavor-primary-light));

    padding: 6rem 2rem;

    overflow: hidden;

    text-align: center;

}



.bpm-cta__overlay {

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

}



.bpm-cta__overlay::before {

    content: "";

    position: absolute;

    top: -40%;

    right: -20%;

    width: 70%;

    height: 200%;

    background: radial-gradient(circle, rgba(238, 99, 3, 0.08) 0%, transparent 70%);

}



.bpm-cta__inner {

    position: relative;

    z-index: 1;

    max-width: 720px;

    margin: 0 auto;

}



.bpm-cta__icon {

    width: 4.5rem;

    height: 4.5rem;

    background: rgba(238, 99, 3, 0.15);

    border: 2px solid rgba(238, 99, 3, 0.3);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 2rem;

    font-size: 1.8rem;

    color: var(--flavor-accent);

}



.bpm-cta__title {

    font-family: var(--flavor-font-heading);

    font-size: clamp(1.8rem, 4vw, 2.8rem);

    font-weight: 800;

    color: var(--flavor-white);

    margin: 0 0 1rem;

    line-height: 1.15;

}



.bpm-cta__title span {

    color: var(--flavor-accent);

}



.bpm-cta__desc {

    font-size: 1.1rem;

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

    line-height: 1.7;

    margin: 0 0 2.5rem;

}



.bpm-cta__actions {

    display: flex;

    gap: 1rem;

    justify-content: center;

    flex-wrap: wrap;

    margin-bottom: 2rem !important;

    margin-top: 2rem !important;

}



.bpm-cta__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.6rem;

    padding: 1rem 2.25rem;

    border-radius: var(--flavor-radius-sm);

    font-weight: 700;

    font-size: 1rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    border: none;

    cursor: pointer;

}



.bpm-cta__btn--primary {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-cta__btn--primary:hover {

    background: var(--flavor-accent-light);

    box-shadow: 0 6px 32px rgba(238, 99, 3, 0.45);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



.bpm-cta__btn--outline {

    background: transparent;

    color: var(--flavor-white);

    border: 2px solid rgba(255, 255, 255, 0.25);

}



.bpm-cta__btn--outline:hover {

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

    border-color: rgba(255, 255, 255, 0.45);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



.bpm-cta__phone {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 0.75rem;

    margin-top: 2rem;

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

    font-size: 0.95rem;

}



.bpm-cta__phone a {

    color: var(--flavor-accent);

    font-weight: 700;

    font-size: 1.15rem;

    text-decoration: none;

    transition: color var(--flavor-speed) ease;

}



.bpm-cta__phone a:hover {

    color: var(--flavor-accent-light);

}



.bpm-cta__btn--ghost {

    background: transparent;

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

    border: 1px dashed rgba(255, 255, 255, 0.3);

    font-size: 0.9rem;

}



.bpm-cta__btn--ghost:hover {

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

    border-color: rgba(255, 255, 255, 0.55);

    color: var(--flavor-white);

    transform: translateY(-2px);

}



/* ==========================================================================

   10. KONTAKT (Contact)

   ========================================================================== */

.bpm-contact {

    position: relative;

    background: var(--flavor-bg);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-contact__inner {

    position: relative;

    z-index: 1;

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-contact__grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 3rem;

    margin-top: 3rem;

}



/* Contact cards */

.bpm-contact__cards {

    display: flex;

    flex-direction: column;

    gap: 1.25rem;

}



.bpm-contact__card {

    display: flex;

    align-items: flex-start;

    gap: 1.25rem;

    background: var(--flavor-white);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius);

    padding: 1.5rem;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-contact__card:hover {

    box-shadow: var(--flavor-shadow-sm);

    border-color: rgba(238, 99, 3, 0.15);

}



.bpm-contact__card-icon {

    width: 3rem;

    height: 3rem;

    background: linear-gradient(135deg, var(--flavor-accent), var(--flavor-accent-light));

    border-radius: 10px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-white);

    font-size: 1.1rem;

    flex-shrink: 0;

}



.bpm-contact__card-label {

    font-size: 0.8rem;

    color: var(--flavor-text-light);

    text-transform: uppercase;

    letter-spacing: 0.08em;

    font-weight: 600;

    margin-bottom: 0.25rem;

}



.bpm-contact__card-value {

    font-size: 1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0;

}



.bpm-contact__card-value a {

    color: inherit;

    text-decoration: none;

    transition: color var(--flavor-speed) ease;

}



.bpm-contact__card-value a:hover {

    color: var(--flavor-accent);

}



.bpm-contact__card-note {

    font-size: 0.82rem;

    color: var(--flavor-text-muted);

    margin-top: 0.15rem;

}



/* Map placeholder */

.bpm-contact__map {

    border-radius: var(--flavor-radius);

    overflow: hidden;

    background: var(--flavor-bg-cool);

    border: 1px solid var(--flavor-border);

    min-height: 380px;

    position: relative;

}



.bpm-contact__map img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    display: block;

}



.bpm-contact__map iframe {

    width: 100%;

    height: 100%;

    min-height: 380px;

    border: 0;

    display: block;

}



.bpm-contact__map-placeholder {

    position: relative;

    width: 100%;

    height: 100%;

    min-height: 380px;

}



.bpm-contact__map-placeholder iframe {

    width: 100%;

    height: 100%;

    min-height: 380px;

    border: 0;

    display: block;

}



.bpm-contact__map-placeholder i {

    position: absolute;

    top: 1rem;

    right: 1rem;

    z-index: 2;

    width: 2.75rem;

    height: 2.75rem;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--flavor-white);

    color: var(--flavor-accent);

    font-size: 1.2rem;

    border-radius: 10px;

    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);

    pointer-events: none;

}



@media (max-width: 900px) {

    .bpm-contact__grid {

        grid-template-columns: 1fr;

    }

}



/* Contact form wrapper (inside contact section) */

.bpm-contact__form-wrapper {

    margin-top: 3rem;

    background: var(--flavor-white);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius);

    padding: 2.5rem;

}



.bpm-contact__form-header {

    display: flex;

    align-items: center;

    gap: 1.25rem;

    margin-bottom: 2rem;

}



.bpm-contact__form-icon {

    width: 3.5rem;

    height: 3.5rem;

    background: linear-gradient(135deg, var(--flavor-accent), var(--flavor-accent-light));

    border-radius: 12px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-white);

    font-size: 1.25rem;

    flex-shrink: 0;

}



.bpm-contact__form-title {

    font-size: 1.35rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.25rem 0;

}



.bpm-contact__form-desc {

    font-size: 0.92rem;

    color: var(--flavor-text-light);

    margin: 0;

}



/* ==========================================================================

   CONTACT FORM 7 STYLING

   ========================================================================== */

.wpcf7 {

    font-family: var(--flavor-font-body, 'Plus Jakarta Sans', sans-serif);

}



.wpcf7-form {

    display: flex;

    flex-direction: column;

    gap: 1.25rem;

}



.wpcf7-form p {

    margin: 0;

}



.wpcf7-form label {

    display: block;

    font-size: 0.85rem;

    font-weight: 600;

    color: var(--flavor-primary);

    text-transform: uppercase;

    letter-spacing: 0.05em;

    margin-bottom: 0.5rem;

}



.wpcf7-form input[type="text"],

.wpcf7-form input[type="email"],

.wpcf7-form input[type="tel"],

.wpcf7-form input[type="url"],

.wpcf7-form input[type="number"],

.wpcf7-form input[type="date"],

.wpcf7-form select,

.wpcf7-form textarea {

    width: 100%;

    padding: 0.875rem 1.125rem;

    font-family: inherit;

    font-size: 0.95rem;

    color: var(--flavor-text);

    background: var(--flavor-bg);

    border: 1.5px solid var(--flavor-border);

    border-radius: 10px;

    outline: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    box-sizing: border-box;

}



.wpcf7-form input[type="text"]:focus,

.wpcf7-form input[type="email"]:focus,

.wpcf7-form input[type="tel"]:focus,

.wpcf7-form input[type="url"]:focus,

.wpcf7-form input[type="number"]:focus,

.wpcf7-form input[type="date"]:focus,

.wpcf7-form select:focus,

.wpcf7-form textarea:focus {

    border-color: var(--flavor-accent);

    box-shadow: 0 0 0 3px rgba(238, 99, 3, 0.1);

    background: var(--flavor-white);

}



.wpcf7-form input::placeholder,

.wpcf7-form textarea::placeholder {

    color: var(--flavor-text-muted);

    opacity: 1;

}



.wpcf7-form textarea {

    min-height: 140px;

    resize: vertical;

}



.wpcf7-form select {

    appearance: none;

    -webkit-appearance: none;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2301244F' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

    background-repeat: no-repeat;

    background-position: right 1.125rem center;

    background-size: 12px 8px;

    padding-right: 3rem;

    cursor: pointer;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

    min-height: 3.25rem;

    line-height: 1.4;

}



.wpcf7-form select option {

    padding: 0.5rem;

    white-space: normal;

    word-break: break-word;

}



/* Submit button */

.wpcf7-form input[type="submit"],

.wpcf7-form .wpcf7-submit {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 0.5rem;

    padding: 1rem 2.5rem;

    font-family: inherit;

    font-size: 1rem;

    font-weight: 700;

    color: var(--flavor-white);

    background: linear-gradient(135deg, var(--flavor-accent), var(--flavor-accent-light));

    border: none;

    border-radius: var(--flavor-radius-pill, 50px);

    cursor: pointer;

    transition: all var(--flavor-speed) var(--flavor-ease);

    box-shadow: 0 4px 15px rgba(238, 99, 3, 0.3);

    text-transform: none;

    letter-spacing: 0;

    width: auto;

    align-self: flex-start;

}



.wpcf7-form input[type="submit"]:hover,

.wpcf7-form .wpcf7-submit:hover {

    transform: translateY(-2px);

    box-shadow: 0 6px 20px rgba(238, 99, 3, 0.4);

    background: linear-gradient(135deg, var(--flavor-accent-light), var(--flavor-accent));

}



.wpcf7-form input[type="submit"]:active,

.wpcf7-form .wpcf7-submit:active {

    transform: translateY(0);

}



/* Spinner */

.wpcf7-spinner {

    display: inline-block;

    width: 24px;

    height: 24px;

    border: 3px solid rgba(238, 99, 3, 0.2);

    border-top-color: var(--flavor-accent);

    border-radius: 50%;

    animation: bpm-cf7-spin 0.7s linear infinite;

    margin-left: 0.75rem;

    vertical-align: middle;

}



@keyframes bpm-cf7-spin {

    to { transform: rotate(360deg); }

}



/* Validation */

.wpcf7-not-valid {

    border-color: #e74c3c !important;

    box-shadow: 0 0 0 3px rgba(231, 76, 60, 0.1) !important;

}



.wpcf7-not-valid-tip {

    display: block;

    font-size: 0.8rem;

    color: #e74c3c;

    margin-top: 0.4rem;

    font-weight: 500;

}



/* Response messages */

.wpcf7-response-output {

    margin: 1.5rem 0 0 0 !important;

    padding: 1rem 1.25rem !important;

    border-radius: 10px !important;

    font-size: 0.92rem;

    font-weight: 500;

    border: none !important;

}



/* Required field indicators (injected via JS as .bpm-required-badge) */

.bpm-required-badge {

    display: inline-block;

    font-size: 0.68rem;

    font-weight: 700;

    color: #e74c3c;

    text-transform: uppercase;

    letter-spacing: 0.04em;

    margin-left: 0.35rem;

    vertical-align: middle;

    background: rgba(231, 76, 60, 0.08);

    padding: 0.1rem 0.45rem;

    border-radius: 4px;

    line-height: 1.5;

}



.wpcf7-form .wpcf7-checkbox.wpcf7-validates-as-required .wpcf7-list-item-label::after {

    content: " *";

    color: #e74c3c;

    font-weight: 700;

}



/* Required field note (auto-generated before form) */

.wpcf7-form::before {

    content: "Pole označená (povinné) je nutné vyplnit.";

    display: block;

    font-size: 0.82rem;

    color: var(--flavor-text-muted);

    margin-bottom: 1.25rem;

    padding-bottom: 1rem;

    border-bottom: 1px solid var(--flavor-border);

}



/* GDPR link under checkbox */

.wpcf7-form p > a[href*="ochrana-osobnich-udaju"] {

    font-size: 0.82rem;

    color: var(--flavor-accent);

    text-decoration: underline;

    text-underline-offset: 2px;

    transition: color var(--flavor-speed) ease;

}



.wpcf7-form p > a[href*="ochrana-osobnich-udaju"]:hover {

    color: var(--flavor-accent-dark);

}



.wpcf7-mail-sent-ok,

.wpcf7 form.sent .wpcf7-response-output {

    background: linear-gradient(135deg, #d4edda, #c3e6cb) !important;

    color: #155724 !important;

    border: 1px solid #b1dfbb !important;

}



.wpcf7-mail-sent-ng,

.wpcf7 form.failed .wpcf7-response-output,

.wpcf7 form.aborted .wpcf7-response-output {

    background: linear-gradient(135deg, #f8d7da, #f5c6cb) !important;

    color: #721c24 !important;

    border: 1px solid #f5c6cb !important;

}



.wpcf7 form.invalid .wpcf7-response-output,

.wpcf7 form.unaccepted .wpcf7-response-output {

    background: linear-gradient(135deg, #fff3cd, #ffeeba) !important;

    color: #856404 !important;

    border: 1px solid #ffeeba !important;

}



/* Acceptance checkbox */

.wpcf7-form .wpcf7-acceptance {

    font-size: 0.85rem;

    color: var(--flavor-text-light);

}



.wpcf7-form .wpcf7-acceptance input[type="checkbox"] {

    width: 1.15rem;

    height: 1.15rem;

    accent-color: var(--flavor-accent);

    margin-right: 0.5rem;

    vertical-align: middle;

}



/* File upload */

.wpcf7-form input[type="file"] {

    padding: 0.75rem;

    border: 1.5px dashed var(--flavor-border);

    border-radius: 10px;

    background: var(--flavor-bg);

    cursor: pointer;

    width: 100%;

}



.wpcf7-form input[type="file"]:hover {

    border-color: var(--flavor-accent);

}



/* Two-column form layout helper */

.bpm-cf7-row {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 1.25rem;

}



@media (max-width: 600px) {

    .bpm-cf7-row {

        grid-template-columns: 1fr;

    }

}



/* ==========================================================================

   KONTAKT PAGE (page-kontakt.php)

   ========================================================================== */

.bpm-kontakt-page__hero {

    padding: 5rem 2rem 3.5rem;

    text-align: center;

}



.bpm-kontakt-page__hero-inner {

    max-width: 700px;

    margin: 0 auto;

}



.bpm-kontakt-page__badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    background: rgba(238, 99, 3, 0.15);

    color: var(--flavor-accent);

    padding: 0.5rem 1.25rem;

    border-radius: 50px;

    font-size: 0.85rem;

    font-weight: 600;

    margin-bottom: 1.25rem;

}



.bpm-kontakt-page__heading {

    font-size: clamp(2rem, 4vw, 2.75rem);

    font-weight: 800;

    color: var(--flavor-white);

    margin: 0 0 1rem 0;

    line-height: 1.2;

}



.bpm-kontakt-page__desc {

    font-size: 1.1rem;

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

    line-height: 1.6;

    margin: 0;

}



.bpm-kontakt-page__content {

    padding: 4rem 2rem 5rem;

    background: var(--flavor-bg);

}



.bpm-kontakt-page__inner {

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-kontakt-page__grid {

    display: grid;

    grid-template-columns: 1.2fr 1fr;

    gap: 3rem;

    margin-bottom: 3rem;

}



/* Form column */

.bpm-kontakt-page__form-wrapper {

    background: var(--flavor-white);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius);

    padding: 2.5rem;

}



/* Info column */

.bpm-kontakt-page__info-col {

    display: flex;

    flex-direction: column;

    gap: 1.5rem;

}



.bpm-kontakt-page__main-card {

    background: var(--flavor-primary);

    border-radius: var(--flavor-radius);

    padding: 2rem;

    color: var(--flavor-white);

}



.bpm-kontakt-page__main-card-header {

    display: flex;

    align-items: center;

    gap: 1rem;

    margin-bottom: 1.5rem;

}



.bpm-kontakt-page__main-card .bpm-contact__card-icon {

    width: 3.5rem;

    height: 3.5rem;

    font-size: 1.25rem;

}



.bpm-kontakt-page__main-card-name {

    font-size: 1.2rem;

    font-weight: 700;

    margin: 0;

    color: var(--flavor-white);

}



.bpm-kontakt-page__main-card-role {

    font-size: 0.85rem;

    opacity: 0.75;

}



.bpm-kontakt-page__main-card-items {

    display: flex;

    flex-direction: column;

    gap: 0.75rem;

}



.bpm-kontakt-page__main-card-item {

    display: flex;

    align-items: center;

    gap: 0.75rem;

    color: var(--flavor-white);

    text-decoration: none;

    padding: 0.75rem 1rem;

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

    border-radius: 10px;

    transition: all var(--flavor-speed) var(--flavor-ease);

    font-weight: 500;

}



.bpm-kontakt-page__main-card-item:hover {

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

    color: var(--flavor-white);

}



.bpm-kontakt-page__main-card-item i {

    width: 1.25rem;

    text-align: center;

    color: var(--flavor-accent);

}



.bpm-kontakt-page__small-cards {

    display: flex;

    flex-direction: column;

    gap: 1rem;

}



/* Company details */

.bpm-kontakt-page__company {

    background: var(--flavor-white);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius);

    padding: 1.75rem;

}



.bpm-kontakt-page__company-title {

    font-size: 1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 1rem 0;

    display: flex;

    align-items: center;

    gap: 0.5rem;

}



.bpm-kontakt-page__company-title i {

    color: var(--flavor-accent);

}



.bpm-kontakt-page__company-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 1rem;

}



.bpm-kontakt-page__company-item {

    display: flex;

    flex-direction: column;

    gap: 0.15rem;

}



.bpm-kontakt-page__company-label {

    font-size: 0.75rem;

    color: var(--flavor-text-muted);

    text-transform: uppercase;

    letter-spacing: 0.05em;

    font-weight: 600;

}



.bpm-kontakt-page__company-value {

    font-size: 0.92rem;

    color: var(--flavor-primary);

    font-weight: 600;

}



/* Map (kontakt page) */

.bpm-kontakt-page__map {

    background: var(--flavor-white);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius);

    overflow: hidden;

}



.bpm-kontakt-page__map-header {

    display: flex;

    align-items: center;

    gap: 0.75rem;

    padding: 1.25rem 1.75rem;

    font-weight: 700;

    color: var(--flavor-primary);

    font-size: 1rem;

    border-bottom: 1px solid var(--flavor-border);

}



.bpm-kontakt-page__map-header i {

    color: var(--flavor-accent);

    font-size: 1.15rem;

}



.bpm-kontakt-page__map-frame {

    position: relative;

    width: 100%;

    height: 0;

    padding-bottom: 35%;

}



.bpm-kontakt-page__map-frame iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    border: 0;

    display: block;

}



.bpm-kontakt-page__directions {

    display: flex;

    gap: 2rem;

    padding: 1.5rem 1.75rem;

    border-top: 1px solid var(--flavor-border);

}



.bpm-kontakt-page__directions-item {

    display: flex;

    align-items: flex-start;

    gap: 0.75rem;

    flex: 1;

}



.bpm-kontakt-page__directions-item > i {

    width: 2.25rem;

    height: 2.25rem;

    background: linear-gradient(135deg, var(--flavor-accent), var(--flavor-accent-light));

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-white);

    font-size: 0.85rem;

    flex-shrink: 0;

}



.bpm-kontakt-page__directions-item strong {

    display: block;

    font-size: 0.9rem;

    color: var(--flavor-primary);

    margin-bottom: 0.2rem;

}



.bpm-kontakt-page__directions-item span {

    font-size: 0.85rem;

    color: var(--flavor-text-light);

    line-height: 1.5;

}



/* Kontakt page responsive */

@media (max-width: 900px) {

    .bpm-kontakt-page__grid {

        grid-template-columns: 1fr;

    }

    .bpm-kontakt-page__company-grid {

        grid-template-columns: 1fr;

    }

    .bpm-kontakt-page__map-frame {

        padding-bottom: 55%;

    }

}



@media (max-width: 600px) {

    .bpm-kontakt-page__form-wrapper {

        padding: 1.5rem;

    }

    .bpm-kontakt-page__directions {

        flex-direction: column;

        gap: 1rem;

    }

    .bpm-contact__form-wrapper {

        padding: 1.5rem;

    }

    .bpm-contact__form-header {

        flex-direction: column;

        text-align: center;

    }

}



/* ==========================================================================

   IMAGE PLACEHOLDER (for development)

   ========================================================================== */

.bpm-placeholder {

    background: linear-gradient(135deg, var(--flavor-bg-cool) 0%, var(--flavor-bg-blue) 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-text-light);

    font-size: 2.5rem;

    position: relative;

}



.bpm-placeholder--dark {

    background: linear-gradient(135deg, rgba(1, 36, 79, 0.2) 0%, rgba(1, 36, 79, 0.35) 100%);

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

}



/* ==========================================================================

   Scroll-reveal animation classes

   ========================================================================== */

.bpm-reveal {

    opacity: 0;

    transform: translateY(30px);

    transition: opacity 0.7s var(--flavor-ease), transform 0.7s var(--flavor-ease);

}



.bpm-reveal--visible {

    opacity: 1;

    transform: translateY(0);

}



.bpm-reveal--delay-1 { transition-delay: 0.1s; }

.bpm-reveal--delay-2 { transition-delay: 0.2s; }

.bpm-reveal--delay-3 { transition-delay: 0.3s; }

.bpm-reveal--delay-4 { transition-delay: 0.4s; }

.bpm-reveal--delay-5 { transition-delay: 0.5s; }

.bpm-reveal--delay-6 { transition-delay: 0.6s; }

.bpm-reveal--delay-7 { transition-delay: 0.7s; }

.bpm-reveal--delay-8 { transition-delay: 0.8s; }



/* Slide from left */

.bpm-reveal--left {

    opacity: 0;

    transform: translateX(-40px);

}

.bpm-reveal--left.bpm-reveal--visible {

    opacity: 1;

    transform: translateX(0);

}



/* Slide from right */

.bpm-reveal--right {

    opacity: 0;

    transform: translateX(40px);

}

.bpm-reveal--right.bpm-reveal--visible {

    opacity: 1;

    transform: translateX(0);

}



/* Scale up */

.bpm-reveal--scale {

    opacity: 0;

    transform: scale(0.9);

}

.bpm-reveal--scale.bpm-reveal--visible {

    opacity: 1;

    transform: scale(1);

}



/* ==========================================================================

   Counter animation

   ========================================================================== */

.bpm-counter {

    display: inline-block;

}





/* ==========================================================================

   ABOUT + CONTACT PAGE PATTERNS

   ========================================================================== */



/* ==========================================================================

   A1. About Hero (text-only, no photo)

   ========================================================================== */



/* Force full-width on about page sections */

section.bpm-about-hero,

section.bpm-about-story,

section.bpm-about-founder,

section.bpm-about-values,

section.bpm-about-gallery,

section.bpm-about-contact,

section.bpm-about-cta {

    max-width: none !important;

    width: 100% !important;

    box-sizing: border-box;

}



.bpm-about-hero {

    position: relative;

    background: linear-gradient(160deg, var(--flavor-primary-dark) 0%, var(--flavor-primary) 40%, var(--flavor-primary-light) 100%);

    padding: 8rem 2rem 6rem;

    overflow: hidden;

    text-align: center;

}



.bpm-about-hero__overlay {

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

}



.bpm-about-hero__overlay::before {

    content: "";

    position: absolute;

    top: -50%;

    right: -10%;

    width: 55%;

    height: 220%;

    background: linear-gradient(160deg, transparent 30%, var(--flavor-accent-glow) 40%, rgba(238, 99, 3, 0.04) 55%, transparent 65%);

    transform: rotate(-12deg);

}



.bpm-about-hero__pattern {

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

    background-image: radial-gradient(rgba(255,255,255,0.03) 1px, transparent 1px);

    background-size: 30px 30px;

}



.bpm-about-hero__inner {

    position: relative;

    z-index: 1;

    max-width: 900px;

    margin: 0 auto;

}



.bpm-about-hero__badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    background: rgba(238, 99, 3, 0.15);

    border: 1px solid rgba(238, 99, 3, 0.3);

    color: var(--flavor-accent);

    padding: 0.5rem 1.25rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.88rem;

    font-weight: 600;

    margin-bottom: 2rem;

}



.bpm-about-hero__heading {

    font-family: var(--flavor-font-heading);

    font-size: clamp(2rem, 5vw, 3.5rem);

    font-weight: 800;

    color: var(--flavor-white);

    line-height: 1.15;

    margin-bottom: 1.5rem;

}



.bpm-about-hero__heading span {

    color: var(--flavor-accent);

}



.bpm-about-hero__desc {

    font-size: clamp(1rem, 1.5vw, 1.15rem);

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

    line-height: 1.8;

    max-width: 700px;

    margin: 0 auto 3rem;

}



.bpm-about-hero__highlights {

    display: flex;

    justify-content: center;

    gap: 2rem;

    flex-wrap: wrap;

}



.bpm-about-hero__highlight {

    display: flex;

    align-items: center;

    gap: 1rem;

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

    border: 1px solid rgba(255, 255, 255, 0.1);

    border-radius: var(--flavor-radius-sm);

    padding: 1rem 1.5rem;

    text-align: left;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-hero__highlight:hover {

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

    border-color: rgba(238, 99, 3, 0.3);

    transform: translateY(-2px);

}



.bpm-about-hero__highlight-icon {

    width: 3rem;

    height: 3rem;

    background: rgba(238, 99, 3, 0.15);

    border-radius: var(--flavor-radius-xs);

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.2rem;

    color: var(--flavor-accent);

    flex-shrink: 0;

}



.bpm-about-hero__highlight-text strong {

    display: block;

    color: var(--flavor-white);

    font-size: 0.95rem;

    font-weight: 700;

}



.bpm-about-hero__highlight-text span {

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

    font-size: 0.82rem;

}



@media (max-width: 700px) {

    .bpm-about-hero { padding: 5rem 1.25rem 3rem; }

    .bpm-about-hero__highlights { flex-direction: column; align-items: center; }

    .bpm-about-hero__highlight { width: 100%; max-width: 320px; }

}





/* ==========================================================================

   A2. About Story (timeline)

   ========================================================================== */

.bpm-about-story {

    position: relative;

    background: var(--flavor-bg-warm);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about-story__inner {

    max-width: 1000px;

    margin: 0 auto;

}



.bpm-about-story__timeline {

    position: relative;

    margin-top: 4rem;

    padding: 0 1rem;

}



.bpm-about-story__line {

    position: absolute;

    left: 50%;

    top: 0;

    bottom: 0;

    width: 3px;

    background: linear-gradient(to bottom, var(--flavor-accent), var(--flavor-primary));

    transform: translateX(-50%);

    border-radius: 3px;

}



.bpm-about-story__item {

    position: relative;

    display: flex;

    margin-bottom: 3rem;

    width: 50%;

}



.bpm-about-story__item--left {

    justify-content: flex-end;

    padding-right: 3rem;

    margin-left: 0;

}



.bpm-about-story__item--right {

    justify-content: flex-start;

    padding-left: 3rem;

    margin-left: 50%;

}



.bpm-about-story__dot {

    position: absolute;

    top: 1.5rem;

    width: 16px;

    height: 16px;

    background: var(--flavor-accent);

    border: 3px solid var(--flavor-white);

    border-radius: 50%;

    box-shadow: 0 0 0 4px rgba(238, 99, 3, 0.2);

    z-index: 2;

}



.bpm-about-story__item--left .bpm-about-story__dot {

    right: -8px;

}



.bpm-about-story__item--right .bpm-about-story__dot {

    left: -8px;

}



.bpm-about-story__card {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    padding: 1.75rem;

    box-shadow: var(--flavor-shadow-card);

    border: 1px solid var(--flavor-border-light);

    max-width: 380px;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-story__card:hover {

    box-shadow: var(--flavor-shadow-md);

    transform: translateY(-2px);

}



.bpm-about-story__year {

    display: inline-block;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    font-weight: 800;

    font-size: 0.85rem;

    padding: 0.3rem 0.85rem;

    border-radius: var(--flavor-radius-pill);

    margin-bottom: 0.75rem;

}



.bpm-about-story__card-title {

    font-family: var(--flavor-font-heading);

    font-size: 1.15rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.5rem;

}



.bpm-about-story__card-text {

    font-size: 0.92rem;

    color: var(--flavor-text-muted);

    line-height: 1.65;

    margin: 0;

}



@media (max-width: 768px) {

    .bpm-about-story__line { left: 20px; }

    .bpm-about-story__item,

    .bpm-about-story__item--left,

    .bpm-about-story__item--right {

        width: 100%;

        margin-left: 0;

        padding-left: 3.5rem;

        padding-right: 0;

        justify-content: flex-start;

    }

    .bpm-about-story__item--left .bpm-about-story__dot,

    .bpm-about-story__item--right .bpm-about-story__dot {

        left: 12px;

        right: auto;

    }

    .bpm-about-story__card { max-width: 100%; }

}





/* ==========================================================================

   A3. About Founder

   ========================================================================== */

.bpm-about-founder {

    position: relative;

    background: var(--flavor-white);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about-founder__inner {

    max-width: 1200px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: 1fr 1.2fr;

    gap: 4rem;

    align-items: center;

}



.bpm-about-founder__photo-frame {

    position: relative;

    border-radius: var(--flavor-radius);

    overflow: hidden;

    box-shadow: var(--flavor-shadow-lg);

}



.bpm-about-founder__photo-frame img {

    width: 100%;

    height: auto;

    display: block;

    aspect-ratio: 3/4;

    object-fit: cover;

}



.bpm-about-founder__badge {

    display: flex;

    align-items: flex-start;

    gap: 0.75rem;

    background: var(--flavor-primary);

    color: var(--flavor-white);

    padding: 1.25rem 1.5rem;

    border-radius: var(--flavor-radius-sm);

    margin-top: 1.5rem;

    font-size: 0.95rem;

    font-style: italic;

    line-height: 1.5;

}



.bpm-about-founder__badge i {

    color: var(--flavor-accent);

    font-size: 1.3rem;

    margin-top: 2px;

    flex-shrink: 0;

}



.bpm-about-founder__label {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    color: var(--flavor-accent);

    font-weight: 600;

    font-size: 0.88rem;

    text-transform: uppercase;

    letter-spacing: 0.5px;

    margin-bottom: 1rem;

}



.bpm-about-founder__title {

    font-family: var(--flavor-font-heading);

    font-size: clamp(2rem, 4vw, 3rem);

    font-weight: 800;

    color: var(--flavor-primary);

    line-height: 1.15;

    margin-bottom: 1.5rem;

}



.bpm-about-founder__title span {

    color: var(--flavor-accent);

}



.bpm-about-founder__text {

    font-size: 1rem;

    color: var(--flavor-text-muted);

    line-height: 1.8;

    margin-bottom: 1rem;

}



.bpm-about-founder__contact {

    display: flex;

    gap: 1rem;

    margin-top: 2rem;

    flex-wrap: wrap;

}



.bpm-about-founder__contact-item {

    display: inline-flex;

    align-items: center;

    gap: 0.6rem;

    padding: 0.85rem 1.5rem;

    background: var(--flavor-bg-cool);

    border: 1px solid var(--flavor-border);

    border-radius: var(--flavor-radius-sm);

    color: var(--flavor-primary);

    font-weight: 600;

    font-size: 0.95rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-founder__contact-item i {

    color: var(--flavor-accent);

}



.bpm-about-founder__contact-item:hover {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    border-color: var(--flavor-accent);

    box-shadow: var(--flavor-shadow-accent);

    transform: translateY(-2px);

}



.bpm-about-founder__contact-item:hover i {

    color: var(--flavor-white);

}



@media (max-width: 900px) {

    .bpm-about-founder__inner { grid-template-columns: 1fr; gap: 2rem; }

    .bpm-about-founder__photo { max-width: 400px; margin: 0 auto; }

}





/* ==========================================================================

   A4. About Values

   ========================================================================== */

.bpm-about-values {

    position: relative;

    background: var(--flavor-bg-cool);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about-values__inner {

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-about-values__grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1.5rem;

    margin-top: 3.5rem;

}



.bpm-about-values__card {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    padding: 2rem;

    border: 1px solid var(--flavor-border-light);

    box-shadow: var(--flavor-shadow-card);

    transition: all var(--flavor-speed) var(--flavor-ease);

    text-align: center;

}



.bpm-about-values__card:hover {

    box-shadow: var(--flavor-shadow-md);

    transform: translateY(-4px);

    border-color: rgba(238, 99, 3, 0.2);

}



.bpm-about-values__card-icon {

    width: 3.5rem;

    height: 3.5rem;

    background: linear-gradient(135deg, var(--flavor-accent-glow), rgba(238, 99, 3, 0.08));

    border: 1px solid rgba(238, 99, 3, 0.15);

    border-radius: var(--flavor-radius-sm);

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.4rem;

    color: var(--flavor-accent);

    margin: 0 auto 1.25rem;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-values__card:hover .bpm-about-values__card-icon {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    border-color: var(--flavor-accent);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-about-values__card-title {

    font-family: var(--flavor-font-heading);

    font-size: 1.1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.6rem;

}



.bpm-about-values__card-desc {

    font-size: 0.9rem;

    color: var(--flavor-text-muted);

    line-height: 1.65;

    margin: 0;

}



@media (max-width: 900px) {

    .bpm-about-values__grid { grid-template-columns: repeat(2, 1fr); }

}



@media (max-width: 600px) {

    .bpm-about-values__grid { grid-template-columns: 1fr; }

}





/* ==========================================================================

   A5. About Gallery

   ========================================================================== */

.bpm-about-gallery {

    position: relative;

    background: var(--flavor-white);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about-gallery__inner {

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-about-gallery__grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1rem;

    margin-top: 3.5rem;

}



.bpm-about-gallery__item {

    position: relative;

    border-radius: var(--flavor-radius);

    overflow: hidden;

    aspect-ratio: 1/1;

    cursor: pointer;

    box-shadow: var(--flavor-shadow-sm);

}



.bpm-about-gallery__item--wide {

    grid-column: span 2;

    aspect-ratio: 2/1;

}



.bpm-about-gallery__img {

    width: 100%;

    height: 100%;

}



.bpm-about-gallery__img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform 0.6s var(--flavor-ease);

}



.bpm-about-gallery__item:hover .bpm-about-gallery__img img {

    transform: scale(1.08);

}



.bpm-about-gallery__overlay {

    position: absolute;

    inset: 0;

    background: linear-gradient(to top, rgba(1, 36, 79, 0.85) 0%, rgba(1, 36, 79, 0.2) 50%, transparent 100%);

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    padding: 1.25rem;

    opacity: 0;

    transition: opacity var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-gallery__item:hover .bpm-about-gallery__overlay {

    opacity: 1;

}



.bpm-about-gallery__tag {

    display: inline-block;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    font-size: 0.72rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.5px;

    padding: 0.25rem 0.65rem;

    border-radius: var(--flavor-radius-xs);

    margin-bottom: 0.5rem;

    width: fit-content;

}



.bpm-about-gallery__caption {

    color: var(--flavor-white);

    font-family: var(--flavor-font-heading);

    font-size: 0.95rem;

    font-weight: 700;

    margin: 0;

    line-height: 1.3;

}



/* Placeholder when no image is set */

.bpm-about-gallery__img img[src=""] {

    background: linear-gradient(135deg, var(--flavor-bg-cool), var(--flavor-bg-blue));

    min-height: 100%;

}



@media (max-width: 900px) {

    .bpm-about-gallery__grid { grid-template-columns: repeat(2, 1fr); }

    .bpm-about-gallery__item--wide { grid-column: span 2; }

}



@media (max-width: 600px) {

    .bpm-about-gallery__grid { grid-template-columns: 1fr; }

    .bpm-about-gallery__item--wide { grid-column: span 1; aspect-ratio: 16/9; }

    .bpm-about-gallery__item { aspect-ratio: 16/10; }

}





/* ==========================================================================

   A6. About Contact

   ========================================================================== */

.bpm-about-contact {

    position: relative;

    background: var(--flavor-bg-warm);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about-contact__inner {

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-about-contact__layout {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 3rem;

    margin-top: 3.5rem;

    align-items: start;

}



/* Main contact card */

.bpm-about-contact__main-card {

    background: var(--flavor-primary);

    border-radius: var(--flavor-radius);

    padding: 2rem;

    color: var(--flavor-white);

    margin-bottom: 1.5rem;

}



.bpm-about-contact__main-card-header {

    display: flex;

    align-items: center;

    gap: 1rem;

    margin-bottom: 1.5rem;

    padding-bottom: 1.25rem;

    border-bottom: 1px solid rgba(255, 255, 255, 0.12);

}



.bpm-about-contact__main-card-icon {

    width: 3.5rem;

    height: 3.5rem;

    background: rgba(238, 99, 3, 0.2);

    border-radius: var(--flavor-radius-sm);

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.4rem;

    color: var(--flavor-accent);

    flex-shrink: 0;

}



.bpm-about-contact__main-card-name {

    font-family: var(--flavor-font-heading);

    font-size: 1.3rem;

    font-weight: 800;

    margin: 0;

    color: var(--flavor-white);

}



.bpm-about-contact__main-card-role {

    font-size: 0.85rem;

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

}



.bpm-about-contact__main-card-items {

    display: flex;

    flex-direction: column;

    gap: 0.75rem;

}



.bpm-about-contact__main-card-item {

    display: flex;

    align-items: center;

    gap: 0.75rem;

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

    text-decoration: none;

    padding: 0.65rem 1rem;

    border-radius: var(--flavor-radius-xs);

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

    transition: all var(--flavor-speed) var(--flavor-ease);

    font-size: 0.95rem;

}



.bpm-about-contact__main-card-item i {

    color: var(--flavor-accent);

    width: 1.2rem;

    text-align: center;

}



.bpm-about-contact__main-card-item:hover {

    background: rgba(238, 99, 3, 0.2);

    color: var(--flavor-white);

}



/* Small contact cards row */

.bpm-about-contact__cards-row {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1rem;

    margin-bottom: 1.5rem;

}



.bpm-about-contact__small-card {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    padding: 1.25rem;

    border: 1px solid var(--flavor-border-light);

    box-shadow: var(--flavor-shadow-sm);

    text-align: center;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-contact__small-card:hover {

    box-shadow: var(--flavor-shadow-md);

    transform: translateY(-2px);

    border-color: rgba(238, 99, 3, 0.2);

}



.bpm-about-contact__small-card-icon {

    width: 2.5rem;

    height: 2.5rem;

    background: var(--flavor-accent-glow);

    border-radius: var(--flavor-radius-xs);

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1rem;

    color: var(--flavor-accent);

    margin: 0 auto 0.75rem;

}



.bpm-about-contact__small-card-label {

    font-size: 0.78rem;

    font-weight: 600;

    color: var(--flavor-text-muted);

    text-transform: uppercase;

    letter-spacing: 0.5px;

    margin-bottom: 0.4rem;

}



.bpm-about-contact__small-card-value {

    font-size: 0.88rem;

    font-weight: 600;

    color: var(--flavor-primary);

    line-height: 1.4;

    text-decoration: none;

    display: block;

}



a.bpm-about-contact__small-card-value:hover {

    color: var(--flavor-accent);

}



.bpm-about-contact__small-card-note {

    font-size: 0.75rem;

    color: var(--flavor-text-light);

    margin-top: 0.3rem;

}



/* Company data card */

.bpm-about-contact__company {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    padding: 1.5rem;

    border: 1px solid var(--flavor-border-light);

    box-shadow: var(--flavor-shadow-sm);

}



.bpm-about-contact__company-title {

    font-family: var(--flavor-font-heading);

    font-size: 1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 1rem;

    display: flex;

    align-items: center;

    gap: 0.5rem;

}



.bpm-about-contact__company-title i {

    color: var(--flavor-accent);

}



.bpm-about-contact__company-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 0.75rem;

}



.bpm-about-contact__company-item {

    display: flex;

    flex-direction: column;

    gap: 0.15rem;

}



.bpm-about-contact__company-label {

    font-size: 0.72rem;

    font-weight: 600;

    color: var(--flavor-text-light);

    text-transform: uppercase;

    letter-spacing: 0.5px;

}



.bpm-about-contact__company-value {

    font-size: 0.9rem;

    font-weight: 600;

    color: var(--flavor-text);

}



/* Map area */

.bpm-about-contact__map-wrapper {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    overflow: hidden;

    box-shadow: var(--flavor-shadow-md);

    border: 1px solid var(--flavor-border-light);

}



.bpm-about-contact__map-header {

    display: flex;

    align-items: center;

    gap: 0.6rem;

    padding: 1rem 1.5rem;

    background: var(--flavor-primary);

    color: var(--flavor-white);

    font-weight: 700;

    font-size: 0.95rem;

}



.bpm-about-contact__map-header i {

    color: var(--flavor-accent);

}



.bpm-about-contact__map-frame {

    position: relative;

    width: 100%;

    height: 0;

    padding-bottom: 80%;

}



.bpm-about-contact__map-frame iframe {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    border: 0;

}



/* Directions */

.bpm-about-contact__directions {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    padding: 1.5rem;

    margin-top: 1.5rem;

    box-shadow: var(--flavor-shadow-sm);

    border: 1px solid var(--flavor-border-light);

}



.bpm-about-contact__directions-title {

    font-family: var(--flavor-font-heading);

    font-size: 1rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 1rem;

    display: flex;

    align-items: center;

    gap: 0.5rem;

}



.bpm-about-contact__directions-title i {

    color: var(--flavor-accent);

}



.bpm-about-contact__directions-items {

    display: flex;

    flex-direction: column;

    gap: 1rem;

}



.bpm-about-contact__directions-item {

    display: flex;

    gap: 0.85rem;

    align-items: flex-start;

}



.bpm-about-contact__directions-item > i {

    width: 2rem;

    height: 2rem;

    background: var(--flavor-accent-glow);

    border-radius: var(--flavor-radius-xs);

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 0.85rem;

    color: var(--flavor-accent);

    flex-shrink: 0;

}



.bpm-about-contact__directions-item strong {

    display: block;

    font-size: 0.9rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin-bottom: 0.15rem;

}



.bpm-about-contact__directions-item span {

    font-size: 0.85rem;

    color: var(--flavor-text-muted);

    line-height: 1.5;

}



@media (max-width: 900px) {

    .bpm-about-contact__layout { grid-template-columns: 1fr; }

    .bpm-about-contact__map-frame { padding-bottom: 56%; }

}



@media (max-width: 600px) {

    .bpm-about-contact__cards-row { grid-template-columns: 1fr; }

    .bpm-about-contact__company-grid { grid-template-columns: 1fr; }

}





/* ==========================================================================

   A7. About CTA

   ========================================================================== */

.bpm-about-cta {

    position: relative;

    background: linear-gradient(160deg, var(--flavor-primary-dark), var(--flavor-primary) 50%, var(--flavor-primary-light));

    padding: 6rem 2rem;

    overflow: hidden;

    text-align: center;

}



.bpm-about-cta__overlay {

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 0;

}



.bpm-about-cta__overlay::before {

    content: "";

    position: absolute;

    top: -40%;

    right: -20%;

    width: 70%;

    height: 200%;

    background: radial-gradient(circle, rgba(238, 99, 3, 0.08) 0%, transparent 70%);

}



.bpm-about-cta__inner {

    position: relative;

    z-index: 1;

    max-width: 720px;

    margin: 0 auto;

}



.bpm-about-cta__icon {

    width: 4.5rem;

    height: 4.5rem;

    background: rgba(238, 99, 3, 0.15);

    border: 2px solid rgba(238, 99, 3, 0.3);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 2rem;

    font-size: 1.8rem;

    color: var(--flavor-accent);

}



.bpm-about-cta__title {

    font-family: var(--flavor-font-heading);

    font-size: clamp(1.8rem, 4vw, 2.8rem);

    font-weight: 800;

    color: var(--flavor-white);

    margin: 0 0 1rem;

    line-height: 1.15;

}



.bpm-about-cta__title span {

    color: var(--flavor-accent);

}



.bpm-about-cta__desc {

    font-size: 1.1rem;

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

    line-height: 1.7;

    margin: 0 0 2.5rem;

}



.bpm-about-cta__actions {

    display: flex;

    gap: 1rem;

    justify-content: center;

    flex-wrap: wrap;

    margin-bottom: 2rem;

}



.bpm-about-cta__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.6rem;

    padding: 1rem 2.25rem;

    border-radius: var(--flavor-radius-sm);

    font-weight: 700;

    font-size: 1rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    border: none;

    cursor: pointer;

}



.bpm-about-cta__btn--primary {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-about-cta__btn--primary:hover {

    background: var(--flavor-accent-light);

    box-shadow: 0 6px 32px rgba(238, 99, 3, 0.45);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



.bpm-about-cta__btn--outline {

    background: transparent;

    color: var(--flavor-white);

    border: 2px solid rgba(255, 255, 255, 0.3);

}



.bpm-about-cta__btn--outline:hover {

    border-color: var(--flavor-white);

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

    color: var(--flavor-white);

}



.bpm-about-cta__btn--ghost {

    background: transparent;

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

    border: 1px dashed rgba(255, 255, 255, 0.3);

    font-size: 0.9rem;

}



.bpm-about-cta__btn--ghost:hover {

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

    border-color: rgba(255, 255, 255, 0.55);

    color: var(--flavor-white);

    transform: translateY(-2px);

}



.bpm-about-cta__hours {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 0.5rem;

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

    font-size: 0.88rem;

    margin-top: 1rem;

}



.bpm-about-cta__hours i {

    color: var(--flavor-accent);

}





/* ==========================================================================

   A8. About Process (jak pracujeme – 5 kroků)

   ========================================================================== */

.bpm-about-process {

    position: relative;

    background: var(--flavor-bg-warm);

    padding: 6rem 2rem;

    overflow: hidden;

}



.bpm-about-process__inner {

    max-width: 1200px;

    margin: 0 auto;

}



.bpm-about-process__steps {

    display: flex;

    align-items: flex-start;

    gap: 0;

    margin-top: 3.5rem;

    flex-wrap: wrap;

    justify-content: center;

}



.bpm-about-process__step {

    flex: 1;

    min-width: 180px;

    max-width: 220px;

    text-align: center;

    padding: 1.5rem 1rem;

    position: relative;

}



.bpm-about-process__step-number {

    font-family: var(--flavor-font-heading);

    font-size: 2.5rem;

    font-weight: 800;

    color: var(--flavor-accent-glow);

    line-height: 1;

    margin-bottom: 0.5rem;

}



.bpm-about-process__step-icon {

    width: 3.5rem;

    height: 3.5rem;

    background: var(--flavor-accent);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.3rem;

    color: var(--flavor-white);

    margin: 0 auto 1rem;

    box-shadow: var(--flavor-shadow-accent);

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-process__step:hover .bpm-about-process__step-icon {

    transform: scale(1.1);

    box-shadow: 0 6px 28px rgba(238, 99, 3, 0.4);

}



.bpm-about-process__step-title {

    font-family: var(--flavor-font-heading);

    font-size: 0.95rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin: 0 0 0.5rem;

}



.bpm-about-process__step-desc {

    font-size: 0.82rem;

    color: var(--flavor-text-muted);

    line-height: 1.55;

    margin: 0;

}



.bpm-about-process__connector {

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-border);

    font-size: 1rem;

    padding-top: 4rem;

}



@media (max-width: 900px) {

    .bpm-about-process__steps { flex-direction: column; align-items: center; }

    .bpm-about-process__connector { transform: rotate(90deg); padding: 0.5rem 0; }

    .bpm-about-process__step { max-width: 300px; }

}





/* ==========================================================================

   A9. About Services Overview (kompaktní přehled služeb)

   ========================================================================== */

.bpm-about-services-ov {

    position: relative;

    background: var(--flavor-primary);

    padding: 5rem 2rem;

    overflow: hidden;

}



.bpm-about-services-ov__inner {

    max-width: 1000px;

    margin: 0 auto;

}



.bpm-about-services-ov .bpm-section-header__label {

    color: var(--flavor-accent);

}



.bpm-about-services-ov .bpm-section-header__title {

    color: var(--flavor-white);

}



.bpm-about-services-ov .bpm-section-header__title span {

    color: var(--flavor-accent);

}



.bpm-about-services-ov .bpm-section-header__desc {

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

}



.bpm-about-services-ov__grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 0.75rem;

    margin-top: 3rem;

}



.bpm-about-services-ov__item {

    display: flex;

    align-items: center;

    gap: 0.7rem;

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

    border: 1px solid rgba(255, 255, 255, 0.08);

    border-radius: var(--flavor-radius-sm);

    padding: 0.85rem 1rem;

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

    font-size: 0.88rem;

    font-weight: 500;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-about-services-ov__item i {

    color: var(--flavor-accent);

    font-size: 1rem;

    width: 1.2rem;

    text-align: center;

    flex-shrink: 0;

}



.bpm-about-services-ov__item:hover {

    background: rgba(238, 99, 3, 0.15);

    border-color: rgba(238, 99, 3, 0.3);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



.bpm-about-services-ov__footer {

    text-align: center;

    margin-top: 2.5rem;

}



.bpm-about-services-ov__btn {

    display: inline-flex;

    align-items: center;

    margin-top: 1;

    gap: 0.6rem;

    padding: 0.85rem 2rem;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    font-weight: 700;

    font-size: 0.92rem;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-about-services-ov__btn:hover {

    background: var(--flavor-accent-light);

    box-shadow: 0 6px 32px rgba(238, 99, 3, 0.4);

    transform: translateY(-2px);

    color: var(--flavor-white);

}



@media (max-width: 768px) {

    .bpm-about-services-ov__grid { grid-template-columns: repeat(2, 1fr); }

}



@media (max-width: 480px) {

    .bpm-about-services-ov__grid { grid-template-columns: 1fr; }

}





/* ==========================================================================

   S1: SERVICES PAGE – HERO

   ========================================================================== */



.bpm-svc-hero {

    position: relative;

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-dark) 100%);

    padding: 120px 0 80px;

    overflow: hidden;

    color: var(--flavor-white);

}



.bpm-svc-hero__overlay {

    position: absolute;

    inset: 0;

    background: radial-gradient(ellipse at 70% 20%, rgba(238, 99, 3, 0.15) 0%, transparent 60%);

    pointer-events: none;

}



.bpm-svc-hero__pattern {

    position: absolute;

    inset: 0;

    background-image: radial-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px);

    background-size: 30px 30px;

    pointer-events: none;

}



.bpm-svc-hero__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svc-hero__content {

    text-align: center;

    max-width: 800px;

    margin: 0 auto;

}



.bpm-svc-hero__badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    background: rgba(238, 99, 3, 0.2);

    border: 1px solid rgba(238, 99, 3, 0.3);

    color: var(--flavor-accent-light);

    padding: 0.5rem 1.25rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.88rem;

    font-weight: 600;

    letter-spacing: 0.03em;

    margin-bottom: 1.5rem;

}



.bpm-svc-hero__heading {

    font-size: clamp(2rem, 5vw, 3.2rem);

    font-weight: 800;

    line-height: 1.15;

    color: var(--flavor-white);

    margin-bottom: 1.25rem;

}



.bpm-svc-hero__heading span {

    color: var(--flavor-accent);

}



.bpm-svc-hero__desc {

    font-size: 1.15rem;

    line-height: 1.7;

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

    margin-bottom: 2.5rem;

}



.bpm-svc-hero__stats {

    display: flex;

    justify-content: center;

    gap: 3rem;

    margin-top: 1rem;

}



.bpm-svc-hero__stat {

    text-align: center;

}



.bpm-svc-hero__stat-number {

    font-size: 2.2rem;

    font-weight: 800;

    color: var(--flavor-accent);

    line-height: 1;

}



.bpm-svc-hero__stat-label {

    font-size: 0.85rem;

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

    margin-top: 0.4rem;

    font-weight: 500;

}



@media (max-width: 600px) {

    .bpm-svc-hero { padding: 100px 0 60px; }

    .bpm-svc-hero__stats { flex-direction: column; gap: 1.5rem; }

}





/* ==========================================================================

   S2: SERVICES PAGE – GRID (Cards with Images)

   ========================================================================== */



.bpm-svc-grid {

    position: relative;

    padding: 80px 0 100px;

    background: var(--flavor-bg-warm);

    overflow: hidden;

}



.bpm-svc-grid__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svc-grid__cards {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1.5rem;

    margin-top: 3rem;

}



.bpm-svc-grid__card {

    display: flex;

    flex-direction: column;

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    overflow: hidden;

    text-decoration: none;

    color: inherit;

    box-shadow: var(--flavor-shadow-sm);

    transition: all var(--flavor-speed-slow) var(--flavor-ease);

    border: 1px solid rgba(1, 36, 79, 0.06);

    position: relative;

}



.bpm-svc-grid__card:hover {

    transform: translateY(-6px);

    box-shadow: var(--flavor-shadow-lg);

    border-color: rgba(238, 99, 3, 0.2);

}



.bpm-svc-grid__card--featured {

    grid-column: span 2;

}



.bpm-svc-grid__card--featured .bpm-svc-grid__card-img {

    height: 280px;

}



.bpm-svc-grid__card--specialty {

    border: 2px solid var(--flavor-accent);

    background: linear-gradient(135deg, #fff8f0 0%, var(--flavor-white) 100%);

}



.bpm-svc-grid__card--specialty:hover {

    border-color: var(--flavor-accent-light);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-svc-grid__card-badge {

    position: absolute;

    top: 1rem;

    right: 1rem;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    padding: 0.35rem 0.85rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.78rem;

    font-weight: 700;

    z-index: 3;

    display: flex;

    align-items: center;

    gap: 0.35rem;

}



.bpm-svc-grid__card-img {

    width: 100%;

    height: 200px;

    overflow: hidden;

    position: relative;

}



.bpm-svc-grid__card-img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform var(--flavor-speed-slow) var(--flavor-ease);

}



.bpm-svc-grid__card:hover .bpm-svc-grid__card-img img {

    transform: scale(1.06);

}



.bpm-svc-grid__card-body {

    padding: 1.5rem;

    flex: 1;

    display: flex;

    flex-direction: column;

}



.bpm-svc-grid__card-icon {

    width: 44px;

    height: 44px;

    border-radius: var(--flavor-radius-sm);

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-light) 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-white);

    font-size: 1.1rem;

    margin-bottom: 0.85rem;

    flex-shrink: 0;

}



.bpm-svc-grid__card--specialty .bpm-svc-grid__card-icon {

    background: linear-gradient(135deg, var(--flavor-accent) 0%, var(--flavor-accent-light) 100%);

}



.bpm-svc-grid__card-title {

    font-size: 1.15rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin-bottom: 0.5rem;

    line-height: 1.3;

}



.bpm-svc-grid__card-desc {

    font-size: 0.9rem;

    color: var(--flavor-text-muted);

    line-height: 1.6;

    flex: 1;

    margin-bottom: 1rem;

}



.bpm-svc-grid__card-link {

    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

    font-size: 0.88rem;

    font-weight: 600;

    color: var(--flavor-accent);

    transition: gap var(--flavor-speed) var(--flavor-ease);

}



.bpm-svc-grid__card:hover .bpm-svc-grid__card-link {

    gap: 0.7rem;

}



@media (max-width: 900px) {

    .bpm-svc-grid__cards { grid-template-columns: repeat(2, 1fr); }

    .bpm-svc-grid__card--featured { grid-column: span 2; }

}



@media (max-width: 600px) {

    .bpm-svc-grid__cards { grid-template-columns: 1fr; }

    .bpm-svc-grid__card--featured { grid-column: span 1; }

}





/* ==========================================================================

   S3: SERVICES PAGE – REALIZATIONS GALLERY

   ========================================================================== */



.bpm-svc-real {

    position: relative;

    padding: 80px 0 100px;

    background: var(--flavor-white);

    overflow: hidden;

}



.bpm-svc-real__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svc-real__grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1rem;

    margin-top: 3rem;

}



.bpm-svc-real__item {

    position: relative;

    border-radius: var(--flavor-radius);

    overflow: hidden;

    cursor: pointer;

    aspect-ratio: 1;

}



.bpm-svc-real__item--wide {

    grid-column: span 2;

    aspect-ratio: 2/1;

}



.bpm-svc-real__img {

    width: 100%;

    height: 100%;

}



.bpm-svc-real__img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform var(--flavor-speed-slow) var(--flavor-ease);

}



.bpm-svc-real__item:hover .bpm-svc-real__img img {

    transform: scale(1.08);

}



.bpm-svc-real__overlay {

    position: absolute;

    inset: 0;

    background: linear-gradient(0deg, rgba(1, 36, 79, 0.85) 0%, transparent 60%);

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    padding: 1.25rem;

    opacity: 0;

    transition: opacity var(--flavor-speed) var(--flavor-ease);

}



.bpm-svc-real__item:hover .bpm-svc-real__overlay {

    opacity: 1;

}



.bpm-svc-real__tag {

    display: inline-block;

    background: var(--flavor-accent);

    color: var(--flavor-white);

    padding: 0.2rem 0.65rem;

    border-radius: var(--flavor-radius-xs);

    font-size: 0.75rem;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    margin-bottom: 0.4rem;

    width: fit-content;

}



.bpm-svc-real__caption {

    font-size: 0.95rem;

    font-weight: 600;

    color: var(--flavor-white);

    margin: 0;

}



@media (max-width: 900px) {

    .bpm-svc-real__grid { grid-template-columns: repeat(2, 1fr); }

    .bpm-svc-real__item--wide { grid-column: span 2; }

}



@media (max-width: 480px) {

    .bpm-svc-real__grid { grid-template-columns: 1fr; }

    .bpm-svc-real__item--wide { grid-column: span 1; aspect-ratio: 16/9; }

    .bpm-svc-real__item { aspect-ratio: 4/3; }

    .bpm-svc-real__overlay { opacity: 1; }

}





/* ==========================================================================

   S4: SERVICES PAGE – CTA

   ========================================================================== */



.bpm-svc-cta {

    position: relative;

    padding: 80px 0;

    background: linear-gradient(135deg, var(--flavor-accent) 0%, var(--flavor-accent-dark) 100%);

    overflow: hidden;

}



.bpm-svc-cta__inner {

    max-width: 800px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svc-cta__content {

    text-align: center;

    color: var(--flavor-white);

}



.bpm-svc-cta__icon {

    width: 64px;

    height: 64px;

    border-radius: 50%;

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

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.5rem;

    color: var(--flavor-white);

    margin: 0 auto 1.5rem;

}



.bpm-svc-cta__title {

    font-size: clamp(1.6rem, 3.5vw, 2.2rem);

    font-weight: 800;

    color: var(--flavor-white);

    margin-bottom: 0.75rem;

}



.bpm-svc-cta__desc {

    font-size: 1.05rem;

    line-height: 1.7;

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

    margin-bottom: 2rem;

}



.bpm-svc-cta__actions {

    display: flex;

    justify-content: center;

    gap: 1rem;

    flex-wrap: wrap;

    margin-bottom: 1.5rem;

}



.bpm-svc-cta__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    padding: 0.85rem 1.75rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.95rem;

    font-weight: 700;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-svc-cta__btn--primary {

    background: var(--flavor-white);

    color: var(--flavor-accent);

}



.bpm-svc-cta__btn--primary:hover {

    background: var(--flavor-primary);

    color: var(--flavor-white);

    transform: translateY(-2px);

    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);

}



.bpm-svc-cta__btn--secondary {

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

    color: var(--flavor-white);

    border: 1px solid rgba(255, 255, 255, 0.3);

}



.bpm-svc-cta__btn--secondary:hover {

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

    transform: translateY(-2px);

}



.bpm-svc-cta__btn--ghost {

    background: transparent;

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

    border: 1px dashed rgba(255, 255, 255, 0.3);

    font-size: 0.9rem;

}



.bpm-svc-cta__btn--ghost:hover {

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

    border-color: rgba(255, 255, 255, 0.55);

    color: var(--flavor-white);

    transform: translateY(-2px);

}



.bpm-svc-cta__trust {

    display: flex;

    justify-content: center;

    gap: 1.5rem;

    flex-wrap: wrap;

    font-size: 0.85rem;

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

}



.bpm-svc-cta__trust span {

    display: flex;

    align-items: center;

    gap: 0.35rem;

}



.bpm-svc-cta__trust i {

    color: var(--flavor-white);

}



@media (max-width: 480px) {

    .bpm-svc-cta__actions { flex-direction: column; align-items: center; }

    .bpm-svc-cta__trust { flex-direction: column; align-items: center; gap: 0.5rem; }

}





/* ==========================================================================

   SD1: SERVICE DETAIL – HERO (Sub-page)

   ========================================================================== */



.bpm-svcd-hero {

    position: relative;

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-dark) 100%);

    padding: 110px 0 60px;

    overflow: hidden;

    color: var(--flavor-white);

}



.bpm-svcd-hero__overlay {

    position: absolute;

    inset: 0;

    background: radial-gradient(ellipse at 30% 80%, rgba(238, 99, 3, 0.12) 0%, transparent 55%);

    pointer-events: none;

}



.bpm-svcd-hero__pattern {

    position: absolute;

    inset: 0;

    background-image: radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px);

    background-size: 25px 25px;

    pointer-events: none;

}



.bpm-svcd-hero__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svcd-hero__breadcrumb {

    display: flex;

    align-items: center;

    gap: 0.5rem;

    font-size: 0.85rem;

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

    margin-bottom: 2rem;

}



.bpm-svcd-hero__breadcrumb a {

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

    text-decoration: none;

    transition: color var(--flavor-speed) var(--flavor-ease);

}



.bpm-svcd-hero__breadcrumb a:hover {

    color: var(--flavor-accent-light);

}



.bpm-svcd-hero__breadcrumb .current {

    color: var(--flavor-accent-light);

    font-weight: 600;

}



.bpm-svcd-hero__content {

    max-width: 700px;

}



.bpm-svcd-hero__badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    background: rgba(238, 99, 3, 0.2);

    border: 1px solid rgba(238, 99, 3, 0.3);

    color: var(--flavor-accent-light);

    padding: 0.45rem 1.1rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.85rem;

    font-weight: 600;

    margin-bottom: 1.25rem;

}



.bpm-svcd-hero__heading {

    font-size: clamp(1.8rem, 4.5vw, 2.8rem);

    font-weight: 800;

    line-height: 1.15;

    color: var(--flavor-white);

    margin-bottom: 1rem;

}



.bpm-svcd-hero__heading span {

    color: var(--flavor-accent);

}



.bpm-svcd-hero__desc {

    font-size: 1.1rem;

    line-height: 1.7;

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

}



@media (max-width: 600px) {

    .bpm-svcd-hero { padding: 100px 0 50px; }

}





/* ==========================================================================

   SD2: SERVICE DETAIL – CONTENT (Description + Features + Images)

   ========================================================================== */



.bpm-svcd-content {

    position: relative;

    padding: 80px 0;

    background: var(--flavor-white);

}



.bpm-svcd-content__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

}



.bpm-svcd-content__row {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 3.5rem;

    align-items: start;

}



.bpm-svcd-content__main h2 {

    font-size: 1.6rem;

    font-weight: 800;

    color: var(--flavor-primary);

    margin-bottom: 1rem;

    position: relative;

    padding-bottom: 0.75rem;

}



.bpm-svcd-content__main h2::after {

    content: '';

    position: absolute;

    bottom: 0;

    left: 0;

    width: 50px;

    height: 3px;

    background: var(--flavor-accent);

    border-radius: 3px;

}



.bpm-svcd-content__intro p {

    font-size: 1rem;

    line-height: 1.75;

    color: var(--flavor-text);

    margin-bottom: 1rem;

}



.bpm-svcd-content__features {

    margin-top: 2.5rem;

}



.bpm-svcd-content__features h3 {

    font-size: 1.25rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin-bottom: 1.25rem;

}



.bpm-svcd-content__features-grid {

    display: flex;

    flex-direction: column;

    gap: 1rem;

}



.bpm-svcd-content__feature {

    display: flex;

    align-items: flex-start;

    gap: 1rem;

    padding: 1rem 1.25rem;

    background: var(--flavor-bg-warm);

    border-radius: var(--flavor-radius-sm);

    border-left: 3px solid var(--flavor-accent);

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-svcd-content__feature:hover {

    background: var(--flavor-bg-cool);

    transform: translateX(4px);

}



.bpm-svcd-content__feature > i {

    color: var(--flavor-accent);

    font-size: 1.1rem;

    margin-top: 0.15rem;

    flex-shrink: 0;

}



.bpm-svcd-content__feature strong {

    display: block;

    font-size: 0.95rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin-bottom: 0.2rem;

}



.bpm-svcd-content__feature span {

    font-size: 0.88rem;

    color: var(--flavor-text-muted);

    line-height: 1.5;

}



.bpm-svcd-content__sidebar {

    position: sticky;

    top: 100px;

}



.bpm-svcd-content__image-main {

    border-radius: var(--flavor-radius);

    overflow: hidden;

    margin-bottom: 1rem;

    box-shadow: var(--flavor-shadow-md);

}



.bpm-svcd-content__image-main img {

    width: 100%;

    height: 350px;

    object-fit: cover;

    display: block;

}



.bpm-svcd-content__image-row {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 1rem;

}



.bpm-svcd-content__image-thumb {

    border-radius: var(--flavor-radius-sm);

    overflow: hidden;

    box-shadow: var(--flavor-shadow-sm);

}



.bpm-svcd-content__image-thumb img {

    width: 100%;

    height: 150px;

    object-fit: cover;

    display: block;

    transition: transform var(--flavor-speed-slow) var(--flavor-ease);

}



.bpm-svcd-content__image-thumb:hover img {

    transform: scale(1.05);

}



@media (max-width: 900px) {

    .bpm-svcd-content__row { grid-template-columns: 1fr; gap: 2.5rem; }

    .bpm-svcd-content__sidebar { position: static; order: -1; }

}





/* ==========================================================================

   SD3: SERVICE DETAIL – PROCESS STEPS

   ========================================================================== */



.bpm-svcd-process {

    position: relative;

    padding: 80px 0;

    background: var(--flavor-bg-warm);

    overflow: hidden;

}



.bpm-svcd-process__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svcd-process__steps {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 1.5rem;

    margin-top: 3rem;

    position: relative;

}



.bpm-svcd-process__steps::before {

    content: '';

    position: absolute;

    top: 60px;

    left: 10%;

    right: 10%;

    height: 2px;

    background: linear-gradient(90deg, transparent, var(--flavor-accent), transparent);

    opacity: 0.3;

}



.bpm-svcd-process__step {

    background: var(--flavor-white);

    border-radius: var(--flavor-radius);

    padding: 2rem 1.5rem;

    text-align: center;

    position: relative;

    box-shadow: var(--flavor-shadow-sm);

    transition: all var(--flavor-speed-slow) var(--flavor-ease);

    border: 1px solid rgba(1, 36, 79, 0.06);

}



.bpm-svcd-process__step:hover {

    transform: translateY(-5px);

    box-shadow: var(--flavor-shadow-md);

    border-color: rgba(238, 99, 3, 0.15);

}



.bpm-svcd-process__step-number {

    font-size: 0.75rem;

    font-weight: 800;

    color: var(--flavor-accent);

    letter-spacing: 0.1em;

    margin-bottom: 1rem;

}



.bpm-svcd-process__step-icon {

    width: 56px;

    height: 56px;

    border-radius: 50%;

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-light) 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--flavor-white);

    font-size: 1.2rem;

    margin: 0 auto 1.25rem;

}



.bpm-svcd-process__step:hover .bpm-svcd-process__step-icon {

    background: linear-gradient(135deg, var(--flavor-accent) 0%, var(--flavor-accent-light) 100%);

}



.bpm-svcd-process__step-title {

    font-size: 1.05rem;

    font-weight: 700;

    color: var(--flavor-primary);

    margin-bottom: 0.6rem;

}



.bpm-svcd-process__step-desc {

    font-size: 0.88rem;

    color: var(--flavor-text-muted);

    line-height: 1.6;

}



@media (max-width: 900px) {

    .bpm-svcd-process__steps { grid-template-columns: repeat(2, 1fr); }

    .bpm-svcd-process__steps::before { display: none; }

}



@media (max-width: 480px) {

    .bpm-svcd-process__steps { grid-template-columns: 1fr; }

}





/* ==========================================================================

   SD4: SERVICE DETAIL – GALLERY

   ========================================================================== */



.bpm-svcd-gallery {

    position: relative;

    padding: 80px 0;

    background: var(--flavor-white);

    overflow: hidden;

}



.bpm-svcd-gallery__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svcd-gallery__grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 1rem;

    margin-top: 3rem;

}



.bpm-svcd-gallery__item {

    position: relative;

    border-radius: var(--flavor-radius);

    overflow: hidden;

    cursor: pointer;

    aspect-ratio: 4/3;

}



.bpm-svcd-gallery__item--large {

    grid-column: span 2;

    grid-row: span 2;

    aspect-ratio: auto;

}



.bpm-svcd-gallery__item img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition: transform var(--flavor-speed-slow) var(--flavor-ease);

}



.bpm-svcd-gallery__item:hover img {

    transform: scale(1.06);

}



.bpm-svcd-gallery__overlay {

    position: absolute;

    inset: 0;

    background: rgba(1, 36, 79, 0.4);

    display: flex;

    align-items: center;

    justify-content: center;

    opacity: 0;

    transition: opacity var(--flavor-speed) var(--flavor-ease);

}



.bpm-svcd-gallery__item:hover .bpm-svcd-gallery__overlay {

    opacity: 1;

}



.bpm-svcd-gallery__overlay i {

    color: var(--flavor-white);

    font-size: 1.5rem;

    width: 48px;

    height: 48px;

    border-radius: 50%;

    background: rgba(238, 99, 3, 0.8);

    display: flex;

    align-items: center;

    justify-content: center;

}



@media (max-width: 768px) {

    .bpm-svcd-gallery__grid { grid-template-columns: repeat(2, 1fr); }

    .bpm-svcd-gallery__item--large { grid-column: span 2; grid-row: span 1; aspect-ratio: 16/9; }

}



@media (max-width: 480px) {

    .bpm-svcd-gallery__grid { grid-template-columns: 1fr; }

    .bpm-svcd-gallery__item--large { grid-column: span 1; }

    .bpm-svcd-gallery__overlay { opacity: 1; }

}





/* ==========================================================================

   SD4b: SERVICE DETAIL – DOCUMENTS SECTION

   ========================================================================== */



.bpm-svcd-documents {

    position: relative;

    padding: 80px 0;

    background: var(--flavor-bg-cool);

    overflow: hidden;

}



.bpm-svcd-documents__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}





/* ==========================================================================

   SD5: SERVICE DETAIL – OTHER SERVICES NAVIGATION

   ========================================================================== */



.bpm-svcd-others {

    position: relative;

    padding: 80px 0;

    background: var(--flavor-bg-cool);

}



.bpm-svcd-others__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

}



.bpm-svcd-others__grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 0.75rem;

    margin-top: 3rem;

}



.bpm-svcd-others__item {

    display: flex;

    align-items: center;

    gap: 0.85rem;

    padding: 1rem 1.25rem;

    background: var(--flavor-white);

    border-radius: var(--flavor-radius-sm);

    text-decoration: none;

    color: var(--flavor-primary);

    font-size: 0.92rem;

    font-weight: 600;

    transition: all var(--flavor-speed) var(--flavor-ease);

    border: 1px solid rgba(1, 36, 79, 0.06);

    box-shadow: var(--flavor-shadow-sm);

}



.bpm-svcd-others__item:hover {

    background: var(--flavor-primary);

    color: var(--flavor-white);

    transform: translateY(-2px);

    box-shadow: var(--flavor-shadow-md);

}



.bpm-svcd-others__item > i:first-child {

    color: var(--flavor-accent);

    font-size: 1rem;

    width: 20px;

    text-align: center;

    flex-shrink: 0;

}



.bpm-svcd-others__item:hover > i:first-child {

    color: var(--flavor-accent-light);

}



.bpm-svcd-others__item span {

    flex: 1;

}



.bpm-svcd-others__arrow {

    font-size: 0.8rem;

    opacity: 0;

    transform: translateX(-8px);

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-svcd-others__item:hover .bpm-svcd-others__arrow {

    opacity: 1;

    transform: translateX(0);

}



.bpm-svcd-others__item--accent {

    border-color: var(--flavor-accent);

    background: linear-gradient(135deg, #fff8f0, var(--flavor-white));

    grid-column: span 3;

}



.bpm-svcd-others__item--accent:hover {

    background: linear-gradient(135deg, var(--flavor-accent), var(--flavor-accent-dark));

}



.bpm-svcd-others__star {

    color: var(--flavor-accent);

    font-size: 0.75rem;

}



.bpm-svcd-others__item:hover .bpm-svcd-others__star {

    color: var(--flavor-white);

}



@media (max-width: 768px) {

    .bpm-svcd-others__grid { grid-template-columns: repeat(2, 1fr); }

    .bpm-svcd-others__item--accent { grid-column: span 2; }

}



@media (max-width: 480px) {

    .bpm-svcd-others__grid { grid-template-columns: 1fr; }

    .bpm-svcd-others__item--accent { grid-column: span 1; }

    .bpm-svcd-others__arrow { opacity: 1; transform: translateX(0); }

}





/* ==========================================================================

   SD6: SERVICE DETAIL – CTA (Sub-page)

   ========================================================================== */



.bpm-svcd-cta {

    position: relative;

    padding: 60px 0;

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-dark) 100%);

    overflow: hidden;

}



.bpm-svcd-cta__inner {

    max-width: 800px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

}



.bpm-svcd-cta__content {

    text-align: center;

    color: var(--flavor-white);

}



.bpm-svcd-cta__title {

    font-size: clamp(1.4rem, 3vw, 1.8rem);

    font-weight: 800;

    color: var(--flavor-white);

    margin-bottom: 0.75rem;

}



.bpm-svcd-cta__desc {

    font-size: 1rem;

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

    margin-bottom: 1.5rem;

    line-height: 1.6;

}



.bpm-svcd-cta__actions {

    display: flex;

    justify-content: center;

    gap: 1rem;

    flex-wrap: wrap;

}



.bpm-svcd-cta__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    padding: 0.8rem 1.5rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.92rem;

    font-weight: 700;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

}



.bpm-svcd-cta__btn--primary {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-svcd-cta__btn--primary:hover {

    background: var(--flavor-accent-light);

    transform: translateY(-2px);

    box-shadow: 0 6px 24px rgba(238, 99, 3, 0.4);

}



.bpm-svcd-cta__btn--secondary {

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

    color: var(--flavor-white);

    border: 1px solid rgba(255, 255, 255, 0.25);

}



.bpm-svcd-cta__btn--secondary:hover {

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

    transform: translateY(-2px);

}



@media (max-width: 480px) {

    .bpm-svcd-cta__actions { flex-direction: column; align-items: center; }

}





/* ==========================================================================

   DL: KE STAŽENÍ – Standalone page (hero, content, cta)

   ========================================================================== */



/* DL1: Hero */

.bpm-dl-hero {

    position: relative;

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-dark) 100%);

    padding: 110px 0 70px;

    overflow: hidden;

    color: var(--flavor-white);

}



.bpm-dl-hero__overlay {

    position: absolute;

    inset: 0;

    background: radial-gradient(ellipse at 70% 50%, rgba(238, 99, 3, 0.15) 0%, transparent 60%);

    pointer-events: none;

}



.bpm-dl-hero__pattern {

    position: absolute;

    inset: 0;

    background-image:

        radial-gradient(circle, rgba(255,255,255,0.04) 1px, transparent 1px);

    background-size: 36px 36px;

    pointer-events: none;

}



.bpm-dl-hero__inner {

    max-width: 900px;

    margin: 0 auto;

    padding: 0 2rem;

    position: relative;

    z-index: 2;

    text-align: center;

}



.bpm-dl-hero__breadcrumb {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 0.5rem;

    font-size: 0.88rem;

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

    margin-bottom: 2.5rem;

}



.bpm-dl-hero__breadcrumb a {

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

    text-decoration: none;

    transition: color var(--flavor-speed) ease;

}



.bpm-dl-hero__breadcrumb a:hover { color: var(--flavor-white); }



.bpm-dl-hero__breadcrumb .current { color: var(--flavor-accent); }



.bpm-dl-hero__badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    background: rgba(238, 99, 3, 0.18);

    color: var(--flavor-accent-light);

    border: 1px solid rgba(238, 99, 3, 0.3);

    border-radius: var(--flavor-radius-pill);

    padding: 0.35rem 1rem;

    font-size: 0.82rem;

    font-weight: 700;

    letter-spacing: 0.06em;

    text-transform: uppercase;

    margin-bottom: 1.25rem;

}



.bpm-dl-hero__heading {

    font-size: clamp(2rem, 5vw, 3.25rem);

    font-weight: 800;

    line-height: 1.15;

    color: var(--flavor-white);

    margin: 0 0 1.25rem;

}



.bpm-dl-hero__heading span { color: var(--flavor-accent); }



.bpm-dl-hero__desc {

    font-size: 1.1rem;

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

    line-height: 1.7;

    max-width: 640px;

    margin: 0 auto 2.5rem;

}



.bpm-dl-hero__pills {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 0.6rem;

}



.bpm-dl-hero__pill {

    display: inline-flex;

    align-items: center;

    gap: 0.4rem;

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

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

    border: 1px solid rgba(255, 255, 255, 0.15);

    border-radius: var(--flavor-radius-pill);

    padding: 0.4rem 0.9rem;

    font-size: 0.85rem;

    font-weight: 600;

}



.bpm-dl-hero__pill i { color: var(--flavor-accent-light); font-size: 0.8em; }



/* DL2: Documents content */

.bpm-dl-content {

    background: var(--flavor-bg-cool);

    padding: 80px 0;

}



.bpm-dl-content__inner {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 2rem;

}



/* DL3: Bottom CTA */

.bpm-dl-cta {

    position: relative;

    background: linear-gradient(135deg, var(--flavor-primary) 0%, var(--flavor-primary-dark) 100%);

    padding: 80px 2rem;

    overflow: hidden;

    text-align: center;

    color: var(--flavor-white);

}



.bpm-dl-cta__inner {

    max-width: 700px;

    margin: 0 auto;

    position: relative;

    z-index: 2;

}



.bpm-dl-cta__icon {

    width: 64px;

    height: 64px;

    background: rgba(238, 99, 3, 0.2);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 1.6rem;

    color: var(--flavor-accent-light);

    margin: 0 auto 1.5rem;

}



.bpm-dl-cta__title {

    font-size: clamp(1.5rem, 3.5vw, 2.2rem);

    font-weight: 800;

    color: var(--flavor-white);

    margin: 0 0 0.75rem;

}



.bpm-dl-cta__desc {

    font-size: 1rem;

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

    line-height: 1.7;

    max-width: 540px;

    margin: 0 auto 2rem;

}



.bpm-dl-cta__actions {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 0.75rem;

}



.bpm-dl-cta__btn {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    padding: 0.85rem 1.75rem;

    border-radius: var(--flavor-radius-pill);

    font-size: 0.95rem;

    font-weight: 700;

    text-decoration: none;

    transition: all var(--flavor-speed) var(--flavor-ease);

    cursor: pointer;

    border: 2px solid transparent;

}



.bpm-dl-cta__btn--primary {

    background: var(--flavor-accent);

    color: var(--flavor-white);

    box-shadow: var(--flavor-shadow-accent);

}



.bpm-dl-cta__btn--primary:hover {

    background: var(--flavor-accent-light);

    transform: translateY(-2px);

    box-shadow: 0 6px 32px rgba(238, 99, 3, 0.45);

}



.bpm-dl-cta__btn--outline {

    background: transparent;

    color: var(--flavor-white);

    border-color: rgba(255, 255, 255, 0.3);

}



.bpm-dl-cta__btn--outline:hover {

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

    border-color: rgba(255, 255, 255, 0.55);

    transform: translateY(-2px);

}



.bpm-dl-cta__btn--ghost {

    background: transparent;

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

    border: 1px dashed rgba(255, 255, 255, 0.3);

    font-size: 0.88rem;

}



.bpm-dl-cta__btn--ghost:hover {

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

    border-color: rgba(255, 255, 255, 0.5);

    color: var(--flavor-white);

    transform: translateY(-2px);

}



@media (max-width: 640px) {

    .bpm-dl-hero__pills { gap: 0.4rem; }

    .bpm-dl-cta__actions { flex-direction: column; align-items: center; }

}