/*
Theme Name: 365ejendom Child
Theme URI: https://365ejendom.dk/
Description: Child theme til Astra for 365ejendom.dk. Holder custom CSS og JS adskilt fra Astra, saa det overlever temaopdateringer.
Author: 365 Ejendomme
Template: astra
Version: 1.0.0
Text Domain: ejd365-child
*/

/* ==========================================================================
   Design tokens: "365 Ejendomme Rolig Mint"
   ========================================================================== */

:root {
	--ejd-ink: #1c2b2b;
	--ejd-muted: #4d5a59;
	--ejd-surface: #f5f2f1;
	--ejd-accent: #83ebeb;
	--ejd-accent-ink: #123f41;
	--ejd-green: #145d5f;
	--ejd-green-deep: #0f4749;

	--ejd-radius-sm: 6px;
	--ejd-radius-md: 8px;
	--ejd-radius-lg: 12px;

	--ejd-nav-max: 1380px;
	/* The sales site sets pt-3 sm:pt-4, so the bar sits 12px from the top on
	   phones and 16px from 640px up. Matching it keeps the header from shifting
	   when a visitor crosses between the two sites. */
	--ejd-nav-inset: 12px;
	--ejd-nav-inset-x: 12px;
	--ejd-nav-glass: rgba(0, 0, 0, 0.30);
	--ejd-nav-glass-scrolled: rgba(0, 0, 0, 0.42);
	--ejd-nav-shadow: 0 12px 30px -8px rgba(15, 71, 73, 0.55);

	/* Panelmateriale, delt af desktop-dropdown og mobilmenu.
	   Samme vaerdier som salgssidens mobilpanel. */
	--ejd-panel-glass: rgba(0, 0, 0, 0.42);

	--ejd-ease: cubic-bezier(0.23, 1, 0.32, 1);
}

/* ==========================================================================
   Header: floating glass bar

   Astra renders two headers: #ast-desktop-header and #ast-mobile-header.
   Only one is visible at a time, and the swap happens at Astra's mobile
   header breakpoint, which is set to 1200px for this site.
   ========================================================================== */

/* Lift the whole masthead out of flow so it floats over the page.
   Astra's inline CSS uses .ast-theme-transparent-header #masthead, so the
   body prefix is needed to outrank it. */
body #masthead,
body.ast-theme-transparent-header #masthead {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	background: transparent;
	padding: var(--ejd-nav-inset) var(--ejd-nav-inset-x) 0;
}

@media (min-width: 640px) {
	:root {
		--ejd-nav-inset: 16px;
		--ejd-nav-inset-x: 20px;
	}
}

/* Pages without a transparent header would otherwise start underneath it. */
body:not(.ast-theme-transparent-header) #content {
	padding-top: 92px;
}

/* The admin bar pushes everything down by its own height. */
body.admin-bar #masthead {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar #masthead {
		top: 46px;
	}
}

/* --------------------------------------------------------------------------
   The glass bar itself, shared by the desktop and mobile headers
   -------------------------------------------------------------------------- */

#ast-desktop-header .ast-above-header-wrap,
#ast-mobile-header .ast-main-header-wrap {
	background: transparent;
}

/* The glass sits on a pseudo-element rather than on the bar itself.
   backdrop-filter promotes its element to its own composited layer and makes
   it a containing block. The desktop dropdown is a descendant of this bar and
   hangs 200px below it, which is exactly the case where that promotion can
   cost an overflowing descendant its hit area once the page starts scrolling.
   Keeping the filter on a child leaves the dropdown's ancestor chain clean
   while the look stays identical. */
#ast-desktop-header .ast-above-header-bar,
#ast-mobile-header .ast-primary-header-bar {
	position: relative;
	max-width: var(--ejd-nav-max);
	margin: 0 auto;
	min-height: 0;
	border: 0;
	border-bottom: 0;
	border-radius: var(--ejd-radius-md);
	background: transparent;
	box-shadow: none;
	transition: box-shadow 320ms var(--ejd-ease);
}

#ast-desktop-header .ast-above-header-bar::before,
#ast-mobile-header .ast-primary-header-bar::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--ejd-nav-glass);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	transition: background-color 320ms var(--ejd-ease);
}

