/* ============================================
   KATCO HOME PAGE - page-home.css
   ============================================ */

/* ---- HERO SECTION ---- */
.home-hero{ position:relative; background-color:#FFFFFF; }
.home-hero::before{ content:""; position:absolute; bottom:-1rem; left:30%; width:40%; height:2rem; background-color:#00000020; filter: blur(20px); z-index:-1; }
.home-hero-content{ position:relative; z-index:2; }
.home-hero-subtitle{ font-size:1.7rem; font-weight:600; color:var(--color-secondary); margin-bottom:0.5rem; }
.home-hero-title{ font-size:3rem; font-weight:900; line-height:1; color:var(--color-secondary); margin:0 0 1rem 0; letter-spacing:-0.03em; }
.home-hero-title span{ display:block; }
.home-hero-title img{ display:block; width:100%; height:auto; max-width:24rem; }
.home-hero-tagline{ font-size:1.2rem; font-weight:300; color:var(--color-secondary); line-height:1.3; margin-top:1.5rem; }
.home-hero-tagline span{ font-size:inherit; font-weight:inherit; color:inherit; }
.home-hero-image{ position:relative; text-align:center; margin-top:2rem; }
.home-hero-image img{ width:100%; height:auto; }
.home-hero-k-bg{ position:absolute; top:-2rem; right:-4rem; width:24rem; height:24rem; opacity:0.15; z-index:0; }

@media (min-width:768px){
	.home-hero{ padding:6rem 0 0 0; }
	.home-hero-title{ font-size:4.5rem; }
	.home-hero-tagline{ font-size:2rem; }
	.home-hero-image{ margin-top:0; }
	.home-hero-k-bg{ width:36rem; height:36rem; top:-5rem; right:-6rem; opacity:0.12; }
}

.home-about{ position:relative; padding:0 0 6rem 0; box-shadow:inset 0 -1rem 2rem rgba(0,0,0,0.05); }