/*
Theme Name: Houston Safe & Lock
Theme URI: https://github.com/MarketHubb/houstonsafe
Description: Houston Safe & Lock's site-specific Ollie child theme.
Author: Houston Safe & Lock
Author URI: https://houstonsafeandlock.com/
Template:     ollie
Version: 1.0.0
Requires at least: 7.0
Tested up to: 7.0
Requires PHP: 8.3
License:      GPL-2.0-or-later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Copyright:    2026 Houston Safe & Lock
Tags:         blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, block-patterns, block-styles, custom-logo, custom-menu, editor-style, featured-images, full-width-template, rtl-language-support, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Text Domain: houston-safe-and-lock-child-theme
*/

:root {
	--hsl-navy: #174368;
	--hsl-navy-800: #103450;
	--hsl-navy-50: #eef3f8;
	--hsl-gold: #fcdc69;
	--hsl-gold-soft: #f3e9c8;
	--hsl-gold-dark: #765d14;
	--hsl-ink: #16212c;
	--hsl-muted: #5b6b7a;
	--hsl-line: #e2e8ee;
	--hsl-soft: #f5f7fa;
	--hsl-radius: 14px;
	--hsl-radius-sm: 9px;
	--hsl-shadow-sm: 0 1px 3px rgba(23, 67, 104, 0.08), 0 1px 2px rgba(23, 67, 104, 0.06);
	--hsl-shadow: 0 10px 30px rgba(23, 67, 104, 0.1);
	--hsl-shadow-lg: 0 24px 60px rgba(23, 67, 104, 0.16);
}

.hsl-site-chrome,
.hsl-site-footer-wrap {
	position: relative;
	z-index: 20;
}

.hsl-utility {
	background: var(--hsl-navy);
	color: #cfe0ee;
	font-size: 0.8rem;
}

.hsl-utility-inner {
	min-height: 40px;
	gap: 1rem;
}

.hsl-utility p {
	margin: 0;
	color: inherit;
	white-space: nowrap;
}

.hsl-utility a {
	color: inherit;
	text-decoration: none;
}

.hsl-utility strong {
	color: #fff;
}

.hsl-utility-left,
.hsl-utility-right {
	gap: 1rem;
}

.hsl-primary-header {
	position: sticky;
	top: 0;
	z-index: 60;
	border-bottom: 1px solid var(--hsl-line);
	background: #fff;
	box-shadow: var(--hsl-shadow-sm);
}

.admin-bar .hsl-primary-header {
	top: 32px;
}

.hsl-nav {
	min-height: 72px;
	gap: 1rem;
}

.hsl-brand {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 11px;
	color: var(--hsl-navy);
	text-decoration: none;
}

.hsl-brand-mark,
.hsl-footer-mark {
	width: 42px;
	height: 42px;
	flex: 0 0 auto;
}

.hsl-brand-text {
	display: grid;
	gap: 4px;
	line-height: 1;
}

.hsl-brand-text span {
	color: var(--hsl-navy);
	font-size: 1.12rem;
	font-weight: 800;
	white-space: nowrap;
}

.hsl-brand-text small {
	color: var(--hsl-gold-dark);
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	white-space: nowrap;
}

.hsl-main-nav {
	flex: 1 1 auto;
	justify-content: center;
}

.hsl-main-nav .wp-block-navigation-item__content {
	border-radius: 8px;
	color: var(--hsl-ink);
	font-size: 0.93rem;
	font-weight: 650;
	padding: 0.55rem 0.68rem;
	text-decoration: none;
}

.hsl-main-nav .wp-block-navigation-item__content:hover {
	background: var(--hsl-navy-50);
	color: var(--hsl-navy);
}

.hsl-nav-cta {
	flex: 0 0 auto;
	gap: 0.75rem;
}

.hsl-primary-header .wp-block-woocommerce-customer-account,
.hsl-primary-header .wp-block-woocommerce-mini-cart {
	display: none !important;
}

.hsl-nav-phone {
	display: grid;
	gap: 2px;
	line-height: 1.1;
	text-align: right;
	text-decoration: none;
}

