/* Mindful Travel Sections - WordPress Block Styles */

/* Base styles for content wrapper */
.mindful-about-content {
	font-family: Poppins, sans-serif;
	color: #000;
	line-height: 1.6;
}

/* Hero Section */
.mindful-hero-section {
	margin-bottom: 80px;
}

.mindful-hero-cover {
	background-size: cover;
	background-position: center;
	margin-bottom: 3rem !important;
}

.mindful-hero-content {
	align-items: center;
	gap: 48px;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 20px;
}

.mindful-hero-content .mindful-hero-profile,
.mindful-hero-content .mindful-hero-video {
	padding-top: 135px;
}

.mindful-hero-content .mindful-hero-profile .wp-block-image {
	position: relative;
    bottom: -19px;
    margin-bottom: 0;
}

.mindful-hero-video .wp-block-image {
	z-index: 9;
	position: relative;
}

.wp-block-cover.mindful-hero-cover .wp-block-cover__image-background {
	z-index: 9;
    object-fit: unset;
}

.wp-block-cover.mindful-hero-cover .wp-block-cover__background.has-background-dim.has-background-dim-100 {
	border-bottom: 7px solid white;
}

.mindful-hero-content .mindful-hero-text {
	padding-top: 65px;
}

.mindful-hero-text {
	border-left: 0.5px solid #6b7280;
	padding-left: 24px;
}

.mindful-hero-title {
	font-family: Affinities !important, serif;
	font-size: 86px;
	font-weight: 300;
	color: #000;
	margin-bottom: 16px;
	line-height: 1.2;
}

.mindful-hero-description {
	font-size: 16px;
	line-height: 1.5;
	color: #2c2c2c;
	margin-bottom: 16px;
}

.autnticos-descubrir-cafs {
	letter-spacing: -0.02em;
}