/* Astra's inner container carries its own max-width and padding. */
#ast-desktop-header .site-above-header-wrap.ast-container,
#ast-mobile-header .ast-primary-header-bar > .ast-builder-grid-row-container,
#ast-mobile-header .ast-primary-header-bar.ast-container {
	min-height: 0;
	max-width: none;
	width: 100%;

	/* Symmetric, so the centred menu column lands on the pill's own centre.
	   The logo's extra inset is applied to the logo section instead. */
	padding: 8px;
}

/* Astra sizes the side columns from their own content, so the wider right
   column (the call button) stole space from the left one and pushed the
   centred menu off centre once the viewport tightened. minmax(0, 1fr) drops
   the min-content floor so both sides stay exactly equal. */
body #ast-desktop-header .ast-builder-grid-row.ast-grid-center-col-layout {
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

body #ast-desktop-header .site-header-above-section-left {
	padding-left: 16px;
}

body #ast-desktop-header .site-header-above-section-right {
	justify-content: flex-end;
}

#ast-desktop-header .ast-above-header-bar .ast-builder-grid-row,
#ast-mobile-header .ast-primary-header-bar .ast-builder-grid-row {
	align-items: center;
	min-height: 40px;
}

/* Deepen the glass once the page has scrolled under it. */
#masthead.ejd-scrolled .ast-above-header-bar,
#masthead.ejd-scrolled .ast-primary-header-bar {
	box-shadow: var(--ejd-nav-shadow);
}

#masthead.ejd-scrolled .ast-above-header-bar::before,
#masthead.ejd-scrolled .ast-primary-header-bar::before {
	background: var(--ejd-nav-glass-scrolled);
}

/* --------------------------------------------------------------------------
   Collapse Astra's fixed header height

   Astra sizes the header from hba-header-height (90px) and stretches every
   inner wrapper to fill it. The pill sizes itself from its own padding
   instead, so those wrappers are released here.
   -------------------------------------------------------------------------- */

body #masthead .site-header-section,
body #masthead .ast-builder-layout-element,
body #masthead .site-branding,
body #masthead .ast-builder-menu,
body #masthead .main-header-bar-navigation,
body #masthead .site-navigation,
body #masthead .main-navigation,
body #masthead .ast-main-header-bar-alignment {
	min-height: 0;
	height: auto;
}

body #masthead .main-header-menu > .menu-item > .menu-link {
	height: auto;
}

/* Astra pads the branding block by 17px top and bottom. */
body #masthead .site-branding {
	padding: 0;
}

/* The logo sits in an inline span, so its line box, not the image, was
   setting the height. */
body #masthead .site-logo-img,
body #masthead .custom-logo-link {
	display: flex;
	align-items: center;
	line-height: 0;
}

/* --------------------------------------------------------------------------
   Logo
   -------------------------------------------------------------------------- */

/* The mark is 307x360, taller than it is wide, so the height is the fixed
   dimension and the width follows. Pinning both would letterbox it inside a
   square that is not its shape. */
body #masthead .site-branding .custom-logo-link img,
body #masthead .site-logo-img .custom-logo-link img,
body.ast-theme-transparent-header #masthead .site-logo-img .transparent-custom-logo img {
	width: auto;
	height: 40px;
	max-width: none;
	object-fit: contain;
}

/* --------------------------------------------------------------------------
   Desktop navigation
   -------------------------------------------------------------------------- */

#ast-desktop-header .main-header-menu {
	align-items: center;
}

#ast-desktop-header .main-header-menu > .menu-item > .menu-link {
	font-family: "Montserrat", sans-serif;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0;
	color: #ffffff;
	padding: 6px 0;
	transition: opacity 200ms var(--ejd-ease);
}

#ast-desktop-header .main-header-menu > .menu-item + .menu-item {
	margin-left: 28px;
}

#ast-desktop-header .main-header-menu > .menu-item > .menu-link:hover,
#ast-desktop-header .main-header-menu > .menu-item > .menu-link:focus,
#ast-desktop-header .main-header-menu > .menu-item.current-menu-item > .menu-link,
#ast-desktop-header .main-header-menu > .menu-item.current-menu-ancestor > .menu-link {
	color: #ffffff;
	opacity: 0.75;
}

/* Astra draws a caret button next to parent items. */
#ast-desktop-header .main-header-menu .ast-menu-toggle {
	color: #ffffff;
}

