.elementor-9 .elementor-element.elementor-element-ea83562{--display:flex;--margin-top:-13px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-9 .elementor-element.elementor-element-ae5560d{--display:flex;}.elementor-9 .elementor-element.elementor-element-4e64238{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-2defbec{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-c12cc45{--display:flex;}.elementor-9 .elementor-element.elementor-element-3e743f0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-7cac311{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-9 .elementor-element.elementor-element-75be706{--display:flex;--min-height:794px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-c425d79{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9 .elementor-element.elementor-element-486d554{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-9 .elementor-element.elementor-element-ae5560d{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-4e64238{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-2defbec{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-c12cc45{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-3e743f0{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-75be706{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-c425d79{--content-width:1600px;}.elementor-9 .elementor-element.elementor-element-486d554{--content-width:1600px;}}/* Start custom CSS for html, class: .elementor-element-bbc559b *//* ===================================== */
/* CONTAINER */
/* ===================================== */

.container{
max-width:1200px;
margin:auto;
padding:0 20px;
font-family:Poppins,sans-serif;
}


/* ===================================== */
/* HERO SECTION */
/* ===================================== */

.hero{

position:relative;
padding:120px 0;

background-size:cover;
background-position:center;
background-repeat:no-repeat;

animation:heroSlider 18s infinite ease-in-out;

width:100vw;
margin-left:calc(-50vw + 50%);

}


/* ===================================== */
/* HERO TEXT */
/* ===================================== */

.hero-title{

font-family:Poppins;
font-size:54px;
line-height:1.2;
color:#ffffff;
margin-bottom:20px;

}

.hero-title .line{

display:block;
opacity:0;
transform:translateY(20px);
animation:heroText 1s forwards;

}

.hero-title .line:nth-child(2){
animation-delay:.5s;
}

@keyframes heroText{

to{
opacity:1;
transform:translateY(0);
}

}


/* ensure hero form is above effects */

.hero-form{
position:relative;
z-index:999;
}

/* ensure wpforms elements receive clicks */

.hero-form *{
pointer-events:auto;
}

/* prevent overlays blocking form */

.hero-overlay,
.hero-gradient,
.floating-shape,
.particle-grid,
.hero::after,
.hero::before{
pointer-events:none;
}

/* ===================================== */
/* HERO GRID */
/* ===================================== */

.hero-grid{

max-width:1200px;
margin:auto;

display:grid;
grid-template-columns:1fr 420px;

gap:60px;
align-items:center;

position:relative;
z-index:5;

padding:0 20px;

}


/* ===================================== */
/* HERO CONTENT */
/* ===================================== */

.hero-content{
color:white;
}

.hero-content h1{

font-size:54px;
font-family:Poppins;
margin-bottom:20px;

color:#ffffff;
text-shadow:0 4px 12px rgba(0,0,0,0.5);

}

.hero-content p{

font-size:18px;
color:#f1f5f9;

}


/* ===================================== */
/* HERO BADGE */
/* ===================================== */

.hero-badge{

background:rgba(255,255,255,0.2);
color:white;

padding:6px 14px;
border-radius:20px;

font-size:14px;
display:inline-block;

margin-bottom:18px;

backdrop-filter:blur(8px);

animation:floatBadge 4s ease-in-out infinite;

}

@keyframes floatBadge{

0%{transform:translateY(0px);}
50%{transform:translateY(-6px);}
100%{transform:translateY(0px);}

}


/* ===================================== */
/* HERO IMAGE SLIDER */
/* ===================================== */

@keyframes heroSlider{

0%{
background-image:url("https://jashwithaconsultancyservices.com/wp-content/uploads/2026/03/001.jpg.jpeg");
}

33%{
background-image:url("https://jashwithaconsultancyservices.com/wp-content/uploads/2026/03/001.jpg.jpeg");
}

66%{
background-image:url("https://jashwithaconsultancyservices.com/wp-content/uploads/2026/03/001.jpg.jpeg");
}

100%{
background-image:url("https://jashwithaconsultancyservices.com/wp-content/uploads/2026/03/001.jpg.jpeg");
}

}


/* ===================================== */
/* HERO OVERLAY */
/* ===================================== */

.hero-overlay{

position:absolute;
top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,0.55);

}


/* ===================================== */
/* HERO FORM CARD */
/* ===================================== */

.hero-form{

position:relative;
z-index:10;

max-width:360px;
width:100%;
margin:auto;

background:rgba(255,255,255,0.95);

backdrop-filter:blur(12px);

border-radius:12px;
padding:30px;

box-shadow:0 30px 70px rgba(0,0,0,0.35);

}


/* ===================================== */
/* FORM TITLE */
/* ===================================== */

.hero-form h3{

margin-bottom:20px;
text-align:center;

}


/* ===================================== */
/* INPUT FIELDS */
/* ===================================== */

.hero-form input,
.hero-form textarea{

width:100%;

padding:12px;
margin-bottom:12px;

border:1px solid #ddd;
border-radius:6px;

font-size:14px;

}


/* INPUT FOCUS EFFECT */

.hero-form input:focus,
.hero-form textarea:focus{

border-color:#4f46e5;
outline:none;

box-shadow:0 0 0 3px rgba(79,70,229,0.15);

}


/* ===================================== */
/* WPFORMS BUTTON */
/* ===================================== */

.hero-form .wpforms-submit{

width:100%;

padding:14px;

background:linear-gradient(135deg,#4F46E5,#2563EB);

color:white;

border:none;
border-radius:6px;

font-weight:600;
cursor:pointer;

transition:.3s;

}

.hero-form .wpforms-submit:hover{

transform:translateY(-2px);

box-shadow:0 18px 40px rgba(79,70,229,0.6);

}


/* ===================================== */
/* PARTICLE BACKGROUND */
/* ===================================== */

.hero::after{

content:"";

position:absolute;

top:0;
left:0;

width:100%;
height:100%;

background-image:
radial-gradient(rgba(255,255,255,0.15) 1px, transparent 1px);

background-size:60px 60px;

pointer-events:none;

}


/* ===================================== */
/* DISABLE CLICK BLOCKING */
/* ===================================== */

.hero-gradient,
.floting-shape,
.particle-grid{

pointer-events:none;

}

.hero::before{
pointer-events:none;
}


/* ===================================== */
/* FORM SUB TEXT */
/* ===================================== */

.form-sub{

text-align:center;
font-size:13px;
color:#64748b;

margin-bottom:18px;

}


/* ===================================== */
/* RESPONSIVE */
/* ===================================== */

@media(max-width:900px){

.hero-grid{
grid-template-columns:1fr;
text-align:center;
}

.hero-form{
margin:auto;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-185574b */.services-section{

padding:110px 20px;

background:linear-gradient(180deg,#ffffff,#f8fafc);

position:relative;

}

/* SERVICE CARD */

.service-card{

text-align:center;

padding:30px;

}

/* ICON CIRCLE */

.service-icon{

width:70px;

height:70px;

margin:auto;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

background:linear-gradient(135deg,#4f46e5,#22c55e);

color:white;

font-size:28px;

margin-bottom:16px;

}

/* RESPONSIVE */

@media(max-width:1000px){

.services-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:600px){

.services-grid{

grid-template-columns:1fr;

}

}

/* section title */

.section-title{

text-align:center;

font-family:Poppins;

font-size:38px;

margin-bottom:12px;

color:#0f172a;

}

.section-sub{

text-align:center;

max-width:720px;

margin:auto;

margin-bottom:70px;

color:#64748b;

font-size:17px;

}

/* grid */

.services-grid{

display:grid;

grid-template-columns:repeat(5,1fr);

gap:5px;

max-width:1600px;

margin:auto;

}



/* card style */

.service-card{

background:white;

border-radius:14px;

padding:34px;

border:1px solid #e5e7eb;

transition:all .35s ease;

}

.service-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,0.08);

}

/* responsive */

@media(max-width:1000px){

.services-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:600px){

.services-grid{

grid-template-columns:1fr;

}

}

/* prevent cards from shrinking */

.service-card{

min-width:260px;
flex:0 0 auto;

background:white;
border-radius:14px;

padding:34px;

border:1px solid #e5e7eb;

transition:all .35s ease;

}

.service-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,0.08);

}

/* hide scrollbar */

.services-grid::-webkit-scrollbar{
display:none;
}

/* card hover */

.service-card:hover{

transform:translateY(-10px);

box-shadow:0 30px 60px rgba(0,0,0,0.08);

}

/* icon */

.icon-wrap{

width:70px;

height:70px;

margin:auto;

margin-bottom:18px;

display:flex;

align-items:center;

justify-content:center;

font-size:28px;

border-radius:50%;

background:linear-gradient(135deg,#4f46e5,#22c55e);

color:white;

box-shadow:0 10px 25px rgba(79,70,229,.35);

}

/* headings */

.service-card h3{

font-family:Poppins;

margin-bottom:10px;

font-size:20px;

}

/* text */

.service-card p{

color:#64748b;

font-size:15px;

}

/* animated accent line */

.card-accent{

position:absolute;

bottom:0;

left:0;

height:4px;

width:0%;

background:linear-gradient(90deg,#4f46e5,#22c55e);

transition:width .4s ease;

}

.service-card:hover .card-accent{

width:100%;

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a1251b7 */.stats-section{

padding:90px 0;

background:linear-gradient(180deg,#ffffff,#f1f5f9);

}

.stats-wrap{

width:100%;

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

padding:0 80px;

align-items:center;

text-align:center;

}

.stat-item{

background:#ffffff;

border-radius:12px;

padding:28px 20px;

border:1px solid #e5e7eb;

transition:all .35s ease;

}

.stat-item:hover{

transform:translateY(-6px);

box-shadow:0 20px 40px rgba(0,0,0,0.08);

}

.stat-item h3{

font-family:Poppins;

font-size:34px;

color:#4f46e5;

margin-bottom:6px;

}

.stat-item p{

color:#64748b;

font-size:15px;

}

/* responsive */

@media(max-width:900px){

.stats-wrap{

grid-template-columns:repeat(2,1fr);

padding:0 25px;

gap:20px;

}

}

@media(max-width:600px){

.stats-wrap{

grid-template-columns:1fr;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-dcc5eaa *//* SECTION */

.why-section{

padding:130px 0;

background:#f8fafc;

position:relative;

}

/* centered title */

.why-header{

text-align:center;

max-width:750px;

margin:auto;

margin-bottom:80px;

padding:0 20px;

}

.why-title{

font-family:Poppins;

font-size:44px;

margin-bottom:12px;

color:#0f172a;

}

.why-sub{

color:#64748b;

font-size:17px;

line-height:1.6;

}

/* grid layout */

.why-wrapper{

width:100%;

max-width:none;

padding:0 80px;

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

/* image */

.why-visual{

position:relative;

}

.why-visual img{

width:100%;

border-radius:18px;

box-shadow:0 40px 80px rgba(0,0,0,0.12);

transition:all .4s ease;

}

/* image hover effect */

.why-visual:hover img{

transform:scale(1.03);

box-shadow:0 50px 100px rgba(0,0,0,0.18);

}

/* floating badge */

.visual-badge{

position:absolute;

bottom:-20px;

left:30px;

background:white;

padding:14px 22px;

border-radius:12px;

box-shadow:0 20px 40px rgba(0,0,0,0.15);

border:1px solid #e5e7eb;

font-weight:600;

}

/* subtle background accent */

.why-visual::before{

content:"";

position:absolute;

top:-30px;

right:-30px;

width:120px;

height:120px;

background:#e0e7ff;

border-radius:20px;

z-index:-1;

}

/* cards */

.why-card{

background:white;

padding:26px;

border-radius:14px;

margin-bottom:22px;

border:1px solid #e5e7eb;

transition:.35s ease;

}

.why-card:hover{

transform:translateY(-8px);

box-shadow:0 30px 60px rgba(0,0,0,0.08);

border-color:#d1d5db;

}

.why-card h4{

font-family:Poppins;

margin-bottom:6px;

color:#111827;

}

.why-card p{

color:#64748b;

font-size:15px;

line-height:1.6;

}

/* responsive */

@media(max-width:900px){

.why-wrapper{

grid-template-columns:1fr;

gap:50px;

}

.why-section{

padding:100px 0;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-01886b5 */.process-section{

padding:150px 20px;
background:#ffffff;
position:relative;
overflow:hidden;

}

/* subtle background grid */

.process-section::before{

content:"";
position:absolute;
inset:0;
background-image:radial-gradient(#e5e7eb 1px, transparent 1px);
background-size:40px 40px;
opacity:.35;

}

/* header */

.process-header{

text-align:center;
max-width:700px;
margin:auto;
margin-bottom:110px;

}

.process-title{

font-family:Poppins;
font-size:44px;
margin-bottom:10px;

}

.process-sub{

color:#64748b;

}

/* timeline container */

.process-timeline{

position:relative;
max-width:1100px;
margin:auto;

}

/* base vertical line */

.timeline-line{

position:absolute;
left:50%;
top:0;
width:3px;
height:100%;
background:#e5e7eb;
transform:translateX(-50%);

}

/* animated progress line */

.timeline-progress{

position:absolute;
left:50%;
top:0;
width:3px;
height:0%;
background:linear-gradient(#4f46e5,#22c55e);
transform:translateX(-50%);
transition:height .4s ease;

}

/* items */

.timeline-item{

position:relative;
width:50%;
padding:20px 40px;

}

.timeline-item.left{
left:0;
text-align:right;
}

.timeline-item.right{
left:50%;
}

/* reveal animation */

.reveal{
opacity:0;
transform:translateY(40px);
transition:all .8s ease;
}

.reveal.active{
opacity:1;
transform:translateY(0);
}

/* node */

.timeline-dot{

position:absolute;
top:30px;
left:100%;
transform:translate(-50%,-50%);

width:52px;
height:52px;

background:#4f46e5;
color:white;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

font-weight:600;

box-shadow:0 20px 40px rgba(79,70,229,.35);

}

/* right node */

.timeline-item.right .timeline-dot{
left:0;
transform:translate(-50%,-50%);
}

/* glow effect */

.timeline-dot::before{

content:"";

position:absolute;
width:80px;
height:80px;

background:radial-gradient(circle,rgba(79,70,229,.3),transparent);

border-radius:50%;

z-index:-1;

animation:glowPulse 3s infinite;

}

@keyframes glowPulse{

0%{transform:scale(.8);opacity:.5;}
50%{transform:scale(1.2);opacity:.2;}
100%{transform:scale(.8);opacity:.5;}

}

/* cards */

.timeline-card{

background:white;

padding:28px;

border-radius:14px;

border:1px solid #e5e7eb;

box-shadow:0 20px 40px rgba(0,0,0,0.06);

transition:.35s;

position:relative;

}

/* hover effect */

.timeline-card:hover{

transform:translateY(-10px);

box-shadow:0 35px 70px rgba(0,0,0,0.12);

}

/* gradient accent bar */

.timeline-card::before{

content:"";

position:absolute;
top:0;
left:0;
width:100%;
height:3px;

background:linear-gradient(90deg,#4f46e5,#22c55e);

opacity:0;
transition:.3s;

}

.timeline-card:hover::before{
opacity:1;
}

/* text */

.timeline-card h4{
font-family:Poppins;
margin-bottom:6px;
}

.timeline-card p{
color:#64748b;
font-size:15px;
}

/* responsive */

@media(max-width:900px){

.timeline-line,
.timeline-progress{
left:20px;
}

.timeline-item{
width:100%;
padding-left:60px;
text-align:left;
}

.timeline-item.left,
.timeline-item.right{
left:0;
}

.timeline-dot{
left:20px;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7cac311 */.cta-section{

position:relative;
padding:140px 20px;

background:linear-gradient(135deg,#4f46e5,#2563eb);

color:white;
text-align:center;
overflow:hidden;

}

.cta-container{

max-width:900px;
margin:auto;
position:relative;
z-index:2;

}

.cta-section h2{

font-family:Poppins;
font-size:44px;
margin-bottom:12px;

}

.cta-section p{

font-size:18px;
opacity:.9;
margin-bottom:40px;

}

.cta-actions{

display:flex;
justify-content:center;
align-items:center;
gap:25px;
flex-wrap:wrap;

}

/* button */

.cta-button{

background:white;
color:#4f46e5;

padding:16px 34px;

border-radius:10px;

font-weight:600;
text-decoration:none;

transition:.3s;

box-shadow:0 15px 35px rgba(0,0,0,0.2);

}

.cta-button:hover{

transform:translateY(-4px);

box-shadow:0 25px 50px rgba(0,0,0,0.25);

}

/* phone text */

.cta-contact{

font-size:16px;
opacity:.95;

}

/* floating shapes */

.cta-bg-shapes span{

position:absolute;

border-radius:50%;

background:rgba(255,255,255,0.15);

animation:float 10s infinite ease-in-out;

}

.cta-bg-shapes span:nth-child(1){

width:220px;
height:220px;
top:-60px;
left:-60px;

}

.cta-bg-shapes span:nth-child(2){

width:180px;
height:180px;
bottom:-60px;
right:-60px;

}

/* animation */

@keyframes float{

0%{transform:translateY(0)}
50%{transform:translateY(-20px)}
100%{transform:translateY(0)}

}
.cta-section{

position:relative;

padding:160px 20px;

overflow:hidden;

background:linear-gradient(135deg,#4f46e5,#2563eb,#0ea5e9);

color:white;

text-align:center;

}
.cta-bg span{

position:absolute;

border-radius:50%;

filter:blur(60px);

opacity:.5;

animation:blobFloat 12s infinite ease-in-out;

}

.blob1{

width:260px;
height:260px;

background:#a78bfa;

top:-80px;
left:-80px;

}

.blob2{

width:300px;
height:300px;

background:#38bdf8;

bottom:-120px;
right:-80px;

animation-delay:2s;

}

.blob3{

width:220px;
height:220px;

background:#22c55e;

top:40%;
left:60%;

animation-delay:4s;

}

@keyframes blobFloat{

0%{transform:translateY(0)}
50%{transform:translateY(-30px)}
100%{transform:translateY(0)}

}
.cta-particles{

position:absolute;

inset:0;

background-image:radial-gradient(rgba(255,255,255,.25) 1px, transparent 1px);

background-size:40px 40px;

opacity:.25;

animation:particleMove 40s linear infinite;

}

@keyframes particleMove{

from{transform:translateY(0)}
to{transform:translateY(-200px)}

}
.cta-title{

font-family:Poppins;

font-size:48px;

margin-bottom:16px;

animation:titleReveal 1.2s ease forwards;

}

.cta-title span{

background:linear-gradient(90deg,#a5b4fc,#38bdf8);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

@keyframes titleReveal{

0%{
opacity:0;
transform:translateY(30px);
}

100%{
opacity:1;
transform:translateY(0);
}

}
.cta-text{

font-size:18px;

opacity:.9;

max-width:700px;

margin:auto;

margin-bottom:40px;

animation:textFade 1.6s ease forwards;

}

@keyframes textFade{

0%{opacity:0}
100%{opacity:.9}

}
.cta-button{

background:white;

color:#4f46e5;

padding:16px 36px;

border-radius:10px;

font-weight:600;

text-decoration:none;

transition:.35s;

box-shadow:0 15px 40px rgba(0,0,0,.25);

position:relative;

}

.cta-button:hover{

transform:translateY(-4px);

box-shadow:0 25px 60px rgba(0,0,0,.35);

}

/* glowing pulse */

.cta-button::after{

content:"";

position:absolute;

inset:-6px;

border-radius:12px;

background:linear-gradient(90deg,#a78bfa,#38bdf8);

opacity:.4;

filter:blur(10px);

z-index:-1;

animation:glowPulse 3s infinite;

}

@keyframes glowPulse{

0%{opacity:.4}
50%{opacity:.7}
100%{opacity:.4}

}
.cta-contact{

margin-top:14px;

font-size:16px;

opacity:.95;

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8be569c */.roles-section{

padding:140px 20px;

background:#ffffff;

}

.roles-header{

text-align:center;

max-width:750px;

margin:auto;

margin-bottom:70px;

}

.roles-header h2{

font-family:Poppins;

font-size:42px;

margin-bottom:10px;

}

.roles-header p{

color:#64748b;

}

/* grid */

.roles-grid{

max-width:1200px;

margin:auto;

display:grid;

grid-template-columns:repeat(4,1fr);

gap:28px;

}

/* card */

.role-card{

background:#f8fafc;

border-radius:14px;

padding:26px;

border:1px solid #e5e7eb;

transition:.35s;

}

.role-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,0.08);

}

.role-card h4{

font-family:Poppins;

margin-bottom:8px;

}

.role-card p{

color:#64748b;

font-size:15px;

}

/* responsive */

@media(max-width:1000px){

.roles-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:600px){

.roles-grid{

grid-template-columns:1fr;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-184dd2e */.contact-section{

position:relative;

padding:160px 20px;

background:linear-gradient(180deg,#ffffff,#f1f5f9);

overflow:hidden;

}

/* floating shapes */

.contact-bg span{

position:absolute;

border-radius:50%;

filter:blur(80px);

opacity:.4;

animation:floatBlob 12s infinite ease-in-out;

}

.contact-bg span:nth-child(1){

width:280px;
height:280px;

background:#a5b4fc;

top:-80px;
left:-80px;

}

.contact-bg span:nth-child(2){

width:260px;
height:260px;

background:#38bdf8;

bottom:-100px;
right:-80px;

animation-delay:4s;

}

@keyframes floatBlob{

0%{transform:translateY(0)}
50%{transform:translateY(-30px)}
100%{transform:translateY(0)}

}

/* container */

.contact-container{

max-width:1200px;

margin:auto;

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

position:relative;

z-index:2;

}

/* left side */

.contact-left h2{

font-family:Poppins;

font-size:44px;

margin-bottom:14px;

}

.contact-left p{

color:#64748b;

margin-bottom:30px;

max-width:420px;

}

.detail{

margin-bottom:24px;

}

.detail h4{

font-family:Poppins;

margin-bottom:6px;

}

/* form card */

.contact-form-card{

background:rgba(255,255,255,0.75);

backdrop-filter:blur(12px);

padding:40px;

border-radius:18px;

border:1px solid rgba(255,255,255,0.4);

box-shadow:0 30px 60px rgba(0,0,0,0.08);

transition:.4s;

}

.contact-form-card:hover{

transform:translateY(-8px);

box-shadow:0 40px 80px rgba(0,0,0,0.12);

}

/* logo */

.form-logo{

width:150px;

display:block;

margin:auto;

margin-bottom:20px;

}

/* form fields */

.contact-form-card input,
.contact-form-card textarea{

width:100%;

padding:14px;

border-radius:8px;

border:1px solid #e5e7eb;

margin-bottom:14px;

}

/* button */

.contact-form-card button{

background:linear-gradient(135deg,#4f46e5,#2563eb);

color:white;

padding:14px;

border:none;

border-radius:8px;

font-weight:600;

width:100%;

cursor:pointer;

transition:.3s;

}

.contact-form-card button:hover{

transform:translateY(-2px);

box-shadow:0 20px 40px rgba(0,0,0,0.15);

}

/* responsive */

@media(max-width:900px){

.contact-container{

grid-template-columns:1fr;

gap:50px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-44317bd */.testimonials-section{

padding:150px 20px;
background:linear-gradient(180deg,#ffffff,#f8fafc);
overflow:hidden;

}

/* header */

.testimonial-header{

text-align:center;
max-width:700px;
margin:auto;
margin-bottom:70px;

}

.testimonial-header h2{

font-family:Poppins;
font-size:44px;
margin-bottom:10px;

}

.testimonial-header p{

color:#64748b;

}

/* slider */

.testimonial-slider{

max-width:1300px;
margin:auto;
overflow:hidden;
position:relative;

}

/* track */

.testimonial-track{

display:flex;
gap:30px;
animation:testimonialSlide 30s linear infinite;

}

/* card */

.testimonial-card{

min-width:360px;
background:white;
border-radius:16px;
padding:32px;
border:1px solid #e5e7eb;
box-shadow:0 25px 60px rgba(0,0,0,0.05);
transition:.35s;

}

.testimonial-card:hover{

transform:translateY(-10px);
box-shadow:0 35px 70px rgba(0,0,0,0.1);

}

/* review text */

.testimonial-card p{

font-size:16px;
color:#475569;
margin-bottom:18px;
font-style:italic;

}

/* name */

.testimonial-card h4{

font-family:Poppins;
margin-bottom:4px;

}

/* role */

.testimonial-card span{

color:#64748b;
font-size:14px;

}

/* slider animation */

@keyframes testimonialSlide{

0%{transform:translateX(0)}
100%{transform:translateX(-50%)}

}

/* ---------------- MOBILE ONLY ---------------- */

@media(max-width:900px){

.testimonial-slider{

overflow-x:auto;
scroll-snap-type:x mandatory;

}

/* stop animation only on mobile */

.testimonial-track{

animation:none;
display:flex;
flex-direction:row;

}

/* card becomes swipe slide */

.testimonial-card{

min-width:85%;
flex:0 0 auto;
scroll-snap-align:start;

}

/* hide scrollbar */

.testimonial-slider::-webkit-scrollbar{
display:none;
}

}/* End custom CSS */