/**
 * Unley Road: the things theme.json cannot express.
 *
 * Loaded after the parent (agend-base) stylesheet. Colour, type and spacing
 * values come from the theme.json presets so they can be retuned in the Site
 * Editor; what lives here is structure and state for this theme's bands, the
 * header and footer, the editorial cards and the skin over the Agend Directory
 * catalogue. Source of truth for the look: the Unley Road prototype (home); the
 * interior pages live in interior.css.
 *
 * Class prefix: ur- (Unley Road). Bands: .ur-band. Cards: .ur-*-card.
 */

/* ---------- Tokens the presets do not carry ---------- */

:root {
	--ur-ease: cubic-bezier(0.2, 0, 0, 1);
	--ur-spring: cubic-bezier(0.34, 1.42, 0.64, 1);
	--ur-shadow-card: 0 2px 10px rgba(26, 24, 20, 0.07);
	--ur-shadow-lift: 0 10px 22px rgba(22, 64, 138, 0.16);
	--ur-shadow-poster: 0 18px 40px rgba(26, 24, 20, 0.22);
	--ur-ink-meta: #6F665B;
}

/* ---------- Corrections to parent defaults ---------- */

/* The parent gives every button a trailing arrow; Unley pills have none. */
.wp-block-button:not(.is-style-agend-link):not(.is-style-unley-arrow-link) .wp-block-button__link::after {
	content: none;
}

/* Pills: 44px touch target, medium weight, no tracking. */
.wp-block-button__link {
	min-height: 44px;
	font-weight: 500;
	letter-spacing: 0.01em;
	transition: background-color 200ms var(--ur-ease), color 200ms var(--ur-ease), border-color 200ms var(--ur-ease), transform 200ms var(--ur-ease), box-shadow 200ms var(--ur-ease);
}

/* Outline, ink. */
.wp-block-button.is-style-unley-outline .wp-block-button__link {
	background: transparent;
	border: 1px solid var(--wp--preset--color--ink);
	color: var(--wp--preset--color--ink);
}
.wp-block-button.is-style-unley-outline .wp-block-button__link:hover,
.wp-block-button.is-style-unley-outline .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--sunken);
}

/* Outline, navy. */
.wp-block-button.is-style-unley-outline-navy .wp-block-button__link {
	background: transparent;
	border: 1px solid var(--wp--preset--color--brand);
	color: var(--wp--preset--color--brand);
}
.wp-block-button.is-style-unley-outline-navy .wp-block-button__link:hover,
.wp-block-button.is-style-unley-outline-navy .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--on-ink);
}

/* Paper: the "Learn more" treatment on the paper band. */
.wp-block-button.is-style-unley-paper .wp-block-button__link {
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--ink);
	color: var(--wp--preset--color--ink);
}
.wp-block-button.is-style-unley-paper .wp-block-button__link:hover,
.wp-block-button.is-style-unley-paper .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
}

/* Text link with arrow: "All stories". Display type, tracked caps, navy. */
.wp-block-button.is-style-unley-arrow-link .wp-block-button__link {
	gap: 10px;
	padding: 10px 16px;
	background: transparent;
	border: 1px solid transparent;
	color: var(--wp--preset--color--brand);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 18px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.wp-block-button.is-style-unley-arrow-link .wp-block-button__link::after {
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 260ms var(--ur-spring);
}
.wp-block-button.is-style-unley-arrow-link .wp-block-button__link:hover {
	background: #E6E9EF;
}
.wp-block-button.is-style-unley-arrow-link .wp-block-button__link:hover::after {
	transform: translateX(6px);
}

/* Eyebrow: the parent's style, in Unley's terracotta caps. */
.is-style-agend-eyebrow {
	margin-bottom: 0;
	color: var(--wp--preset--color--action);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--meta);
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.is-style-agend-eyebrow.ur-eyebrow--display {
	font-family: var(--wp--preset--font-family--display);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.08em;
}

/* Focus. */
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--brand);
	outline-offset: 3px;
}

/* Selection. */
::selection {
	background: var(--wp--preset--color--action-wash);
	color: var(--wp--preset--color--ink);
}

/* ---------- Type helpers ---------- */

/* One word of a heading drawn as an outline. */
.ur-outline {
	color: var(--wp--preset--color--brand);
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: 1.25px var(--wp--preset--color--brand);
	white-space: nowrap;
}
.ur-outline--ink {
	color: var(--wp--preset--color--ink);
	-webkit-text-stroke-color: var(--wp--preset--color--ink);
}
/* The Turning Hour band takes each time of day's colour (design export). */
.ur-turning[data-ur-period="morning"] { background: #EDF1F5; }
.ur-turning[data-ur-period="afternoon"] { background: #F6E7D9; }
.ur-turning {
	transition: background-color 400ms var(--ur-ease);
}
.ur-outline--lilac {
	color: #4C4A8F;
	-webkit-text-stroke-color: #4C4A8F;
}
.ur-outline--white {
	color: var(--wp--preset--color--on-ink);
	-webkit-text-stroke-color: var(--wp--preset--color--on-ink);
}

/* Section titles: display 600, ink, balanced. */
.wp-block-heading.is-style-unley-section-title {
	margin: 0;
	color: var(--wp--preset--color--ink);
	font-size: clamp(32px, 4.4vw, 46px);
	font-weight: 600;
	line-height: 1.02;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	text-wrap: balance;
}

/* Muted body copy. */
.ur-muted {
	color: var(--wp--preset--color--ink-subtle);
}
.ur-lede {
	font-size: 16.5px;
	line-height: 1.65;
	color: var(--wp--preset--color--ink-subtle);
}

/* ---------- Bands ---------- */

.ur-band {
	padding-block: var(--wp--custom--band-padding);
}
.ur-band--tight {
	padding-block: 48px;
}
.ur-band--white { background: var(--wp--preset--color--surface); }
.ur-band--paper { background: var(--wp--preset--color--paper); }
.ur-band--sand { background: var(--wp--preset--color--sunken); }
.ur-band--lilac { background: var(--wp--preset--color--lilac); }
.ur-band--navy {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--on-ink);
}

/* Band header: title left, control right, wraps on small screens. */
.ur-band-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 28px;
}
.ur-band-head > * {
	margin: 0;
}
.ur-band-head--center {
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.ur-band-head--center .is-style-unley-section-title {
	text-align: center;
}

/* Centred call to action below a grid. */
.ur-band-cta {
	display: flex;
	justify-content: center;
	margin-top: 36px;
}
.ur-band-cta .wp-block-buttons {
	justify-content: center;
}

/* ---------- Header ---------- */

.ur-header {
	position: relative;
	z-index: 100;
	background: var(--wp--preset--color--surface);
	/* The prototype header has no rule at the top of the page; a shadow
	   appears once the page scrolls (theme.js adds .is-scrolled). */
	transition: box-shadow 320ms var(--ur-ease);
}
.wp-block-template-part.is-scrolled .ur-header {
	box-shadow: 0 8px 22px rgba(26, 24, 20, 0.08);
}
.ur-header__bar {
	display: flex;
	align-items: center;
	gap: 20px;
	min-height: var(--wp--custom--header-height);
}

/* Wordmark: navy tile plus name. */
.ur-wordmark {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	white-space: nowrap;
}
.ur-wordmark__tile {
	display: inline-grid;
	place-items: center;
	flex: 0 0 32px;
	width: 32px;
	height: 32px;
	border-radius: 7px;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--on-ink);
	font-weight: 700;
}
.ur-wordmark a {
	color: inherit;
	text-decoration: none;
}

