/*
Theme Name: Optical Systems
Theme URI: https://themeforest.net/item/viserfix-tv-internet-provider-html-template/37650072
Author: Custom conversion
Description: Класическа WordPress тема за изграждане и поддръжка на оптична телекомуникационна инфраструктура, базирана на лицензирания HTML шаблон Viserfix.
Version: 1.3.2
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: viserfix-wp
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* WordPress-specific additions loaded after the original Viserfix stylesheet. */
.custom-logo-link {
    display: inline-flex;
}

.custom-logo {
    height: auto;
    max-width: 170px;
}

.optical-brand-logo {
    display: inline-flex;
    padding: 8px 0;
}

.optical-brand-logo img {
    display: block;
    height: auto;
    max-width: 210px;
    width: 100%;
}

.optical-brand-logo--footer {
    margin-bottom: 20px;
    padding: 0;
}

.optical-brand-logo--footer img {
    max-width: 230px;
}

.footer-custom-logo .custom-logo-link {
    margin-bottom: 1rem;
}

.home-two-header .navbar-brand.logo {
    flex: 0 0 auto;
}

.home-two-header .navbar-brand.logo img {
    height: auto !important;
    max-height: 64px;
    max-width: 160px;
    width: 160px;
}

.search-icon,
.bar-icon,
.icon-share {
    background: transparent;
    border: 0;
    color: inherit;
    padding: 0;
}

.toggle-search-box .viserfix-search-form {
    display: block;
}

.toggle-search-box .viserfix-search-form .form-control {
    min-height: auto;
}

.navbar-nav .current-menu-item > .nav-link,
.navbar-nav .current-menu-ancestor > .nav-link {
    color: #df0e0e;
}

.viserfix-content img,
.entry-content img {
    height: auto;
    max-width: 100%;
}

.entry-content > *:last-child {
    margin-bottom: 0;
}

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background: #fff;
    clip: auto !important;
    clip-path: none;
    color: #111;
    display: block;
    font-size: 14px;
    height: auto;
    left: 8px;
    padding: 12px 16px;
    top: 8px;
    width: auto;
    z-index: 100000;
}

.post-navigation,
.posts-navigation,
.pagination {
    margin-top: 2rem;
}

.nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: center;
}

.page-numbers {
    align-items: center;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    color: #222;
    display: inline-flex;
    min-height: 42px;
    padding: .5rem .85rem;
}

.page-numbers.current,
.page-numbers:hover {
    background: #ef3f3f;
    border-color: #ef3f3f;
    color: #fff;
}

.wp-caption,
.gallery-caption {
    max-width: 100%;
}

.wp-caption-text {
    color: #666;
    font-size: .9rem;
    margin-top: .5rem;
}

.alignleft {
    float: left;
    margin: 0 1.5rem 1rem 0;
}

