/* header */
header {
	position: relative;
	top:0;
	width: 100%;
	z-index: 1000;
	height: 5rem;
	justify-content: center;
	display: flex;
	align-items: center;
	background: #fff;
}
header a {
color: #000;
text-decoration: none
}
header .header-logo img {
	width: 10rem;
	height: 4rem;
	object-fit: contain;
}
a {
    text-decoration: none !important;
}


/* base */
.form-control {
    height: 4rem;
    border-radius: 2rem !important;
    border: 0.1rem solid #fff !important;
    padding: 1rem 2rem !important;
    margin-bottom: 2rem;
    background: transparent !important;
    color: #fff !important;
}
.wpcf7-submit {
    border-radius: 2rem !important;
    border: 0.1rem solid #fff !important;
    padding: 1rem 2rem !important;
    background: transparent !important;
    color: #fff !important;
    width: 10rem;
    font-weight: bold;
}
.wpcf7-submit:hover{
    border-radius: 2rem !important;
    border-color: transparent !important;
    background: #fff !important;
    color: #3777bb !important;
}
.contact-form input,
.contact-form textarea {
    color: #ffffff;
}
.form-control::placeholder {
    color: #ffffff;
    opacity: 1;
}

::placeholder {
    color: #ffffff;
    opacity: 1; /* ensures full white */
}

/* Chrome, Safari, Edge */
::-webkit-input-placeholder {
    color: #ffffff;
}

/* Firefox */
::-moz-placeholder {
    color: #ffffff;
}

/* Internet Explorer 10–11 */
:-ms-input-placeholder {
    color: #ffffff;
}

.intro {
	text-align: center;
	margin: 1rem 0 2rem;
	color: #000;
}
.intro h2,
.intro p {
	color: #000;
}
.intro h2 {
	margin-bottom: 1rem;
}
.intro.white h2,
.intro.white p {
	color: #fff;
}
.intro h2 span {
	color: #3777bb;
}
.intro.txt-left {
	text-align: left;
}

.container-fluid {
    padding: 0;
    margin: 0;
    width: 100%;
}

/* banner */
section.banner-section {
	position: relative;
	padding-top:0;
}
.banner-section img {
	width: 100%;
}
.aboutus-img {
width: 100%;
}

/* clients */
.client-logo ul li {
	list-style: none;
}
.client-logo ul {
	margin: 0;
	padding: 0;
}
.clogo-item-ns {
    min-height: 12rem;
    background: rgb(51 51 51 / 9%);
    margin: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0.1rem 0.1rem 0.15rem rgb(238 238 238 / 62%);
    border-radius: 2rem;
}
.client-logo ul li img{
	transition: all 0.5s ease;
	transform: none;
	width: 8rem;
	margin: 0 auto;
	height: 8rem;
	object-fit: contain;
}
.client-logo ul li img:hover, .clogo-item-ns:hover img{
	transform: scale(1.05);
}


/* services */
.service-box {
	background: #f5f5f5;
	padding: 2rem 1rem;
	border-radius: 1rem;
	display:flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	margin-bottom: 2rem;
}
.service-box img {
	width: 8rem;
	height: 8rem;
	margin: 1rem 0;
	object-fit: contain;
}
.service-grid .bg:nth-child(odd) .service-box {
    background: #f5f5f5;
	color: #3777bb;
}
.service-grid .bg:nth-child(odd) .service-box h4 {
	color: #3777bb;
}
.service-grid .bg:nth-child(even) .service-box {
    background: #3777bb;
	color: #fff;
}
.service-grid .bg:nth-child(even) .service-box h4 {
	color: #fff;
}
.service-grid .bg .service-box h4 {
	font-size: 1.35rem;
	font-weight: 800;
	margin: 1rem 0;
}
.row.service-grid, .ourwork-flex {
    display: flex;
    align-items: center;
    justify-content: center;
}
.section.about-us .intro {
    text-align: left;
}


/* clients */
.client-logo-box {
    background: #f2f2f2;
    border-radius: 8px;
    transition: all 0.3s ease;
    min-height: 6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    box-shadow: 1px 2px 2px #3777bb !important;
}
.client-logo-box img {
    width: 100%;
    height: 6rem;
    object-fit: contain;
}
.client-logo-box:hover {
    transform: translateY(-5px);
}

/* services */
.service-section {
	background-image: url(https://pencilart.in/wp-content/uploads/2025/12/services-bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

/* contact us */
.contact-us {
	background: #3777bb;
	color: #fff;
	padding: 8rem 0;
}
.contact-us h2, .contact-us p {
	color: #fff;
}
.section.contact-us .intro h2 span {
	color: #fff;
}
.section.contact-us .intro p {
	
}

/* inner banner */
.inner-banner {
	padding: 5rem 0;
	background: #f2f2f2;
	color: #000;
	font-size: 3rem;
}
 .inner-banner  h1 {
	 color: #3777bb;
 }
.servicepg-guidelines h3 {
	color: #3777bb;
}
section.servicepg-guidelines {
	background: #f2f2f2;
}
.servicepg-guidelines ul {
	padding: 0;
	margin: 1rem 0;
}
.servicepg-guidelines ul li {
	list-style: none;
	position: relative;
	padding-left: 1.55rem;
}
.servicepg-guidelines ul li:before {
	content: '';
	position: absolute;
	background-image: url(https://pencilart.in/wp-content/uploads/2026/01/checkmark.png);
	background-repeat: no-repeat;
	background-size: contain;
	width: 1rem;
	height: 1rem;
	background-position: top left;
	top: 0.45rem;
	left: 0.25rem;
}
.mgs {
	margin: 2rem 0;
}
, 
.service-grid .bg .service-box a, 
.service-grid .bg .service-box h4 {
	text-decoration: none !important;
}

/* footer */

footer {
    padding: 3rem 0;
}
footer img {
    width: 75%;
}

/* --------------------
   RESPONSIVE
--------------------- */
@media (max-width: 767px) {
footer img {
    width: 85%;
	margin: 3rem 0;
}
.row.service-grid, .ourwork-flex {
    display: block;
}
.service-box {
	margin: 2rem;
}
.contact-us {
    padding: 3rem 0;
}
}