/*!
Theme Name: Begonia Weirdo
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
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: begonia-weirdo
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.

Begonia Weirdo 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/
*/

/*--------------------------------------------------------------
>>> BOTANICAL DESIGN SYSTEM & VARIABLES
--------------------------------------------------------------*/
:root {
	/* Palette */
	--bg-canvas: #fbfaf8;             /* Soft Warm Cream Linen */
	--bg-card: #ffffff;               /* Pure White for post cards */
	--bg-tint: #f6f4f0;               /* Slightly darker warm tone */
	
	--color-primary: #d45d79;         /* Velvet Begonia Pink */
	--color-primary-hover: #b9425d;
	--color-secondary: #31572c;       /* Organic Leaf Green */
	--color-secondary-hover: #1e391a;
	--color-accent: #90a98f;          /* Muted Sage Green */
	
	--color-text-main: #132219;       /* Deep Charcoal Leaf Shadow */
	--color-text-muted: #5a6d5f;      /* Soft Forest Grey for Meta */
	--color-border: #e8e5df;          /* Smooth warm linen borders */
	--color-border-hover: #d2cdc3;
	
	/* Typography */
	--font-headings: "Playfair Display", Georgia, serif;
	--font-body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	
	/* Shadows & Depth */
	--shadow-sm: 0 4px 12px rgba(19, 34, 25, 0.03);
	--shadow-md: 0 12px 30px rgba(19, 34, 25, 0.06);
	--shadow-lg: 0 24px 60px rgba(19, 34, 25, 0.1);
	
	/* Rounding */
	--radius-sm: 6px;
	--radius-md: 14px;
	--radius-lg: 32px;
	
	/* Animations */
	--transition-smooth: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/*--------------------------------------------------------------
# Reset & Base Rules
--------------------------------------------------------------*/
*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	background-color: var(--bg-canvas);
	color: var(--color-text-main);
	font-family: var(--font-body);
	font-size: 1rem;
	line-height: 1.7;
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

#page {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 2rem;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

/* Typography Hierarchy */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-headings);
	color: var(--color-text-main);
	font-weight: 700;
	line-height: 1.25;
	margin-top: 0;
	margin-bottom: 1.25rem;
	clear: both;
}

h1 { font-size: 2.5rem; letter-spacing: -0.5px; }
h2 { font-size: 2rem; letter-spacing: -0.3px; }
h3 { font-size: 1.6rem; }
h4 { font-size: 1.3rem; }

p {
	margin-top: 0;
	margin-bottom: 1.5rem;
}

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: var(--transition-smooth);
}

a:hover, a:focus {
	color: var(--color-primary-hover);
}

a:focus {
	outline: 2px dashed var(--color-primary);
	outline-offset: 4px;
}

/*--------------------------------------------------------------
# Layout Grid (Primary Content & Sidebar)
--------------------------------------------------------------*/
.site-content {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3.5rem;
	padding: 2rem 0 5rem;
	flex-grow: 1;
}

@media screen and (min-width: 992px) {
	.site-content {
		grid-template-columns: minmax(0, 1fr) 320px;
	}
}

