/*
 * Blue Sky Sitters - site styles.
 * Only covers what Blocksy Free / Elementor Free cannot set from their UIs:
 * sticky header, header/footer typography details, mobile dropdown menu,
 * WPForms look, image mask, mobile re-ordering helpers and the scroll reveal.
 */

:root {
	--bss-dark: #31424A;
	--bss-sky: #E7F5FF;
	--bss-green: #6A9A8B;
	--bss-ink: #0D141A;
	--bss-heading: #1D1E20;
	--bss-muted: #56585E;
	--bss-blue: #2F6DF6;
	--bss-header-h: 130px;
}
@media (max-width: 999.98px) {
	:root { --bss-header-h: 118px; }
}

/* ---------- Scroll reveal ("slide" animation of the original site) ---------- */
html.bss-js .bss-slide {
	opacity: 0;
	transform: translateY(20%);
	transition: opacity .65s ease .1s, transform .65s ease .1s;
}
html.bss-js .bss-slide.is-in,
.elementor-editor-active .bss-slide {
	opacity: 1;
	transform: none;
}
/* Elementor editor only: keep every widget visible and selectable on the canvas.
   These classes exist only inside the editor preview, never on the public site. */
html.bss-js body.elementor-editor-active .bss-slide,
html.bss-js .elementor-edit-mode .bss-slide {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

/* ---------- Header ---------- */
#header {
	position: sticky;
	top: 0;
	z-index: 100;
}
.admin-bar #header { top: 32px; }
@media (max-width: 782px) { .admin-bar #header { top: 46px; } }
@media (max-width: 600px) { .admin-bar #header { top: 0; } }

#header [data-row="middle"] {
	box-shadow: 0 6px 12px rgba(0, 0, 0, .06);
}

/* Top announcement bar */
#header [data-row="top"] .ct-container {
	justify-content: center;
}
#header .ct-header-text {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 21px;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0;
}
#header .ct-header-text p { margin: 0; }

/* Logo text */
#header .site-title,
#header .site-title a {
	font-family: 'Outfit', sans-serif;
	font-size: 24px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--bss-heading);
}

/* Desktop menu */
#header .header-menu-1 {
	--menu-items-spacing: 32px;
}
#header .header-menu-1 .menu > li > .ct-menu-link {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--bss-ink);
}
#header .header-menu-1 .menu > li:last-child > .ct-menu-link {
	padding-inline-end: 0;
}
#header .header-menu-1 .menu > li.menu-item-type-post_type.current-menu-item > .ct-menu-link,
#offcanvas .mobile-menu li.menu-item-type-post_type.current-menu-item > .ct-menu-link {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 7px;
}

/* The original switches to the burger menu at 920px (Blocksy does it at 1000px) */
@media (min-width: 921px) and (max-width: 999.98px) {
	#header [data-device="desktop"] { display: block; }
	#header [data-device="mobile"] { display: none; }
	:root { --bss-header-h: 130px; }
}
@media (min-width: 921px) and (max-width: 1100px) {
	#header .header-menu-1 { --menu-items-spacing: 20px; }
}

/* Mobile header */
@media (max-width: 920px) {
	#header [data-device="mobile"] [data-row="middle"] .ct-container {
		width: calc(100% - 64px);
		max-width: none;
	}
	#header [data-device="mobile"] [data-row="top"] .ct-container {
		width: calc(100% - 48px);
		max-width: none;
	}
	#header .ct-header-trigger .ct-icon {
		width: 24px;
		height: 18px;
	}
	/* Blocksy morphs the burger into an X natively while the menu is open (aria-expanded). */
}

