h3 {
	line-height: 1.1em;
}

/* Review link buttons — Google & Yelp
   Outline style matching the Dara theme's accent color (#15b6b8),
   Source Sans Pro type, and the site's existing uppercase/letter-spaced
   label convention (see button, .cat-links in dara/style.css).

   Selectors are scoped as ".entry-content a.review-link" (not just
   ".review-link") because dara/style.css has ".entry-content a
   { text-decoration: underline }" — a class+tag selector that beats a
   plain class selector on specificity regardless of load order, so a
   plain ".review-link { text-decoration: none }" gets silently
   overridden by the theme's own underline.

   Paste into Appearance > Customize > Additional CSS. */

.review-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1em;
	margin: 1.8em 0;
}

.entry-content a.review-link {
	display: inline-flex;
	align-items: center;
	gap: .65em;
	padding: .75em 1.5em .65em;
	border: 1.5px solid #15b6b8;
	border-radius: 3px;
	background: transparent;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #15b6b8;
	text-decoration: none;
	transition: background-color .2s, color .2s;
}

.entry-content a.review-link:hover,
.entry-content a.review-link:focus {
	background-color: #15b6b8;
	color: #fff;
	text-decoration: none;
}

.review-link__icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

/* Star rating above each testimonial. The original text pasted into
   these paragraphs was five star-emoji characters, mangled into
   mojibake ("â­â­â­â­â­") at some point before this repo existed —
   likely a copy/paste through something that mis-handled the
   encoding. Replaced with plain ★ (U+2605), a 3-byte character that
   stores fine on this site's non-utf8mb4 database — confirmed after
   saving, no "?" corruption like the 4-byte emoji hit in
   docs/home-page.md. Wrapped in this class for consistent color/size
   instead of relying on whatever emoji font each visitor has. */
.review-stars {
	display: inline-block;
	margin-bottom: .3em;
	font-size: 20px;
	letter-spacing: .15em;
	color: #f5a623;
}

/* Forms & Documents page: equal-height cards with the "Open PDF" button
 *    anchored to the bottom of each card, regardless of how much heading/body
 *    text wraps. Scoped to the bordered card group used on that page.
 * 
 *    Note: the Group block wraps its content in a
 *    .wp-block-group__inner-container div, so the flex column + margin-top:auto
 *    trick has to be applied one level down from the bordered group itself --
 *    putting it directly on .wp-block-group has no effect on the buttons,
 *    since they aren't a direct flex child of it. */
.wp-block-group.has-border-color.has-background {
	display: flex;
	flex-direction: column;
	min-height: 230px;
}
.wp-block-group.has-border-color.has-background > .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	flex: 1;
}
.wp-block-group.has-border-color.has-background .wp-block-buttons {
	margin-top: auto;
	padding-top: 12px;
}

/* Footer — brand social icon + copyright, replacing the default
   "Proudly powered by WordPress" credit bar. Matches the Dara theme's
   teal accent (#15b6b8) and Source Sans Pro convention used in
   review-buttons.css. Paste into Appearance > Customize > Additional CSS. */

#tertiary.footer-widget-area {
	background: #ffffff;
	border-top: 4px solid #15b6b8;
	padding: 3em 1.5em 2.5em;
}

#tertiary .widget-area {
	max-width: 880px;
	margin: 0 auto;
}

.site-footer-brand {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .6em;
	text-align: center;
}

.site-footer-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #15b6b8;
	transition: background-color .2s, transform .2s;
}

.site-footer-social__link:hover,
.site-footer-social__link:focus {
	background-color: #0e8f91;
	transform: translateY(-2px);
}

.site-footer-social__icon {
	width: 26px;
	height: 26px;
	fill: #ffffff;
}

.site-footer-tagline {
	margin: .4em 0 0;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: uppercase;
	color: #443f40;
}

.site-footer-copyright {
	margin: 0;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 12px;
	color: #a8a6a1;
}

/* Hide the default "Proudly powered by WordPress / Theme: Dara by
   Automattic" credit bar. */
#colophon {
	display: none;
}


/* About Me photo — owner + child portrait beside the About Me bio
   text, in a two-column layout (the "about-me-columns" Columns block
   on the About Us page). Rounded corners, soft shadow, and a small
   teal caption line matching the site's Source Sans Pro / #15b6b8
   accent convention. Paste into Appearance > Customize > Additional
   CSS. */

.about-me-columns {
	align-items: flex-start;
	gap: 2em;
}