/*--------------------------------------------------------------
# Header & Navigation
--------------------------------------------------------------*/
.site-header {
	padding: 3rem 0 2rem;
	border-bottom: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.site-branding {
	margin-bottom: 2rem;
}

.site-title {
	font-size: 2.8rem;
	font-weight: 900;
	margin: 0;
	font-family: var(--font-headings);
}

.site-title a {
	color: var(--color-text-main);
	background: linear-gradient(135deg, var(--color-secondary) 30%, var(--color-primary) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: var(--transition-smooth);
}

.site-title a:hover {
	opacity: 0.85;
}

.site-description {
	font-family: var(--font-body);
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 3px;
	color: var(--color-text-muted);
	margin-top: 0.75rem;
}

/* Custom Logo */
.custom-logo-link {
	display: inline-block;
	margin-bottom: 1rem;
	transition: var(--transition-smooth);
}

.custom-logo-link:hover {
	transform: scale(1.05);
}

.custom-logo-link img {
	max-height: 120px;
	width: auto;
}

/* Modern Navigation */
.main-navigation {
	background: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(12px);
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--radius-lg);
	padding: 0.4rem 2rem;
	box-shadow: var(--shadow-sm);
	z-index: 100;
	transition: var(--transition-smooth);
}

.main-navigation:hover {
	box-shadow: var(--shadow-md);
	background: rgba(255, 255, 255, 0.9);
}

.main-navigation ul {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 2rem;
	align-items: center;
}

.main-navigation li {
	position: relative;
	margin: 0;
}

.main-navigation a {
	display: block;
	padding: 0.6rem 0;
	color: var(--color-text-main);
	font-weight: 600;
	font-size: 0.95rem;
	position: relative;
}

.main-navigation a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background: var(--color-primary);
	transition: var(--transition-smooth);
	transform: translateX(-50%);
}

.main-navigation a:hover {
	color: var(--color-primary);
}

.main-navigation a:hover::after {
	width: 100%;
}

/* Active Menu Item */
.main-navigation .current-menu-item > a {
	color: var(--color-primary);
}

.main-navigation .current-menu-item > a::after {
	width: 100%;
	background: var(--color-secondary);
}

/* Dropdown Sub-menus */
.main-navigation ul ul {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(15px);
	background: #ffffff;
	border: 1px solid var(--color-border);
	box-shadow: var(--shadow-md);
	border-radius: var(--radius-md);
	padding: 0.75rem 0;
	min-width: 200px;
	display: flex;
	flex-direction: column;
	gap: 0;
	opacity: 0;
	visibility: hidden;
	transition: var(--transition-smooth);
}

.main-navigation ul ul a {
	padding: 0.5rem 1.5rem;
	font-size: 0.88rem;
}

.main-navigation ul ul a::after {
	display: none;
}

.main-navigation ul ul a:hover {
	background: var(--bg-tint);
	color: var(--color-secondary);
	padding-left: 1.8rem;
}

