/* Zivo Mark Digital Marketing CSS */

body{

font-family:Inter,sans-serif;

padding-top:95px;

}

.custom-navbar{

padding:18px 0;

transition:.4s;

background:#fff;

backdrop-filter:blur(16px);

}

.custom-navbar.scrolled{

background:#ffffff;

box-shadow:0 12px 40px rgba(0,0,0,.08);

padding:12px 0;

}

.logo{

height:55px;

}

.navbar-nav{

gap:12px;

}

.nav-link{

font-size:16px;

font-weight:600;

color:#111;

transition:.3s;

position:relative;

}

.nav-link:hover{

color:#0d6efd;

}

.nav-link::after{

content:'';

position:absolute;

left:0;

bottom:-5px;

width:0;

height:2px;

background:#0d6efd;

transition:.3s;

}

.nav-link:hover::after{

width:100%;

}

.dropdown-menu{

border:none;

border-radius:18px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

padding:12px;

}

.dropdown-item{

padding:10px 16px;

border-radius:10px;

}

.dropdown-item:hover{

background:#0d6efd;

color:#fff;

}

.search-btn{

width:48px;

height:48px;

border:none;

border-radius:50%;

background:#eef5ff;

font-size:18px;

transition:.35s;

}

.search-btn:hover{

background:#0d6efd;

color:#fff;

transform:rotate(10deg);

}

.quote-btn{

padding:13px 28px;

border-radius:50px;

background:linear-gradient(135deg,#0d6efd,#5b5eff);

color:#fff;

font-weight:700;

text-decoration:none;

transition:.35s;

}

.quote-btn:hover{

transform:translateY(-3px);

color:#fff;

box-shadow:0 12px 35px rgba(13,110,253,.35);

}

.navbar-toggler{

border:none;

font-size:34px;

}

.offcanvas{

width:300px;

}

@media(max-width:991px){

.logo{

height:48px;

}

}


.hero-slider{

position:relative;
width:100%;
height:650px;
overflow:hidden;

}

.slide{

position:absolute;
width:100%;
height:100%;
opacity:0;
transition:1s;

}

.slide.active{

opacity:1;
z-index:1;

}

.slide img{

width:100%;
height:100%;
object-fit:cover;
display:block;

}

/* Buttons */

.prev,
.next{

position:absolute;
top:50%;
transform:translateY(-50%);
width:55px;
height:55px;
border:none;
border-radius:50%;
background:rgba(255,255,255,.2);
backdrop-filter:blur(10px);
color:#fff;
font-size:30px;
cursor:pointer;
z-index:99;
transition:.3s;

}

.prev{

left:25px;

}

.next{

right:25px;

}

.prev:hover,
.next:hover{

background:#0d6efd;

}

/* Dots */

.dots{

position:absolute;
bottom:25px;
left:50%;
transform:translateX(-50%);
display:flex;
gap:12px;
z-index:99;

}

.dot{

width:14px;
height:14px;
background:#fff;
border-radius:50%;
cursor:pointer;
transition:.3s;
opacity:.5;

}

.dot.active{

background:#0d6efd;
opacity:1;
transform:scale(1.3);

}

@media(max-width:768px){

.hero-slider{

height:525px;

}

.prev,
.next{

width:42px;
height:42px;
font-size:22px;

}

}
/* Dark Overlay */

.slide::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

background:linear-gradient(to right,
rgba(0,0,0,.75),
rgba(0,0,0,.30),
rgba(0,0,0,.10));

z-index:1;

}

/* Content */

.slide-content{

position:absolute;

top:50%;

left:10%;

transform:translateY(-50%);

max-width:650px;

z-index:2;

color:#fff;

animation:fadeUp 1s ease;

}

.sub-title{

display:inline-block;

padding:10px 24px;

background:#ff7a00;

border-radius:50px;

font-size:15px;

font-weight:600;

margin-bottom:20px;

letter-spacing:1px;

}

.slide-content h1{

font-size:58px;

font-weight:800;

line-height:1.2;

margin-bottom:20px;

text-shadow:0 8px 25px rgba(0,0,0,.35);

}

.slide-content p{

font-size:18px;

line-height:1.8;

margin-bottom:35px;

color:#f2f2f2;

}

/* Buttons */

.slider-btn{

display:flex;

gap:18px;

flex-wrap:wrap;

}

.btn-main{

background:#ff7a00;

color:#fff;

padding:16px 34px;

border-radius:50px;

text-decoration:none;

font-weight:700;

transition:.35s;

box-shadow:0 10px 25px rgba(255,122,0,.35);

}

.btn-main:hover{

background:#0d6efd;

transform:translateY(-6px);

color:#fff;

}

.btn-outline{

padding:16px 34px;

border:2px solid #fff;

border-radius:50px;

color:#fff;

text-decoration:none;

font-weight:700;

transition:.35s;

}

.btn-outline:hover{

background:#fff;

color:#111;

transform:translateY(-6px);

}

/* Animation */

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(-40%) translateX(-30px);

}

to{

opacity:1;

transform:translateY(-50%) translateX(0);

}

}

/* Responsive */

@media(max-width:991px){

.slide-content{

left:6%;

right:6%;

max-width:100%;

}

.slide-content h1{

font-size:40px;

}

}

@media(max-width:767px){

.slide-content{

text-align:center;

left:20px;

right:20px;

}

.slide-content h1{

font-size:28px;

}

.slide-content p{

font-size:15px;

}

.slider-btn{

justify-content:center;

}

.btn-main,

.btn-outline{

width:100%;

text-align:center;

}

.sub-title{

font-size:13px;

}

}


.about-home{

background:#ffffff;
position:relative;
}

