/**
 * SofiaHealth main styles
 *
 * @package sofiahealth
 */

:root {
	--sh-max-container-width: 1440px;
	--sh-banner-max-width: 560px;
	--sh-banner-aspect-ratio: 560 / 480;
	--sh-banner-radius: 32px;
	--sh-banner-shadow: 0 16px 20px rgba(74, 50, 31, 0.05);
	--sh-montecarlo: "MonteCarlo", cursive;
	--sh-heighlight-text-colo: #E8B94B;
	--sh-body-text-color: #606060;
	--sh-btn-height: 48px;
	--sh-btn-radius: 24px;
	--sh-btn-padding-x: 28px;
	--sh-btn-padding-y: 12px;
	--sh-btn-font-size: 15px;
	--sh-btn-shadow: 0 4px 6px rgba(74, 50, 31, 0.05);
	--sh-btn-outline-shadow: 0 4px 12px rgba(74, 50, 31, 0.05);
	--sh-ceircle-background: #EFF7F6;
	--sh-showcase-check-bg: #e8b94b;
	--sh-showcase-list-gap: 24px;
	--sh-showcase-item-gap: 16px;
}

h2{
	font-family: var(--sh-font-display);
	font-size: 40px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--sh-teal);
}
h3{
	font-family: var(--sh-font-display);
	font-size: 24px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	color: var(--sh-ink);
}
h4{
	font-family: var(--sh-font-display);
	font-size: 22px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	margin: 0;
}


.entry-title {
	display: none;
}

body .main-container {
	margin: 0 auto;
	max-width: var(--sh-max-container-width);
	padding: 0 var(--sh-header-pad-x);
}

/* Hero banner image — Figma node 14:32 / hero-media 14:31 */
.banner-img {
	border-radius: var(--sh-banner-radius);
	box-shadow: var(--sh-banner-shadow);
	max-width: var(--sh-banner-max-width);
	overflow: hidden;
	position: relative;
	width: 100%;
	aspect-ratio: var(--sh-banner-aspect-ratio);
}

.banner-img figure,
.banner-img .wp-block-image {
	height: 100%;
	margin: 0;
	width: 100%;
}

.banner-img img {
	display: block;
	height: 100%;
	object-fit: cover;
	object-position: center;
	pointer-events: none;
	width: 100%;
}

.banner-highlight-text{
    color: #2E2E2E;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    display: flex;
    padding: 6px 14px;
    align-items: flex-start;
    border-radius: 12px;
    border: 0.5px solid #E8B94B;
    background: #FDF8F0;
    margin: 0;
	justify-content: center;
}
.banner-column-left h1{
    color: #2A8C82;
    font-family: var(--sh-font-display);
    font-size: 56px;
    font-style: normal;
    font-weight: 400;
    line-height: 115%;
    margin: 15px 0 0 0;
}
.hermony{
    color: var(--sh-heighlight-text-colo);
    font-family: var(--sh-montecarlo);
    font-size: 64px;
    font-style: normal;
    font-weight: 400;
    line-height: 115%;
    margin: 0;
}

