/*!
Theme Name: saral
Theme URI: http://underscores.me/
Author: Falguni Desai
Author URI: https://falgunithemes.com
Description: A multipurpose theme for blog, small business and portfolio website
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: saral
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Saral is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

svg {
	overflow: visible !important;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Variables
--------------------------------------------- */
:root {
--body-background: #fff;
--primary-text-color: #212121;
--heading-text-color: #111;
--meta-text-color: #44464b;
--h1-font-size: 3.2rem;
--h2-font-size: 2.25rem;
--h3-font-size: 1.875rem;
--h4-font-size: 1.5rem;
--h5-font-size: 1.25rem;
--h6-font-size: 1.1rem;
--accent-color: #e35640;
--border-bottom-color: #efefef;
--footer-border-color: #f2f2f2;

--button-border-radius: 0;
--input-border-radius: 0;
--button-padding: 1rem 1.5rem;
--button-font-size: .9375rem;

--index-post-padding-left-desktop: 15px;
--index-post-padding-right-desktop: 15px;
--index-post-padding-top-desktop: 30px;
--index-post-padding-bottom-desktop: 30px;

--index-post-padding-left-mobile: 15px;
--index-post-padding-right-mobile: 15px;
--index-post-padding-top-mobile: 30px;
--index-post-padding-bottom-mobile: 30px;

--single-page-padding-left-desktop: 30px;
--single-page-padding-right-desktop: 30px;
--single-page-padding-top-desktop: 30px;
--single-page-padding-bottom-desktop: 30px;

--single-page-padding-left-mobile: 30px;
--single-page-padding-right-mobile: 30px;
--single-page-padding-top-mobile: 30px;
--single-page-padding-bottom-mobile: 30px;

--single-post-padding-left-desktop: 30px;
--single-post-padding-right-desktop: 30px;
--single-post-padding-top-desktop: 30px;
--single-post-padding-bottom-desktop: 30px;

--single-post-padding-left-mobile: 30px;
--single-post-padding-right-mobile: 30px;
--single-post-padding-top-mobile: 30px;
--single-post-padding-bottom-mobile: 30px;

--hero-section-padding-top-desktop: 30px;
--hero-section-padding-bottom-desktop: 30px;

--hero-section-padding-top-mobile: 30px;
--hero-section-padding-bottom-mobile: 30px;

--box-border-color: transparent;

}

