/*
Theme Name: Lakeside Dog Suites
Theme URI: https://lakesidedogsuites.com/
Description: Replica of the site's Divi design as a block theme. Poppins, navy and orange, cream hero panels, arch cards. No page builder.
Author: Lakeside Dog Suites
Version: 1.5.0
Template: twentytwentyfive
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: lakeside
*/

:root {
	--ld-navy: var(--wp--preset--color--navy);
	--ld-orange: var(--wp--preset--color--orange);
	--ld-blue: var(--wp--preset--color--blue);
	--ld-cream: var(--wp--preset--color--cream);
	--ld-body: var(--wp--preset--color--body);
	--ld-ui: var(--wp--preset--font-family--open-sans);
}

/* -------------------------------------------------------------- header */

.ld-header {
	background: #fff;
	box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
	position: relative;
	z-index: 20;
}
.ld-header-row { min-height: 94px; }
.ld-logo img { height: 66px; width: auto; display: block; }

.ld-header .wp-block-navigation { font-weight: 600; font-size: 1rem; gap: 1.4rem; }
.ld-header .wp-block-navigation a { color: var(--ld-orange); text-decoration: none; }
.ld-header .wp-block-navigation a:hover,
.ld-header .wp-block-navigation .current-menu-item > a,
.ld-header .wp-block-navigation .current-menu-ancestor > a { color: var(--ld-blue); }
.ld-header .wp-block-navigation .wp-block-navigation__submenu-icon { color: var(--ld-orange); }
.ld-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: #fff;
	border-top: 3px solid var(--ld-orange);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	padding: 1rem 0;
	min-width: 240px;
}
.ld-header .wp-block-navigation .wp-block-navigation__submenu-container a {
	color: var(--ld-orange);
	font-weight: 500;
	font-size: 0.9rem;
	padding: 0.35rem 1.25rem;
}
.ld-header .wp-block-navigation .wp-block-navigation__submenu-container a:hover { color: var(--ld-blue); background: #f7f7f7; }
.ld-header .wp-block-navigation__responsive-container.is-menu-open { background: #fff; }
.ld-header .wp-block-navigation__responsive-container-open,
.ld-header .wp-block-navigation__responsive-container-close { color: var(--ld-orange); }

/* --------------------------------------------------------------- footer */

.ld-footer { background: var(--ld-navy); color: #fff; padding-top: 4.5rem; padding-bottom: 3rem; }
/* Static blocks only get inline padding if it is written into the saved markup; the parts carry the
   intent in JSON but the box is set here so it cannot drift. */
.ld-footer h3 { color: #fff; font-weight: 600; font-size: 1.375rem; margin: 0 0 1rem; }
.ld-footer p, .ld-footer li { color: #fff; }
.ld-footer a { color: #fff; text-decoration: none; }
.ld-footer a:hover { color: var(--ld-orange); }
.ld-footer ul { list-style: none; padding: 0; margin: 0; }
.ld-footer-links li { margin: 0 0 0.35rem; }
.ld-footer-cats li { margin: 0 0 1.1rem; }
.ld-footer-logo img { width: 300px; max-width: 100%; height: auto; }
.ld-social { display: flex; gap: 1rem; margin-top: 1.5rem; }
.ld-social a {
	width: 52px; height: 52px; border-radius: 50%;
	background: var(--ld-orange);
	display: inline-flex; align-items: center; justify-content: center;
}
.ld-social a:hover { background: #e5541f; }
.ld-social svg { width: 18px; height: 18px; fill: #fff; }
.ld-copy { padding-top: 1.5rem; padding-bottom: 1.5rem; background: var(--ld-orange); color: #fff; font-family: var(--ld-ui); font-weight: 600; font-size: 0.875rem; }
.ld-copy p { margin: 0; color: #fff; }
.ld-copy a { color: #fff; }

/* ---------------------------------------------------------------- shared */

.ld-eyebrow { text-transform: uppercase; }
.ld-white, .ld-white h1, .ld-white h2, .ld-white h3, .ld-white p { color: #fff; }
.ld-panel { background-size: cover; background-position: center; background-repeat: no-repeat; }

/* Buttons. Divi drew pills with a 2px border; the outline style is the hollow one on the homepage. */
.wp-block-button__link { line-height: 1.7; }
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background: transparent; color: var(--ld-orange); border: 2px solid var(--ld-orange);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--ld-orange); color: #fff; }
.ld-on-orange .wp-block-button__link { border-color: #fff; }
.ld-on-orange .wp-block-button__link:hover { background: #fff; color: var(--ld-orange); border-color: #fff; }

/* Arch cards — the three outlined service cards on the homepage. */
.ld-arch {
	border: 2px solid var(--ld-orange);
	border-radius: 200px 200px 0 0;
	padding: 0 0 2rem;
	overflow: hidden;
	height: 100%;
	box-sizing: border-box;
}
.ld-arch.is-pink { border-color: #e91e8c; }
.ld-arch.is-blue { border-color: var(--ld-blue); }
.ld-arch .wp-block-image { margin: 0; }
.ld-arch .wp-block-image img { border-radius: 200px 200px 0 0; width: 100%; aspect-ratio: 1 / 1.05; object-fit: cover; display: block; }
.ld-arch h3 { color: var(--ld-navy); font-weight: 600; font-size: 1.125rem; margin: 1.5rem 1.5rem 0.5rem; }
.ld-arch p { margin: 0 1.5rem; font-size: 0.9rem; line-height: 1.7; }

/* Round images and the two counters in the cream section. */
.ld-round img { border-radius: 50%; aspect-ratio: 1; object-fit: cover; width: 100%; }
.ld-counter { color: #fff; text-align: center; padding: 13% 20px; border-radius: 6px; }
.ld-counter .ld-number { font-size: clamp(2.5rem, 5vw, 3.75rem); font-weight: 600; line-height: 1; margin: 0; color: #fff; }
.ld-counter .ld-label { margin: 0.5rem 0 0; color: #fff; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.9rem; }
.ld-counter.is-orange { background: var(--ld-orange); }
.ld-counter.is-yellow { background: var(--wp--preset--color--yellow); }

/* Feature strip under the homepage hero: image | white text | image | white text */
.ld-strip { margin-top: -6rem; position: relative; z-index: 2; }
.ld-strip .ld-strip-img { min-height: 260px; background-size: cover; background-position: center; }
.ld-strip .ld-strip-text { background: #fff; padding: 30px 25px; }
.ld-strip h3 { color: var(--ld-navy); font-weight: 600; font-size: 1.05rem; margin: 0 0 0.6rem; }
.ld-strip p { font-size: 0.9rem; margin: 0; }

/* Icon square and white card overlapping the round image ("Ultimately" section) */
.ld-icon-sq { width: 80px; height: 80px; background: var(--ld-orange); display: flex; align-items: center; justify-content: center; }
.ld-icon-sq svg { width: 36px; height: 36px; fill: #fff; }
.ld-card-white { background: #fff; padding: 30px; box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08); }
.ld-card-white h3 { color: var(--ld-navy); font-weight: 600; font-size: 1.05rem; margin: 0; }

/* ------------------------------------------------------------ hero panels */

.ld-hero-title { color: var(--ld-navy); }
.ld-hero-img-arch img { border-radius: 300px 300px 0 0; }

/* ----------------------------------------------------------------- forms */

.ld-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ld-form input, .ld-form textarea {
	width: 100%; box-sizing: border-box;
	background: var(--wp--preset--color--field); border: 0; border-radius: 0;
	padding: 16px; font: inherit; font-size: 0.9rem; color: #999;
}
.ld-form input::placeholder, .ld-form textarea::placeholder { color: #999; }
.ld-form textarea, .ld-form .ld-span2, .ld-form-thanks { grid-column: 1 / -1; }
.ld-form textarea { min-height: 150px; resize: vertical; }
.ld-form .ld-submit { grid-column: 1 / -1; display: flex; justify-content: flex-end; }
.ld-form button {
	background: var(--ld-orange); color: #fff; border: 2px solid var(--ld-orange); border-radius: 100px;
	font: inherit; font-weight: 600; font-size: 1rem; padding: 0.9rem 2.6rem; cursor: pointer;
}
.ld-form button:hover { background: #e5541f; border-color: #e5541f; }
.ld-form-thanks { color: #fff; margin: 0; }
.ld-form.is-rounded input, .ld-form.is-rounded textarea { border-radius: 7px; }
.ld-form-card { border-radius: 17px; background: rgba(229, 206, 185, 0.6); padding: 45px 25px 35px; }
.ld-form-card h3 { color: #fff; text-transform: uppercase; font-weight: 700; font-size: 1.375rem; text-align: center; margin: 0 0 1.5rem; line-height: 1.3; }
.ld-form-navy { background: var(--ld-navy); padding: 80px 60px; }
@media (max-width: 781px) { .ld-form-navy { padding: 40px 24px; } }

/* Contact blurbs */
.ld-blurb { display: grid; grid-template-columns: 32px 1fr; gap: 1rem 1.25rem; align-items: start; margin-bottom: 1.75rem; }
.ld-blurb svg { width: 26px; height: 26px; fill: var(--ld-navy); margin-top: 4px; }
.ld-blurb h4 { color: var(--ld-navy); font-weight: 500; font-size: 1.25rem; margin: 0 0 0.25rem; }
.ld-blurb p { margin: 0; font-family: var(--ld-ui); font-size: 0.9rem; color: var(--wp--preset--color--muted); }

/* ------------------------------------------------------------ blog index */

.ld-featured { background: var(--wp--preset--color--slate); color: #fff; padding: 5.5rem 3rem 4rem; text-align: center; box-shadow: 0 30px 40px -20px rgba(0, 0, 0, 0.35); }
.ld-featured h2, .ld-featured h2 a { color: #fff; font-size: 1.875rem; font-weight: 600; line-height: 1.3; }
.ld-featured .ld-meta, .ld-featured .ld-meta * { color: #fff; font-size: 0.8125rem; font-weight: 700; }
.ld-featured p { color: #fff; }
.ld-featured .wp-block-post-excerpt__excerpt { max-width: 760px; margin: 0.5rem auto 1.5rem; }
.ld-featured .wp-block-post-excerpt__more-link { display: none; }

.ld-grid .wp-block-post-template { gap: 3rem 2.5rem; }
.ld-grid .wp-block-post-featured-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.ld-grid .wp-block-post-title { font-size: 1.25rem; font-weight: 600; line-height: 1.4; margin: 1rem 0 0.35rem; }
.ld-grid .wp-block-post-title a { color: var(--ld-navy); }
.ld-grid .wp-block-post-title a:hover { color: var(--ld-orange); text-decoration: none; }
.ld-meta { font-family: var(--ld-ui); font-size: 0.8125rem; font-weight: 700; color: var(--wp--preset--color--purple); gap: 0.4rem; margin-bottom: 0.5rem; }
.ld-meta .wp-block-post-date, .ld-meta .wp-block-post-terms, .ld-meta a { color: var(--wp--preset--color--purple); }
.ld-meta .wp-block-post-date::after { content: " |"; }
.ld-grid .wp-block-post-excerpt { font-family: var(--ld-ui); font-size: 0.875rem; color: var(--wp--preset--color--muted); line-height: 1.75; }
.ld-grid .wp-block-post-excerpt__more-link { display: none; }
.ld-grid .wp-block-query-pagination { margin-top: 3rem; font-weight: 600; }
.ld-grid .wp-block-query-pagination a { color: var(--ld-orange); }
.ld-grid .wp-block-query-pagination-numbers { display: none; }

/* --------------------------------------------------------------- single */

.ld-post-hero { background: #d2cbd3; }
.ld-post-hero .wp-block-cover { min-height: 380px; }
.ld-post-hero .wp-block-post-title { color: var(--ld-navy); font-size: clamp(2rem, 4vw, 3.25rem); font-weight: 600; line-height: 1.2; max-width: 820px; margin: 0 auto; text-align: center; text-shadow: 0 0 18px rgba(255, 255, 255, 0.85), 0 0 4px rgba(255, 255, 255, 0.9); }
.ld-post-meta { justify-content: center; gap: 0.4rem; margin-top: 1rem; font-weight: 600; font-size: 0.9375rem; color: var(--ld-navy); text-shadow: 0 0 10px rgba(255, 255, 255, 0.9); }
.ld-post-meta p, .ld-post-meta .wp-block-post-author-name, .ld-post-meta .wp-block-post-date { margin: 0; color: var(--ld-navy); }
.ld-post-hero .wp-block-cover__inner-container { width: 100%; }

.ld-article h2 { font-size: var(--wp--preset--font-size--x-large); line-height: 1.3; margin-top: 2rem; }
.ld-article h3 { font-size: 1.375rem; font-weight: 500; color: var(--wp--preset--color--contrast); margin-top: 1.5rem; }
.ld-article p, .ld-article li { line-height: 1.8; }
.ld-article ul, .ld-article ol { padding-left: 1.25rem; }

/* Long-form page body (city pages, FAQ) */
.ld-page-body h2 { font-size: 1.625rem; line-height: 1.3; margin-top: 2rem; }
.ld-page-body h2.has-text-align-center { font-size: clamp(1.75rem, 3vw, 2.375rem); margin-top: 0; }
.ld-page-body h3 { font-size: 1.125rem; font-weight: 600; color: var(--wp--preset--color--contrast); margin-top: 1.5rem; }
.ld-page-body h4 { font-weight: 600; color: var(--wp--preset--color--contrast); }
.ld-page-body p, .ld-page-body li { font-size: 0.9375rem; line-height: 1.8; }
.ld-page-body h2 + p, .ld-page-body h3 + p, .ld-page-body h4 + p { margin-top: 0.5rem; }

/* Category nav on the blog index and archives; category description under an archive title */
.ld-catnav { gap: 0.5rem 0.75rem; margin: 1.25rem auto 2rem; }
.ld-catnav p { margin: 0; }
.ld-catnav a { display: inline-block; padding: 0.45rem 1.1rem; border: 2px solid var(--ld-navy); border-radius: 100px; color: var(--ld-navy); font-weight: 600; font-size: 0.9rem; text-decoration: none; }
.ld-catnav a:hover { background: var(--ld-navy); color: #fff; }
.ld-catdesc { max-width: 640px; margin: 0.75rem auto 0; color: var(--ld-navy); font-size: 1.0625rem; }
.ld-catdesc p { margin: 0; }

/* Related guides box under every post — the posts' route into the core pages */
.ld-related { background: var(--ld-cream); padding: 2rem 2.25rem; border-left: 4px solid var(--ld-orange); }
.ld-related h2 { font-size: 1.25rem; margin: 0 0 0.5rem; }
.ld-related p { margin: 0 0 0.75rem; font-size: 0.9375rem; }
.ld-related ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.ld-related li { font-weight: 600; font-size: 0.9375rem; }
.ld-related a { color: var(--ld-orange); }
.ld-related a:hover { color: var(--ld-blue); text-decoration: none; }

/* ----------------------------------------------------------- responsive */

@media (max-width: 781px) {
	.ld-form { grid-template-columns: 1fr; }
	.ld-strip { margin-top: 0; }
	.ld-featured { padding: 3rem 1.5rem 2.5rem; }
	.ld-logo img { height: 54px; }
	.ld-header-row { min-height: 70px; }
}

/* FAQ sections on the city pages (scripts/faq_apply.php convention, parsed into FAQPage schema in functions.php). */
.tt-faq-heading { margin-top: 2.5rem; }
.tt-faq { border-top: 1px solid #e3e6ee; margin: 0 0 1rem; }
.tt-faq > * { max-width: none; }
.tt-faq h3 { font-size: 1.1rem; margin: 1.4rem 0 0.4rem; line-height: 1.35; }
.tt-faq p { margin: 0 0 0.6rem; color: #444a5c; }
.tt-faq p:last-child { padding-bottom: 1.5rem; }
.tt-faq-accordion { border-top: none; }
.tt-faq-item { border-top: 1px solid #e3e6ee; }
.tt-faq-item:last-child { border-bottom: 1px solid #e3e6ee; }
.tt-faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; list-style: none; padding: 1rem 0; }
.tt-faq-item summary::-webkit-details-marker { display: none; }
.tt-faq-item summary h3 { margin: 0; font-size: 1.1rem; line-height: 1.35; }
.tt-faq-toggle { flex: 0 0 1.6rem; width: 1.6rem; height: 1.6rem; position: relative; border: 1px solid #e3e6ee; border-radius: 50%; }
.tt-faq-toggle::before, .tt-faq-toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: 0.7rem; height: 2px; background: #ff6734; transform: translate(-50%, -50%); }
.tt-faq-toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.tt-faq-item[open] .tt-faq-toggle::after { transform: translate(-50%, -50%) rotate(0deg); }
.tt-faq-answer { padding: 0 2.6rem 1.2rem 0; }
.tt-faq-answer p { color: #444a5c; margin: 0 0 0.6rem; }
.tt-faq-answer p:last-child { margin-bottom: 0; padding-bottom: 0; }