/* Neighbourhood: the mega menu item drawn as an outlined pill. */
.ur-neighbourhood .wp-block-navigation__container {
	gap: 0;
}
.ur-neighbourhood .wp-block-agend-mega-menu {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 38px;
	padding: 0 18px;
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	color: var(--wp--preset--color--brand);
	background: var(--wp--preset--color--surface);
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	transition: background-color 200ms var(--ur-ease), color 200ms var(--ur-ease);
}
.ur-neighbourhood .wp-block-agend-mega-menu:hover,
.ur-neighbourhood .wp-block-agend-mega-menu:focus-within {
	background: var(--wp--preset--color--navy-tint);
}
.ur-neighbourhood .wp-block-agend-mega-menu .wp-block-navigation-item__content {
	padding: 0;
	color: inherit;
}
.ur-neighbourhood .wp-block-agend-mega-menu .agend-mega__toggle {
	color: inherit;
}
.ur-neighbourhood .agend-mega__panel {
	font-family: var(--wp--preset--font-family--body);
	text-transform: none;
	letter-spacing: 0;
}

/* Primary nav: display caps with a terracotta underline on hover. */
.ur-header__nav {
	margin-left: auto;
}
.ur-header__nav .wp-block-navigation-item__content {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 10px;
	text-decoration: none;
}
.ur-header__nav .wp-block-navigation__container {
	gap: 10px;
}
.ur-header__nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 10px;
	height: 2px;
	background: var(--wp--preset--color--action);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 200ms var(--ur-ease);
}
.ur-header__nav .wp-block-navigation-item__content:hover::after,
.ur-header__nav .current-menu-item > .wp-block-navigation-item__content::after {
	transform: scaleX(1);
}
.ur-header__nav .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--brand);
}

/* Actions: search, list-your-business, socials. */
.ur-header__actions {
	display: flex;
	align-items: center;
	gap: 8px;
}
.ur-header__actions .wp-block-button__link {
	min-height: 40px;
	padding: 8px 16px;
	font-size: 14px;
}
/* Search: the icon toggles a panel that drops below the header, as in the
   design; the menu never moves. Without JS the icon is a link to /?s=. */
.ur-search-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 8px;
	color: var(--wp--preset--color--ink);
	transition: background-color 240ms var(--ur-ease), color 240ms var(--ur-ease);
}
.ur-search-toggle:hover,
.ur-search-toggle[aria-expanded="true"] {
	background: #E6E9EF;
	color: var(--wp--preset--color--brand);
}
.ur-header > .ur-searchpanel {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 80;
	margin: 0;
	padding-block: 14px 18px;
	background: var(--wp--preset--color--surface);
	box-shadow: 0 16px 28px -14px rgba(15, 14, 10, 0.18);
}
.ur-header:not(.is-search-open) > .ur-searchpanel {
	display: none;
}
.ur-searchpanel__form .wp-block-search__inside-wrapper {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 56px;
	padding: 0 8px 0 18px !important;
	border: 1px solid var(--wp--preset--color--border) !important;
	border-radius: 999px;
	background: #fff;
}
.ur-searchpanel__form .wp-block-search__inside-wrapper::before {
	content: "";
	flex: none;
	width: 22px;
	height: 22px;
	background: var(--wp--preset--color--ink);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ur-searchpanel__form .wp-block-search__input {
	flex: 1;
	min-width: 0;
	height: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: 17px;
	color: var(--wp--preset--color--ink);
}
.ur-searchpanel__form .wp-block-search__input:focus {
	outline: none;
}
.ur-searchpanel__form .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--wp--preset--color--brand) !important;
	box-shadow: 0 0 0 3px rgba(22, 64, 138, 0.15);
}
.ur-searchpanel__form .wp-block-search__button {
	flex: none;
	height: 42px;
	margin: 0;
	padding: 0 22px;
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	background: var(--wp--preset--color--brand);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}
.editor-styles-wrapper .ur-header > .ur-searchpanel {
	position: static;
	display: block;
	box-shadow: none;
}
.ur-social {
	display: inline-flex;
	align-items: center;
	gap: 12px;
}
.ur-social__divider {
	flex: none;
	width: 1px;
	height: 26px;
	background: var(--wp--preset--color--border);
}
.ur-social a,
.ur-social-icon {
	position: relative;
	isolation: isolate;
	display: inline-grid;
	place-items: center;
	width: 40px;
	height: 40px;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	transition: color 240ms var(--ur-ease);
}
.ur-social a::before,
.ur-social-icon::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--wp--preset--color--brand);
	transform: scale(0);
	transition: transform 280ms var(--ur-spring);
}
.ur-social a:hover::before,
.ur-social-icon:hover::before {
	transform: scale(1);
}
.ur-social a:hover,
.ur-social-icon:hover {
	color: var(--wp--preset--color--on-ink);
}
.ur-social svg,
.ur-social-icon svg {
	width: 18px;
	height: 18px;
}
.ur-social-icon--navy {
	width: 44px;
	height: 44px;
	border-color: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--brand);
}

/* Tablet and phone (design: below 1180px). The row keeps the wordmark, the
   search icon and a menu button; the Neighbourhood pill, the page links and
   the social icons move into the menu panel below the header. */
.ur-menu-toggle,
.ur-mobilemenu {
	display: none;
}
@media (max-width: 1180px) {
	.ur-header__bar {
		gap: 12px;
	}
	.ur-header__bar > .ur-neighbourhood,
	.ur-header__bar > .ur-header__nav,
	.ur-header__actions .ur-header__list-business,
	.ur-header__actions .ur-social,
	.ur-header__actions .ur-social__divider {
		display: none;
	}
	.ur-header__actions {
		margin-left: auto;
		gap: 4px;
	}
	.ur-menu-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		border-radius: 8px;
		color: var(--wp--preset--color--ink);
	}
	.ur-menu-toggle[aria-expanded="true"] {
		color: var(--wp--preset--color--brand);
	}
	.ur-header.is-menu-open > .ur-mobilemenu,
	.ur-mobilemenu:target {
		display: flex;
	}
}
.ur-header > .ur-mobilemenu {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 94;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 8px 0 12px;
	background: var(--wp--preset--color--surface);
	box-shadow: 0 16px 28px -14px rgba(15, 14, 10, 0.18);
}
/* With JS the panel fills the screen below the header and scrolls itself
   (theme.js sets --ur-menu-top to the header's bottom edge). */