/* Mobile menu: drop-down panel under the header instead of a side drawer */
#offcanvas {
	--side-panel-width: 100%;
	top: var(--bss-header-h);
	background: transparent;
}
.admin-bar #offcanvas { top: calc(var(--bss-header-h) + 46px); }
@media (max-width: 600px) { .admin-bar #offcanvas { top: var(--bss-header-h); } }
#offcanvas .ct-panel-inner {
	margin: 0 0 auto;
	width: 100%;
	max-width: none;
	height: auto;
	max-height: calc(100vh - var(--bss-header-h));
	background: var(--bss-sky);
	box-shadow: 0 6px 12px rgba(0, 0, 0, .06);
	transform: translate3d(0, -12px, 0);
}
#offcanvas.active .ct-panel-inner {
	transform: none;
}
#offcanvas .ct-panel-actions { display: none; }
#offcanvas .ct-panel-content-inner {
	padding: 0 16px 24px;
}
#offcanvas .mobile-menu {
	width: 100%;
}
#offcanvas .mobile-menu ul {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 20px;
	margin: 0;
	padding: 0;
}
#offcanvas .mobile-menu li {
	border: 0;
	margin: 0;
	padding: 0;
}
#offcanvas .mobile-menu li > .ct-menu-link {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	text-transform: none;
	color: var(--bss-ink);
	padding: 0;
	justify-content: flex-end;
}
#offcanvas .mobile-menu li > .ct-menu-link::before,
#offcanvas .mobile-menu li > .ct-menu-link::after { display: none; }

/* ---------- Page content helpers ---------- */
#services,
#contact {
	scroll-margin-top: var(--bss-header-h);
}
.elementor-widget-text-editor p:last-child,
.elementor-widget-text-editor p { margin-block: 0; }

/* Phone / email links keep the look of the surrounding text */
#contact .elementor-widget-text-editor a[href^="tel:"],
#contact .elementor-widget-text-editor a[href^="mailto:"],
#footer .bss-footer-value a {
	color: inherit;
	text-decoration: none;
}

/* Pet Sitting image: slanted mask of the original */
.bss-pet-mask img {
	clip-path: polygon(0 0, 74% 0, 100% 100%, 26% 100%);
}

/* Mobile: flatten helper containers so their children can be re-ordered */
@media (max-width: 920px) {
	.e-con.bss-contents-m { display: contents !important; }
}

/* ---------- Contact form (WPForms, styled after the original embedded form) ---------- */
.bss-form-card .wpforms-container.bss-contact-form {
	max-width: 760px;
	margin: 40px auto;
	padding: 28px;
	background: #fff;
	border-radius: 18px;
	font-family: 'Poppins', sans-serif;
}
.bss-contact-form .wpforms-form .wpforms-field-container {
	display: grid;
	gap: 20px;
}
.bss-contact-form .wpforms-form .wpforms-field {
	display: grid;
	gap: 6px;
	padding: 0;
	margin: 0;
}
.bss-contact-form .wpforms-form #wpforms-46-field_1-container { margin-top: -4px; }
.bss-contact-form .wpforms-form .wpforms-field.bss-hidden { display: none; }
.bss-contact-form .wpforms-form .wpforms-field-label,
.bss-contact-form .wpforms-form .wpforms-field-label:not(.wpforms-field-label-inline) {
	margin: 0;
	padding: 0;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 21px;
	color: #222;
}
.bss-contact-form .wpforms-required-label,
.bss-newsletter-form .wpforms-required-label { display: none; }
.bss-contact-form .wpforms-form input[type="text"],
.bss-contact-form .wpforms-form input[type="tel"],
.bss-contact-form .wpforms-form input[type="email"],
.bss-contact-form .wpforms-form input[type="date"],
.bss-contact-form .wpforms-form select,
.bss-contact-form .wpforms-form textarea {
	width: 100%;
	max-width: 100%;
	height: auto;
	min-height: 0;
	padding: 12px 14px;
	border: 1px solid #ddd;
	border-radius: 12px;
	background-color: #fff;
	box-shadow: none;
	font-family: 'Poppins', sans-serif;
	font-size: 13.33px;
	line-height: 16px;
	color: #222;
	transition: .2s;
}
.bss-contact-form .wpforms-form input::placeholder,
.bss-contact-form .wpforms-form textarea::placeholder { color: #757575; opacity: 1; }
.bss-contact-form .wpforms-form input:focus,
.bss-contact-form .wpforms-form select:focus,
.bss-contact-form .wpforms-form textarea:focus {
	border-color: var(--bss-blue);
	box-shadow: 0 0 0 3px rgba(47, 109, 246, .15);
	outline: none;
}
.bss-contact-form .wpforms-form textarea {
	min-height: 100px;
	resize: none;
}
.bss-contact-form .wpforms-form select {
	appearance: none;
	-webkit-appearance: none;
	background: #fff url("data:image/svg+xml;utf8,<svg fill='%23666' height='20' viewBox='0 0 20 20' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M5 7l5 5 5-5'/></svg>") no-repeat right 12px center;
	background-size: 16px;
	cursor: pointer;
}

/* Service choice cards */
.bss-contact-form .wpforms-form .bss-service ul {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 !important;
	padding: 0;
	grid-template-columns: none !important;
}
.bss-contact-form .wpforms-form .bss-service ul li {
	flex: 1;
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid #ddd;
	border-radius: 14px;
	background: #fafafa;
	cursor: pointer;
	width: auto !important;
}
.bss-contact-form .wpforms-form .bss-service ul li input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
}
.bss-contact-form .wpforms-form .bss-service ul li label {
	display: flex !important;
	align-items: center;
	justify-content: center;
	margin: 0 !important;
	padding: 16px;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 21px;
	color: #222;
	cursor: pointer;
}
.bss-contact-form .wpforms-form .bss-service ul li label::before,
.bss-contact-form .wpforms-form .bss-service ul li label::after { display: none !important; }
.bss-contact-form .wpforms-form .bss-service ul li.wpforms-selected label,
.bss-contact-form .wpforms-form .bss-service ul li input:checked + label {
	color: var(--bss-blue);
	font-weight: 600;
}

