/* ============================================================
   Homa — site footer
   Same tokens as the header (assets/header.css). Class prefix: hw-foot
   ============================================================ */

#footer {
	background: var(--hw-ink);
	color: var(--hw-topbar-txt);
}
/* No top hairline needed: the evaluation band above is now a navy card on a
   light section, so the footer already meets a light background. */

.hw-foot__main { padding-block: 56px 40px; }

.hw-foot__cols {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	gap: 40px;
	align-items: start;
}

/* --- brand column ------------------------------------------ */
.hw-foot__brand .hw-brand { display: inline-flex; margin-bottom: 12px; }
.hw-foot__brand .hw-brand--text { color: #fff; font-size: 20px; }
.hw-foot__brand .hw-brand__img { height: 46px; }

.hw-foot__tag {
	font-size: 12.5px;
	color: var(--hw-accent-light);
	margin: 0 0 10px;
}

.hw-foot__desc {
	font-size: 13px;
	line-height: 1.9;
	color: var(--hw-navy-soft);
	max-width: 34ch;
	margin: 0 0 18px;
}

.hw-foot__phone {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 19px;
	font-weight: 800;
	color: var(--hw-accent-light);
	text-decoration: none;
}

.hw-foot__phone:hover { color: #F2899C; }
.hw-foot__phone-ico { width: 18px; height: 18px; flex: none; }

.hw-foot__hours {
	font-size: 12px;
	color: var(--hw-navy-soft);
	margin: 8px 0 0;
}

/* --- link columns ------------------------------------------- */
/* Salmon, not white: white headings sat at the same weight and size as the white
   links under them, so a column read as one undifferentiated block. Colour
   family separates them without dimming the links. Salmon on indigo is 5.51:1 at --hw-accent-light (the brand #E85D75 there is
   only 3.90:1, which is why the headings use the lighter tone).
   (Uppercase and letter-spacing are the usual tricks here and both break
   Persian's joined script.) */
.hw-foot__h {
	font-size: 12.5px;
	font-weight: 700;
	color: var(--hw-accent-light);
	margin: 0 0 16px;
	line-height: 1.7;
}

.hw-foot__col ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hw-foot__col li { margin-bottom: 9px; }

.hw-foot__col a {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 13px;
	line-height: 1.8;
	color: var(--hw-topbar-txt);
	text-decoration: none;
	transition: color .16s var(--hw-ease);
}

.hw-foot__col a:hover { color: var(--hw-accent-light); }

/* fixed-width rail so labels line up whether or not an item has a flag/icon */
.hw-foot__ico {
	display: inline-grid;
	place-items: center;
	width: 20px;
	flex: none;
}

.hw-foot__ico .hw-flag {
	width: 19px;
	height: 13px;
	border-radius: 2px;
}

.hw-foot__ico .hw-foot__svg {
	width: 16px;
	height: 16px;
	color: var(--hw-accent-light);
	opacity: .75;
	transition: opacity .16s var(--hw-ease);
}

.hw-foot__col a:hover .hw-foot__svg { opacity: 1; }

.hw-foot__col a:focus-visible,
.hw-foot__phone:focus-visible,
.hw-foot__bar a:focus-visible {
	outline: 2px solid var(--hw-accent);
	outline-offset: 2px;
}

/* --- bottom bar --------------------------------------------- */
.hw-foot__bar { border-top: 1px solid rgba(255, 255, 255, .08); }

.hw-foot__bar-in {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding-block: 18px;
	font-size: 12.5px;
	color: var(--hw-navy-soft);
	text-align: center;
}

/* --- responsive ---------------------------------------------- */
@media (max-width: 1023px) {
	.hw-foot__cols { grid-template-columns: 1fr 1fr; gap: 32px; }
	.hw-foot__brand { grid-column: 1 / -1; }

	/* clear the fixed bottom CTA bar. Sits on the footer rather than the body so
	   the navy runs all the way behind the bar; env() covers notched devices,
	   where the bar grows by the safe-area inset. */
	#footer { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
}

@media (max-width: 640px) {
	.hw-foot__main { padding-block: 36px 28px; }
	.hw-foot__cols { grid-template-columns: 1fr; gap: 28px; }
	.hw-foot__desc { max-width: none; }

}