.ur-header.is-menu-open > .ur-mobilemenu {
	position: fixed;
	top: var(--ur-menu-top, 72px);
	bottom: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	animation: ur-menu-in 180ms var(--ur-ease);
}
@keyframes ur-menu-in {
	from { opacity: 0; transform: translateY(-6px); }
	to { opacity: 1; transform: none; }
}
html.ur-menu-lock {
	overflow: hidden;
}
.ur-mobilemenu > * {
	margin-block: 0 !important;
}
.ur-mobilemenu__neigh,
.ur-mobilemenu__nav .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 14px 24px;
	border: 0;
	border-bottom: 1px solid #F1EADD;
	background: transparent;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0.03em;
	line-height: 1.1;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}
.ur-mobilemenu__neigh {
	gap: 10px;
	min-height: 52px;
}
.ur-mobilemenu__neigh[aria-expanded="true"] {
	color: var(--wp--preset--color--brand);
}
.ur-mobilemenu__arrow {
	flex: none;
	transition: transform 220ms var(--ur-ease);
}
.ur-mobilemenu__neigh[aria-expanded="true"] .ur-mobilemenu__arrow {
	transform: rotate(180deg);
}
.ur-mobilemenu__neighpanel {
	padding: 2px 24px 14px;
	text-align: center;
}
.ur-mobilemenu__neighpanel .wp-block-columns {
	flex-direction: column;
	gap: 16px;
}
.ur-mobilemenu__neighpanel .wp-block-column {
	flex-basis: auto !important;
}
.ur-mobilemenu__neighpanel .wp-block-buttons {
	justify-content: center;
}
.ur-mobilemenu__neighpanel .agend-mega-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.ur-mobilemenu__neighpanel .agend-mega-list li + li {
	margin-top: 10px;
}
.ur-mobilemenu__neighpanel .agend-mega-list a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.ur-mobilemenu__neighpanel .agend-mega-list a:hover {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
}
.ur-mobilemenu__nav,
.ur-mobilemenu__nav .wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	width: 100%;
}
.ur-mobilemenu__nav .wp-block-navigation-item {
	width: 100%;
}
.ur-mobilemenu__nav .wp-block-navigation-item__content {
	gap: 14px;
	min-height: 56px;
}
.ur-mobilemenu__icon {
	flex: none;
	display: inline-flex;
	color: var(--wp--preset--color--brand);
}
.ur-mobilemenu__nav .current-menu-item > .wp-block-navigation-item__content,
.ur-mobilemenu__nav .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--brand);
}
.ur-mobilemenu__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: auto !important;
	padding: 22px 20px 8px;
}
.ur-mobilemenu__login {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	padding: 0 20px;
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	background: #fff;
	color: var(--wp--preset--color--brand);
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 240ms var(--ur-ease), color 240ms var(--ur-ease);
}
.ur-mobilemenu__login:hover {
	background: var(--wp--preset--color--brand);
	color: #fff;
}
.ur-mobilemenu__foot .ur-social a {
	width: 44px;
	height: 44px;
}

/* ---------- Home hero ---------- */

.ur-hero {
	padding-block: clamp(60px, 9vh, 96px) clamp(36px, 5vh, 52px);
	background: var(--wp--preset--color--surface);
	text-align: center;
}
.ur-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
}
.ur-hero__title {
	margin: 0;
	color: var(--wp--preset--color--brand);
	font-size: clamp(64px, 9vw, 100px);
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	text-wrap: balance;
}
.ur-hero__title .ur-outline {
	-webkit-text-stroke-width: 2px;
}
.ur-hero__intro {
	max-width: 930px;
	margin: 0;
	color: var(--wp--preset--color--brand-soft);
	font-size: 18px;
	line-height: 1.6;
	text-wrap: pretty;
}

/* Mega search: the pill search across the whole content width. It is the core
   Search block, pointed at the Discover page by the pattern. */
.ur-hero__search.wp-block-search {
	width: 100%;
	max-width: none;
}
.ur-hero__search .wp-block-search__inside-wrapper {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 60px;
	padding: 0 9px 0 20px !important;
	border: 1px solid var(--wp--preset--color--border) !important;
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	transition: border-color 200ms var(--ur-ease);
}
.ur-hero__search .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--wp--preset--color--brand) !important;
}
.ur-hero__search .wp-block-search__input {
	flex: 1 1 0;
	min-width: 0;
	height: 100%;
	padding: 0;
	border: 0 !important;
	background: transparent;
	font-size: 17px;
	color: var(--wp--preset--color--ink);
	outline: none;
}
.ur-hero__search .wp-block-search__button {
	flex: 0 0 auto;
	height: 44px;
	margin: 0;
	padding: 0 24px;
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--on-ink);
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: background-color 200ms var(--ur-ease);
}
.ur-hero__search .wp-block-search__button:hover {
	background: var(--wp--preset--color--brand-soft);
}

/* ---------- Promo ticket ---------- */

