/* Footer blocks — front-end blocks.
   Deliberately low-specificity and colour-neutral: the blocks inherit the Avada
   theme's typography and palette rather than fighting it. */

.ezfix-av-block {
	box-sizing: border-box;
	max-width: 100%;
}

.ezfix-av-block p:last-child {
	margin-bottom: 0;
}

/* ---------- B1 reviews ---------- */

.ezfix-av-reviews {
	margin: 0 auto 2.5em;
	padding: 0 15px;
	text-align: center;
}

.ezfix-av-reviews__summary {
	margin: 0 0 1.5em;
	font-size: 1.125em;
	font-weight: 600;
	line-height: 1.5;
}

.ezfix-av-reviews__widget {
	margin: 0 auto 1.5em;
	text-align: initial;
}

.ezfix-av-reviews__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 1.5em;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
}

.ezfix-av-review {
	display: flex;
	flex-direction: column;
	gap: 0.6em;
	padding: 1.4em;
	border: 1px solid rgba(128, 128, 128, 0.28);
	border-radius: 6px;
}

.ezfix-av-review__stars {
	font-size: 1.05em;
	letter-spacing: 0.12em;
	line-height: 1;
	color: #3bcb1a;
}

.ezfix-av-review__text {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1em;
	font-style: normal;
	line-height: 1.6;
	quotes: none;
}

.ezfix-av-review__meta {
	font-size: 0.875em;
	font-style: normal;
	opacity: 0.75;
}

/* One heading in the HTML instead of Avada's responsive pair. The surviving title
   must show at every breakpoint even if a visibility class could not be stripped. */
.fusion-title.ezfix-av-title-single {
	display: block !important;
}

@media (max-width: 640px) {
	.fusion-title.ezfix-av-title-single .fusion-title-heading {
		font-size: 2.25rem;
		line-height: 1.2;
	}
}

/* The review widget mounted server-side. Its own stylesheet handles the cards;
   this only gives the block the same breathing room the section had before. */
.ezfix-av-widget-mounted {
	display: block;
	width: 100%;
	margin: 0 auto 2em;
}

/* The vendor script renders its own copy when it is working. Two widgets on one
   page is worse than either alone, so the mount stands down — see
   assets/js/widget-dedupe.js, which is the only thing that adds this class. */
.ezfix-av-widget-mounted.ezfix-av-widget-dupe,
.ezfix-av-reviews__widget.ezfix-av-widget-dupe {
	display: none !important;
}

/* The widget's markup is a carousel: a flex track with the slides positioned by
   pixel offsets, arrows that its script binds, and each review body clamped to
   four lines behind a "Read more". Mounted without a working slider that reads as
   a broken component — a review cut mid-sentence, controls that do nothing.
   Laying all of them out at once is also the better answer here: a reviewer
   checking this business sees every review without touching anything.

   The widget's own rules are `!important` at two classes deep, so these carry a
   repeated class to outrank them regardless of which stylesheet loads first. */
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-reviews-container,
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-reviews-container-wrapper {
	height: auto !important;
	overflow: visible !important;
}

.ezfix-av-widget-grid .ti-widget.ti-widget .ti-reviews-container-wrapper {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	grid-auto-rows: auto !important;
	align-items: stretch !important;
	gap: 18px !important;
}