/* Dropdown, kept in the same glass material as the bar. */
body #ast-desktop-header .main-header-menu .sub-menu {
	border: 0;
	border-radius: var(--ejd-radius-lg);
	background: var(--ejd-panel-glass);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	box-shadow: var(--ejd-nav-shadow);
	padding: 6px;
	margin-top: 11px;

	/* Astra's own width rule is unreliable here and the menu blew out to
	   1920px, so the width is pinned explicitly. */
	width: 240px;
	min-width: 0;
	max-width: 240px;
}

/* Bridges the gap between the parent item and the panel, so moving the
   pointer down does not drop :hover and close the menu.

   The bridge hangs off the menu item, not off the panel. On the panel its
   containing block resolved 11px higher than expected, so it covered space
   already inside the item and left the real gap open. The item is a plain
   positioned box, so top: 100% lands exactly on its lower edge. */
body #ast-desktop-header .main-header-menu > .menu-item-has-children {
	position: relative;
}

body #ast-desktop-header .main-header-menu > .menu-item-has-children::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 0;
	width: 240px;
	height: 14px;
	z-index: 1;
}

#ast-desktop-header .main-header-menu .sub-menu .menu-link {
	font-family: "Montserrat", sans-serif;
	font-size: 13.5px;
	font-weight: 400;
	color: #ffffff;
	border: 0;
	border-radius: var(--ejd-radius-sm);
	padding: 9px 12px;
	transition: background-color 200ms var(--ejd-ease);
}

#ast-desktop-header .main-header-menu .sub-menu .menu-link:hover,
#ast-desktop-header .main-header-menu .sub-menu .menu-link:focus {
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
}

/* --------------------------------------------------------------------------
   Phone CTA

   Markup lives in Astra's header HTML 1 element, as .ejd-nav-cta.
   -------------------------------------------------------------------------- */

#masthead .ast-header-html .ast-builder-html-element {
	line-height: 0;
}

#masthead .ast-header-html p {
	margin: 0;
	line-height: 0;
}

.ejd-nav-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: "Montserrat", sans-serif;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
	border-radius: var(--ejd-radius-md);
	padding: 10px 20px;
	transition: opacity 200ms var(--ejd-ease), transform 90ms cubic-bezier(0.4, 0, 0.6, 1);
}

#masthead .ejd-nav-cta:hover,
#masthead .ejd-nav-cta:focus {
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
	opacity: 0.85;
}

.ejd-nav-cta:active {
	transform: scale(0.97);
}

.ejd-nav-cta svg {
	width: 15px;
	height: 15px;
	flex: none;
	fill: currentColor;
}

/* --------------------------------------------------------------------------
   Mobile header and off-canvas
   -------------------------------------------------------------------------- */

/* The mobile bar has no .ast-container, so it needs its own padding. */
body #ast-mobile-header .ast-primary-header-bar {
	padding: 8px 8px 8px 20px;
}

body #ast-mobile-header .site-header-primary-section-right {
	gap: 6px;
	align-items: center;
}

#ast-mobile-header .menu-toggle.main-header-menu-toggle {
	color: #ffffff;
	background: transparent;
	border-radius: var(--ejd-radius-md);
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 90ms cubic-bezier(0.4, 0, 0.6, 1);
}

#ast-mobile-header .menu-toggle.main-header-menu-toggle:active {
	transform: scale(0.95);
}

#ast-mobile-header .menu-toggle .ast-mobile-svg {
	fill: #ffffff;
	width: 24px;
	height: 24px;
}

/* The dropdown panel Astra opens under the mobile bar. */
/* The panel Astra drops under the mobile bar, shaped like the sales site's
   menu overlay: one glass sheet, centred links, the call button at the foot.
   Astra positions it absolutely at the header's full width, which overflowed
   the viewport by the header's own 20px padding. */
body #ast-mobile-header .ast-mobile-header-content {
	/* Absolute offsets resolve against #masthead's padding box, so these
	   follow its horizontal inset and keep the panel flush with the bar. */
	left: var(--ejd-nav-inset-x);
	right: var(--ejd-nav-inset-x);
	width: auto;
	border-radius: var(--ejd-radius-lg);
	background: var(--ejd-panel-glass);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	box-shadow: var(--ejd-nav-shadow);
	margin-top: 8px;
	padding: 20px 16px 40px;
}

