/* === Celeste Tierra — Custom Styles === */

/* Smooth transitions */
.wp-block-button__link,
.wp-block-image img,
a {
	transition: all 0.3s ease;
}

.wp-block-button__link:hover {
	transform: translateY(-2px);
	opacity: 0.9;
}

/* Navigation styling */
.wp-block-navigation a {
	text-decoration: none;
	font-family: Quicksand, sans-serif;
	font-weight: 600;
	font-size: 1rem;
}

.wp-block-navigation a:hover {
	color: #E57373;
}

/* Navigation animated underline */
.wp-block-navigation .wp-block-navigation-item__content {
	position: relative;
	text-decoration: none;
}

.wp-block-navigation .wp-block-navigation-item__content::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 0;
	height: 2px;
	background: var(--wp--preset--color--rojo-coral);
	transition: width 0.3s ease;
}

.wp-block-navigation .wp-block-navigation-item__content:hover::after,
.wp-block-navigation .current-menu-item .wp-block-navigation-item__content::after {
	width: 100%;
}

/* Image hover effect */
.wp-block-image img {
	border-radius: 15px;
}

.wp-block-image img:hover {
	transform: scale(1.02);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* Card-style groups */
.wp-block-group {
	border-radius: 15px;
}

/* Hover lifting on cards */
.wp-block-columns .wp-block-group.has-base-background-color {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.wp-block-columns .wp-block-group.has-base-background-color:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.10);
}

/* Post grid styling */
.wp-block-post-template .wp-block-group {
	transition: transform 0.3s ease, box-shadow 0.3s ease, opacity 0.6s ease-out;
}

.wp-block-post-template .wp-block-group:hover {
	transform: translateY(-6px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.10);
}

/* Gallery image zoom on hover */
.wp-block-gallery .wp-block-image,
figure.wp-block-image {
	overflow: hidden;
	border-radius: 10px;
}

.wp-block-gallery .wp-block-image img,
figure.wp-block-image img {
	transition: transform 0.5s ease;
}

.wp-block-gallery .wp-block-image:hover img,
figure.wp-block-image:hover img {
	transform: scale(1.05);
}

/* Separator styling */
.wp-block-separator {
	max-width: 100px;
	margin-left: auto;
	margin-right: auto;
}

/* Decorative separator with flower */
.ct-separator,
.wp-block-separator.has-lavanda-suave-background-color,
.wp-block-separator.has-celeste-agua-background-color {
	position: relative;
	margin: 3rem auto;
	max-width: 120px;
}

.ct-separator::before,
.wp-block-separator.has-lavanda-suave-background-color::before,
.wp-block-separator.has-celeste-agua-background-color::before {
	content: '✨';
	position: absolute;
	top: -0.85rem;
	left: 50%;
	transform: translateX(-50%);
	background: #FAF9F6;
	padding: 0 0.5rem;
	font-size: 0.9rem;
}

/* Captions */
.wp-block-image figcaption {
	font-style: italic;
	text-align: center;
	color: #5B9BAC;
	margin-top: 0.5rem;
}

/* Button glow on hover */
.wp-block-button__link {
	transition: transform 0.2s ease, box-shadow 0.3s ease, opacity 0.2s ease;
}

.wp-block-button .has-celeste-agua-background-color:hover {
	box-shadow: 0 6px 20px rgba(190, 227, 237, 0.6);
}

.wp-block-button .has-lavanda-suave-background-color:hover {
	box-shadow: 0 6px 20px rgba(225, 213, 245, 0.7);
}

.wp-block-button .has-rojo-coral-border-color:hover {
	box-shadow: 0 6px 20px rgba(229, 115, 115, 0.35);
}

/* Buttons outline variant */
.wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid currentColor;
}

/* Section transition depth */
.wp-block-group.has-blanco-crudo-background-color + .wp-block-group.has-lavanda-palido-background-color,
.wp-block-group.has-lavanda-palido-background-color + .wp-block-group.has-blanco-crudo-background-color,
.wp-block-group.has-celeste-palido-background-color + .wp-block-group.has-blanco-crudo-background-color {
	box-shadow: inset 0 1px 0 rgba(44, 48, 46, 0.04);
}

/* Fade-in on load (homepage) */
@keyframes ctFadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.ct-front-page .wp-block-group.has-lavanda-palido-background-color,
.ct-front-page .wp-block-group.has-blanco-crudo-background-color,
.ct-front-page .wp-block-group.has-celeste-palido-background-color {
	animation: ctFadeInUp 0.7s ease-out both;
}

.ct-front-page .wp-block-group:nth-child(2) { animation-delay: 0.1s; }
.ct-front-page .wp-block-group:nth-child(3) { animation-delay: 0.2s; }
.ct-front-page .wp-block-group:nth-child(4) { animation-delay: 0.3s; }
.ct-front-page .wp-block-group:nth-child(5) { animation-delay: 0.4s; }

@media (prefers-reduced-motion: reduce) {
	.ct-front-page .wp-block-group { animation: none; }
}

/* Scroll reveal */
.wp-block-post-template .wp-block-group,
.wp-block-columns .wp-block-group.has-base-background-color {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.wp-block-post-template .wp-block-group.ct-visible,
.wp-block-columns .wp-block-group.has-base-background-color.ct-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-post-template .wp-block-group,
	.wp-block-columns .wp-block-group.has-base-background-color {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* Mobile adjustments */
@media (max-width: 768px) {
	.wp-block-columns {
		flex-wrap: wrap;
	}

	.wp-block-columns .wp-block-column {
		flex-basis: 100% !important;
	}

	.are-vertically-aligned-center {
		align-items: flex-start;
	}
}

/* Smooth scroll */
html {
	scroll-behavior: smooth;
}

/* Footer links on lavanda background */
footer.has-lavanda-suave-background-color a:not(.wp-block-button__link),
footer a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--gris-carbon);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: rgba(229, 115, 115, 0.3);
}

footer.has-lavanda-suave-background-color a:not(.wp-block-button__link):hover,
footer a:not(.wp-block-button__link):hover {
	color: var(--wp--preset--color--rojo-coral);
	text-decoration-color: var(--wp--preset--color--rojo-coral);
}

/* Selection color */
::selection {
	background-color: #BEE3ED;
	color: #2C302E;
}