.ur-promo {
	padding-block: 0 72px;
	/* The ticket notches sit half outside the ticket; clip them at the band
	   edge so they never widen the page on phones. */
	overflow-x: clip;
}
.ur-promo__link {
	display: block;
	border-radius: 16px;
	text-decoration: none;
	transition: transform 240ms var(--ur-spring);
}
.ur-promo__link:hover {
	transform: translateY(-4px);
}
.ur-promo__ticket {
	position: relative;
	border: 1.6px dashed #6E8FC4;
	border-radius: 14px;
	background: var(--wp--preset--color--brand);
	transition: box-shadow 240ms var(--ur-ease);
}
.ur-promo__link:hover .ur-promo__ticket {
	box-shadow: 0 16px 30px rgba(22, 64, 138, 0.16);
}
.ur-promo__ticket::before,
.ur-promo__ticket::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--wp--preset--color--surface);
	transform: translateY(-50%);
}
.ur-promo__ticket::before { left: -14px; }
.ur-promo__ticket::after { right: -14px; }
.ur-promo__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 24px;
	max-width: 1100px;
	margin: 0 auto;
	padding: clamp(42px, 5.5vw, 60px) 32px clamp(30px, 5vw, 52px);
	text-align: center;
}
.ur-promo__title {
	margin: 0;
	color: var(--wp--preset--color--on-ink);
	font-size: clamp(38px, 7vw, 82px);
	font-weight: 700;
	line-height: 0.88;
	letter-spacing: 0.01em;
	text-transform: uppercase;
}
.ur-promo__stamp {
	display: inline-flex;
	align-items: center;
	gap: clamp(10px, 1.4vw, 16px);
	padding: clamp(8px, 1.4vw, 14px) clamp(16px, 2.2vw, 26px);
	border: 1.5px dashed #C2D2E8;
	border-radius: 8px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--brand);
	font-family: var(--wp--preset--font-family--display);
	text-transform: uppercase;
}
.ur-promo__stamp-big {
	font-size: clamp(28px, 4.8vw, 54px);
	font-weight: 700;
	line-height: 0.88;
	letter-spacing: 0.01em;
}
.ur-promo__stamp-small {
	font-size: clamp(13px, 1.5vw, 19px);
	font-weight: 600;
	line-height: 1.02;
	letter-spacing: 0.05em;
	text-align: left;
}
.ur-promo__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	width: 100%;
	margin-top: 4px;
	color: var(--wp--preset--color--on-ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.ur-promo__cta::after {
	content: "";
	width: 20px;
	height: 20px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 240ms var(--ur-spring);
}
.ur-promo__link:hover .ur-promo__cta::after {
	transform: translateX(6px);
}

/* ---------- Turning Hour ---------- */

.ur-turning .ur-band-head p {
	max-width: 640px;
	margin: 10px 0 0;
	color: var(--wp--preset--color--ink-subtle);
}
.ur-tabs {
	position: relative;
	display: inline-flex;
	padding: 4px;
	border-radius: 999px;
	background: rgba(26, 24, 20, 0.08);
	box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.16);
}
.ur-tabs__button {
	position: relative;
	z-index: 1;
	width: var(--ur-seg-w, 124px);
	height: 40px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #8A8275;
	font-family: var(--wp--preset--font-family--display);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	cursor: pointer;
	transition: color 300ms, background-color 300ms;
}
.ur-tabs__button[aria-selected="true"] {
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--paper);
	box-shadow: 0 2px 6px rgba(26, 24, 20, 0.18);
}
.ur-turning__panel[hidden] {
	display: none;
}
.ur-turning__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 32px;
	margin-top: 40px;
}
.ur-hour-card {
	display: block;
	color: inherit;
	text-decoration: none;
}
.ur-hour-card__media {
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--surface);
}
.ur-hour-card__media img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	transition: transform 400ms var(--ur-ease);
}
.ur-hour-card:hover .ur-hour-card__media img {
	transform: scale(1.03);
}
.ur-hour-card:hover .ur-hour-card__media {
	box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 5px rgba(22, 64, 138, 0.4);
}
.ur-hour-card__body {
	padding-top: 16px;
}
.ur-hour-card__body .is-style-agend-eyebrow {
	margin-bottom: 8px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--brand);
}
.ur-hour-card__body h3 {
	margin: 0;
	font-size: 24px;
	line-height: 1.2;
	color: var(--wp--preset--color--ink);
}
.ur-hour-card:hover h3 {
	color: var(--wp--preset--color--brand);
	text-decoration: underline;
	text-underline-offset: 4px;
}
.ur-hour-card__body p:last-child {
	margin: 8px 0 0;
	color: var(--wp--preset--color--ink-subtle);
	line-height: 1.55;
}

/* ---------- Business cards (Agend Directory catalogue skin) ---------- */

/* Agend Apps Core renders `.agend-directory-catalogue` with a grid of
   `.agend-dir-card`. These rules give those cards the prototype's listing
   card: white, hairline, 4:3 photo, condensed name with arrow, navy category,
   address under a rule. */
.ur-directory .agend-directory-catalogue {
	--agend-dir-accent: var(--wp--preset--color--brand);
}
.ur-directory .agend-dir-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(248px, 1fr));
	gap: 24px;
}
.ur-directory .agend-dir-card,
.ur-listing {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 10px 10px 2px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--surface);
	box-shadow: var(--ur-shadow-card);
	color: inherit;
	text-decoration: none;
	transition: box-shadow 220ms var(--ur-ease), background-color 220ms var(--ur-ease), border-color 220ms var(--ur-ease);
}
.ur-directory .agend-dir-card__media,
.ur-listing__media {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 11px;
	background: #E7DDCB;
}
.ur-directory .agend-dir-card__media img,
.ur-listing__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.ur-directory .agend-dir-card__body,
.ur-listing__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: flex-start;
	padding: 10px 6px 0;
}
.ur-directory .agend-dir-card__title,
.ur-directory .agend-dir-card h3,
.ur-listing__name {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
}
.ur-directory .agend-dir-card__category,
.ur-listing__category {
	margin: 10px 0 4px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.05em;
	color: var(--wp--preset--color--brand);
}
.ur-directory .agend-dir-card__location,
.ur-listing__meta {
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-self: stretch;
	margin-top: auto;
	padding: 4px 0 6px;
	font-size: 14px;
	font-weight: 500;
	color: var(--ur-ink-meta);
}
.ur-directory .agend-dir-card__location::before,
.ur-listing__meta::before {
	content: "";
	height: 1px;
	margin: 0 -6px;
	background: #E8DED4;
}
.ur-directory .agend-dir-card:hover,
.ur-listing:hover {
	border-color: var(--wp--preset--color--brand);
	background: var(--wp--preset--color--brand);
	box-shadow: 0 18px 34px rgba(22, 64, 138, 0.32);
}
.ur-directory .agend-dir-card:hover *,
.ur-listing:hover * {
	color: var(--wp--preset--color--on-ink);
}
.ur-directory .agend-dir-card:hover .agend-dir-card__category,
.ur-listing:hover .ur-listing__category {
	color: var(--wp--preset--color--action-wash);
}
.ur-directory .agend-dir-card:hover .agend-dir-card__location,
.ur-listing:hover .ur-listing__meta {
	color: #9DBDEC;
}
.ur-directory .agend-dir-card:hover .agend-dir-card__media,
.ur-listing:hover .ur-listing__media {
	box-shadow: 0 0 0 2px #fff;
}

/* The plugin's real card markup: the category is a pill above the name and
   featured cards carry a ribbon. The design has neither: the name (with an
   arrow) comes first, then the category as navy text, then the location. */