body #ast-mobile-header .ast-mobile-header-content .menu-link {
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
	color: #ffffff;
	border: 0;
	border-radius: var(--ejd-radius-sm);
}

/* Top level carries the weight of the panel: large, centred, generous. */
body #ast-mobile-header .ast-mobile-header-content .main-header-menu > .menu-item > .menu-link {
	font-size: 19px;
	line-height: 1.5;
	text-align: center;
	padding: 14px 12px;
}

/* Children sit quieter beneath their parent. */
body #ast-mobile-header .ast-mobile-header-content .sub-menu .menu-link {
	font-size: 15px;
	text-align: center;
	color: rgba(255, 255, 255, 0.78);
	padding: 10px 12px;
}

body #ast-mobile-header .ast-mobile-header-content .sub-menu {
	background: transparent;
	box-shadow: none;
	padding: 0 0 6px;
}

/* Astra paints the mobile menu with its transparent-header menu background
   (var(--ast-global-color-4) under 768px, #eaeaea under 544px). Inside the
   glass panel that reads as a light slab behind white text, so every surface
   here is released back to the panel. */
body #ast-mobile-header .ast-mobile-header-content .main-header-menu,
body #ast-mobile-header .ast-mobile-header-content .menu-item,
body #ast-mobile-header .ast-mobile-header-content .menu-link,
body #ast-mobile-header .ast-mobile-header-content .sub-menu,
body #ast-mobile-header .ast-mobile-header-content .ast-menu-toggle {
	background: transparent;
	border: 0;
	box-shadow: none;
}

/* Elementor's Astra compatibility ships `.elementor-page .ast-menu-toggle
   { color: unset !important }`, which no amount of specificity can beat.
   This is the one place in the file where !important is warranted. */
body #ast-mobile-header .ast-mobile-header-content .ast-menu-toggle,
body #ast-desktop-header .main-header-menu .ast-menu-toggle {
	color: #ffffff !important;
}

body #ast-mobile-header .ast-mobile-header-content .menu-link:hover,
body #ast-mobile-header .ast-mobile-header-content .menu-link:focus {
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
}

/* The call button, centred at the foot of the panel. */
body #ast-mobile-header .ast-mobile-header-content .ast-header-html-1 {
	justify-content: center;
	padding: 4px 0 0;
}

body #ast-mobile-header .ast-mobile-header-content .ast-header-html {
	display: flex;
	justify-content: center;
	width: 100%;
}

body #ast-mobile-header .ast-mobile-header-content .ejd-nav-cta {
	font-size: 15px;
	padding: 12px 24px;
}

#ast-mobile-header .ast-mobile-header-content .menu-link:hover,
#ast-mobile-header .ast-mobile-header-content .menu-link:focus {
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
}

#ast-mobile-header .ast-mobile-header-content .ast-menu-toggle {
	color: #ffffff;
}

/* --------------------------------------------------------------------------
   Floating call button

   Sits over the page in the bottom right corner, matching the sales site's
   floating CTA. Held back while the hero is on screen so it does not compete
   with it, then rising into view. js/header.js toggles .is-visible.
   -------------------------------------------------------------------------- */

.ejd-float-cta {
	position: fixed;
	right: 16px;
	bottom: 20px;
	z-index: 90;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: "Montserrat", sans-serif;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
	border-radius: var(--ejd-radius-md);
	padding: 12px 20px;
	box-shadow: var(--ejd-nav-shadow);

	opacity: 0;
	transform: translateY(14px);
	pointer-events: none;
	transition: opacity 280ms var(--ejd-ease), transform 320ms cubic-bezier(0.32, 0.72, 0, 1);
}

.ejd-float-cta.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.ejd-float-cta:hover,
.ejd-float-cta:focus {
	color: var(--ejd-accent-ink);
	background: var(--ejd-accent);
	opacity: 0.9;
}

.ejd-float-cta.is-visible:active {
	transform: translateY(0) scale(0.97);
}

.ejd-float-cta svg {
	width: 16px;
	height: 16px;
	flex: none;
	fill: currentColor;
}

