/*
 * 1.0.313: Business listings are one flat area, the same rule the Showcase
 * profiles already follow.
 *
 * The page stacked framed panels inside a framed column: the hero, the tab
 * bar, each section and each item inside a section (location, contact
 * method) had its own fill and border, and the main and side columns were
 * painted #0d2040 too (public-coherence-297 line 79 out-ranks the
 * "transparent" rule at line 89), which showed as filler strips in the
 * gaps. Now sections sit directly on the page background, separated by a
 * hairline; items inside a section are rows divided the same way; the side
 * column is divided from the main column by a vertical hairline.
 * Repeated items keep their own shape: chips, buttons, the logo tile and
 * the related-partner cards.
 *
 * Loaded last. The :not() chain is a specificity boost so this layer
 * outranks the earlier !important profile layers (297/298/303/304) and the
 * 1.0.308 phone bands, whose 16px side gutters are deliberately kept.
 */
.tla-ph-basic-public-listing { --tla-fl-line: rgba(10, 0, 50, .1); --tla-fl-bg: var(--tla-ph-bg, #f7f7fc); }
body.tla-ph-public-dark-page .tla-ph-basic-public-listing,
html[data-tla-theme="dark"] .tla-ph-basic-public-listing { --tla-fl-line: rgba(150, 190, 240, .17); --tla-fl-bg: #050d20; }

/* No fill, no frame. (Class-only list, so the line rules below, written at
   the same specificity, win by order.) */
html body .tla-ph-basic-public-listing :is(
	.tla-ph-basic-listing-hero, .tla-ph-profile-section, .tla-ph-profile-section-content, .tla-ph-basic-location-summary,
	.tla-ph-locked-feature, .tla-ph-basic-opening-hours, .tla-ph-member-discount-card, .tla-ph-profile-sidebar-card,
	.tla-ph-basic-contact-line, .tla-ph-related-searches, .tla-ph-related-partners
):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid > :is(main, aside):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* Hero: no panel; content aligns with the sections below. */
html body .tla-ph-basic-public-listing .tla-ph-basic-listing-hero:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	padding-top: 8px !important;
	padding-bottom: 24px !important;
}

/* Tab bar: a sticky strip with one line under it (it needs the page colour behind it while sticky). */
html body .tla-ph-basic-public-listing .tla-ph-profile-anchor-nav:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: var(--tla-fl-bg) !important;
	border: 0 !important;
	border-bottom: 1px solid var(--tla-fl-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/* Columns stack their sections with no gap; the lines do the separating. */
html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid > :is(main, aside):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	gap: 0 !important;
	row-gap: 0 !important;
}

/* Sections: space above and below, a line between them. */
html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid .tla-ph-profile-section:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 32px !important;
	padding-bottom: 32px !important;
}
html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid .tla-ph-profile-section + .tla-ph-profile-section:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
}

/* Items inside a section are rows. */
html body .tla-ph-basic-public-listing :is(.tla-ph-basic-location-summary, .tla-ph-locked-feature, .tla-ph-basic-opening-hours):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding: 18px 0 !important;
}

/* Side column: the member offer, then the contact list. */
html body .tla-ph-basic-public-listing .tla-ph-member-discount-card:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-bottom: 1px solid var(--tla-fl-line) !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 32px !important;
	padding-bottom: 24px !important;
}
html body .tla-ph-basic-public-listing .tla-ph-profile-sidebar-card:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 24px !important;
	padding-bottom: 8px !important;
}
html body .tla-ph-basic-public-listing .tla-ph-basic-contact-line:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
	padding: 14px 0 !important;
}
html body .tla-ph-basic-public-listing a.tla-ph-basic-contact-line:hover:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
}

/* Related services and nearby partners: their own sections under a line. */
html body .tla-ph-basic-public-listing :is(.tla-ph-related-searches, .tla-ph-related-partners):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
	margin-top: 24px !important;
	padding-top: 36px !important;
	padding-bottom: 36px !important;
}

/* Desktop and tablet: content runs to the container edge; the side column gets a vertical line. */
@media (min-width: 768px) {
	html body .tla-ph-basic-public-listing :is(.tla-ph-basic-listing-hero, .tla-ph-profile-anchor-nav, .tla-ph-basic-listing-grid .tla-ph-profile-section, .tla-ph-member-discount-card, .tla-ph-profile-sidebar-card, .tla-ph-related-searches, .tla-ph-related-partners):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}