.hsl-nav-phone span {
	color: var(--hsl-muted);
	font-size: 0.64rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}

.hsl-nav-phone strong {
	color: var(--hsl-navy);
	font-size: 1.05rem;
	white-space: nowrap;
}

.hsl-button-gold .wp-block-button__link {
	background: var(--hsl-gold);
	border: 2px solid var(--hsl-gold);
	border-radius: var(--hsl-radius-sm);
	color: var(--hsl-navy);
	font-weight: 800;
	padding: 0.75rem 1.25rem;
}

.hsl-button-gold .wp-block-button__link:hover {
	background: var(--hsl-gold-dark);
	border-color: var(--hsl-gold-dark);
	color: var(--hsl-navy);
}

.hsl-button-navy .wp-block-button__link {
	background: var(--hsl-navy);
	border: 2px solid var(--hsl-navy);
	border-radius: var(--hsl-radius-sm);
	color: #fff;
	font-weight: 800;
}

.hsl-button-outline .wp-block-button__link {
	border-color: var(--hsl-navy);
	color: var(--hsl-navy);
	font-weight: 800;
}

.hsl-site-footer {
	background: var(--hsl-navy);
	color: #b9cbdb;
	font-size: 0.92rem;
}

.hsl-footer-top {
	gap: 2.5rem;
	padding-bottom: 2.75rem;
	padding-top: 4rem;
}

.hsl-site-footer h4 {
	color: #fff;
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	margin: 0 0 1rem;
	text-transform: uppercase;
}

.hsl-site-footer p {
	color: inherit;
}

.hsl-site-footer a {
	color: #dce8f2;
	text-decoration: none;
}

.hsl-site-footer a:hover {
	color: #fff;
}

.hsl-site-footer ul {
	display: grid;
	gap: 0.55rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.hsl-footer-badges {
	gap: 0.6rem;
	margin-top: 1rem;
}

.hsl-footer-badges p {
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.07);
	color: #dbe7f2;
	font-size: 0.8rem;
	font-weight: 700;
	margin: 0;
	padding: 0.42rem 0.8rem;
}

.hsl-footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	color: #b7c7d4;
	font-size: 0.84rem;
	gap: 0.85rem;
	padding-bottom: 1.25rem;
	padding-top: 1.25rem;
}

.hsl-footer-bottom p {
	margin: 0;
}

@media (max-width: 1040px) {

	.hsl-nav-phone,
	.hsl-nav-cta .wp-block-buttons {
		display: none;
	}
}

@media (max-width: 782px) {

	.admin-bar .hsl-primary-header {
		top: 46px;
	}

	.hsl-utility-left p:nth-child(2),
	.hsl-utility-right {
		display: none;
	}

	.hsl-nav {
		min-height: 64px;
	}

	.hsl-brand-text span {
		font-size: 1rem;
	}

	.hsl-brand-text small {
		display: none;
	}

	.hsl-footer-top {
		padding-top: 3rem;
	}
}

/* Blog listing and single post templates */
.hsl-blog-page,
.hsl-post-page {
	color: var(--hsl-ink);
}

.hsl-blog-breadcrumb,
.hsl-post-breadcrumb {
	background: var(--hsl-soft);
	border-bottom: 1px solid var(--hsl-line);
	color: var(--hsl-muted);
	font-size: 0.86rem;
	font-weight: 700;
}

.hsl-blog-breadcrumb a,
.hsl-post-breadcrumb a {
	color: var(--hsl-navy);
	text-decoration: none;
}

.hsl-post-breadcrumb .wp-block-post-title {
	color: var(--hsl-muted);
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	margin: 0;
}

.hsl-blog-hero {
	min-height: 500px;
}

.hsl-blog-hero .wp-block-cover__background {
	background: linear-gradient(100deg, rgba(23, 67, 104, 0.96) 0%, rgba(23, 67, 104, 0.84) 45%, rgba(23, 67, 104, 0.42) 100%) !important;
	opacity: 1 !important;
}

.hsl-blog-hero-content {
	max-width: 760px;
	padding-bottom: 4rem;
	padding-top: 4rem;
}