@media (min-width: 640px) {
	.ejd-float-cta {
		right: 24px;
		bottom: 28px;
	}
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	#ast-desktop-header .ast-above-header-bar,
	#ast-mobile-header .ast-primary-header-bar,
	.ejd-nav-cta,
	.ejd-float-cta,
	#ast-desktop-header .main-header-menu > .menu-item > .menu-link {
		transition: none;
	}

	.ejd-float-cta,
	.ejd-float-cta.is-visible {
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Hero scrim

   The front page hero sets white type over a bright photograph, where the
   brickwork and window blew out the contrast. This lays a scrim that is
   heaviest behind the text and clears entirely by the right third, so the
   photograph still reads. Tinted to the palette's deep green, never black.
   -------------------------------------------------------------------------- */

.elementor-page-1215 .elementor-element-2f3a0c06 {
	position: relative;
}

.elementor-page-1215 .elementor-element-2f3a0c06::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(
		100deg,
		rgba(15, 71, 73, 0.78) 0%,
		rgba(15, 71, 73, 0.66) 32%,
		rgba(15, 71, 73, 0.46) 50%,
		rgba(15, 71, 73, 0.16) 68%,
		rgba(15, 71, 73, 0) 84%
	);
}

.elementor-page-1215 .elementor-element-2f3a0c06 > .elementor-container {
	position: relative;
	z-index: 1;
}

/* --------------------------------------------------------------------------
   Partner logo wall

   The three partner marks arrived in mixed treatments: two supplied as white
   files, one as dark line art that vanished against the ground. Normalising
   all three to flat white makes the wall read as one row of marks rather than
   three unrelated images, and costs nothing on the two that are already white.
   -------------------------------------------------------------------------- */

.elementor-element-9d645fb .elementor-widget-image-carousel img {
	filter: brightness(0) invert(1);
	opacity: 0.92;
	transition: opacity 200ms var(--ejd-ease);
}

.elementor-element-9d645fb .elementor-widget-image-carousel img:hover {
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Capability grid (front page)

   Six items in a 3x2 grid. Elementor centres the icon against the text block,
   so with titles of one, two and three lines no two icons sat at the same
   height and the second row started at three different offsets. Anchoring the
   icon to the top and reserving a fixed two lines for the title makes every
   cell the same height, which lines both rows up.

   Hairlines rather than card containers: these items carry no elevation, so
   a rule above each one is the honest separator.
   -------------------------------------------------------------------------- */

.elementor-page-1215 .elementor-element-310b5886 .elementor-widget-icon-box .elementor-icon-box-wrapper {
	align-items: flex-start;
	gap: 18px;
}

.elementor-page-1215 .elementor-element-310b5886 .elementor-widget-icon-box .elementor-icon-box-title {
	font-size: 19px;
	line-height: 1.35;
	min-height: 2.7em;
	margin-bottom: 10px;
}

.elementor-page-1215 .elementor-element-310b5886 .elementor-widget-icon-box .elementor-icon-box-description {
	margin: 0;
}

.elementor-page-1215 .elementor-element-310b5886 .elementor-widget-icon-box {
	border-top: 1px solid rgba(15, 71, 73, 0.16);
	padding-top: 20px;
}

@media (max-width: 767px) {
	.elementor-page-1215 .elementor-element-310b5886 .elementor-widget-icon-box .elementor-icon-box-title {
		min-height: 0;
	}
}

/* --------------------------------------------------------------------------
   Page heroes

   The inner pages set a centred intro sentence in a heading widget spanning
   the full 1200px container, which produced a single line of well over 150
   characters. Capping the measure and centring the block fixes the reading
   line; the scrim gives the light type something to sit on, the same way the
   front page hero does.
   -------------------------------------------------------------------------- */

.elementor-element-62c7badd .elementor-heading-title,
.elementor-element-62c7badd {
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
}

/* The intro and eyebrow were left in the body grey they inherit on a light
   page, which has nothing to give against a darkened photograph. */
.elementor-element-62c7badd .elementor-heading-title {
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.88);
}

.elementor-element-6b06d837 .elementor-heading-title {
	color: rgba(255, 255, 255, 0.72);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 500;
}

.elementor-element-7d439393 {
	position: relative;
}

.elementor-element-7d439393::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(
		180deg,
		rgba(15, 71, 73, 0.30) 0%,
		rgba(15, 71, 73, 0.52) 45%,
		rgba(15, 71, 73, 0.34) 100%
	);
}

.elementor-element-7d439393 > .elementor-container {
	position: relative;
	z-index: 1;
}

