@font-face { font-family: JostSemiBoldItalic; src: url(./../../fonts/Jost-SemiBoldItalic.ttf); font-display: swap; }
@font-face { font-family: JostMediumItalic; src: url(./../../fonts/Jost-MediumItalic.ttf); font-style: italic; font-display: swap; }

html, body { min-width: 340px; }
h1 { font-family: InterBlack; font-size: 7rem; }
h2 { font-family: JostSemiBoldItalic; font-size: 3.5rem; line-height: 1.2; }
h3 { font-family: InterBlack; font-size: 2.7rem; margin-top: 50px; margin-bottom: 20px; }
h4 { font-family: InterBlack; font-size: 2.3rem; }

.prd-headline { font-size: 2.3em; font-weight: 700; font-family: InterBlack; }
.content-width { max-width: 1100px; width: 100%; margin: 0 auto; }
.blk-space, .x-space { padding-left: 3%; padding-right: 3%; }
.blk-space, .y-space { padding-top: 3rem; padding-bottom: 3rem; }

.green1 { color: #257376; }
.red1 { color: #ff0000; }
.white { color: #fff; }
.orange1 { color: #fb5507; }
.blue1 { color: #2488bf; }

.center { margin-left: auto; margin-right: auto; display: block; }

.check-mark-ul { list-style: none; }
.check-mark-ul li { margin-bottom: 1em; }
.check-mark-ul li:last-child { margin-bottom: 0; }
.check-mark-ul li:before { content: ''; display: block; width: 1em; height: 1em; background: url(./../images/check-icon.png) center no-repeat; background-size: 98%; position: absolute; margin-left: -1.5em; margin-top: 0.1em; }

.cta-btn1 { display: block; margin: 0 auto; max-width: 450px; }
.signature { font-family: JostMediumItalic; line-height: 1.2; font-style: italic; }

.blk1 { background: #fff url(./../images/unstuck-bg-1.webp) top center no-repeat; background-size: cover; }
.blk1-flex { padding-top: 3rem; display: flex; align-items: center; justify-content: space-between; }
.blk1-head { flex-basis: 560px; flex-shrink: 0; text-align: center; }
.blk1-img1 { margin-bottom: -3rem; }
.blk1-img2 { padding: 3rem 5rem 0 5rem; margin-bottom: -3rem; }
.blk1-img1 img, .blk1-img2 img { max-width: 500px; }

.blk2 { background-image: url(./../images/triangle-1.svg), url(./../images/triangle-2.svg); background-color: #fff; background-size: 18%, 18%; background-repeat: no-repeat; background-position: top left, bottom 4rem right; }
.blk2-img1 { max-width: 400px; padding-left: 3rem; margin-bottom: 2rem; float: right; }
.blk2-img2 { max-width: 240px; padding-right: 3rem; margin: 2rem 0; float: left; }
.blk2-img3 { max-width: 300px; padding-right: 3rem;  margin: 0; float: left; }

.blk3 { background-color: #f7fdfb; }
.blk3-box { margin: 1rem 0; padding: 3rem; background-color: #fff; box-shadow: 0px 0px 10px -5px rgb(0 0 0 / 50%); border: 2px solid #aed5c8; border-radius: 7px; }
.blk3-ul { margin: 0; }
.blk3-ul li { margin: 1em 0 0 0; }

.blk4 { background-color: #fff; }
.blk4-img1 { max-width: 270px; margin-right: 2rem; margin-bottom: 1rem; float: left; }
.blk4-indent { position: relative; left: -4rem; }

.blk5 { background-color: #f7fdfb; position: relative; border-bottom: 4px solid #90dfe3; }
.blk5-flex { display: flex; align-items: flex-end; justify-content: center; }
.blk5-content { flex-grow: 1; }
.blk5-img { max-width: 260px; right: 2rem; bottom: 0; position: absolute;  }
.blk5-img img { display: block;  }
.blk5-ul { margin: 0 0 0 3rem; }
.blk5-ul li:last-child { margin-bottom: 0; }

.blk6 { background-color: #fff; position: relative; }
.blk6:before { content: ''; transform: scaleX(-1); background-image: url(./../images/triangle-1.svg), url(./../images/triangle-2.svg); 
    background-size: 18%, 18%; background-repeat: no-repeat; background-position: top 4rem left, bottom 4rem right;
    position: absolute; width: 100%; height: 100%; z-index: 0; top: 0; left: 0; }
.blk6 .content-width { z-index: 1; position: relative; }
.blk6-img1 { float: right; max-width: 450px; width: 100%; margin-left: 2rem; }
.blk6-img2 { float: right; max-width: 280px; width: 100%; margin: 0 -3rem 2rem 2rem; }
.blk6-img3 { float: left; max-width: 178px; width: 100%; margin: 0 2rem 4rem 0; }
.blk6-box { max-width: 700px; margin: 0 auto; padding: 3rem; background-color: #fff; border-radius: 10px; box-shadow: 0px 0px 10px -5px rgb(0 0 0 / 50%); border-left: 10px solid #ff0000; }
.blk6-box ol { margin: 0; }
.blk6-box ol li:last-child { margin-bottom: 0; }

.blk7 { background: url(./../images/unstuck-bg-2.webp) center right no-repeat; background-size: cover; margin-top: 25px; }
.blk7-flex { display: flex; align-items: center; justify-content: space-between; }
.blk7-content { margin: 3rem 2rem 3rem 0; }
.blk7-img1 { flex-basis: 270px; flex-shrink: 0; margin: -4rem 3rem 0 -10rem; position: relative; z-index: 1; }
.blk7-img1 img { display: block; }
.blk7-head { margin: 0 0 1em -4rem; }
.blk7-indent { margin-left: 2rem; }

.blk8 { background-color: #fff; }
.blk8-box { background: #f7f7f7; padding: 3rem; border-left: 5px solid #90dfe3; margin: 3rem; }
.blk8-img1 { max-width: 320px; width: 100%; float: right; margin: 0 0 2rem 5rem; }
.blk8-head1 { max-width: 980px; width: 100%; margin-left: auto; margin-right: auto; }

.blk9 { background-color: #90dfe3; }

.blk10 { background-color: #f5f5f5; background: linear-gradient(to bottom, #f5f5f5 70%, #fff); position: relative; }
.blk10-content { width: 80%; padding: 4rem 0; position: relative; z-index: 1; }
.blk10-img1 { position: absolute; top: 0; right: 0; height: 100%; width: auto; z-index: 0; }
.blk10-img1 img { height: 100%; width: auto; }

.blk11 { background-color: #fff; }
.blk11-head1 { margin: 0 -1rem; }
.blk11-head2 { max-width: 700px; margin-left: auto; margin-right: auto; }
.blk11-img1 { max-width: 180px; width: 100%; float: right; margin: -2rem 0 2rem 6rem; }

.blk12 { background-image: url(./../images/triangle-1.svg),  url(./../images/triangle-2.svg); background-color: #fff;
    background-size: 16%, 16%; background-repeat: no-repeat; background-position: top left, bottom right;
    overflow: auto; padding-bottom: 3rem; 
}
.blk12-img1 { float: right; max-width: 350px; margin: 0 0 2rem 7rem; }

.blk13 { padding-top: 6rem; padding-bottom: 6rem; background: #e2dfda linear-gradient(to bottom, #fff, #e2dfda 15% 85%, #fff); position: relative; overflow: hidden; }
.blk13-head1 { max-width: 1062px; margin-top: 0; margin-left: auto; margin-right: auto; z-index: 1; position: relative; }
.blk13-content { margin-right: 10%; z-index: 1; position: relative; }
.blk13-img1 { position: absolute; bottom: 0; right: 0; z-index: 0; max-width: 340px; width: 100%; height: auto; }

.blk14 { background-color: #fff; }
.blk14 .content-width { position: relative; z-index: 1; }

.blk15 { background: #fff url(./../images/unstuck-bg-5.webp) center no-repeat; background-size: cover; position: relative; }
.blk15 .content-width { z-index: 1; position: relative; }
.blk15-box ul { margin: 0; }
.blk15-box { margin: 1rem 0 -6rem; padding: 3rem; background-color: #fff; box-shadow: 0px 0px 10px -5px rgb(0 0 0 / 50%); border: 2px solid #aed5c8; border-radius: 7px; }
.blk15-img1 { position: absolute; height: 170%; width: auto; top: -35%; left: 0; z-index: 0; }

.blk16 { background: #fff url(./../images/triangle-2.svg) bottom 3rem right no-repeat; background-size: 18%; }
.blk16-head1 { max-width: 880px; margin: 2.5em auto 1em; display: block; }
.blk16-head2 { max-width: 820px; margin: 2em auto 1em; display: block; }
.blk16-img1 { max-width: 600px; width: 100%; margin: 3rem auto; display: block; }

.blk17 { background: url(./../images/unstuck-bg-6.webp) center no-repeat; background-size: cover; position: relative; }
.blk17 .content-width { max-width: 660px; margin: 0 auto; }
.blk17-img1 { position: absolute; left: -2%; bottom: -30%; width: 18%; z-index: 1; }

.blk18 { background: #fff url(./../images/unstuck-bg-8.webp) top center no-repeat; background-size: 100% auto; position: relative; overflow: hidden; }
.blk18-img1 { float: right; margin: 0 -2rem 0 3rem; max-width: 300px; }
.blk18-line { border-top: 4px solid #2488bf; display: block; }
.blk18-img2 { float: left; margin: 0 3rem 0 0; max-width: 280px; }
.blk18-img3 { position: absolute; left: 0; width: 26%; margin-top: -20%; z-index: 0; }
.blk18-img4 { position: absolute; right: 0; bottom: -5%; width: 24%; margin-top: -20%; z-index: 0; }
.blk18-index { z-index: 1; position: relative; }



.blk19 { background: url(./../images/unstuck-bg-9.webp) center no-repeat; background-size: cover; }

.blk20 { background: #fff; position: relative; }
.blk20 .content-width { z-index: 1; position: relative; }
.blk20:before { content: ''; transform: scaleX(-1); background-image: url(./../images/triangle-1.svg); 
    background-size: 18%; background-repeat: no-repeat; background-position: top -13% left;
    position: absolute; width: 100%; height: 100%; z-index: 0; top: 0; left: 0; }
.blk20-flex { display: flex; align-items: center; justify-content: space-between; }
.blk20-img1 { flex-basis: 110px; flex-shrink: 0; margin-right: 3rem;  }
.blk20-head1 { max-width: 850px; }
.blk20-img2 { float: right; max-width: 280px; margin: -2rem 0 0 3rem; }


.blk21 { background: #f9f9f9 url(./../images/ques-bubble.webp) right center no-repeat; background-size: 300px; }

.collapse-toggle { background: #90dfe3; padding: 1rem 2rem 1rem 5rem; margin-top: 3rem; cursor: pointer; position: relative; color: #257376; font-weight: 600; font-family: JostSemiBoldItalic; }
.collapse-toggle svg { width: 1em; height: 1em; fill: #257376; margin: 0.35rem 1rem 0 -3rem; position: absolute; }
.collapse { height: 0; opacity: 0; overflow: hidden; }
.collapse-content { padding: 3rem; background: #fff; } 
.collapse-toggle.active { background: #e7e7e7; color: #000; }
.collapse-toggle.active svg { fill: #000; }

@media only screen and (max-width: 1750px) {
    .blk1-img2 { padding: 1rem 2rem 0 2rem; margin-bottom: -2rem; }
    .blk1-img1 img, .blk1-img2 img { max-width: 400px; width: 100%; }
}

@media only screen and (max-width: 1650px) {
    .blk5-ul { margin-left: 0; }
    .blk5-img { max-width: 220px; margin: 0 0 -3rem 2rem; right: 0; position: relative; flex-shrink: 0; }

    .blk10-content { width: 70%; }
}

@media only screen and (max-width: 1550px) {
    .blk17-img1, .blk18-img4 { display: none; }

    .blk19 { background-position: left center; }
}

@media only screen and (max-width: 1400px) {
    .blk1-img1 { display: none; }
    .blk1-head { flex-basis: auto; flex-grow: 1; flex-shrink: 1; margin: 0 2rem; }

    .blk10-content { width: 60%; }

    .blk13-content { margin-right: 26%; }
    .blk13-img1 { right: -2rem; }

    .blk18-img3 { width: 23%; margin-top: -13%; }
}

@media only screen and (max-width: 1200px) {
    .blk4-indent { left: 0; }

    .blk7-img1 { flex-basis: auto; max-width: 160px; margin: 3rem auto -2rem; }
    .blk7-flex { flex-direction: column; }
    .blk7-content { margin-right: 0; }
    .blk7-head, .blk7-indent { margin-left: 0; }

    .blk10-content { width: 100%; padding: 0; }
    .blk10-img1 { opacity: 0.2; }

    .blk17 { background-image: url(./../images/unstuck-bg-7.webp); }
    .blk17-br1 { display: none; }

    .blk20:before { background-position: top -7% left; }
}

@media only screen and (max-width: 1040px) {
    .blk1 { background-position: top left; }
    .blk1-img2 { display: none; }

    .blk12-br1, .blk13-img1 { display: none; }
    .blk13-content { margin-right: 0; }
}

@media only screen and (max-width: 1000px) {
    .blk2 br, .blk4 br { display: none; }
    .blk2 {  background-size: 40%, 40%;  }
    .blk2-img1, .blk2-img2, .blk4-img1, .blk6-img1, .blk6-img2, .blk6-img3, .blk11-img1, .blk12-img1, .blk18-img1, .blk2-img3 { float: none; display: block; margin: 3rem auto; padding: 0; }

    .blk2-img1, .blk2-img2 .blk6-img1, .blk6-img2, .blk6-img3, .blk2-img3 { max-width: 300px; }
    .blk4-img1, .blk11-img1, .blk12-img1, .blk18-img1 { max-width: 230px; }

    .blk6-br2 { display: none; }

    .blk15-img1 { height: 150%; top: -25%; }
}

@media only screen and (max-width: 900px) {
    .blk5-flex { flex-direction: column-reverse; }
    .blk5-img { margin: 0 auto; max-width: 120px; }
    .blk5-content h3 { text-align: center; }

    .brk8-br1, .blk19-br1  { display: none; }

    .blk18-img2 { display: block; float: none; max-width: 250px; margin: 0 auto; }

    .blk20-flex { flex-direction: column; }
    .blk20-img1 { margin-bottom: 2rem; }
}

@media only screen and (max-width: 800px) {
    .blk20-img2 { display: block; float: none; max-width: 280px; width: 70%; margin: 0 auto 20px; }
}

@media only screen and (max-width: 600px) {
    html { font-size: 8px; }
    h1 { font-size: 6rem; }
    h2 { font-size: 3.2rem; }

    .blk1-flex { padding: 2rem 3rem; max-width: 600px; margin: 0 auto; }
    .blk1 br { display: none; }

    .blk6-br1 { display: none; }
}

@media only screen and (max-width: 500px) {
    html { font-size: 8px; }
    h1 { font-size: 6rem; }
    h2 { font-size: 3.2rem; }

    .blk1-flex { padding: 2rem 3rem; max-width: 600px; margin: 0 auto; }
    .blk1 br { display: none; }

    .blk6-br1 { display: none; }
}