/* Ages of children checkboxes */
.bss-contact-form .wpforms-form .bss-ages ul {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 10px;
	margin: 0 !important;
	padding: 0;
}
.bss-contact-form .wpforms-form .bss-ages ul li {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 !important;
	padding: 12px !important;
	border: 1px solid #ddd;
	border-radius: 14px;
	background: #fff;
	cursor: pointer;
	transition: all .2s ease;
	width: auto !important;
}
.bss-contact-form .wpforms-form .bss-ages ul li:hover {
	border-color: var(--bss-blue);
	background: #f5f8ff;
}
.bss-contact-form .wpforms-form .bss-ages ul li input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--bss-blue);
	flex-shrink: 0;
	position: static;
	opacity: 1;
}
.bss-contact-form .wpforms-form .bss-ages ul li label {
	margin: 0 !important;
	padding: 0 !important;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: #222;
	cursor: pointer;
}
.bss-contact-form .wpforms-form .bss-ages ul li label::before,
.bss-contact-form .wpforms-form .bss-ages ul li label::after { display: none !important; }

/* Submit */
.bss-contact-form .wpforms-form .wpforms-submit-container {
	margin: 30px 0 0;
	padding: 0;
}
.bss-contact-form .wpforms-form button.wpforms-submit,
.bss-contact-form .wpforms-form button[type="submit"] {
	display: block;
	width: 100%;
	height: auto;
	padding: 14px;
	border: none;
	border-radius: 14px;
	background: var(--bss-blue) !important;
	color: #fff !important;
	font-family: 'Poppins', sans-serif;
	font-size: 13.33px;
	font-weight: 600;
	line-height: 16px;
	box-shadow: none;
	cursor: pointer;
	transition: .2s;
}
.bss-contact-form .wpforms-form button.wpforms-submit:hover {
	transform: translateY(-1px);
	opacity: .95;
}

@media (max-width: 920px) {
	.bss-form-card .wpforms-container.bss-contact-form { margin: 40px auto 0; }
}

/* ---------- Footer ---------- */
#footer [data-row] > .ct-container {
	width: min(1224px, calc(100% - 48px));
	max-width: none;
}
#footer [data-row="middle"] > .ct-container {
	grid-template-columns: 612px 237px 375px;
	column-gap: 0;
	padding-block: 77px 0;
	align-items: start;
}
#footer [data-row="bottom"] > .ct-container {
	padding-block: 4px 60px;
}
#footer [data-column] { row-gap: 0; }
#footer .ct-widget { margin: 0; }
#footer .ct-widget p,
#footer .ct-widget h5 { margin: 0; }