/* --------------------------------------------------------------------------
   Reading measure on the content pages

   The property pages and the tenant pages set their body copy in a full-width
   column, so a paragraph ran the whole 1120px container at over 140 characters
   a line. Capping the measure is the single change that makes them readable;
   the copy stays left aligned where it already was.

   Scoped by WordPress's parent-page body classes so it reaches all nineteen
   property pages without naming each one.
   -------------------------------------------------------------------------- */

body.parent-pageid-2358 .elementor-widget-text-editor .elementor-widget-container > p,
body.parent-pageid-2358 .elementor-widget-text-editor .elementor-widget-container > ul,
body.parent-pageid-1331 .elementor-widget-text-editor .elementor-widget-container > p,
body.parent-pageid-1331 .elementor-widget-text-editor .elementor-widget-container > ul,
body.page-id-1331 .elementor-widget-text-editor .elementor-widget-container > p {
	max-width: 68ch;
}

/* --------------------------------------------------------------------------
   Button feedback

   Astra and Elementor now agree on the button's resting state, which leaves
   hover with nothing to say. Rather than swapping the fill, the button dims
   the way the header's call button does, so every button on the site answers
   the pointer in the same voice.
   -------------------------------------------------------------------------- */

.elementor-button,
.ast-button,
.ast-custom-button,
.wp-block-button__link {
	transition: opacity 200ms var(--ejd-ease), transform 90ms cubic-bezier(0.4, 0, 0.6, 1);
}

.elementor-button:hover,
.elementor-button:focus,
.ast-button:hover,
.ast-button:focus,
.ast-custom-button:hover,
.wp-block-button__link:hover,
.wp-block-button__link:focus {
	opacity: 0.88;
}

.elementor-button:active,
.ast-button:active,
.wp-block-button__link:active {
	transform: scale(0.98);
}

@media (prefers-reduced-motion: reduce) {
	.elementor-button,
	.ast-button,
	.ast-custom-button,
	.wp-block-button__link {
		transition: none;
	}

	.elementor-button:active,
	.ast-button:active,
	.wp-block-button__link:active {
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Cross-site nav link

   "Saelg din bolig" points at the sales site, so it is not a peer of the
   other menu items. It sits beside the call button in the same treatment the
   sales site gives its own link back here: plain white type, an outward arrow,
   no fill.

   Below the wide desktop breakpoint there is no room for it beside a centred
   menu, so it folds back into the nav as an ordinary item. The two rules are
   exclusive, so the link is present exactly once at every width.
   -------------------------------------------------------------------------- */

.ejd-nav-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: "Montserrat", sans-serif;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 1.5;
	white-space: nowrap;
	color: #ffffff;
	background: transparent;
	border-radius: var(--ejd-radius-md);
	padding: 10px 14px;
	transition: opacity 200ms var(--ejd-ease), transform 90ms cubic-bezier(0.4, 0, 0.6, 1);
}

#masthead .ejd-nav-link:hover,
#masthead .ejd-nav-link:focus {
	color: #ffffff;
	opacity: 0.75;
}

.ejd-nav-link:active {
	transform: scale(0.97);
}

.ejd-nav-link svg {
	width: 14px;
	height: 14px;
	flex: none;
	fill: currentColor;
}

/* The right pole holds the link and the call button, 8px apart. Astra pads
   every header element by 10px on each side, which turned the 8px gap into
   28px, so the padding is released here and the gap alone sets the distance. */
body #ast-desktop-header .site-header-above-section-right {
	gap: 8px;
}

body #ast-desktop-header .site-header-above-section-right > * {
	padding-left: 0;
	padding-right: 0;
}

@media (min-width: 1420px) {
	#ast-desktop-header .menu-item-4317 {
		display: none;
	}
}