.mindful-video-presentation a::after {
	content: "";
	display: block;
	width: 65px;
	height: 65px;
	background-image: url(../images/play_circle.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	cursor: pointer;
}

.mindful-video-presentation img {
	width: 267px;
	height: 460px;
	object-fit: cover;
	border-radius: 20px;
}

/* Favorite Countries Section */
.mindful-favorite-countries {
	margin-bottom: 80px;
}

.mindful-countries-cover {
	background-size: cover;
	background-position: center;
}

.wp-block-cover.mindful-countries-cover .wp-block-cover__image-background {
	object-fit: unset !important;
}

.mindful-countries-cover .wp-block-cover__inner-container {
	padding-top: 4rem;
	padding-bottom: 7rem;
}

.mindful-countries-cover p,
.mindful-countries-cover h3 {
	margin: 0 !important;
}

.mindful-countries-title {
	font-size: 2.2rem !important;
	font-weight: 700;
	text-align: center;
	margin-bottom: 40px;
	color: #fffdf8;
	display: flex;
    align-items: center;
    justify-content: space-between;
}

/*
 * DECORATIVE LINE SOLUTIONS FOR TITLES
 * ====================================
 *
 * Default: Line extends from left edge to text (right-aligned text)
 * Usage: Just use the class .mindful-countries-title
 *
 * Centered: Lines on both sides of text
 * Usage: Add class "centered" → .mindful-countries-title.centered
 *
 * Left-aligned: Line extends from text to right edge
 * Usage: Add class "left-aligned" → .mindful-countries-title.left-aligned
 *
 * Grid approach: More stable alternative
 * Usage: Add class "grid-approach" → .mindful-countries-title.grid-approach
 *
 * Customization: Modify CSS custom properties in :root section below
 */

/* Solution for line that extends full width except text width */
.mindful-countries-title {
    display: flex;
    align-items: center;
    justify-content: flex-end; /* Right alignment */
    width: 100%;
}

.mindful-countries-title::before {
    content: "";
    flex: 1; /* Takes up all available space */
    height: 1px;
    background-color: #fffdf8;
    margin-right: 24px; /* Space between line and text */
}

/* Alternative approach using flexbox with the mark element */
.mindful-countries-title mark {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100% !important;
}

.mindful-countries-title mark::before {
    content: "";
    flex: 1;
    height: 1px;
    background-color: #fffdf8;
    margin-right: 24px;
}

/* Removed duplicate - responsive adjustments are handled below with CSS custom properties */

/* Option for centered text with lines on both sides */
.mindful-countries-title.centered {
    justify-content: center;
}

.mindful-countries-title.centered::before,
.mindful-countries-title.centered::after {
    content: "";
    flex: 1;
    height: 1px;
    background-color: #fffdf8;
}

.mindful-countries-title.centered::before {
    margin-right: 24px;
}

.mindful-countries-title.centered::after {
    margin-left: 24px;
}

/* CSS Grid alternative approach - more stable */
.mindful-countries-title.grid-approach {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 24px;
}

.mindful-countries-title.grid-approach::before {
    content: "";
    height: 1px;
    background-color: #fffdf8;
    display: block;
}

/* For left-aligned text */
.mindful-countries-title.left-aligned {
    justify-content: flex-start;
}

.mindful-countries-title.left-aligned::before {
    display: none;
}

.mindful-countries-title.left-aligned::after {
    content: "";
    flex: 1;
    height: 1px;
    background-color: #fffdf8;
    margin-left: 24px;
}

/* Customization options - adjust these variables as needed */
:root {
    --title-line-thickness: 1px;
    --title-line-gap: 24px;
    --title-line-gap-mobile: 16px;
    --title-line-color: #fffdf8;
}

/* Apply custom properties */
.mindful-countries-title::before {
    height: var(--title-line-thickness);
    background-color: var(--title-line-color);
}

.mindful-countries-title::before {
    margin-right: var(--title-line-gap);
}

@media (max-width: 768px) {
	.mindful-countries-title::before,
	.mindful-countries-title mark::before {
		display: none;
	}

	.wp-block-cover.mindful-hero-cover .wp-block-cover__image-background {
		z-index: 0;
	}

	.mindful-about-content .mindful-hero-content {
		flex-wrap: wrap-reverse !important;
		gap: 0;
	}

	.mindful-hero-content .mindful-hero-profile {
		padding-top: 50px;
	}

	.mindful-hero-content .mindful-hero-video,
	.mindful-hero-content .mindful-hero-text {
		padding-top: 0;
	}

	.mindful-hero-content .mindful-hero-profile .wp-block-image {
		bottom: 50px;
    	left: -60px;
	}
	.mindful-hero-video .wp-block-image {
		position: absolute;
		bottom: 300px;
		width: 100px;
		height: 100px;
		border-radius: 100%;
		right: 1rem;
		box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.25);
		border: 1px solid white;
		margin-bottom: 0;
		overflow: hidden;
	}

	.mindful-video-presentation::after {
		width: 40px;
		height: 40px;
	}

	.mindful-video-presentation img {
		width: 100px !important;
		height: 100px !important;
	}

	/* Section 2 */
	.mindful-favorite-countries {
		margin-top: -254px !important;
	}

	.mindful-countries-cover {
		aspect-ratio: unset;
    	padding-top: 200px;
	}
	.wp-block-cover.mindful-countries-cover .wp-block-cover__background.has-background-dim.has-background-dim-0 {
		opacity: 0;
		z-index: -1;
	}

	.mindful-country-image {
		margin-bottom: 0;
	}

	.mindful-country-item {
		gap: 0 !important;
	}

	.wp-block-cover.mindful-countries-cover .wp-block-cover__image-background {
		display: none;
    }

	.mindful-hero-content .mindful-hero-text {
		padding: 0;
		border-left: 0;
	}

}

.mindful-countries-grid {
	gap: 40px;
	max-width: 1140px;
	margin: 0 auto;
}

