/* Local readability and responsive refinements for the AI agency demo. */
:root { --conen-blue: #1764ad; }
header:not(.header-appear) .navbar-top-default { background-color: rgba(10, 13, 44, .94); }
.text-blue { color: var(--conen-blue); }
.btn.btn-white:hover, .btn.btn-darkblue:hover {
    background: var(--conen-blue) !important;
    border-color: var(--conen-blue);
    color: #fff !important;
}
.btn.btn-blue {
    background: var(--conen-blue);
    border-color: var(--conen-blue);
    color: #fff;
}
.btn.btn-blue:hover, .btn.btn-blue:focus-visible {
    background: #174778 !important;
    border-color: #174778;
}
.portfolio-sec .cbp-l-filters-button .cbp-filter-item.cbp-filter-item-active {
    color: var(--conen-blue);
    border-bottom-color: var(--conen-blue);
}
.portfolio-sec .cbp-l-grid-mosaic .cbp-caption-activeWrap {
    background: linear-gradient(0deg, rgba(10, 25, 53, .94), rgba(15, 49, 89, .65));
}
.portfolio-sec .portfolio-hover-effect .hover-text { padding: 24px; }
.portfolio-sec .portfolio-hover-effect .hover-text .p-hover-des { font-size: 15px; }
.btn { white-space: normal; }
a:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 3px solid #87c8ff;
    outline-offset: 5px;
}
.banner-image {
    background-image: linear-gradient(90deg, rgba(8, 14, 38, .55), rgba(8, 14, 38, .42) 42%, rgba(8, 14, 38, .04) 72%), url('../images/banner-image.jpg');
    background-color: #0a0d2c;
    min-height: 700px;
    height: 100vh;
    display: flex;
    align-items: center;
}
.banner-area { padding-top: 55px; }
.banner-heading { font-size: clamp(34px, 3.3vw, 52px); line-height: 1.18; }
.banner-des { font-size: 18px; line-height: 1.7; width: 90%; }
.feature-image {
    background-image: linear-gradient(90deg, rgba(9, 18, 38, .02), rgba(9, 18, 38, .48) 48%, rgba(9, 18, 38, .55)), url('../images/feature-image.jpg');
}
.feature-heading { line-height: 1.3; }
.feature-area, .testimonial-area, .testimonial-box { text-shadow: 0 1px 3px rgba(0,0,0,.25); }
.quote-des { color: #fff; opacity: 1; }
.testimonial-img {
    background-image: linear-gradient(0deg, rgba(8, 18, 38, .3), rgba(8, 18, 38, .65) 25%, rgba(8, 18, 38, .65) 75%, rgba(8, 18, 38, .12)), url('../images/testimonial-img.jpg');
    height: auto;
    min-height: 680px;
    padding: 90px 0;
}
.testimonial-area { padding-left: 25px; padding-top: 60px; }
.testimonial-sec .testimonial-box .item { padding-top: 60px; }
.contact-sec {
    background-image: linear-gradient(90deg, rgba(8, 18, 38, .48), rgba(8, 18, 38, .4) 75%, rgba(8, 18, 38, .2)), url('../images/contact-bg.jpg');
    height: auto;
    min-height: 800px;
    padding-bottom: 32px;
}
.contact-sec .contact-form .form-control {
    border-bottom-color: #a2acbc;
    background: rgba(8, 18, 38, .2);
    padding-left: 12px;
}
.contact-sec .contact-form .form-control::placeholder { opacity: 1; }
.contact-sec .contact-form .form-control:focus { border-bottom-color: #9ed3ff; }
.contact-sec > .container > .row:last-child { padding-top: 32px; }
.about-image {
    width: 30%;
    max-width: none;
    left: 35%;
    right: auto;
    transform: translateY(-50%);
}
.about-image img { width: 100%; }
.about-sec .cover .card-text { line-height: 1.7; }
.about-sec .cover:hover .card-title { color: #8dc9ff; }
.blog-des { line-height: 1.7; }
.blog-sec > .container > .row { padding-top: 20px; padding-bottom: 20px; }
@media (max-width: 991px) {
    .banner-image {
        display: block;
        min-height: 0;
        height: auto;
        background-image: url('../images/banner-image.jpg');
        background-size: 100% auto;
        background-position: top center;
        background-repeat: no-repeat;
        padding: 56.25vw 0 64px;
    }
    .banner-area { padding-top: 40px; text-align: center; }
    .banner-des { width: auto; max-width: 520px; margin: 0 auto; }
    .about-image { position: relative; left: auto; top: auto; transform: none; width: min(70%, 360px); margin: 32px auto; }
    .about-sec .row.padding-bottom { padding-bottom: 0; }
    .about-sec .row.padding-top { padding-top: 0; }
    .about-sec .cover { padding: 24px 16px; }
    .testimonial-area { padding: 0; text-align: center; }
    .testimonial-sec .testimonial-box .item { padding-top: 45px; }
    .testimonial-img { min-height: 0; padding: 72px 0; }
    .portfolio-sec .btn-darkblue { padding: 14px 18px; overflow-wrap: normal; }
}
@media (max-width: 767px) {
    .banner-heading { font-size: 32px; }
    .banner-des { font-size: 17px; padding: 24px 4px 30px; }
    .feature-image {
        background-image: linear-gradient(0deg, rgba(9, 18, 38, .7), rgba(9, 18, 38, .53) 70%, rgba(9, 18, 38, .18)), url('../images/feature-image.jpg');
        background-position: 62% center;
    }
    .feature-area { padding: 36px 10px 0; }
    .feature-heading { font-size: 25px; line-height: 1.4; }
    .testimonial-img {
        background-image: linear-gradient(0deg, rgba(8, 18, 38, .68), rgba(8, 18, 38, .58)), url('../images/testimonial-img.jpg');
    }
    .contact-sec {
        background-image: linear-gradient(0deg, rgba(8, 18, 38, .67), rgba(8, 18, 38, .48)), url('../images/contact-bg.jpg');
    }
    .contact-sec .contact-details ul { padding-left: 0; }
    .contact-sec .contact-form { margin-top: 30px; }
    .portfolio-sec .portfolio-heading, .blog-heading { font-size: 34px; line-height: 1.25; }
    .portfolio-sec .cbp-l-filters-button .cbp-filter-item { margin: 0 8px 14px; }
}
