/********** Template CSS **********/:root {    --primary: #FD5D14;    --secondary: #FDBE33;    --light: #F4F6F8;    --dark: #040F28;}.pt-6 {    padding-top: 90px;}.pb-6 {    padding-bottom: 90px;}.py-6 {    padding-top: 90px;    padding-bottom: 90px;}.btn {    position: relative;    font-weight: 600;    text-transform: uppercase;    transition: .5s;}.btn::after {    position: absolute;    content: "";    width: 0;    height: 5px;    bottom: -1px;    left: 50%;    background: var(--primary);    transition: .5s;}.btn.btn-primary::after {    background: var(--dark);}.btn:hover::after,.btn.active::after {    width: 50%;    left: 25%;}.btn-primary {    color: #FFFFFF;}.btn-square {    width: 36px;    height: 36px;}.btn-sm-square {    width: 28px;    height: 28px;}.btn-lg-square {    width: 46px;    height: 46px;}.btn-square,.btn-sm-square,.btn-lg-square {    padding-left: 0;    padding-right: 0;    text-align: center;}.back-to-top {    position: fixed;    display: none;    left: 50%;    bottom: 0;    margin-left: -22px;    border-radius: 0;    z-index: 99;}.bg-dark-radial {    background-image: -webkit-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) 1px, transparent 1px, transparent 100%);    background-image: -moz-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) 1px, transparent 1px, transparent 100%);    background-image: -ms-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) 1px, transparent 1px, transparent 100%);    background-image: -o-repeating-radial-gradient(center center, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) 1px, transparent 1px, transparent 100%);    background-image: repeating-radial-gradient(center center, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) 1px, transparent 1px, transparent 100%);    background-size: 3px 3px;}.bg-light-radial {    background-image: -webkit-repeating-radial-gradient(center center, rgba(256, 256, 256, 0.2), rgba(256, 256, 256, 0.2) 1px, transparent 1px, transparent 100%);    background-image: -moz-repeating-radial-gradient(center center, rgba(256, 256, 256, 0.2), rgba(256, 256, 256, 0.2) 1px, transparent 1px, transparent 100%);    background-image: -ms-repeating-radial-gradient(center center, rgba(256, 256, 256, 0.2), rgba(256, 256, 256, 0.2) 1px, transparent 1px, transparent 100%);    background-image: -o-repeating-radial-gradient(center center, rgba(256, 256, 256, 0.2), rgba(256, 256, 256, 0.2) 1px, transparent 1px, transparent 100%);    background-image: repeating-radial-gradient(center center, rgba(256, 256, 256, 0.2), rgba(256, 256, 256, 0.2) 1px, transparent 1px, transparent 100%);    background-size: 3px 3px;}.navbar-dark .navbar-nav .nav-link {    position: relative;    padding: 35px 15px;    font-size: 18px;    text-transform: uppercase;    color: var(--light);    outline: none;    transition: .5s;}.navbar-dark .navbar-nav .nav-link:hover,.navbar-dark .navbar-nav .nav-link.active {    color: var(--primary);}@media (max-width: 991.98px) {    .navbar-dark .navbar-nav .nav-link  {        margin-left: 0;        padding: 10px 0;    }}.carousel-caption {    top: 0;    left: 0;    right: 0;    bottom: 0;    background: rgba(4, 15, 40, .7);    z-index: 1;}@media (max-width: 576px) {    .carousel-caption h4 {        font-size: 18px;        font-weight: 500 !important;    }    .carousel-caption h1 {        font-size: 30px;        font-weight: 600 !important;    }}.page-header {    min-height: 300px;    position: relative;    overflow: hidden;    display: flex;    align-items: center;    justify-content: center;    text-align: center;    padding: 2rem 1rem;} .page-header__media {    position: absolute;    inset: 0;    z-index: 0;} .page-header__media img {    width: 100%;    height: 100%;    object-fit: cover;} .page-header__overlay {    position: absolute;    inset: 0;    background: linear-gradient(rgba(4, 15, 40, 0.7), rgba(4, 15, 40, 0.7));    z-index: 0;} .page-header__content {    position: relative;    z-index: 1;    display: flex;    flex-direction: column;    align-items: center;    gap: 0.75rem;}.service-item .service-icon {    margin-top: -50px;    width: 100px;    height: 100px;    display: flex;    align-items: center;    justify-content: center;    border-radius: 100px;}.service-item .service-icon i {    transition: .2s;}.service-item:hover .service-icon i {    font-size: 60px;}.portfolio-item {    margin-bottom: 60px;}.portfolio-title {    position: absolute;    display: flex;    flex-direction: column;    justify-content: center;    height: 120px;    padding: 0 30px;    right: 30px;    left: 30px;    bottom: -60px;    background: #FFFFFF;    z-index: 3;}.portfolio-btn {    position: absolute;    display: inline-block;    top: 50%;    left: 50%;    margin-top: -60px;    margin-left: -60px;    font-size: 120px;    line-height: 0;    transition: .1s;    transition-delay: .3s;    z-index: 2;    opacity: 0;}.portfolio-item:hover .portfolio-btn {    opacity: 1;}.portfolio-box::before,.portfolio-box::after {    position: absolute;    content: "";    width: 0;    height: 100%;    top: 0;    transition: .5s;    z-index: 1;    background: rgba(4, 15, 40, .7);}.portfolio-box::before {    left: 0;}.portfolio-box::after {    right: 0;}.portfolio-item:hover .portfolio-box::before {    left: 0;    width: 50%;}.portfolio-item:hover .portfolio-box::after {    right: 0;    width: 50%;}@media (min-width: 992px) {    .testimonial,    .contact-form {        margin-left: -90px;    }}@media (min-width: 992px) {    .footer::after {        position: absolute;        content: "";        width: 1px;        height: 100%;        top: 0;        left: 50%;        background: var(--primary)    }}.footer-shape::before {    position: absolute;    content: "";    width: 80px;    height: 100%;    top: 0;    left: -40px;    background: var(--primary);    transform: skew(40deg);}/* GrapesJS + modern carousel overrides */
.portfolio-item.is-hidden { display: none !important; }
.portfolio-box::before,
.portfolio-box::after,
.portfolio-card::before,
.portfolio-card::after { pointer-events: none; }
body.gjs-dashed .portfolio-box::before,
body.gjs-dashed .portfolio-box::after,
body.gjs-dashed .portfolio-btn,
body.gjs-dashed .portfolio-title { pointer-events: none; z-index: 0; }
body.gjs-dashed .portfolio-box img { position: relative; z-index: 1; }
.portfolio-showcase .portfolio-filter { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.75rem; }
.portfolio-showcase .filter-pill { border: 1px solid rgba(4, 15, 40, 0.2); background: #fff; color: #040F28; text-transform: uppercase; font-weight: 600; letter-spacing: 0.04em; padding: 0.65rem 1.75rem; border-radius: 999px; transition: all .2s ease; }
.portfolio-showcase .filter-pill.active,
.portfolio-showcase .filter-pill:focus-visible { background: var(--primary); border-color: var(--primary); color: #fff; outline: none; box-shadow: 0 0 0 3px rgba(253, 93, 20, 0.25); }
.portfolio-card { background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 20px 45px rgba(4, 15, 40, 0.08); display: flex; flex-direction: column; height: 100%; }
.portfolio-media { margin: 0; }
.portfolio-media img { width: 100%; display: block; object-fit: cover; }
.portfolio-card-body { padding: 1.75rem; display: flex; flex-direction: column; gap: 0.5rem; height: 100%; }
.portfolio-card-text { color: #6C757D; margin-bottom: 0; }
.portfolio-meta { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; font-weight: 600; }
.portfolio-meta span { color: #040F28; font-size: 0.95rem; }
.portfolio-card .btn-link { font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
@media (max-width: 576px) {
  .portfolio-card-body { padding: 1.25rem; }
  .portfolio-showcase .filter-pill { width: 100%; text-align: center; }
}
.carousel-scroll { position: relative; width: 100%; }
.carousel-scroll .carousel-track { display: flex; gap: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: 1rem 0.5rem; scroll-behavior: smooth; }
.carousel-scroll .carousel-track::-webkit-scrollbar { height: 8px; }
.carousel-scroll .carousel-track::-webkit-scrollbar-thumb { background: rgba(4, 15, 40, 0.45); border-radius: 4px; }
.carousel-scroll .carousel-track > * { flex: 0 0 calc(33.333% - 1rem); scroll-snap-align: start; }
@media (max-width: 992px) { .carousel-scroll .carousel-track > * { flex-basis: calc(50% - 1rem); } }
@media (max-width: 600px) { .carousel-scroll .carousel-track > * { flex-basis: 100%; } }
.testimonial-carousel .carousel-track > * { flex-basis: 100% !important; }
.carousel-scroll .carousel-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(4, 15, 40, 0.9); color: #fff; border: none; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; z-index: 5; }
.carousel-scroll .carousel-nav.prev { left: 0; }
.carousel-scroll .carousel-nav.next { right: 0; }
.carousel-scroll .carousel-nav:focus-visible { outline: 3px solid #fd5d14; outline-offset: 2px; }
.carousel-scroll .carousel-track { pointer-events: auto; }
.back-to-top.is-visible { display: inline-flex; }



.hero-banner { position: relative; min-height: 500px; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-overlay { position: absolute; inset: 0; background: rgba(4, 15, 40, 0.7); }
.hero-caption { position: absolute; inset: 0; z-index: 1; }