/* Hero buttons — Figma node 14:26 / 14:27 / 14:29 */
.banner-btn-block .wp-block-buttons,
.banner-btn-block > div {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.banner-btn-block .wp-block-button {
	margin: 0;
}

.banner-btn-block .wp-block-button__link {
	align-items: center;
	background-color: var(--sh-teal, #2a8c82);
	border: none;
	border-radius: var(--sh-btn-radius);
	box-shadow: var(--sh-btn-shadow);
	box-sizing: border-box;
	color: var(--sh-white, #ffffff);
	display: inline-flex;
	font-family: var(--sh-font-body, "Work Sans", sans-serif);
	font-size: var(--sh-btn-font-size);
	font-weight: 600;
	height: var(--sh-btn-height);
	justify-content: center;
	line-height: normal;
	min-height: var(--sh-btn-height);
	padding: var(--sh-btn-padding-y) var(--sh-btn-padding-x);
	text-align: center;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
	white-space: nowrap;
    border: 1.5px solid var(--sh-teal, #2a8c82);
}

.banner-btn-block .wp-block-button__link:hover,
.banner-btn-block .wp-block-button__link:focus {
	background-color: transparent;
	color: var(--sh-teal, #2a8c82);
}


.banner-description {
    color: var(--sh-body-text-color);
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%
}
.banner-column-left {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-right: 134px;
}

.hero-banner {
	padding: 106px 0;
}

.hero-banner .wp-block-columns {
	align-items: center;
	gap: 40px;
	margin-bottom: 0;
}

.hero-banner .wp-block-column {
	margin-bottom: 0;
}

/* body-content-styles
--------------------------------------------- */
.block-radius{
	border-radius: 24px;
	padding: 40px;
}

.block-radius figure, .block-radius h3{
	margin: 0;
}
.block-radius p{
	margin: 0;
}
.white-img-block figure{
	display: flex;
	width: 48px;
	height: 48px;
	justify-content: center;
	align-items: center;
	border-radius: 24px;
	background: var(--sh-ceircle-background);
}
.white-four-block{
	border-radius: 20px;
	box-shadow: 0 4px 16px 0 rgba(74, 50, 31, 0.05);
	padding: 32px;
}
.journey-block{
	padding: 32px;
	border-radius: 24px;
	border: 1px solid #EADFD3;
}

.white-four-block p{
	margin: 0;
}
.heading-highlight h2 mark{
	font-family: var(--sh-montecarlo);
}
.journey-block .wp-block-button__link{
	padding: 0;
    line-height: normal;
    border: none;
    outline: none;
	display: flex;
    align-items: center;
    justify-content: center;
}
.top-row > p{
	font-family: var(--sh-font-display);
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin: 0;
}
.journey-block p{
	margin: 0;
}
.wp-block-columns{
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
}
.journey-row{
	gap: 2.5em;
}
.showcase-img-block figure{
	margin: 0;
}
.showcase-img-block figure img{
	border-radius: 32px;
	box-shadow: 0 16px 40px 0 rgba(74, 50, 31, 0.05);
}
.showcase-content-block ul {
	display: flex;
	flex-direction: column;
	gap: var(--sh-showcase-list-gap);
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Showcase list — Figma node 14:106 */
.showcase-content-block ul li {
	font-family: var(--sh-font-body, "Work Sans", sans-serif);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	margin: 0;
	padding: 0 0 0 32px;
	position: relative;
}

.showcase-content-block ul li::before {
	background-color: var(--sh-showcase-check-bg);
	background-image: url("../images/icon-check.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 12px 12px;
	border-radius: 12px;
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	left: 0;
	top: 2px;
}

.showcase-content-block ul li h4 {
	color: var(--sh-ink, #2e2e2e);
	display: block;
	font-family: var(--sh-font-display, "Cormorant Garamond", Georgia, serif);
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	margin-bottom: 4px;
}

.showcase-content-block p{
	margin: 0;
}

/* Testimonials — Figma node 14:124 */
.sofiahealth-testimonials__grid {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
}

.testimonial-card {
	background-color: #ffffff;
	border-radius: 24px;
	box-shadow: 0 8px 12px rgba(74, 50, 31, 0.05);
	box-sizing: border-box;
	display: flex;
	flex: 1 1 calc(50% - 16px);
	flex-direction: column;
	gap: 24px;
	margin: 0;
	min-width: 280px;
	padding: 40px;
}

.testimonial-card__stars {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

.testimonial-card__star {
	background-image: url("../images/icon-star.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: block;
	flex-shrink: 0;
	height: 16px;
	width: 16px;
}

.testimonial-card__quote {
	border: 0;
	color: var(--sh-ink, #2e2e2e);
	font-family: var(--sh-font-body, "Work Sans", sans-serif);
	font-size: 16px;
	font-style: italic;
	font-weight: 400;
	line-height: 1.6;
	margin: 0;
	padding: 0;
}

.testimonial-card__quote p {
	margin: 0;
}

.testimonial-card__author {
	align-items: center;
	display: flex;
	gap: 16px;
	margin: 0;
}

.testimonial-card__avatar {
	border-radius: 24px;
	flex-shrink: 0;
	height: 48px;
	overflow: hidden;
	width: 48px;
}

.testimonial-card__avatar-img {
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.testimonial-card__meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.testimonial-card__name {
	color: var(--sh-ink, #2e2e2e);
	font-family: var(--sh-font-display, "Cormorant Garamond", Georgia, serif);
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
}

.testimonial-card__subtitle {
	color: var(--sh-body-text-color, #606060);
	font-family: var(--sh-font-body, "Work Sans", sans-serif);
	font-size: 13px;
	font-weight: 400;
	line-height: normal;
	margin: 0;
}

.faq-accordion{
	max-width: 752px;
    width: 100%;
    margin: 0 auto;
	display: flex;
    flex-direction: column;
    gap: 16px;
}
.accordion-item{
	border-radius: 16px;
	border: 1px solid #EADFD3;
	padding: 24px;
}
.accordion-item .wp-block-accordion-heading{
	margin: 0;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
}
.accordion-item .wp-block-accordion-heading button{
	padding: 0;
}
.accordion-item  .wp-block-accordion-panel p{
	margin-top: 8px;
	margin-bottom: 0;
}
.accordion-item .wp-block-accordion-heading button > span:hover{
	text-decoration: none;
}

.cta-section{
	background-image: url("../images/cta-background.webp");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: 1;
}
.cta-section::before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, rgba(42, 140, 130, 0.85) 0%, rgba(42, 140, 130, 0.85) 100%);
	background-color: #000000 !important;
	z-index: -1;
	opacity: 0.87;
}

.cta-section h2{
	color: #ffffff !important;
}
.cta-section .wp-block-button__link{
	color: var(--sh-ink) !important;
	font-size: 15px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	padding: 12px 28px;
	border: 1.5px solid transparent !important;
	transition: all 0.3s ease;
}
.cta-section .wp-block-button__link:hover{
	background-color: transparent !important;
	color: var(--sh-showcase-check-bg) !important;
	border: 1.5px solid var(--sh-showcase-check-bg) !important;
}

.cta-section p{
	margin: 0;
}

/* product-section-styles
--------------------------------------------- */

.product-block{
	border-radius: 28px;
	border: 1px solid #EADFD3;
	box-shadow: 0 4px 16px 0 rgba(74, 50, 31, 0.05);
	padding: 40px;
	display: flex;
    flex-direction: column;
	min-height: 364px;
    height: 100%;
	transition: all 0.3s ease;
}
.product-block h3{
	margin: 0;
}
.product-block .price p{
	margin: 0;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--sh-body-text-color);
}
.product-block p{
	margin: 0;
}
.product-block ul {
	display: flex;
	flex-direction: column;
	gap: 16px;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Product list — Figma node 14:165 */
.product-block ul li {
	align-items: center;
	color: var(--sh-ink, #2e2e2e);
	display: flex;
	font-family: var(--sh-font-body, "Work Sans", sans-serif);
	font-size: 14px;
	font-weight: 400;
	gap: 12px;
	line-height: normal;
	margin: 0;
	padding: 0;
}

.product-block ul li::before {
	border-bottom: 2px solid var(--sh-teal, #2a8c82);
	border-radius: 1px;
	border-right: 2px solid var(--sh-teal, #2a8c82);
	box-sizing: border-box;
	content: "";
	display: block;
	flex-shrink: 0;
	height: 10px;
	transform: rotate(45deg);
	width: 6px;
}

.product-block .price p mark{
	font-family: var(--sh-font-display);
	font-size: 44px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}
.product-column-row{
	align-items: flex-end !important;
    justify-content: flex-end;
}
.product-block .wp-block-button__link{
	font-size: 15px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	transition: all 0.3s ease;
}
.product-column-row > div:nth-child(2) .wp-block-button__link{
	border: 1px solid transparent;
}
.product-column-row > div:nth-child(2) .wp-block-button__link:hover{
	border: 1px solid var(--sh-heighlight-text-colo);
	background-color: transparent !important;
	color: var(--sh-heighlight-text-colo) !important;
}
.product-column-row > div:first-child .wp-block-button__link:hover, 
.product-column-row > div:last-child .wp-block-button__link:hover{
	background-color: var(--sh-teal) !important;
	color: var(--sh-white) !important;
}
.recomended {
	padding: 4px 10px;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    border-radius: 100px;
}
.product-block:hover{
	border: 1px solid #2A8C82;
}


/* body-content-styles-desktop
--------------------------------------------- */
@media screen and (min-width: 1024px) {
	.hero-banner .wp-block-columns:not(.is-not-stacked-on-mobile) {
		flex-wrap: nowrap !important;
	}

	.hero-banner .wp-block-column.banner-img {
		flex-basis: 560px !important;
		flex-grow: 0;
	}
	.dynamic-width{
		max-width: 18em;
	}
}

/* Tablet
--------------------------------------------- */
@media screen and (max-width: 1023px) {
	.main-container {
		padding: 0 24px;
	}

	.hero-banner {
		padding: 64px 0;
	}

	.hero-banner .wp-block-columns {
		flex-direction: column;
		gap: 32px;
	}

	.banner-column-left {
		order: 1;
		padding-right: 0;
		width: 100%;
	}

	.banner-img {
		max-width: 100%;
		order: 2;
		width: 100%;
	}

	.banner-column-left h1 {
		font-size: 44px;
	}

	.hermony {
		font-size: 52px;
	}

	.banner-description {
		font-size: 17px;
	}

	.banner-btn-block .wp-block-buttons,
	.banner-btn-block > div {
		justify-content: flex-start;
	}
	.page-banner > div:first-child{
		order: 1;
	}
	.page-banner > div:last-child{
		order: 2;
	}
	.inside-section > div:first-child{
		order: 2;
	}
}

/* Mobile
--------------------------------------------- */
@media screen and (max-width: 767px) {
	.hero-banner {
		padding: 48px 0;
	}

	.hero-banner .wp-block-columns {
		gap: 24px;
	}

	.banner-column-left h1 {
		font-size: 36px;
		line-height: 120%;
		margin-top: 12px;
	}

	.hermony {
		font-size: 42px;
		line-height: 120%;
	}

	.banner-highlight-text {
		font-size: 11px;
		padding: 5px 12px;
		width: auto;
	}

	.banner-description {
		font-size: 16px;
		line-height: 155%;
	}

	.banner-btn-block .wp-block-button__link {
		font-size: 14px;
		height: 44px;
		min-height: 44px;
		padding: 10px 24px;
	}

	.showcase-content-block ul li strong {
		font-size: 17px;
	}

	.showcase-content-block ul li {
		font-size: 13px;
	}

	.sofiahealth-testimonials__grid {
		flex-direction: column;
	}

	.testimonial-card {
		flex: 1 1 100%;
		padding: 32px;
	}
	.gap-top, .gap-bottom{
		height: 48px !important;
		height: 48px !important;
	}
	.Curated-section{
		padding: 0 !important;
	}
	.heading-bottom-gap{
		height: 32px !important;
	}
}

@media screen and (max-width: 480px) {
	h2{
		font-size: 28px !important;
	}
	.accordion-item .wp-block-accordion-heading{
		font-size: 16px;
	}
	.product-block h3{
		font-size: 20px;
	}
	.recomended{
		font-size: 10px;
	}
	.product-block .price p mark{
		font-size: 36px;
	}
	.product-block .price p{
		font-size: 14px;
	}
	.product-block ul{
		gap: 12px;
	}
	.product-description, .product-block ul li{
		font-size: 13px !important;
	}
	.main-container {
		padding: 0 16px;
	}
	.accordion-item .wp-block-accordion-panel p{
		font-size: 13px !important;
	}

	.hero-banner {
		padding: 32px 0;
	}
	.block-radius h3, .white-four-block h4, .journey-block h4 {
		font-size: 20px !important;
	}
	.block-radius p{
		font-size: 14px !important;
	}

	.banner-img {
		border-radius: 24px;
	}

	.banner-column-left h1 {
		font-size: 32px;
	}

	.hermony {
		font-size: 32px;
	}

	.banner-description {
		font-size: 15px;
	}

	.banner-btn-block .wp-block-button,
	.banner-btn-block .wp-block-button__link {
		width: 100%;
	}

	.banner-btn-block .wp-block-buttons,
	.banner-btn-block > div {
		flex-direction: column;
		width: 100%;
	}
}