.hsl-eyebrow,
.hsl-blog-hero .hsl-eyebrow,
.hsl-post-hero .hsl-eyebrow {
	color: var(--hsl-gold-dark);
	font-size: 0.78rem;
	font-weight: 850;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.hsl-blog-hero .hsl-eyebrow {
	color: var(--hsl-gold);
}

.hsl-blog-hero h1,
.hsl-blog-hero p {
	color: #fff;
}

.hsl-blog-hero h1 {
	font-size: clamp(2.25rem, 5vw, 4rem);
	line-height: 1.05;
	max-width: 780px;
}

.hsl-blog-hero .hsl-blog-deck {
	color: #d6e3f0;
	font-size: 1.1rem;
	max-width: 58ch;
}

.hsl-trust-strip {
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	gap: 0.95rem 1.5rem;
	margin-top: 1.6rem;
	padding-top: 1.35rem;
}

.hsl-trust-strip p {
	color: #e8f1f8;
	font-size: 0.92rem;
	font-weight: 750;
	margin: 0;
}

.hsl-blog-shell {
	padding-bottom: 4.75rem;
	padding-top: 4rem;
}

.hsl-blog-shell > .hsl-blog-feature,
.hsl-blog-shell > .hsl-blog-layout {
	max-width: none !important;
	width: 100%;
}

.hsl-blog-feature {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow);
	margin-bottom: 2.25rem;
	overflow: hidden;
}

.hsl-blog-feature .wp-block-columns {
	margin-bottom: 0;
}

