/**********************/
/*** GENERAL STYLES ***/
/**********************/

a { outline:none!important; }

/************************/
/** SINGLE PAGE HEADER **/
/************************/


.single-page-header { position:relative; height:25rem; overflow:hidden; background:#999; }
.single-page-header img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:grayscale(100%) }
.single-page-header > div { position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; display:flex; align-items:center; justify-content:center; padding-top:2rem; background:#0006; }
.single-page-header h1 { color:#fff; font-size:3rem; }


@media( max-width:1000px ){ 
.single-page-header { height:20rem; } 
.single-page-header h1 { font-size:2.5rem; } 
}

@media( max-width:700px ){ 
.single-page-header { height:15rem; } 
.single-page-header h1 { font-size:2rem; } 
}

@media( max-width:500px ){ 
.single-page-header { height:10rem; } 
.single-page-header h1 { font-size:1.5rem; } 
}


/******************/
/** KEY FEATURES **/
/******************/

.key-features { padding:6.5rem 1rem; color:#555; }

.key-features > h2 { max-width:600px; text-align:center; color:#224; font-size:2.3rem; font-weight:500; margin:0 auto; }
.key-features > p { padding:1rem 0 2.5rem; max-width:600px; margin:0 auto; line-height:1.4; color:#777; text-align:center; }

.key-features section img { display:block; width:3rem; }

.key-features .inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr 1fr; gap:1.5rem; justify-content:space-between; align-items:stretch; }

.key-features .inner section { font-size:1rem; padding:2rem 1.2rem; box-shadow:0 0 3px 2px #00000015; border-radius:10px; /* flex:1 */; }

.key-features .inner section header { font-weight:700; color:#224; font-size:1.2rem; padding:0.5rem 0 }
.key-features .inner section p { padding:0 0 1rem; line-height:1.5 }


@media( max-width:800px ){
.key-features .inner { grid-template-columns:1fr 1fr; }
}


@media( max-width:550px ){
.key-features .inner { grid-template-columns:1fr; }
}

/*****************/
/*** OUR STATS ***/
/*****************/

.stat > div { background-image:linear-gradient(to right, #ffd700 0%, #ffd700 50%, #fff 50%, #fff 100%) }

.stat .inner { max-width:1400px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; }

.stat .inner > section.info { display:flex; flex-direction:column; justify-content:center; padding:3rem 2rem; align-items:flex-start; gap:2rem; background-color:#ffd700; }

.stat .inner > section.info p { opacity:0.75; line-height:1.6; }
.stat .inner > section.info h2 { letter-spacing:0.1rem; font-size:1.2rem }
.stat .inner > section.info h3 { font-size:2.5rem; line-height:1.1 }
.stat .inner > section.info a { display:inline-block; background:#000; color:#fff; padding:0.75rem 2rem; letter-spacing:0.1rem; font-size:0.9rem; }
.stat .inner > section.info button { display:inline-block; background:#000; color:#fff; padding:0.75rem 2rem; letter-spacing:0.1rem; font-size:0.9rem; }

.stat .inner > section.numbers { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #0003;  }
.stat .inner > section.numbers > div { height:100%; border:1px solid #0003; border-left:none; border-top:none; padding:2rem; display:flex; justify-content:center; align-items:center; color:#000a; text-align:center }
.stat .inner > section.numbers > div strong { display:block; color:#222; font-weight:700; font-size:3.5rem; }

@media( max-width:800px ){
.stat > div { background:#fff; }
.stat .inner > section.info { align-items: center }
.stat .inner { grid-template-columns:1fr }
}
@media( max-width:550px ){
.stat .inner > section.numbers > div strong { font-size:2rem; }
.stat .inner > section.info h3 { font-size:1.5rem; }
}


/*****************/
/*** NAMEPLATE ***/
/*****************/

.nameplate { position:relative;  }
.nameplate img { position:absolute; width:100%; height:100%; top:0; left:0; right:0; bottom:0; object-fit:cover; z-index:-1; }
.nameplate > div { height:100%; width:100%; position:relative; z-index:1; background:#000a; min-height:450px;
display:flex; align-items:center; justify-content:center; color:#fff; font-size:3rem; font-weight:500; }
.nameplate > div a { color: #FF7700; }

.nameplate .links { text-align:center; font-size:1.2rem; font-weight:700 }
.nameplate h1 { font-size:4rem; text-align:center; color:#fff; font-weight:700; text-shadow:0 0 2px #000 }

@media( max-width:650px ){ 
.nameplate h1 { font-size:2rem; } 
.nameplate > div { min-height:300px; }
.nameplate .links { font-size:1rem; }
}



/*********************/
/*** SERVICE BLOCK ***/
/*********************/

.services { padding:2rem 1rem; }
.services header { display:flex; align-items:center; letter-spacing:0.2rem; margin-bottom:1rem;}
.services .line { height:2px; width:2.3rem; background:#0077C0; margin-right:1.2rem; }
.services .inner { display:flex; align-items:stretch; max-width:1400px; margin:0 auto; }
.services .txt { display:flex; flex-direction:column; gap:0.7rem; padding:3rem 2.52rem; justify-content:center }
.services p { padding:0.5rem 0; line-height:1.6; color:#777; font-size:1.1rem }
.services h3 { font-size:2.3rem; font-weight:400; line-height:1.2 }

.services .inner > section { width:50%; position:relative; min-height:450px }

.services .img > div { height:100%; width:100%; background:#0005; }
.services img { height:100%; width:100%; object-fit:cover; display:block }

.services.left .img { order:1; }
.services a { display:inline-block; padding:1rem 2rem; font-size:1.1rem; background:#0077C0; color:#fff; font-weight:600; text-decoration:none; align-self:flex-start; border-radius:2rem; }

.services ol, .services ul { margin-left:1.3rem; font-size:1rem; margin-bottom:1rem; color:#777; }

@media( max-width:850px ){
.services .inner { flex-flow:row wrap }
.services .inner > section { width:100%; }
.services .img { order:1; }
}


/****************/
/*** MORTUARY ***/
/***************/


#impact { padding:4rem 1rem; background:#000; color:#fff; }
#impact .inner { max-width:1300px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:6rem; }

#impact .img { background:#000; position:relative; }

#impact .inner .txt { padding:3rem 0; display:flex; flex-direction:column; gap:1rem; }

#impact .txt header { font-size:1.3rem; font-weight:600; color:#e3e3e3; color:darkorange; letter-spacing:0.08rem; }

#impact .txt p { line-height:1.75; color:#777; padding:1rem 0}

#impact .txt ul { display:grid; grid-template-columns:1fr; gap:0.5rem; list-style:none; }
#impact .txt li { display:flex; align-items:flex-start; padding:0.2rem; line-height:1.3; font-size:1rem; }
#impact .txt li::before {
content: '';
display: inline-block;
width: 20px;
height: 20px;
background-image: url('/svg/tick.svg');
background-size: contain;
background-repeat: no-repeat;
margin-right: 5px;
vertical-align: middle;
}

#impact .txt h2 { font-size:2rem; font-weight:600; line-height:1.2;  padding:1rem 0; }

#impact .large { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:0; }
#impact .small { position:absolute; bottom:-8%; right:-10%; width:80%; aspect-ratio:6/4; object-fit:cover; z-index:1; border:7px solid #fff; }

@media( max-width:1150px ){
#impact .txt ul { grid-template-columns:1fr; }
}

@media( max-width:1000px ){
#impact .inner { grid-template-columns:1fr;  }
#impact .img { display:none; }
}


@media( max-width:1000px ){
#impact .txt ul { grid-template-columns:1fr}
}


/*********************/
/*** WHAT WE OFFER ***/
/*********************/

.whatweoffer{ padding:4rem 1rem; background:#f3f3f3; }
.whatweoffer .inner { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:2rem; max-width:1200px; margin:0 auto; }


.whatweoffer .inner section { background:#fff; padding:2.3rem 1.5rem; }
.whatweoffer .inner section img { display:block; width:4rem; height:4rem; margin:0.5rem auto; }
.whatweoffer .inner section header { font-size:1.2rem; font-weight:600; text-align:center; }
.whatweoffer .inner section p { font-size:1rem; color:#777; line-height:1.6; text-align:center; }


@media( max-width:1000px ){ .whatweoffer .inner { grid-template-columns:1fr 1fr 1fr; } }
@media( max-width:700px ){ .whatweoffer .inner { grid-template-columns:1fr 1fr; } }
@media( max-width:500px ){ .whatweoffer .inner { grid-template-columns:1fr; } }


/******************/
/*** HOME INTRO ***/
/******************/

.home-intro { padding:3rem 1rem; }
.home-intro .inner { max-width:1200px; margin:0 auto;display:grid; grid-template-columns:1fr 1fr; gap:3rem; }

.home-intro .text > div { padding:2rem 0; display:flex; flex-direction:column; gap:1rem; align-items:flex-start; justify-content:center; }

.home-intro .text p { color:#777; line-height:1.5; padding:0.5rem 0; }
.home-intro .text a { color:#555; display:inline-block; margin-right:1rem; padding:0.5rem 1rem; text-decoration:none;
border:1px solid #333; border-radius:4px; }
.home-intro .text header { color:#333; font-weight:600; font-size:2rem;  }
.home-intro .text h2 { color:slateblue; font-weight:600; font-size:1.2rem; letter-spacing:0.14rem; text-transform:uppercase;  }

.home-intro .img { border-radius:10px; position:relative; overflow:hidden;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; }
.home-intro .img img { position:absolute; width:100%; height:100%; object-fit:cover; display:block; }

@media( max-width:750px ){
.home-intro .inner { grid-template-columns:1fr; gap:2rem; }
.home-intro .img { aspect-ratio:6/4; }
}


/**********************/
/*** VISION MISSION ***/
/**********************/

.about-us { padding:3rem 1rem; background:#fff }
.about-us .inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:2rem; }


.about-us .inner > div { position:relative; }

.about-us .img { border-radius:6px; overflow:hidden; }
.about-us .img > div { position:relative; z-index:2; background:#0006; padding:2rem 1rem; color:#fff; display:flex; flex-direction:column; justify-content:flex-end; height:100%; }
.about-us .inner > div img { display:block; position:absolute; top:0; left:0; bottom:0; right:0; object-fit:cover;width:100%; height:100%; }

.about-us header { font-weight:600; font-size:1.32rem; }
.about-us p { line-height:1.5; padding:0.5rem 0 }

.about-us .info { display:flex; flex-direction:column; gap:1.2rem; }
.about-us .vision { background:aliceblue; padding:2rem 1rem; border-radius:6px; }
.about-us .mission { background:dodgerblue; padding:2rem 1rem; border-radius:6px; color:#fff }


@media( max-width:1000px ){ 
.about-us .img { aspect-ratio:6/2.5; }
.about-us .inner { grid-template-columns:1fr; } 
.about-us .info { flex-direction:row; }
}


@media( max-width:800px ){ .about-us .img { aspect-ratio:6/3; } }
@media( max-width:600px ){ 
.about-us .img { aspect-ratio:6/4; } 
.about-us { padding:3rem 0; }
.about-us .info { flex-direction:column; }
}


/***************/
/*** OUR CEO ***/
/***************/

#our-chairman { padding:5rem 0rem;  }
#our-chairman .inner { display:grid; grid-template-columns:1fr 1fr; gap:2rem; max-width:1200px; margin:0 auto; 
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; border-radius:10px; overflow:hidden; background:white; }

#our-chairman .text { padding:2.5rem 2rem; display:flex; flex-direction:column; gap:1.2rem; }
#our-chairman .text p { color:#777; line-height:1.6;  font-size:1rem; }
#our-chairman .img { position:relative; background:black }
#our-chairman .img img { display:block; position:absolute; object-fit:cover; width:100%; height:100%; }

#our-chairman .text h2 { font-size:1.8rem; font-weight:600; }

@media( max-width:800px ) {
#our-chairman .inner { grid-template-columns:1fr; }
#our-chairman .img { background:transparent; display:flex; align-items:center; justify-content:center; padding:1.5rem; }
#our-chairman .img img { position:relative; width:100%; max-width:600px; }
}