.alignright {
    float: right;
    margin: 0 0 1rem 1.5rem;
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.sticky {
    position: relative;
}

.bypostauthor {
    position: relative;
}

.viserfix-search-empty {
    padding: 4rem 0;
    text-align: center;
}

.viserfix-search-form {
    display: flex;
    gap: .5rem;
    max-width: 680px;
}

.viserfix-search-form .form-control {
    min-height: 52px;
}

.viserfix-card-image img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.pricing-item .background-img img,
.services-item .background-img img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.viserfix-editor-notice {
    background: #fff7d6;
    border-left: 4px solid #dba617;
    margin: 1rem 0;
    padding: 1rem;
}

html {
    scroll-behavior: smooth;
}

.breadcumb {
    padding-top: 160px !important;
}

#about,
#services,
#capabilities,
#why-us,
#information,
.optical-service-card {
    scroll-margin-top: 100px;
}

.home-two-header .nav-menu .nav-link,
.home-two-banner .title,
.home-two-about .title,
.home-two-service .title,
.home-two-fun .title,
.optical-advantages .title,
.home-two-blog .title,
.footer-area .common-footer,
.footer-contact .title {
    font-family: "Roboto", sans-serif;
}

.home-two-header .nav-menu .nav-link {
    font-size: 18px;
    line-height: 1.3;
    margin-left: 7px;
    margin-right: 7px;
    text-transform: uppercase;
}

.home-two-header .nav-menu > .nav-item:first-child > .nav-link {
    text-align: center;
}

@media (min-width: 992px) {
    .home-two-header .nav-menu {
        column-gap: 10px;
        flex-wrap: nowrap;
    }

    .home-two-header .nav-menu > .nav-item {
        flex: 0 0 auto;
    }

    .home-two-header .nav-menu .nav-link {
        white-space: nowrap;
    }

    .home-two-header .nav-menu > .nav-item:first-child > .nav-link {
        max-width: none;
    }
}

.home-two-header .navbar-toggler.header-button {
    cursor: pointer;
    position: relative;
    z-index: 11;
}

.home-two-header .optical-menu-icon,
.home-two-header .optical-menu-icon::before,
.home-two-header .optical-menu-icon::after {
    background: #141414;
    display: block;
    height: 2px;
    transition: transform .2s ease, top .2s ease, background-color .2s ease;
    width: 26px;
}

.home-two-header .optical-menu-icon {
    position: relative;
}

.home-two-header .optical-menu-icon::before,
.home-two-header .optical-menu-icon::after {
    content: "";
    left: 0;
    position: absolute;
}

.home-two-header .optical-menu-icon::before {
    top: -7px;
}

.home-two-header .optical-menu-icon::after {
    top: 7px;
}

.home-two-header .navbar-toggler.header-button[aria-expanded="true"] .optical-menu-icon {
    background-color: transparent;
}

.home-two-header .navbar-toggler.header-button[aria-expanded="true"] .optical-menu-icon::before {
    top: 0;
    transform: rotate(45deg);
}

.home-two-header .navbar-toggler.header-button[aria-expanded="true"] .optical-menu-icon::after {
    top: 0;
    transform: rotate(-45deg);
}

.home-two-banner .banner-content {
    position: relative;
    z-index: 2;
}

.home-two-banner .banner-content .subtitle {
    color: #df0e0e;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .12em;
    margin-bottom: 18px;
}

.home-two-banner .banner-content .title {
    color: #fff;
    font-size: clamp(42px, 4.45vw, 64px);
    font-weight: 900;
    line-height: 1.08;
    max-width: 760px;
}

.home-two-banner .banner-right-image img {
    display: block;
    margin: 0 auto;
}

.optical-technologies {
    background: #fff;
    overflow: hidden;
}

.optical-brand-item {
    align-items: center;
    border: 1px solid #ececec;
    color: #222429;
    display: flex !important;
    font-family: "Roboto", sans-serif;
    font-size: 25px;
    font-weight: 900;
    height: 84px;
    justify-content: center;
    letter-spacing: .08em;
    margin: 0 10px;
    position: relative;
}

.optical-brand-item::after {
    background: #df0e0e;
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    transition: width .3s ease;
    width: 36px;
}

.optical-brand-item:hover::after {
    width: 100%;
}

.home-two-about .section-header.style-two {
    margin-bottom: 22px;
}

.home-two-about .section-header.style-two .title {
    font-size: clamp(36px, 4vw, 52px);
    font-weight: 900;
    line-height: 1.14;
}

.home-two-about .section-header .para {
    line-height: 1.75;
}

.optical-media-placeholder {
    align-items: center;
    background:
        radial-gradient(circle at 20% 20%, rgba(237, 28, 36, .32), transparent 28%),
        linear-gradient(145deg, #171a1f, #2a2f36);
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    min-height: 320px;
    overflow: hidden;
    padding: 40px;
    position: relative;
    text-align: center;
    width: 100%;
}

.optical-media-placeholder::before,
.optical-media-placeholder::after {
    border: 2px solid rgba(237, 28, 36, .35);
    border-radius: 50%;
    content: "";
    height: 74%;
    position: absolute;
    transform: rotate(24deg);
    width: 92%;
}

.optical-media-placeholder::after {
    height: 48%;
    transform: rotate(-31deg);
    width: 110%;
}

.optical-media-placeholder > * {
    position: relative;
    z-index: 1;
}

.optical-media-placeholder i {
    color: #ed1c24;
    font-size: 74px;
    margin-bottom: 26px;
}

.optical-media-placeholder strong {
    font-family: "Roboto", sans-serif;
    font-size: clamp(24px, 3vw, 39px);
    line-height: 1.2;
}

.optical-media-placeholder small {
    color: #d5d7da;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .15em;
    margin-top: 14px;
}

.home-two-about-thumb > span:first-child .optical-media-placeholder {
    aspect-ratio: 1;
    border-radius: 50%;
    min-height: 0;
}

.home-two-about-thumb > span:last-child .optical-media-placeholder {
    aspect-ratio: 1;
    background:
        radial-gradient(circle at 30% 25%, rgba(255, 255, 255, .28), transparent 28%),
        #ed1c24;
    border-radius: 50%;
    min-height: 0;
    padding: 20px;
}

.home-two-about-thumb > span:last-child .optical-media-placeholder i {
    color: #fff;
    font-size: 64px;
    margin: 0;
}

.optical-service-highlight {
    color: inherit;
    display: block;
    min-height: 100%;
}

.optical-service-highlight .contents .left {
    max-width: calc(100% - 58px);
}

.optical-service-highlight .contents .left .title,
.optical-service-highlight .contents .left .para {
    display: block;
}

.optical-service-highlight .contents .left .title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.22;
    margin-bottom: 8px;
}

.optical-service-highlight .contents .left .para {
    font-size: 15px;
    line-height: 1.45;
    margin-top: 0;
}

.optical-service-highlight .contents .left .icon-right-arrow {
    display: inline-block;
    font-size: 28px;
}

.optical-service-visual {
    align-items: center;
    aspect-ratio: 480 / 662;
    background:
        linear-gradient(125deg, transparent 46%, rgba(237, 28, 36, .75) 46%, rgba(237, 28, 36, .75) 47%, transparent 47%),
        linear-gradient(35deg, #191d22, #343a42);
    color: #ed1c24;
    display: flex;
    font-size: 94px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.optical-service-visual::before,
.optical-service-visual::after {
    border: 1px solid rgba(237, 28, 36, .4);
    border-radius: 50%;
    content: "";
    height: 52%;
    position: absolute;
    transform: rotate(36deg);
    width: 130%;
}

.optical-service-visual::after {
    height: 68%;
    transform: rotate(-24deg);
}

.optical-service-visual i,
.optical-service-visual b {
    position: relative;
    z-index: 1;
}

.optical-service-visual b {
    bottom: 30px;
    color: rgba(255, 255, 255, .12);
    font-family: "Roboto", sans-serif;
    font-size: 120px;
    font-weight: 900;
    position: absolute;
    right: 25px;
}

.home-two-service > .container {
    position: relative;
}

.home-two-service > .container::before {
    background: #f7f7f7;
    content: "";
    inset: 0 calc(50% - 50vw);
    position: absolute;
    z-index: -1;
}

.home-two-service .section-header .para {
    margin-left: auto;
    margin-right: auto;
    max-width: 900px;
}

.optical-service-card {
    background: #fff;
    border: 1px solid #ececec;
    box-shadow: 0 12px 38px rgba(20, 20, 20, .06);
    display: flex;
    gap: 24px;
    padding: 34px;
    position: relative;
    transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
}

.optical-service-card:hover {
    border-color: #df0e0e;
    box-shadow: 0 16px 42px rgba(20, 20, 20, .11);
    transform: translateY(-4px);
}

.optical-service-card__icon {
    align-items: center;
    background: #df0e0e;
    color: #fff;
    display: flex;
    flex: 0 0 62px;
    font-size: 29px;
    height: 62px;
    justify-content: center;
}

.optical-service-card__content {
    flex: 1 1 auto;
    min-width: 0;
}

.optical-service-card .title {
    font-size: 25px;
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: 18px;
}

.optical-check-list {
    display: grid;
    gap: 10px;
}

.optical-check-list li {
    align-items: flex-start;
    color: #555;
    display: flex;
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    gap: 10px;
    line-height: 1.55;
}

.optical-check-list i {
    color: #df0e0e;
    font-size: 12px;
    margin-top: 6px;
}

.optical-service-card .title a {
    color: inherit;
}

.optical-service-card .title a:hover {
    color: #df0e0e;
}

.optical-service-card__link {
    color: #df0e0e;
    display: inline-flex;
    font-family: "Roboto", sans-serif;
    font-size: 13px;
    font-weight: 800;
    gap: 8px;
    margin-top: 22px;
}

.optical-service-card__link:hover {
    color: #141414;
}

.optical-service-card__link i {
    font-size: 20px;
}

.home-two-fun .section-header .title {
    font-size: clamp(36px, 4vw, 50px);
    font-weight: 900;
    line-height: 1.15;
}

.home-two-fun .fun-fact-right .title {
    font-weight: 800;
}

.home-two-fun .fun-fact-right .title span {
    display: inline-block;
    margin-left: .35em;
}

.optical-capabilities-grid {
    display: grid;
    gap: 14px 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.optical-capabilities-grid li {
    align-items: flex-start;
    background: #f7f7f7;
    color: #222429;
    display: flex;
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    font-weight: 600;
    gap: 11px;
    line-height: 1.45;
    padding: 17px 20px;
}

.optical-capabilities-grid i {
    color: #df0e0e;
    font-size: 13px;
    margin-top: 5px;
}

.optical-network-visual {
    align-items: center;
    aspect-ratio: 472 / 683;
    background:
        radial-gradient(circle at center, #fff 0 22%, transparent 23%),
        repeating-radial-gradient(circle at center, transparent 0 42px, rgba(237, 28, 36, .12) 43px 44px),
        linear-gradient(145deg, #f2f3f5, #fff);
    display: flex;
    justify-content: center;
    margin: 0 auto;
    max-width: 472px;
    overflow: hidden;
    position: relative;
}

.optical-network-visual img {
    position: relative;
    width: 68%;
    z-index: 2;
}

.optical-network-visual__line {
    border: 2px solid rgba(237, 28, 36, .42);
    border-radius: 50%;
    height: 38%;
    position: absolute;
    transform: rotate(28deg);
    width: 120%;
}

.optical-network-visual__line--two {
    height: 54%;
    transform: rotate(-28deg);
}

.optical-network-visual__line--three {
    height: 72%;
    transform: rotate(68deg);
}

.optical-advantages .testimonial-left {
    align-items: center;
    display: flex;
}

.optical-advantages .testimonial-left > .row {
    width: 100%;
}

.optical-section-kicker {
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .12em;
    padding: 0 35px 26px;
}

.optical-slide-title {
    font-family: "Roboto", sans-serif;
    font-size: 28px;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 18px;
}

.optical-advantages .testi-content {
    min-height: 310px;
}

.optical-advantages .testimonial-right {
    display: flex;
    flex-direction: column;
}

.optical-advantages .testimonial-right .right-item {
    flex: 1 1 0;
}

.optical-why-visual {
    align-items: center;
    aspect-ratio: 506 / 525;
    background:
        linear-gradient(135deg, rgba(237, 28, 36, .14), transparent 55%),
        #171a1f;
    border: 1px solid rgba(237, 28, 36, .28);
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.optical-why-visual::before {
    border: 2px solid rgba(237, 28, 36, .36);
    border-radius: 50%;
    content: "";
    height: 80%;
    position: absolute;
    transform: rotate(35deg);
    width: 118%;
}

.optical-why-visual img {
    position: relative;
    width: 76%;
    z-index: 1;
}

.optical-why-visual i {
    bottom: 28px;
    color: #ed1c24;
    font-size: 62px;
    position: absolute;
    right: 28px;
    z-index: 2;
}

.home-two-blog-item .thumb img {
    aspect-ratio: 16 / 10;
}

.optical-information-visual {
    align-items: center;
    aspect-ratio: 16 / 10;
    background:
        radial-gradient(circle at 22% 20%, rgba(237, 28, 36, .35), transparent 26%),
        linear-gradient(145deg, #1b1f24, #333941);
    color: #ed1c24;
    display: flex;
    font-size: 72px;
    height: 100%;
    justify-content: center;
    min-height: 220px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.optical-information-visual::before,
.optical-information-visual::after {
    border: 1px solid rgba(237, 28, 36, .45);
    border-radius: 50%;
    content: "";
    height: 70%;
    position: absolute;
    transform: rotate(25deg);
    width: 110%;
}

.optical-information-visual::after {
    height: 46%;
    transform: rotate(-30deg);
}

.optical-information-visual i {
    position: relative;
    z-index: 1;
}

.services-item .background-img .optical-information-visual {
    aspect-ratio: auto;
    min-height: 100%;
}

.optical-team-visual {
    align-items: center;
    aspect-ratio: 520 / 600;
    background:
        radial-gradient(circle at center 34%, rgba(237, 28, 36, .2), transparent 25%),
        linear-gradient(145deg, #e9eaec, #fff);
    color: #ed1c24;
    display: flex;
    font-size: 112px;
    justify-content: center;
    width: 100%;
}

.optical-team-visual--single {
    min-height: 560px;
}

.optical-inner-banner {
    background-color: #20242a;
    background-image:
        radial-gradient(circle at 18% 28%, rgba(237, 28, 36, .3), transparent 24%),
        linear-gradient(120deg, #171a1f, #343a42);
    overflow: hidden;
    position: relative;
}

.optical-inner-banner::after {
    border: 2px solid rgba(237, 28, 36, .28);
    border-radius: 50%;
    content: "";
    height: 180%;
    position: absolute;
    right: -12%;
    top: -45%;
    transform: rotate(25deg);
    width: 62%;
}

.optical-inner-banner .container {
    position: relative;
    z-index: 2;
}

.optical-page-featured-image,
.optical-page-featured-placeholder {
    height: auto;
    min-height: 520px;
    object-fit: cover;
    width: 100%;
}

.optical-sidebar-default,
.optical-sidebar-widget {
    background: #f7f7f7;
    border-top: 4px solid #ed1c24;
    margin-bottom: 28px;
    padding: 28px;
}

.optical-sidebar-title {
    margin-bottom: 20px;
}

.optical-sidebar-default li {
    border-bottom: 1px solid #ddd;
}

.optical-sidebar-default li:last-child {
    border-bottom: 0;
}

.optical-sidebar-default a {
    color: #333;
    display: block;
    font-weight: 600;
    padding: 11px 0;
}

.optical-sidebar-default a:hover,
.optical-sidebar-default .current_page_item > a {
    color: #ed1c24;
}

.optical-pattern-section,
.optical-pattern-cta {
    margin-bottom: 70px;
    margin-top: 70px;
}

.optical-pattern-section {
    padding-bottom: 30px;
    padding-top: 30px;
}

.optical-pattern-kicker {
    color: #ed1c24;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .12em;
}

.optical-pattern-media-placeholder {
    align-items: center;
    aspect-ratio: 16 / 10;
    background:
        linear-gradient(135deg, transparent 48%, rgba(237, 28, 36, .3) 49% 50%, transparent 51%),
        #20242a;
    color: #fff;
    display: flex;
    justify-content: center;
    min-height: 260px;
    padding: 30px;
}

.optical-pattern-card {
    border: 1px solid #e8e8e8;
    border-top: 4px solid #ed1c24;
    box-shadow: 0 14px 35px rgba(20, 20, 20, .07);
    height: 100%;
    padding: 30px;
}

.optical-pattern-cta {
    background:
        radial-gradient(circle at 12% 18%, rgba(237, 28, 36, .38), transparent 24%),
        #20242a;
    color: #fff;
    padding: 65px 35px;
}

.optical-pattern-cta h2,
.optical-pattern-cta p {
    color: #fff;
}

.optical-pattern-cta .wp-block-button__link,
.entry-content .wp-block-button__link {
    background: #ed1c24;
    border-radius: 0;
    color: #fff;
    font-weight: 700;
}

.optical-pattern-cta .is-style-outline .wp-block-button__link {
    background: transparent;
    border-color: #fff;
}

.footer-area .footer-item .content a {
    color: inherit;
}

.footer-area .footer-item .content a:hover {
    color: #df0e0e;
}

.footer-area .footer-custom-logo img {
    max-height: 66px;
    width: auto;
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .home-two-header .nav-menu .nav-link {
        font-size: 18px;
        margin-left: 4px;
        margin-right: 4px;
    }
}

@media (max-width: 991.98px) {
    .home-two-header .navbar-brand.logo img {
        max-height: 52px;
        max-width: 150px;
        width: 150px;
    }

    .optical-brand-logo {
        padding: 4px 0;
    }

    .optical-brand-logo img {
        max-width: 164px;
    }

    .home-two-header .nav-menu > .nav-item:first-child > .nav-link {
        max-width: none;
        text-align: left;
    }

    .home-two-banner .banner-content {
        text-align: center;
    }

    .home-two-banner .banner-buttons {
        justify-content: center;
    }

    .home-two-banner .banner-content .title {
        margin-left: auto;
        margin-right: auto;
    }

    .optical-service-card {
        padding: 28px;
    }

    .optical-section-kicker {
        padding-left: 20px;
    }

    .optical-page-featured-image,
    .optical-page-featured-placeholder {
        min-height: 380px;
    }
}

@media (max-width: 575.98px) {
    .home-two-header .navbar-brand.logo img {
        max-width: 120px;
        width: 120px;
    }
}

@media (max-width: 575.98px) {
    .home-two-banner .banner-content .subtitle {
        font-size: 14px;
    }

    .home-two-banner .banner-content .title {
        font-size: 36px;
    }

    .optical-service-card {
        display: block;
        padding: 24px 20px;
    }

    .optical-service-card__icon {
        margin-bottom: 20px;
    }

    .optical-capabilities-grid {
        grid-template-columns: 1fr;
    }

    .optical-media-placeholder {
        padding: 24px;
    }

    .optical-service-visual {
        aspect-ratio: 4 / 3;
    }

    .optical-page-featured-image,
    .optical-page-featured-placeholder {
        min-height: 300px;
    }

    .optical-service-card .title {
        font-size: 22px;
    }

    .optical-section-kicker {
        padding-left: 5px;
    }

    .optical-advantages .testi-content {
        min-height: 340px;
    }
}

@media (min-width: 783px) {
    /* Keep the absolute initial header below the WordPress admin bar too. */
    .admin-bar .home-two-header {
        top: 32px;
    }
}

@media (max-width: 782px) {
    .admin-bar .home-two-header.fixed-header {
        top: 46px;
    }
}