.mindful-country-item {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.mindful-country-image img {
	width: 100%;
	height: 228px;
	object-fit: cover;
	border-radius: 32px;
}

.mindful-country-name {
	font-family: Affinities !important, serif;
	font-size: 64px;
	font-weight: 400;
	color: #fffdf8;
	margin-bottom: 8px;
}

.mindful-country-name::after {
	content: "";
	display: block;
	width: 217px;
	height: 1px;
	background-color: #fffdf8;
	margin: 8px auto;
}

.mindful-country-description {
	font-size: 14px;
	line-height: 1.4;
	color: #fffdf8;
	font-family: Poppins, sans-serif;
}

/* Section Titles */
.mindful-section-title {
	font-size: 32px;
	font-weight: 700;
	color: #000;
	margin-bottom: 8px;
}

.mindful-section-description {
	font-size: 16px;
	line-height: 1.5;
	color: #2c2c2c;
}

/* Travel Passion Section */
.mindful-travel-passion {
	margin-bottom: 80px;
}

.mindful-passion-content {
	align-items: center;
	gap: 36px;
	margin: 0 auto;
}

.mindful-passion-img img {
	object-fit: cover;
	border-radius: 20px;
}

/* Responsible Travel Section */
.mindful-responsible-travel {
	margin-bottom: 80px;
}

.mindful-responsible-content {
	align-items: center;
	gap: 48px;
	margin: 0 auto;
}

.mindful-responsible-img img {
	object-fit: cover;
	border-radius: 266px 235px 266px 337px;
}

/* Living Abroad Section */
.mindful-living-abroad {
	margin-bottom: 80px;
}

.mindful-abroad-content {
	align-items: center;
	gap: 48px;
	max-width: 1140px;
	margin: 0 auto;
}

.mindful-images-stack {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding-left: 31px;
}

.mindful-stack-img {
	border-radius: 8px;
	overflow: hidden;
}

.mindful-stack-img-1 img {
	width: 309px;
	height: 399px;
	object-fit: cover;
}

.mindful-stack-img-2 img {
	width: 351px;
	height: 399px;
	object-fit: cover;
	margin-left: -266px;
}

.mindful-stack-img-3 img {
	width: 389px;
	height: 399px;
	object-fit: cover;
	margin-left: -266px;
}

/* Work Travel Section */
.mindful-work-travel {
	margin-bottom: 80px;
}

.mindful-work-content {
	align-items: center;
	gap: 48px;
	max-width: 1140px;
	margin: 0 auto;
}

.mindful-work-images-stack {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.mindful-work-img {
	border-radius: 32px;
	overflow: hidden;
}

.mindful-work-img-1 img {
	width: 227px;
	height: 399px;
	object-fit: cover;
	z-index: 2;
}

.mindful-work-img-2 img {
	width: 200px;
	height: 359px;
	object-fit: cover;
	margin-left: -117px;
	z-index: 1;
}

.mindful-work-img-3 img {
	width: 175px;
	height: 317px;
	object-fit: cover;
	margin-left: -117px;
	z-index: 0;
}

/* Slider Controls */
.mindful-slider-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	margin-top: 24px;
}

.mindful-slider-nav img {
	width: 60px;
	height: 60px;
	cursor: pointer;
}

.mindful-slider-indicator img {
	width: 96px;
	height: 16px;
	object-fit: contain;
}

/* CTA Section */
.mindful-cta-section {
	margin-bottom: 80px !important;
}

.mindful-cta-blocks {
	gap: 35px;
	max-width: 780px;
	margin: 0 auto;
}

.mindful-cta-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	text-align: center;
	min-height: 100%;
	box-shadow: 0px 23px 44px rgba(0, 0, 0, 0.13);

}

.mindful-cta-icon img {
	width: 40px;
	height: 40px;
}

.mindful-cta-title {
	font-size: 24px;
	font-weight: 600;
	color: #000;
	margin-bottom: 16px;
}

.mindful-cta-subtitle {
	font-size: 19px;
	line-height: 1.3;
	color: #2c2c2c;
	margin-bottom: 16px;
}

.mindful-cta-button .wp-block-button__link {
	font-size: 16px;
	font-weight: 500;
	padding: 8px 32px;
	border-radius: 100px;
	text-decoration: none;
	display: inline-block;
	min-width: 264px;
}

/* Curiosities Section */
.mindful-curiosities-section {
	margin-bottom: 80px;
}

.mindful-curiosities-content {
	max-width: 892px;
	margin: 0 auto;
	border-bottom: 2px solid #369fa1;
}

.mindful-curiosities-title {
	font-size: 2rem !important;
	font-weight: 700;
	color: #000;
	margin-bottom: 1.5rem;
}

.mindful-curiosity-item {
	margin-bottom: 16px;
}

.mindful-curiosity-item {
	display: none;
}

.mindful-curiosity-item:first-child,
.mindful-curiosity-item:nth-child(2),
.mindful-curiosity-item:nth-child(3),
.mindful-curiosity-item:nth-child(4),
.mindful-curiosity-item:nth-child(5) {
	display: block;
}

/* Animation classes for curiosity items */
.mindful-curiosity-item.fade-in {
	animation: fadeIn 0.5s ease-in-out;
}

.mindful-curiosity-item.fade-out {
	animation: fadeOut 0.5s ease-in-out;
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeOut {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-10px);
	}
}

.mindful-curiosity-content {
	align-items: center !important;
	gap: 16px;
}

.mindful-curiosity-number {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	flex-shrink: 0;
	background-image: url(../images/bg-items-numbered.png);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 50px;
	height: 50px;
	border-radius: 50%;
}

.mindful-number-bg img {
	width: 40px;
	height: 40px;
}

.mindful-number-text {
	position: absolute;
	font-size: 18px;
	font-weight: 700;
	color: #000;
	margin: 0;
	text-align: center;
}