.ur-directory .agend-dir-card__body > .agend-dir-card__title {
	order: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	align-self: stretch;
}
.ur-directory .agend-dir-card__title::after {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	background: var(--wp--preset--color--ink-subtle);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 220ms var(--ur-ease), background-color 220ms var(--ur-ease);
}
.ur-directory .agend-dir-card:hover .agend-dir-card__title::after {
	background: #fff;
	transform: translateX(2px);
}
.ur-directory .agend-dir-card__body > .agend-dir-card__pills {
	order: 1;
	margin: 4px 0 2px;
}
.ur-directory .agend-dir-card__body > .agend-dir-card__location {
	order: 2;
}
.ur-directory .agend-dir-pill--category {
	padding: 0;
	border: 0;
	background: none;
	color: var(--wp--preset--color--brand);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.ur-directory .agend-dir-card:hover .agend-dir-pill--category {
	color: var(--wp--preset--color--action-wash);
}
.ur-directory .agend-dir-card__ribbon {
	display: none;
}
/* A photo that fails to load shows the tan box, not its alt text. */
.ur-directory .agend-dir-card__img {
	color: transparent;
}

/* Empty and error states from the catalogue read as Unley copy, not a fault. */
.ur-directory .agend-dir-status {
	padding: 40px 24px;
	border: 1px dashed var(--wp--preset--color--border);
	border-radius: 12px;
	color: var(--wp--preset--color--ink-subtle);
	text-align: center;
}
.ur-directory-offline .ur-directory__note {
	display: block;
}
.ur-directory__note {
	display: none;
	max-width: 640px;
	margin: 0 auto 24px;
	padding: 14px 18px;
	border-left: 5px solid var(--wp--preset--color--action);
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--brand-soft);
	font-weight: 600;
	text-align: left;
}

/* Category shortcut chips (Discover). */
.ur-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
}
.ur-chips a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 7px 15px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--brand-soft);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}
.ur-chips a:hover,
.ur-chips a[aria-current="page"] {
	border-color: var(--wp--preset--color--brand);
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--on-ink);
}

/* ---------- About and visit ---------- */

.ur-about__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 40px;
	align-items: stretch;
}
.ur-about__copy {
	text-align: center;
}
.ur-about__copy .is-style-unley-section-title {
	margin-top: 10px;
	text-align: center;
}
.ur-about__copy > p {
	max-width: 52ch;
	margin: 18px auto 0;
}
.ur-stats {
	display: flex;
	align-items: center;
	gap: clamp(12px, 3vw, 32px);
	margin-top: 26px;
}
.ur-stats__item {
	flex: 1 1 0;
	min-width: 0;
	text-align: center;
}
.ur-stats__value {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(26px, 7vw, 36px);
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--ink);
}
.ur-stats__label {
	display: block;
	margin-top: 5px;
	font-size: 13px;
	color: var(--wp--preset--color--ink-subtle);
}
.ur-stats__rule {
	flex: 0 0 auto;
	align-self: stretch;
	width: 1px;
	background: var(--wp--preset--color--border);
}
.ur-about__copy .wp-block-buttons {
	justify-content: center;
	margin-top: 30px;
}
.ur-about__visit {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.ur-map {
	position: relative;
	flex: 1 1 0;
	min-height: 260px;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: #E4E0D4;
}
.ur-map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.ur-map .wp-block-embed__wrapper,
.ur-map .wp-block-embed {
	position: absolute;
	inset: 0;
	margin: 0;
}
.ur-visit-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 20px 22px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--navy-tint);
}
.ur-visit-cta p {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: 24px;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
}

/* ---------- Editorial cards (Query Loop post templates) ---------- */

.is-style-unley-story-cards,
.is-style-unley-event-posters,
.is-style-unley-offer-cards {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
/* Event posters keep the design's column size (auto-fill) and leave the rest
   of the row empty; only the home band stretches its three to the width. */
.is-style-unley-event-posters {
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.ur-home-events .is-style-unley-event-posters {
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
/* "More from the journal" keeps the design's 280px columns. */
.ur-related .is-style-unley-story-cards {
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.is-style-unley-story-cards > li,
.is-style-unley-event-posters > li,
.is-style-unley-offer-cards > li {
	margin: 0;
	list-style: none;
}

/* Story card. */
.ur-story-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 14px;
	background: var(--wp--preset--color--paper);
	box-shadow: 0 2px 12px rgba(26, 24, 20, 0.07);
	transition: box-shadow 240ms var(--ur-ease), transform 240ms var(--ur-ease), border-color 240ms var(--ur-ease);
}
.ur-story-card:hover {
	border-color: var(--wp--preset--color--brand);
	box-shadow: var(--ur-shadow-lift);
	transform: translateY(-3px);
}
.ur-story-card__media {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--wp--preset--color--ink);
}
.ur-story-card__media .wp-block-post-featured-image,
.ur-story-card__media img {
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
	transition: transform 360ms var(--ur-ease);
}
.ur-story-card:hover .ur-story-card__media img {
	transform: scale(1.05);
}
.ur-story-card__media .wp-block-post-featured-image a {
	display: block;
	height: 100%;
}
.ur-story-card__body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 18px 20px 20px;
}
.ur-story-card__body h3,
.ur-story-card__body .wp-block-post-title {
	margin: 0;
	font-size: 23px;
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
	text-wrap: balance;
	transition: color 200ms var(--ur-ease);
}
.ur-story-card:hover .wp-block-post-title {
	color: var(--wp--preset--color--brand);
}
.ur-story-card__body .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}
/* The whole card is the link. */
.ur-story-card__body .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.ur-story-card__body .wp-block-post-excerpt,
.ur-story-card__body .wp-block-post-excerpt__excerpt {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--wp--preset--color--ink-subtle);
	text-wrap: pretty;
}
.ur-story-meta {
	margin: 2px 0 0;
	font-size: 13px;
	color: var(--ur-ink-meta);
}

/* Category chip over media (story and event). */
.ur-chip {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	height: 26px;
	padding: 0 12px;
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.92);
	color: var(--wp--preset--color--brand);
	font-family: var(--wp--preset--font-family--display);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}
.ur-chip--right {
	left: auto;
	right: 14px;
	top: 18px;
}
.ur-chip.wp-block-post-terms a {
	color: inherit;
	text-decoration: none;
}
.ur-chip.wp-block-post-terms .wp-block-post-terms__separator {
	display: none;
}
.ur-chip.wp-block-post-terms a:not(:first-child) {
	display: none;
}