.hsl-blog-feature-image img {
	aspect-ratio: 16 / 11;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.hsl-blog-feature-copy {
	padding: clamp(1.6rem, 4vw, 2.3rem);
}

.hsl-blog-feature-copy h2 {
	font-size: clamp(1.7rem, 3vw, 2.35rem);
	line-height: 1.12;
	margin-bottom: 0.75rem;
}

.hsl-blog-meta,
.hsl-post-meta {
	align-items: center;
	color: var(--hsl-muted);
	display: flex;
	flex-wrap: wrap;
	font-size: 0.86rem;
	font-weight: 750;
	gap: 0.55rem 0.85rem;
	margin-bottom: 0.8rem;
}

.hsl-blog-meta a,
.hsl-post-meta a {
	color: var(--hsl-gold-dark);
	text-decoration: none;
}

.hsl-post-meta .wp-block-post-author-name {
	margin: 0;
}

.hsl-topic-pill,
.hsl-blog-meta .taxonomy-category a,
.hsl-post-meta .taxonomy-category a {
	background: var(--hsl-gold-soft, #f3e9c8);
	border-radius: 999px;
	color: var(--hsl-gold-dark);
	display: inline-flex;
	font-size: 0.72rem;
	font-weight: 850;
	letter-spacing: 0.1em;
	padding: 0.35rem 0.68rem;
	text-transform: uppercase;
}

.hsl-blog-layout {
	align-items: flex-start;
	display: grid;
	gap: 2.35rem;
	grid-template-columns: 286px minmax(0, 1fr);
}

.hsl-blog-sidebar {
	display: grid;
	gap: 1.1rem;
	position: sticky;
	top: 96px;
}

.hsl-sidebox {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow-sm);
	padding: 1.35rem;
}

.hsl-sidebox h2,
.hsl-sidebox h3,
.hsl-sidebox .wp-block-heading {
	color: var(--hsl-muted);
	font-size: 0.8rem;
	font-weight: 850;
	letter-spacing: 0.12em;
	margin-bottom: 0.85rem;
	text-transform: uppercase;
}

.hsl-blog-categories,
.hsl-blog-sidebar ul {
	display: grid;
	gap: 0.55rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.hsl-blog-categories li,
.hsl-blog-sidebar li {
	border-bottom: 1px solid var(--hsl-line);
	font-weight: 750;
	padding-bottom: 0.45rem;
}

.hsl-blog-categories a,
.hsl-blog-sidebar li a {
	color: var(--hsl-navy);
	text-decoration: none;
}

.hsl-blog-mini-cta {
	background: var(--hsl-navy);
	border-color: var(--hsl-navy);
	color: #d8e5f0;
}

.hsl-blog-mini-cta h2,
.hsl-blog-mini-cta h3,
.hsl-blog-mini-cta .wp-block-heading {
	color: var(--hsl-gold);
}

.hsl-blog-mini-cta p {
	color: #d8e5f0;
}

.hsl-blog-toolbar {
	align-items: center;
	border-bottom: 1px solid var(--hsl-line);
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	justify-content: space-between;
	margin-bottom: 1.5rem;
	padding-bottom: 0.9rem;
}

.hsl-blog-toolbar h2 {
	font-size: 1.4rem;
	margin: 0;
}

.hsl-blog-toolbar p {
	color: var(--hsl-muted);
	font-size: 0.92rem;
	font-weight: 650;
	margin: 0;
}

.hsl-blog-search .wp-block-search__inside-wrapper {
	border: 1.5px solid var(--hsl-line);
	border-radius: var(--hsl-radius-sm);
	overflow: hidden;
}

.hsl-blog-search .wp-block-search__input {
	border: 0;
	min-height: 44px;
}

.hsl-blog-search .wp-block-search__button {
	background: var(--hsl-navy);
	border: 0;
	color: #fff;
	font-weight: 800;
	margin: 0;
}

.hsl-blog-query .wp-block-post-template {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hsl-blog-card {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow-sm);
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.hsl-blog-card:hover {
	box-shadow: var(--hsl-shadow);
	transform: translateY(-4px);
}

.hsl-blog-card .wp-block-post-featured-image {
	margin: 0;
}

.hsl-blog-card .wp-block-post-featured-image img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	width: 100%;
}

.hsl-blog-card-body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.35rem;
}

.hsl-blog-card h2,
.hsl-blog-card h3 {
	font-size: 1.2rem;
	line-height: 1.18;
	margin-bottom: 0.55rem;
}

.hsl-blog-card h2 a,
.hsl-blog-card h3 a {
	color: var(--hsl-navy);
	text-decoration: none;
}

.hsl-blog-card .wp-block-post-excerpt {
	color: var(--hsl-muted);
	font-size: 0.94rem;
}

.hsl-read-more {
	margin-top: auto;
}

.hsl-read-more a,
.hsl-blog-card .wp-block-read-more {
	color: var(--hsl-navy);
	font-weight: 850;
	text-decoration: none;
}

.hsl-guide-band {
	background: var(--hsl-soft);
	border-bottom: 1px solid var(--hsl-line);
	border-top: 1px solid var(--hsl-line);
	padding: 4.5rem 0;
}

.hsl-guide-card {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow-sm);
	padding: 1.65rem;
}

.hsl-cta-band {
	background: linear-gradient(120deg, var(--hsl-navy) 0%, var(--hsl-navy-800) 100%);
	border-radius: var(--hsl-radius);
	color: #fff;
	overflow: hidden;
	padding: clamp(2rem, 5vw, 3.4rem);
}

.hsl-cta-band h2,
.hsl-cta-band p {
	color: #fff;
}

.hsl-post-hero {
	background: linear-gradient(180deg, #fff 0%, var(--hsl-soft) 100%);
	border-bottom: 1px solid var(--hsl-line);
	padding-bottom: 4.25rem;
	padding-top: 3.5rem;
}

.hsl-post-hero .wp-block-columns {
	align-items: center !important;
	gap: 3.25rem;
}

.hsl-post-hero h1 {
	font-size: clamp(2.1rem, 4vw, 3.35rem);
	line-height: 1.08;
	margin-bottom: 1rem;
}

.hsl-post-deck,
.hsl-post-hero .wp-block-post-excerpt__excerpt {
	color: var(--hsl-ink);
	font-size: 1.1rem;
	line-height: 1.65;
	max-width: 62ch;
}

.hsl-post-badges {
	gap: 0.6rem;
	margin: 1.2rem 0 1.6rem;
}

.hsl-post-badges p {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: 999px;
	color: var(--hsl-navy);
	font-size: 0.84rem;
	font-weight: 850;
	margin: 0;
	padding: 0.45rem 0.8rem;
}

.hsl-post-hero-image {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow);
	overflow: hidden;
}

