:root {
--default-font: "Roboto",  system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--heading-font: "Montserrat",  sans-serif;
--nav-font: "Raleway",  sans-serif;
} :root { 
--background-color: #ffffff; --default-color: #2b180d; --heading-color: #1b2f45; --accent-color: #56b8e6; --surface-color: #ffffff; --contrast-color: #ffffff; } :root {
--nav-color: rgba(255, 255, 255, 0.6); --nav-hover-color: #ffffff; --nav-mobile-background-color: #ffffff; --nav-dropdown-background-color: #ffffff; --nav-dropdown-color: #212529; --nav-dropdown-hover-color: #56b8e6; } .light-background {
--background-color: #f6fcfe;
--surface-color: #ffffff;
}
.dark-background {
--background-color: #17283b;
--default-color: #ffffff;
--heading-color: #ffffff;
--surface-color: #254160;
--contrast-color: #ffffff;
} :root {
scroll-behavior: smooth;
} body {
color: var(--default-color);
background-color: var(--background-color);
font-family: var(--default-font);
}
a {
color: var(--accent-color);
text-decoration: none;
transition: 0.3s;
}
a:hover {
color: color-mix(in srgb, var(--accent-color), transparent 25%);
text-decoration: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: var(--heading-color);
font-family: var(--heading-font);
} .php-email-form .error-message {
display: none;
background: #df1529;
color: #ffffff;
text-align: left;
padding: 15px;
margin-bottom: 24px;
font-weight: 600;
}
.php-email-form .sent-message {
display: none;
color: #ffffff;
background: #059652;
text-align: center;
padding: 15px;
margin-bottom: 24px;
font-weight: 600;
}
.php-email-form .loading {
display: none;
background: var(--surface-color);
text-align: center;
padding: 15px;
margin-bottom: 24px;
}
.php-email-form .loading:before {
content: "";
display: inline-block;
border-radius: 50%;
width: 24px;
height: 24px;
margin: 0 10px -6px 0;
border: 3px solid var(--accent-color);
border-top-color: var(--surface-color);
animation: php-email-form-loading 1s linear infinite;
}
@keyframes php-email-form-loading {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
} .header {
--background-color: rgba(255, 255, 255, 0);
--heading-color: #ffffff;
color: var(--default-color);
background-color: var(--background-color);
padding: 15px 0;
transition: all 0.5s;
z-index: 997;
}
.header .logo {
line-height: 1;
}
.header-logo {
max-height: 40px !important; 
width: auto !important;
}
.header .logo img {
max-height: 32px;
margin-right: 8px;
}
.header .logo h1 {
font-size: 30px;
margin: 0;
font-weight: 700;
color: var(--heading-color);
}
.scrolled .header {
box-shadow: 0px 0 18px rgba(0, 0, 0, 0.1);
} .scrolled .header {
--background-color: rgba(23, 40, 59, 0.9);
}  @media (min-width: 1200px) {
.navmenu {
padding: 0;
}
.navmenu ul {
margin: 0;
padding: 0;
display: flex;
list-style: none;
align-items: center;
}
.navmenu li {
position: relative;
}
.navmenu a,
.navmenu a:focus {
color: var(--nav-color);
padding: 18px 15px;
font-size: 16px;
font-family: var(--nav-font);
font-weight: 400;
display: flex;
align-items: center;
justify-content: space-between;
white-space: nowrap;
transition: 0.3s;
}
.navmenu a i,
.navmenu a:focus i {
font-size: 12px;
line-height: 0;
margin-left: 5px;
transition: 0.3s;
}
.navmenu li:last-child a {
padding-right: 0;
}
.navmenu li:hover>a,
.navmenu .active,
.navmenu .active:focus {
color: var(--nav-hover-color);
}
.navmenu .dropdown ul {
margin: 0;
padding: 10px 0;
background: var(--nav-dropdown-background-color);
display: block;
position: absolute;
visibility: hidden;
left: 14px;
top: 130%;
opacity: 0;
transition: 0.3s;
border-radius: 0;
z-index: 99;
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
}
.navmenu .dropdown ul li {
min-width: 200px;
}
.navmenu .dropdown ul a {
padding: 10px 20px;
font-size: 15px;
text-transform: none;
color: var(--nav-dropdown-color);
}
.navmenu .dropdown ul a i {
font-size: 12px;
}
.navmenu .dropdown ul a:hover,
.navmenu .dropdown ul .active:hover,
.navmenu .dropdown ul li:hover>a {
color: var(--nav-dropdown-hover-color);
}
.navmenu .dropdown:hover>ul {
opacity: 1;
top: 100%;
visibility: visible;
}
.navmenu .dropdown .dropdown ul {
top: 0;
left: -90%;
visibility: hidden;
}
.navmenu .dropdown .dropdown:hover>ul {
opacity: 1;
top: 0;
left: -100%;
visibility: visible;
}
} @media (max-width: 1199px) {
.mobile-nav-toggle {
color: var(--nav-color);
font-size: 28px;
line-height: 0;
margin-right: 10px;
cursor: pointer;
transition: color 0.3s;
}
.navmenu {
padding: 0;
z-index: 9997;
}
.navmenu > ul {
height: 100vh;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 80px;
}
.navmenu ul {
display: none;
list-style: none;
position: absolute;
inset: 60px 0 20px;
padding: 10px 0;
width: 100%;
height: 100vh;
margin: 0;
border-radius: 6px;
background-color: var(--nav-mobile-background-color);
overflow-y: auto;
transition: 0.3s;
z-index: 9998;
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
}
.navmenu a,
.navmenu a:focus {
color: var(--nav-dropdown-color);
padding: 10px 20px;
font-family: var(--nav-font);
font-size: 14px;
font-weight: 500;
display: flex;
align-items: center;
justify-content: space-between;
white-space: nowrap;
transition: 0.3s;
}
.navmenu a i,
.navmenu a:focus i {
font-size: 12px;
line-height: 0;
margin-left: 5px;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: 0.3s;
background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
}
.navmenu a i:hover,
.navmenu a:focus i:hover {
background-color: var(--accent-color);
color: var(--contrast-color);
}
.navmenu a:hover,
.navmenu .active,
.navmenu .active:focus {
color: var(--nav-dropdown-hover-color);
}
.navmenu .active i,
.navmenu .active:focus i {
background-color: var(--accent-color);
color: var(--contrast-color);
transform: rotate(180deg);
}
.navmenu .dropdown ul {
position: static;
display: none;
height: auto;
max-height: none;
z-index: 99;
padding: 5px 0;
margin: 5px 15px;
background-color: var(--nav-dropdown-background-color);
border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
box-shadow: none;
transition: all 0.5s ease-in-out;
}
.navmenu .dropdown ul ul {
background-color: rgba(33, 37, 41, 0.1);
}
.navmenu .dropdown>.dropdown-active {
display: block;
background-color: rgba(33, 37, 41, 0.03);
}
.mobile-nav-active {
overflow: hidden;
}
.mobile-nav-active .mobile-nav-toggle {
color: #fff;
position: absolute;
font-size: 32px;
top: 10px;
right: 15px;
margin-right: 0;
z-index: 9999;
}
.mobile-nav-active .navmenu {
position: fixed;
overflow: hidden;
inset: 0;
background: rgba(33, 37, 41, 0.8);
transition: 0.3s;
}
.mobile-nav-active .navmenu>ul {
display: block;
}
} .scroll-top {
position: fixed;
visibility: hidden;
opacity: 0;
right: 15px;
bottom: 15px;
z-index: 99999;
background-color: var(--accent-color);
width: 40px;
height: 40px;
border-radius: 4px;
transition: all 0.4s;
}
.scroll-top i {
font-size: 24px;
color: var(--contrast-color);
line-height: 0;
}
.scroll-top:hover {
background-color: color-mix(in srgb, var(--accent-color), transparent 20%);
color: var(--contrast-color);
}
.scroll-top.active {
visibility: visible;
opacity: 1;
} @media screen and (max-width: 768px) {
[data-aos-delay] {
transition-delay: 0 !important;
}
} .page-title {
color: var(--default-color);
background-color: var(--background-color);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 160px 0 60px 0;
text-align: center;
position: relative;
}
.page-title:before {
content: "";
background-color: color-mix(in srgb, var(--background-color), transparent 40%);
position: absolute;
inset: 0;
}
.page-title .container {
position: relative;
}
.page-title h1 {
font-size: 42px;
font-weight: 700;
margin-bottom: 10px;
}
.page-title .breadcrumbs ol {
display: flex;
flex-wrap: wrap;
list-style: none;
justify-content: center;
padding: 0;
margin: 0;
font-size: 16px;
font-weight: 400;
}
.page-title .breadcrumbs ol li+li {
padding-left: 10px;
}
.page-title .breadcrumbs ol li+li::before {
content: "/";
display: inline-block;
padding-right: 10px;
color: color-mix(in srgb, var(--default-color), transparent 70%);
} @media (max-width: 500px) {
.page-title img{
height: 50%;
} 
} section,
.section {
color: var(--default-color);
background-color: var(--background-color);
padding: 60px 0;
scroll-margin-top: 100px;
overflow: clip;
}
@media (max-width: 1199px) {
section,
.section {
scroll-margin-top: 66px;
}
}
@media (max-width: 770px) {
section,
.section {
padding: 30px 0;
}
} .section-title {
text-align: center;
padding-bottom: 30px;
position: relative;
}
.section-title h2 {
font-size: 32px;
font-weight: 700;
margin-bottom: 10px;
padding-bottom: 20px;
position: relative;
}
.section-title h2:after {
content: "";
position: absolute;
display: block;
width: 50px;
height: 3px;
background: var(--accent-color);
left: 0;
right: 0;
bottom: 0;
margin: auto;
}  .hero {
width: 100%;
min-height: 100vh;
position: relative;
padding: 120px 0 60px;
display: flex;
align-items: center;
}
@media (min-width: 1200px) {
.hero:after {
position: absolute;
content: "";
width: 36%;
background-image: linear-gradient(180deg, color-mix(in srgb, var(--background-color), transparent 15%), color-mix(in srgb, var(--background-color), transparent 15%) 100%), linear-gradient(180deg, rgb(0, 0, 0), rgb(0, 0, 0) 100%);
top: 0;
bottom: 0;
z-index: 2;
}
}
.hero:before {
position: absolute;
content: "";
background: color-mix(in srgb, var(--background-color), transparent 40%);
inset: 0;
z-index: 2;
} .hero-bg-video {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
object-fit: cover;
transform: translate(-50%, -50%);
z-index: 1;
}
.hero .container,
.hero .container-fluid {
z-index: 3;
position: relative; }
.hero h1 {
margin: 0;
font-size: 3rem;
font-weight: 700;
}
.hero blockquote {
color: color-mix(in srgb, var(--default-color), transparent 20%);
padding-left: 20px;
border-left: 2px solid var(--accent-color);
margin: 40px 0;
}
.hero .btn-get-started {
color: var(--contrast-color);
background: var(--accent-color);
font-family: var(--heading-font);
font-weight: 600;
font-size: 14px;
letter-spacing: 1px;
display: inline-block;
padding: 12px 30px;
max-width: 56%;
border-radius: 50px;
transition: 0.5s;
}
.hero .btn-get-started:hover {
background: color-mix(in srgb, var(--accent-color) 90%, white 15%);
}
.hero .btn-watch-video {
font-size: 16px;
transition: 0.5s;
margin-left: 25px;
color: var(--default-color);
font-weight: 600;
}
.hero .btn-watch-video i {
color: color-mix(in srgb, var(--default-color), transparent 50%);
font-size: 32px;
transition: 0.3s;
line-height: 0;
margin-right: 8px;
}
.hero .btn-watch-video:hover {
color: var(--default-color);
}
.hero .btn-watch-video:hover i {
color: var(--default-color);
}
@media (max-width: 640px) {
.hero h1 {
font-size: 28px;
line-height: 36px;
}
.hero .btn-get-started,
.hero .btn-watch-video {
font-size: 12px;
padding-left: 32px;
margin-left: 0;
}
}
@media (max-width: 325px) {
.hero h1 {
font-size: 28px;
line-height: 36px;
}
.hero .btn-get-started,
.hero .btn-watch-video {
font-size: 10px;
}
} .why-us .img-bg {
min-height: 500px;
position: relative;
}
.why-us .img-bg img {
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
}
.why-us .slides {
background-color: color-mix(in srgb, var(--default-color), transparent 97%);
}
.why-us h3 {
font-size: 22px;
font-weight: 700;
}
.why-us h4 {
font-size: 18px;
font-weight: 300; }
.why-us .swiper {
margin: 140px 140px 120px 140px;
overflow: hidden;
}
.why-us .swiper-wrapper {
height: auto;
}
.why-us .swiper-button-prev:after,
.why-us .swiper-button-next:after {
font-size: 24px;
color: color-mix(in srgb, var(--default-color), transparent 50%);
}
.why-us .swiper-button-prev {
left: 80px;
}
.why-us .swiper-button-next {
right: 80px;
}
.why-us .swiper-pagination {
margin-top: 30px;
position: relative;
}
.why-us .swiper-pagination .swiper-pagination-bullet {
background-color: color-mix(in srgb, var(--default-color), transparent 50%);
}
.why-us .swiper-pagination .swiper-pagination-bullet-active {
background-color: var(--accent-color);
}
@media (max-width: 1200px) {
.why-us .swiper {
margin: 60px 60px 40px 60px;
}
.why-us .swiper-button-prev,
.why-us .swiper-button-next {
display: none;
}
}
@media (max-width: 575px) {
.why-us .swiper {
margin: 40px 40px 20px 40px;
}
} .services .service-item {
position: relative;
height: 100%;
margin-bottom: 30px;
}
.services .service-item .icon {
margin-right: 20px;
}
.services .service-item .icon i {
color: var(--accent-color);
font-size: 30px;
line-height: 0;
transition: 0.3s;
}
.services .service-item:hover .icon i {
color: var(--accent-color);
}
.services .service-item .title {
color: var(--heading-color);
font-weight: 700;
margin-bottom: 10px;
font-size: 20px;
transition: 0.3s;
}
.services .service-item .description {
font-size: 15px;
color: color-mix(in srgb, var(--default-color), transparent 30%);
margin-bottom: 10px;
}
.services .service-item .readmore {
display: flex;
align-items: center;
color: color-mix(in srgb, var(--default-color), transparent 50%);
transition: 0.3s;
font-weight: 700;
font-size: 14px;
}
.services .service-item .readmore i {
margin-left: 8px;
}
.services .service-item:hover .title,
.services .service-item:hover .readmore,
.services .service-item:hover .icon i {
color: var(--accent-color);
} .call-to-action {
padding: 80px 0;
position: relative;
clip-path: inset(0);
}
.call-to-action img {
position: fixed;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
}
.call-to-action:before {
content: "";
background: color-mix(in srgb, var(--background-color), transparent 50%);
position: absolute;
inset: 0;
z-index: 2;
}
.call-to-action .container {
position: relative;
z-index: 3;
}
.call-to-action h3 {
font-size: 28px;
font-weight: 700;
color: var(--default-color);
}
.call-to-action p {
color: var(--default-color);
}
.call-to-action .cta-btn {
background: var(--accent-color);
color: var(--contrast-color);
font-family: var(--heading-font);
font-weight: 500;
font-size: 16px;
letter-spacing: 1px;
display: inline-block;
padding: 12px 40px;
border-radius: 50px;
transition: 0.5s;
margin: 10px;
}
.call-to-action .cta-btn:hover {
background: color-mix(in srgb, var(--accent-color) 90%, black 15%);
} .features h3 {
font-size: 32px;
font-weight: 700;
margin-bottom: 30px;
}
.features .icon-list i {
margin-right: 10px;
font-size: 24px;
line-height: 1;
}
.features .icon-list span {
font-size: 16px;
color: color-mix(in srgb, var(--default-color), transparent 20%);
}
.features .phone-wrap {
position: absolute;
right: 0;
}
@media (max-width: 768px) {
.features .phone-wrap {
position: relative;
}
}
.features .phone-wrap img {
width: 340px;
}
@media (max-width: 992px) {
.features .phone-wrap img {
margin-top: 30px;
}
}
@media (max-width: 768px) {
.features .phone-wrap img {
width: 100%;
}
}
.features .details {
margin-top: 80px;
padding: 120px 0;
background-color: color-mix(in srgb, var(--default-color), transparent 97%);
}
.features .details h4 {
font-size: 32px;
font-weight: 700;
margin-bottom: 20px;
}
.features .details p {
margin-bottom: 20px;
font-size: 15px;
}
.features .details .btn-get-started {
color: var(--contrast-color);
background-color: var(--accent-color);
font-family: var(--heading-font);
display: inline-block;
font-weight: 500;
font-size: 15px;
letter-spacing: 1px;
padding: 10px 32px;
border-radius: 50px;
transition: 0.5s;
}
.features .details .btn-get-started:hover {
background: color-mix(in srgb, var(--accent-color), transparent 20%);
}
#features {
margin-bottom: 0;
}
@media (max-width: 770px){
.features .details {
margin-top: -70px;
padding-bottom: 0px;
}
.features .details .btn-get-started {
display: block;
margin: 20px auto;
text-align: center;
width: fit-content;
}
} .recent-posts .post-box {
transition: 0.3s;
height: 100%;
overflow: hidden;
position: relative;
display: flex;
flex-direction: column;
}
.recent-posts .post-box .post-img {
overflow: hidden;
position: relative;
}
.recent-posts .post-box .post-img img {
transition: 0.5s;
}
.recent-posts .post-box .meta {
margin-top: 15px;
}
.recent-posts .post-box .meta .post-date {
font-size: 15px;
font-weight: 400;
color: var(--accent-color);
}
.recent-posts .post-box .meta .post-author {
font-size: 15px;
font-weight: 400;
color: color-mix(in srgb, var(--default-color), transparent 40%);
}
.recent-posts .post-box .post-title {
color: var(--heading-color);
font-size: 18px;
font-weight: 700;
margin: 15px 0 0 0;
position: relative;
transition: 0.3s;
}
.recent-posts .post-box p {
margin: 15px 0 0 0;
color: color-mix(in srgb, var(--default-color), transparent 40%);
}
.recent-posts .post-box .readmore {
display: flex;
align-items: center;
font-weight: 600;
line-height: 1;
transition: 0.3s;
margin-top: 15px;
}
.recent-posts .post-box .readmore i {
line-height: 0;
margin-left: 4px;
font-size: 18px;
}
.recent-posts .post-box:hover .post-title {
color: var(--accent-color);
}
.recent-posts .post-box:hover .post-img img {
transform: scale(1.1);
}
@media (max-width: 770px){
.recent-posts .section{
padding:30px;
}
} .about .content h3 {
font-size: 2rem;
font-weight: 700;
}
.about .content p {
color:black;
}
.about .content ul {
list-style: none;
padding: 0;
}
.about .content ul li {
font-weight: 400;
}
.about .content ul i {
color: var(--accent-color);
font-size: 1.25rem;
line-height: 1.2;
margin-right: 0.5rem;
} .about-img-wrap {
width: 100%;
height: 360px;           
overflow: hidden;
}
@media(max-widh: 430px){
.about-img-wrap img {
object-fit: scale-down;
}
}
.about-img-wrap img {
width: 100%;
height: 100%;
object-fit: cover;         
display: block;
} .about p,
.about li,
.about span {
color: color-mix(in srgb, var(--default-color), transparent 40%);
;
} .about .bi {
color: #56b8e6;
} .about .row + .row {
margin-top: 3.5rem;
} .service-cards .card-item {
background-color: var(--surface-color);
border: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
position: relative;
border-radius: 0;
}
.service-cards .card-item .card-bg {
min-height: 200px;
position: relative;
}
.service-cards .card-item .card-bg img {
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
z-index: 1;
}
.service-cards .card-item .card-body {
padding: 15px;
}
.service-cards .card-item h4 {
font-weight: 700;
font-size: 20px;
margin-bottom: 15px;
}
.service-cards .card-item p {
color: color-mix(in srgb, var(--default-color), transparent 40%);
margin: 0;
} .testimonials .testimonial-item {
background-color: var(--surface-color);
box-shadow: 0px 0 20px rgba(0, 0, 0, 0.1);
box-sizing: content-box;
padding: 30px;
margin: 40px 30px;
min-height: 320px;
display: flex;
flex-direction: column;
text-align: center;
transition: 0.3s;
}
.testimonials .testimonial-item .stars {
margin-bottom: 15px;
}
.testimonials .testimonial-item .stars i {
color: #ffc107;
margin: 0 1px;
}
.testimonials .testimonial-item .testimonial-img {
width: 90px;
border-radius: 50%;
border: 4px solid var(--background-color);
margin: 0 auto;
}
.testimonials .testimonial-item h3 {
font-size: 18px;
font-weight: bold;
margin: 10px 0 5px 0;
}
.testimonials .testimonial-item h4 {
font-size: 14px;
color: color-mix(in srgb, var(--default-color), transparent 40%);
margin: 0;
}
.testimonials .testimonial-item p {
font-style: italic;
margin: 0 auto 15px auto;
}
.testimonials .swiper-wrapper {
height: auto;
}
.testimonials .swiper-pagination {
margin-top: 20px;
position: relative;
}
.testimonials .swiper-pagination .swiper-pagination-bullet {
width: 12px;
height: 12px;
background-color: color-mix(in srgb, var(--default-color), transparent 85%);
opacity: 1;
}
.testimonials .swiper-pagination .swiper-pagination-bullet-active {
background-color: var(--accent-color);
}
.testimonials .swiper-slide {
opacity: 0.3;
}
@media (max-width: 1199px) {
.testimonials .swiper-slide-active {
opacity: 1;
}
.testimonials .swiper-pagination {
margin-top: 0;
}
.testimonials .testimonial-item {
margin: 40px 20px;
}
}
@media (min-width: 1200px) {
.testimonials .swiper-slide-next {
opacity: 1;
transform: scale(1.12);
}
} .collaboration .swiper {
padding: 40px 0;
} .collaboration .swiper-slide {
display: flex;
justify-content: center;
align-items: center;
transition: transform 0.4s ease, opacity 0.4s ease;
opacity: 0.5;
transform: scale(0.9);
} .collaboration .swiper-slide-active {
opacity: 1;
transform: scale(1.05);
z-index: 2;
} .collab-item {
background: #fff;
border-radius: 14px;
padding: 22px;
box-shadow: 0 6px 18px rgba(0,0,0,0.06);
display: flex;
justify-content: center;
align-items: center;
height: 140px;
width: 100%;
} .collab-img {
max-height: 75px;
width: auto;
object-fit: contain;
transition: transform 0.3s ease;
} .swiper-slide-active .collab-img {
transform: scale(1.3);
} @media (max-width: 992px) {
.collab-item {
height: 95px;
padding: 18px;
}
.collab-img {
max-height: 45px;
}
} @media (max-width: 576px) {
.collab-item {
height: 95px;
padding: 14px;
}
.collab-img {
max-height: 50px;
}
.collaboration {
position: relative;
}
.collaboration::before,
.collaboration::after {
content: "";
position: absolute;
top: 0;
width: 80px;
height: 100%;
z-index: 3;
pointer-events: none;
}
.collaboration::before {
left: 0;
background: linear-gradient(to right, #fff, transparent);
}
.collaboration::after {
right: 0;
background: linear-gradient(to left, #fff, transparent);
}
.collaboration .swiper-slide-active {
transform: scale(1);
}
} .service-details .service-box {
background-color: var(--surface-color);
padding: 20px;
box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.1);
}
.service-details .service-box+.service-box {
margin-top: 30px;
}
.service-details .service-box h4 {
font-size: 20px;
font-weight: 700;
border-bottom: 2px solid color-mix(in srgb, var(--default-color), transparent 92%);
padding-bottom: 15px;
margin-bottom: 15px;
}
.service-details .services-list {
background-color: var(--surface-color);
}
.service-details .services-list a {
color: color-mix(in srgb, var(--default-color), transparent 20%);
background-color: color-mix(in srgb, var(--default-color), transparent 96%);
display: flex;
align-items: center;
padding: 12px 15px;
margin-top: 15px;
transition: 0.3s;
}
.service-details .services-list a:first-child {
margin-top: 0;
}
.service-details .services-list a i {
font-size: 16px;
margin-right: 8px;
color: var(--accent-color);
}
.service-details .services-list a.active {
color: var(--contrast-color);
background-color: var(--accent-color);
}
.service-details .services-list a.active i {
color: var(--contrast-color);
}
.service-details .services-list a:hover {
background-color: color-mix(in srgb, var(--accent-color), transparent 95%);
color: var(--accent-color);
}
.service-details .download-catalog a {
color: var(--default-color);
display: flex;
align-items: center;
padding: 10px 0;
transition: 0.3s;
border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
}
.service-details .download-catalog a:first-child {
border-top: 0;
padding-top: 0;
}
.service-details .download-catalog a:last-child {
padding-bottom: 0;
}
.service-details .download-catalog a i {
font-size: 24px;
margin-right: 8px;
color: var(--accent-color);
}
.service-details .download-catalog a:hover {
color: var(--accent-color);
}
.service-details .help-box {
background-color: var(--accent-color);
color: var(--contrast-color);
margin-top: 30px;
padding: 30px 15px;
}
.service-details .help-box .help-icon {
font-size: 48px;
}
.service-details .help-box h4,
.service-details .help-box a {
color: var(--contrast-color);
}
.service-details .services-img {
margin-bottom: 20px;
}
.service-details h3 {
font-size: 26px;
font-weight: 700;
}
.service-details p {
font-size: 15px;
}
.service-details ul {
list-style: none;
padding: 0;
font-size: 15px;
}
.service-details ul li {
padding: 5px 0;
display: flex;
align-items: center;
}
.service-details ul i {
font-size: 20px;
margin-right: 8px;
color: var(--accent-color);
} .portfolio .portfolio-filters {
padding: 0;
margin: 0 auto 20px auto;
list-style: none;
text-align: center;
}
.portfolio .portfolio-filters li {
cursor: pointer;
display: inline-block;
padding: 0;
font-size: 16px;
font-weight: 600;
margin: 0 10px;
line-height: 1;
text-transform: uppercase;
margin-bottom: 5px;
transition: all 0.3s ease-in-out;
}
.portfolio .portfolio-filters li:hover,
.portfolio .portfolio-filters li.filter-active {
color: var(--accent-color);
}
.portfolio .portfolio-filters li:first-child {
margin-left: 0;
}
.portfolio .portfolio-filters li:last-child {
margin-right: 0;
}
@media (max-width: 575px) {
.portfolio .portfolio-filters li {
font-size: 14px;
margin: 0 5px;
}
}
.portfolio .portfolio-item {
position: relative;
}
.portfolio .portfolio-item .portfolio-info {
opacity: 0;
position: absolute;
left: 30px;
right: 30px;
bottom: 0;
z-index: 3;
transition: all ease-in-out 0.3s;
background: color-mix(in srgb, var(--background-color), transparent 10%);
padding: 15px;
}
.portfolio .portfolio-item .portfolio-info h4 {
font-size: 18px;
font-weight: 600;
padding-right: 50px;
}
.portfolio .portfolio-item .portfolio-info p {
color: color-mix(in srgb, var(--default-color), transparent 30%);
font-size: 14px;
margin-bottom: 0;
padding-right: 50px;
}
.portfolio .portfolio-item .portfolio-info .preview-link,
.portfolio .portfolio-item .portfolio-info .details-link {
position: absolute;
right: 50px;
font-size: 24px;
top: calc(50% - 14px);
color: color-mix(in srgb, var(--default-color), transparent 30%);
transition: 0.3s;
line-height: 0;
}
.portfolio .portfolio-item .portfolio-info .preview-link:hover,
.portfolio .portfolio-item .portfolio-info .details-link:hover {
color: var(--accent-color);
}
.portfolio .portfolio-item .portfolio-info .details-link {
right: 14px;
font-size: 28px;
}
.portfolio .portfolio-item:hover .portfolio-info {
opacity: 1;
bottom: 20px;
} .portfolio-details .portfolio-details-slider img {
width: 100%;
}
.portfolio-details .portfolio-details-slider .swiper-pagination {
margin-top: 20px;
position: relative;
}
.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet {
width: 12px;
height: 12px;
background-color: color-mix(in srgb, var(--default-color), transparent 85%);
opacity: 1;
}
.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet-active {
background-color: var(--accent-color);
}
.portfolio-details .portfolio-info {
background-color: var(--surface-color);
padding: 30px;
box-shadow: 0px 0 30px rgba(0, 0, 0, 0.1);
}
.portfolio-details .portfolio-info h3 {
font-size: 22px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
}
.portfolio-details .portfolio-info ul {
list-style: none;
padding: 0;
font-size: 15px;
}
.portfolio-details .portfolio-info ul li+li {
margin-top: 10px;
}
.portfolio-details .portfolio-description {
padding-top: 30px;
}
.portfolio-details .portfolio-description h2 {
font-size: 26px;
font-weight: 700;
margin-bottom: 20px;
}
.portfolio-details .portfolio-description p {
padding: 0;
color: color-mix(in srgb, var(--default-color), transparent 30%);
} .team .team-member {
background-color: var(--surface-color);
overflow: hidden;
border-radius: 5px;
box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
height: 100%;
}
.team .team-member .member-img {
position: relative;
overflow: hidden;
}
.team .team-member .social {
position: absolute;
left: 0;
bottom: 30px;
right: 0;
opacity: 0;
transition: ease-in-out 0.3s;
text-align: center;
}
.team .team-member .social a {
background: color-mix(in srgb, var(--contrast-color), transparent 25%);
color: color-mix(in srgb, var(--default-color), transparent 20%);
margin: 0 3px;
border-radius: 4px;
width: 36px;
height: 36px;
transition: ease-in-out 0.3s;
display: inline-flex;
justify-content: center;
align-items: center;
}
.team .team-member .social a:hover {
color: var(--contrast-color);
background: var(--accent-color);
}
.team .team-member .social i {
font-size: 18px;
line-height: 0;
}
.team .team-member .member-info {
padding: 25px 15px;
}
.team .team-member .member-info h4 {
font-weight: 700;
margin-bottom: 5px;
font-size: 18px;
text-align: center;
}
.team .team-member .member-info span {
display: block;
font-size: 13px;
font-weight: 400;
color: color-mix(in srgb, var(--default-color), transparent 40%);
}
.team .team-member:hover .social {
opacity: 1;
bottom: 15px;
} .contact {
background-image: url(//seganalytics.in/wp-content/themes/nova-wp-theme/assets/img/contact-bg.png);
background-position: left center;
background-repeat: no-repeat;
position: relative;
}
@media (max-width: 640px) {
.contact {
background-position: center 50px;
background-size: contain;
}
}
.contact:before {
content: "";
background: color-mix(in srgb, var(--background-color), transparent 30%);
position: absolute;
bottom: 0;
top: 0;
left: 0;
right: 0;
}
.contact .info-item+.info-item {
margin-top: 40px;
}
.contact .info-item i {
background: var(--accent-color);
color: var(--contrast-color);
font-size: 20px;
width: 44px;
height: 44px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50px;
transition: all 0.3s ease-in-out;
margin-right: 15px;
}
.contact .info-item h3 {
padding: 0;
font-size: 18px;
font-weight: 700;
margin-bottom: 5px;
}
.contact .info-item p {
padding: 0;
margin-bottom: 0;
font-size: 14px;
}
.contact .php-email-form {
height: 100%;
}
.contact .php-email-form input[type=text],
.contact .php-email-form input[type=email],
.contact .php-email-form textarea {
font-size: 14px;
padding: 10px 15px;
box-shadow: none;
border-radius: 0;
color: var(--default-color);
background-color: color-mix(in srgb, var(--background-color), transparent 50%);
border-color: color-mix(in srgb, var(--default-color), transparent 80%);
}
.contact .php-email-form input[type=text]:focus,
.contact .php-email-form input[type=email]:focus,
.contact .php-email-form textarea:focus {
border-color: var(--accent-color);
}
.contact .php-email-form input[type=text]::placeholder,
.contact .php-email-form input[type=email]::placeholder,
.contact .php-email-form textarea::placeholder {
color: color-mix(in srgb, var(--default-color), transparent 70%);
}
.contact .php-email-form button[type=submit] {
color: var(--contrast-color);
background: var(--accent-color);
border: 0;
padding: 10px 30px;
transition: 0.4s;
border-radius: 50px;
}
.contact .php-email-form button[type=submit]:hover {
background: color-mix(in srgb, var(--accent-color), transparent 20%);
} .blog-posts article {
background-color: var(--surface-color);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
padding: 30px;
height: 100%;
border-radius: 10px;
overflow: hidden;
}
.blog-posts .post-img {
max-height: 240px;
margin: -30px -30px 15px -30px;
overflow: hidden;
}
.blog-posts .post-category {
font-size: 16px;
color: color-mix(in srgb, var(--default-color), transparent 40%);
margin-bottom: 10px;
}
.blog-posts .title {
font-size: 20px;
font-weight: 700;
padding: 0;
margin: 0 0 20px 0;
}
.blog-posts .title a {
color: var(--heading-color);
transition: 0.3s;
}
.blog-posts .title a:hover {
color: var(--accent-color);
}
.blog-posts .post-author-img {
width: 50px;
border-radius: 50%;
margin-right: 15px;
}
.blog-posts .post-author {
font-weight: 600;
margin-bottom: 5px;
}
.blog-posts .post-date {
font-size: 14px;
color: color-mix(in srgb, var(--default-color), transparent 40%);
margin-bottom: 0;
} .blog-pagination {
padding-top: 0;
color: color-mix(in srgb, var(--default-color), transparent 40%);
}
.blog-pagination ul {
display: flex;
padding: 0;
margin: 0;
list-style: none;
}
.blog-pagination li {
margin: 0 5px;
transition: 0.3s;
}
.blog-pagination li a {
color: color-mix(in srgb, var(--default-color), transparent 40%);
padding: 7px 16px;
display: flex;
align-items: center;
justify-content: center;
}
.blog-pagination li a.active,
.blog-pagination li a:hover {
background: var(--accent-color);
color: var(--contrast-color);
}
.blog-pagination li a.active a,
.blog-pagination li a:hover a {
color: var(--contrast-color);
} .blog-details {
padding-bottom: 30px;
}
.main .back-icon{
font-size: 25px;
cursor: pointer;
}
.article{
margin-top: -30px;
}
.blog-details .article {
background-color: var(--surface-color);
padding: 30px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}
@media (max-width: 430px){
.blog-details .article {
background-color: var(--surface-color);
padding: 30px 0;
box-shadow: none
}
.container .blog-details .title  {
font-size: 20px;}
}
.blog-details .post-img {
margin: -30px -30px 20px -30px;
overflow: hidden;
}
.blog-details .title {
color: var(--heading-color);
font-size: 28px;
font-weight: 700;
padding-left: 12px;
margin: 0;
}
.blog-details .content {
margin-top: 20px;
}
.blog-details .content h3 {
font-size: 22px;
margin-top: 30px;
font-weight: bold;
}
.blog-details .content blockquote {
overflow: hidden;
background-color: color-mix(in srgb, var(--default-color), transparent 95%);
padding: 60px;
position: relative;
text-align: center;
margin: 20px 0;
}
.blog-details .content blockquote p {
color: var(--default-color);
line-height: 1.6;
margin-bottom: 0;
font-style: italic;
font-weight: 500;
font-size: 22px;
}
.blog-details .content blockquote:after {
content: "";
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 3px;
background-color: var(--accent-color);
margin-top: 20px;
margin-bottom: 20px;
}
.blog-details .meta-top {
margin-top: 20px;
color: color-mix(in srgb, var(--default-color), transparent 40%);
}
.blog-details .meta-top ul {
display: flex;
flex-wrap: wrap;
list-style: none;
align-items: center;
padding: 0;
margin: 0;
}
.blog-details .meta-top ul li+li {
padding-left: 20px;
display: flex;
align-items: center;
}
.blog-details .meta-top i {
font-size: 16px;
margin-right: 8px;
line-height: 1;
display: inline-flex;
align-items: center;
}
.blog-details .meta-top a {
color: color-mix(in srgb, var(--default-color), transparent 40%);
font-size: 14px;
display: inline-block;
line-height: 1;
}
.blog-details .meta-bottom {
padding-top: 10px;
border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
}
.blog-details .meta-bottom i {
color: color-mix(in srgb, var(--default-color), transparent 40%);
display: inline;
}
.blog-details .meta-bottom a {
color: color-mix(in srgb, var(--default-color), transparent 40%);
transition: 0.3s;
}
.blog-details .meta-bottom a:hover {
color: var(--accent-color);
}
.blog-details .meta-bottom .cats {
list-style: none;
display: inline;
padding: 0 20px 0 0;
font-size: 14px;
}
.blog-details .meta-bottom .cats li {
display: inline-block;
}
.blog-details .meta-bottom .tags {
list-style: none;
display: inline;
padding: 0;
font-size: 14px;
}
.blog-details .meta-bottom .tags li {
display: inline-block;
}
.blog-details .meta-bottom .tags li+li::before {
padding-right: 6px;
color: var(--default-color);
content: ",";
}
.blog-details .meta-bottom .share {
font-size: 16px;
}
.blog-details .meta-bottom .share i {
padding-left: 5px;
} .blog-author {
padding: 10px 0 40px 0;
}
.blog-author .author-container {
background-color: var(--surface-color);
padding: 20px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}
.blog-author img {
max-width: 120px;
margin-right: 20px;
}
.blog-author h4 {
font-weight: 600;
font-size: 20px;
margin-bottom: 0px;
padding: 0;
color: color-mix(in srgb, var(--default-color), transparent 20%);
}
.blog-author .social-links {
margin: 0 10px 10px 0;
}
.blog-author .social-links a {
color: color-mix(in srgb, var(--default-color), transparent 60%);
margin-right: 5px;
}
.blog-author p {
font-style: italic;
color: color-mix(in srgb, var(--default-color), transparent 30%);
margin-bottom: 0;
}  .blog-comments h2,
.blog-comments h3 {
font-size: 22px;
font-weight: 600;
margin-bottom: 25px;
color: #1d2b4f;
} .blog-comments .comment-list {
list-style: none;
padding: 0;
margin: 0;
} .blog-comments .comment {
display: flex;
gap: 18px;
padding: 20px;
margin-bottom: 20px;
background: #ffffff;
border-radius: 14px;
border: 1px solid #e6e9ef;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
}
.blog-comments ol,
.blog-comments ol{
padding-left: 0;
} .blog-comments .children {
margin-left: 50px;
margin-top: 20px;
} .blog-comments .comment-author img {
width: 48px;
height: 48px;
border-radius: 50%;
} .blog-comments .comment-body {
flex: 1;
} .blog-comments .comment-author b,
.blog-comments .comment-author .fn {
font-weight: 600;
color: #0f172a;
} .blog-comments .comment-metadata {
font-size: 0.85rem;
color: #64748b;
margin-bottom: 10px;
} .blog-comments .comment-content p {
font-size: 0.95rem;
color: #334155;
line-height: 1.7;
margin-bottom: 10px;
} .blog-comments .reply a {
font-size: 0.85rem;
font-weight: 500;
color: #0a63ff;
text-decoration: none;
}
.blog-comments .reply a:hover {
text-decoration: underline;
} .blog-comments #respond {
margin-top: 50px;
padding: 30px;
background: #f9fafb;
border-radius: 16px;
border: 1px solid #e6e9ef;
} .blog-comments #reply-title {
font-size: 22px;
font-weight: 600;
margin-bottom: 20px;
color: #1d2b4f;
} .blog-comments input[type="text"],
.blog-comments input[type="email"],
.blog-comments input[type="url"],
.blog-comments textarea {
width: 100%;
padding: 12px 14px;
margin-bottom: 15px;
border-radius: 10px;
border: 1px solid #dce1ea;
font-size: 0.95rem;
transition: all 0.25s ease;
} .blog-comments input:focus,
.blog-comments textarea:focus {
border-color: #0a63ff;
box-shadow: 0 0 0 3px rgba(10, 99, 255, 0.15);
outline: none;
} .blog-comments input[type="submit"] {
background-color:#37b3ed ;
color: #fff;
border: none;
padding: 12px 28px;
border-radius: 30px;
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
}
.blog-comments input[type="submit"]:hover {
box-shadow: 0 10px 25px rgba(10, 99, 255, 0.35);
} .blog-comments .logged-in-as {
font-size: 0.85rem;
margin-bottom: 15px;
color: #64748b;
} .blog-comments .required {
color: #ef4444;
} @media (max-width: 768px) {
.blog-comments .comment {
flex-direction: column;
}
.blog-comments .children {
margin-left: 20px;
}
p.form-submit {
display: flex;
justify-content: center;
}
} .widgets-container {
margin: 60px 0 30px 0;
}
.widget-title {
color: var(--heading-color);
font-size: 20px;
font-weight: 600;
padding: 0 0 10px 0;
margin: 0 0 20px 0;
position: relative;
}
.widget-title:before {
content: "";
position: absolute;
display: block;
height: 2px;
background: color-mix(in srgb, var(--default-color), transparent 90%);
left: 0;
right: 0;
bottom: 1px;
}
.widget-title:after {
content: "";
position: absolute;
display: block;
width: 40px;
height: 2px;
background: var(--accent-color);
left: 0;
bottom: 1px;
}
.widget-item {
margin-bottom: 40px;
}
.widget-item:last-child {
margin-bottom: 0;
}
.search-widget form {
background: var(--background-color);
border: 1px solid color-mix(in srgb, var(--default-color), transparent 70%);
padding: 3px 10px;
position: relative;
transition: 0.3s;
}
.search-widget form input[type=text] {
border: 0;
padding: 4px;
border-radius: 4px;
width: calc(100% - 40px);
background-color: var(--background-color);
color: var(--default-color);
}
.search-widget form input[type=text]:focus {
outline: none;
}
.search-widget form button {
background: var(--accent-color);
color: var(--contrast-color);
position: absolute;
top: 0;
right: 0;
bottom: 0;
border: 0;
font-size: 16px;
padding: 0 15px;
margin: -1px;
transition: 0.3s;
border-radius: 0 4px 4px 0;
line-height: 0;
}
.search-widget form button i {
line-height: 0;
}
.search-widget form button:hover {
background: color-mix(in srgb, var(--accent-color), transparent 20%);
}
.search-widget form:is(:focus-within) {
border-color: var(--accent-color);
}
.categories-widget ul {
list-style: none;
padding: 0;
margin: 0;
}
.categories-widget ul li {
padding-bottom: 10px;
}
.categories-widget ul li:last-child {
padding-bottom: 0;
}
.categories-widget ul a {
color: color-mix(in srgb, var(--default-color), transparent 20%);
transition: 0.3s;
}
.categories-widget ul a:hover {
color: var(--accent-color);
}
.categories-widget ul a span {
padding-left: 5px;
color: color-mix(in srgb, var(--default-color), transparent 50%);
font-size: 14px;
}
.recent-posts-widget .post-item {
display: flex;
margin-bottom: 15px;
}
.recent-posts-widget .post-item:last-child {
margin-bottom: 0;
}
.recent-posts-widget .post-item img {
width: 80px;
margin-right: 15px;
}
.recent-posts-widget .post-item h4 {
font-size: 15px;
font-weight: bold;
margin-bottom: 5px;
}
.recent-posts-widget .post-item h4 a {
color: var(--default-color);
transition: 0.3s;
}
.recent-posts-widget .post-item h4 a:hover {
color: var(--accent-color);
}
.recent-posts-widget .post-item time {
display: block;
font-style: italic;
font-size: 14px;
color: color-mix(in srgb, var(--default-color), transparent 50%);
}
.tags-widget {
margin-bottom: -10px;
}
.tags-widget ul {
list-style: none;
padding: 0;
margin: 0;
}
.tags-widget ul li {
display: inline-block;
}
.tags-widget ul a {
background-color: color-mix(in srgb, var(--default-color), transparent 94%);
color: color-mix(in srgb, var(--default-color), transparent 30%);
border-radius: 50px;
font-size: 14px;
padding: 5px 15px;
margin: 0 6px 8px 0;
display: inline-block;
transition: 0.3s;
}
.tags-widget ul a:hover {
background: var(--accent-color);
color: var(--contrast-color);
}
.tags-widget ul a span {
padding-left: 5px;
color: color-mix(in srgb, var(--default-color), transparent 60%);
font-size: 14px;
}  .services .sub-page-item .icon i{
display: flex;
margin-right: 18px;
font-size: 25px ;
font-weight: 700;
align-items: flex-start;
margin-top: 5px;
}
.section .btn {
border-radius: 20px;
background-color:#56b8e6;
color: white;
}
.current-section .container {
overflow: visible !important;
}
.process-diagram {
display: block;
margin: 40px auto;
width: 100%;
max-width: 100%;
height: auto;
background: #f8fafc;
border-radius: 16px;
border: 1px solid rgba(0,0,0,0.1);
box-shadow:
0 10px 20px rgba(0,0,0,0.06),
0 4px 8px rgba(0,0,0,0.04);
}
.side-images{
width: 80%;
height: 340px; object-fit: cover; object-position: center; border-radius: 12px;
display: block;
}  .custom-dark-footer {
background: #17283B; color: #d0d4dc;
font-family: "Inter", sans-serif;
padding-top: 50px;
border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.custom-dark-footer .footer-top {
padding-bottom: 40px;
} .custom-dark-footer h4 {
color: #ffffff;
font-size: 18px;
font-weight: 600;
margin-bottom: 18px;
}
.custom-dark-footer p {
font-size: 14px;
line-height: 1.6;
opacity: 0.85;
} .custom-dark-footer .footer-links ul {
list-style: none;
padding: 0;
}
.custom-dark-footer .footer-links ul li {
margin: 8px 0;
}
.custom-dark-footer .footer-links ul li a {
font-size: 14px;
text-decoration: none;
color: #d0d4dc;
opacity: 0.75;
transition: 0.3s ease;
}
.custom-dark-footer .footer-links ul li a:hover {
opacity: 1;
color: #ffffff;
padding-left: 5px;
} .custom-dark-footer .sitename {
font-size: 22px;
font-weight: 700;
color: #ffffff;
letter-spacing: 1px;
} .custom-dark-footer .footer-contact p span {
color: #ffffff;
font-weight: 500;
}
.custom-dark-footer .footer-contact p {
margin-bottom: 6px;
} .custom-dark-footer .social-links a {
font-size: 20px;
color: #d0d4dc;
transition: 0.3s ease;
opacity: 0.8;
}
.custom-dark-footer .social-links a:hover {
opacity: 1;
color: #6ea8fe; } .custom-dark-footer .footer-bottom {
border-top: 1px solid rgba(255, 255, 255, 0.08);
margin-top: 20px;
}
.custom-dark-footer .footer-bottom .copyright {
font-size: 14px;
opacity: 0.7;
}
.custom-dark-footer .footer-bottom .copyright strong {
color: #ffffff;
} @media (max-width: 768px) {
.custom-dark-footer h4 {
margin-top: 20px;
}
.custom-dark-footer .footer-bottom {
text-align: center;
}
}  .nova-form .cf7-two-col {
max-width: 720px;
border-radius: 16px;
border: none;
overflow: hidden;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
row-gap: 0;
margin: 0 auto;
} .nova-form .modal-header {
padding: 20px 28px;
border-bottom: 1px solid #e6e9ef;
}
.nova-form .modal-title {
font-size: 1.25rem;
font-weight: 600;
color: #0f172a;
} .nova-form .btn-close {
opacity: 0.6;
transition: 0.2s ease;
}
.nova-form .btn-close:hover {
opacity: 1;
} .nova-form .modal-body {
padding: 28px;
} .nova-form input[type="text"],
.nova-form input[type="email"],
.nova-form input[type="tel"],
.nova-form textarea,
.nova-form select {
width: 100%;
padding: 12px 14px;
border-radius: 10px;
border: 1px solid #dce1ea;
font-size: 0.95rem;
transition: all 0.25s ease;
background: #fff;
} .nova-form input:focus,
.nova-form textarea:focus,
.nova-form select:focus {
border-color: #0a63ff;
box-shadow: 0 0 0 3px rgba(10, 99, 255, 0.15);
outline: none;
} .nova-form label {
font-weight: 500;
font-size: 0.9rem;
color: #334155;
margin-bottom: 4px;
display: block;
} .nova-form input[type="file"] {
border: none;
padding: 8px 0;
font-size: 0.9rem;
} .nova-form .full-width {
width: 100%;
grid-column: 1 / -1;
}
.nova-form .full-width .wpcf7-form-control-wrap {
display: block;
width: 100%;
}
.nova-form .full-width textarea {
width: 100%;
max-width: 100%;
min-height: 140px;
}
.nova-form .full-width input[type="file"] {
width: 100%;
} .nova-form input[type="submit"],
.nova-form button[type="submit"] {
grid-column: 1 / -1;
display: flex;
margin: 24px auto 0;
background: linear-gradient(135deg, #00c3ff, #0099cc);
color: #fff;
border: none;
padding: 12px 26px;
border-radius: 30px;
font-weight: 600;
font-size: 0.95rem;
cursor: pointer;
transition: all 0.3s ease;
} .nova-form input[type="submit"]:hover,
.nova-form button[type="submit"]:hover {
box-shadow: 0 10px 25px rgba(10, 99, 255, 0.35);
transform: translateY(-2px);
} @media (max-width: 768px) {
.nova-form .cf7-two-col {
grid-template-columns: 1fr;
gap: 16px;
}
.nova-form .modal-body {
padding: 20px;
} .nova-form .modal-body p,
.nova-form .modal-body label {
margin-bottom: 6px;
}
} .case-study-section {
margin-top: -20px;
}
.case-study-card {
background: #ffffff;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 10px 35px rgba(0, 0, 0, 0.08);
}
.case-study-image img {
width: 100%;
height: auto;
border-bottom: 1px solid #eee;
}
.case-study-body {
padding: 20px;
}
.case-study-content {
font-size: 1rem;
line-height: 1.8;
color: #444;
}
.case-study-content h2,
.case-study-content h3 {
margin-top: 30px;
font-weight: 600;
}
.case-study-content p {
margin-bottom: 18px;
}
.case-study-header{
margin-bottom: 25px;
}
.case-study-title{
font-size: 32px;
font-weight: 700;
margin: 0;
}
@media (max-width:430px){
.case-study-title{
font-size: 19px;
}
}
.case-study-card{
background: #ffffff;
border-radius: 14px;
padding: 20px;
box-shadow: 0 10px 35px rgba(0,0,0,0.08);
}
.case-study-content{
line-height: 1.8;
color: #444;
} .breadcrumbs ol li a {
color: #ddd;
}
.breadcrumbs ol li.current {
list-style: none;
color: #fff;
font-weight: 500;
}
.breadcrumb-blog .blog {
color: #1b2f45;
}
.breadcrumb-blog ol li.current-blog {
list-style: none;
color: #1b2f45;
font-weight: 500;
}
.breadcrumb-blog ol {
list-style: none;
padding: 0;
margin: 0;
display: flex;
gap: 8px;
}
.blog-details .breadcrumb-blog li:not(:last-child)::after {
content: "/";
margin-left: 8px;
} .case-study-category .case-study-card {
background: #fff;
border-radius: 14px;
overflow: hidden;
height: 100%;
box-shadow: 0 10px 35px rgba(0, 0, 0, 0.08);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.case-study-category .case-study-card:hover {
transform: translateY(-6px);
box-shadow: 0 18px 45px rgba(0, 0, 0, 0.12);
}
.case-study-category .case-study-image img {
width: 100%;
height: auto;
}
.case-study-category .case-study-body {
padding: 28px;
}
.case-study-category .case-study-title {
font-size: 1.1rem;
font-weight: 600;
margin-bottom: 12px;
}
.case-study-category .case-study-title a {
color: #111;
text-decoration: none;
}
.case-study-category .case-study-title a:hover {
color: var(--primary-color, #0d6efd);
}
.case-study-category .case-study-excerpt {
font-size: 0.95rem;
color: #555;
line-height: 1.6;
margin-bottom: 18px;
}
a.case-study-category .case-study-link  {
font-size: 1.15rem;
}  .industry-description {
max-width: 800px;
margin: 0 auto;
text-align: center;
font-size: 1.05rem;
line-height: 1.8;
color: #555;
} .industry-overview-wrapper {
display: flex;
align-items: center;
gap: 48px;
}
@media (max-width: 770px){
.industry-overview-wrapper {
flex-direction: column;
}
} .industry-image img {
width: 420px;
max-width: 100%;
border-radius: 18px;
box-shadow: 0 10px 30px rgba(0,0,0,0.08);
} .industry-description {
flex: 1;
font-size: 1.05rem;
line-height: 1.8;
color: #555;
}  .industries-grid {
background: #ffffff;
} .industries-intro {
font-size: 1.50rem;
font-weight: bold;
line-height: 1.5;
color: #1d2b4f; margin-bottom: 18px;
}
.industries-sub {
font-size: 1rem;
color: #5f6b7a;
max-width: 950px;
margin-bottom: 50px;
}   .industry-card {
display: block;
position: relative;
height: 320px;
border-radius: 18px;
overflow: hidden;
background: #000;
box-shadow: 0 10px 30px rgba(0,0,0,0.12);
transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.industry-card:hover {
transform: translateY(-8px);
box-shadow: 0 16px 40px rgba(0,0,0,0.2);
}
.industry-card:hover img {
transform: scale(1.08);
} .industry-overlay {
position: absolute;
inset: 0;
background: linear-gradient(
to top,
rgb(23, 40, 59),
rgba(23, 40, 59,0.15)
);
display: flex;
align-items: flex-end;
padding: 14px;
}
.industry-overlay h3 {
font-size: 1.4rem;
font-weight: 600;
color: #ffffff;
margin: 0;
} @media (max-width: 991px) {
.industry-card {
height: 280px;
}
.industries-intro {
font-size: 1.2rem;
}
}
@media (max-width: 576px) {
.industry-card {
height: 240px;
}
.industries-intro {
font-size: 1.1rem;
}
} .sidebar {
background: #ffffff;
padding: 24px;
border-radius: 14px;
border: 1px solid #e6e6e6;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
position: sticky;
top: 30px;
} .sidebar .search-form,
.sidebar .search-form label {
display: block;
width: 100%;
}
.sidebar .search-form input[type="search"] {
width: 100% !important;
max-width: 100%;
box-sizing: border-box;
} .sidebar .widget {
margin-bottom: 32px;
padding-bottom: 24px;
border-bottom: 1px solid #f0f0f0;
}
.sidebar .widget:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
} .sidebar .widget-title {
font-size: 26px;
font-weight: 600;
color: #12263a;
margin-bottom: 18px;
line-height: 1.2;
} .sidebar ul {
list-style: none;
margin: 0;
padding: 0;
}
.sidebar ul li {
padding: 5px 0;
border-bottom: 1px solid #f2f2f2;
}
.sidebar ul li:last-child {
border-bottom: none;
}
.sidebar ul li a {
color: #444;
font-size: 15px;
text-decoration: none;
transition: all 0.25s ease;
}
.sidebar ul li a:hover {
color: #1b2f45; padding-left: 6px;
} .sidebar .search-form {
display: flex;
flex-direction: column;
}
.sidebar .search-field {
width: 100%;
height: 46px;
padding: 10px 14px;
border-radius: 8px;
border: 1px solid #dcdcdc;
font-size: 15px;
background: #fafafa;
outline: none;
}
.sidebar .search-field::placeholder {
color: #999;
}
.sidebar .search-submit {
margin-top: 12px;
width: 100%;
padding: 12px;
border-radius: 8px;
border: none;
font-size: 15px;
font-weight: 500;
background: #56b8e6; color: #ffffff;
cursor: pointer;
transition: all 0.25s ease;
}
.sidebar .search-submit:hover {
background: #46b8e7;
} @media (max-width: 991px) {
.sidebar {
position: relative;
top: unset;
margin-top: 24px;
}
}
.primary{
color: white;
border-radius: 20px;
background-color: #56b8e6;
border: none;
padding: 8px 14px;
}
.primary:hover{
color: white;
background-color: #40b1e6;
transform: translateY(-1px);
}   .jobs-search-bar {
display: flex;
justify-content: center;
margin-bottom: 40px;
}
.jobs-search-bar input {
width: 50%;
padding: 18px 24px;
border-radius: 40px;
border: 1px solid #1d2b4f;
background: #fff;
color: #000;
outline: none;
} .jobs-grid {
max-width: 900px;
margin: auto;
display: flex;
flex-direction: column;
gap: 20px;
} .job-card {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
background: #fff;
padding: 28px;
border-radius: 12px;
color: #000;
text-decoration: none;
transition: 0.3s ease;
}
.job-card:hover {
background: #f3f4f6;
} .job-left h3 {
margin-bottom: 6px;
font-weight: 600;
}
.job-location {
display: flex;
align-items: center;
gap: 6px;
margin: 0;
} .job-right {
display: flex;
flex-direction: column;
gap: 6px;
}
.job-right p {
display: flex;
align-items: center;
gap: 6px;
margin: 0;
} @media (max-width: 767.98px) { .jobs-search-bar input {
width: 100%;
padding: 14px 18px;
} .job-card {
flex-direction: column;
align-items: flex-start;
gap: 12px;
padding: 20px;
} .job-right {
flex-direction: row;
flex-wrap: wrap;
gap: 68px;
}
}
@media (max-width: 430px){
.job-right {
gap: 60px;
}
}
@media (max-width: 325px){
.job-right {
gap: 7px;
}
} .job-details-page {
background: #f8fafc;
}
.job-details.section {
padding: 20px 0;
}
.job-article {
background: #ffffff;
padding: 50px;
border-radius: 14px;
max-width: 900px;
margin: auto;
box-shadow: 0 10px 28px rgba(0,0,0,0.06);
}
.job-article .title {
font-size: 2.2rem;
font-weight: 700;
color: #0f172a;
margin-bottom: 10px;
padding-left: 10px;
}
.breadcrumb-blog ol {
display: flex;
gap: 8px;
list-style: none;
padding: 0;
margin-bottom: 25px;
}
.breadcrumb-blog a {
text-decoration: none;
color: var(--accent-color);
font-weight: 500;
}
.current-blog {
color: #64748b;
}
.job-article .meta-top {
border-top: 1px solid #e5e7eb;
border-bottom: 1px solid #e5e7eb;
padding: 18px 0;
margin-bottom: 30px;
}
.job-article .meta-top ul {
display: flex;
flex-wrap: wrap;
gap: 30px;
list-style: none;
padding: 0;
margin: 0;
}
.job-article .meta-top li {
display: flex;
align-items: center;
gap: 8px;
font-size: 15px;
color: #475569;
font-weight: 500;
}
.job-article .meta-top i {
color: var(--accent-color);
font-size: 18px;
}
.job-article .content {
line-height: 1.8;
color: #334155;
font-size: 16px;
}
.job-article .content h2,
.job-article .content h3 {
margin-top: 30px;
color: #0f172a;
}
.job-article .content ul {
padding-left: 20px;
}
.job-article .content li {
margin-bottom: 8px;
}
.job-apply {
margin-top: 40px;
text-align: left;
}
.job-apply .btn-primary {
background: var(--accent-color);
border: none;
padding: 14px 28px;
border-radius: 40px;
font-weight: 600;
transition: 0.3s ease;
}
.job-apply .btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(0,0,0,0.15);
}
@media (max-width: 768px) {
.job-article {
padding: 30px 22px;
}
.job-article .title {
font-size: 1.6rem;
}
.job-article .meta-top ul {
flex-direction: column;
gap: 12px;
}
} .tick-list {
list-style: none;
padding: 0;
margin-top: 15px;
}
.tick-list li {
position: relative;
padding-left: 28px; margin-bottom: 16px; }
.tick-list li::before {
content: "✔";
position: absolute;
left: 0;
top: 2px;
padding-right: 4px;
font-weight: 600;
}  .sub-page-items {
max-width: 850px;
margin: 0 auto;
font-size: 1rem;
line-height: 1.75;
color: #2c2c2c;
text-align: left; } .sub-page-items h1,
.sub-page-items h2,
.sub-page-items h3,
.sub-page-items h4,
.sub-page-items h5,
.sub-page-items h6 {
max-width: 720px;
margin: 3rem auto 1.2rem;
text-align: left;
font-weight: 700;
} .sub-page-items h3::after {
content: "";
display: block;
width: 50px;
height: 3px;
margin-top: 8px;
background: var(--accent-color);
} .sub-page-items p {
max-width: 720px;
margin: 0 auto 1.2rem;
text-align: left;
} .sub-page-items ul,
.sub-page-items ol {
max-width: 720px;
margin: 1.2rem auto 2rem;
padding-left: 1.5rem;
list-style-position: outside;
text-align: left;
}
.sub-page-items li {
margin: 0.6rem 0;
line-height: 1.6;
} .sub-page-items hr {
max-width: 720px;
margin: 3rem auto;
border: none;
border-top: 1px solid #e5e7eb;
} .sub-page-items .btn {
display: inline-block;
margin: 1.5rem auto 0 0;
padding: 10px 28px;
font-size: 0.95rem;
border-radius: 30px;
} @media (max-width: 768px) {
.sub-page-items {
font-size: 0.95rem;
}
.sub-page-items h3 {
font-size: 1.3rem;
}
.sub-page-items h5 {
font-size: 1.05rem;
}
} .metrics {
position: relative;
padding: 45px 0;
} .metrics::before {
content: "";
position: absolute;
inset: 0;
background: rgba(10, 20, 40, 0.65);
}
.metrics .container {
position: relative;
z-index: 2;
} .metric-box {
padding: 40px 20px;
border-radius: 14px;
text-align: center;
height: fit-content;
} .metric-icon {
font-size: 42px;
color: #ffffff;
margin-bottom: 14px;
} .metric-box h3 {
font-size: 2.4rem;
font-weight: 700;
color: #ffffff;
margin-bottom: 6px;
} .metric-box p {
font-size: 0.95rem;
color: rgba(255,255,255,0.85);
margin: 0;
} .about-links {
background: #ffffff;
}
.about-link-card {
display: block;
background: #ffffff;
border-radius: 14px;
overflow: hidden;
text-align: center;
text-decoration: none;
padding-bottom: 20px;
box-shadow: 0 6px 18px rgba(0,0,0,0.06);
} .about-link-card img {
width: 100%;
height: 180px;
object-fit: cover;
display: block;
}
.about-link-card img {
transition: transform 0.4s ease;
}
.about-link-card:hover img {
transform: scale(1.05);
}
.about-link-card h4 {
font-size: 1.05rem;
font-weight: 600;
color: #1d2b4f;
margin-top: 18px;
}
.about-link-card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 32px rgba(0,0,0,0.12);
background: var(--accent-color);
}
.about-link-card:hover h4 {
color: #ffffff;
} .journey-container{
display:grid;
grid-template-columns:40% 60%;
width:100%;
} .journey-left{
background:#1b2f45;
padding:80px 60px;
color:white;
}
.timeline-years{
list-style:none;
padding:0;
}
.timeline-years li{
font-size:24px;
font-weight: bolder;
margin-bottom:25px;
cursor:pointer;
padding:12px 20px;
border-top-left-radius:50px;
border-bottom-right-radius: 60px;
}
.timeline-years li.active{
background:#cfd3d8;
color:#000;
} .journey-right{
background:linear-gradient(135deg, #0f1f3a, #142b52);
color:white;
padding:80px;
}
.journey-content{
display:none;
font-size: 18px;
}
.journey-item.active .journey-content{
display:block;
} .accordion-title{
display:none;
} @media(max-width:768px){
.journey-container{
grid-template-columns:1fr;
}
.journey-left{
display:none;
}
.journey-right{
padding:30px;
}
.accordion-title{
display:block;
font-size:20px;
margin-bottom:10px;
cursor:pointer;
padding:12px;
background: whitesmoke;
border-radius:6px;
}
.journey-content{
padding:10px 0 20px;
}
}  .nova-hero {
background: #f8fbff;
text-align: center;
}
.nova-container {
width: 90%;
max-width: 1100px;
margin: 0 auto;
}
.nova-hero h1 {
font-size: 2.8rem;
font-weight: 700;
color: #1d2b4f;
margin-bottom: 20px;
}
.nova-lead {
font-size: 1.3rem;
font-weight: 500;
color: #1d2b4f;
max-width: 850px;
margin: 0 auto 20px;
line-height: 1.6;
}
.nova-sub {
font-size: 1rem;
color: #5f6b7a;
max-width: 800px;
margin: 0 auto;
line-height: 1.7;
} .nova-capabilities {
background: #ffffff;
}
.nova-capabilities h2 {
text-align: center;
font-size: 2.2rem;
font-weight: 700;
color: #1d2b4f;
}
.nova-cap-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 35px;
}
.nova-cap-item {
background: #f9fbff;
padding: 40px 30px;
border-radius: 20px;
text-align: center;
transition: all 0.35s ease;
box-shadow: 0 10px 25px rgba(0,0,0,0.04);
}
.nova-cap-item:hover {
transform: translateY(-8px);
box-shadow: 0 18px 40px rgba(0,0,0,0.08);
}
.nova-cap-item i {
font-size: 40px;
color: #5bb9e6;
margin-bottom: 20px;
display: inline-block;
}
.nova-cap-item h4 {
font-size: 1.2rem;
font-weight: 600;
margin-bottom: 12px;
color: #1d2b4f;
}
.nova-cap-item p {
font-size: 0.95rem;
color: #5f6b7a;
line-height: 1.6;
} .nova-process {
padding: 90px 0;
background: linear-gradient(135deg, #0f1f3a, #142b52);
color: #ffffff;
}
.nova-process h2 {
text-align: center;
font-size: 2.2rem;
font-weight: 700;
}
.nova-process h4 {
color:white;
max-width: 350px;
}
.nova-process-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
text-align: center;
}
.nova-step {
background: rgba(255,255,255,0.06);
padding: 35px 25px;
border-radius: 18px;
transition: all 0.3s ease;
}
.nova-step:hover {
background: rgba(255,255,255,0.12);
transform: translateY(-6px);
}
.nova-step span {
display: inline-block;
font-size: 1.8rem;
font-weight: 700;
margin-bottom: 15px;
color: #5bb9e6;
}
.nova-step h4 {
font-size: 1.1rem;
font-weight: 600;
margin-bottom: 20px;
margin-top: 30px;
color: white;
}
.nova-step p {
font-size: 0.9rem;
opacity: 0.85;
line-height: 1.6;
margin-bottom: 20px;
}
.nova-process h2 {
color: white;
}
.nova-hero h2{
font-size: 2rem; }
.nova-difference p{
margin-top: 8px;
}
.nova-process p{
margin-bottom: 20px;
}
.sub-para{
font-size: 16px;
}
.nova-difference ul>li{
margin-left: -16px;
}
.nova-industries ul>li{
margin-left: -16px;
}
.nova-outcomes ul>li{
margin-left: -16px;
}
.nova-process ul>li{
margin-left: -12px;
} .industries-wrapper{
text-align:center;
} .industries-header{
max-width:700px;
margin:0 auto 50px;
}
.industries-header p{
margin-top:10px;
color:#555;
} .industry-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
} .industries-serve-card{
background:#fff;
border-radius:12px;
overflow:hidden;
box-shadow:0 4px 14px rgba(0,0,0,0.05);
transition:all 0.25s ease;
} .industries-serve-card img{
width:100%;
height:160px;
object-fit:cover;
display:block;
} .industries-serve-card h6{
padding:16px;
font-weight:600;
margin:0;
text-align:center;
} .industries-serve-card:hover{
transform:translateY(-5px);
box-shadow:0 10px 25px rgba(0,0,0,0.08);
} @media (max-width:992px){
.industry-grid{
grid-template-columns:repeat(2,1fr);
}
} @media (max-width:576px){
.industry-grid{
grid-template-columns:1fr;
}
} .vision-hero {
padding-bottom: 80px;
}
.vision-hero .vision-img{
margin-top: 40px;
}
.vision-hero h1 {
font-size: 42px;
font-weight: 700;
margin-bottom: 22px;
}
.big-quote::before,
.big-quote::after {
font-size: 24px; font-weight: bold;
}
@media(max-width: 430px){
.large-quote {
vertical-align: -25px;
}  
}
.about-subpage h1 {
position: relative;
}
.about-subpage h1::after {
content: "";
position: absolute;
width: 50px;
height: 4px;
background: var(--accent-color);
left: 38px;
transform: translateX(-50%);
bottom: -10px;
}
@media (max-width: 430px){
.about-subpage h1::after {
content: "";
position: absolute;
width: 50px;
height: 4px;
background: var(--accent-color);
left: 50%;
transform: translateX(-50%);
bottom: -10px;
}
.about-subpage h2:after {
margin-left: 115px;
}
}
.about-subpage h2:after {
content: "";
display: flex;
width: 50px;
height: 3px;
background: var(--accent-color);
left: 0;
right: 0;
bottom: 0;
margin: 13px;
}
.vision-lead {
font-size: 22px;
max-width: 720px;
margin-bottom: 18px;
color: var(--default-color);
}
.vision-sub {
max-width: 720px;
font-size: 17px;
color: color-mix(in srgb, var(--default-color), transparent 30%);
}
.vision-section h2,
.vision-principles h2,
.vision-outcome h2 {
font-size: 32px;
font-weight: 700;
margin-bottom: 15px;
}
.vision-principles h4 {
font-size: 20px;
font-weight: 700;
margin-bottom: 8px;
}
.vision-principles p {
font-size: 15px;
color: color-mix(in srgb, var(--default-color), transparent 30%);
}
.vision-outcome p {
margin-top: -25px;
font-size: 17px;
color: black; } @media (max-width: 768px) {
.vision-hero h1 {
font-size: 32px;
}
.vision-lead {
font-size: 15px;
}
} .values-hero {
padding-bottom: 80px;
}
.values-hero h2 {
font-size: 42px;
font-weight: 700;
margin-bottom: 22px;
}
.values-lead {
font-size: 22px;
max-width: 720px;
margin-bottom: 18px;
color: var(--default-color);
}
.values-sub {
max-width: 720px;
font-size: 17px;
color: color-mix(in srgb, var(--default-color), transparent 30%);
}
.values-section h2,
.values-ethics h2,
.values-outcome h2 {
font-size: 32px;
font-weight: 700;
}
.values-section h4 {
font-size: 20px;
font-weight: 700;
margin-bottom: 45px;
}
.value-ethics p{
max-width: none;
}
.value-card {
background: #0f172a;
padding: 20px 15px;
border-radius: 16px;
height: 100%;
transition: all 0.3s ease;
border: 1px solid rgba(255,255,255,0.05);
}
.value-icon {
width: 32px;
height: 32px;
margin: 0 auto 20px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.value-card h4 {
color: #fff;
margin-bottom: 12px;
font-size: 20px;
font-weight: 600;
}
.value-card p {
color: #cbd5f5;
font-size: 15px;
line-height: 1.6;
} @media (max-width: 768px) {
.values-hero h1 {
font-size: 22px;
font-weight: bolder;
text-align: center;
}
.values-lead {
font-size: 19px;
}
} .team-hero {
margin-top: 10px;
}
.team-hero h1 {
font-size: 42px;
font-weight: 700;
margin-bottom: 22px;
}
.team-lead {
font-size: 22px;
max-width: 720px;
margin-bottom: 18px;
color: var(--default-color);
}
.team-sub {
max-width: 720px;
font-size: 17px;
color: color-mix(in srgb, var(--default-color), transparent 30%);
}
.team-section h2 {
font-size: 32px;
font-weight: 700;
margin-bottom: 30px;
}
.team-section p {
margin-top: -10px;
}
.leader-card {
padding: 30px;
border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
border-radius: 10px;
height: 100%;
}
.leader-card h4 {
font-size: 20px;
font-weight: 700;
margin-bottom: 6px;
}
.leader-card p {
font-size: 15px;
color: color-mix(in srgb, var(--default-color), transparent 35%);
}
.team-list {
padding-left: 18px;
}
.team-list li {
margin-bottom: 10px;
color: color-mix(in srgb, var(--default-color), transparent 30%);
}
.team-img{
border: 4px solid #f1f5f9;
box-shadow: 0 6px 18px rgba(0,0,0,0.08);
} @media (max-width: 768px) {
.team-hero h1 {
font-size: 32px;
}
.team-lead {
font-size: 19px;
}
} .leader-card .team-img{
width: 160px;
height: 160px;
object-fit: cover;
border-radius: 50%;
display: block;
margin-left: auto;
margin-right: auto;
} @media (max-width: 992px){
.leader-card .team-img{
width: 150px;
height: 150px;
}
} @media (max-width: 768px){
.leader-card .team-img{
width: 140px;
height: 140px;
}
} @media (max-width: 576px){
.leader-card .team-img{
width: 130px;
height: 130px;
}
} .nova-accordion-section {
padding: 80px 20px;
background: #f8fafc;
}
.nova-title {
text-align: center;
font-size: 34px;
font-weight: 700;
margin-bottom: 50px;
color: #0f172a;
}
.nova-accordion {
max-width: 900px;
margin: auto;
}
.nova-item {
background: #ffffff;
border-radius: 18px;
margin-bottom: 20px;
box-shadow: 0 10px 30px rgba(0,0,0,0.08);
overflow: hidden;
transition: all 0.5s ease;
cursor: pointer;
}
.nova-item:hover {
transform: translateY(-3px);
}
.nova-header {
padding: 22px 25px;
font-weight: 600;
font-size: 18px;
display: flex;
align-items: center;
gap: 15px;
color: #0f172a;
}
.step {
background: linear-gradient(135deg, #56b8e6, #06b6d4);
color: white;
width: 35px;
height: 35px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 14px;
}
.nova-content {
max-height: 0;
overflow: hidden;
padding: 0 25px;
transition: all 0.5s ease;
color: #475569;
font-size: 15px;
line-height: 1.6;
} .nova-item.active .nova-content {
max-height: 300px;
padding: 0 25px 25px;
} @media (min-width: 992px) {
.nova-item:hover .nova-content {
max-height: 300px;
padding: 0 25px 25px;
.step{
width:50px;
height: 25px;
}
}
} .partner-ecosystem .partner-card {
background: #ffffff;
border-radius: 14px;
overflow: hidden;
height: 100%;
border: 1px solid #f0f0f0;
box-shadow: 0 6px 18px rgba(0,0,0,0.05);
transition: all 0.3s ease;
} .partner-ecosystem .partner-card:hover {
transform: translateY(-6px);
box-shadow: 0 12px 28px rgba(0,0,0,0.08);
background: #f8fbff;
} .partner-ecosystem .card-header {
background: #0b2a55;
padding: 18px 22px;
border: none;
margin: 0;
transition: 0.3s ease;
}
.partner-ecosystem .card-header h4 {
margin: 0;
font-size: 1.25rem;
font-weight: 700;
color: white;
} .partner-ecosystem .partner-card:hover .card-header {
background: var(--accent-color);
}
.partner-ecosystem .partner-card:hover .card-header h4 {
color: #fff;
} .partner-ecosystem .card-body {
padding: 22px 24px;
}
.partner-ecosystem .card-body p {
font-size: 0.95rem;
color: #555;
margin-bottom: 14px;
line-height: 1.6;
} .partner-ecosystem ul {
list-style: none;
padding: 0;
margin: 0;
}
.partner-ecosystem ul li {
position: relative;
padding-left: 18px;
margin-bottom: 8px;
color: #333;
}
.partner-ecosystem ul li::before {
content: "•";
position: absolute;
left: 0;
color: #1b2f45;
font-size: 1.2rem;
} @media (min-width: 992px) {
.partner-ecosystem .col-lg-4 {
flex: 0 0 33.333%;
max-width: 33.333%;
}
} .flip-card {
perspective: 1200px;
height: 180px;
}
.flip-card-inner {
position: relative;
width: 100%;
height: 100%;
transition: transform 0.8s;
transform-style: preserve-3d;
}
.flip-card:hover .flip-card-inner {
transform: rotateY(180deg);
}
.flip-card-front,
.flip-card-back {
position: absolute;
width: 100%;
height: 100%;
border-radius: 18px;
backface-visibility: hidden;
box-shadow: 0 15px 35px rgba(0,0,0,0.08);
padding: 22px 18px;
display: flex;
flex-direction: column;
justify-content: center;
background: #ffffff;
}
.flip-card-front {
background: #ffffff;
}
.flip-card-back {
background: linear-gradient(135deg, #56b8e6, #1b2f45);
color: #ffffff;
transform: rotateY(180deg);
}
.value-icon {
font-size: 34px;
color: #56b8e6;
margin-bottom: 10px;
}
.flip-card-back h4 {
margin-bottom: 15px;
}
.flip-card-back p {
font-size: 0.95rem;
line-height: 1.6;
} .how-it-works{
text-align:center;
}
.process{
display:grid;
grid-template-columns:repeat(3,1fr);
position:relative;
gap:40px;
max-width:1000px;
margin:auto;
}
.process::before{
content:"";
position:absolute;
top:42px;
left:10%;
width:80%;
height:2px;
background:#3b82f6;
z-index:0;
}
.step-head{
position:relative;
z-index:2;
cursor:pointer;
}
.process-logo{
width:70px;
height:70px;
margin:auto;
border-radius:50%;
background:#fff;
border:1px solid #e5e7eb;
display:flex;
align-items:center;
justify-content:center;
font-size:32px;
transition:.35s ease;
}
.step-head h3{
margin-top:12px;
font-size:22px;
color:#1b2f45;
transition:.3s;
}
.step-content{
max-height:0;
overflow:hidden;
opacity:0;
transform:translateY(-10px);
transition:
max-height .45s ease,
opacity .35s ease,
transform .35s ease;
margin-top:15px;
}
.step-content p{
color:#6b7280;
font-size:15px;
line-height:1.6;
}.process-step:hover .step-content{
max-height:200px;
opacity:1;
transform:translateY(0);
}
.process-step:hover .process-logo{
transform:translateY(-6px) scale(1.08);
box-shadow:0 12px 30px rgba(59,130,246,.2);
border-color:#3b82f6;
}
.process {
grid-template-columns: repeat(4,1fr);
}
.process-step:nth-child(1) i { color:#f59e0b; }
.process-step:nth-child(2) i { color:#7c3aed; }
.process-step:nth-child(3) i { color:#ec4899; }
.process-step:nth-child(4) i { color:#3b82f6; }
.process-step:hover h3{
color:#3b82f6;
}
@media(max-width:768px){
.process{
grid-template-columns:1fr;
gap:50px;
}
.process::before{
display:none;
}
}