/* Event poster. */
.ur-event-poster {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 14px;
	background: var(--wp--preset--color--paper);
	box-shadow: 0 2px 12px rgba(26, 24, 20, 0.08);
	transition: box-shadow 240ms var(--ur-ease), transform 240ms var(--ur-ease), background-color 240ms var(--ur-ease);
}
.ur-event-poster:has(.ur-event-poster__title a) {
	cursor: pointer;
}
.ur-event-poster:hover {
	background: var(--wp--preset--color--brand);
	box-shadow: var(--ur-shadow-poster);
	transform: translateY(-4px);
}
.ur-event-poster__media {
	position: relative;
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: var(--wp--preset--color--ink);
}
.ur-event-poster__media .wp-block-post-featured-image,
.ur-event-poster__media img {
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
}
.ur-event-poster__media::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(rgba(26, 24, 20, 0) 38%, rgba(26, 24, 20, 0.82) 100%);
	pointer-events: none;
}
.ur-event-poster__media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 5;
	border: 0 solid #fff;
	border-radius: 14px 14px 0 0;
	pointer-events: none;
	transition: border-width 200ms var(--ur-ease);
}
.ur-event-poster:hover .ur-event-poster__media::after {
	border-width: 3px;
}
.ur-event-poster__title {
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: 16px;
	z-index: 2;
	margin: 0;
}
.ur-event-poster__title .wp-block-post-title,
.ur-event-poster__title h3 {
	margin: 0;
	font-size: 25px;
	font-weight: 700;
	line-height: 1.04;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--wp--preset--color--on-ink);
	text-wrap: balance;
}
.ur-event-poster__title a {
	color: inherit;
	text-decoration: none;
}
.ur-event-poster__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 6;
}
.ur-event-poster__body {
	padding: 16px 18px 18px;
}

/* Date badge (theme block). */
.ur-event-date {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 3;
	width: 56px;
	overflow: hidden;
	border-radius: 12px;
	background: var(--wp--preset--color--paper);
	box-shadow: 0 6px 16px rgba(26, 24, 20, 0.32);
	font-family: var(--wp--preset--font-family--display);
	text-align: center;
	text-transform: uppercase;
	transition: box-shadow 200ms var(--ur-ease);
}
.ur-event-poster:hover .ur-event-date {
	box-shadow: 0 0 0 2px #fff, 0 4px 12px rgba(26, 24, 20, 0.28);
}
.ur-event-date time {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.ur-event-date__day {
	align-self: stretch;
	padding: 5px 0;
	background: var(--wp--preset--color--brand-soft);
	color: var(--wp--preset--color--on-ink);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.16em;
}
.ur-event-date__num {
	margin-top: 8px;
	font-size: 30px;
	font-weight: 700;
	line-height: 0.86;
	color: var(--wp--preset--color--brand);
}
.ur-event-date__mon {
	margin: 4px 0 8px;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--brand);
}

/* Event details (theme block), card layout: three lines with a rule. */
.ur-event-details--card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
}
.ur-event-details--card dt {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}
.ur-event-details--card dd {
	margin: 0;
	font-size: 16px;
	color: var(--ur-ink-meta);
}
.ur-event-details--card .ur-event-details__row--time dd {
	font-weight: 600;
	color: var(--wp--preset--color--brand);
}
.ur-event-details--card .ur-event-details__row--where {
	padding-top: 11px;
	border-top: 1px solid var(--wp--preset--color--border);
}
.ur-event-details--card .ur-event-details__row--where dd {
	font-size: 14px;
}
.ur-event-poster:hover .ur-event-details--card dd {
	color: var(--wp--preset--color--on-ink);
}
.ur-event-poster:hover .ur-event-details--card .ur-event-details__row--where {
	border-top-color: rgba(255, 255, 255, 0.28);
}

/* Event details, panel layout: labelled grid on the single event page. */
.ur-event-details--panel {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
	gap: 1px;
	overflow: hidden;
	margin: 36px 0 46px;
	padding: 1px;
	border-radius: 10px;
	background: var(--wp--preset--color--border);
}
.ur-event-details--panel > div {
	min-width: 0;
	padding: 18px 20px;
	background: var(--wp--preset--color--paper);
}
.ur-event-details--panel dt {
	color: var(--wp--preset--color--action);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.ur-event-details--panel dd {
	margin: 4px 0 0;
	color: var(--wp--preset--color--brand-soft);
	font-weight: 600;
}

/* ---------- Social band ---------- */

.ur-social-band .ur-band-head {
	flex-direction: column;
	align-items: center;
	gap: 20px;
	margin-bottom: 30px;
}
.ur-social-band__icons {
	display: flex;
	gap: 12px;
}
.ur-feed-label {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 14px;
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}
.ur-feed-label + .ur-feed-label,
.ur-rail + .ur-feed-label {
	margin-top: 34px;
}
.ur-rail {
	display: flex;
	gap: 12px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding-bottom: 2px;
	touch-action: pan-x;
	cursor: grab;
}
.ur-rail::-webkit-scrollbar {
	display: none;
}
.is-style-unley-social-tiles {
	display: flex !important;
	gap: 12px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	margin: 0;
	padding: 0 0 2px;
	list-style: none;
}
.is-style-unley-social-tiles::-webkit-scrollbar {
	display: none;
}
.is-style-unley-social-tiles > li {
	flex: 0 0 auto;
	width: clamp(180px, 24vw, 232px);
	margin: 0;
	scroll-snap-align: start;
	list-style: none;
}
.ur-social-tile {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 8px;
	background: #EAE3D6;
}
.ur-social-tile .wp-block-post-featured-image,
.ur-social-tile img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
	transition: transform 300ms var(--ur-ease);
}
.ur-social-tile:hover img {
	transform: scale(1.05);
}
.ur-social-tile .wp-block-post-title {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 2;
	margin: 0;
	padding: 12px;
	background: linear-gradient(transparent, rgba(26, 24, 20, 0.7));
	font-size: 15px;
	color: var(--wp--preset--color--on-ink);
}
.ur-social-tile .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
}
.ur-social-tile .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

/* Instagram tiles are photos only in the design; the title stays for
   screen readers. */
.ur-social-tile .wp-block-post-title {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	padding: 0;
	white-space: nowrap;
}
.ur-feed-label--instagram svg {
	color: var(--wp--preset--color--action);
}
.ur-feed-label--facebook svg {
	color: var(--wp--preset--color--brand);
}
.ur-social-band > .ur-feed-label--facebook {
	margin-top: 34px;
}

/* Tiles and cards link to the profile until a feed with per-post links is
   chosen. The link covers the card; its text is for screen readers. */
.ur-social-tile__link,
.ur-fb-post__link {
	position: absolute;
	inset: 0;
	z-index: 3;
	overflow: hidden;
	color: transparent;
	font-size: 0;
}
.ur-social-tile__link:focus-visible,
.ur-fb-post__link:focus-visible {
	outline-offset: -3px;
}
.ur-fb-post {
	position: relative;
}
.ur-fb-post:hover {
	border-color: var(--wp--preset--color--brand);
}