@media (max-width: 1419px) {
	.ejd-nav-link {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ejd-nav-link {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   Testimonial cards

   Three equal cards in one row, matching the sales site: quote at the top,
   name pinned to the foot, 24px padding, 8px radius, 230px floor so the row
   reads as one band rather than three ragged blocks.

   The fills alternate deep green, teal and mint exactly as the sales site
   does, so a visitor crossing between the two sites meets the same component.
   -------------------------------------------------------------------------- */

.elementor-element-3b9f6d4 > .elementor-container {
	align-items: stretch;
}

.elementor-element-3b9f6d4 .elementor-column > .elementor-widget-wrap,
.elementor-element-3b9f6d4 .elementor-widget-testimonial,
.elementor-element-3b9f6d4 .elementor-widget-testimonial > .elementor-widget-container {
	height: 100%;
}

.elementor-element-3b9f6d4 .elementor-testimonial-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 24px;
	height: 100%;
	min-height: 230px;
	padding: 24px;
	border-radius: 8px;
	text-align: left;
}

.elementor-element-3b9f6d4 .elementor-testimonial-content {
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	line-height: 1.55;
	margin: 0;
}

.elementor-element-3b9f6d4 .elementor-testimonial-meta,
.elementor-element-3b9f6d4 .elementor-testimonial-meta-inner,
.elementor-element-3b9f6d4 .elementor-testimonial-details {
	margin: 0;
	padding: 0;
	text-align: left;
}

.elementor-element-3b9f6d4 .elementor-testimonial-name {
	font-family: "Montserrat", sans-serif;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.5;
}

.elementor-element-6aad2c96 .elementor-testimonial-wrapper {
	background: #145D5F;
}

.elementor-element-3759e7a5 .elementor-testimonial-wrapper {
	background: #007F80;
}

.elementor-element-5a9d985d .elementor-testimonial-wrapper {
	background: #B4D4D1;
}

.elementor-element-6aad2c96 .elementor-testimonial-content,
.elementor-element-6aad2c96 .elementor-testimonial-name,
.elementor-element-3759e7a5 .elementor-testimonial-content,
.elementor-element-3759e7a5 .elementor-testimonial-name {
	color: #FFFFFF;
}

.elementor-element-5a9d985d .elementor-testimonial-content,
.elementor-element-5a9d985d .elementor-testimonial-name {
	color: #1C2B2B;
}

/* The centred intro keeps a readable measure under the heading. */
.elementor-element-5eb2f961 .elementor-widget-container > p,
.elementor-element-5eb2f961 .elementor-widget-container {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}

/* Elementor fills an empty testimonial image with its own placeholder.png.
   The sales site shows no placeholder avatar, so it is removed here rather
   than left as a grey disc beside every name. */
.elementor-element-3b9f6d4 .elementor-testimonial-wrapper .elementor-testimonial-meta .elementor-testimonial-image {
	display: none;
}

/* --------------------------------------------------------------------------
   Testimonial hover lift

   The sales site raises its cards 4px under the pointer with a shadow tinted
   to the dark end of the palette. Same distance, same 260ms curve, same
   shadow.

   Gated behind (hover: hover) exactly as it is there: without that gate a
   touch device keeps the lifted state after a tap, because there is no
   pointer to move away.
   -------------------------------------------------------------------------- */

@media (hover: hover) {
	.elementor-element-3b9f6d4 .elementor-testimonial-wrapper {
		transition: transform 260ms var(--ejd-ease), box-shadow 260ms var(--ejd-ease);
	}

	.elementor-element-3b9f6d4 .elementor-testimonial-wrapper:hover {
		transform: translateY(-4px);
		box-shadow: 0 18px 38px -18px rgba(20, 45, 45, 0.42);
	}

	.elementor-element-3b9f6d4 .elementor-testimonial-wrapper:active {
		transform: translateY(-4px) scale(0.97);
	}
}

@media (prefers-reduced-motion: reduce) {
	.elementor-element-3b9f6d4 .elementor-testimonial-wrapper,
	.elementor-element-3b9f6d4 .elementor-testimonial-wrapper:hover,
	.elementor-element-3b9f6d4 .elementor-testimonial-wrapper:active {
		transition: none;
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Display tracking

   Montserrat drifts apart at display sizes. The sales site sets -0.022em on
   its hero and -0.016em on its section headings; without it the same face at
   the same weight reads noticeably looser, which is what made the two sites
   feel like they used different type.

   Set in em so it scales with whatever size each heading ends up at, and kept
   at low specificity on purpose: any heading that carries its own tracking
   from Elementor still wins.
   -------------------------------------------------------------------------- */

h1 {
	letter-spacing: -0.022em;
}

h2 {
	letter-spacing: -0.016em;
}

h3,
h4 {
	letter-spacing: -0.01em;
}