.shape{

position:absolute;
border-radius:50%;
background:rgba(13,110,253,.08);
animation:zoomShape 6s infinite ease-in-out;

}

.shape-one{

width:250px;
height:250px;
left:-120px;
top:50px;

}

.shape-two{

width:180px;
height:180px;
right:-70px;
bottom:50px;

}

.about-image{

position:relative;

}

.about-image img{

border-radius:25px;

}

.experience-box{

position:absolute;
bottom:20px;
left:-20px;
background:#0d6efd;
color:#fff;
padding:20px 25px;
border-radius:15px;
box-shadow:0 20px 40px rgba(0,0,0,.2);

}

.experience-box h2{

font-size:42px;
font-weight:700;
margin:0;

}

.floating-card{

position:absolute;
display:flex;
align-items:center;
gap:15px;
background:#fff;
padding:15px 20px;
border-radius:15px;
box-shadow:0 15px 30px rgba(0,0,0,.1);
animation:floatCard 4s infinite;

}

.card-one{

top:30px;
right:-30px;

}

.card-two{

bottom:120px;
right:-40px;

}

.floating-card i{

width:55px;
height:55px;
display:flex;
align-items:center;
justify-content:center;
background:#ff7a00;
color:#fff;
border-radius:50%;
font-size:24px;

}

.section-tag{

display:inline-block;
padding:8px 20px;
background:#e9f2ff;
color:#0d6efd;
font-weight:700;
border-radius:50px;
letter-spacing:1px;

}

.section-title{

font-size:46px;
font-weight:700;
line-height:1.3;
margin-bottom:25px;

}

.about-home p{

font-size:17px;
line-height:1.9;
color:#666;

}

.feature-box{

display:flex;
align-items:center;
gap:15px;
padding:15px;
border-radius:12px;
background:#fff;
box-shadow:0 10px 25px rgba(0,0,0,.08);
transition:.3s;

}

.feature-box:hover{

transform:translateY(-6px);

}

.feature-box i{

font-size:28px;
color:#0d6efd;

}

.btn-primary{

padding:14px 35px;
border-radius:50px;

}

.btn-outline-primary{

padding:14px 35px;
border-radius:50px;

}

@keyframes floatCard{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

}

@keyframes zoomShape{

0%,100%{

transform:scale(1);

}

50%{

transform:scale(1.15);

}

}

@media(max-width:991px){

.card-one,
.card-two,
.experience-box{

position:relative;
left:0;
right:0;
bottom:0;
top:0;
margin-top:20px;

}

.section-title{

font-size:36px;

}

}



















/* ZivoMark Contact Page)*/


















/* ZivoMark Premium Footer CSS v2.0 (Starter)*/
.footer-section{
  position:relative;
  background:linear-gradient(135deg,#0b1f4d,#0d6efd,#ff8a00);
  color:#fff;
  padding:80px 0 20px;
  overflow:hidden;
}
.footer-overlay{
  position:absolute;inset:0;
  background:radial-gradient(circle at top right,rgba(255,255,255,.08),transparent 40%);
  pointer-events:none;
}
.footer-card{
  position:relative;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:28px;
  height:100%;
  transition:.35s;
  box-shadow:0 15px 40px rgba(0,0,0,.18);
}
.footer-card:hover{
  transform:translateY(-8px);
  box-shadow:0 25px 60px rgba(0,0,0,.28);
}
.footer-title{
  font-size:22px;
  font-weight:700;
  margin-bottom:18px;
  position:relative;
}
.footer-title:after{
  content:"";
  width:60px;height:3px;
  background:#ffb347;
  display:block;
  margin-top:8px;
  border-radius:3px;
}
.footer-text{line-height:1.8;color:#eef3ff}
.footer-links,.contact-info,.policy-menu{list-style:none;padding:0;margin:0}
.footer-links li,.contact-info li{margin:12px 0}
.footer-links a,.policy-menu a,.contact-info a{
 color:#fff;text-decoration:none;transition:.3s;
}
.footer-links a:hover,.policy-menu a:hover,.contact-info a:hover{
 color:#ffd166;padding-left:8px;
}
.social-icons{display:flex;gap:12px;margin-top:20px}
.social-icons a{
 width:44px;height:44px;border-radius:50%;
 display:flex;align-items:center;justify-content:center;
 background:rgba(255,255,255,.12);
 color:#fff;transition:.3s;
}
.social-icons a:hover{
 background:#ff8a00;transform:translateY(-5px) rotate(8deg);
}
.contact-info li{display:flex;gap:15px}
.contact-info .icon{
 width:48px;height:48px;border-radius:50%;
 display:flex;align-items:center;justify-content:center;
 background:#0d6efd;color:#fff;flex-shrink:0;
}
.contact-info .phone{background:#ff8a00}
.footer-divider{
 border-color:rgba(255,255,255,.15);
 margin:40px 0 20px;
}
.policy-menu{
 display:flex;gap:18px;justify-content:flex-end;flex-wrap:wrap;
}
.copyright{margin:0}
#backTop{
 position:fixed;right:25px;bottom:25px;
 width:52px;height:52px;border:none;border-radius:50%;
 background:#ff8a00;color:#fff;
 box-shadow:0 10px 25px rgba(0,0,0,.25);
 transition:.3s;cursor:pointer;
}
#backTop:hover{transform:translateY(-5px);background:#0d6efd}
@media(max-width:991px){
 .policy-menu{justify-content:flex-start;margin-top:15px}
}
@media(max-width:767px){
 .footer-section{padding-top:60px}
 .footer-card{margin-bottom:20px}
 .footer-title{font-size:20px}
}