.main-navigation ul li:hover > ul {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

/* Mobile Toggle */
.menu-toggle {
	display: none;
}

@media screen and (max-width: 768px) {
	.menu-toggle {
		display: block;
		background: var(--color-secondary);
		color: #ffffff;
		border: none;
		border-radius: var(--radius-sm);
		padding: 0.5rem 1.5rem;
		font-weight: 700;
		font-family: var(--font-body);
		cursor: pointer;
		font-size: 0.9rem;
		transition: var(--transition-smooth);
	}
	
	.menu-toggle:hover {
		background: var(--color-secondary-hover);
	}
	
	.main-navigation ul {
		display: none;
		flex-direction: column;
		width: 100%;
		gap: 0.5rem;
		padding-top: 1rem;
		padding-bottom: 1rem;
		text-align: left;
	}
	
	.main-navigation.toggled ul {
		display: flex;
	}
	
	.main-navigation ul ul {
		position: static;
		transform: none;
		opacity: 1;
		visibility: visible;
		box-shadow: none;
		border: none;
		padding-left: 1rem;
		background: transparent;
	}
}

/*--------------------------------------------------------------
# Post Cards Grid (Home / Archives)
--------------------------------------------------------------*/
body:not(.single):not(.page) .site-main {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
}

@media screen and (min-width: 680px) {
	body:not(.single):not(.page) .site-main {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Modern Card Element */
body:not(.single):not(.page) article.post {
	background-color: var(--bg-card);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: var(--shadow-sm);
	transition: var(--transition-smooth);
	height: 100%;
}

body:not(.single):not(.page) article.post:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-md);
	border-color: var(--color-border-hover);
}

/* Post Thumbnails */
.post-thumbnail {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	position: relative;
	background: var(--bg-tint);
}

.post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

body:not(.single):not(.page) article.post:hover .post-thumbnail img {
	transform: scale(1.05);
}

/* Card Branding / Meta Header */
body:not(.single):not(.page) .entry-header {
	padding: 1.5rem 1.5rem 0.5rem;
}

/* Categories Badging */
.post-categories {
	margin-bottom: 0.75rem;
}

.post-categories a {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	color: var(--color-primary);
	background: rgba(212, 93, 121, 0.08);
	padding: 0.25rem 0.75rem;
	border-radius: var(--radius-lg);
	text-decoration: none;
	margin-right: 0.4rem;
	margin-bottom: 0.4rem;
	transition: var(--transition-smooth);
}

.post-categories a:hover {
	background: var(--color-primary);
	color: #ffffff;
}

body:not(.single):not(.page) .entry-title {
	font-size: 1.35rem;
	font-weight: 700;
	line-height: 1.35;
	margin: 0 0 0.8rem 0;
	font-family: var(--font-headings);
}

body:not(.single):not(.page) .entry-title a {
	color: var(--color-text-main);
}

body:not(.single):not(.page) .entry-title a:hover {
	color: var(--color-primary);
}

/* Entry Meta */
.entry-meta {
	font-size: 0.78rem;
	color: var(--color-text-muted);
	font-weight: 600;
	letter-spacing: 0.5px;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
}

.entry-meta a {
	color: var(--color-text-muted);
}

.entry-meta a:hover {
	color: var(--color-secondary);
}

/* Card Content / Excerpt */
body:not(.single):not(.page) .entry-content {
	padding: 0 1.5rem 1rem;
	font-size: 0.92rem;
	color: var(--color-text-muted);
	flex-grow: 1;
}

body:not(.single):not(.page) .entry-content p {
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Card Footer */
body:not(.single):not(.page) .entry-footer {
	padding: 1rem 1.5rem 1.5rem;
	border-top: 1px solid var(--color-border);
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.82rem;
	color: var(--color-text-muted);
	background-color: var(--bg-tint);
}

body:not(.single):not(.page) .entry-footer span {
	display: inline-flex;
	align-items: center;
}

body:not(.single):not(.page) .entry-footer a {
	color: var(--color-text-muted);
}

body:not(.single):not(.page) .entry-footer a:hover {
	color: var(--color-primary);
}

.edit-link {
	margin-left: auto;
}

/* Hide tags and category links on card footer to avoid cluttering and alignment issues */
body:not(.single):not(.page) .entry-footer .tags-links,
body:not(.single):not(.page) .entry-footer .cat-links {
	display: none;
}

/*--------------------------------------------------------------
# Single Article Details
--------------------------------------------------------------*/
body.single .site-main,
body.page .site-main {
	background: var(--bg-card);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 3rem;
	box-shadow: var(--shadow-sm);
}

@media screen and (max-width: 768px) {
	body.single .site-main,
	body.page .site-main {
		padding: 1.75rem;
	}
}

body.single .entry-header,
body.page .entry-header {
	margin-bottom: 2.5rem;
	padding-bottom: 2rem;
	border-bottom: 1px dashed var(--color-border);
}

body.single .post-categories {
	margin-bottom: 1rem;
}

body.single .entry-title,
body.page .entry-title {
	font-size: 2.4rem;
	font-weight: 800;
	color: var(--color-text-main);
	line-height: 1.2;
	margin-top: 0;
	margin-bottom: 1.25rem;
}

body.single .entry-meta {
	font-size: 0.85rem;
	gap: 1.5rem;
}

/* Featured image on single */
body.single .post-thumbnail,
body.page .post-thumbnail {
	border-radius: var(--radius-md);
	margin-bottom: 2.5rem;
	aspect-ratio: auto;
	box-shadow: var(--shadow-md);
}

body.single .post-thumbnail img,
body.page .post-thumbnail img {
	border-radius: var(--radius-md);
	display: block;
	width: 100%;
}

/* Article Body Typography */
.entry-content {
	font-size: 1.05rem;
	line-height: 1.8;
	color: #243027; /* Slightly darker body color for singular */
}

.entry-content p {
	margin-bottom: 1.75rem;
}

/* Headings inside content */
.entry-content h2,
.entry-content h3,
.entry-content h4 {
	font-family: var(--font-headings);
	color: var(--color-text-main);
	margin-top: 2.8rem;
	margin-bottom: 1.25rem;
	font-weight: 700;
}

.entry-content h2 {
	font-size: 1.8rem;
	border-left: 3px solid var(--color-secondary);
	padding-left: 1rem;
	margin-left: -1rem;
}

.entry-content h3 {
	font-size: 1.45rem;
}

/* Premium Blockquote */
blockquote {
	background-color: var(--bg-tint);
	border-left: 4px solid var(--color-secondary);
	padding: 2rem 2.5rem;
	margin: 2.5rem 0;
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
	box-shadow: inset 2px 2px 8px rgba(0,0,0,0.01);
}

blockquote p {
	font-family: var(--font-headings);
	font-size: 1.35rem;
	font-style: italic;
	color: var(--color-text-main);
	line-height: 1.5;
	margin-bottom: 0;
}

blockquote cite {
	display: block;
	margin-top: 1rem;
	font-family: var(--font-body);
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: var(--color-text-muted);
	font-style: normal;
	font-weight: 700;
}

/* Single Tags Badges */
body.single .entry-footer {
	margin-top: 3.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--color-border);
	font-size: 0.85rem;
}

.tags-links {
	display: block;
	margin-top: 1rem;
}

.tags-links a {
	display: inline-block;
	color: var(--color-text-muted);
	background: #ffffff;
	border: 1px solid var(--color-border);
	padding: 0.2rem 0.6rem;
	border-radius: var(--radius-sm);
	font-size: 0.8rem;
	margin-right: 0.4rem;
	margin-bottom: 0.4rem;
}

.tags-links a:hover {
	border-color: var(--color-secondary);
	color: var(--color-secondary);
	background: rgba(49, 87, 44, 0.03);
}

/* Post Navigation (Next / Prev) */
.post-navigation {
	margin: 3.5rem 0 2rem;
}

.post-navigation .nav-links {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	border-top: 1px dashed var(--color-border);
	border-bottom: 1px dashed var(--color-border);
	padding: 1.5rem 0;
}

@media screen and (min-width: 600px) {
	.post-navigation .nav-links {
		grid-template-columns: 1fr 1fr;
	}
}

.post-navigation .nav-previous,
.post-navigation .nav-next {
	display: flex;
	flex-direction: column;
}

.post-navigation .nav-next {
	text-align: right;
}

.post-navigation .nav-subtitle {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--color-text-muted);
	margin-bottom: 0.25rem;
	font-weight: 700;
}

