@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caudex:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* color guidelines */
:root, [data-bs-theme=light]{
--bs-primary:#2D486D;
--bs-primary-hover:#27596e;
--bs-secondary:#22AAB4;
--bs-secondary-hover:#1a8c94;
--bs-gray-900:#2D486D;
}
html{scroll-behavior: smooth;scroll-padding: 70px;}

body { font-family: "IBM Plex Sans", sans-serif;overflow-x: hidden; }
h1, h2, h3, h4, h5 { font-family: "Caudex", serif;font-weight: 600; }
h2{font-size: 3rem;line-height: 4rem;color:#302F2D;}
h3 {font-size: 1.5rem;}
p{font-size: 1rem;}
.site-btn {font-size: 1.25rem; position: relative; background: var(--bs-primary); color: #ffffff; padding: 0.7rem 1.5rem; border: 0; font-weight: 400; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);border-radius: 50px; }
.site-btn:hover { background:var(--bs-secondary); color: #fff; }
.site-btn.white_btn {background-color: #fff;color: var(--bs-gray-900);}
.site-btn.white_btn:hover{background-color: var(--bs-primary);color: #fff;}
.site-btn.gold-btn {background: var(--bs-secondary);border: 1px solid var(--bs-secondary);color: var(--bs-gray-900);box-shadow: none;}
.site-btn.gold-btn:hover{color:var(--bs-gray-900);background: var(--bs-secondary-hover) !important;}
@media (min-width:1600px){.container{max-width: 1600px;padding: 0 1.25rem;}.banner-content {padding-right: 2rem;}}
@media (max-width:1599px){.container{padding: 0 2.8rem;max-width: 100%;}}
:not(.btn-check)+.btn:active {background-color: var(--bs-primary-hover);color:#fff}
.container-fluid{max-width: 100%;padding-left: 2.8rem;padding-right: 2.8rem;}
.btn-search { display: inline-block; text-align: center; color: #000000; }
.site-navbar .site-navigation .site-menu > li > a.btn-search:hover {background: transparent;}
.text-warning { color: #D4925A !important; }
nav .navbar-brand img { width: 160px; }
div#sticky-wrapper.sticky-wrapper.is-sticky {background: #fff;z-index: 3;}
.sticky-wrapper .site-navbar{background-color: #fff;}
a.navbar-brand img {width: 235px;}
h3.brand-text {font-size: 32px;color: var(--bs-gray-900);}
h3.brand-text a{color: var(--bs-gray-900);}
@keyframes fade-up {
  from { opacity: 0; margin-top: 2rem; }
  to { opacity: 1; margin-top: 0; }
}
@keyframes fade-down {
  from { opacity: 1; margin-top: 0; }
  to { opacity: 0; margin-top: 4rem; }
}

/* main banner */
div#top-block{background: linear-gradient(
270deg, #22aab473, transparent, transparent);}
section#banner-block { padding: 5rem 0;}
.banner-content h1 { font-size: 3.3rem; font-weight: 800; color: var(--bs-primary); }
.banner-content h1 span { color: var(--bs-secondary); }
.banner-content p { font-size: 1.5rem; color: var(--bs-primary); margin: 1.25rem 0 2rem 0; }
.banner-btn a.site-btn { font-size: 26px; padding: 1.5rem 6.3rem 1.5rem 2.3rem;background: url(../images/call_btn_ic.svg) no-repeat #fff;background-position: right 6px center;font-weight: 600; }
.banner-box { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.banner-box .banner-grid { text-align: center; background: var(--bs-secondary); color: #fff; padding: 15px; border-radius: 15px; margin-top: 2.5rem; display: grid; place-content: center; }
.lead-form .form-field label { display: inline-block; width: 100%; font-weight: 600; margin-bottom: 10px; font-size: 1.25rem; color: var(--bs-primary); }
.lead-form { padding: 3rem; border-radius: 20px;  background: #fff; }
.lead-form .form-field input { width: 100%; padding: 17px 20px; background: #F7FBFF; border: 1px solid #D4D7E3; border-radius: 10px; color: #8897AD; margin-bottom: 15px; }
.lead-form .form-field input[type=submit] { font-size: 1.625rem; padding: 13px 20px; background: var(--bs-secondary); font-weight: 600; color: #fff; border-radius: 50px; margin-top: 15px; }
.lead-form .form-field input[type=submit]:hover{background: var(--bs-primary);}
.lead-form h2 { color: var(--bs-primary); }
.lead-form p { font-size: 1.5rem; margin-top: 15px; margin-bottom: 30px; }
.lead-form .form-field input::placeholder { color: #8897AD; font-size: 1.25rem; }
.banner-service .service-icon{margin: 0 auto;}
.banner-service h4{color: var(--bs-secondary);font-size: 18px;margin-top: 15px;}
.banner-service .service-grid {min-height: 215px;    box-shadow: 0px 0px 4px 2px #00000012;}
.banner-service{margin-bottom: 24px;}


/* service grid */
section#service-section { padding: 4rem 0; background-color: var(--bs-secondary); }
.service-grid { padding: 1.8rem; background: #fff; border-radius: 20px; box-shadow: 0px 0px 4px 2px #00000012; }
.service-icon { width: 70px; height: 70px; display: flex; justify-content: center; align-items: center; background: var(--bs-secondary); padding: 10px; border-radius: 50%; margin-bottom: 30px; transition: 0.3s ease; }
.service-icon img { width: 34px; }
.service-grid:hover .service-icon { background: var(--bs-primary); transition: 0.3s ease; }
.service-grid h4 { font-size: 24px; }


/* Plans section */
section#plans-block { background-color: #D8C7BD; background-image: url(../images/man_new.png); padding: 6rem 0; background-size: contain; background-repeat: no-repeat; background-position: bottom left; }
.plan-description { font-size: 1.375rem; background: #fff; padding: 2rem; border-radius: 20px; margin-top: 2rem; color: var(--bs-gray-900); }
.plan-description p { font-size: 1.375rem; }
.plan-description li { padding-bottom: 13px; font-weight: 600; }


/* Concierge section */
section#concierge-block { padding: 6rem 0; background: linear-gradient(180deg, #22aab473, transparent, transparent); }
.healing-block { border-radius: 25px; background: #fff; padding: 2.5rem; box-shadow: inset 0px 0px 11px 6px #0000001f; }
.healing-block .section-heading p { color: var(--bs-gray-900); font-size: 1.25rem; margin-top: 20px; }
.healing-grid p { font-size: 1.375rem; text-align: center; color: var(--bs-secondary); line-height: 29px; }
.healing-grid p span { display: inline-block; width: 100%; font-weight: 600; color: var(--bs-gray-900); }
.healing-grid { padding: 15px; border: 1px solid var(--bs-secondary); border-radius: 15px; margin-bottom: 24px; min-height: 150px; }
body .banner-btn.green_btn a.site-btn.white_btn { background-color: var(--bs-secondary) !important; color: #fff; background: url(../images/white_call.svg) no-repeat; background-size: 74px; background-position: right 6px center; }
body .banner-btn.green_btn a.site-btn.white_btn:hover { background-color: var(--bs-primary) !important; }

.why-choose-block { border-radius: 25px; background: var(--bs-secondary); padding: 2.5rem; background-image: url(../images/wonen_new.png); background-size: 33%; background-position: right bottom; background-repeat: no-repeat; margin-top: 3rem; }
.why-choose-grids ul { padding: 0; margin: 0; }
.why-choose-grids ul li { list-style: none; background: #fff; padding: 15px 25px; margin-bottom: 15px; border-radius: 15px; }
.why-choose-grids ul li p { font-size: 1.3rem; }
.why-choose-grids ul li p span { display: inline-block; width: 100%; padding-bottom: 10px; font-weight: 600; color: var(--bs-secondary); font-size: 1.5rem; }
.why-inner { max-width: 67%; }
.why-choose-grids { margin-top: 30px; }


/* Harmone section */
section#harmone-section { padding: 6rem 0; background: url(../images/harmone_bg.jpg) no-repeat; background-size: cover; }
.harmone-grid { background: url(../images/card_bg.png); background-size: cover; border-radius: 20px; min-height: 290px; margin-bottom: 24px; height: 100%; }
.harmone-ct { padding: 15px 25px; }
.harmone-grid h4 { font-size: 26px; color: #fff; }
.statement-text p { font-size: 1.5rem; margin-top: 30px; max-width: 75%; margin: 30px auto 0 auto; }
.harmone-ct p { color: #fff; font-size: 1.25rem; }
.harmone-ct h5 { color: #fff; font-size: 1.3rem; }
.harmone-ct ul li { color: #fff; font-size: 1.25rem; }


/* prm block */
section#prm-block { padding: 6rem 0; background: linear-gradient(180deg, #22aab473, transparent, transparent); }
section#prm-block .service-icon { width: 100px; height: 100px; }
section#prm-block .service-icon img{width: 55px;}
section#prm-block p { font-size: 1.25rem; color: var(--bs-secondary); }
section#prm-block .service-grid { min-height: 370px; margin-bottom: 24px; }
.statement-block { margin-top: 30px; }
.statement-block h4 { font-weight: 600; color: var(--bs-secondary); font-size: 1.8rem; }
.statement-block h4 p { color: var(--bs-gray-900) !important; }
section#prm-block .statement-block p { color: var(--bs-gray-900); font-size: 1.5rem; }


/* patient story */
section#patient-story { padding: 0rem 0 6rem 0; }
.review-box { padding: 2.8rem; background: var(--bs-secondary); border-radius: 20px; margin-top: 2rem; background-image: url(../images/man_02.png); background-repeat: no-repeat; background-position: right bottom; background-size: contain; box-shadow: inset 0px 0px 10px 4px #1b97a1; }
.review-box p { color: #fff; font-size: 1.3rem; }
.box-inner { max-width: 60%; }
.section-heading h2 span { color: var(--bs-secondary); }

/* thank you page */
.thanks-content {text-align: center;max-width: 700px;padding: 40px;box-shadow: 0px 0px 7px 5px #22aab42b;
display: grid;place-content: center;background: #fff;border-radius: 25px;}
.thanks-content h1 {margin-bottom: 20px;}
.thanks-main {height: 75vh;display: grid;place-content: center;padding: 0 20px;}
.thanks-content a.btn {display: inline-block;width: max-content;margin: 0 auto;}


/* footer section */
footer#footer {background: var(--bs-secondary);padding: 20px 0;}
.footer-inner label{display: inline-block;width: 100%;font-size: 1.25rem;}
iframe.footer-frame {border-radius: 20px;}
.footer-inner a {font-size: 1.25rem;text-decoration: none;color: var(--bs-gray);display: inline-block;}
.footer-inner ul {padding: 0;margin: 0;}
.footer-inner ul li {display: inline-flex;padding-right: 5px;margin-top: 20px;}
.footer-inner ul li img {width: 50px;}
img.footer-logo { width: 250px;}
.banner-content span{position: relative;}
.banner-content span:before {content: '';width: 200px;height: 60px;background: url(../images/heading_shape.svg) no-repeat;
position: absolute;bottom: -58px;}
@media (max-width:1600px) { 
section#contact-section {background-size: 100%;background-position: bottom;background-color: #9fe2ff;}
}
@media (max-width:1400px) { 
.main-banner h1 {font-size: 3.5rem;line-height: 3.625rem;}
.about-section h2, .section-title h2 {font-size: 2.75rem;}
.service-section .service-block{padding: 1rem 0.5rem 1.5rem;}
.dg-media{padding-left: 0 !important;}
}

@media (max-width:1100px) {
.banner-content h1 {font-size: 3rem;}
.banner-btn a.site-btn {font-size: 22px;}
.risk-content {padding: 2rem;}
.risk-content p {font-size: 1.25rem;margin-top: 20px !important;margin-bottom: 20px !important;}
.section-heading h2, .feature-description h2, .risk-content h2, .lead-form h2, 
.cta-content h2, .contact-contents h2 {font-size: 2.7rem;line-height: 1.3em;}
.contact-contents h3 {font-size: 38px;}
.lead-form{padding: 2rem;}
section.cta-block{padding: 5rem 0rem;}
.contact-contents p.sub-content {max-width: 100%;}
h3.brand-text a {font-size: 28px;}
.container {padding: 0 1.8rem;}
section#banner-block {padding: 3rem 0;}
}
@media (max-width:990px) {
.main-banner .carousel-caption .caption-container{max-width: 540px;}
.top-contact{display: none;}
.site-navbar .site-navigation {padding: 0rem;}
.main-banner h1{font-size: 1.8rem;line-height: 35px;margin-top: 1.3rem;}
.review-grid {margin-bottom: 20px;}
section.cta-block {padding: 5rem 0rem;}
.section-heading h2, .feature-description h2, .risk-content h2, .lead-form h2, .cta-content h2, .contact-contents h2 {font-size: 2.3rem;line-height: 1.3em;}
.lead-form {padding: 30px;box-shadow: 0px 0px 4px 2px #00000012;}
.white-lg-btn {font-size: 1.25rem;}
.risk-grid span{font-size: 1rem;}
.why-inner {max-width: 100%;}
.review-box {background-size: 50%;padding: 1.8rem;background-image: none;}
section#prm-block, section#harmone-section, section#plans-block {padding: 4rem 0;}
.harmone-grid {height: auto;background-position: center;}
section#plans-block{background-size: 100%;}
.why-choose-block, section#plans-block{background-image: none;}
}
@media (max-width:860px) {
section.faqs-section .col-md-5, section.faqs-section .col-md-7 {width: 100%;margin-bottom: 30px;}
.box-inner {max-width: 100%;}
h3.brand-text {font-size: 23px;}
h3.brand-text a {font-size: 26px;}
}
@media (max-width:767px) and (min-width:561px){
  .main-banner .carousel-caption p {font-size: 0.9rem;margin-bottom: 0.5rem;margin-top: 1rem;}
  .main-banner h1 {font-size: 1.8rem;line-height: 32px;margin-top: 1rem;margin-bottom: 0;}
}
@media (max-width:767px) {
.sticky-wrapper { position: inherit; }
.container { padding: 0 1.25rem;}
h3.brand-text a {font-size: 17px;}
h3.brand-text {font-size: 19px;}
.healing-block, .why-choose-block{padding: 2.5rem 2rem;}
.footer-inner {gap: 30px;}
a.navbar-brand img {width: 150px;}
.banner-btn a.site-btn {font-size: 17px;padding: 0.7rem 4rem 0.7rem 2rem;text-align: center;background-size: 57px;line-height: 23px;}
body .banner-btn.green_btn a.site-btn.white_btn{padding: 0.7rem 4rem 0.7rem 2rem;background-size: 57px;line-height: 23px;}
.md-btn {font-size: 14px;padding: 0.5rem 15px;}
section#banner-block .banner-content {text-align: center;}
.banner-content h1 {font-size: 2.2rem;}
.banner-content p {font-size: 1rem;}
.banner-content {margin-bottom: 30px;}
.w-75 { width: 100% !important;}
.feature-description {text-align: center;margin-bottom: 30px;}
.contact-contents p.sub-content {max-width: 100%;}
section#contact-section {background-image: none;}
.muscular-row .row:after{background: transparent;}
.review-grid {padding: 1.5rem;}
section#banner-block {padding: 2rem 0;}
.banner-box {gap: 10px;}
.banner-grid span {font-size: 14px;}
.section-heading h2, .feature-description h2, .risk-content h2, .lead-form h2, .cta-content h2, .contact-contents h2{text-align: center;font-size: 2rem;line-height: 1.3em;}
.lead-form p {font-size: 1.2rem;line-height: 1.3rem;}
.lead-form .form-field input[type=submit] {font-size: 1.2rem;}
.risk-content p {font-size: 1rem;}
.white-lg-btn {font-size: 1rem;}
.contact-contents p.sub-content {font-size: 1.3rem;}
section#contact-section {padding: 4rem 0;}
.contact-contents ul li {padding: 15px 20px;margin-bottom: 15px;font-size: 1.2rem;}
.contact-contents h3 {font-size: 24px;margin-top: 2rem;}
footer#footer, section#diagnosis-block {padding: 4rem 0 4rem 0;}
.lead-form .form-field label{font-size: 1.2rem;}
}
