:root {--theme-color-primary: #009cde; --theme-color-primary-light: #59a3fc; --theme-color-text-dark: #333; --theme-color-text-muted: #888; --theme-color-text-disabled: #aaa; --theme-bg-muted: #f5f5f5; --theme-shadow-card: 0 4px 12px rgba(0, 0, 0, .12);}

body {color: var(--theme-color-text-dark); font: 14px/1.42857143 'Open Sans', sans-serif !important; background-color: #fff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: 'liga'; -webkit-text-size-adjust: 100%;}
a {color: var(--theme-color-primary); text-decoration: none;}
a:hover, a:focus {text-decoration: none;}
h1, h2, h3, h4, h5, h6 {margin-top: 20px; margin-bottom: 10px; font-family: inherit; font-weight: 500;}
h1 {font-size: 48px; line-height: 77px;}
h2 {font-size: 36px; line-height: 58px;}
h3 {font-size: 28px; line-height: 45px;}
h4 {font-size: 24px; line-height: 38px;}
h5 {font-size: 20px; line-height: 32px;}
h6 {font-size: 16px; line-height: 26px;}
p {margin: 0 0 10px; font-size: 14px; line-height: 22px;}

section {position: relative; isolation: isolate; padding: 60px 0; scroll-margin-top: 30px;}
.section-header {margin-bottom: 3rem; text-align: center;}
.section-header:last-child {margin-bottom: 0;}
.section-header h2 {margin: 0 0 10px; color: #444; font-weight: 700;}
.section-header p {margin: 0; color: var(--theme-color-text-muted); font-size: 16px; line-height: 26px;}

.icon {display: block; fill: currentColor;}
.icon-50 {width: 50px; height: 50px;}

.pix-gray {color: #999;}
.pix-blue {color: var(--theme-color-primary-light);}
.pix-purple {color: #9000f0;}
.pix-blue-neon {color: var(--theme-color-primary);}
.btn {padding: 12px 26px; border: 0; border-radius: 3px; font-size: 14px; line-height: 1.42857143; transition: opacity .15s ease-in-out;}
.btn:hover {opacity: .85;}

#siteHeader {padding-top: 30px;}
#siteHeader a {display: inline-block; padding: 10px 0;}
#siteHeader img {display: block; width: 161px; height: 146px;}

.pix-header-nav .nav-link {padding: 10px 15px; font-weight: bold; text-transform: uppercase; transition: background-color .2s ease-in-out;}
.pix-header-nav .nav-link.lang-switch {text-transform: none;}
.pix-header-nav .nav-link:hover {background-color: rgba(0, 0, 0, .03); border-radius: 3px;}
.pix-header-nav .nav-link:focus {background-color: transparent; border-radius: 3px;}

.accordion {--bs-accordion-color: inherit; --bs-accordion-bg: transparent; --bs-accordion-border-width: 0; --bs-accordion-border-radius: 0; --bs-accordion-inner-border-radius: 3px; --bs-accordion-btn-padding-x: 20px; --bs-accordion-btn-padding-y: 16px; --bs-accordion-btn-color: var(--theme-color-text-muted); --bs-accordion-btn-bg: var(--theme-bg-muted); --bs-accordion-btn-focus-box-shadow: none; --bs-accordion-active-color: var(--theme-color-text-muted); --bs-accordion-active-bg: var(--theme-bg-muted); --bs-accordion-body-padding-x: 15px; --bs-accordion-body-padding-y: 15px;}
.accordion-item + .accordion-item {margin-top: 5px;}
.accordion-header {margin: 0;}
.accordion-button {font-size: 16px; line-height: 24px; font-weight: 700;}
.accordion-collapse {display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .25s ease, visibility 0s linear .25s;}
.accordion-collapse.show {grid-template-rows: 1fr; visibility: visible; transition-delay: 0s;}
.accordion-body {min-height: 0; overflow: hidden; line-height: 24px; transition: padding-top .25s ease, padding-bottom .25s ease;}
.accordion-collapse:not(.show) > .accordion-body {padding-top: 0; padding-bottom: 0;}

.site-nav {--bs-navbar-toggler-border-color: transparent; background-color: #fff; box-shadow: 0 8px 16px rgba(0, 0, 0, .1);}
.site-nav .navbar-collapse {justify-content: center;}
.site-nav .navbar-toggler:focus {box-shadow: none;}
.site-nav-logo {display: block; flex: 0 0 auto;}
.site-nav-logo img, footer img {display: block; width: auto; height: 40px;}

footer {padding: 20px 0; border-top: 1px solid #f4f4f4;}
footer .copyright {color: var(--theme-color-text-muted); font-size: .875em; text-align: right;}

.cta {padding: 20px 0;}
.cta-content {display: flex; flex-direction: column; align-items: center; gap: 10px;}
.cta-text {margin: 0; font-size: 16px; line-height: 26px; text-align: center;}
.cta-text strong, .cta-text span {display: block;}
.cta-title {font-weight: 700;}
.cta-button {font-weight: 700;}
.cta-light {color: var(--theme-color-text-muted); background-color: var(--theme-bg-muted);}
.cta-light .cta-title {color: #000;}
.cta-light .cta-button {--bs-btn-color: #fff; --bs-btn-bg: var(--theme-color-primary); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--theme-color-primary); --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--theme-color-primary);}
.cta-primary {color: #fff; background-color: var(--theme-color-primary);}
.cta-primary .cta-button {--bs-btn-color: var(--theme-color-primary-light); --bs-btn-bg: #fff; --bs-btn-hover-color: var(--theme-color-primary-light); --bs-btn-hover-bg: #fff; --bs-btn-active-color: var(--theme-color-primary-light); --bs-btn-active-bg: #fff;}

@media screen and (min-width: 768px) {
    .site-nav {--bs-navbar-padding-y: 0; box-shadow: none;}
    .site-nav-logo {display: none;}
    .site-nav .nav-link {padding-top: 15px; padding-bottom: 15px;}
    .site-nav.is-sticky {padding-top: 10px; padding-bottom: 10px; box-shadow: 0 8px 16px rgba(0, 0, 0, .1);}
    .site-nav.is-sticky .site-nav-logo {display: block; margin-right: 20px;}
    .site-nav.is-sticky .navbar-collapse {flex-grow: 0; margin-left: auto;}
    .cta-content {flex-direction: row;}
    .cta-text {flex: 1; text-align: left;}
    .cta-text strong, .cta-text span {display: inline;}
    .cta-title {margin-right: 10px;}
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .site-nav .nav-link {padding-right: 5px; padding-left: 5px;}
    .site-nav.is-sticky .site-nav-logo {display: none;}
}

@media screen and (min-width: 1200px) {
    main .container {max-width: 960px;}
}

@media screen and (max-width: 767px) {
    .section-header {scroll-margin-top: 80px;}
    .site-nav .nav-link {text-align: center;}
    .site-nav-logo img {margin: 8px 0;}
    .site-nav .navbar-collapse {display: grid; position: absolute; top: 100%; left: 0; width: 100%; grid-template-rows: 0fr; overflow: hidden; visibility: hidden; background-color: #fff; transition: grid-template-rows .25s ease, visibility 0s linear .25s;}
    .site-nav .navbar-collapse.show {grid-template-rows: 1fr; visibility: visible; transition-delay: 0s;}
    .site-nav .navbar-collapse > .navbar-nav {min-height: 0; overflow: hidden; transition: margin-top .25s ease, margin-bottom .25s ease;}
    .site-nav .navbar-collapse:not(.show) > .navbar-nav {margin-top: 0 !important; margin-bottom: 0 !important;}
}

/* Page-specific styles */

section > .section-bg {position: absolute; z-index: -2; pointer-events: none;}
#sectionAbout {overflow: hidden; clip-path: inset(0);}
#sectionAbout::before {content: ''; position: absolute; z-index: -1; inset: 0; background-color: rgba(0, 156, 222, .7);}
#sectionAbout > .section-bg, #sectionMap > .section-bg {inset: 0; width: 100%; height: 100%; object-fit: cover;}
#sectionAbout > .section-bg {position: fixed;}
#sectionAbout header {display: grid; row-gap: 10px;}
#sectionAbout header > strong {display: block; color: #fff; font-size: 48px; line-height: 77px;}
#sectionAbout .about {margin-bottom: 1rem; color: #f2f6fa; font-size: 20px; line-height: 32px;}
#sectionAbout h1 {display: inline; margin: 0; font-size: inherit; line-height: inherit; font-weight: 700;}
#sectionAbout p {display: inline; margin: 0; font-size: 16px; line-height: 26px;}
#sectionServices > .section-bg {top: 0; left: 0; opacity: .8;}
#sectionFaq > .section-bg {top: 0; right: 0;}
#sectionMap {background-color: var(--theme-bg-muted);}
#sectionMap > .section-bg {opacity: .3;}
#sectionTariffs {padding: 60px 0 0;}
#sectionTariffs > .section-bg {inset: 0; width: 100%; height: 100%;}
#sectionContacts {padding: 60px 0 220px;}
#sectionContacts > .section-bg {bottom: 0; left: 50%; width: 360px; height: auto; transform: translateX(-50%);}
#sectionContacts .section-header p {color:inherit;}

.about-features {padding: 30px 0; background-color: var(--theme-bg-muted);}
.about-feature {display: flex; flex: 1; align-items: center; justify-content: center; margin: 20px 0;}
.about-feature-icon {display: inline-flex; flex: 0 0 94px; align-items: center; justify-content: center; width: 94px; height: 94px; border: 2px solid #ddd; border-radius: 50%;}
.about-feature h3 {min-width: 0; margin-top: 0; margin-bottom: 0; color: var(--theme-color-text-muted); font-size: 16px; line-height: 26px; font-weight: 700;}

.tariff-list {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 24px;}
.tariff-card, .tariffs-info {background-color: #fff; border-radius: 6px; box-shadow: var(--theme-shadow-card);}
.tariff-card {--card-padding: 20px; display: flex; flex: 1 1 100%; max-width: 300px; flex-direction: column; gap: 10px; padding: var(--card-padding) var(--card-padding) 30px; border: 1px solid var(--tariff-color); border-top: 5px solid var(--tariff-color);}
.tariff-card-customer {margin: 0; color: var(--tariff-color); font-weight: 700;}
.tariff-card-speed-label {margin: 0; color: var(--theme-color-text-muted);}
.tariff-card-speed h3 {margin: 0; color: var(--tariff-color); font-size: 24px; line-height: 38px; font-weight: 700;}
.tariff-card-price {margin: 0 calc(-1 * var(--card-padding)); padding: 5px var(--card-padding); color: #5cb85c; font-size: 18px; line-height: 26px; font-weight: 700; background-color: rgba(92, 184, 92, .08); border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
.tariff-card-features {margin: 0; padding: 0; color: var(--theme-color-text-muted); font-size: 16px; line-height: 26px; list-style: none;}
.tariff-card-action {margin-top: auto; padding-top: 30px; text-align: center;}
.tariff-card-button {min-width: 180px; --bs-btn-color: #fff; --bs-btn-bg: var(--tariff-color); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--tariff-color); --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--tariff-color); font-weight: 700;}

@media screen and (min-width: 768px) {
    .tariff-card {flex-basis: 280px;}
}

.tariffs-info {margin: 20px 0; padding: 20px 12px; border: 1px solid var(--theme-color-primary); border-bottom-width: 5px;}
.tariffs-info-list {display: grid; gap: 20px;}
.tariff-info {display: flex; gap: 10px;}
.tariff-info-icon {flex: 0 0 auto;}
.tariff-info h3 {margin: 0; font-size: 16px; line-height: 26px; font-weight: 700;}
.tariff-info-text {color: var(--theme-color-text-muted); font-size: 14px; line-height: 26px;}

#sectionMap .map-filters {display: grid; grid-template-columns: 100px minmax(0, auto); justify-content: center; gap: 2px 8px; margin-top: 16px; color: var(--theme-color-text-muted); font-size: 16px; line-height: 26px;}
#sectionMap .map-filter-label {align-self: center; color: #000; text-align: end;}
#sectionMap .map-filter-options {display: flex; flex-wrap: wrap; margin: 0; padding: 4px 8px; text-align: start; list-style: none;}
#sectionMap .map-filter-options li {margin-inline: 2px; padding: 0 5px; border-radius: 4px; cursor: pointer;}
#sectionMap .map-filter-options li.active {color: var(--theme-color-primary-light); background-color: #fff;}
#sectionMap .ab-map-letters {display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 8px; align-items: start; padding-bottom: 8px;}
#sectionMap .street-letter {margin: 0; color: var(--theme-color-text-disabled); font-size: 20px; line-height: 32px; text-align: center; opacity: .4;}
#sectionMap .street-letter.active {color: #1274e7; font-weight: 700; opacity: 1;}
#sectionMap .map-streets {min-width: 0;}
#sectionMap .ab-map-street {display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 12px; align-items: start; padding: 4px 0;}
#sectionMap .street-name {color: var(--theme-color-text-disabled); line-height: 22px; opacity: .4;}
#sectionMap .street-name.active {color: var(--theme-color-text-dark); font-weight: 700; opacity: 1;}
#sectionMap .map-houses {display: flex; flex-wrap: wrap; gap: 3px; min-width: 0;}
#sectionMap .map-houses span {padding: 0 5px; color: var(--theme-color-text-disabled); line-height: 22px; background: none; border-radius: 4px; opacity: .4;}
#sectionMap .map-houses span.active {color: var(--theme-color-text-dark); background-color: #fff; opacity: 1;}
#sectionMap .ab-map-street span.active.selected-type-ethernet {background-color: #ddeeff;}
#sectionMap .ab-map-street span.active.selected-type-pon {background-color: #ead4f9;}

#sectionServices table th:last-child, #sectionServices table td:last-child {width: 1%; text-align: right; white-space: nowrap;}
#sectionServices table .table-group-divider {border-top-color: #ddd;}
#sectionServices table > tbody > tr > td.service-name-nested {padding-left: 30px;}

@media screen and (min-width: 768px) {
    #sectionServices table > tbody > tr > td.service-name-nested {padding-left: 50px;}
}

@media screen and (max-width: 767px) {
    #sectionServices > .section-bg {width: 40%; height: auto;}
    #sectionFaq > .section-bg {width: 30%; height: auto;}
    .about-feature {justify-content: flex-start; margin: 12px 0;}
    .about-feature-icon {flex-basis: 64px; width: 64px; height: 64px;}
    .about-feature-icon .icon {width: 32px; height: 32px;}
    .tariff-info-icon .icon {width: 32px; height: 32px;}
    #sectionMap .ab-map-letters {grid-template-columns: 24px minmax(0, 1fr); gap: 8px;}
    #sectionMap .ab-map-street {grid-template-columns: 1fr; gap: 4px;}
}