.mindful-curiosity-description {
	font-size: 16px;
	line-height: 1.5;
	color: #2c2c2c;
	margin: 0;
}

.mindful-see-more {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 24px;
}

.mindful-see-more-button {
	font-size: 16px;
	font-weight: 600;
	color: #000;
	margin: 0;
	margin-top: 1.5rem !important;
	cursor: pointer;
}

.mindful-dropdown-arrow img {
	width: 32px;
	height: 32px;
}

.mindful-separator {
	border-color: #369fa1;
	margin-top: 0;
}

/* Comments Section */
.mindful-comments-section {
	margin-bottom: 80px;
}

.mindful-comments-content {
	gap: 48px;
	max-width: 1118px;
	margin: 0 auto;
}

.mindful-comments-title {
	font-size: 20px;
	font-weight: 700;
	color: #000;
	margin-bottom: 24px;
}

.mindful-comment-item {
	margin-bottom: 40px;
}

.mindful-comment-meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	margin-bottom: 8px;
}

.mindful-comment-author {
	font-size: 14px;
	color: #2c2c2c;
	font-weight: 600;
	margin: 0;
}

.mindful-comment-date {
	font-size: 12px;
	color: #2c2c2c;
	margin: 0;
}

.mindful-comment-text {
	font-size: 14px;
	line-height: 1.4;
	color: #2c2c2c;
	margin-bottom: 8px;
}

.mindful-comment-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}

.mindful-reply-button .wp-block-button__link {
	font-size: 16px;
	padding: 4px 16px;
	border-radius: 100px;
	min-width: 179px;
}

/* Form Section */
.mindful-form-title {
	font-size: 20px;
	font-weight: 700;
	color: #000;
	margin-bottom: 24px;
}

.mindful-form-fields {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.mindful-form-row {
	gap: 16px;
}

.mindful-form-field {
	display: flex;
	flex-direction: column;
}

.mindful-form-input {
	border: 0.5px solid #2c2c2c;
	border-radius: 100px;
	padding: 4px 16px;
	height: 40px;
	display: flex;
	align-items: center;
	font-size: 12px;
	color: #2c2c2c;
	margin: 0;
}

.mindful-form-field-large .mindful-form-textarea {
	border: 0.5px solid #2c2c2c;
	border-radius: 24px;
	padding: 16px;
	height: 80px;
	display: flex;
	align-items: flex-start;
	font-size: 12px;
	color: #2c2c2c;
	margin: 0;
}

.mindful-form-checkboxes {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.mindful-checkbox-item {
	display: flex;
	align-items: center;
	gap: 4px;
}

.mindful-checkbox img {
	width: 24px;
	height: 24px;
}

.mindful-checkbox-text {
	font-size: 16px;
	line-height: 1.5;
	color: #2c2c2c;
	margin: 0;
}

.mindful-submit-button .wp-block-button__link {
	font-size: 16px;
	padding: 4px 32px;
	border-radius: 100px;
}

/* Text Highlights */
.brasil {
	text-decoration: underline;
	color: #369fa1;
}

.poltica-de-privacidad {
	text-decoration: underline;
	font-weight: 600;
}

.mindful-about-content .mindful-hero-content {
	max-width: var(--wp--style--global--wide-size);
}

.mindful-about-content .mindful-passion-text {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.mindful-about-content .mindful-stack-img {
	height: 206px;
}

.mindful-about-content .mindful-stack-img.img-2-icon {
	margin-right: -127px;
	margin-left: unset;
}

.mindful-about-content .mindful-stack-img.img-3-icon {
	margin-right: -127px;
	margin-left: unset;
}

.mindful-about-content .images.instagram {
	margin-bottom: 3rem;
}

/* Responsive Design */
@media (max-width: 768px) {

	.mindful-hero-title {
		font-size: 48px;
	}

	.mindful-country-name {
		font-size: 36px;
	}

	.mindful-cta-blocks {
		flex-direction: column;
		gap: 24px;
	}

	.mindful-stack-img-2 img,
	.mindful-stack-img-3 img {
		margin-left: -100px;
	}

	.mindful-work-img-2 img,
	.mindful-work-img-3 img {
		margin-left: -50px;
	}

	.mindful-comments-content {
		flex-direction: column;
		gap: 24px;
	}

	.mindful-form-row {
		flex-direction: column;
	}

	.mindful-passion-content,
	.mindful-responsible-travel,
	.mindful-work-travel,
	.mindful-cta-section,
	.mindful-curiosities-section {
		padding: 0 1rem;
	}
}
