/*
Theme Name: Latitude Key Child
Theme URI: https://latkey.acxcomdev.com
Description: Child theme of Hello Elementor for Latitude Key. The booking-engine visual styling lives in assets/lk-booking-style.css (kept separate on purpose — the LK Booking Engine plugin ships layout-only CSS, all visual style is here). To be refined later.
Author: ACXCOM
Template: hello-elementor
Version: 1.0.20
Text Domain: latkey-child
*/

/* Base child-theme styles can go here. Booking-engine styling is in
   assets/lk-booking-style.css so it can be revised independently. */

/* Space between a page's content and the "List your property" CTA (Elementor template 285),
   managed by the content, not the CTA: section standard 124 / 96 / 64 (client, 2026-10-29).
   Theme and plugin templates pad their wrapper with it; Elementor pages set the same values
   on their last container. */
:root { --lk-cta-gap: 124px; }
@media (max-width: 1024px) { :root { --lk-cta-gap: 96px; } }
@media (max-width: 767px) { :root { --lk-cta-gap: 64px; } }

/* Current-weather widget — output by the [lk_weather] shortcode (functions.php).
   Colour inherits so it adapts to wherever it is placed (e.g. white in the hero
   top bar, dark on a light section). */
.lk-weather {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	font-family: "Work Sans", system-ui, sans-serif;
	font-weight: 500;
	line-height: 1;
	color: inherit;
	white-space: nowrap;
}
.lk-weather__icon { font-size: 1.12em; }
.lk-weather__temp { letter-spacing: .02em; }
.lk-weather__label { opacity: .85; margin-right: .1em; }

/* ---- Buttons: pill ends, matching the design standards (/docs/stylesheet/).
   The Elementor global kit still ships a 10px radius, so this enforces the
   documented fully-rounded (999px) radius on every Elementor button site-wide.
   (If the kit's Button border-radius is later set to 999px in Site Settings,
   this rule becomes redundant and can be removed.) ---- */
.elementor-button { border-radius: 999px !important; }

/* Note: the heading font (Playfair Display) is now set natively in the Elementor
   kit (Site Settings › Global Fonts › Primary), so the former child-theme
   override of --e-global-typography-primary-font-family has been removed. Every
   Elementor heading inherits Playfair from the kit variable. */

/* ---- Heading colour: Ink (#16303C) per the design standards, not the kit's
   Primary (blue). The general rule beats the kit's global heading colour;
   per-element overrides (hero titles white, Elegance/Privacy labels cream) keep
   their higher specificity, so the hero is untouched. The #lk-about rule beats
   that section title's own default colour. Stop-gap until the kit's heading
   colour is set to Ink. ---- */
body .elementor-widget-heading .elementor-heading-title { color: #16303C; }

/* ---- "The Latitude Key Standard" (#lk-about title): colour = Ink, and force
   Playfair Display. Elementor baked a stale per-element rule into the generated
   post CSS ( .elementor-10 .elementor-element-a1786a1 … { font-family:"Libre
   Baskerville" } , specificity 0,4,0) from an earlier font choice, which the kit
   global variable can't beat. This #lk-about rule (1,1,0) overrides it without
   !important, changing only the family (size/weight/line-height are untouched).
   Redundant once that element is re-saved clean in Elementor. ---- */
#lk-about .elementor-heading-title { color: #16303C; font-family: "Playfair Display", Georgia, serif; margin-bottom: 34px; }

/* ============================================================================
   Section-title SIZE — one global rule so every section heading (About,
   Collections, Properties) is identical on desktop AND mobile. clamp() = 34px on
   mobile, scaling up to 44px on desktop. This is the single source of truth for
   title size (hero.css keeps only colour/alignment). The #lk-about selector
   (1 id) also overrides that title's old per-element size. Apply this same
   selector pattern to any new section title so sizes stay constant everywhere.
   ========================================================================== */
#lk-about .elementor-heading-title,
#lk-collections > .e-con-inner > .elementor-widget-heading .elementor-heading-title,
#lk-properties > .e-con-inner > .elementor-widget-heading .elementor-heading-title {
	font-size: clamp(34px, 4vw, 44px);
}

/* "Recent additions" (#lk-properties) — white section framed by a thin rule at
   the TOP and BOTTOM of its content box (.e-con-inner), same Line colour #E3E8EA
   as the footer divider, at the content width (boxed), not full bleed. */
#lk-properties > .e-con-inner { position: relative; }
#lk-properties > .e-con-inner::before,
#lk-properties > .e-con-inner::after {
	content: ""; position: absolute; left: 0; right: 0;
	border-top: 1px solid #E3E8EA;
}
#lk-properties > .e-con-inner::before { top: 0; }
#lk-properties > .e-con-inner::after { bottom: 0; }

/* ============================================================================
   Global footer (#lk-footer) — the "Latitude Key Footer" Elementor template,
   rendered site-wide by the child footer.php. White with a soft top shadow; the
   logo emblem straddles the top edge; 3 widget-area columns (footer-1/2/3), a
   divider, then the copyright row. The emblem-overhang values are a first pass —
   fine-tune visually.
   ========================================================================== */
#lk-footer { position: relative; overflow: visible; box-shadow: 0 -10px 30px -14px rgba(16, 42, 56, .18); }