.post-navigation .nav-title {
	font-family: var(--font-headings);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-text-main);
	line-height: 1.3;
	transition: var(--transition-smooth);
}

.post-navigation a {
	display: block;
	text-decoration: none;
}

.post-navigation a:hover .nav-title {
	color: var(--color-primary);
}

/*--------------------------------------------------------------
# Sidebar & Widgets
--------------------------------------------------------------*/
.widget-area {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.widget {
	background: var(--bg-card);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 2rem;
	box-shadow: var(--shadow-sm);
	transition: var(--transition-smooth);
}

.widget:hover {
	box-shadow: var(--shadow-md);
}

.widget-title {
	font-family: var(--font-headings);
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--color-text-main);
	margin-top: 0;
	margin-bottom: 1.5rem;
	padding-bottom: 0.5rem;
	position: relative;
	display: inline-block;
}

.widget-title::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 40px;
	height: 3px;
	background: var(--color-secondary);
	border-radius: 2px;
}

.widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.widget li {
	font-size: 0.92rem;
	border-bottom: 1px solid #f6f4f0;
	padding-bottom: 0.6rem;
	color: var(--color-text-muted);
}

.widget li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.widget a {
	color: var(--color-text-main);
	font-weight: 600;
}

.widget a:hover {
	color: var(--color-primary);
	padding-left: 4px;
}