.ezfix-av-widget-grid .ti-widget.ti-widget .ti-review-item {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	display: flex !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.ezfix-av-widget-grid .ti-widget.ti-widget .ti-inner {
	flex: 1 1 auto !important;
	height: auto !important;
	min-height: 0 !important;
}

/* Controls with nothing to control, and a "Read more" for text that is already
   fully shown. */
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-controls,
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-controls-line,
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-read-more {
	display: none !important;
}

/* The four-line clamp. The pixel height that comes with it is written inline by
   the widget's own script, which no stylesheet can outrank — widget-grid.js
   removes that part. */
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-review-content,
.ezfix-av-widget-grid .ti-widget.ti-widget .ti-review-text-container {
	display: block !important;
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
	-webkit-line-clamp: unset !important;
}

/* ---------- C1 footer ---------- */

/* The block sits directly inside .fusion-tb-footer, which carries Avada's default
   dark body colour — the light footer text is set on the columns, not the wrapper.
   Inheriting there puts black text on the black footer, so the colour is stated
   outright. Both values are overridable from the settings screen. */
.ezfix-av-footer {
	padding: 1.75em 15px;
	font-size: 0.9375em;
	line-height: 1.7;
	text-align: center;
	color: var(--ezfix-footer-text, rgba(255, 255, 255, 0.75));
}

.ezfix-av-footer a,
.ezfix-av-footer a:visited {
	color: var(--ezfix-footer-link, #ffffff);
}

.ezfix-av-footer a:hover,
.ezfix-av-footer a:focus {
	color: var(--ezfix-footer-link-hover, var(--ezfix-footer-link, #ffffff));
	text-decoration-thickness: 2px;
}

.ezfix-av-footer p {
	margin: 0 0 0.35em;
}

.ezfix-av-footer__identity {
	font-weight: 600;
}

.ezfix-av-footer__legal {
	margin-top: 1em;
	font-size: 0.9em;
	opacity: 0.8;
}

.ezfix-av-footer a {
	text-decoration: underline;
}

/* ---------- C2 About ---------- */

.ezfix-av-about {
	margin: 0 0 2em;
	line-height: 1.7;
}

.ezfix-av-about p {
	margin: 0 0 1em;
}

.ezfix-av-credentials {
	margin: 1.25em 0 0;
	padding: 1.1em 1.4em;
	border-left: 3px solid currentColor;
	list-style: none;
}

.ezfix-av-credentials li {
	margin: 0 0 0.4em;
	font-size: 0.9375em;
}

.ezfix-av-credentials li:last-child {
	margin-bottom: 0;
}

/* ---------- C3 Contact ---------- */

.ezfix-av-contact {
	margin: 0 auto 2.5em;
	padding: 1.5em;
	border: 1px solid rgba(128, 128, 128, 0.28);
	border-radius: 6px;
	line-height: 1.7;
}

.ezfix-av-contact__address {
	margin: 0 0 1em;
	font-style: normal;
}

.ezfix-av-contact__name {
	font-weight: 600;
}

.ezfix-av-contact__notice {
	margin: 0 0 1.25em;
}

.ezfix-av-contact__details {
	display: grid;
	grid-template-columns: minmax(110px, max-content) 1fr;
	gap: 0.35em 1.25em;
	margin: 0;
}

.ezfix-av-contact__details dt {
	font-weight: 600;
}

.ezfix-av-contact__details dd {
	margin: 0;
}

/* ---------- C4 disclaimer ---------- */

.ezfix-av-disclaimer {
	/* Sits either as a block or as a flex item inside a Fusion Builder row —
	   force a full-width line in both cases. */
	flex: 0 0 100%;
	width: 100%;
	margin: 1.5em auto 0;
	padding: 0 15px;
	font-size: 0.875em;
	line-height: 1.6;
	text-align: center;
	opacity: 0.8;
}

.ezfix-av-disclaimer p {
	max-width: 900px;
	margin: 0 auto;
}

/* ---------- C5 warranty ---------- */

.ezfix-av-warranty__heading {
	margin: 0 0 0.8em;
	font-size: 1.9em;
	line-height: 1.2;
}

.ezfix-av-warranty__table {
	width: 100%;
	margin: 0 0 1.5em;
	border-collapse: collapse;
}

.ezfix-av-warranty__table th,
.ezfix-av-warranty__table td {
	padding: 0.75em 1em;
	border-bottom: 1px solid rgba(128, 128, 128, 0.28);
	text-align: left;
	vertical-align: top;
}

.ezfix-av-warranty__table th {
	width: 42%;
	font-weight: 600;
}

@media (max-width: 560px) {
	.ezfix-av-contact__details {
		grid-template-columns: 1fr;
		gap: 0.15em;
	}

	.ezfix-av-contact__details dd {
		margin-bottom: 0.6em;
	}

	.ezfix-av-warranty__table th,
	.ezfix-av-warranty__table td {
		display: block;
		width: auto;
	}

	.ezfix-av-warranty__table th {
		border-bottom: 0;
		padding-bottom: 0;
	}
}

/* ---------- C7 city pages ---------- */

.ezfix-av-city {
	margin: 0 auto 2.5em;
	padding: 0 15px;
	max-width: 46em;
	line-height: 1.75;
}

.ezfix-av-city__heading {
	margin: 0 0 0.7em;
	font-size: 1.6em;
	line-height: 1.25;
}

.ezfix-av-city p {
	margin: 0 0 1.1em;
}

.ezfix-av-city__jobs-heading {
	margin: 1.6em 0 0.6em;
	font-size: 1.15em;
}

.ezfix-av-city__jobs {
	margin: 0;
	padding-inline-start: 1.2em;
}

.ezfix-av-city__jobs li {
	margin-bottom: 0.5em;
}

/* ---------- Columns that swallow clicks ---------- */

/* The theme sets `pointer-events: none` on the content wrapper of any column that
   has an inner background, so that a link covering the whole column stays
   clickable through it. Nothing puts it back for the content, and pointer-events
   inherits — so every link, button and field inside such a column is dead. On the
   home page that is 20 columns and 19 links, the review widget among them.

   Only genuinely interactive elements are switched back on. The wrapper itself
   stays transparent to the pointer, so a whole-column link still works. */
.fusion-column-inner-bg-wrapper .fusion-column-wrapper a,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper button,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper input,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper select,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper textarea,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper label,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper summary,
.fusion-column-inner-bg-wrapper .fusion-column-wrapper [role="button"],
.fusion-column-inner-bg-wrapper .fusion-column-wrapper [tabindex],
.fusion-column-inner-bg-wrapper .fusion-column-wrapper .ezfix-av-widget-mounted {
	pointer-events: auto;
}

/* ---------- Oversized embeds ---------- */

/* The contact map is declared width="600" height="450" inside a half-width column,
   so it spills over the text beside it. Nothing here shrinks a well-sized embed. */
.fusion-layout-column iframe,
.fusion-column-wrapper iframe,
.fusion-text iframe {
	max-width: 100%;
}

/* A map should fill its column, not sit at whatever pixel width was hard-coded
   years ago and leave a ragged gap beside it. */
.fusion-layout-column iframe[src*="google.com/maps"],
.fusion-layout-column iframe[src*="maps.google"],
.fusion-column-wrapper iframe[src*="google.com/maps"],
.fusion-column-wrapper iframe[src*="maps.google"] {
	display: block;
	width: 100%;
	border: 0;
}

/* On a phone the column is full width, and 450px of map pushes everything else
   below the fold. */
@media (max-width: 782px) {
	.fusion-layout-column iframe[src*="google.com/maps"],
	.fusion-layout-column iframe[src*="maps.google"],
	.fusion-column-wrapper iframe[src*="google.com/maps"],
	.fusion-column-wrapper iframe[src*="maps.google"] {
		height: 320px;
	}
}