/* Grid
--------------------------------------------- */
.container-custom {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: var(--primary-text-color,#242424);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 16px;
	line-height: 1.7;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	word-wrap: break-word;
	clear: both;
	color: var(--heading-text-color,#000);
	line-height: 1.2;
	margin-top: 0;
	margin-bottom: 0.5em;
}

h1 { font-size: 42px; }
h2 { font-size: 35px; }
h3 { font-size: 29px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 17px; }

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: var(--body-background,#fff);
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: var(--accent-color,#e35640);
}

a:visited {
	color: var(--accent-color,#e35640);
}

a:hover,
a:focus,
a:active {
	color: var(--accent-color,#e35640);
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: var(--accent-color,#e35640);
	border-radius: 2px;
	background: var(--accent-color,#e35640);
	color: #ffffff;
	font-size: 12px;
	letter-spacing: 2px;
	line-height: 1;
	padding: 1em 1.2em;
	text-transform: uppercase;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: var(--accent-color,#e35640);
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: var(--accent-color,#e35640);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: var(--primary-text-color,#212121);
	border: 1px solid #eaeaea;
	border-radius: 2px;
	padding: 10px 15px;
	width: 100%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: var(--primary-text-color,#212121);
}

select {
	border: 1px solid #eaeaea;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Site Header
--------------------------------------------- */
/*.site-header,
.main-navigation.toggled ul ul,
.main-navigation ul ul,
.read-more,.read-more:hover,.read-more:focus,
.single-post-content,.single-page-content,
.post,
.posts-navigation .nav-links .nav-previous a,
.posts-navigation .nav-links .nav-next a,
.page-numbers,.comments-area,
.post-navigation,
#secondary .widget,
.saral-search-overlay,
.woocommerce .products-wrap,
.saral-featured-posts,
.saral-related-posts,
.saral-blog-header {
	background-color: #fff;
}*/

/* Site Header
--------------------------------------------- */

.site-header {
	background-color: #ffffff;
}

.site-header-wrap {
	display: flex;
	flex-direction: row;
	position: relative;
	padding: 20px 0;
}

.site-branding {
    display: flex;
    flex-direction: column;
}
.site-title {
	margin-bottom: 0.2em;
}

.site-title a {
	color: var(--primary-text-color,#212121);;
	text-decoration: none;
}

.site-description {
	padding: 0;
	margin: 0;
}

.menu-toggle {
	flex-shrink: 0;
}

/* Mobile Header Styles */
.site-header {
    position: relative;
    width: 100%;
    z-index: 1000;
    border-bottom: 1px solid var(--border-bottom-color,#efefef); 
}

.site-header-wrap {
	position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
}

.menu-toggle {
	background: none;
    border: none;
    color: inherit;
	cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
   	padding: 0;
   	//margin-right: 10px;
}

#saral-search {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
	padding: 0;
}

#saral-search .svg-icon {
	width: 16px;
	height: 16px;
}

/* Search Overlay */
.saral-search-overlay {
	background-color: inherit;
    display: none; 
    position: absolute;
    top: 100%;
    left: 50%;
	transform: translateX(-50%);
    width: 100%;
    height: 100%;
    z-index: 9999;
    justify-content: center;
    align-items: center;
    padding: 20px;
    transform: translate(-50%, -50%);
}

.saral-search-overlay.active {
    display: flex;
}

.saral-search-overlay-content {
    background: #fff;
    padding: 10px;
    border-radius: 12px;
    max-width: 700px;
    width: 100%;
    position: relative;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

/* Make the form inputs larger */
.saral-search-overlay form {
    display: flex;
    gap: 10px;
    width: 100%;
}


.saral-search-overlay input[type="search"] {
	border-radius: 1px;
    padding: 10px;
    font-size: 16px;
    border: 2px solid #ddd;
}

.saral-search-overlay input[type="submit"] {
    padding: 15px 25px;
    font-size: 18px;
    background: #333;
    /*color: #fff;*/
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.3s ease;
}
.saral-search-overlay input[type="submit"]:hover {
    background: #000;
}

.saral-search-overlay-content {
  max-width: 700px;
  margin: 0 auto;
  padding: 20px;
}

.saral-search-overlay-content .search-form {
  display: flex;
  align-items: center;
  width: 100%;
}

.saral-search-overlay-content .search-field {
  flex: 1;
  width: 100%;
  padding: 12px 16px;
  font-size: 18px;
  border: 2px solid #ccc;
  border-radius: 4px 0 0 4px;
  box-sizing: border-box;
}

.saral-search-overlay-content .search-submit {
  padding: 12px 20px;
  font-size: 18px;
  border: 2px solid #ccc;
  border-left: none;
  border-radius: 0 4px 4px 0;
  background: #333;
  /*color: #fff;*/
  cursor: pointer;
}

.saral-search-overlay-content .search-submit:hover {
  background: #555;
}


/* Full circular close button */
.saral-search-close {
	position: absolute;
	top: -18px;
	right: -18px;
	/*background: #fff;*/
	border: 2px solid #aaa;
	border-radius: 50%;
	box-sizing: border-box;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 22px;
}

.saral-search-close:hover {
    background: #f5f5f5;
    transform: rotate(90deg);
}

.saral-search-close .svg-icon {
  width: 20px;
  height: 20px;
  fill: #aaa;
  display: block;
  overflow: visible !important;
}

@media all and (max-width: 767px) {
	.site-branding {
		flex: 1;
	}

	.saral-search-overlay-content {
	    padding: 10px;
	}

}

@media screen and (min-width: 768px) {

	.site-header-wrap {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.site-header-inner-wrap {
		display: flex;
		align-items: center;
	}
	.site-branding {
	    display: flex;
	    flex-direction: column;
	    justify-content: space-between;
	    margin-right: 2em;
	}

	.menu-toggle {
		display: none;
	}
}

/* Header Primary Navigation
--------------------------------------------- */


.main-navigation {
	display: none;
}

.main-navigation.toggled {
	display: block;
}
.main-navigation ul {
	/*background-color: #ffffff;*/
	/*display: none;*/
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation.toggled ul {
	display: block;
}

.main-navigation.toggled ul ul {
	/*background-color: #ffffff;*/
	display: none;
}

.main-navigation.toggled ul ul.toggled-on {
	display: block;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	color: var(--primary-text-color,#242424);;
	display: block;
	font-size: 14px;
	letter-spacing: 1px;
	text-decoration: none;
	text-transform: capitalize;
	padding: 5px 20px;
}


.main-navigation ul ul a {
	font-weight: normal;
}

/* Make the menu link a flex container */
.menu-item-has-children > a {
    display: inline-flex;        
    align-items: center;         
}

/* Arrow container */
.saral-dropdown-icon {
    display: inline-flex; 
    fill: currentColor;       
    width: 1em;                 
    height: 1em;                 
    margin-left: 0.3em;
}

/* SVG inside the container */
.saral-dropdown-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;          
    display: block;              
}

.dropdown-toggle {
    background: none;
    border: none;
    padding: 0;
    margin-left: 6px; 
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.dropdown-toggle .dropdown-icon {
    width: 1em;        
    height: 1em;
    fill: currentColor; 
    transition: transform 0.3s ease;
}

.dropdown-toggle.toggled-on .dropdown-icon {
    transform: rotate(180deg); 
}

.dropdown-toggle {
    /*background-color: #fff;*/
    border: 0;
    border-radius: 0;
    color: #1a1a1a;
    content: "";
    height: 50px;
    padding: 0;
    position: absolute;
    right: 0;
    left: auto;
    text-transform: none;
    top: 0;
    width: 40px;
    justify-content: center;
}

.dropdown-toggle:hover,
.dropdown-toggle:focus {
    /*background-color: #fff;*/
}

.dropdown-toggle:hover,
.dropdown-toggle:focus {
    background-color: transparent;
    border: none;
    color: #777;
    outline: none;
    outline-offset: -1px;
}

.dropdown-toggle:focus:after {
    border-color: transparent;
}




.main-navigation .primary-menu .open .sub-menu>li>a {
    color: var(--primary-text-color,#242424);;
}


.site-content {
	margin-top: 2em;
}

@media screen and (max-width: 767px) {
    /*.dropdown-toggle:hover,
    .dropdown-toggle:focus {
        outline: 1px solid #337ab7;
    }*/

    /* Hide desktop menu on mobile */
	.main-navigation {
	    display: none;
	    flex-direction: column;
	    width: 100%;
	    /*background-color: #fff;*/
	    position: absolute;
	    top: 100%;
	    left: 0;
	    border-top: 1px solid var(--border-bottom-color,#efefef);
	    border-bottom: 1px solid var(--border-bottom-color,#efefef);
	    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
	}

	.main-navigation.toggled {
		background-color: inherit;
	}

	/* Open menu when active */
	.main-navigation.active {
	    display: flex;
	}

	/* Menu items */
	.main-navigation .menu-item {
	    padding: 10px 20px;
	    border-bottom: 1px solid #eee;
	}

	.main-navigation .menu-item:last-child {
		border-bottom: none;
	}

	/* Optional: animate menu */
	.main-navigation {
	    max-height: 0;
	    overflow: hidden;
	    transition: max-height 0.3s ease-in-out;
	}

	.main-navigation.toggled {
		border-bottom: 1px solid var(--border-bottom-color,#efefef);
		height: auto;
	    max-height: 500px; 
	    overflow: scroll;
	}
	.saral-dropdown-icon {
		display: none;
	}
}

.main-navigation.toggled #mobile-social-nav ul {
	display: flex;
	flex-direction: row;
}
#mobile-social-nav {
	/*background-color: #ffffff;*/
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

#desktop-social-nav {
	display: none;
}
.social-nav {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  list-style: none;
  margin: 0 10px 0 0;
  padding: 15px 35px !important;
}

.social-nav li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--primary-text-color,#242424);;
  padding: 0;
  font-size: 16px;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* Default: show social menu on desktop */
.mobile-social-nav {
    display: block;
}

.header-extras {
	display: flex;
	justify-content: space-between;
	gap: 7px;
}

@media screen and (min-width: 768px) {

	.dropdown-toggle,
    .main-navigation ul .dropdown-toggle.toggled-on,
    .menu-toggle {
        display: none;
    }

    .main-navigation,
    .main-navigation.toggled {
    	display: flex;
    	flex: 1 0;
    	justify-content: center;
    	
    }
    .main-navigation.toggled ul,
	.main-navigation ul {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
	}

	.main-navigation.toggled ul ul,
	.main-navigation ul ul {
		/*background-color: #ffffff;*/
	    border: 1px solid #efefef;
		/*box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);*/
		display: block;
		position: absolute;
		padding: 20px 15px;
		left: -999em;
		top: 100%;
		z-index: 99999;
	    min-width: 220px;
	}

	.main-navigation.toggled ul ul ul,
	.main-navigation ul ul ul {
		display: block;
		left: -999em;
		top: 0;
	}

	.main-navigation ul ul li:hover > ul,
	.main-navigation ul ul li.focus > ul {
		display: block;
		left: auto;
	}

	.main-navigation ul ul a {
		justify-content: space-between;
		width: 200px;
	}

	.main-navigation ul li:hover > ul,
	.main-navigation ul li.focus > ul {
		left: auto;
	}

	.main-navigation ul ul li:hover>ul,
	.main-navigation ul ul li.focus>ul {
	    left: 100%;
	}

	.main-navigation a:first-child {
	  padding-left: 0;
	}

	.social-nav {
	  padding: 0 !important;
	}
	.social-nav li,
	.social-nav li a {
		line-height: 20px;
		font-size: 20px;
		padding: 0;
		margin: 0;
	}

	#mobile-social-nav {
		display: none;
	}

	#desktop-social-nav {
		display: flex;
	}

	.site-content {
		margin-top: 2em;
	}
}

.saral-cta-buttons {
    display: flex;
    gap: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

@media (max-width: 767px) {
	.saral-cta-buttons {
	    padding: 15px 20px;
	}
	.saral-cta-buttons a {
		color: #fff;
	}
}

.saral-cta-btn,
.saral-cta-btn:visited {
    padding: 5px 15px;
    background: var(--accent-color, #e35640);
    color: #fff;
    text-decoration: none;
}

.saral-cta-btn:hover,
.saral-cta-btn:focus {
    opacity: 0.9;
    color: #fff;
}


/* Featured Posts Section
--------------------------------------------- */
.saral-featured-posts {
	
    margin: 40px auto;
    padding-top: 20px;
    padding-bottom: 20px;
}
.saral-featured-posts,
.saral-blog-header {
	/*background-color: #ffffff;*/
	padding-left: var(--index-post-padding-left-mobile);
    padding-right: var(--index-post-padding-right-mobile);
}

.saral-featured-header {
    text-align: left;
    margin-bottom: 25px;
}

.saral-featured-header h2 {
    font-size: 32px;
    font-weight: 700;
}

.saral-featured-subtitle {
    font-size: 16px;
    color: #666;
    margin-top: 8px;
}

/* Grid Layout */
.saral-featured-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    grid-gap: 24px;
}

.saral-featured-item {
    overflow: hidden;
}

.saral-featured-item .featured-thumb img {
    width: 100%;
    height: auto;
    display: block;
}

.saral-featured-item .post-categories {
	padding-top: 15px;
	margin-top: 20px;
    margin-bottom: 15px;
}
.featured-cat-header {
	margin-top: 20px;
}

.featured-title {
    font-size: 20px;
    margin-top: 0;
    margin-bottom: 10px;
    line-height: 1.3;
}

.featured-title a,
.featured-title a:hover,
.featured-title a:focus {
    text-decoration: none;
    color: #212121;
}

.featured-meta {
    font-size: 14px;
    color: #777;
    margin-top: 0;
    margin-bottom: 15px;
}

.saral-featured-item .post-categories,
.featured-title,
.featured-meta {
	margin-left: 0px;
	margin-right: 0px;
}

/* Blog Page Header */
.saral-blog-header {
    margin: 0 auto 15px;
    text-align: left;
}

.saral-blog-title {
    font-size: 36px;
    margin-top: 0;
    margin-bottom: 10px;
}

.saral-blog-subtitle {
	margin-bottom: 0;
}

@media ( min-width: 768px ) {
	.saral-featured-posts {
	    margin: 40px auto;
	    padding-top: 30px;
	    padding-bottom: 30px;
	}
	.saral-featured-posts,
	.saral-blog-header {
	   padding-left: var(--index-post-padding-left-desktop);
	   padding-right: var(--index-post-padding-right-desktop);
	}
}

/* Breadcrumbs
--------------------------------------------- */
.breadcrumb {
	align-items: center;
	color: var(--primary-text-color);
	display: flex;
	flex-wrap: wrap;
	font-size: 13px;
	//margin-top: 2em;
	letter-spacing: 1px;
	//padding-top: 10px;
	padding-bottom: 10px;
	//margin-bottom: 2em;
}

.saral-breadcrumb-wrapper {
	word-wrap: break-word;
}

.breadcrumb a {
	color: var(--primary-text-color,#212121);
	padding: 0 10px;
	text-decoration: underline;
}
.breadcrumb a:hover {
	text-decoration: underline;
}
.breadcrumb a:first-child {
	padding-left: 0;
}

@media all and (min-width: 768px) {
	.saral-breadcrumb-wrapper {
		margin-left: auto;
		margin-right: auto;
	}
}


/* Comments Navigation
--------------------------------------------- */

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

.nav-previous a,
.nav-next a {
	float: left;
}

.nav-previous a img,
.nav-next a imag{
	width: 75px;
}

/* Wrapper */
.saral-post-navigation {
    /*background-color: #ffffff;*/
    margin-top: 2em;
    margin-bottom: 2em;
    overflow: hidden;
}

/* Each nav item */
.saral-post-navigation .nav-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 40px 30px;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid var(--border-bottom-color,#efefef);
    transition: background 0.25s ease;
}

.saral-post-navigation .nav-item:last-child {
    border-bottom: none;
}

/* Content */
.nav-content {
    flex: 1;
    padding: 0 40px;
}

.nav-label {
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1.2px;
    color: var(--primary-text-color,#212121);
}

.nav-title {
    margin-top: 8px;
    font-size: 22px;
    color: var(--primary-text-color,#212121);
    line-height: 1.35;
}

/* Thumbnails */
.nav-thumb img {
    width: 75px;
    height: 75px;
    object-fit: cover;
}

/* SVG arrows */
.nav-arrow svg {
    transition: transform 0.25s ease;
}

.nav-item:hover .arrow-left svg {
    transform: translateX(-4px);
}

.nav-item:hover .arrow-right svg {
    transform: translateX(4px);
}

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

    .saral-post-navigation .nav-item {
        /*flex-direction: column;*/
         flex-direction: row;
        text-align: center;
        padding: 30px 20px;
    }

    .nav-content {
        padding: 20px 0;
    }

    .nav-arrow {
        padding-top: 15px;
    }

    /*.nav-thumb img {
        width: 100%;
        height: 220px;
    }*/
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.main-content-wrap {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
}

.post {
	/*background: #ffffff;*/
	margin: 0 0 2em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

.entry-header {
	padding-top: var(--index-post-padding-top-mobile,20px);
	margin-bottom: 1em;
}

.entry-header .post-categories p{
	line-height: 1.2;
	margin: 10px 0;
}

.entry-header .post-categories p {
	line-height: 1.2;
	font-weight: 700;
}

.entry-header .posted-on a {
	color: var(--primary-text-color,#242424);
	text-decoration: none;
	text-transform: capitalize;
}

.entry-header-categories,
.entry-header,
.entry-footer,
.search .entry-summary,
.comments-area,
.entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg) {
  	padding-left: var(--index-post-padding-left-mobile,20px);
	padding-right: var(--index-post-padding-right-mobile,20px);
	
}

.entry-title a,
.featured-title a {
	background: linear-gradient(to right,currentColor 0%,currentColor 100%);
	background-size: 0px 1px;
	background-position: 0 95%;
	-webkit-transition: background-size .25s cubic-bezier(.785,.135,.15,.86) 0s;
	-o-transition: background-size .25s cubic-bezier(.785,.135,.15,.86) 0s;
	transition: background-size .25s cubic-bezier(.785,.135,.15,.86) 0s;
	padding: .1% 0;
	background-repeat: no-repeat;
	color: inherit;
}

.entry-title a:hover,
.entry-title a:focus,
.featured-title a:hover,
.featured-title a:focus  {
	background-size: 100% 1px;
}

blockquote {
	border-left: 1px solid var(--accent-color,#e35640) !important;
	padding: 50px 40px 40px !important;
	background: rgba(204,204,204,.1);
	font-size: 20px;
	margin: 40px 0;
}
blockquote cite {
	color: #666;
    display: block;
    margin-top: 8px;
    font-size: 0.9rem;
    font-style: normal;
    text-align: right;
}

.single .entry-title {
	margin-bottom: 10px;
}

.single .entry-header,
.single .entry-footer,
.single .post-navigation,
.single .comments-area,
.single .entry-header-categories, 
.single .search .entry-summary, 
.saral-post-inner-wrap,
.single .saral-related-posts,
.single .entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg),
.single .comments-area,
.saral-post-navigation .nav-item {
	padding-left: var(--single-post-padding-left-mobile,30px);
	padding-right: var(--single-post-padding-right-mobile,30px);
}
.page .entry-header,
.page .entry-footer,
.page .entry-header-categories, 
.page .search .entry-summary, 
.page .comments-area,
.page .entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg) {
	padding-left: var(--single-page-padding-left-mobile,30px);
	padding-right: var(--single-page-padding-right-mobile,30px);
}

.single .entry-header {
	padding-top: var(--single-post-padding-top-mobile,30px);
}
.page .entry-header {
	padding-top: var(--single-page-padding-top-mobile,30px);
}

.single .entry-footer {
	padding-bottom: var(--single-post-padding-bottom-mobile,30px);
}
.page .entry-content {
	padding-bottom: var(--single-page-padding-bottom-mobile,30px);
}

.single .entry-content .wp-block-image {
	margin-top: 2em;
	margin-bottom: 2em;
    text-align: center;      
}

.single .entry-content .wp-block-image img {
    display: block;          
    margin-left: auto;
    margin-right: auto;     
}

.single .entry-header {
	padding-bottom: 30px;
}

@media screen and (min-width: 768px) {
	.single .site-header-wrap,
	.single .entry-header,
	.single .entry-footer,
	.single .post-navigation,
	.single .comments-area,
	.single .entry-header-categories, 
	.single .search .entry-summary, 
	.single .saral-related-posts,
	.saral-post-inner-wrap,
	.saral-post-navigation .nav-item,
	.single .entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg) {
		padding-left: var(--single-post-padding-left-desktop,30px);
		padding-right: var(--single-post-padding-right-desktop,30px);
	}

	.page .site-header-wrap,
	.page .entry-header,
	.page .entry-footer,
	.page .post-navigation,
	.page .entry-header-categories, 
	.page .search .entry-summary, 
	.page .comments-area,
	.page .entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg) {
		padding-left: var(--single-page-padding-left-desktop,30px);
		padding-right: var(--single-page-padding-right-desktop,30px);
	}

	.single .entry-header {
		padding-top: var(--single-post-padding-top-desktop,30px);
	}
	.page .entry-header {
		padding-top: var(--single-page-padding-top-desktop,30px);
	}

	.single .entry-footer {
		padding-bottom: var(--single-post-padding-bottom-desktop,30px);
	}
	.page .entry-content {
		padding-bottom: var(--single-page-padding-bottom-desktop,30px);
	}
}

.archive .entry-title,
.blog .entry-title {
	font-size: 30px;
}

.nav-links a,
.nav-links a:visited,
.entry-title a,
.entry-title a:visited {
	color: var(--primary-text-color,#212121);
	text-decoration: none;
}

.entry-title {
	text-transform: capitalize;
}

.nav-links a:hover {
	color: var(--accent-color);
}

.entry-meta .svg-icon,
.entry-footer .svg-icon {
	width: 12px;
	height: 12px;
}
.comment-metadata,
.entry-meta, .entry-meta a,.entry-meta a:visited,
.entry-footer, .entry-footer a,.entry-footer a:visited {
	font-size: 12px;
	letter-spacing: 2px;
}
.entry-meta,.entry-footer {
	color: var(--primary-text-color,#242424);
	text-transform: capitalize;
}

.entry-meta a,.entry-meta a:visited,
.entry-footer a,.entry-footer a:visited {
	color: var(--meta-text-color,#44464b);
	font-style: normal;
	text-decoration: none;
}

/*.entry-meta span span:not(:first-child)::before {
  content: "";
  display: inline-block;
  width: 6px;           
  height: 6px;
  background-color: currentColor;
  border-radius: 50%;
  margin: 0 8px;
  vertical-align: middle;
}*/

.footer-meta-wrap{
	display: flex;
	align-items: center;
	gap: 12px;
	padding-top: 15px;
	padding-bottom: var(--index-post-padding-bottom-mobile,30px);
	width: 100%;
}

.single .entry-footer .categories-list,
.single .entry-footer .tags-list {
	display: flex;
	flex: 1 0 100%;
	margin-bottom: 1em;
	padding: 20px 0;
}
.single .entry-footer .tags-list {
	border-top: 1px solid var(--border-bottom-color,#efefef);
}

.single .entry-footer .cat-links a {
	padding: 5px 7px;
	border: 1px solid var(--border-bottom-color,#efefef);
}

.tags-links a {
    display: inline-block;
    background: #f3f3f3;
    padding: 3px 10px;
    margin-right: 5px;
    border-radius: 20px;
    text-decoration: none;
    color: #444;
    font-size: 14px;
    transition: all 0.2s ease;
}

.single .cat-links a:hover {
    background: #000;
    color: #fff;
}


.entry-meta {
  display: flex;
  align-items: center;
  gap: 6px;
}

.entry-meta .byline img {
	border-radius: 50%;
	margin-right: 5px;
}

.entry-meta .byline .author a {
	margin-left: 5px;
	font-style: normal;
}

.entry-meta,
.entry-meta .byline {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	flex-wrap: wrap;
	text-transform: capitalize;
}

.read-more {
	background: transparent;
	border: none;
	padding: 0;
}

.read-more a {
	color: var(--primary-text-color,#212121);
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
}
.read-more a:hover,.read-more a:focus {
	padding: 0;
	background: transparent;
	border: none;
	text-decoration: underline;
}

.single .post-thumbnail {
	margin-bottom: 2em;
}

.post-featured-img img {
	width: 100%;
}


.no-sidebar-narrow .site-main {
	margin-left: auto;
	margin-right: auto;
}


.post,
.page {
	word-wrap: break-word;
}

.grid-post {
	width: 100%;
	padding-bottom: 30px;
}
.entry-header-categories {
	margin-top: 20px;
}

.entry-header-categories,
.post-categories,
.post-categories a,
.post-categories a:visited,
.post-categories a:hover
{
	color: var(--accent-color,#e35640);
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-decoration: none;
}

.entry-content-wrap
.post-featured-img {
	flex: 0 0 auto;
    width: 100%;
}



/*.no-sidebar .breadcrumb
.no-sidebar .entry-header-categories,
.no-sidebar .entry-header,
.no-sidebar .entry-footer,
.no-sidebar .search .entry-summary,
.no-sidebar .nav-links,
.no-sidebar .comment-respond,
.no-sidebar .entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg),
.single .no-sidebar .entry-header-categories,
.single .no-sidebar .entry-header,
.single .no-sidebar .entry-footer,
.single .no-sidebar .search .entry-summary,
.single .no-sidebar .nav-links,
.single .no-sidebar .comment-respond,
.single .no-sidebar .entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg) {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
}
*/

.no-sidebar :where(
    .breadcrumb,
    .entry-header-categories,
    .entry-header,
    .entry-footer,
    .search .entry-summary,
    .nav-links,
    .saral-post-navigation,
    .saral-related-posts,
    .comments-area,
    .comment-respond,
    .entry-content > *
):not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg):not(.post-featured-img) {
    max-width: 960px;
    margin-inline: auto;
}



.posts-navigation,
.post-navigation {
	padding-top: 40px;
	padding-bottom: 40px;
}
.posts-navigation {
	padding-left: var(--index-post-padding-left-mobile,20px);
	padding-right: var(--index-post-padding-right-mobile,20px);
}
.nav-links,
.posts-navigation .nav-links .nav-previous ,
.posts-navigation .nav-links .nav-next {
	display: block;
	width: 100%;
}

.posts-navigation {
	text-align: center;
}
.post-navigation,
.posts-navigation .nav-links .nav-previous a,
.posts-navigation .nav-links .nav-next a {
	/*background-color: #ffffff;*/
}
.posts-navigation .nav-links .nav-previous a,
.posts-navigation .nav-links .nav-next a {
	padding: 10px 0px;
}
.posts-navigation a {
	//border-bottom: 1px solid;
	color:var(--primary-text-color,#424242);
	font-size: 16px;
	padding-bottom: 4px;
	text-decoration: none;
	text-transform: capitalize;
}

.nav-links {
	font-size: 22px;
	letter-spacing: 2px;
	font-weight: 700;
}

.nav-links .nav-next,
.nav-links .nav-previous {
	padding: 0px;
	word-wrap: break-word;
}

.navigation.pagination {
  display: flex;
  justify-content: center;
  margin: 2rem 0;
}

.page-numbers {
	/*background-color: #ffffff;*/
	display: inline-block;
	padding: 8px 14px;
	margin: 0 4px;
	//border: 1px solid var(--box-border-color,transparent);
	border-radius: 2px;
	color: var(--primary-text-color,#212121);
	text-decoration: none;
	transition: all 0.3s ease;
}
a.page-numbers,a.page-numbers:visited {
	color: var(--primary-text-color,#212121);
	font-size: 15px;
}
.page-numbers:hover {
  background-color: var(--accent-color,#e35640);
  color: #fff !important;
}

.page-numbers.current {
  background-color: var(--accent-color,#e35640);
  color: #fff;
}


.no-sidebar-narrow > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 840px;
	margin-left: auto !important;
	margin-right: auto !important;
}
 
.entry-footer {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
}

.entry-footer .byline,
.entry-footer .cat-links {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}


.entry-footer .cat-links .svg-icon {
	margin-right: 5px;
}

.entry-footer .byline img.avatar {
	border-radius: 50%;
	margin-right: 5px;
}

.footer-meta-wrap{
	border-top: 1px solid var(--border-bottom-color,#fafafa);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 15px;
	padding-bottom: var(--index-post-padding-bottom-mobile,30px);
	width: 100%;
}

.footer-meta-wrap .byline {
	flex-shrink: 0;
}

.footer-meta-wrap .cat-links {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 100%;
	flex-wrap: wrap;
}

.footer-meta-wrap .byline {
	font-style: italic;
}

.footer-meta-wrap .byline .author {
	margin-left: 4px;
}

@media (min-width: 768px) {
	.main-content-wrap {
		justify-content: space-between;
	}
	.site-main {
		padding-left: 0;
		padding-right: 0;
	}
	/*.list-post .has-post-thumbnail .post-featured-img {
	    width: 33.33333333%;
	}
	.list-post .has-post-thumbnail .entry-content-wrap {
	    width: 66.66666667%;
	}*/
	.grid-post {
		width: 48%;	
	}
	.no-sidebar .grid-post,
	.no-sidebar-narrow .grid-post {
		width: 31%;
		margin-right: calc( 100/3 - 31)%;
	}
	
	.entry-header {
		padding-top: var(--index-post-padding-top-desktop,2em);
	}

	.entry-header-categories,
	.entry-header,
	.entry-footer,
	.search .entry-summary,
	.entry-content > *:not(img):not(figure):not(.wp-block-gallery):not(video):not(iframe):not(.wp-block-embed):not(canvas):not(svg) {
	  	padding-left: var(--index-post-padding-left-desktop,20px);
		padding-right: var(--index-post-padding-right-desktop,20px);
	}
	.nav-links .nav-next a {
		float: right;
	}
}

.archive .page-header {
	margin-bottom: 2em;
}


/* Comments
--------------------------------------------- */
.comments-area {
	/*background-color: #ffffff;*/
	padding-top: 30px;
	padding-bottom: 30px;
	margin-bottom: 3em;
}
.comments-area ol,
.comments-area ul {
	margin-left: 0;
	padding-left: 0;
	font-size: 15px;
	list-style: none;
}
.comment-meta a {
	color: var(--primary-text-color,#242424);
	text-decoration: none;
}
.comment-author {
	display: flex;
	align-items: center;
}
.comment-author.vcard img {
	border-radius: 50%;
	margin-right: 10px;
}
.comment-content a {
	word-wrap: break-word;
}
.comment-metadata {
	color: var(--meta-text-color,#44464b);
}

.bypostauthor {
	display: block;
}

.comment-form:after {
    content: "";
    display: block;
    clear: both;
}

.comment-content p {
	margin-bottom: 1em;
}
.comment-body {
	margin-bottom: 2em;
}


@media screen and (min-width: 768px) {
	.comment-form-author,
	.comment-form-email,
	.comment-form-url {
	    width: 33.33%;
	    float: left;
	    padding-right: 20px;
	    box-sizing: border-box;
	}

	.comment-form-author label,
	.comment-form-email label,
	.comment-form-url label {
	    display: block;
	    margin-bottom: 5px;
	}
}

/* Related Posts
--------------------------------------------- */
/* White background box */
.saral-related-posts {
    /*background-color: #ffffff;*/
    margin: 2em 0;
    padding-top: 30px;
    padding-bottom: 30px;
}

/* Title style */
.saral-related-posts .related-title {
    font-size: 1.5rem;
    margin-bottom: 25px;
    font-weight: 600;
    border-bottom: 2px solid var(--bs-gray-300);
    padding-bottom: 10px;
}

/* Grid layout */
.related-posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 30px;
}

/* No border-radius anywhere */
.related-post-item img {
    width: 100%;
    height: auto;
    border-radius: 0;
}

/* Two category labels */
.related-post-cats {
    margin-top: 10px;
    margin-bottom: 6px;
}

.related-post-cats .rpc-cat {
    display: inline-block;
    background: #f5f5f5;
    color: var(--bs-dark);
    font-size: 0.75rem;
    padding: 3px 8px;
    margin-right: 5px;
    text-transform: capitalize;
    border-radius: 0; /* no rounded corners */
}

/* Post title */
.related-post-title {
    font-size: 20px;
    margin-top: 5px;
}

.related-post-title a {
    color: var(--post-heading-color,#212121);
    text-decoration: none;
}

.related-post-title a:hover {
    color: var(--accent-color,#e35640);
}

/* 3 posts in one row */
.related-posts-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* Tablet (2 columns) */
@media (max-width: 992px) {
    .related-posts-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile (1 column) */
@media (max-width: 576px) {
    .related-posts-grid {
        grid-template-columns: 1fr;
    }
}



/* Site Footer
--------------------------------------------- */
.site-footer {
	background-color: #f6f8fa;/*rgb(249,249,249);*/
	color: #aaaaaa;
	font-size: 16px;
	margin-top: 2em;
}

.site-footer,
.site-footer a{
	color: var(--primary-text-color,#242424);
	text-decoration: none;
}
.footer-widget-area {
	border-top: 1px solid var(--footer-border-color,#efefef);
	padding: 20px 0;
	text-align: center;
}

.footer-widget-area .widget {
	padding-left: 10px;
	padding-right: 10px;
}

.site-info {
	border-top: 1px solid var(--footer-border-color,#f2f2f2);
	padding: 20px 100px;
	text-align: center;
}


.site-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.site-footer a:hover {
	text-decoration: underline;
}

.site-info-credit {
    margin-bottom: 5px;
}

/* Footer menu UL */
.saral-footer-menu {
    display: flex;
    gap: 10px 20px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: center;
}

/* Footer menu links */
.saral-footer-menu a {
    text-decoration: none;
}

.saral-footer-menu a:hover {
    text-decoration: underline;
}

.site-info-menu,
.site-info-credit,
.site-info-social-links {
	margin-top: 10px;
	margin-bottom: 10px;
}
/* Mobile adjustments */
@media (max-width: 767px) {
    .site-info {
        flex-direction: column;
        padding: 20px 30px;
        text-align: center;
    }

    .saral-footer-menu {
    	gap: 10px 10px;
        margin-top: 10px;
    }

    .site-info-menu,
	.site-info-credit,
	.site-info-social-links {
		margin-top: 5px;
		margin-bottom: 5px;
	}
}


/* Widgets
--------------------------------------------- */

#secondary {
	padding-left: 0;
	padding-right: 0;
}

.widget,
.widget a {
	font-size: 16px;
}

.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

.widget ul {
	margin: 0px;
	padding: 0;
	list-style: none;
}

.widget ul a {
	text-decoration: none;
}

.widget {
  padding: 20px;
  margin-bottom: 30px;
}

.widget-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: #222;
  margin-bottom: 1rem;
  border-left: 4px solid var(--accent-color,#e35640);
  padding-left: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.widget a,
.widget a:hover {
  color: var(--primary-text-color,#212121);
  text-decoration: none;
}

.widget li{
	padding-top: 15px;
	padding-bottom:15px;
	border-bottom: 1px solid #efefef;
	text-transform: capitalize;
}
.widget li:last-child {
	border-bottom: none;
}

#secondary .widget,
#secondary .widget ul a {
	color: var(--primary-text-color,#242424);
}
#secondary .widget {
	/*background-color: #ffffff;*/
	padding: 20px;
}

#secondary .widget-title {
	padding-bottom: 5px;
}
@media (min-width: 768px) {
	#secondary {
		padding-left: 30px;
		padding-right: 0;
	}
	.left-sidebar #secondary{
		padding-left: 0px;
		padding-right: 30px;
	}
}

/* Reset all flex behavior */
.widget_categories li {
    display: block !important;
    position: relative;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-bottom-color,#efefef);
}

/* Parent indentation = none */
.widget_categories > ul > li {
    margin-left: 0;
}

/* Children indentation */
.widget_categories ul.children {
    margin-left: 20px;
    padding-left: 0;
}

/* Child LI = always new line */
.widget_categories ul.children li {
    display: block !important;
    width: 100%;
}

/* Category name should use full width */
.widget_categories li > a {
    display: inline-block;
    width: calc(100% - 50px); /* ensure badge fits */
    white-space: normal;
}

/* Badge floated to the right */
.widget_categories li .count {
    float: right;
    background: var(--primary-text-color,#212121);
    color: #fff;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    margin-left: 5px;
}

/* Recent Posts widget */
.widget_recent_entries ul li {
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.widget_recent_entries ul li:last-child {
    border-bottom: none;
}

.widget_recent_entries .post-date {
    display: block;
    font-size: 12px;
    color: #777;
    margin-top: 3px;
}

/* Recent Comments */

.widget_recent_comments ol,
.widget_recent_comments ul {
	padding-left: 0;
}
.widget_recent_comments ul li {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    font-size: 0.95rem;
}

.widget_recent_comments ul li:last-child {
    border-bottom: none;
}

.widget_recent_comments a {
    font-weight: 600;
    color: var(--primary-text-color,#212121);
}

/* Archive widget */
.widget_archive ul li {
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
}

.widget_archive li a {
    color: var(--bs-primary);
    text-decoration: none;
}

/* Tagcloud widget */
.tagcloud a {
    background: var(--primary-text-color,#212121);
    color: #fff !important;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 14px !important;
    display: inline-block;
    margin: 5px 5px 0 0;
    transition: 0.3s ease;
}

.tagcloud a:hover {
    background: #000;
}

/* Calendar widget */
.widget_calendar table {
	font-size: 12px;
    width: 100%;
    text-align: center;
    border-collapse: collapse;
}

.widget_calendar td,
.widget_calendar th {
    padding: 4px;
    border: 1px solid #eee;
}

.widget_calendar caption {
    font-weight: 700;
    margin-bottom: 10px;
}

.widget_calendar #today {
    background: var(--primary-text-color,#212121);
    color: #fff;
    border-radius: 4px;
}

/* Menu Widget */
.widget_nav_menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Menu item */
.widget_nav_menu ul li {
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid #f5f5f5;
    position: relative;
}

/* Menu link */
.widget_nav_menu ul li a {
    display: block;                     /* ensures full-width clickable */
    color: #333;
    text-decoration: none;
    font-size: 15px;
    padding-right: 30px;                /* space for arrow / icon */
}

/* Hover effect */
.widget_nav_menu ul li a:hover {
    color: var(--primary-text-color,#212121);
}

/* Indentation */
.widget_nav_menu ul.sub-menu {
    margin-left: 20px;
    border-left: 1px solid #eee;
    padding-left: 12px;
}

/* Child menu item */
.widget_nav_menu ul.sub-menu li {
    display: block;
    padding: 8px 0;
    border-bottom: 1px solid #f7f7f7;
}

/* Child link full width */
.widget_nav_menu ul.sub-menu li a {
    display: block;
    width: 100%;
}

.widget_nav_menu li.menu-item-has-children > a::after {
    content: "›";                       /* simple arrow */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    font-size: 16px;
}

/* Change arrow color on hover */
.widget_nav_menu li.menu-item-has-children > a:hover::after {
    color: var(--primary-text-color,#212121);
}

/* Widget title */
.widget.widget_block .wp-block-heading {
   margin-bottom: 0;
}

/* Widget block ONLY if it contains a heading block */
.widget_block:has(> .wp-block-heading),
#secondary .widget .widget_block:has(> .wp-block-heading) {
    padding-top: 20px !important;
    padding-bottom: 0px !important;
}

.widget_block:has(> .wp-block-heading) {
    margin-bottom: 0;
}

/* Search Form widget
--------------------------*/
.search-form {
    position: relative;
    margin-bottom: 2em;
}

.widget .search-form {
    margin-bottom: 0;
}

.search-form label {
    width: 100%;
    margin-bottom: 0px;
}

.search-form label {
    width: 100%;
    margin-bottom: 0px;
}

.search-form .search-field{
	max-width: 100%;
}

.search-form input[type="submit"] {
	background-color: var(--accent-color,#e35640);
	border-color: var(--accent-color,#e35640);
    border-radius: 0 2px 2px 0;
    bottom: 0;
    color: #fff;
    font-size: 12px;
    overflow: hidden;
    padding: 0 4px;
    position: absolute;
    right: 0;
    top: 0;
    left: auto;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}
.svg-icon {
  width: 16px;
  height: 16px;
  fill: currentColor; /* makes it inherit button text color */
  display: inline-block;
  vertical-align: middle;
}

/* Gutenberg Blocks styling
--------------------------------------------------------*/
.wp-block-latest-posts a,
.wp-block-latest-posts a:visited {
	color: var(--primary-text-color,#212121);
	display: block;
	text-align: left;
	text-decoration: none;

}
/*.wp-block-latest-posts .wp-block-latest-posts__post-title {
	margin-bottom: 10px;
}*/

@media (min-width: 600px) {
    .wp-block-latest-posts.columns-3 li {
        width: calc(33.33% - 2em);
        margin-right: 2em;
    }
}


/* Dark Mode 
--------------------------------------------------------*/

/* Toggle button styling */
.theme-toggle {
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transition: transform 0.3s ease;
  padding: 0px;
}

.theme-toggle:hover {
  transform: scale(1.1);
}

/* SVG icons */
.theme-toggle svg {
  width: 16px;
  height: 16px;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Moon hidden by default */
#moon-icon {
  display: none;
}

/* Dark mode */
body.dark-mode {
  --body-background: #212121 !important;
  --primary-text-color: #f9f9f9;
  --heading-text-color: #f0f0f0;
  --link-color: #66b2ff;
  --border-bottom-color: #727272 !important;
}

body.dark-mode .site-header,
body.dark-mode .main-navigation.toggled ul ul,
body.dark-mode .main-navigation ul ul,
body.dark-mode .read-more,
body.dark-mode .read-more:hover,
body.dark-mode .read-more:focus,
body.dark-mode .post,
body.dark-mode.page,
body.dark-mode.page article,
body.dark-mode .posts-navigation .nav-links .nav-previous a,
body.dark-mode .posts-navigation .nav-links .nav-next a,
body.dark-mode .page-numbers:not(.current),
body.dark-mode .comments-area,
body.dark-mode #secondary .widget,
body.dark-mode.custom-background,
body.custom-background.dark-mode,
body.dark-mode .main-navigation,
body.dark-mode .site-footer,
body.dark-mode .site-footer .site-info,
body.dark-mode .saral-breadcrumbs-wrapper,
body.dark-mode .saral-search-overlay,
body.dark-mode .saral-search-overlay-content,
body.dark-mode .saral-search-overlay input[type="search"],
body.dark-mode.woocommerce #primary .products-wrap,
body.dark-mode.woocommerce .orderby,
body.dark-mode .saral-featured-posts,
body.dark-mode .saral-blog-header,
body.dark-mode .saral-post-navigation,
body.dark-mode .saral-related-posts,
body.dark-mode .nav-title,
body.dark-mode .nav-label,
body.dark-mode .tags-links a,
body.dark-mode .single-page-content,
body.dark-mode .single-post-content,
body.dark-mode input,
body.dark-mode textarea {
	background-color: #212121 !important;
}
body.dark-mode input[type="submit"],
body.dark-mode input[type="submit"]:focus {
	background-color: var(--accent-color,#e35640) !important;
}
/* When dark mode is active */
body.dark-mode #sun-icon {
  display: none;
}


body.dark-mode #moon-icon {
  display: inline-block;
}

/* Smooth theme transition */
body {
  transition: background-color 0.3s, color 0.3s;
}

body.dark-mode .widget_calendar table th,
body.dark-mode .widget_calendar #today {
	color: #212121;
}

body.dark-mode .site-footer,
body.dark-mode .site-footer,
body.dark-mode .menu-toggle,
body.dark-mode .widget,
body.dark-mode .widget a,
body.dark-mode .widget-title,body.dark-mode #moon-icon,
body.dark-mode .entry-meta a, body.dark-mode .entry-meta a:visited, body.dark-mode .entry-footer a, body.dark-mode .entry-footer a:visited,
body.dark-mode div.wpforms-container-full .wpforms-field-label, 
body.dark-mode .wp-core-ui div.wpforms-container-full .wpforms-field-label,
body.dark-mode div.wpforms-container-full .wpforms-field-sublabel, 
body.dark-mode  .wp-core-ui div.wpforms-container-full .wpforms-field-sublabel,
body.dark-mode .saral-featured-title,
body.dark-mode .saral-featured-subtitle,
body.dark-mode .saral-featured-item .featured-title a,
body.dark-mode .saral-featured-item .featured-meta,
body.dark-mode .saral-blog-title,
body.dark-mode .saral-blog-subtitle,
body.dark-mode .wp-block-calendar :where(table:not(.has-text-color)),
body.dark-mode .saral-post-navigation .nav-item {
	color: #f5f5f5;
}
body.dark-mode .svg-icon {
	fill: #f5f5f5;
}

body.dark-mode .cart-count {
	color: #212121;
}
body.dark-mode .main-navigation.toggled ul ul, 
body.dark-mode .main-navigation ul ul,
body.dark-mode .widget li {
	border-color: var(--border-bottom-color,#727272) !important;
}

/* WooCommerce
---------------------------------------*/

.woocommerce .products-wrap {
	/*background-color: #ffffff;*/
}
.cart-menu-item a {
    position: relative; /* so .cart-count can position inside */
    display: inline-block;
}

.cart-count {
    background: var(--primary-text-color,#212121);
    color: #fff;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -6px;
    right: -8px;
}

.archive.woocommerce .products {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.woocommerce ul.products li.product img {
	width: 100%;
	margin-bottom: 30px;
}

.woocommerce-loop-product__title {
	text-decoration: none;
}

.woocommerce .product .price .woocommerce-Price-amount.amount,
.woocommerce .product  .add_to_cart_button {
	color: var(--primary-text-color,#212121);
	text-decoration: none;
}
.woocommerce .orderby {
	border-radius: 2px;
    border-color: var(--primary-text-color);
	color: var(--primary-text-color);
	margin-bottom: 20px;
    padding: 5px 10px;
}
.woocommerce .product  .add_to_cart_button {
	text-decoration: underline;
}

.woocommerce .product .woocommerce-LoopProduct-link,
.woocommerce .product .woocommerce-LoopProduct-link:visited,
.woocommerce .product .woocommerce-LoopProduct-link:focus,
.woocommerce .product button.product_type_grouped {
 	color: var(--primary-text-color,#212121);
	text-decoration: none;
}
/* Position the sale badge absolutely inside product card */
.woocommerce ul.products li.product .onsale,
.woocommerce div.product .onsale {
    position: absolute;
    top: 10px;
    left: 10px;

    background: var(--accent-color,#e35640);
    color: #fff;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 50px;
    z-index: 20;

    display: inline-block;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.woocommerce #primary {
	padding: 0;
}
.woocommerce #primary .products-wrap {
	padding: 30px;
}
.woocommerce .products .woocommerce-loop-product__title {
	font-size: 20px;
}

/* Pagination container */
.woocommerce-pagination {
    text-align: center;
    margin: 40px 0;
}
.woocommerce .page-numbers:hover{
	background: inherit;
	color: inherit;
}

/* Align list items */
.woocommerce-pagination ul.page-numbers {
    display: inline-flex;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Base style for page links */
.woocommerce-pagination ul.page-numbers li {
    display: inline-block;
    padding: 0;
    margin: 0;
    /*background: var(--body-background,#ffffff);*/
    color: var(--primary-text-color,#212121);
    border-radius: 2px;
    font-size: 16px;
    text-decoration: none;
    transition: all 0.25s ease;
    
}

.woocommerce-pagination .page-numbers a{
	margin: 0;
	border: 1px solid var(--border-bottom-color,#efefef);
}
/* Current page styling */
.woocommerce-pagination ul.page-numbers li .page-numbers.current {
    background: var(--accent-color,#e35640);
    color: #fff;
    border-color: var(--accent-color,#e35640);
    cursor: default;
}

/* Hover effect */
.woocommerce-pagination ul.page-numbers li .page-numbers:not(.current):hover {
    background: var(--accent-color,#e35640);
    border-color: var(--accent-color,#e35640);
    color: #fff;
}

/* Next/Prev arrows */
.woocommerce-pagination ul.page-numbers li .next,
.woocommerce-pagination ul.page-numbers li .prev {
    font-weight: bold;
    font-size: 16px;
}

/* Optional: Make arrows round */
.woocommerce-pagination ul.page-numbers li .next,
.woocommerce-pagination ul.page-numbers li .prev {
    border-radius: 50%;
    width: 36px;
    height: 36px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.woocommerce .product a,
.woocommerce .product a:visited,
.woocommerce .woocommerce-breadcrumb a,
.woocommerce .woocommerce-breadcrumb a:visited {
	color: var(--primary-text-color,#212121);
	font-size: 13px;
	letter-spacing: 2px;
}
/* Hero Banner Section */
.saral-hero {
    padding-top: var(--hero-section-padding-top-mobile,30px);
    padding-bottom: var(--hero-section-padding-bottom-mobile,30px);
    margin-bottom: 2em;
}

.saral-hero .hero-content {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}

@media (min-width: 768px) {
	.saral-hero {
	    padding-top: var(--hero-section-padding-top-desktop,30px);
	    padding-bottom: var(--hero-section-padding-bottom-desktop,30px);
	    margin-bottom: 2em;
	}
}

.saral-hero .hero-subtitle {
    display: inline-block;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: capitalize;
    color: #6c757d;
    margin-bottom: 10px;
}

.saral-hero .hero-title {
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 15px;
}

.saral-hero .hero-description {
    font-size: 16px;
    color: #555;
    margin-bottom: 25px;
}

.saral-hero .hero-btn {
    border: 1px solid;
	border-color: var(--accent-color,#e35640);
	border-radius: 2px;
	background: var(--accent-color,#e35640);
	color: #ffffff;
	font-size: 12px;
	letter-spacing: 2px;
	line-height: 1;
	padding: 1em 1.2em;
	text-transform: uppercase;
	text-decoration: none;
}

.saral-hero .hero-image img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

.saral-hero--mask-none img { clip-path: none; }

.saral-hero--mask-circle img { clip-path: url(#saral-mask-circle); }
.saral-hero--mask-oval img { clip-path: url(#saral-mask-oval); }
.saral-hero--mask-rounded img { clip-path: url(#saral-mask-rounded); }

.saral-hero--mask-diagonal-left img { clip-path: url(#saral-mask-diagonal-left); }
.saral-hero--mask-diagonal-right img { clip-path: url(#saral-mask-diagonal-right); }
.saral-hero--mask-tilt img { clip-path: url(#saral-mask-tilt); }
.saral-hero--mask-slant img { clip-path: url(#saral-mask-slant); }

.saral-hero--mask-wave-1 img { clip-path: url(#saral-mask-wave-1); }
.saral-hero--mask-wave-2 img { clip-path: url(#saral-mask-wave-2); }

.saral-hero--mask-curve-up img { clip-path: url(#saral-mask-curve-up); }
.saral-hero--mask-curve-down img { clip-path: url(#saral-mask-curve-down); }
.saral-hero--mask-arch img { clip-path: url(#saral-mask-arch); }

.saral-hero--mask-blob-1 img { clip-path: url(#saral-mask-blob-1); }
.saral-hero--mask-blob-2 img { clip-path: url(#saral-mask-blob-2); }

.saral-hero--mask-zigzag img { clip-path: url(#saral-mask-zigzag); }
.saral-hero--mask-step img { clip-path: url(#saral-mask-step); }
.saral-hero--mask-notch img { clip-path: url(#saral-mask-notch); }

.saral-hero--mask-cut-corner img { clip-path: url(#saral-mask-cut-corner); }
.saral-hero--mask-frame img { clip-path: url(#saral-mask-frame); }
.saral-hero--mask-mountain img { clip-path: url(#saral-mask-mountain); }


.saral-hero .hero-image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}


.page .entry-header {
	padding: 0.5em 0;
	margin-bottom: 0em;
}