/* ==========================
   /* ==========================
   MOBILE RESPONSIVE FIX
========================== */

@media only screen and (max-width:768px){

/* Container */
.container{
width:100% !important;
max-width:100% !important;
padding-left:15px !important;
padding-right:15px !important;
margin:0 auto !important;
}

/* Sections */
section{
padding:40px 0 !important;
}

/* HERO */
.hero{
min-height:75vh !important;
height:auto !important;
padding:60px 0 !important;
}

.hero-content{
max-width:100% !important;
padding:0 !important;
text-align:left !important;
}

.hero-content h1{
font-size:26px !important;
line-height:1.2 !important;
margin-bottom:15px !important;
}

.hero-content p{
font-size:14px !important;
line-height:1.7 !important;
}

/* Headings */
.section-title h2,
.what-content h2,
.final-content h2{
font-size:26px !important;
line-height:1.2 !important;
text-align:center !important;
}

.section-title p,
.what-content p,
.final-content p{
font-size:14px !important;
line-height:1.7 !important;
}

/* Images */
.what-image img,
.final-image img,
.service-box img,
.pillar-image img,
.blog-card img,
.post-card img,
.blog-box img{
width:100% !important;
height:auto !important;
max-width:100% !important;
display:block !important;
object-fit:cover !important;
}

/* Layout */
.what-wrap,
.final-wrap,
.pillars-grid,
.service-grid,
.blog-grid,
.blog-wrap,
.posts-grid,
.blog-container{
display:grid !important;
grid-template-columns:1fr !important;
gap:20px !important;
}

/* Cards */
.pillar-card,
.service-box,
.blog-card,
.post-card,
.blog-box{
width:100% !important;
max-width:100% !important;
padding:16px !important;
border-radius:20px !important;
overflow:visible !important;
display:block !important;
}

/* Text */
.pillar-card h3,
.service-box h3,
.blog-card h2,
.blog-card h3,
.post-card h2,
.post-card h3{
font-size:18px !important;
line-height:1.3 !important;
}

.pillar-card p,
.service-box p,
.blog-card p,
.post-card p{
font-size:14px !important;
line-height:1.7 !important;
}

/* Final Banner */
.final-banner{
padding:25px 15px !important;
border-radius:20px !important;
}

/* Blog Force Show */
.blog-section,
.blog,
.blog-grid,
.blog-wrap,
.blog-container,
.blog-list,
.posts-grid,
.post-list{
display:block !important;
visibility:visible !important;
opacity:1 !important;
height:auto !important;
max-height:none !important;
overflow:visible !important;
position:relative !important;
}

/* Blog Content */
.blog-content,
.post-content{
display:block !important;
visibility:visible !important;
opacity:1 !important;
padding:15px 0 !important;
}

/* Buttons */
.blog-btn,
.read-more-btn{
display:inline-block !important;
width:100% !important;
text-align:center !important;
padding:12px 15px !important;
margin-top:10px !important;
}

/* Fix Hidden Elements */
[class*="blog"]{
visibility:visible !important;
opacity:1 !important;
}

/* Better spacing */
.hero-content,
.what-content,
.final-content{
text-align:left !important;
}

}