#footer .bss-footer-title {
	font-family: 'Outfit', sans-serif;
	font-size: 26px;
	font-weight: 600;
	line-height: 33.8px;
	color: #fff;
}
#footer .bss-footer-sub {
	margin-top: 19px !important;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	line-height: 18.2px;
	color: #fff;
}
#footer .ct-footer-socials { margin-top: 41px; }
#footer .ct-footer-socials .ct-social-box {
	--theme-icon-size: 24px;
	--items-spacing: 19px;
	gap: 19px;
}
#footer .ct-footer-socials a { --theme-icon-color: #fff; color: #fff; }

#footer .bss-footer-label {
	margin-top: 7px !important;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 21px;
	color: #fff;
}
#footer .bss-footer-label--phone { margin-top: 45px !important; }
#footer .bss-footer-value {
	margin-top: 14px !important;
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
}
#footer .bss-footer-label--phone + .bss-footer-value { margin-top: 16px !important; }

#footer .ct-footer-copyright {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	line-height: 18.2px;
	color: #fff;
}
#footer .ct-footer-copyright p { margin: 0; }
#footer .ct-footer-copyright a {
	color: #fff;
	text-decoration: underline;
}

/* Footer newsletter (WPForms) */
#footer .bss-newsletter-form { margin: 70px 0 0; padding: 0; }
#footer .ct-widget > p:has(style) { display: none; }
#footer .bss-newsletter-form .wpforms-field {
	padding: 0;
	margin: 0;
}
#footer .bss-newsletter-form .wpforms-field-label {
	margin: 0 0 4px;
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	color: #fff;
}
#footer .bss-newsletter-form input[type="email"] {
	width: 100%;
	max-width: 100%;
	height: 54px;
	padding: 0 16px;
	border: 1px solid #B8C0CC;
	border-radius: 10px;
	background: #fff;
	box-shadow: none;
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	color: var(--bss-ink);
}
#footer .bss-newsletter-form .wpforms-submit-container {
	margin: 8px 0 0;
	padding: 0;
}
#footer .bss-newsletter-form button[type="submit"] {
	height: 49px;
	padding: 16px 40px;
	border: 0;
	border-radius: 50px;
	background: var(--bss-green) !important;
	color: #fff !important;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 17px;
	box-shadow: none;
}
#footer .bss-newsletter-form .wpforms-confirmation-container-full {
	margin: 0;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
}

@media (max-width: 1224px) and (min-width: 921px) {
	#footer [data-row="middle"] > .ct-container {
		grid-template-columns: 1fr 0.4fr 0.6fr;
		width: calc(100% - 48px);
	}
	#footer [data-row="bottom"] > .ct-container { width: calc(100% - 48px); }
}
@media (max-width: 920px) {
	#footer [data-row] > .ct-container {
		width: calc(100% - 48px);
		max-width: none;
	}
	#footer [data-row="middle"] > .ct-container {
		display: flex;
		flex-direction: column;
		gap: 0;
		padding-block: 45px 0;
	}
	#footer [data-row="middle"] [data-column] {
		width: 100%;
		margin: 0;
	}
	#footer .bss-footer-title { font-size: 20px; line-height: 26px; }
	#footer .bss-footer-sub { margin-top: 17px !important; font-size: 16px; line-height: 24px; }
	#footer .ct-footer-socials { margin-top: 46px; }
	#footer [data-row="middle"] [data-column="widget-area-2"] { margin-top: 31px; }
	#footer .bss-footer-label { margin-top: 0 !important; }
	#footer .bss-footer-value { margin-top: 12px !important; }
	#footer .bss-footer-label--phone { margin-top: 14px !important; }
	#footer .bss-footer-label--phone + .bss-footer-value { margin-top: 4px !important; }
	#footer .bss-newsletter-form { margin-top: 72px; }
	#footer .bss-newsletter-form button[type="submit"] { font-size: 16px; }
	#footer [data-row="bottom"] > .ct-container { padding-block: 42px 4px; }
	#footer .ct-footer-copyright { font-size: 16px; line-height: 24px; }
}