/* Extensions of the existing Gilroy, #020414 / #FA144B design system. */
.header-primary__nav .services-menu { position: relative; display: flex; align-items: center; gap: 8px; }
.services-menu-toggle { display: flex; align-items: center; justify-content: center; line-height: 1; background: transparent; border: 0; color: #fff; font: inherit; font-size: 20px; cursor: pointer; padding: 4px 10px; min-width: 44px; min-height: 44px; }
.header-primary__nav .services-submenu { position: absolute; z-index: 2; top: 100%; left: 0; width: 330px; padding: 16px; background: #020414; border: 1px solid #333543; box-shadow: 0 16px 32px #0003; display: block; }
.header-primary__nav .services-submenu[hidden] { display: none; }
.header-primary__nav .services-submenu > li { display: block; position: static; width: auto; margin: 0; }
.header-primary__nav .services-submenu > li > a { display: block; padding: 12px; font-size: 16px; line-height: 1.5; }
.header-primary__nav .services-submenu > li > a:after { content: none; }
.services-menu a[aria-current] { color: #fff; }
.services-menu a:focus-visible, .services-menu-toggle:focus-visible, .services-page a:focus-visible, .service-faq summary:focus-visible { outline: 3px solid #FA144B; outline-offset: 5px; }
.services-page, .services-page main { background: #fff; color: #020414; }
.service-hero { padding: 190px 0 90px; background: #020414; color: #fff; overflow: hidden; }
.service-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 0 0 55px; padding: 0; list-style: none; }
.service-breadcrumbs li { font-size: 14px; line-height: 1.6; }
.service-breadcrumbs li + li:before { content: '/'; color: #a1a3ab; margin-right: 14px; }
.service-breadcrumbs a { color: #bfc0c6; }
.service-breadcrumbs a:hover { color: #fff; }
.service-eyebrow { color: #FA144B; font-size: 16px; font-weight: 600; margin-bottom: 24px; }
.service-hero h1 { font-size: clamp(36px, 4.5vw, 64px); line-height: 1.12; letter-spacing: -1px; margin-bottom: 32px; color: #fff; }
.service-lead { font-size: clamp(18px, 2vw, 24px); line-height: 1.65; max-width: 960px; }
.service-hero .service-lead { color: #d1d2d7; margin-bottom: 36px; }
.services-page .btn-primary { white-space: normal; max-width: 100%; line-height: 1.45; text-align: center; }
.service-section { padding: 90px 0; }
.service-section h2 { font-size: clamp(30px, 3.5vw, 48px); line-height: 1.2; margin-bottom: 48px; }
.service-section h3 { font-size: clamp(23px, 2.5vw, 30px); line-height: 1.3; margin-bottom: 20px; }
.service-section p, .service-list li { font-size: 18px; line-height: 1.8; }
.service-muted { background: #f8f9fa; }
.service-light { background: #fff; color: #020414; }
.service-light h2, .service-light h3, .service-light .service-description { color: #020414; }
.service-grid, .services-container.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 64px; padding: 0; width: 100%; }
.service-section .service-card { animation: none; transform: none; }
.service-number { display: block; color: #FA144B; font-size: 16px; font-weight: 700; margin-bottom: 22px; }
.service-text-link { color: #d00c3c; font-size: 18px; font-weight: 600; text-decoration: underline; text-underline-offset: 5px; line-height: 1.6; }
.service-text-link:hover { color: #FA144B; }
.service-card .service-text-link { margin-top: auto; }
.service-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px 60px; }
.service-list li { margin: 0; }
.service-steps, .service-workflow { margin: 0; padding: 0; list-style: none; }
.service-steps, .service-workflow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
.service-steps li, .service-workflow li { border-top: 2px solid #e4e4e4; padding-top: 24px; }
.service-workflow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.service-workflow li:not(:last-child) p:after { content: ' →'; color: #FA144B; }
.service-faq { border-bottom: 1px solid #dedee3; padding: 24px 0; }
.service-faq summary { font-size: 22px; font-weight: 600; line-height: 1.5; cursor: pointer; list-style: disclosure-closed; }
.service-faq[open] summary { list-style: disclosure-open; }
.service-faq p { margin-top: 20px; max-width: 900px; }
.service-related { display: flex; flex-wrap: wrap; gap: 24px 40px; }
.service-article-links { margin-top: 64px; padding: 32px; border-left: 4px solid #FA144B; background: #f8f9fa; }
#article-content .service-article-links h2 { margin: 0; font-size: 28px; }
#article-content .service-article-links p { margin: 24px 0; }
.services-page #kontakt { scroll-margin-top: 90px; }
@media (min-width: 992px) {
    .header-primary__nav .services-menu { padding-right: 18px; }
    .services-menu-toggle { position: absolute; right: -7px; top: 50%; transform: translateY(-50%); width: 24px; min-width: 24px; padding: 4px 0; }
}
@media (max-width: 991.98px) {
    .header-primary__nav .services-menu { flex-wrap: wrap; gap: 0; }
    .header-primary__nav .services-submenu { position: static; width: 100%; margin: 0 24px; box-shadow: none; }
    .header-primary__nav .services-submenu > li:nth-child(4) { position: static; width: 100%; margin: 0; }
    .header-primary__nav > nav > ul > li:nth-child(4) { position: static; width: 100%; margin: 0; order: 0; }
    .service-hero { padding: 130px 0 60px; }
    .service-section { padding: 65px 0; }
    .service-steps, .service-workflow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .service-breadcrumbs ol { margin-bottom: 32px; }
    .service-grid, .services-container.service-grid, .service-list { grid-template-columns: 1fr; gap: 36px; }
    .service-section h2 { margin-bottom: 32px; }
    .service-steps, .service-workflow { grid-template-columns: 1fr; gap: 20px; }
    .service-hero .btn-primary { padding: 18px 24px; }
    .service-faq summary { font-size: 19px; }
}

.header-primary button.hamburger { background: transparent; border: 0; padding: 0; cursor: pointer; }
.header-primary button.hamburger:focus-visible { outline: 3px solid #FA144B; outline-offset: 6px; }

.service-faq summary { position: relative; padding-right: 32px; }
.service-faq summary::after { content: "+"; position: absolute; right: 0; top: 0; color: #d00c3c; }
.service-faq[open] summary::after { content: "−"; }