/* =========================================
SECTION TITLE
========================================= */

.section-title{

text-align:center;

margin-bottom:60px;

}

.section-title span{

display:inline-block;

color:#d4a017;

font-weight:700;

letter-spacing:3px;

text-transform:uppercase;

margin-bottom:10px;

}

.section-title h2{

margin-top:10px;

font-size:2.5rem;

color:#143a52;

}


/* =========================================
HERO SUBTITLE
========================================= */

.hero-subtitle{

display:inline-block;

color:#d4a017;

font-weight:700;

letter-spacing:4px;

text-transform:uppercase;

margin-bottom:20px;

}

/* HERO */

.media-hero{

padding:180px 0 120px;

background:
linear-gradient(
rgba(15,35,55,.82),
rgba(15,35,55,.82)
),
url('../images/church.png');

background-size:cover;
background-position:center;

text-align:center;

}

.media-hero h1{

font-size:4.5rem;

color:#fff;

margin-bottom:20px;

}

.media-hero p{

max-width:750px;

margin:auto;

color:#fff;

line-height:1.8;

}


/* LIVE */

.live-section{

padding:100px 0;

background:#fff;

}

.live-card{

max-width:800px;

margin:auto;

padding:60px;

background:#f8fafc;

border-radius:20px;

text-align:center;

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.live-card i{

font-size:60px;

color:#d4a017;

margin-bottom:20px;

}


/* MEDIA GRID */

.sermons-section,
.videos-section{

padding:100px 0;

}

.media-grid{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:25px;

}

.media-card{

background:#fff;

border-radius:20px;

overflow:hidden;

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.media-card img{

width:100%;

height:240px;

object-fit:cover;

}

.media-card h3{

padding:20px 20px 10px;

}

.media-card p{

padding:0 20px 25px;

}


/* GALLERY */

.gallery-section{

padding:100px 0;

background:#f8fafc;

}

.gallery-grid{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:20px;

}

.gallery-grid img{

width:100%;

height:260px;

object-fit:cover;

border-radius:15px;

}


/* CTA */

.media-cta{

padding:100px 0;

background:#143a52;

text-align:center;

}

.media-cta h2{

color:#fff;

margin-bottom:20px;

}

.media-cta p{

color:#dbe4ef;

max-width:700px;

margin:auto;

margin-bottom:30px;

}

.media-cta .btn-outline{

color:#ffffff !important;

border:2px solid #ffffff !important;

background:transparent;

}
.media-cta .btn-outline:hover{

background:#ffffff;

color:#143a52 !important;

}

/* MOBILE */

@media(max-width:991px){

.media-grid{

grid-template-columns:1fr;

}

.gallery-grid{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:768px){

.media-hero h1{

font-size:2.8rem;

}

.gallery-grid{

grid-template-columns:1fr;

}

.live-card{

padding:30px;

}

}