.about-me-photo img {
	display: block;
	width: 100%;
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.about-me-photo figcaption {
	margin-top: .6em;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 13px;
	font-style: normal;
	font-weight: 600;
	letter-spacing: .3px;
	text-align: center;
	color: #15b6b8;
}

@media (max-width: 600px) {
	.about-me-columns {
		flex-wrap: wrap;
	}
	.about-me-columns > .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* Home page ("Welcome!" post) redesign — hero photo, lead tagline,
   program highlights row, garden photo, and a closing call-to-action
   band. Matches the site's teal (#15b6b8) accent, Source Sans Pro
   convention, and the rounded-corner/soft-shadow photo treatment from
   about-me-photo.css. Paste into Appearance > Customize > Additional
   CSS. */

/* The Dara theme reserves 150-211px of left padding on .entry-body
   at >=1000px viewports to make room for a left-floated featured
   thumbnail (dara/style.css ~line 2521). The "Welcome!" post has no
   featured image, so that padding just leaves a big empty gap to the
   left of the content on wide screens. Zero it out — same selector
   the theme uses, so this overrides it via normal cascade order. */
.no-sidebar .entry-body {
	padding-left: 0;
}

/* Same theme quirk, same fix, for the "Welcome!" title itself
   (dara/style.css ~line 2554) — it reserves the same left margin on
   .entry-header for the missing featured thumbnail. */
.no-sidebar.blog .without-featured-image > .entry-header,
.no-sidebar.single .without-featured-image > .entry-header,
.no-sidebar.archive .without-featured-image > .entry-header,
.no-sidebar.search .without-featured-image > .entry-header {
	margin-left: 0;
}

.home-hero-photo img,
.home-garden-photo img {
	display: block;
	width: 100%;
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.home-hero-photo figcaption,
.home-garden-photo figcaption {
	margin-top: .6em;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 13px;
	font-style: normal;
	font-weight: 600;
	letter-spacing: .3px;
	text-align: center;
	color: #15b6b8;
}

.home-lead {
	margin-top: 1.2em;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.5;
	color: #443f40;
}

.home-highlights {
	margin: 2em 0;
	gap: 1em;
}

.home-highlight {
	padding: 1.1em .8em;
	background: #f4fbfb;
	border: 1px solid #d6eeee;
	border-top: 3px solid #15b6b8;
	border-radius: 10px;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	line-height: 1.45;
}

.home-highlight strong {
	display: block;
	margin-top: .3em;
	font-size: 13px;
	letter-spacing: .3px;
	text-transform: uppercase;
	color: #15b6b8;
}

.home-cta {
	margin: 2.4em 0 1em;
	padding: 2em 1.5em;
	background: #15b6b8;
	border-radius: 12px;
	color: #ffffff;
}

.home-cta h3 {
	margin-top: 0;
	color: #ffffff;
}

.home-cta p {
	color: #ffffff;
}

.home-cta__button .wp-block-button__link {
	background-color: #ffffff;
	color: #15b6b8;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: uppercase;
	border-radius: 3px;
}

.home-cta__button .wp-block-button__link:hover,
.home-cta__button .wp-block-button__link:focus {
	background-color: #f0f0f0;
}

@media (max-width: 600px) {
	.home-highlights {
		flex-wrap: wrap;
	}
	.home-highlights > .wp-block-column {
		flex-basis: 100% !important;
	}
}
/* Contact page — a plain (no colored box) Hours/Email/Phone info
   section, plus a full-width photo at the bottom of the page (same
   rounded-corner/shadow/teal-caption treatment as the home page
   photos in home-page.css, since the photo isn't confined to a
   narrow side column here). Paste into Appearance > Customize >
   Additional CSS. */

.contact-photo img {
	display: block;
	width: 100%;
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.contact-photo figcaption {
	margin-top: .6em;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 13px;
	font-style: normal;
	font-weight: 600;
	letter-spacing: .3px;
	text-align: center;
	color: #15b6b8;
}

.contact-info-box {
	margin: 1em 0;
	padding-top: .8em;
	border-top: 1px solid #e5e5e5;
}

.contact-info-box p {
	margin: 0 0 .5em;
}

.contact-info-box p:last-child {
	margin-bottom: 0;
}

.contact-info-name {
	font-weight: 700;
}

.contact-info-license {
	font-size: 13px;
	color: #a8a6a1;
}

.contact-info-row strong {
	color: #443f40;
}

.contact-info-row a {
	word-break: break-word;
}


/* Tighten the oversized gap between the CTA band and the footer.
   The Dara blog loop reserves this space (an empty .entry-footer,
   article margin-bottom, #content padding-bottom) as a separator
   between consecutive posts — normally invisible because the next
   post follows. The front page shows only this one "Welcome!" post,
   so with nothing after it that separator space just stacks up as
   dead space before the footer. */
.home.blog .entry-footer:empty {
	display: none;
}

.home.blog article.hentry {
	margin-bottom: 0;
}

.home.blog #content {
	padding-bottom: 1.5em;
}