/* Emblem — centered, straddling the footer's top edge. */
#lk-footer .elementor-element-f001010 { margin-top: -84px; margin-bottom: 26px; text-align: center; }
#lk-footer .elementor-element-f001010 img { width: 210px; max-width: 55%; height: auto; }

/* 3 columns in a 2:1:1 ratio (col1 = 2/4 wide, col2 & col3 = 1/4 each), like the
   mockup — Newsletter wide on the left, two link columns on the right. Collapses
   to a single column on mobile. */
#lk-footer-cols { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px 48px; align-items: start; }
#lk-footer-cols > .e-con { min-width: 0; }

/* Column heading (before_title from register_sidebar) + links. */
.lk-footer-widget-title { font-family: "Playfair Display", Georgia, serif; color: #16303C; font-size: 20px; font-weight: 400; margin: 0 0 18px; letter-spacing: .01em; }
.lk-footer-widget { font-family: "Work Sans", system-ui, sans-serif; color: #5B6B73; font-size: 14px; line-height: 1.5; }
.lk-footer-widget a { color: #16303C; text-decoration: none; transition: color .16s ease; }
.lk-footer-widget a:hover { color: #5581A2; }
.lk-footer-widget ul { list-style: none; margin: 0; padding: 0; }
.lk-footer-widget li { margin: 0 0 10px; text-transform: uppercase; letter-spacing: .06em; font-size: 13px; }

/* Social icons — reuses the drawer markup + .lk-drawer__social class; the style
   is duplicated here (mirrors header.css) so the footer never depends on
   header.css being loaded. Centered. */
#lk-footer-social { margin: 30px 0 0; }
#lk-footer-social .lk-drawer__social { display: flex; justify-content: center; gap: 16px; margin: 0; }
#lk-footer-social .lk-drawer__social a { color: #16303C; opacity: .85; text-decoration: none; transition: opacity .16s ease, color .16s ease; }
#lk-footer-social .lk-drawer__social a:hover { opacity: 1; color: #5581A2; }
#lk-footer-social .lk-drawer__social svg { width: 26px; height: 26px; }   /* +30% vs the drawer's 20px (footer only) */

/* Newsletter subscribe form ([lk_newsletter], footer left column). Scoped +
   !important on the pill/radius/fill so it beats the Elementor kit's global
   <button>/<input> styling. */
.lk-newsletter { margin: 6px 0 0; max-width: 360px; }
.lk-newsletter-intro { margin: 0 0 12px; font-family: "Work Sans", system-ui, sans-serif; font-size: 14px; line-height: 1.5; color: #5B6B73; }
/* Field + button fused into a single "all-in-one" pill: the row is the outline
   (border + 999px), the input is transparent inside it, and the button sits
   inset on the right as a rounded pill. */
.lk-newsletter-row {
	display: flex; align-items: stretch;
	background: #fff; border: 1px solid #E3E8EA; border-radius: 999px;
	transition: border-color .16s ease, box-shadow .16s ease;
}
.lk-newsletter-row:focus-within { border-color: #90CAA0; box-shadow: 0 0 0 2px rgba(144, 202, 160, .4); }
.lk-newsletter .lk-newsletter-email {
	flex: 1 1 auto; min-width: 0;
	font-family: "Work Sans", system-ui, sans-serif; font-size: 14px; color: #16303C;
	background: transparent !important; border: 0 !important; border-radius: 999px 0 0 999px !important;
	padding: 11px 8px 11px 18px; box-shadow: none !important;
}
.lk-newsletter .lk-newsletter-email::placeholder { color: #8A98A0; }
.lk-newsletter .lk-newsletter-email:focus { outline: none !important; box-shadow: none !important; }
.lk-newsletter .lk-newsletter-btn {
	flex: 0 0 auto; cursor: pointer;
	font-family: "Work Sans", system-ui, sans-serif; font-size: 13px; font-weight: 600; letter-spacing: .04em;
	color: #fff !important; background: #5581A2 !important; border: 0 !important; border-radius: 999px !important;
	padding: 10px 22px; margin: 3px; box-shadow: none !important;
	transition: background-color .16s ease;
}
.lk-newsletter .lk-newsletter-btn:hover { background: #3C617D !important; }
.lk-newsletter-hint { margin: 8px 0 0; font-size: 12px; color: #E0A43A; }   /* admin-only preview note */
@media (max-width: 767px) { .lk-newsletter { max-width: 100%; } }

/* Social icons (centred) + certification/award badges (right) share one band.
   The row wrapper is injected in functions.php › lk_inject_footer_badges:
   [1fr — real estate partner logo, under Newsletter] [social — centred] [1fr — badges pushed right]. */
.lk-footer-social-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; margin: 30px 0 0; }
.lk-footer-social-row #lk-footer-social { grid-column: 2; margin: 0; }
.lk-footer-badges { grid-column: 3; justify-self: end; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 14px 20px; margin: 0; }
/* !important beats Elementor's `.elementor img { height:auto }` (which would
   otherwise render the badges at full natural size). */
.lk-footer-badge { height: 88px !important; width: auto !important; max-width: 100%; display: block; }
/* Real estate partner (inc/lk-partner.php): "Proud partner of" + the black logo, linked, left cell. */
.lk-footer-social-row .lk-footer-partner { grid-column: 1; grid-row: 1; justify-self: start; margin-left: 20px; /* = the Newsletter column's inner padding: aligned with its title */ display: flex; flex-direction: column; gap: 8px; text-decoration: none !important; }
.lk-footer-partner__label { font: 600 11px/1.3 "Work Sans", system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #5B6B73; transition: color .2s ease; }
.lk-footer-partner:hover .lk-footer-partner__label,
.lk-footer-partner:focus-visible .lk-footer-partner__label { color: #16303C; }
.lk-footer-partner__logo { width: 220px !important; max-width: 100%; height: auto !important; display: block; opacity: .85; transition: opacity .2s ease; }
.lk-footer-partner:hover .lk-footer-partner__logo,
.lk-footer-partner:focus-visible .lk-footer-partner__logo { opacity: 1; }
.lk-footer-partner:focus-visible { outline: 2px solid #5581A2; outline-offset: 6px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { .lk-footer-partner__label, .lk-footer-partner__logo { transition: none; } }
@media (max-width: 900px) {
	/* Narrow: stack — social centred, badges centred below, partner centred last. */
	.lk-footer-social-row { grid-template-columns: 1fr; gap: 20px; }
	.lk-footer-social-row #lk-footer-social { grid-column: 1; }
	.lk-footer-badges { grid-column: 1; justify-self: center; justify-content: center; }
	.lk-footer-badge { height: 66px !important; }
	.lk-footer-social-row .lk-footer-partner { grid-column: 1; grid-row: auto; order: 3; justify-self: center; align-items: center; margin-left: 0; }
	.lk-footer-partner__logo { width: 190px !important; }
}

/* Divider — replaced by the dark credit strip (its top edge is the separator). */
#lk-footer-sep { display: none; }

/* Bottom credit strip: copyright (left) + service regions (right). The STRIP stays
   at the footer content width, so its two texts line up with the columns above. The
   dark Ink band is painted full-bleed with a horizontal box-shadow — which, unlike a
   100vw element, never creates a horizontal scrollbar. Removing the footer inner's
   bottom padding lets the strip (and its band) run to the very bottom (no white under
   it). flex-direction:row is forced because the Elementor container (.e-con) defaults
   to column; the widgets are shrunk to content so justify-content pushes them apart. */
#lk-footer > .e-con-inner { padding-bottom: 0; }
#lk-footer-bottom {
	box-sizing: border-box;
	display: flex !important; flex-direction: row !important; flex-wrap: wrap;
	justify-content: space-between; align-items: center; gap: 8px 24px;
	margin-top: 44px; padding: 22px 0;
	background: #16303C;
	box-shadow: -50vw 0 0 #16303C, 50vw 0 0 #16303C;
}
#lk-footer-bottom > .elementor-element { width: auto !important; flex: 0 0 auto; margin: 0; }
#lk-footer-bottom p { margin: 0; font-family: "Work Sans", system-ui, sans-serif; font-size: 13px; letter-spacing: .01em; text-transform: none; color: #9AA7AE; }
/* Desktop/tablet: keep the right-hand text clear of the floating accessibility button
   (onetap, bottom-right corner) that sits over the very bottom of the page. */
@media (min-width: 768px) { #lk-footer-bottom { padding-right: 76px; } }

@media (max-width: 767px) {
	#lk-footer-cols { grid-template-columns: 1fr; }
	#lk-footer-bottom { justify-content: center; text-align: center; }
	/* More breathing room under the logo emblem on mobile. */
	#lk-footer .elementor-element-f001010 { margin-bottom: 86px; }
	/* The dark strip runs to the very bottom; its own padding (not the footer's)
	   clears the fixed mobile contact band (~69px) so the credit isn't hidden. */
	#lk-footer { padding-bottom: 0; }
	#lk-footer-bottom { margin-top: 34px; padding-bottom: 90px; }
}

/* ============================================================================
   Owners CTA — "list your property" invitation, site-wide, just above the
   footer. Full-bleed background photo with a cream card overlaid on the right
   (Relais & Châteaux-style). Rendered by the wp_footer hook (child default, or
   the "Latitude Key Owners CTA" Elementor template if one exists — give that
   section the CSS id `lk-owners` and its card `lk-owners-card` to inherit this).
   ========================================================================== */
#lk-owners {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 540px;
	padding: 90px 20px;
	/* The background-image is set inline on the section (in the wp_footer fallback
	   and the Elementor HTML widget) so an admin can swap the photo there. */
	background-color: #16303C;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	/* No top margin: it's a full-bleed photo band, so it butts against the section
	   above (the white gap there was unnecessary). */
	margin-top: 0;
}
/* Soft left-to-right wash so the card side stays legible over any photo. */
#lk-owners::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(16, 42, 56, .45) 0%, rgba(16, 42, 56, .06) 45%, rgba(16, 42, 56, 0) 70%);
	pointer-events: none;
}
#lk-owners-inner {
	position: relative;
	z-index: 1;
	width: min(80%, 1464px);
	margin-inline: auto;
	display: flex;
	justify-content: flex-end;
}
#lk-owners-card {
	max-width: 430px;
	background: rgba(247, 244, 238, .85);   /* cream, 0.85 opacity */
	padding: 42px 40px 36px;
	box-shadow: 0 30px 70px -24px rgba(16, 42, 56, .55);
	border-radius: 3px;
}
.lk-owners-eyebrow {
	margin: 0 0 14px;
	font-family: "Work Sans", system-ui, sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #5581A2;
}
.lk-owners-title {
	margin: 0 0 16px;
	font-family: "Playfair Display", Georgia, serif;
	font-size: clamp(26px, 3vw, 34px);
	line-height: 1.15;
	font-weight: 700;
	color: #16303C;
}
.lk-owners-text {
	margin: 0 0 22px;
	font-family: "Work Sans", system-ui, sans-serif;
	font-size: 15px;
	line-height: 1.65;
	color: #16303C;
}
/* ============================================================================
   Shared inline "arrow link" — ONE consistent treatment for every text link of
   this kind across the site: accordion "Learn more" (.lk-acc-link), brochure
   "Download Brochure" (#lk-brochure-text .elementor-button) and owners
   "Discover your property's potential" (.lk-owners-cta). Uppercase Work Sans, a
   border-bottom underline, a single trailing → arrow that nudges on hover, and
   no extra kit underline on hover. Colour is contextual (set per placement).
   New links can just use class .lk-link; the accordion (plugin) and brochure
   (Elementor button) links are aliased so they share the exact same style.
   ========================================================================== */
.lk-link,
.lk-acc-link,
#lk-brochure-text .elementor-button,
#lk-owners .lk-owners-cta {
	display: inline-flex; align-items: center; gap: 10px; width: auto;
	font-family: "Work Sans", system-ui, sans-serif !important;
	font-size: 13px !important; font-weight: 600 !important;
	letter-spacing: .12em; text-transform: uppercase; line-height: 1.3;
	text-decoration: none !important;
	background: transparent !important; box-shadow: none !important;
	border: 0 !important; border-radius: 0 !important; min-height: 0 !important;
	padding: 0 0 6px !important;
	border-bottom: 1px solid currentColor !important;
	transition: gap .16s ease, color .16s ease;
}
/* One trailing arrow (the ::after is the single, consistent indicator — any
   per-widget chevron/arrow is removed at its own selector so it isn't doubled). */
.lk-link::after,
.lk-acc-link::after,
#lk-brochure-text .elementor-button::after,
#lk-owners .lk-owners-cta::after {
	content: "\2192"; font-size: 15px; line-height: 1; font-weight: 400;
}
/* The owners markup already prints a → in a <span>; hide it. */
#lk-owners .lk-owners-cta > span { display: none !important; }
.lk-link:hover,
.lk-acc-link:hover,
#lk-brochure-text .elementor-button:hover,
#lk-owners .lk-owners-cta:hover { gap: 14px; }
/* Contextual colours (the border + arrow follow currentColor). The accordion
   link's white colour lives with the accordion in lk-booking-style.css. */
#lk-brochure-text .elementor-button { color: #16303C !important; }
#lk-brochure-text .elementor-button:hover { color: #5581A2 !important; }
#lk-owners .lk-owners-cta { color: #3C617D !important; }   /* AA-legible link blue on the cream card */
#lk-owners .lk-owners-cta:hover { color: #16303C !important; }
@media (prefers-reduced-motion: reduce) {
	.lk-link:hover, .lk-acc-link:hover,
	#lk-brochure-text .elementor-button:hover, #lk-owners .lk-owners-cta:hover { gap: 10px; }
}
@media (max-width: 767px) {
	#lk-owners { min-height: 0; padding: 62px 20px; align-items: flex-end; }   /* mobile: uniform 62px vertical + 20px side margin (matches the home sections) */
	#lk-owners::before { background: linear-gradient(180deg, rgba(16, 42, 56, 0) 0%, rgba(16, 42, 56, .5) 100%); }
	#lk-owners-inner { width: 100%; justify-content: center; }
	#lk-owners-card { max-width: 100%; padding: 32px 24px 28px; }
}

/* ============================================================================
   Currency selector (display-only conversion; payment is always in USD).
   Rendered by the "LK Currency selector" widget (any widget area) and in the
   results toolbar. Styled to the design standards: Work Sans, Ink text, Line
   border, pill field, Corporate Blue focus. The label inherits the surrounding
   colour (dark footer OR light toolbar); the <select> is self-contained (white
   field) so it reads anywhere. The estimate notice is a Warning-style callout.
   ========================================================================== */
.lkbe-currency { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lkbe-currency-label { font-family: "Work Sans", system-ui, sans-serif; font-size: .85rem; color: inherit; opacity: .85; }
.lkbe-currency-select {
	font-family: "Work Sans", system-ui, sans-serif; font-size: .9rem; line-height: 1.2;
	padding: 7px 14px; border-radius: 999px; border: 1px solid #E3E8EA;
	background: #fff; color: #16303C; cursor: pointer;
}
.lkbe-currency-select:hover { border-color: #C7D0D4; }
.lkbe-currency-select:focus-visible { outline: none; border-color: #5581A2; box-shadow: 0 0 0 3px rgba( 85, 129, 162, .2 ); }

/* "Estimates only" notice — Warning callout (Status Warning #E0A43A). Self-contained
   so it reads on any background (footer + checkout). */
.lkbe-currency-note {
	flex-basis: 100%; margin: 10px 0 0; padding: 9px 13px;
	border-radius: 10px; background: #FCF3DE; border: 1px solid #F0DAA6;
	border-left: 3px solid #E0A43A; color: #7A5714;
	font-family: "Work Sans", system-ui, sans-serif; font-size: .8rem; line-height: 1.45; opacity: 1;
}

/* Results-toolbar placement: sit at the end of the row; the warning lives in the
   footer + checkout instead of crowding the filters bar. */
.lkbe-currency-slot-toolbar { flex: 0 0 auto; margin-left: auto; align-self: center; }
.lkbe-currency-slot-toolbar .lkbe-currency { margin: 0; position: relative; align-items: center; }

/* Toolbar mention: a transient Warning popup below the selector (shown 5s by
   lk-currency.js, then hidden). Self-contained callout, floats above the results. */
.lkbe-currency-pop {
	position: absolute; top: calc(100% + 8px); right: 0; z-index: 60;
	width: max-content; max-width: 300px;
	padding: 9px 13px; border-radius: 10px;
	background: #FCF3DE; border: 1px solid #F0DAA6; border-left: 3px solid #E0A43A; color: #7A5714;
	font-family: "Work Sans", system-ui, sans-serif; font-size: .8rem; line-height: 1.4;
	box-shadow: 0 8px 24px rgba( 16, 42, 56, .18 );
	opacity: 0; transform: translateY( -4px );
	transition: opacity .2s ease, transform .2s ease;
	pointer-events: none;
}
.lkbe-currency-pop.is-shown { opacity: 1; transform: translateY( 0 ); }
@media (prefers-reduced-motion: reduce) {
	.lkbe-currency-pop { transition: none; transform: none; }
}

/* Currency widget: extra top spacing in the footer column on desktop. */
@media (min-width: 1025px) {
	.lk-footer-widget.lkbe-currency-widget { margin-top: 45px; }
}

/* Footer widget: match the newsletter field width (360px); label above, field
   fills the width. Toolbar + checkout selectors are unaffected. */
.lkbe-currency-widget .lkbe-currency { display: block; max-width: 360px; }
.lkbe-currency-widget .lkbe-currency-label { display: block; margin-bottom: 8px; }
.lkbe-currency-widget .lkbe-currency-select { width: 100%; }

/* ============================================================================
   Gravity Forms (Contact page) — design-standards look: Work Sans, uppercase
   muted labels, pill fields 48px with a Corporate Green focus ring, textarea at
   the card radius, and the site-wide outline button. Scoped to .gform_wrapper (with a
   body prefix: the Elementor kit CSS loads later at equal specificity) so the booking
   engine's own forms are untouched.
   ========================================================================== */
body .gform_wrapper.gravity-theme .gform_fields { grid-row-gap: 18px; }
body .gform_wrapper.gravity-theme .gfield_label,
body .gform_wrapper.gravity-theme .gform-field-label {
	font-family: "Work Sans", system-ui, sans-serif; font-size: 12px; font-weight: 600;
	letter-spacing: .1em; text-transform: uppercase; color: #5B6B73; margin-bottom: 6px;
}
body .gform_wrapper.gravity-theme .gfield_required { color: #5B6B73; font-weight: 400; text-transform: none; letter-spacing: 0; }
body .gform_wrapper.gravity-theme .ginput_complex label,
body .gform_wrapper.gravity-theme .gform-field-label--type-sub { font-size: 12px; color: #5B6B73; margin-top: 6px; }
body .gform_wrapper.gravity-theme input[type="text"],
body .gform_wrapper.gravity-theme input[type="email"],
body .gform_wrapper.gravity-theme input[type="tel"],
body .gform_wrapper.gravity-theme select {
	font-family: "Work Sans", system-ui, sans-serif; font-size: 15px; color: #16303C;
	height: 48px; padding: 0 16px; border: 1px solid #E3E8EA; border-radius: 999px; background: #fff;
}
body .gform_wrapper.gravity-theme textarea {
	font-family: "Work Sans", system-ui, sans-serif; font-size: 15px; color: #16303C; line-height: 1.6;
	padding: 14px 16px; border: 1px solid #E3E8EA; border-radius: 14px; background: #fff; min-height: 160px;
}
body .gform_wrapper.gravity-theme input::placeholder,
body .gform_wrapper.gravity-theme textarea::placeholder { color: #5B6B73; }
body .gform_wrapper.gravity-theme input:hover,
body .gform_wrapper.gravity-theme textarea:hover { border-color: #90CAA0; }
body .gform_wrapper.gravity-theme input:focus,
body .gform_wrapper.gravity-theme textarea:focus { outline: none; border-color: #90CAA0; box-shadow: 0 0 0 2px rgba(144,202,160,.4); }
/* Submit: the site's outline button (About Us on the home page). */
body .gform_wrapper.gravity-theme .gform_footer { margin-top: 8px; padding: 0; }
body .gform_wrapper.gravity-theme input[type="submit"].gform_button,
body .gform_wrapper.gravity-theme button.gform_button {
	font-family: "Work Sans", system-ui, sans-serif; font-size: 15px; font-weight: 600; letter-spacing: .01em;
	color: #5581A2; background: transparent; border: 1px solid #5581A2; border-radius: 999px;
	padding: 13px 26px; cursor: pointer; transition: background .16s ease, color .16s ease;
}
body .gform_wrapper.gravity-theme input[type="submit"].gform_button:hover,
body .gform_wrapper.gravity-theme input[type="submit"].gform_button:focus-visible,
body .gform_wrapper.gravity-theme button.gform_button:hover,
body .gform_wrapper.gravity-theme button.gform_button:focus-visible { color: #fff; background: #5581A2; border-color: #5581A2; }
/* Validation + confirmation in the site's status colours and type. */
body .gform_wrapper.gravity-theme .gfield_validation_message,
body .gform_wrapper.gravity-theme .validation_message { font-family: "Work Sans", system-ui, sans-serif; font-size: 13.5px; color: #C0453B; background: transparent; border: 0; padding: 4px 0 0; }
body .gform_wrapper.gravity-theme .gfield_error input,
body .gform_wrapper.gravity-theme .gfield_error textarea { border-color: #C0453B; }
body .gform_wrapper.gravity-theme .gform_validation_errors { border-radius: 14px; }
body .gform_confirmation_message { font-family: "Work Sans", system-ui, sans-serif; font-size: 17px; line-height: 1.6; color: #16303C; padding: 24px 28px; background: #F1F5F7; border-radius: 14px; }
/* Hide the "* indicates required fields" legend above the form. */
body .gform_wrapper.gravity-theme .gform_required_legend { display: none; }

/* ===== Owner income-estimate form (#gform_wrapper_2): multi-page buttons,
   number fields and the amenities grid. Scoped to this form so the Contact form
   is untouched; !important beats Elementor's global button skin on /owners/. ===== */
/* "Continue" (next) + final submit: filled Corporate Blue pill — a stronger CTA
   for this lead form (the shared submit elsewhere stays the outline style). */
body #gform_wrapper_2 input[type="submit"].gform_next_button,
body #gform_wrapper_2 input[type="submit"].gform_button,
body #gform_wrapper_2 button.gform_next_button,
body #gform_wrapper_2 button.gform_button {
	color: #fff !important; background: #5581A2 !important; border: 1px solid #5581A2 !important;
	border-radius: 999px !important; padding: 14px 30px !important; font-weight: 600 !important;
	font-family: "Work Sans", system-ui, sans-serif !important; cursor: pointer !important;
	transition: background .16s ease, border-color .16s ease !important;
}
body #gform_wrapper_2 input[type="submit"].gform_next_button:hover,
body #gform_wrapper_2 input[type="submit"].gform_button:hover,
body #gform_wrapper_2 button.gform_next_button:hover,
body #gform_wrapper_2 button.gform_button:hover { background: #16303C !important; border-color: #16303C !important; }
/* No "Previous" button on this form. */
body #gform_wrapper_2 .gform_previous_button { display: none !important; }
/* Page footer: Previous left, Next right. */
body #gform_wrapper_2 .gform_page_footer { display: flex; gap: 12px; align-items: center; margin-top: 10px; }
body #gform_wrapper_2 .gform_page_footer .gform_next_button { margin-left: auto; }
/* Number fields (Bedrooms/Bathrooms) — match the pill inputs, kept compact. */
body #gform_wrapper_2 input[type="number"] {
	font-family: "Work Sans", system-ui, sans-serif; font-size: 15px; color: #16303C;
	height: 48px; padding: 0 16px; border: 1px solid #E3E8EA; border-radius: 999px; background: #fff; width: 100%;
}
body #gform_wrapper_2 input[type="number"]:hover { border-color: #90CAA0; }
body #gform_wrapper_2 input[type="number"]:focus { outline: none; border-color: #90CAA0; box-shadow: 0 0 0 2px rgba(144,202,160,.4); }
/* Amenities: two-column checkbox grid (one column on phones). */
body #gform_wrapper_2 .gfield_checkbox { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 20px; }
@media (max-width: 600px) { body #gform_wrapper_2 .gfield_checkbox { grid-template-columns: 1fr; } }

/* ===== Vacasa-style inline layout: fields on the left, a small "Continue" button
   on the right. Page 1 (single address) + Page 2 (3 fields in a row). Page 3 stays
   stacked (default). ===== */
body #gform_wrapper_2 #gform_page_2_1,
body #gform_wrapper_2 #gform_page_2_2 {
	display: grid; grid-template-columns: 1fr auto; align-items: end; column-gap: 16px;
}
body #gform_wrapper_2 #gform_page_2_1 .gform_page_footer,
body #gform_wrapper_2 #gform_page_2_2 .gform_page_footer {
	margin: 0; padding: 0; min-height: 0; display: flex; align-items: center;
}
/* Inline "Continue" buttons → a round chevron icon button (the site's chevron
   style, same SVG as the #lk-collections slider). The 48px circle lines up with
   the pill inputs. The "Continue" text stays in the DOM (hidden) for a11y. */
body #gform_wrapper_2 #gform_page_2_1 .gform_next_button,
body #gform_wrapper_2 #gform_page_2_2 .gform_next_button {
	width: 48px !important; height: 48px !important; padding: 0 !important; margin: 0 !important; border-radius: 999px !important;
	flex: 0 0 auto; border: 0 !important; background-color: #5581A2 !important;
	font-size: 0 !important; color: transparent !important; line-height: 0 !important; text-indent: -9999px; overflow: hidden;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important; background-position: center !important; background-size: 22px 22px !important;
}
body #gform_wrapper_2 #gform_page_2_1 .gform_next_button:hover,
body #gform_wrapper_2 #gform_page_2_2 .gform_next_button:hover { background-color: #16303C !important; }
/* Page 1 input has a hidden label and sits vertically centred in its row, so the
   button is centred too. Page 2 fields have labels on top (input at the bottom),
   so the button bottom-aligns with the inputs. align-self beats GF stretching the
   footer cell to the full row height (which pushed the button off). */
body #gform_wrapper_2 #gform_page_2_1 { align-items: center; }
body #gform_wrapper_2 #gform_page_2_1 .gform_page_footer { align-self: center !important; }
body #gform_wrapper_2 #gform_page_2_2 .gform_page_footer { align-self: end !important; }
/* One clean address field: drop the redundant "Street Address" sub-label. */
body #gform_wrapper_2 .ginput_container_address label { display: none !important; }
/* Enhanced amenities multi-select ("chosen") → match the pill inputs. */
body #gform_wrapper_2 .chosen-container { font-family: "Work Sans", system-ui, sans-serif; width: 100% !important; }
body #gform_wrapper_2 .chosen-container-multi .chosen-choices {
	min-height: 48px; border: 1px solid #E3E8EA; border-radius: 999px; background: #fff; padding: 5px 14px; box-shadow: none;
}
body #gform_wrapper_2 .chosen-container-active .chosen-choices { border-color: #90CAA0; box-shadow: 0 0 0 2px rgba( 144, 202, 160, .4 ); }
body #gform_wrapper_2 .chosen-container-multi .chosen-choices li.search-choice {
	background: #E2F1E6; border: 0; border-radius: 999px; color: #16303C; padding: 4px 24px 4px 11px; box-shadow: none; margin: 4px 5px 0 0;
}
body #gform_wrapper_2 .chosen-container-multi .chosen-choices li.search-field input { height: 34px; font-family: inherit; }
body #gform_wrapper_2 .chosen-container .chosen-drop { border-color: #E3E8EA; border-radius: 14px; }
body #gform_wrapper_2 .chosen-container .chosen-results li.highlighted { background: #5581A2; }
/* Mobile: stack the small button under the fields again. */
@media (max-width: 782px) {
	body #gform_wrapper_2 #gform_page_2_1,
	body #gform_wrapper_2 #gform_page_2_2 { display: block; }
	body #gform_wrapper_2 #gform_page_2_1 .gform_page_footer,
	body #gform_wrapper_2 #gform_page_2_2 .gform_page_footer { margin-top: 12px; }
}

/* Custom Google Places autocomplete dropdown (owner income-estimate address field). */
body #gform_wrapper_2 .lk-ac-menu {
	position: absolute; left: 0; right: 0; top: calc( 100% + 6px ); z-index: 50;
	background: #fff; border: 1px solid #E3E8EA; border-radius: 16px;
	box-shadow: 0 10px 30px rgba( 16, 48, 60, .14 ); max-height: 300px; overflow-y: auto;
}
body #gform_wrapper_2 .lk-ac-menu[hidden] { display: none; }
body #gform_wrapper_2 .lk-ac-item {
	display: flex; flex-direction: column; gap: 1px; padding: 10px 16px; cursor: pointer;
	font-family: "Work Sans", system-ui, sans-serif;
}
body #gform_wrapper_2 .lk-ac-item:hover,
body #gform_wrapper_2 .lk-ac-item.is-active { background: #EAF2EC; }
body #gform_wrapper_2 .lk-ac-main { color: #16303C; font-size: 15px; line-height: 1.3; }
body #gform_wrapper_2 .lk-ac-sec { color: #5B6B73; font-size: 12.5px; line-height: 1.3; }

/* The estimate form sits in a pale-grey card with its title. */
body #gform_wrapper_2 {
	background: #F1F5F7; border: 1px solid #E3E8EA; border-radius: 20px; padding: 26px 30px;
}
body #gform_wrapper_2 .gform_title {
	font-family: "Playfair Display", serif; color: #16303C; font-weight: 700;
	font-size: clamp( 22px, 3vw, 30px ); line-height: 1.15; margin: 0 0 18px;
}
@media (max-width: 600px) { body #gform_wrapper_2 { padding: 20px 18px; } }

/* Simulated "report generation" over the estimate image (lk-estimate-report.js):
   the image blurs and the loader + final message play on top of it. */
body .lk-estimate-blur { filter: blur( 8px ) brightness( .92 ); transition: filter .4s ease; }
body .lk-estimate-overlay {
	position: absolute; z-index: 6; box-sizing: border-box; overflow: hidden;
	display: flex; align-items: center; justify-content: center; padding: 28px;
	background: linear-gradient( 180deg, rgba( 16, 48, 60, .58 ), rgba( 16, 48, 60, .72 ) );
	color: #fff; opacity: 0; animation: lk-est-fade .4s ease forwards;
}
body .lk-estimate-overlay.is-message { background: linear-gradient( 180deg, rgba( 16, 48, 60, .70 ), rgba( 16, 48, 60, .84 ) ); }
@keyframes lk-est-fade { to { opacity: 1; } }
body .lk-estimate-card { text-align: center; max-width: 320px; }
body .lk-estimate-spinner {
	width: 48px; height: 48px; margin: 0 auto 18px; border-radius: 50%;
	border: 3px solid rgba( 255, 255, 255, .35 ); border-top-color: #fff; animation: lk-est-spin .8s linear infinite;
}
body .lk-estimate-step {
	font-family: "Playfair Display", Georgia, serif; font-size: clamp( 18px, 2.2vw, 22px );
	line-height: 1.3; min-height: 1.5em; text-shadow: 0 1px 10px rgba( 0, 0, 0, .35 );
}
body .lk-estimate-sub { font-family: "Work Sans", system-ui, sans-serif; font-size: .9rem; color: rgba( 255, 255, 255, .85 ); margin-top: 6px; }
body .lk-estimate-bar { height: 6px; width: 220px; max-width: 100%; margin: 20px auto 0; background: rgba( 255, 255, 255, .28 ); border-radius: 999px; overflow: hidden; }
body .lk-estimate-bar > span { display: block; width: 0; height: 100%; background: #fff; border-radius: 999px; }
body .lk-estimate-msg { display: flex; flex-direction: column; align-items: center; gap: 12px; }
body .lk-estimate-msg-ic { width: 40px; height: 40px; color: #90CAA0; }
body .lk-estimate-msg p { font-family: "Work Sans", system-ui, sans-serif; font-size: 1.02rem; line-height: 1.6; margin: 0; text-shadow: 0 1px 10px rgba( 0, 0, 0, .35 ); }
@keyframes lk-est-spin { to { transform: rotate( 360deg ); } }
@media (max-width: 767px) { body .lk-estimate-overlay { align-items: flex-start; padding-top: 44px; } }
@media (prefers-reduced-motion: reduce) {
	body .lk-estimate-spinner { animation: none; }
	body .lk-estimate-bar > span { transition: none !important; width: 100% !important; }
	body .lk-estimate-overlay { animation: none; opacity: 1; }
}
/* While the simulated loader runs, hide GF's own confirmation (the message now lives
   on the image); without JS the confirmation shows normally. */
body.lk-estimate-busy #gform_confirmation_wrapper_2,
body.lk-estimate-busy #gform_wrapper_2 .gform_confirmation_message,
body.lk-estimate-busy .gform_confirmation_message_2 { display: none !important; }

/* Fields stay required (aria-required + validation), but hide the "(Required)" text. */
body #gform_wrapper_2 .gfield_required { display: none !important; }

/* Amenities → compact checkbox dropdown (lk-amenities.js) matching the pill inputs. */
body #gform_wrapper_2 .lk-am { position: relative; }
body #gform_wrapper_2 .lk-am-toggle {
	width: 100%; height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 8px;
	padding: 0 16px; border: 1px solid #E3E8EA; border-radius: 999px; background: #fff;
	font-family: "Work Sans", system-ui, sans-serif; font-size: 15px; color: #16303C; cursor: pointer; text-align: left;
}
body #gform_wrapper_2 .lk-am-toggle:hover { border-color: #90CAA0; }
body #gform_wrapper_2 .lk-am.is-open .lk-am-toggle { border-color: #90CAA0; box-shadow: 0 0 0 2px rgba( 144, 202, 160, .4 ); }
body #gform_wrapper_2 .lk-am-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body #gform_wrapper_2 .lk-am-label.is-placeholder { color: #5B6B73; }
body #gform_wrapper_2 .lk-am-caret { width: 9px; height: 9px; flex: 0 0 auto; border-right: 2px solid #5B6B73; border-bottom: 2px solid #5B6B73; transform: rotate( 45deg ) translate( -2px, -2px ); transition: transform .15s ease; }
body #gform_wrapper_2 .lk-am.is-open .lk-am-caret { transform: rotate( -135deg ); }
body #gform_wrapper_2 .lk-am-panel {
	position: absolute; left: 0; right: 0; top: calc( 100% + 6px ); z-index: 50; background: #fff;
	border: 1px solid #E3E8EA; border-radius: 16px; box-shadow: 0 10px 30px rgba( 16, 48, 60, .14 ); padding: 6px; max-height: 280px; overflow-y: auto;
}
body #gform_wrapper_2 .lk-am-panel[hidden] { display: none; }
body #gform_wrapper_2 .lk-am-opt {
	display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; cursor: pointer;
	font-family: "Work Sans", system-ui, sans-serif; font-size: 14.5px; color: #16303C;
}
body #gform_wrapper_2 .lk-am-opt:hover { background: #EAF2EC; }
body #gform_wrapper_2 .lk-am-opt input { width: 17px; height: 17px; accent-color: #5581A2; flex: 0 0 auto; }

/* Blog archive + single posts (page-header de Hello Elementor) : 55px entre la nav et le
   titre, comme toutes les pages. Le H1 garde sa marge haute de 8px, d ou 47. */
.site-main > .page-header { padding-top: 47px; }

/* ==========================================================================
   Buttons never underline on hover. The Elementor kit underlines EVERY link on
   hover (.elementor-kit-16 a:hover); keep that for text links (accessibility) but
   not for anything shaped as a button: Elementor/WP buttons, theme/plugin buttons
   (*-btn, *button*), chips/filters and pagination. body + a + :is() beats the kit.
   ========================================================================== */
body a:is(.elementor-button, .button, .btn, .wp-element-button, .wp-block-button__link, .page-numbers, [class*="lk-btn"], [class*="-btn"], [class*="_btn"], [class*="button"], [class*="__chip"], [class*="-chip"], [class*="-pill"]):is(:hover, :focus, :focus-visible) {
	text-decoration: none;
}