/* Facebook post cards. */
.ur-fb-posts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ur-fb-posts > li {
	margin: 0;
}
.ur-fb-post {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--surface);
}
.ur-fb-post > * {
	margin: 0;
}
.ur-fb-post > .ur-fb-post__head {
	gap: 10px;
	padding: 14px 16px 0;
}
.ur-fb-post__avatar {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--wp--preset--color--brand);
	color: #fff;
	font-family: var(--wp--preset--font-family--display);
	font-size: 16px;
	font-weight: 700;
}
.ur-fb-post__who > * {
	margin: 0;
	line-height: 1.3;
}
.ur-fb-post__name {
	font-size: 14px;
	font-weight: 600;
	color: var(--wp--preset--color--ink);
}
.ur-fb-post__who > .ur-fb-post__date {
	font-size: 13px;
	color: var(--ur-ink-meta);
}
.ur-fb-post > .ur-fb-post__text {
	padding: 12px 16px 14px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--wp--preset--color--ink);
}
.ur-fb-post__text > * {
	display: inline;
	margin: 0;
	font: inherit;
	letter-spacing: 0;
	text-transform: none;
}
.ur-fb-post__text > .wp-block-post-title {
	color: var(--wp--preset--color--ink);
	font-weight: 600;
}
.ur-fb-post__text > .wp-block-post-title::after {
	content: " ";
}
.ur-fb-post__text .wp-block-post-excerpt__excerpt {
	display: inline;
	margin: 0;
}
.ur-fb-post > .wp-block-post-featured-image {
	margin-top: auto;
}
.ur-fb-post .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	object-fit: cover;
}

/* ---------- Newsletter band (footer top) ---------- */

.ur-newsletter {
	padding-block: 32px 48px;
	border-top: 1px solid var(--wp--preset--color--surface);
	background: var(--wp--preset--color--sunken);
}
.ur-newsletter .is-style-unley-section-title {
	font-size: clamp(28px, 3.6vw, 38px);
	line-height: 1.04;
}
.ur-newsletter p {
	margin: 14px 0 0;
	font-size: 15.5px;
	color: var(--wp--preset--color--ink-subtle);
}
.ur-newsletter__form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 28px;
}
.ur-newsletter__form input:not([type="submit"]),
.ur-newsletter__form .gfield input {
	height: 48px;
	padding: 0 15px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	font-family: inherit;
	font-size: 15px;
	color: var(--wp--preset--color--ink);
}
.ur-newsletter__form input[type="email"] {
	flex: 1.5 1 240px;
}
.ur-newsletter__form input[type="text"] {
	flex: 0 1 140px;
}
.ur-newsletter__form button,
.ur-newsletter__form input[type="submit"] {
	height: 48px;
	padding: 0 26px;
	border: 1px solid var(--wp--preset--color--brand);
	border-radius: 999px;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--on-ink);
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.02em;
	cursor: pointer;
	transition: background-color 200ms var(--ur-ease);
}
.ur-newsletter__form button:hover,
.ur-newsletter__form input[type="submit"]:hover {
	background: var(--wp--preset--color--brand-soft);
}

/* ---------- Footer ---------- */

.ur-footer {
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--footer-copy);
}
.ur-footer__inner {
	padding: 64px 0 32px;
}
.ur-footer__grid {
	display: grid;
	grid-template-columns: 1.4fr repeat(4, 1fr);
	gap: 40px;
}
.ur-footer .ur-wordmark {
	color: var(--wp--preset--color--on-ink);
	font-size: 20px;
	text-transform: uppercase;
}
.ur-footer .ur-wordmark__tile {
	background: var(--wp--preset--color--on-ink);
	color: var(--wp--preset--color--brand);
}
.ur-footer__blurb {
	margin: 16px 0 0;
	color: #C7D2E8;
	line-height: 1.6;
}
.ur-footer h3,
.ur-footer .wp-block-heading {
	margin: 0 0 16px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--on-ink-muted);
}
.ur-footer nav .wp-block-navigation__container {
	flex-direction: column;
	gap: 10px;
}
.ur-footer .wp-block-navigation {
	font-family: var(--wp--preset--font-family--body);
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wp--preset--color--footer-copy);
}
.ur-footer .wp-block-navigation-item__content {
	color: inherit;
	text-decoration: none;
	transition: color 160ms var(--ur-ease);
}
.ur-footer .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--on-ink);
	text-decoration: underline;
}
.ur-footer a {
	color: inherit;
}
.ur-footer__trader {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	margin-top: 6px;
	padding: 0 16px;
	border: 1px solid var(--wp--preset--color--footer-copy);
	border-radius: 999px;
	color: var(--wp--preset--color--footer-copy) !important;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none !important;
	transition: background-color 200ms var(--ur-ease), color 200ms var(--ur-ease);
}
.ur-footer__trader:hover {
	background: var(--wp--preset--color--on-ink);
	color: var(--wp--preset--color--brand) !important;
}
.ur-footer address {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 10px;
	font-size: 15px;
	font-style: normal;
	line-height: 1.5;
	color: #C7D2E8;
}
.ur-footer address a {
	text-decoration: none;
}
.ur-footer address a:hover {
	color: var(--wp--preset--color--on-ink);
	text-decoration: underline;
}
.ur-footer .ur-social {
	margin-top: 14px;
}
.ur-footer .ur-social a {
	border-color: var(--wp--preset--color--footer-copy);
	color: var(--wp--preset--color--footer-copy);
}
.ur-footer .ur-social a::before {
	background: var(--wp--preset--color--on-ink);
}
.ur-footer .ur-social a:hover {
	color: var(--wp--preset--color--brand);
}
.ur-footer__legal {
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid rgba(244, 238, 226, 0.22);
}
.ur-footer__ack {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
	color: #C7D2E8;
}
.ur-footer__ack strong {
	font-weight: 500;
	color: var(--wp--preset--color--footer-copy);
}
.ur-footer__fine {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 24px;
	font-size: 13px;
	color: #93A6CC;
}
.ur-footer__fine p {
	margin: 0;
}

/* ---------- Responsive ---------- */

