.homepage-hero-container { padding: 34px 0 0; color: var(--nhc-white); }
.homepage-hero-shape { width: 100%; height: calc(100% + 330px); position: absolute; top: 0; left: 0; background:var(--nhc-gradient-pink-indigo); clip-path: polygon(0% 0%, 100% 0%, 100% 77%, 0% 100%); }
.homepage-hero-shape img { width: 1290px; height: 1221px; object-fit: cover; position: absolute; top: 180px; left: calc(50% - 1448px); }
.homepage-hero-text { max-width: 675px; height: 100%; padding-top: 78px; }
.homepage-hero-text h1 { font-size: 80px; margin-bottom: 0; }
.homepage-hero-btn { margin-top: 32px; }
.homepage-hero-img { padding-bottom: 77.7%; margin-right: -176px; z-index: 2; }
.homepage-hero-img img { width: 100%; height: 100%; object-fit: contain; position: absolute; inset: 0; object-position: bottom; }
.homepage-hero-img::after { content: ''; width: 100vw; height: 90.5%; position: absolute; bottom: 0; left: 38px; background: var(--nhc-gradient-green); border-radius: 235px 0 0 35px; z-index: -1; }
/* ========================================== 
! Extra Large devices (desktops, less than 1600px)
=========================================== */
@media (max-width:1599.98px) {
 .homepage-hero-shape { width: 100%; height: calc(100% + 270px); }
.homepage-hero-text h1 { font-size: 72px; }
 }
/* ========================================== 
! Large devices (desktops, less than 1200px)
=========================================== */
@media (max-width:1199.98px) {
 .homepage-hero-container { padding: 80px 0; }
.homepage-hero-shape { height: 100%; clip-path: none; }
.homepage-hero-text { max-width: 100%; height: auto; padding-top: 0; margin-bottom: 80px; }
.homepage-hero-text h1 { font-size: 60px; }
 }
/*==========================================
! Medium devices (tablets, less than 992px)
========================================== */
@media (max-width:991.98px) {
 .homepage-hero-container { padding: 64px 0; }
.homepage-hero-text { margin-bottom: 64px; }
.homepage-hero-text h1 { font-size: 64px; }
 }
/* =================================================  
! Small devices (landscape phones, less than 768px)
================================================= */
@media (max-width:767.98px) {
 .homepage-hero-container { padding: 34px 0; }
.homepage-hero-shape img { width: 393px; height: 485px; top: 46px; left: -118px; }
.homepage-hero-text { margin-bottom: 48px; }
.homepage-hero-text h1 { font-size: 50px; }
.homepage-hero-btn { margin-top: 20px; }
.homepage-hero-img { padding-bottom: 82%; margin-right: -64px; }
.homepage-hero-img:after { left: 0; border-radius: 105px 0 0 15px; }
 }
/* ======================================================
! Extra small devices (portrait phones, less than 576px)
====================================================== */
@media (max-width:575.98px) {
 .homepage-hero-text h1 { font-size: 40px; }
 }