/* ==========================================================================
   Holiday Alone - on top of the BHL 2026 styles (site, cards, pages, guides,
   content-tools). The brand colours from the logo: oranges #fd8918 / #f2861a /
   #fca33b, yellow #ffdb7b and white, with warm espresso browns for text and the
   dark areas (the BHL "forest" tokens).
   ========================================================================== */

:root {
	--forest-950: #2a1607;
	--forest-900: #3a1f0a;
	--forest-800: #4d2a0e;
	--forest-700: #b85a0a;
	--forest-600: #c4620c;
	--forest-500: #e07a12;
	--moss: #ffdb7b;

	--gold-700: #b8650d;
	--gold-500: #d4882e;
	--gold-400: #fca33b;
	--gold-200: #ffdb7b;
	--sand: #f6d9b0;
	--cream: #fff3dc;
	--paper: #fffaf3;
	--paper-2: #fff0dd;

	--orange: #fd8918;
	--orange-2: #f2861a;
	--orange-3: #fca33b;
	--yellow: #ffdb7b;
	--cta: #e5700c;
	--cta-hover: #c95f06;

	--ink: #2b1b0e;
	--ink-2: #5b4535;
	--line: rgba(58, 31, 10, .12);

	--shadow-sm: 0 2px 10px rgba(58, 31, 10, .06), 0 1px 2px rgba(58, 31, 10, .06);
	--shadow: 0 22px 44px -22px rgba(90, 45, 8, .42);
	--shadow-lg: 0 40px 80px -30px rgba(58, 31, 10, .55);

	--font-logo: 'Fredoka', 'DM Sans', system-ui, sans-serif;
	--announce-h: 0px;
	--sunset: linear-gradient(160deg, #fca33b 0%, #fd8918 48%, #e27c18 100%);
}

::selection { background: var(--orange); color: #fff; }

/* --------------------------------------------------------------------------
   Logo
   -------------------------------------------------------------------------- */

.haLogo { display: inline-flex; align-items: center; gap: 10px; color: #fff; line-height: 1; }
.haLogo__mark { width: 44px; height: 44px; flex: none; transition: transform .6s var(--ease-out); }
.haLogo:hover .haLogo__mark { transform: rotate(-8deg) scale(1.05); }
.haLogo__text { display: flex; flex-direction: column; gap: 4px; }
.haLogo__name { font-family: var(--font-logo); font-weight: 700; font-size: 29px; letter-spacing: -.01em; color: #fff; white-space: nowrap; }
.haLogo__name b { font-weight: 700; color: var(--yellow); }
.haLogo__tag { font-size: 11.5px; font-weight: 600; letter-spacing: .02em; color: rgba(255, 255, 255, .92); white-space: nowrap; }
.siteTop.is-scrolled .haLogo__mark { width: 38px; height: 38px; }
.siteTop.is-scrolled .haLogo__name { font-size: 25px; }
.siteTop.is-scrolled .haLogo__tag { display: none; }
.siteTop:not(.is-scrolled):not(.is-menu-open) .haLogo { filter: drop-shadow(0 1px 8px rgba(90, 40, 0, .3)); }

.drawer__logo .haLogo__name { font-size: 24px; }
.drawer__logo .haLogo__mark { width: 36px; height: 36px; }
.siteFooter__logo .haLogo__mark { width: 50px; height: 50px; }
.siteFooter__logo .haLogo__name { font-size: 32px; }

@media (max-width: 1180px) {
	.haLogo__tag { display: none; }
}
@media (max-width: 760px) {
	.siteHeader .haLogo__mark { width: 34px; height: 34px; }
	.siteHeader .haLogo__name { font-size: 22px; }
}

/* --------------------------------------------------------------------------
   Header: clear over the orange header, orange when scrolled
   -------------------------------------------------------------------------- */

.siteHeader::before { background: linear-gradient(to bottom, rgba(120, 55, 0, .28), rgba(120, 55, 0, 0)); }
.siteTop.is-scrolled .siteHeader,
.siteTop.is-menu-open .siteHeader { background: rgba(242, 134, 26, .96); box-shadow: 0 12px 30px -18px rgba(90, 40, 0, .7); }
.siteTop:not(.is-scrolled):not(.is-menu-open) .mainNav__link { text-shadow: 0 1px 10px rgba(110, 50, 0, .35); }
.mainNav__link:hover, .mainNav__link[aria-expanded="true"] { background: rgba(255, 255, 255, .18); }
.headerCta { background: #fff; color: var(--forest-800); }
.headerCta:hover { background: var(--yellow); color: var(--forest-900); }
.drop .drop__icon { color: var(--orange); }

.drawer__panel { background: var(--forest-900); background-image: radial-gradient(circle at 100% 0, rgba(253, 137, 24, .25), transparent 55%); }

/* --------------------------------------------------------------------------
   Page headers: the logo's sunset orange, with a sea of waves at the bottom
   -------------------------------------------------------------------------- */

.pageHero { background: var(--orange-2); }
.pageHero--plain {
	background:
		radial-gradient(ellipse at 88% -10%, rgba(255, 219, 123, .55) 0%, rgba(255, 219, 123, 0) 50%),
		radial-gradient(ellipse at 0% 110%, rgba(200, 90, 0, .35) 0%, rgba(200, 90, 0, 0) 55%),
		var(--sunset);
}
.pageHero__trees { opacity: 1; height: 70px; background-size: 1440px 70px; }
.pageHero__title em { color: var(--yellow); }
.eyebrow--light { color: #fff; }
.eyebrow--light::before { background: var(--yellow); }
.crumbs { color: rgba(255, 255, 255, .88); }
.gMeta { color: rgba(255, 255, 255, .95); }
.gMeta .icon { color: var(--yellow); }
.pageHero--plain .pageHero__title, .pageHero--plain .pageHero__lead { text-shadow: 0 1px 18px rgba(120, 50, 0, .22); }
.pageHero--plain .pageHero__lead { color: #fff; }

/* A post with its own photo: the photo behind, warm shade on the left */
.haHero--photo { background: var(--forest-900); }
.haHero--photo .pageHero__media img { object-position: 50% 50%; }
.haHero--photo .pageHero__shade {
	background:
		linear-gradient(90deg, rgba(58, 24, 0, .82) 0%, rgba(90, 38, 0, .55) 45%, rgba(90, 38, 0, .12) 80%),
		linear-gradient(0deg, rgba(58, 24, 0, .5) 0%, rgba(58, 24, 0, 0) 45%);
}
.haHero--photo .pageHero__trees { display: none; }

/* --------------------------------------------------------------------------
   Text, cards and side column
   -------------------------------------------------------------------------- */

.secTitle, .prose h2, .pgTitle, .prose h3 { color: var(--forest-800); }
.prose a { color: var(--forest-700); text-decoration-color: rgba(229, 112, 12, .4); }
.prose a:hover { color: var(--cta-hover); }
.prose blockquote { margin: 1.6em 0; padding: 18px 24px; border-left: 4px solid var(--orange); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: var(--paper-2); font-family: var(--font-display); font-size: 1.1em; color: var(--ink); }
.prose .haNote { padding: 18px 22px; border-radius: var(--radius); background: var(--cream); border: 1px solid rgba(253, 137, 24, .25); }
.prose .haNote > :last-child { margin-bottom: 0; }

.gCard__tag { background: rgba(255, 255, 255, .95); color: var(--forest-800); }
.gCard__tag .icon { color: var(--orange); }
.gCard__more { color: var(--cta); }
.gChip .icon { color: var(--orange); }
.gChip.is-current { background: var(--orange-2); border-color: var(--orange-2); color: #fff; }
.gChip.is-current .icon { color: #fff; }
.asideCard__title .icon { color: var(--orange); }

.ctaBand {
	background:
		radial-gradient(ellipse at 90% 0%, rgba(255, 219, 123, .5) 0%, rgba(255, 219, 123, 0) 55%),
		var(--sunset);
}
.ctaBand h2 { text-shadow: 0 1px 16px rgba(120, 50, 0, .25); }
.ctaBand p { color: #fff; }
.ctaBand .btn--cta { background: #fff; color: var(--forest-800); }
.ctaBand .btn--cta:hover { background: var(--yellow); color: var(--forest-900); }

.split__badge span { background: var(--orange-2); }

/* Footer */
.siteFooter { background: var(--forest-950); }
.siteFooter__note { max-width: 380px; margin: 0; font-size: 13.5px; line-height: 1.6; color: rgba(255, 255, 255, .55); }
.siteFooter__tagline { color: var(--yellow); }
.footerWordmark { font-family: var(--font-logo); font-weight: 700; }

/* Pages (About, Contact, Privacy) */
.haPage { max-width: 820px; }
.wpcf7 input[type=text], .wpcf7 input[type=email], .wpcf7 input[type=tel], .wpcf7 textarea {
	width: 100%; padding: 13px 16px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff;
	font: inherit; color: var(--ink); transition: border-color .2s, box-shadow .2s;
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: 0; border-color: var(--orange); box-shadow: 0 0 0 4px rgba(253, 137, 24, .18); }
.wpcf7 input[type=submit] { height: 52px; padding: 0 2em; border: 0; border-radius: 999px; background: var(--cta); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.wpcf7 input[type=submit]:hover { background: var(--cta-hover); }

/* --------------------------------------------------------------------------
   Homepage
   -------------------------------------------------------------------------- */

.haHero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: min(92vh, 860px);
	display: flex;
	align-items: center;
	color: #fff;
	background: var(--orange-2);
}
.haHero__media { position: absolute; inset: 0; z-index: -2; }
.haHero__media picture, .haHero__media img { display: block; width: 100%; height: 100%; }
.haHero__media img { object-fit: cover; object-position: 65% 50%; animation: heroZoom 18s var(--ease-out) both; }
.haHero__shade {
	position: absolute; inset: 0; z-index: -1;
	background:
		linear-gradient(95deg, rgba(232, 112, 10, .92) 0%, rgba(245, 128, 20, .72) 34%, rgba(253, 150, 40, .18) 64%, rgba(253, 150, 40, 0) 80%),
		linear-gradient(0deg, rgba(90, 40, 0, .35) 0%, rgba(90, 40, 0, 0) 40%),
		linear-gradient(180deg, rgba(110, 50, 0, .35) 0%, rgba(110, 50, 0, 0) 25%);
}
.haHero__inner { padding-top: 140px; padding-bottom: 150px; }
.haHero__eyebrow .icon { width: 18px; height: 18px; color: var(--yellow); }
.haHero__eyebrow::before { display: none; }
.haHero__eyebrow { display: inline-flex; align-items: center; gap: 8px; animation: fadeUp .9s .15s var(--ease-out) both; }
.haHero__title {
	max-width: 760px;
	margin-top: 16px;
	font-family: var(--font-display);
	font-weight: 400;
	font-size: clamp(2.9rem, 6.6vw, 5.8rem);
	line-height: .98;
	letter-spacing: -.03em;
	text-wrap: balance;
	text-shadow: 0 2px 30px rgba(120, 50, 0, .25);
	animation: fadeUp 1.1s .25s var(--ease-out) both;
}
.haHero__title em { font-style: italic; font-weight: 300; color: var(--yellow); }
.haHero__lead { max-width: 560px; margin: 22px 0 0; font-size: clamp(17px, 1.45vw, 19.5px); color: #fff; text-wrap: pretty; text-shadow: 0 1px 14px rgba(120, 50, 0, .3); animation: fadeUp 1.1s .4s var(--ease-out) both; }
.haHero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; animation: fadeUp 1.1s .55s var(--ease-out) both; }
.haHero__actions .btn--cta { background: #fff; color: var(--forest-800); }
.haHero__actions .btn--cta:hover { background: var(--yellow); }
.haHero__actions .btn--light { background: rgba(255, 255, 255, .14); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.haHero__actions .btn--light:hover { background: rgba(255, 255, 255, .26); }
.haHero__trust { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 34px; font-size: 14.5px; font-weight: 600; animation: fadeUp 1.1s .7s var(--ease-out) both; }
.haHero__trust li { display: inline-flex; align-items: center; gap: 8px; }
.haHero__trust .icon { width: 18px; height: 18px; color: var(--yellow); }
.haHero .pageHero__trees { z-index: 0; }

@media (max-width: 760px) {
	.haHero { min-height: 0; }
	.haHero__inner { padding-top: 120px; padding-bottom: 110px; }
	.haHero__media img { object-position: 72% 50%; }
	.haHero__shade { background: linear-gradient(180deg, rgba(232, 112, 10, .55) 0%, rgba(232, 112, 10, .78) 45%, rgba(220, 100, 5, .92) 100%); }
}

/* The guide sections as tiles */
.haTiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.haTile {
	position: relative;
	display: flex; flex-direction: column; gap: 10px;
	padding: 26px 22px 22px;
	border-radius: var(--radius);
	background: #fff;
	box-shadow: var(--shadow-sm);
	border: 1px solid var(--line);
	transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out), border-color .3s;
}
.haTile:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: rgba(253, 137, 24, .45); }
.haTile__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--sunset); color: #fff; box-shadow: 0 10px 20px -10px rgba(229, 112, 12, .8); }
.haTile__icon .icon { width: 26px; height: 26px; }
.haTile__name { margin-top: 6px; font-family: var(--font-display); font-size: 1.3rem; line-height: 1.2; color: var(--forest-800); }
.haTile__text { font-size: 14.5px; line-height: 1.55; color: var(--ink-2); flex: 1; }
.haTile__count { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: var(--cta); }
.haTile__count .icon { width: 16px; height: 16px; transition: transform .4s var(--ease-out); }
.haTile:hover .haTile__count .icon { transform: translateX(4px); }

@media (max-width: 1100px) { .haTiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .haTiles { grid-template-columns: 1fr 1fr; gap: 12px; } .haTile { padding: 20px 16px 16px; } }
@media (max-width: 420px) { .haTiles { grid-template-columns: 1fr; } }

.haSecHead { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }

/* Why go with a singles company */
.haWhy__lead { margin-left: 0; }
.haBenefits { display: grid; gap: 18px; margin-top: 30px; }
.haBenefits li { display: flex; gap: 16px; align-items: flex-start; }
.haBenefits li > span { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: 14px; background: var(--cream); color: var(--cta); }
.haBenefits .icon { width: 22px; height: 22px; }
.haBenefits b { display: block; font-size: 17px; color: var(--forest-800); }
.haBenefits div { color: var(--ink-2); line-height: 1.55; }
.haWhy__media { aspect-ratio: 4 / 4.4; }

/* FAQs */
.haFaqs__inner { max-width: 860px; }
.haFaqs__list .bhl-faq { background: #fff; }

@media (prefers-reduced-motion: reduce) {
	.haHero__media img, .haHero__eyebrow, .haHero__title, .haHero__lead, .haHero__actions, .haHero__trust { animation: none; }
	.haTile, .haLogo__mark { transition: none; }
}
.no-anim .haHero__eyebrow, .no-anim .haHero__title, .no-anim .haHero__lead, .no-anim .haHero__actions, .no-anim .haHero__trust { animation: none; }
.no-anim .crumbs, .no-anim .pageHero__eyebrow, .no-anim .pageHero__title, .no-anim .pageHero__lead, .no-anim .pageHero__media img { animation: none; }