.hsl-post-hero-image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	width: 100%;
}

.hsl-post-shell {
	padding-bottom: 4.75rem;
	padding-top: 4.1rem;
}

.hsl-post-layout {
	align-items: flex-start;
	display: grid;
	gap: 2.35rem;
	grid-template-columns: 240px minmax(0, 760px) 250px;
	justify-content: center;
}

.hsl-post-toc,
.hsl-post-aside {
	position: sticky;
	top: 96px;
}

.hsl-post-toc {
	border-left: 3px solid var(--hsl-gold);
	padding-left: 1rem;
}

.hsl-post-toc h2,
.hsl-post-aside h2,
.hsl-post-aside h3 {
	color: var(--hsl-muted);
	font-size: 0.78rem;
	font-weight: 850;
	letter-spacing: 0.13em;
	margin-bottom: 0.8rem;
	text-transform: uppercase;
}

.hsl-post-toc ul,
.hsl-post-aside ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hsl-post-toc li {
	margin-bottom: 0.55rem;
}

.hsl-post-toc a {
	color: var(--hsl-navy);
	font-size: 0.92rem;
	font-weight: 750;
	line-height: 1.35;
	text-decoration: none;
}

.hsl-post-content {
	font-size: 1.05rem;
	line-height: 1.78;
}

.hsl-post-content :where(p, ul, ol, figure) {
	margin-bottom: 1.35rem;
}

.hsl-post-content :where(h2) {
	font-size: clamp(1.55rem, 2.3vw, 2rem);
	margin-bottom: 0.85rem;
	margin-top: 2.55rem;
}

.hsl-post-content :where(h3) {
	font-size: 1.2rem;
	margin-bottom: 0.6rem;
	margin-top: 1.8rem;
}

.hsl-post-content :where(.wp-block-image) {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow-sm);
	overflow: hidden;
}

.hsl-post-content :where(.wp-block-image img) {
	width: 100%;
}

.hsl-post-content :where(.wp-block-table) {
	margin: 1.6rem 0;
}

.hsl-post-content :where(.wp-block-table table) {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-collapse: collapse;
	width: 100%;
}

.hsl-post-content :where(.wp-block-table td, .wp-block-table th) {
	border: 1px solid var(--hsl-line);
	padding: 0.8rem;
	vertical-align: top;
}

.hsl-post-aside {
	display: grid;
	gap: 1rem;
}

.hsl-aside-card {
	background: #fff;
	border: 1px solid var(--hsl-line);
	border-radius: var(--hsl-radius);
	box-shadow: var(--hsl-shadow-sm);
	padding: 1.35rem;
}

.hsl-aside-card p {
	color: var(--hsl-muted);
	font-size: 0.92rem;
}

.hsl-related-posts {
	background: var(--hsl-soft);
	border-top: 1px solid var(--hsl-line);
	padding: 4.5rem 0;
}

.hsl-related-posts .wp-block-post-template {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1080px) {

	.hsl-blog-layout {
		grid-template-columns: 1fr;
	}

	.hsl-blog-sidebar {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		position: static;
	}

	.hsl-post-layout {
		grid-template-columns: minmax(0, 760px);
	}

	.hsl-post-toc,
	.hsl-post-aside {
		position: static;
	}

	.hsl-post-aside {
		display: none;
	}
}

@media (max-width: 782px) {

	.hsl-blog-hero {
		min-height: 520px;
	}

	.hsl-blog-feature .wp-block-columns,
	.hsl-post-hero .wp-block-columns {
		flex-wrap: wrap !important;
	}

	.hsl-blog-sidebar,
	.hsl-blog-query .wp-block-post-template,
	.hsl-related-posts .wp-block-post-template {
		grid-template-columns: 1fr;
	}

	.hsl-post-shell {
		padding-top: 3rem;
	}

	.hsl-post-toc {
		border-left: 0;
		border-top: 3px solid var(--hsl-gold);
		padding-left: 0;
		padding-top: 1rem;
	}
}