/* Search Widget styling */
.search-form {
	display: flex;
	width: 100%;
	position: relative;
}

.search-form label {
	flex-grow: 1;
	margin-right: 0.5rem;
}

.search-form input[type="search"] {
	width: 100%;
	border-radius: var(--radius-sm);
	padding: 0.6rem 1rem;
	font-size: 0.9rem;
	background: var(--bg-tint);
	border: 1px solid var(--color-border);
}

.search-form input[type="search"]:focus {
	background: #ffffff;
}

.search-form input[type="submit"] {
	background: var(--color-secondary);
	border: none;
	color: #ffffff;
	padding: 0.6rem 1.2rem;
	border-radius: var(--radius-sm);
	font-size: 0.85rem;
	font-weight: 700;
	cursor: pointer;
	transition: var(--transition-smooth);
}

.search-form input[type="submit"]:hover {
	background: var(--color-secondary-hover);
}

/* Calendar Widget */
#wp-calendar {
	width: 100%;
	border-collapse: collapse;
}

#wp-calendar th, #wp-calendar td {
	text-align: center;
	padding: 0.4rem;
	font-size: 0.85rem;
}

#wp-calendar caption {
	font-family: var(--font-headings);
	font-weight: 700;
	margin-bottom: 0.5rem;
}

/*--------------------------------------------------------------
# Comments Section
--------------------------------------------------------------*/
.comments-area {
	margin-top: 4.5rem;
	padding-top: 3rem;
	border-top: 1px dashed var(--color-border);
}

.comments-title {
	font-family: var(--font-headings);
	font-size: 1.6rem;
	font-weight: 800;
	margin-bottom: 2rem;
	color: var(--color-text-main);
}

.comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
}

.comment-list .children {
	list-style: none;
	margin-left: 2rem;
	margin-top: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	border-left: 2px solid var(--color-border);
	padding-left: 1.5rem;
}

@media screen and (max-width: 600px) {
	.comment-list .children {
		margin-left: 1rem;
		padding-left: 0.75rem;
	}
}

.comment-body {
	background: #ffffff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 1.75rem;
	box-shadow: var(--shadow-sm);
	transition: var(--transition-smooth);
}

.comment-body:hover {
	border-color: var(--color-border-hover);
	box-shadow: var(--shadow-md);
}

.comment-meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.25rem;
	font-size: 0.82rem;
	color: var(--color-text-muted);
}

.comment-author {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.comment-author img.avatar {
	border-radius: 50%;
	border: 2px solid var(--color-border);
	display: block;
}

.comment-author .fn {
	font-family: var(--font-headings);
	font-weight: 700;
	font-size: 0.95rem;
	color: var(--color-text-main);
	font-style: normal;
}

.comment-metadata a {
	color: var(--color-text-muted);
}

.comment-metadata a:hover {
	color: var(--color-primary);
}

.comment-content {
	font-size: 0.95rem;
	line-height: 1.65;
	color: #2b3b2f;
}

.comment-reply {
	margin-top: 1.25rem;
	text-align: right;
}

.comment-reply-link {
	display: inline-block;
	background: rgba(49, 87, 44, 0.06);
	color: var(--color-secondary);
	padding: 0.4rem 1.2rem;
	border-radius: var(--radius-sm);
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	transition: var(--transition-smooth);
}

.comment-reply-link:hover {
	background: var(--color-secondary);
	color: #ffffff;
}

/* Respond & Form fields */
.comment-respond {
	margin-top: 4.5rem;
	background: var(--bg-card);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: 2.5rem;
	box-shadow: var(--shadow-sm);
}

.comment-reply-title {
	font-family: var(--font-headings);
	font-size: 1.5rem;
	font-weight: 800;
	margin-top: 0;
	margin-bottom: 1.5rem;
}

.comment-form {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.comment-form-comment label,
.comment-form-author label,
.comment-form-email label,
.comment-form-url label {
	display: block;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--color-text-main);
	margin-bottom: 0.4rem;
}

.comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: var(--color-text-muted);
}

