/**
 * ESI Fire Safety
 * Global site footer.
 */


/* =========================================================
   Footer foundation
   ========================================================= */

.esi-site-footer {
	width: 100%;

	color: rgba(255, 255, 255, 0.60);
	background: #090909;

	font-family: var(--esi-font-body);
}


/* =========================================================
   Main footer
   ========================================================= */

.esi-footer__main {
	padding:
	58px 0 54px;
}


.esi-footer__inner {
	display: grid;

	/*
	 * V6.1 logical column proportions:
	 *
	 * Brand              1.25fr
	 * Assessments        1fr
	 * Compliance         .8fr
	 * Advice             1.15fr
	 *
	 * The three navigation columns total 2.95fr.
	 */
	grid-template-columns:
		minmax(0, 1.25fr)
		minmax(0, 2.95fr);

	align-items: start;

	gap: 56px;

	width: 100%;
	max-width: var(--esi-content-width);

	margin-inline: auto;
	padding-inline: 0;

	box-sizing: border-box;
}


/* =========================================================
   Brand
   ========================================================= */

.esi-footer__identity {
	width: 100%;
	max-width: 330px;
}


.esi-footer-brand {
	display: inline-flex;
	align-items: center;
	gap: 12px;

	color: var(--esi-white);

	text-decoration: none;
}


.esi-footer-brand__mark {
	display: block;
	flex: 0 0 40px;

	width: 40px;
	height: 40px;
}


.esi-footer-brand__logo {
	display: block;

	width: 40px;
	height: 40px;

	object-fit: contain;

	border-radius: 3px;
}


.esi-footer-brand__fallback {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 40px;
	height: 40px;

	color: var(--esi-white);
	background: var(--esi-red);

	font-size: 15px;
	font-weight: 800;

	border-radius: 3px;
}


.esi-footer-brand__title {
	color: var(--esi-white);

	font-family: var(--esi-font-heading);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.1;
}


.esi-footer-brand:focus-visible {
	outline: 2px solid var(--esi-red);
	outline-offset: 5px;

	border-radius: 3px;
}


/* =========================================================
   Introduction
   ========================================================= */

.esi-footer__intro {
	max-width: 310px;

	margin:
		20px 0 0;

	color: rgba(255, 255, 255, 0.58);

	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.7;
}


/* =========================================================
   Brand contact details
   ========================================================= */

.esi-footer__contact {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;

	margin-top: 17px;
}


.esi-site-footer .esi-footer__phone {
	color: var(--esi-white);

	font-size: 12px;
	font-weight: 700;
	line-height: 1.5;

	text-decoration: none;
}


.esi-site-footer .esi-footer__email {
	color: rgba(255, 255, 255, 0.58);

	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;

	text-decoration: none;
}


.esi-site-footer .esi-footer__phone:hover,
.esi-site-footer .esi-footer__email:hover {
	color: var(--esi-red);
}


.esi-site-footer .esi-footer__phone:focus-visible,
.esi-site-footer .esi-footer__email:focus-visible {
	outline: 2px solid var(--esi-red);
	outline-offset: 3px;
}


/* Address */

.esi-footer__address {
	display: flex;
	flex-direction: column;

	margin-top: 25px;

	color: rgba(255, 255, 255, 0.58);

	font-size: 12px;
	font-weight: 400;
	font-style: normal;
	line-height: 1.65;
}


/* =========================================================
   Footer navigation
   ========================================================= */

.esi-footer-menu,
.esi-footer-menu ul {
	margin: 0;
	padding: 0;

	list-style: none;
}


/*
 * Three menu columns beside the brand column.
 */

.esi-footer-menu {
	display: grid;

	/*
	 * Matches the final three tracks of the
	 * V6.1 footer grid.
	 */
	grid-template-columns:
		minmax(0, 1fr)
		minmax(0, .8fr)
		minmax(0, 1.15fr);

	gap: 56px;
}


/* =========================================================
   Primary footer headings
   ========================================================= */

.esi-footer-menu > li > a {
	display: inline-block;

	margin-bottom: 20px;

	color: rgba(255, 255, 255, 0.88);

	font-size: 10.5px;
	font-weight: 700;
	line-height: 1.3;

	letter-spacing: 0.10em;
	text-transform: uppercase;

	text-decoration: none;
}


.esi-footer-menu > li > a:hover {
	color: var(--esi-white);
}


/* =========================================================
   Regular footer links
   ========================================================= */

.esi-footer-menu
> li
> .sub-menu {

	display: flex;
	flex-direction: column;
	align-items: flex-start;

	gap: 8px;
}


.esi-footer-menu
> li
> .sub-menu
> li
> a {

	color: rgba(255, 255, 255, 0.56);

	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.45;

	text-decoration: none;

	transition:
		color var(--esi-transition-fast);
}


.esi-footer-menu
> li
> .sub-menu
> li
> a:hover {

	color: var(--esi-white);
}


/* =========================================================
   Nested footer heading, e.g. FIRE STRATEGIES
   ========================================================= */

.esi-footer-menu
> li
> .sub-menu
> li.menu-item-has-children {

	margin-top: 18px;
}


.esi-footer-menu
> li
> .sub-menu
> li.menu-item-has-children
> a {

	display: inline-block;

	margin-bottom: 13px;

	color: rgba(255, 255, 255, 0.88);

	font-size: 10.5px;
	font-weight: 700;
	line-height: 1.3;

	letter-spacing: 0.10em;
	text-transform: uppercase;

	text-decoration: none;
}


/* Third level */

.esi-footer-menu
.sub-menu
.sub-menu {

	display: flex;
	flex-direction: column;

	gap: 11px;
}


.esi-footer-menu
.sub-menu
.sub-menu
a {

	color: rgba(255, 255, 255, 0.56);

	font-size: 12px;
	font-weight: 400;
	line-height: 1.45;

	text-decoration: none;
}


/* Focus */

.esi-footer-menu a:focus-visible {
	outline: 2px solid var(--esi-red);
	outline-offset: 3px;

	border-radius: 2px;
}


/* =========================================================
   Footer bottom
   ========================================================= */

.esi-footer__bottom-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;

	width: 100%;
	max-width: var(--esi-content-width);

	min-height: 62px;

	margin-inline: auto;
	padding-inline: 0;

	border-top:
		1px solid rgba(255, 255, 255, 0.10);

	box-sizing: border-box;
}


.esi-footer__copyright {
	margin: 0;

	color: rgba(255, 255, 255, 0.38);

	font-size: 10px;
	font-weight: 400;
	line-height: 1.5;
}


/* =========================================================
   Legal navigation
   ========================================================= */

.esi-legal-menu {
	display: flex;
	align-items: center;
	flex-wrap: wrap;

	gap: 20px;

	margin: 0;
	padding: 0;

	list-style: none;
}


.esi-site-footer .esi-legal-menu a {
	color: rgba(255, 255, 255, 0.42);

	font-size: 10px;
	font-weight: 400;

	text-decoration: none;
}


.esi-site-footer .esi-legal-menu a:hover {
	color: var(--esi-white);
}


.esi-site-footer .esi-legal-menu a:focus-visible {
	outline: 2px solid var(--esi-red);
	outline-offset: 3px;
}