@media (max-width: 1024px) {

	.ur-band-head:not(.ur-band-head--center) {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.ur-band-head .is-style-unley-section-title {
		text-align: center;
	}

	.ur-turning .ur-band-head p {
		text-align: center;
	}

	.ur-tabs {
		--ur-seg-w: 100px;
	}

	.ur-footer__grid {
		grid-template-columns: 1fr 1fr;
		gap: 28px 24px;
	}

	.ur-footer__brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 640px) {

	.ur-band {
		padding-block: 44px;
	}

	.ur-hero {
		padding-top: 52px;
	}

	.ur-hero__inner {
		gap: 28px;
	}

	.ur-hero__intro {
		font-size: 16px;
	}

	.ur-promo {
		padding-block-end: 44px;
	}

	.ur-promo__inner {
		padding-inline: 24px;
	}

	.ur-tabs {
		--ur-seg-w: 86px;
	}

	.ur-tabs__button {
		font-size: 12px;
		letter-spacing: 0.02em;
	}

	.ur-footer__grid {
		gap: 20px 16px;
	}

	.ur-footer__inner {
		padding-block: 40px 24px;
	}

	.ur-footer__legal {
		margin-top: 26px;
		padding-top: 20px;
	}

	.ur-footer nav .wp-block-navigation {
		font-size: 14px;
	}

	.ur-newsletter__form input[type="email"],
	.ur-newsletter__form input[type="text"],
	.ur-newsletter__form button {
		flex: 1 1 100%;
	}

	.is-style-unley-event-posters > li .ur-event-poster__media {
		aspect-ratio: 5 / 7;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- Editor only ---------- */

.editor-styles-wrapper .ur-header {
	position: static;
}
.editor-styles-wrapper .ur-turning__panel[hidden] {
	display: block;
	opacity: 0.6;
}

/* Newsletter status line. */
.ur-newsletter__status {
	margin: 14px 0 0;
	color: var(--wp--preset--color--brand-soft);
	font-weight: 600;
}
.ur-newsletter__status--error {
	color: var(--wp--preset--color--action);
}

/* Nothing may widen the page on small screens. */
.ur-header__bar > *,
.ur-hero__inner,
.ur-about__grid > *,
.ur-stats__item {
	min-width: 0;
}

/* Left-aligned copy inside constrained bands keeps its measure without being
   centred by the layout's auto margins. */
/* The newsletter sentence keeps the layout's content width (so it lines up
   with the heading) and narrows its measure from the right. The padding is
   worked out from the paragraph's real width, which is the smaller of the
   band and the content size: a bare 100% would be the whole band. */
.ur-newsletter > p {
	box-sizing: border-box;
	padding-right: max(0px, calc(min(100%, var(--wp--style--global--content-size)) - 60ch));
}

/* The parent makes any header holding a mega menu `position: relative` (so the
   panel can span it). Sticky is also a positioning box, so keep the Unley
   header sticky with a selector that outranks `header:has(.agend-mega)`. */
/* Sticky only works within its parent, and the header group's parent is the
   template-part wrapper, exactly as tall as the header. So the wrapper is the
   sticky element, and the header group is the panel's positioning box. */
.wp-block-template-part:has(> .ur-header),
header.wp-block-template-part:has(.ur-header) {
	position: sticky;
	top: 0;
	z-index: 100;
}
.admin-bar .wp-block-template-part:has(> .ur-header),
.admin-bar header.wp-block-template-part:has(.ur-header) {
	top: var(--wp-admin--admin-bar--height, 32px);
}
header.ur-header,
header.ur-header:has(.agend-mega) {
	position: relative;
}
/* Core makes each navigation item a positioning box; the Neighbourhood item
   must stay static so the panel spans the header, as the parent intends. */
.ur-header .ur-neighbourhood .wp-block-navigation-item.wp-block-agend-mega-menu {
	position: static;
}

/* Neighbourhood panel: full header width (parent "full" mode), content lined
   up with the 1200px site container. */
.ur-neighbourhood .agend-mega__inner {
	box-sizing: content-box;
	max-width: var(--wp--style--global--content-size);
	padding-inline: 24px;
}

/* The UR tile is a link inside .ur-wordmark, whose `a { color: inherit }`
   would otherwise paint its letters ink on navy. */
.ur-wordmark a.ur-wordmark__tile,
.ur-wordmark a.ur-wordmark__tile:hover {
	color: var(--wp--preset--color--on-ink);
	text-decoration: none;
}
.ur-footer .ur-wordmark .ur-wordmark__tile {
	color: var(--wp--preset--color--brand);
}

/* Phones and tablets: the menu button sits at the far right, after search. */
@media (max-width: 1024px) {
	.ur-header__nav {
		order: 3;
	}
}


/* ---------- Corrections after comparing with the prototype ---------- */

/* WordPress flow layout gives every non-first block a 24px top margin. That
   must not move absolutely positioned badges, nor the columns of the grids. */
.ur-chip,
.ur-event-date,
.ur-footer__grid > *,
.ur-about__grid > * {
	margin-block-start: 0;
}
.ur-chip {
	margin: 0;
}

/* Turning Hour tabs: icon before the label. */
.ur-tabs__label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
}
.ur-tabs__label svg {
	flex: 0 0 auto;
}

/* Event date badge: the prototype's 56x92 proportions. */
.ur-event-date__day {
	line-height: 1.2;
}
.ur-event-date__num {
	margin-top: 8px;
	line-height: 0.86;
}
.ur-event-date__mon {
	margin: 4px 0 8px;
	line-height: 1;
	font-weight: 800;
}

/* Event details: icon in front of each line, pin in terracotta. */
.ur-event-details--card dd {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}
.ur-event-details__icon {
	display: inline-flex;
	flex: 0 0 auto;
	color: var(--wp--preset--color--brand);
}
.ur-event-details__row--where .ur-event-details__icon {
	color: var(--wp--preset--color--action);
}
.ur-event-poster:hover .ur-event-details__icon {
	color: var(--wp--preset--color--on-ink);
}

/* Footer wordmark: plain display type, top-aligned with the column headings. */
.ur-footer .ur-wordmark--footer {
	font-size: 20px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}
.ur-footer__grid {
	align-items: start;
}

/* Newsletter form: the prototype's proportions. Above 1200px everything sits
   on one row, email 1.4 shares to postcode's 1; below, email takes the row,
   postcode half a row, and the button centres beneath. */
.ur-newsletter__form input:not([type="submit"]),
.ur-newsletter__form button {
	box-sizing: border-box;
	height: 48px;
}
.ur-newsletter__form input[type="email"] {
	flex: 1 1 100%;
}
.ur-newsletter__form input[type="text"] {
	flex: 1 1 calc(50% - 5px);
}
.ur-newsletter__form button {
	flex: 0 0 auto;
	margin-inline: auto;
}
@media (min-width: 1200px) {
	.ur-newsletter__form {
		flex-wrap: nowrap;
	}
	.ur-newsletter__form input[type="email"] {
		flex: 1.4 1 0;
	}
	.ur-newsletter__form input[type="text"] {
		flex: 1 1 0;
	}
	.ur-newsletter__form button {
		margin-inline: 0;
	}
}
@media (max-width: 560px) {
	.ur-newsletter__form input[type="text"],
	.ur-newsletter__form button {
		flex: 1 1 100%;
	}
}
