/*
Theme Name:   Astra Child
Theme URI:    https://sobujmondal.com/
Description:  Child theme for Astra.
Author:       Sobuj Mondal
Author URI:   https://sobujmondal.com/
Template:     astra
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  astra-child
*/

/* Add custom CSS below. */

/*
 * Elementor Theme Builder single templates receive the post's classes
 * (ast-article-single, hentry), so Astra's blog-post styles leak into the
 * design: 2.5em padding, a bottom margin and a white background on the
 * wrapper, and a grey 30px shadow on every image and figure. Reset them for
 * templates only; shadows set in Elementor still win (higher specificity).
 */
body .elementor-location-single.ast-article-single,
body .elementor-location-single.hentry {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

/* Astra's white background rule uses :not(.ast-related-post), so match its weight. */
body.ast-separate-container .elementor-location-single.ast-article-single:not(.ast-related-post) {
	background: none;
}

body .elementor-location-single.ast-article-single img,
body .elementor-location-single.ast-article-single figure {
	box-shadow: none;
}

/*
 * Background blend: fades the top of a section into the site background
 * (#eef5fd) so a background image has no hard edge where it starts.
 * Use: Elementor > container > Advanced > CSS Classes: sm-bg-blend
 * Optional per section (Custom CSS): selector { --sm-blend-height: 400px; }
 */
.sm-bg-blend {
	position: relative;
}

.sm-bg-blend::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: var(--sm-blend-height, 320px);
	background: linear-gradient(180deg, var(--sm-blend-color, #eef5fd) 0%, rgba(238, 245, 253, 0) 100%);
	pointer-events: none;
	z-index: 0;
}

.sm-bg-blend > * {
	position: relative;
	z-index: 1;
}

@media (max-width: 767px) {
	.sm-bg-blend::after {
		height: var(--sm-blend-height-mobile, 200px);
	}
}