@media (min-width: 901px) {
	html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		column-gap: 48px !important;
	}
	html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid > aside:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		border-left: 1px solid var(--tla-fl-line) !important;
		padding-left: 32px !important;
	}
}
/* Stacked (900px and below): the side column follows the main one under a line. */
@media (max-width: 900px) {
	html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid > aside:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		border-top: 1px solid var(--tla-fl-line) !important;
	}
	html body .tla-ph-basic-public-listing .tla-ph-member-discount-card:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		padding-top: 24px !important;
	}
}
/* Phones: the side column's panels are 1.0.308 full-width bands, so the line
   goes on the first band (edge to edge) rather than the inset column. */
@media (max-width: 767px) {
	html body .tla-ph-basic-public-listing .tla-ph-basic-listing-grid > aside:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		border-top: 0 !important;
	}
	html body .tla-ph-basic-public-listing .tla-ph-member-discount-card:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		border-top: 1px solid var(--tla-fl-line) !important;
	}
}

/* =====================================================================
 * 1.0.314: the same rule for the agency profile template
 * (.tla-ph-profile-experience: Verified and Partner letting agents, and any
 * profile if the classic design is switched back on).
 *
 * That template was light: white hero body, tab bar, service, location,
 * department and sidebar cards on the dark public page. On public pages it
 * now matches the Business listings: dark, flat, sections and rows divided
 * by lines. The cover image, logo tile, map, team cards, chips and buttons
 * keep their shape. In the private workspace preview (light) it is flat too.
 * ===================================================================== */
.tla-ph-profile-experience { --tla-fl-line: rgba(10, 0, 50, .1); --tla-fl-bg: var(--tla-ph-bg, #f7f7fc); }
body.tla-ph-public-dark-page .tla-ph-profile-experience { --tla-fl-line: rgba(150, 190, 240, .17); --tla-fl-bg: #050d20; }

/* No fill, no frame: panels (class list) ... */
html body .tla-ph-profile-experience :is(
	.tla-ph-profile-hero-body, .tla-ph-profile-section, .tla-ph-profile-metrics-grid, .tla-ph-profile-specialisms,
	.tla-ph-service-detail, .tla-ph-service-detail-body, .tla-ph-member-discount-card, .tla-ph-inquiry-card,
	.tla-ph-opening-hours-card, .tla-ph-profile-assurance-card, .tla-ph-trust-stats-card, .tla-ph-related-searches,
	.tla-ph-contact-line, .tla-ph-phone-reveal
):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
/* ... and the columns and list items (element selectors). */
html body .tla-ph-profile-experience :is(
	.tla-ph-profile-page-grid > main, .tla-ph-profile-page-grid > aside, .tla-ph-credential-grid > article,
	.tla-ph-location-list > article, .tla-ph-contact-area-grid > details, .tla-ph-contact-area-grid > details > div
):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* Tab bar: sticky strip, one line under it. */
html body .tla-ph-profile-experience .tla-ph-profile-anchor-nav:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: var(--tla-fl-bg) !important;
	border: 0 !important;
	border-bottom: 1px solid var(--tla-fl-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	backdrop-filter: none !important;
}

/* Sections: space and a line between them. */
html body .tla-ph-profile-experience .tla-ph-profile-page-grid .tla-ph-profile-section:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 32px !important;
	padding-bottom: 32px !important;
}
html body .tla-ph-profile-experience .tla-ph-profile-page-grid .tla-ph-profile-section + .tla-ph-profile-section:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
}
html body .tla-ph-profile-experience .tla-ph-profile-page-grid > :is(main, aside):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	gap: 0 !important;
	row-gap: 0 !important;
}

/* Items inside sections are rows: services, credentials, locations, departments. */
html body .tla-ph-profile-experience :is(.tla-ph-capability-grid, .tla-ph-credential-grid, .tla-ph-contact-area-grid):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	display: block !important;
}
html body .tla-ph-profile-experience .tla-ph-service-detail:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
	margin: 0 !important;
}
/* One extra :not() so this outranks the element reset above. */
html body .tla-ph-profile-experience :is(.tla-ph-credential-grid > article, .tla-ph-location-list > article, .tla-ph-contact-area-grid > details):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d):not(.tla-fl-e) {
	border-top: 1px solid var(--tla-fl-line) !important;
	margin: 0 !important;
	padding: 16px 0 !important;
}
html body .tla-ph-profile-experience :is(.tla-ph-service-detail summary, .tla-ph-contact-area-grid > details > summary, .tla-ph-service-detail-body, .tla-ph-profile-metrics-grid):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Side column: offer, contact, hours, assurance, response time, divided by lines. */
html body .tla-ph-profile-experience :is(.tla-ph-member-discount-card, .tla-ph-inquiry-card, .tla-ph-opening-hours-card, .tla-ph-profile-assurance-card, .tla-ph-trust-stats-card):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-bottom: 1px solid var(--tla-fl-line) !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 24px !important;
	padding-bottom: 24px !important;
}
html body .tla-ph-profile-experience .tla-ph-profile-page-grid > aside > :last-child:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d):not(.tla-fl-e) {
	border-bottom: 0 !important;
}
html body .tla-ph-profile-experience :is(.tla-ph-contact-line, .tla-ph-phone-reveal):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Related services: its own section under a line. */
html body .tla-ph-profile-experience .tla-ph-related-searches:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	border-top: 1px solid var(--tla-fl-line) !important;
	margin-top: 24px !important;
	padding-top: 36px !important;
	padding-bottom: 36px !important;
}