.comment-form-cookies-consent input[type="checkbox"] {
	margin-top: 0.25rem;
}

.form-submit {
	margin-bottom: 0;
	margin-top: 0.5rem;
}

/*--------------------------------------------------------------
# Forms Elements & Buttons
--------------------------------------------------------------*/
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea,
select {
	width: 100%;
	padding: 0.75rem 1.2rem;
	background-color: var(--bg-tint);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	color: var(--color-text-main);
	font-family: var(--font-body);
	font-size: 0.95rem;
	outline: none;
	transition: var(--transition-smooth);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
	background-color: #ffffff;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(212, 93, 121, 0.15);
}

textarea {
	height: 140px;
	resize: vertical;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	background-color: var(--color-secondary);
	color: #ffffff;
	border: none;
	border-radius: var(--radius-sm);
	padding: 0.75rem 1.75rem;
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 0.92rem;
	cursor: pointer;
	transition: var(--transition-smooth);
	box-shadow: var(--shadow-sm);
	display: inline-block;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	background-color: var(--color-secondary-hover);
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

button:active,
input[type="button"]:active,
input[type="submit"]:active {
	transform: translateY(0);
}

/*--------------------------------------------------------------
# Footer Layout
--------------------------------------------------------------*/
.site-footer {
	background-color: var(--color-text-main);
	color: #cbd5e1;
	padding: 4.5rem 0 3.5rem;
	margin-top: 5rem;
	text-align: center;
	border-top: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: var(--radius-md) var(--radius-md) 0 0;
	font-family: var(--font-body);
}

.site-footer a {
	color: var(--color-primary);
	font-weight: 600;
}

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

.site-info {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	align-items: center;
	font-size: 0.88rem;
}

.site-info span.sep {
	display: none;
}

@media screen and (min-width: 600px) {
	.site-info {
		flex-direction: row;
		justify-content: center;
		gap: 1.5rem;
	}
	
	.site-info span.sep {
		display: inline;
		color: rgba(255, 255, 255, 0.15);
	}
}

/*--------------------------------------------------------------
# WordPress Core Alignments & Captions
--------------------------------------------------------------*/
.alignleft {
	float: left;
	margin-right: 1.75em;
	margin-bottom: 1.5em;
}

.alignright {
	float: right;
	margin-left: 1.75em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.75em;
}

.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
	background: var(--bg-tint);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	padding: 6px;
}

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

.wp-caption-text {
	text-align: center;
	font-size: 0.8rem;
	color: var(--color-text-muted);
	padding: 6px 0 2px;
	margin: 0;
	font-style: italic;
}

.gallery {
	display: grid;
	grid-gap: 1.5em;
	margin-bottom: 2rem;
}

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

.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 img {
	border-radius: var(--radius-sm);
	box-shadow: var(--shadow-sm);
	transition: var(--transition-smooth);
}

.gallery img:hover {
	box-shadow: var(--shadow-md);
}

/*--------------------------------------------------------------
# Utilities & Accessibility
--------------------------------------------------------------*/
.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;
}

.skip-link {
	position: absolute;
	top: -9999px;
}

#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Custom Fallback SVG Plant Preview */
.fallback-plant-svg {
	display: block;
	width: 100%;
	height: 100%;
}

.fallback-plant-svg svg {
	width: 100%;
	height: 100%;
	display: block;
}