@media (min-width: 768px) {
	html body .tla-ph-profile-experience :is(.tla-ph-profile-page-grid .tla-ph-profile-section, .tla-ph-member-discount-card, .tla-ph-inquiry-card, .tla-ph-opening-hours-card, .tla-ph-profile-assurance-card, .tla-ph-trust-stats-card):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}
@media (min-width: 901px) {
	html body .tla-ph-profile-experience .tla-ph-profile-page-grid:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		column-gap: 48px !important;
	}
	html body .tla-ph-profile-experience .tla-ph-profile-page-grid > aside:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d):not(.tla-fl-e) {
		border-left: 1px solid var(--tla-fl-line) !important;
		padding-left: 32px !important;
	}
}
@media (max-width: 900px) {
	html body .tla-ph-profile-experience .tla-ph-member-discount-card:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		border-top: 1px solid var(--tla-fl-line) !important;
	}
}

/* Public pages are dark: text, tabs, chips and buttons to match the Business listings. */
html body.tla-ph-public-dark-page .tla-ph-profile-experience:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	color: #cbdcf1 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience :is(.tla-ph-profile-hero, .tla-ph-profile-hero-body):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background-color: transparent !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience :is(h1, h2, h3, h4, strong, summary):not(.tla-ph-profile-cover *):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	color: #fff !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience :is(p, li, small, .tla-ph-profile-tagline):not(.tla-ph-profile-cover *):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	color: #cbdcf1 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience .tla-ph-section-heading span:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	color: #38bdf8 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience .tla-ph-profile-anchor-nav a:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	border-color: transparent !important;
	color: #a9d7f7 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience .tla-ph-profile-anchor-nav a:is(:hover, .is-active):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: #1b3b62 !important;
	color: #fff !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience :is(.tla-ph-profile-meta-row > span, .tla-ph-specialism-pills span, .tla-ph-coverage-pills span, .tla-ph-member-discount-code, .tla-ph-frontend-pill):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: #152845 !important;
	border: 1px solid #2a4971 !important;
	color: #dbeaff !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience :is(.tla-ph-service-icon, .tla-ph-trust-icon, .tla-ph-profile-assurance-icon, .tla-ph-credential-grid article > span, .tla-ph-location-list article > span):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: rgba(56, 189, 248, .12) !important;
	color: #5cc8f2 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience a.tla-ph-frontend-button-primary:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: linear-gradient(135deg, #0a63d6, #0a90f6) !important;
	border-color: transparent !important;
	color: #fff !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience a.tla-ph-frontend-button-secondary:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: transparent !important;
	border: 1px solid #2f5a88 !important;
	color: #a9d7f7 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience :is(.tla-ph-contact-line, .tla-ph-phone-reveal a, .tla-ph-service-detail-body a):not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	color: #a9d7f7 !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience .tla-ph-premium-team-grid article:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: #0f2341 !important;
	border: 1px solid #2f517b !important;
}
html body.tla-ph-public-dark-page .tla-ph-profile-experience .tla-ph-profile-service-actions a:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
	background: #0d1d39 !important;
	border: 1px solid #2a4971 !important;
	color: #a9d7f7 !important;
}

/* Phones: the template inset its page grid unevenly (26px left, 2px right),
   which pushed the 1.0.308 full-width bands 12px off centre. */
@media (max-width: 767px) {
	html body .tla-ph-profile-experience:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	html body .tla-ph-profile-experience .tla-ph-profile-page-grid:not(.tla-fl-a):not(.tla-fl-b):not(.tla-fl-c):not(.tla-fl-d) {
		margin-left: 0 !important;
		margin-right: 0 !important;
		max-width: none !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		width: auto !important;
	}
}