/*!
Theme Name: sezavi
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: sezavi
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

sezavi is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS (search "SECTION:" to jump; rules are NOT
    strictly grouped - later rules override earlier ones, so do
    not reorder without checking the pages visually)
----------------------------------------------------------------
# Generic: Normalize, Box sizing
# Base: Typography, Elements, Links, Forms
# Components / site sections (in file order):
	- Header & desktop menu, Burger toggle, Mobile navigation
	- Blog, Developer cards, Property cards, Footer
	- Popups (spopup), Buttons, Breadcrumbs, News & FAQ
	- Developer list, Project page, Area pages (ge-*)
	- Filters, YouTube / video, Amenities, Developers grid
# Plugins: Jetpack infinite scroll, WPML
# Utilities: Accessibility, Alignments, u-* helpers (end of file)
# Moved inline styles (end of file)

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */


html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: #4169e1;
}

a:visited {
	color: #800080;
}

a:hover,
a:focus,
a:active {
	color: #191970;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post:not(body),
.page:not(body) {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

.single-post .blog-content .blog-image {
	float: left;
    margin: 0 15px 15px 0;
}

/* ==================== SECTION: Sections / generic blocks ==================== */
.section-lead {
	margin: 1rem auto 1.5rem;
  }
  
  .service a {
	color: #000;
    display: block;
    border: 2px solid #000;
    text-decoration: none;
    font-weight: bold;
    padding: 10px 15px;
    border-radius: 5px;
    max-width: 50%;
    margin: 0 auto;
  }
  
  .service h4 {
	font-weight: 600;
	color: #000;
	font-size: 1.3rem;
	margin: 1rem 0 0.6rem;
  }
  
  .services-grid {
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
  }
  
  .service {
	background: #fff;
    margin: 0;
    padding: 20px;
    border-radius: 5px;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    border: 2px solid #e7e7e7;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
	width: calc(33.3% - 10px);
  }
  
  .service:hover {
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
  }

  .service img {
	border-radius: 5px;
  }
  
  .service1 h4,
  .service1 .cta {
	color: #000;
  }
  
  .service1:hover {
	border: 2px solid #000;
  }
  
  .service2 h4,
  .service2 .cta {
	color: #000;
  }
  
  .service2:hover {
	border: 2px solid #000;
  }
  
  .service3 h4,
  .service3 .cta {
	color: #000;
  }
  
  .service3:hover {
	border: 2px solid #000;
  }
  
  .service .cta span {
	font-size: 0.6rem;
  }
  
  .service > * {
	flex: 1 1 100%;
  }
  
  .service .cta {
	align-self: flex-end;
  }
  
  @media all and (max-width: 900px) {
	.services-grid {
	  display: -webkit-box;
	  display: flex;
	  -webkit-box-orient: vertical;
	  -webkit-box-direction: normal;
	  flex-direction: column;
	}

	.service {
		width: 100%;
	}
  }
  



/* ==========================================================================
   DESIGN SYSTEM · tokens, fonts, base typography
   Принцип: синій = бренд і структура, бірюзово-сірі поверхні = повітря,
   золото = ТІЛЬКИ кнопки, які ведуть до заявки. Нові стилі беруть кольори,
   шрифти й радіуси лише зі змінних --ge-*.
   ========================================================================== */

/* Шрифти (self-hosted, latin / latin-ext / cyrillic через unicode-range) */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap; src: url("fonts/cormorant-garamond-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap; src: url("fonts/cormorant-garamond-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 500 700; font-display: swap; src: url("fonts/cormorant-garamond-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500 700; font-display: swap; src: url("fonts/cormorant-garamond-italic-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500 700; font-display: swap; src: url("fonts/cormorant-garamond-italic-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500 700; font-display: swap; src: url("fonts/cormorant-garamond-italic-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("fonts/manrope-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("fonts/manrope-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("fonts/manrope-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
	/* Бренд: синій (логотип, посилання, активні пункти, футер) */
	--ge-blue-900: #0E1D52;   /* футер, найглибший */
	--ge-blue-800: #142761;   /* заголовки, темні панелі */
	--ge-blue-700: #1C3FA8;   /* посилання, контурні кнопки, активні пункти (9:1 на білому) */
	--ge-blue-500: #4560D8;   /* фокус-кільце, декор (не для дрібного тексту) */
	--ge-blue-100: #E8ECFB;   /* світла синя поверхня, hover вторинних кнопок */
	--ge-logo:     #251B9E;   /* колір чинного логотипа, лише для нього */

	/* Поверхні: спокійний бірюзово-сірий */
	--ge-bg:        #F6F8F8;  /* фон сторінки між секціями */
	--ge-surface:   #FFFFFF;  /* картки, форми */
	--ge-tint:      #E4F0F0;  /* виділені блоки, панелі форм */
	--ge-teal-700:  #0F6B7A;  /* іконки, дрібні мітки, параметри в картках (6:1 на білому) */

	/* Золото: тільки CTA */
	--ge-gold-500: #C9A468;   /* фон CTA-кнопки */
	--ge-gold-600: #B8924F;   /* hover CTA */
	--ge-gold-700: #8A6420;   /* золотий ТЕКСТ на світлому (5:1) */

	/* Текст і лінії */
	--ge-ink:       #0E2530;
	--ge-ink-muted: #4A5B63;  /* 7:1 на білому */
	--ge-line:      #D3DEDF;
	--ge-on-dark:   #FFFFFF;
	--ge-on-dark-muted:  #DCE3FA;
	--ge-on-dark-subtle: #9FB0E8;

	/* Стани */
	--ge-ok:  #1E7B4F;
	--ge-err: #B3261E;

	/* Шрифти */
	--ge-font-display: "Cormorant Garamond", "Baskerville", Georgia, serif;
	--ge-font-body: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	/* Форма */
	--ge-r-sm: 8px;      /* інпути */
	--ge-r-md: 14px;     /* картки */
	--ge-r-lg: 24px;     /* hero, великі панелі */
	--ge-r-pill: 999px;  /* кнопки, бейджі */
	--ge-shadow-card: 0 10px 30px rgba(14, 29, 82, .08);
	--ge-shadow-cta:  0 8px 22px rgba(138, 100, 32, .28);
	--ge-hero-gradient: linear-gradient(105deg, #142761 0%, #1F3790 55%, #4560D8 100%);
	--ge-hero-overlay:  linear-gradient(90deg, rgba(14,29,82,.88) 0%, rgba(20,39,97,.70) 35%, rgba(28,63,168,.30) 65%, rgba(28,63,168,0) 100%);

	/* Bootstrap 5.3: його змінні підхоплюють усі компоненти Bootstrap */
	--bs-primary: var(--ge-blue-700);
	--bs-primary-rgb: 28, 63, 168;
	--bs-body-font-family: var(--ge-font-body);
	--bs-body-color: var(--ge-ink);
	--bs-body-bg: var(--ge-bg);
	--bs-link-color: var(--ge-blue-700);
	--bs-link-hover-color: var(--ge-blue-800);
	--bs-link-color-rgb: 28, 63, 168;
	--bs-link-hover-color-rgb: 20, 39, 97;
	--bs-border-color: var(--ge-line);
	--bs-heading-color: var(--ge-blue-800);
}

body,
button,
input,
select,
optgroup,
textarea {
	font-family: var(--ge-font-body);
	color: var(--ge-ink);
}

body {
	background: var(--ge-bg);
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ge-font-display);
	font-weight: 600;
	color: var(--ge-blue-800);
	line-height: 1.12;
	text-wrap: balance;
}

h1 { font-size: clamp(2.4rem, 1.6rem + 3.4vw, 4rem); }
h2 { font-size: clamp(1.9rem, 1.4rem + 2.1vw, 2.9rem); }
h3 { font-size: clamp(1.45rem, 1.2rem + 1vw, 1.9rem); }
h4 { font-size: 1.2rem; }
h5 {
	font-family: var(--ge-font-body);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

/* Відступи в тексті: рівно такі, як були на сайті (їх задавав Bootstrap reboot, коли йшов після style.css) */
p { margin-top: 0; margin-bottom: 1rem; }
h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5rem; }
button, input, optgroup, select, textarea { line-height: inherit; }

a { color: var(--ge-blue-700); }
a:hover { color: var(--ge-blue-800); }

:focus-visible {
	outline: 3px solid var(--ge-blue-500);
	outline-offset: 2px;
}

/* Заголовки на темних поверхнях (hero головної) успадковують білий */
.hero-title { color: var(--ge-on-dark); }

/* Повідомлення форм (спільні для футера, попапа, сторінок) */
.js-success { color: var(--ge-ok); }
.js-error { color: var(--ge-err); }

.lgreytext,
#breadcrumbs,
#breadcrumbs a {
	color: var(--ge-ink-muted);
	font-weight: 400;
}

.greybox {
	background-color: var(--ge-tint);
	border-radius: var(--ge-r-md);
	padding: 20px;
}


.mt50 {
	margin-top: 50px !important
}

.mt30 {
	margin-top: 30px !important
}

.mb30 {
	margin-bottom: 30px !important
}

.mb50 {
	margin-bottom: 50px !important
}


.post-thumbnail img {
	width: 100%;
	min-width: 100% !important;
	border-radius: 14px !important
}

.intl-tel-input {
	display: block !important;
}

/* ==================== SECTION: WPML language switcher ==================== */
.wpml-ls-link {
	white-space: nowrap;
	margin-right: 15px;
}

.wpml-ls-link {
	padding: 10px 2px !important;
	position: relative !important;
}

.wpml-ls-link::after {
	position: absolute;
	content: '';
	bottom: 0;
	width: 0;
	height: 1px;
	background-color: #fff;
	transition: 0.3s;
	left: 0;
}

.wpml-ls-link:hover:after {
	width: 100%;
	background-color: #000;
}

.wpml-ls-link span {
	color: #000;
	font-weight: 500;
}

/* ==================== SECTION: Forms & buttons ==================== */
form input[type=tel],
form input[type=email],
form input[type=text] {
	max-width: 100%;
	width: 100%;
	height: 50px;
	border-radius: 0;
	border: none;
	border-bottom: 1px solid #333;
	background-color: transparent;
	margin: 10px 0;
	box-sizing: border-box;
	padding: 0 5px;
	outline: none;
	color: #000;
	font-size: 16px;
	font-family: "Open Sans", sans-serif;
	-webkit-appearance: none;
	transition: 0.3s;
}

form input[type=tel]::placeholder,
form input[type=email]::placeholder,
form input[type=text]::placeholder {
	color: #333;
}

form input[type=tel]:focus,
form input[type=email]:focus,
form input[type=text]:focus {
	border-color: #333;

}

form input[type=tel]:focus::placeholder,
form input[type=email]:focus::placeholder,
form input[type=text]:focus::placeholder {
	color: #333;
}

/* ==================== DESIGN SYSTEM · buttons ====================
   Один CTA-колір (золото) = місце, де відвідувач стає лідом.
   .btn-cta / .btn-outline / .btn-ghost: нові назви.
   Старі класи (.button.black, .crimsonb, .btn-hero-primary, .clearbut, .button.grey)
   мають той самий вигляд, доки сторінки не переведені на нові назви. */
.btn,
.button,
input[type="submit"].wpcf7-submit,
.crimsonb,
.btn-hero-primary,
.btn-hero-ghost,
.clearbut,
.form-submit-btn,
#spopupForm button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 24px;
	border: 1.5px solid transparent;
	border-radius: var(--ge-r-pill);
	font-family: var(--ge-font-body);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .01em;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background-color .2s ease, box-shadow .2s ease, color .2s ease, border-color .2s ease;
}

.btn:hover,
.button:hover,
.crimsonb:hover,
.btn-hero-primary:hover,
.btn-hero-ghost:hover,
.clearbut:hover { text-decoration: none; }

/* Стара кнопка зберігає свій розмір у макетах, поки сторінки не переписані */
.button,
input[type="submit"].wpcf7-submit {
	width: 100%;
	max-width: 280px;
	margin: 10px 0;
}

input[type="submit"].wpcf7-submit { margin: 0 auto; }

.crimsonb { min-width: 200px; }

/* Основна (CTA): золото */
.btn-cta,
.button.black,
input[type="submit"].wpcf7-submit,
.crimsonb,
.btn-hero-primary,
.form-submit-btn,
#spopupForm button[type="submit"] {
	background: var(--ge-gold-500);
	color: var(--ge-ink);
	border-color: var(--ge-gold-500);
	box-shadow: var(--ge-shadow-cta);
}

/* Змінні Bootstrap для нових .btn: його стани :active/:focus-visible беруть кольори звідси */
.btn-cta {
	--bs-btn-color: var(--ge-ink);
	--bs-btn-bg: var(--ge-gold-500);
	--bs-btn-border-color: var(--ge-gold-500);
	--bs-btn-hover-color: var(--ge-ink);
	--bs-btn-hover-bg: var(--ge-gold-600);
	--bs-btn-hover-border-color: var(--ge-gold-600);
	--bs-btn-active-color: var(--ge-ink);
	--bs-btn-active-bg: var(--ge-gold-600);
	--bs-btn-active-border-color: var(--ge-gold-600);
}

.btn-outline {
	--bs-btn-color: var(--ge-blue-700);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: var(--ge-blue-700);
	--bs-btn-hover-color: var(--ge-blue-800);
	--bs-btn-hover-bg: var(--ge-blue-100);
	--bs-btn-hover-border-color: var(--ge-blue-800);
	--bs-btn-active-color: var(--ge-blue-800);
	--bs-btn-active-bg: var(--ge-blue-100);
	--bs-btn-active-border-color: var(--ge-blue-800);
}

.btn-cta:hover,
.btn-cta:focus-visible,
.button.black:hover,
input[type="submit"].wpcf7-submit:hover,
.crimsonb:hover,
.btn-hero-primary:hover,
.btn-hero-primary:focus-visible,
.form-submit-btn:hover,
#spopupForm button[type="submit"]:hover {
	background: var(--ge-gold-600);
	border-color: var(--ge-gold-600);
	color: var(--ge-ink);
}

/* Вторинна: синій контур */
.btn-outline,
.clearbut {
	background: transparent;
	color: var(--ge-blue-700);
	border-color: var(--ge-blue-700);
	box-shadow: none;
}

.btn-outline:hover,
.clearbut:hover {
	background: var(--ge-blue-100);
	color: var(--ge-blue-800);
	border-color: var(--ge-blue-800);
}

/* Нейтральна */
.button.grey {
	background: var(--ge-blue-100);
	color: var(--ge-blue-800);
}

.button.grey:hover {
	background: var(--ge-line);
	color: var(--ge-blue-800);
	box-shadow: none;
}

/* Привид на синьому фоні (hero) */
.btn-hero-ghost {
	background: transparent;
	color: var(--ge-on-dark);
	border-color: rgba(255, 255, 255, .7);
}

.btn-hero-ghost:hover,
.btn-hero-ghost:focus-visible {
	background: rgba(255, 255, 255, .12);
	border-color: #fff;
	color: var(--ge-on-dark);
}


/* HEADER */

/* ==================== DESIGN SYSTEM · header, menu ====================
   Розмітка: header.php. Поведінка: js/header.js.
   Хедер не липкий: прокручується разом зі сторінкою. */
.header {
	position: relative;
	z-index: 30;
	background: rgba(255, 255, 255, .97);
	border-bottom: 1px solid var(--ge-line);
}

.header .header-in {
	display: flex;
	align-items: center;
	gap: 20px;
	min-height: 76px;
}

.header .logo-wrap { flex: 0 0 auto; }

.header .custom-logo-link { display: block; }

.header .custom-logo {
	display: block;
	height: 48px;
	width: auto;
	max-width: none;
}

.header .menu-wrap {
	flex: 1;
	min-width: 0;
}

.header .header-actions { flex: 0 0 auto; }

.header .header-actions .button {
	width: auto;
	max-width: none;
	margin: 0;
	min-height: 46px;
}

.header-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.header-menu > li { position: relative; }

.header-menu > li > a,
.header-menu > li > .sub-toggle {
	display: inline-flex;
	align-items: center;
	padding: 10px 12px;
	color: var(--ge-ink);
	font: 500 15px/1.2 var(--ge-font-body);
	text-decoration: none;
	white-space: nowrap;
	background: none;
	border: 0;
	box-shadow: inset 0 -2px 0 transparent;
	transition: box-shadow .2s ease;
}

.header-menu > li > a:hover,
.header-menu > li.open > a,
.header-menu > li.open > .sub-toggle,
.header-menu > li > .sub-toggle:hover,
.header-menu > li.current-menu-item > a,
.header-menu > li.current-menu-ancestor > a {
	box-shadow: inset 0 -2px 0 var(--ge-blue-700);
}

.header-menu > li.current-menu-item > a,
.header-menu > li.current-menu-ancestor > a {
	color: var(--ge-blue-800);
	font-weight: 700;
}

/* Кнопка-шеврон: лише біля пунктів із вкладеним меню */
.sub-toggle {
	cursor: pointer;
	color: var(--ge-ink-muted);
}

.header-menu > li > .sub-toggle {
	padding: 10px 8px 10px 2px;
	margin-left: -6px;
}

.chev {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform .2s ease;
}

li.open > .sub-toggle .chev { transform: rotate(225deg) translate(-2px, -2px); }

/* Випадна панель */
.header-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 40;
	display: none;
	min-width: 220px;
	margin: 0;
	padding: 10px;
	list-style: none;
	background: var(--ge-surface);
	border: 1px solid var(--ge-line);
	border-radius: var(--ge-r-md);
	box-shadow: 0 18px 40px rgba(14, 29, 82, .14);
}

.header-menu li.open > .sub-menu { display: block; }

.header-menu .sub-menu a {
	display: block;
	padding: 9px 12px;
	border-radius: var(--ge-r-sm);
	color: var(--ge-ink);
	font-size: 15px;
	text-decoration: none;
	white-space: nowrap;
}

.header-menu .sub-menu a:hover,
.header-menu .sub-menu .current-menu-item > a {
	background: var(--ge-blue-100);
	color: var(--ge-blue-800);
}

/* Довгі списки (7 і більше пунктів) у 3 колонки */
.header-menu li.ge-cols > .sub-menu {
	left: 50%;
	padding: 14px;
	grid-template-columns: repeat(3, max-content);
	gap: 0 8px;
	transform: translateX(-50%);
}

.header-menu li.ge-cols.open > .sub-menu { display: grid; }

/* Кнопка «Menu» (тільки на мобільному) */
.open-mobile-menu {
	display: none;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 0 16px;
	background: transparent;
	color: var(--ge-blue-700);
	border: 1.5px solid var(--ge-blue-700);
	border-radius: var(--ge-r-pill);
	font: 700 14px var(--ge-font-body);
	cursor: pointer;
}

.open-mobile-menu .bars {
	position: relative;
	width: 16px;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transition: background-color .2s ease;
}

.open-mobile-menu .bars::before,
.open-mobile-menu .bars::after {
	content: "";
	position: absolute;
	left: 0;
	width: 16px;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transition: transform .2s ease;
}

.open-mobile-menu .bars::before { transform: translateY(-5px); }
.open-mobile-menu .bars::after { transform: translateY(5px); }

.open-mobile-menu.active .bars { background: transparent; }
.open-mobile-menu.active .bars::before { transform: rotate(45deg); }
.open-mobile-menu.active .bars::after { transform: rotate(-45deg); }

/* Мобільна панель: під хедером, на всю ширину */
.mobile-nav {
	display: none;
	padding: 8px 0 20px;
	background: var(--ge-surface);
	border-top: 1px solid var(--ge-line);
	max-height: calc(100vh - 64px);
	max-height: calc(100dvh - 64px);
	overflow-y: auto;
}

.mobile-nav:not([hidden]) { display: block; }

.mobile-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mobile-menu > li { border-bottom: 1px solid var(--ge-line); }

.mobile-menu li.menu-item-has-children {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.mobile-menu a {
	display: block;
	flex: 1;
	padding: 15px 4px;
	color: var(--ge-ink);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
}

.mobile-menu li.current-menu-item > a { color: var(--ge-blue-800); font-weight: 700; }

.mobile-menu .sub-toggle {
	display: grid;
	place-items: center;
	min-width: 44px;
	min-height: 44px;
	background: none;
	border: 0;
}

.mobile-menu .sub-menu {
	display: none;
	flex: 0 0 100%;
	margin: 0;
	padding: 0 0 10px 12px;
	list-style: none;
}

.mobile-menu li.open > .sub-menu { display: block; }

.mobile-menu .sub-menu a {
	padding: 10px 4px;
	color: var(--ge-ink-muted);
	font-size: 15px;
	font-weight: 500;
}

.mobile-nav .actions {
	display: grid;
	gap: 10px;
	margin-top: 18px;
}

.mobile-nav .actions .button,
.mobile-nav .actions .btn {
	width: 100%;
	max-width: none;
	margin: 0;
	min-height: 50px;
}

html.menu-open,
html.menu-open body { overflow: hidden; }

@media (max-width: 991.98px) {
	.header .header-in {
		justify-content: space-between;
		min-height: 64px;
	}

	.header .custom-logo { height: 36px; }
	.header .menu-wrap,
	.header .header-actions { display: none; }
	.open-mobile-menu { display: inline-flex; }
}

@media (min-width: 992px) {
	.mobile-nav { display: none !important; }
}

/* Вузький десктоп (992-1199px): трохи компактніше, щоб меню не наповзало на кнопку */
@media (min-width: 992px) and (max-width: 1199.98px) {
	.header .header-in { gap: 12px; }
	.header .custom-logo { height: 40px; }
	.header-menu { gap: 0; }
	.header-menu > li > a { padding-inline: 8px; }
	.header .header-actions .button { padding: 0 18px; }
}

/* BLOG TILES */

/* ==================== SECTION: Blog ==================== */
.blog-items .blog-item {
	margin-bottom: 50px;
}

.blog-items .blog-item .blog-img {
	border-radius: 12px;
	overflow: hidden;
	display: block;
}

.blog-items .blog-item .blog-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 4/3;
}

.blog-items .blog-item .blog-title {
	font-size: 18px;
	display: block;
	font-weight: 500;
	margin: 10px 0;
	color: #333;
	text-decoration: none;
}

.blog-items .blog-item .blog-description {
	line-height: 1.4;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.blog-items .blog-item .blog-description p {
	font-weight: 100;
	margin: 0;
	padding: 0;
}

@media only screen and (max-width: 980px) {

	.blog-content-wrap {
		flex-direction: column-reverse;
	}

	.blog-image {
		margin-bottom: 30px;
	}

	.blog-image img {
		width: 100%;

	}
}

/* PROPERTY TILES */

.property-items .property-item {
	margin-bottom: 50px;
}

.property-items .property-item .property-img {
	border-radius: 12px;
	overflow: hidden;
	display: block;
	transition: transform 0.8s ease;
}



/* Контейнер під логотип */
/* ==================== SECTION: Developer cards (base) ==================== */
.developer-header-logo {
    position: relative;
    overflow: hidden;
    border-radius: 24px;      
}

/* Саме зображення логотипа */
.developer-header-logo img {
    display: block;
    width: 100%;
    min-width: 100%;
    height: 100%;
    object-fit: cover;        /* заповнює блок, при цьому може трохи обрізати */
    aspect-ratio: 3 / 2;      /* під твій розмір 600×400 */
    transition: transform 0.8s ease;
}

/* Зум-ефект при ховері (можеш привʼязати до всього хедера або тільки до логотипа) */
.developer-header:hover .developer-header-logo img,
.developer-header-logo:hover img {
    transform: scale(1.25);
}






.property-items .property-item .property-title,
.anytitle {
	font-size: 22px;
	display: block;
	font-weight: 500;
	margin: 10px 0 0 0;
	color: #333;
	text-decoration: none;
}

.property-items .property-item .property-description,
.anydesc {
	line-height: 1.4;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	/* margin-bottom: 15px; */
}

/* ==================== SECTION: Property cards & content ==================== */
.property-items .property-item .property-description p {
	margin: 0;
	padding: 0;
	/* padding-bottom: 10px; */
}

.property-items .property-item .property-param span {
	display: inline-flex;
	opacity: 0.7;
	align-items: center;
	justify-content: center;
	border: 1px solid #896D56;
	border-radius: 5px;
	padding: 3px 6px;
	color: #896D56;
	margin-right: 8px;
}

.property-items .property-item .property-param span svg,
.property-items .property-item .property-param span i {
	margin-right: 5px;
}

.property-items .property-item .property-param span sub {
	line-height: 1px;
}

.property-items .property-item .property-location {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	color: #333;
}

.property-items .property-item .property-location svg {
	stroke: #333 !important;
}

.property-items .property-item .property-price {
	text-align: end;
}

.property-items .property-item .property-price .property-price-dollar {
	font-size: 14px;
	color: #D9D9D9;
	display: block;
}

.property-items .property-item .property-price-value {
	padding-bottom: 0;
	margin-bottom: 0;
}

.property-items .property-item .property-price-value span {
	font-size: 18px;
}

/* .property-items .property-item .property-price-value.property-old-price {
	position: relative;
	text-decoration: line-through;
} */

/* .property-items .property-item .villa-price-value.villa-old-price::after {
	position: absolute;
	content: '';
	width: 120px;
	height: 2px;
	background-color: #293238;
	bottom: 10px;
	left: 0;
	transform: rotate(-6deg);
} */

.property-items .property-item .property-price-value.property-old-price span {
	font-size: 14px !important;
}


/* Property Page Styles */

.property-content .property-parameters-items {
	padding: 0 15px;
}

.property-content .property-parameters-items>div {
	min-height: 56px;
	border-bottom: 1px solid #D9D9D9;
	padding: 14px 5px;
}

.property-content .property-parameters-items>div:nth-child(odd) {
	border-right: 1px solid #D9D9D9;
}

.property-content .property-parameters-items>div:nth-child(odd):nth-last-child(2),
.property-content .property-parameters-items>div:last-child {
	border-bottom: none;
}

.property-content .property-parameters-items>div .icon {
	width: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.property-content .property-parameters-items>div .icon {
	font-size: 22px;
}

.property-content .property-parameters-items>div .icon svg {
	width: 24px;
}

.property-content .property-parameters-items>div p {
	margin: 0;
	font-size: 18px;
}

.property-content .gallery-images .gallery-item {
	padding: 10px;
}

.property-content .gallery-images .gallery-item img {
	aspect-ratio: 4 / 3;
	width: 100%;
	border-radius: 10px;
}

.property-content .gallery-images.slider .slick-next,
.property-content .gallery-images.slider .slick-prev {
	display: flex;
	align-items: center;
	justify-content: center;
}

.property-content .gallery-images.slider .slick-next::before,
.property-content .gallery-images.slider .slick-prev::before {
	display: none;
}

.property-content .gallery-images.slider .slick-next i,
.property-content .gallery-images.slider .slick-prev i {
	color: #333;
	font-size: 18px;
}

.property-content .gallery-images.slider .slick-next svg,
.property-content .gallery-images.slider .slick-prev svg {
	color: #333;
	width: 20px;
	height: 20px;
}

.property-content .property-price-single {
	font-size: 20px;
}

.property-content .property-price-single .price-dollar {
	font-size: 14px;
	color: #D9D9D9;
	display: block;
}

.property-content .property-prices .property-price {
	height: 100%;
	border: 1px solid #D9D9D9;
	border-radius: 10px;
	padding: 15px;
	margin-top: 15px;
}

.property-content .property-prices .property-price .price-value {
	font-size: 32px;
	font-weight: 500;
	width: 100%;
	display: block;
	border-bottom: 1px solid #000;
	padding-bottom: 5px;
	margin-bottom: 5px;
}

.property-content .property-prices .property-price p {
	font-size: 18px;
	color: #000;
	padding: 0 !important;
	margin: 0;
}

.property-content .property-prices .property-price p span {
	color: #a8a8a8;
}

.property-content .amenities-item {
	height: 100%;
	margin-top: 15px;
	border: 1px solid #D9D9D9;
	border-radius: 10px;
	padding: 5px 10px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-direction: row-reverse;
	font-size: 18px;
}

.property-content .amenities-item img {
	width: 50px;
	height: 50px;
	margin-right: 10px;
}

.property-content .check-in-block .time {
	font-size: 20px;
}

.property-content .check-in-block span {
	color: #5e5e5e;
}

@media only screen and (max-width: 980px) {
	.property-content .property-parameters-items {
		padding: 0 5px;
	}

	.property-content .property-parameters-items>div {
		min-height: 66px;
		padding: 15px 5px;
	}

	.property-content .property-parameters-items>div p {
		font-size: 16px;
	}

	.property-content .amenities-item {
		padding: 5px 5px;
	}
}

@media only screen and (max-width: 767px) {
	.property-content .property-parameters-items>div p {
		font-size: 14px;
	}

	.property-content .property-price-single {
		margin-top: 20px;
	}

	.property-content .button.booking-now {
		margin: 25px auto 0 !important;
		max-width: 300px;
	}
}

/* CONTACT FORM */

.contact_block {
	padding: 75px 20px;
	background-image: url(img/footer_bg.webp);
	background-size: cover;
    text-align:center;
}

.contact_block form {
	max-width: 600px;
	margin: 0 auto;
}



#contactBlockForm .iti--allow-dropdown {width: 100%}


/* VILLA CONTENT */

.villa-content .villa-price-value span {
	font-size: 30px;
}

/* FOOTER */

/* ==================== DESIGN SYSTEM · footer ====================
   Розмітка: footer.php. Колонки з меню беруться з адмінки (Footer / Service / Properties menu);
   якщо меню не призначене, колонка не виводиться, а замість двох головних стоять запасні списки.
   Змінна --f-menus = кількість колонок із меню (виставляє footer.php). */
.footer {
	padding: 56px 0 28px;
	background: var(--ge-blue-900);
	color: var(--ge-on-dark-muted);
}

.footer .f-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) repeat(var(--f-menus, 2), minmax(0, 1fr)) minmax(0, 1.3fr);
	gap: 36px;
}

.footer .footer_logo {
	display: inline-block;
	max-width: none;
	margin: 0;
}

.footer .footer_logo img {
	display: block;
	height: 48px;
	width: auto;
	filter: brightness(0) invert(1);   /* логотип одноколірний на прозорому фоні */
}

.footer p {
	margin: 0;
	color: var(--ge-on-dark-muted);
	font-size: 15px;
	font-weight: 400;
}

.footer .about {
	max-width: 40ch;
	margin-top: 18px;
}

.footer h4 {
	margin: 0 0 14px;
	color: var(--ge-on-dark-subtle);
	font-family: var(--ge-font-body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	line-height: 1.4;
	text-transform: uppercase;
}

.footer ul {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer a {
	color: var(--ge-on-dark-muted);
	text-decoration: none;
}

.footer a:hover {
	color: #fff;
	text-decoration: underline;
}

.footer .btn-cta {
	margin-top: 16px;
}

.footer .social_links {
	display: flex;
	gap: 10px;
	max-width: none;
	margin-top: 22px;
}

.footer .social_links a {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 50%;
	color: #fff;
	font-size: 18px;
	transition: background-color .2s ease, border-color .2s ease;
}

.footer .social_links a:hover {
	background: rgba(255, 255, 255, .12);
	border-color: #fff;
	text-decoration: none;
}

.footer .legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
	margin-top: 40px;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, .14);
	color: var(--ge-on-dark-subtle);
	font-size: 13px;
}

.footer .legal a { color: var(--ge-on-dark-subtle); }
.footer .legal a:hover { color: #fff; }

.footer-contact-wrap { background: var(--ge-tint); }

@media (max-width: 991.98px) {
	.footer .f-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer .f-brand { grid-column: 1 / -1; }
}

@media (max-width: 575.98px) {
	.footer { padding: 40px 0 24px; }
	.footer .f-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}

.overlay {
	background-color: rgba(0, 0, 0, 0.6);
	position: fixed;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 10000;
}

/* ==================== SECTION: Legacy popup / FAQ / lead popup (spopup) ==================== */
.nonebox {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 90%;
	color: #333;
	max-width: 420px;
	height: auto;
	z-index: 99999;
	text-align: center;
	border-radius: 5px;
	background-color: #fff;
	padding: 25px;
	font-family: "Roboto", sans-serif;
	box-sizing: border-box;
	display: none;
}

.nonebox .button {
	margin: 30px auto 0 !important;
}

.nonebox form p {
	padding: 0 !important;
	margin: 0 !important;
}

.nonebox .box-close {
	width: 20px;
	height: 20px;
	cursor: pointer;
	display: block;
	position: absolute;
	top: 10px;
	right: 10px;
}

.nonebox .box-close .icon {
	width: inherit;
	height: inherit;
}

.wpcf7-not-valid {
	border-bottom-color: #911f1f !important;
}

.wpcf7-response-output {
	display: none;
}

.contact-info h3 {
	font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.faq {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
    border-radius: 5px;
}

.faq-item {
    margin-bottom: 20px;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 10px;
}

.faq-question {
    cursor: pointer;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.faq-answer {
    display: none;
    font-size: 16px;
    padding-top: 10px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.4s ease;
    opacity: 0;
}

.faq-item.active .faq-answer {
    display: block;
    max-height: 500px;
    opacity: 1;
}

/* Стрелка вниз */
.arrow {
    transition: transform 0.4s ease;
}

.arrow svg {
	width: 26px;
	height: 26px;
}

/* Поворот стрелки вверх при активном вопросе */
.faq-item.active .arrow {
    transform: rotate(180deg);
}




#spopupOverlay {
  background: rgba(0,0,0,0.7) !important;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s ease;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  align-items: center; 
  justify-content: center;
  z-index: 9999;
}

#spopupOverlay.show {
  opacity: 1;
  visibility: visible;
}

#spopupWindow {
  border-radius: 8px;
  overflow: hidden;
  padding: 0;
  max-width: 400px;
  width: 90%;
  min-height: 500px;
  background: #fff;
  position: relative;
  transform: scale(0.85);
  transition: transform 0.6s ease;
  display: flex;
  flex-direction: column;
}

#spopupOverlay.show #spopupWindow {
  transform: scale(1);
}

.spopupHeader {
  background: crimson;
  height: 200px;
  color: #fff;
  padding: 15px;
  position: relative;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  box-sizing: border-box;
}

.spopupHeader h2 {
  margin: 0;
  font-size: 24px;
  text-transform: uppercase;
  text-align: left;
}

.spopupSubText {
  margin-top: 3px;
  margin-bottom: 0;
  font-size: 14px;
}

#spopupCloseButton {
  position: absolute; 
  top: 10px; 
  right: 10px;
  font-size: 1.5rem; 
  background: none; 
  border: none;
  color: #fff; 
  cursor: pointer;
}
#spopupCloseButton:hover {
  color: #ddd;
}

.spopupBody {
  flex: 1;
  padding: 15px;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: stretch;
  position: relative;
}

#spopupForm {
  display: flex; 
  flex-direction: column; 
  gap: 1rem;
  margin-top: 15px;
  transition: height 0.7s ease;
  overflow: hidden;
}

#spopupForm button[type="submit"] {
  border-radius: 8px;
  background: #000;
  color: #fff;
  border: none;
  height: 48px;
  cursor: pointer;
  font-size: 16px;
  margin-top: 15px;
}
#spopupForm button[type="submit"]:hover {
  background: #333;
}

#spopupPhoneField {
  background: #f7f7f7 !important;
  border-radius: 8px;
  border-bottom: none;
  height: 60px;
  font-size: 120%;
  max-length: 14;
}

#spopupNameField,
#spopupEmailField {
  height: 35px;
  max-length: 40;
}

#spopupNameField::placeholder,
#spopupEmailField::placeholder {
  color: #888;
}

#sendingIndicator {
  display: none;
  font-size: 14px;
  color: #444;
  text-align: center;
  margin-top: 10px;
}

#spopupSuccessMsg,
#spopupErrorMsg {
  display: none;
  margin-top: 1rem;
  text-align: center;
}

#spopupSuccessMsg h3 {
  margin: 0;
  font-size: 20px;
  color: green;
}
#spopupSuccessMsg p {
  margin: 5px 0 0;
  font-size: 15px;
  color: #333;
}
#spopupErrorMsg {
  color: red;
  font-size: 16px;
}
.iti__country-list,
.iti__flag-container {
  z-index: 10000 !important;
}

/* ==================== SECTION: Lists, breadcrumbs ==================== */
/* pagination */
ul.page-numbers {
	display: flex;
	justify-content: center;
	align-items: center;
	list-style: none;
	padding: 0;
	margin: 40px auto;
	gap: 8px;
	flex-wrap: wrap;
}

ul.page-numbers li {
	display: inline-block;
}

ul.page-numbers a,
ul.page-numbers span {
	display: inline-block;
	padding: 8px 14px;
	font-size: 14px;
	color: #333;
	text-decoration: none;
	border: 1px solid #ccc;
	border-radius: 6px;
	transition: all 0.3s ease;
	background-color: #fff;
}

ul.page-numbers a:hover {
	background-color: #000;
	color: #fff;
	border-color: #000;
}

ul.page-numbers .current {
	background-color: #333;
	color: #fff;
	border-color: #333;
	cursor: default;
}

ul.page-numbers .prev,
ul.page-numbers .next {
	font-weight: bold;
}

/* Breadcrumbs styling (Yoast SEO) */
#breadcrumbs {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 16px;
    color: #5e5e5e;
    font-weight: 100;
}

#breadcrumbs a {
    color: #5e5e5e;
    text-decoration: none;
}

#breadcrumbs a:hover {
    text-decoration: underline;
}

#breadcrumbs span span {
    margin-right: 0.4em;
}

#breadcrumbs span span:not(:first-child) {
    margin-left: 0.4em;
}

.filter-bar{background-color: #eee; border-radius: 12px}

.category-header-section h1 span{color:#896D56;}
.category-description-intro {font-size: 16px;color: #5e5e5e;}






/* ==================== SECTION: Property / project helpers ==================== */
.property-img .property-badge {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;
    background: #fff;
    color: #000;
    padding: 6px 16px;
    border-radius: 999px;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    transition: opacity 0.25s ease, transform 0.8s ease;
}

.property-badge--featured {
    top: 60px!important;
}

.property-items .property-item .property-img img {
    transition: transform 0.8s ease;
    transform-origin: center center;
    will-change: transform; 
    object-fit: cover;
    aspect-ratio: 4 / 3;
}

.property-items .property-item:hover .property-img .property-badge {
    opacity: 0;
    transform: translateY(-10px);
}



.property-item--featured {

}


/* Ціна під зображенням */
.project-price-row .project-price-label {
    font-weight: 700;
    font-size: 18px;
    text-align: right;
    min-height: 54px;
}
.project-price-converted{font-weight: 100; font-size: 90%}


/* "by Developer" */
.project-by {margin-top: -5px;}

/* Локація під описом */
.project-location svg {
    width: 16px;
    height: 16px;
    margin-right: 6px;
}
.project-location span {
    font-size: 14px;
}

/* Рядки мети внизу */
.project-meta{min-height:75px}
.project-meta-row {
    font-size: 14px;
    margin-top: 4px;
}

.project-meta-row strong {
    font-weight: 600; display: inline-block; min-width: 120px;
    margin-right: 4px;
}

.property-items .property-item:hover .property-img img,
.property-items .property-item:hover .anyimg {
    transform: scale(1.25);
}




.developer-slider-section {
    margin-top: 40px;
}

.developer-card {
    border-radius: 12px;
    padding: 16px;
}

.developer-card-logo {
    border-radius: 12px;
    overflow: hidden;
}

.developer-card-logo img {
    display: block;
    width: 100%;
    height: 180px;
    object-fit: cover;
    transition: transform 0.8s ease;
}

.developer-card:hover .developer-card-logo img {
    transform: scale(1.25);
}

.developer-badge-top {
    position: absolute;
    top: 13px;
    left: 13px;
}

.developer-card-desc {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #5e5e5e;
    font-size: 14px;
    font-weight: 100;
}

.developer-card-desc p {
    margin-bottom: 0;
}


/* ==================== SECTION: News & FAQ section ==================== */
.news-slider-section {
    margin-top: 40px;
}

.news-card-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-card-excerpt p {
    margin-bottom: 0;
}


.faq-section {
    font-family: Roboto, sans-serif;
    padding: 3rem 0;
    background-color: #fff;
}

.faq-section-title {
    margin-bottom: 2rem;
    color: #000;
    font-weight: 700;
}

.faq-section .accordion {
    border-top: 1px solid #e5e5e5;
}

.faq-section .accordion-item {
    background-color: #fff;
    border: 0;
    border-bottom: 1px solid #e5e5e5;
    border-radius: 0;
}

.faq-section .accordion-flush .accordion-item {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
}

.faq-section .accordion-button,
.faq-section .accordion-button:not(.collapsed) {
    color: #000 !important;
    background-color: #fff !important;
    font-weight: 500;
    padding: 1.25rem 1.25rem;
    box-shadow: none !important;
    border-radius: 0;
}

.faq-section .accordion-button:hover {
    color: #111;
    background-color: #f8f8f8 !important;
}

.faq-section .accordion-button:focus {
    z-index: 3;
    border-color: transparent;
    outline: 0;
    box-shadow: none !important;
}

.faq-section .accordion-button::after,
.faq-section .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

.faq-section .accordion-button:not(.collapsed)::after {
    transform: rotate(-180deg);
}

.faq-section .accordion-body {
    padding: 1.25rem 1.25rem 1.5rem;
    color: #000;
    line-height: 1.6;
    background-color: #fff;
    border-top: 0;
}

.faq-section .accordion-button {
    transition:
        background-color 0.8s ease,
        color 0.8s ease,
        box-shadow 0.8s ease;
}

.faq-section .accordion-button::after {
    transition: transform 0.8s ease;
}

.faq-section .accordion-collapse {
    transition: height 0.8s ease;
}



/* ------- Archive: Developers list ------- */

.developers-archive-header h1 {}

/* ==================== SECTION: Developer list & page ==================== */
.developer-list-card {
    position: relative;
    padding: 24px 28px;
    margin-bottom: 30px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 18px 60px rgba(0,0,0,0.04);
    overflow: hidden;
}

/* невелика підсвітка при ховері */
.developer-list-card:hover {
    box-shadow: 0 24px 70px rgba(0,0,0,0.07);
    transform: translateY(-2px);
    transition: all 0.28s ease;
}

/* логотип ліворуч */
.developer-list-logo {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
}

.developer-list-logo img {
    display: block;
    width: 100%;
    min-width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 3 / 2;
    transition: transform .8s ease;
}

.developer-list-card:hover .developer-list-logo img {
    transform: scale(1.25);
}

/* контент праворуч */
.developer-list-title {margin-bottom: 10px;}
.developer-list-title a {color: #000; text-decoration: none;transition: transform .8s ease;}
.developer-list-title a:hover {text-decoration: underline;}

.developer-list-stats {
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px 24px;
}

.developer-list-stat-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    margin-bottom: 2px;
}

.developer-list-stat-value {
    font-size: 18px;
    font-weight: 500;
    color: #444;
}


/* маленький бейдж Top rated */
.developer-list-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    background: #111;
    color: #fff;
}


.developer-list-badge-inline {
	vertical-align: middle; margin-left: 10px;
	font-size: 13px; position: relative; top: -3px;
}
.developer-list-stats-inline {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px 24px;
	margin: 20px 0 14px;
}
@media (max-width: 767.98px) {
	.developer-list-stats-inline {
		grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2+1 переносом */
	}
}
.developer-list-projects {
	display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px;
}
.developer-list-project {
	flex: 1 1 0; min-width: 0; max-width: 220px;
	display: flex; align-items: center; gap: 10px;
	text-decoration: none; color: #051E50;
}
.developer-list-project:hover { color: #896D56; }
.developer-list-project-img {
	width: 64px; height: 48px; border-radius: 8px; flex-shrink: 0;
	background-size: cover; background-position: center; background-color: #f4f4f4;
}
.developer-list-project-name {
	font-size: 14px; line-height: 1.3;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
@media (max-width: 767.98px) {
	.developer-list-stats-inline { gap: 10px 24px; } /* 2+1 переносом */
	.developer-list-projects { flex-direction: column; }
	.developer-list-project { max-width: none; }
}


/* адаптив */
@media (max-width: 991.98px) {
    .developer-list-card {
        padding: 18px 18px 20px;
    }
    .developer-list-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px 16px;
    }
}

@media (max-width: 575.98px) {
    .developer-list-stats {
        grid-template-columns: 1fr 1fr;
    }
}




.developer-hero-fluid {
    position: relative;
    padding: 0px 0 60px;
    overflow: hidden;
}

.developer-hero-big-name {
    position: absolute;
    top: 300px;
    left: 270px;
    font-family: Roboto, sans-serif;
    font-size: 260px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    color: rgba(0, 0, 0, 0.025);
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

.developer-header-section {
    margin-bottom: 0;
}

.developer-header-logo {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
}

.developer-header-logo img {
    display: block;
    width: 100%;
    min-width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 3 / 2;
    transition: transform 0.8s ease;
}

.developer-header-section:hover .developer-header-logo img,
.developer-header-logo:hover img {
    transform: scale(1.15);
}

.developer-header-title {
    font-size: 40px;
}

.developer-info-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 32px;
    margin-top: 22px;
}

.developer-info-item {
    flex: 0 0 calc(33.333% - 22px);
    max-width: calc(33.333% - 22px);
}

.developer-info-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    margin-bottom: 3px;
}

.developer-info-value {
    font-size: 22px;
    font-weight: 500;
   /* color: #5e5e5e; */
}

.developer-tagline-quote {
    font-size: 40px;
    font-weight: 100;
    text-align: center;
}

.developer-sidebox {
    border-radius: 18px;
    padding: 22px 22px 24px;
}

.developer-sidebox h3 {
    font-size: 18px;
    font-weight: 600;
}

.developer-sidebox .button {
    width: 100%;
}

.developer-sidebox-meta {
    font-size: 13px;
}

.developer-sidebox-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    margin-bottom: 3px;
}

.developer-sidebox-value {
    color: #333;
}

.developer-description {
  padding-left: 0;
}

@media (min-width: 768px) {
  .developer-description {
    padding-left: 60px;
  }
}



.developer-project-focus .check-icon {
  padding: auto 8px auto 10px;
}

@media (min-width: 768px) {
  .developer-project-focus .check-icon{
  padding: auto 8px auto 50px;
  }
}





.developer-projects-section,
.developer-other-devs-section {
    margin-bottom: 50px;
}

/* Responsive */

@media (max-width: 1199.98px) {
    .developer-hero-big-name {
        font-size: 190px;
        left: 320px;
        top: 140px;
    }
}

@media (max-width: 991.98px) {
    .developer-hero-fluid {
        padding-bottom: 40px;
    }
    .developer-hero-big-name {
        font-size: 140px;
        left: 220px;
        top: 130px;
    }
    .developer-info-item {
        flex: 0 0 calc(50% - 18px);
        max-width: calc(50% - 18px);
    }
}

@media (max-width: 767.98px) {
    .developer-header-title {
        font-size: 30px;
    }
    .developer-tagline-quote {
        font-size: 28px;
    }
    .developer-hero-big-name {
        font-size: 90px;
        left: 120px;
        top: 120px;
    }
    .developer-info-item {
        flex: 0 0 100%;
        max-width: 100%;
    }
}




        .project-hero-fluid {
            position: relative;
            overflow: hidden;
        }

        .project-hero-big-name {
            position: absolute;
            top: 470px;
            left: 60px;
            font-family: Roboto, sans-serif;
            font-size: 240px;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: -0.05em;
            color: rgba(0, 0, 0, 0.02);
            line-height: 1;
            white-space: nowrap;
            pointer-events: none;
            user-select: none;
            z-index: 0;
        }

        .project-hero-inner {
            position: relative;
            z-index: 1;
        }

        .project-hero-main-img {
            position: relative;
            overflow: hidden;
            border-radius: 24px;
        }

        .project-hero-main-img img {
            display: block;
            width: 100%;
            height: 100%;
            min-width: 100%;
            object-fit: cover;
            aspect-ratio: 3 / 2;
            transition: transform 0.8s ease;
        }

        .project-hero-main-img:hover img {
            transform: scale(1.25);
        }

        .property-hero-badges {
            position: absolute;
            top: 18px;
            left: 18px;
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            z-index: 2;
        }

        .project-info-groups {
            margin-top:0;
        }

        .project-info-row {
            display: flex;
            flex-wrap: wrap;
            gap: 18px 32px;
        }

        .project-info-item {
            flex: 0 0 calc(50% - 16px);
            max-width: calc(50% - 16px);
        }

        .project-info-label {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: #999;
            margin-bottom: 3px;
        }

        .project-info-value {
            font-size: 18px;
            font-weight: 500;
        }

        .project-info-value a {
            color: #000; text-decoration: none;
        }

        .project-info-value a:hover {
            color: #888;
        }
        .project-price-single span strong {
            font-size: 22px;
        }

        .project-brochure-banner {
            margin: 20px auto;
        }

        .project-brochure-banner-inner {
            min-width: 100%;
            border-radius: 24px;
            padding: 24px 28px;
            min-height: 150px;
            display: block;
            align-items: center;
            justify-content: space-between;
        }

        .project-brochure-banner-inner h3 {
            font-size: 20px;
            margin-bottom: 6px;
        }

        .project-brochure-banner-inner p {
            margin: 0;
            font-size: 14px;
        }


        @media (max-width: 991.98px) {
            .project-hero-fluid {
                padding-bottom: 40px;
            }
            .project-hero-big-name {
                font-size: 140px;
                left: 180px;
                top: 180px;
            }
            .project-info-item {
                flex: 0 0 calc(50% - 14px);
                max-width: calc(50% - 14px);
            }
        }

        @media (max-width: 767.98px) {
            .project-hero-big-name {
                font-size: 90px;
                left: 120px;
                top: 160px;
            }
            .project-info-item {
                flex: 0 0 100%;
                max-width: 100%;
            }
        }



        /* --- Project hero badges --- */

/* ==================== SECTION: Project page ==================== */
.project-hero-image {
    position: relative;
    overflow: hidden;
    border-radius: 24px;      
}

/* наш зум-ефект для hero-картинки */
.project-hero-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 3 / 2;
    transition: transform 0.8s ease;
}

.project-hero-image:hover img {
    transform: scale(1.25);
}

/* контейнер з бейджами */
.project-hero-badges {
    position: absolute;
    top: 18px;
    left: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    z-index: 2;
}

/* сам бейдж */
.project-property-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: #ffffff;
    border-radius: 999px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
    color: #333;
}

.swiper{padding-bottom: 40px}
.swiper-pagination{bottom: 0px}



/* watsapp button */
.project-wa-btn {
	display: inline-flex; align-items: center;
	line-height: 0;
}
.project-wa-btn img {
	width: 54px; height: 54px;
	object-fit: contain;
	transition: transform .2s ease;
}
.project-wa-btn:hover img { transform: scale(1.08); }


  .hero-wrap {
    position: relative;
    margin: 0 auto;
  }

  .hero {
    position: relative;
    height: 560px;
    border-radius: 24px;
    overflow: hidden;
    background-color: #3B5BDB;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      90deg,
      rgba(5, 30, 80, 0.85) 0%,
      rgba(11, 52, 120, 0.72) 30%,
      rgba(22, 82, 170, 0.40) 60%,
      rgba(22, 82, 170, 0.00) 100%
    );
    z-index: 1;
  }

  .hero-content {
    position: absolute;
    inset: 0;
    padding: 48px;
    max-width: 560px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #ffffff;
    z-index: 4;
  }

  .hero-eyebrow {
    font-size: 13px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    opacity: 0.85;
    margin-bottom: 12px;
    padding-left: 18px;
    position: relative;
  }

  .hero-eyebrow::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 12px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.8);
    transform: translateY(-50%);
  }

  .hero-title {
    margin: 0 0 16px;
    font-size: 32px;
    line-height: 1.2;
  }

  .hero-text {
    margin: 0 0 24px;
    font-size: 16px;
    line-height: 1.5;
  }

  .hero-cta {
    width: fit-content;
    border-radius: 999px;
    padding-inline: 24px;
    padding-block: 11px;
    font-weight: 600;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.35);
  }

  .hero-pocket {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 444px;
    height: 104px;
    pointer-events: none;
    z-index: 5;
  }

  .hero-float {
    position: absolute;
    right: 0;
    width: 420px;
    height: 80px;
    bottom: 0;
    background: #fff;
    border-top-left-radius: 24px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 24px;
    font-size: 14px;
    line-height: 1.4;
    pointer-events: auto;
    z-index: 6;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.40);
  }

  .hero-founder-logo-wrap {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
  }

  .hero-founder-logo {
    max-width: 28px;
    max-height: 28px;
    display: block;
  }

  .hero-founder-text {
    display: flex;
    flex-direction: column;
  }

  .hero-founder-name {
    font-weight: 600;
    margin-bottom: 2px;
  }

  .hero-founder-meta {
    font-weight: 500;
    color: #4b5563;
  }

  .hero-corner {
    position: absolute;
    width: 24px;
    height: 24px;
    z-index: 7;
  }

  .hero-corner svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  .hero-corner.top-right {
    top: 0;
    right: 0;
    transform: rotate(180deg);
  }

  .hero-corner.bottom-left {
    left: 0;
    bottom: 0;
    transform: rotate(180deg);
  }

  @media (max-width: 991.98px) {
    .hero { height: auto;
      min-height: 560px;
      border-radius: 24px;
    }

    .hero-content {
      padding: 24px;
      max-width: 100%;
          position: relative;
    padding: 32px 20px;
    }

    .hero-title {
      font-size: 24px;
    }

    .hero-pocket {
      display: none;
    }
  }


/*     new buttons        */
.hero-cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  align-items: center;
}

/* ==================== SECTION: Hero buttons (see DESIGN SYSTEM · buttons) ==================== */
@media (max-width: 991.98px) {
  .hero-cta-group {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .btn-hero-primary,
  .btn-hero-ghost {
    width: 100%;
    justify-content: center;
  }
}
/*     new buttons        */




/* ── Map block ── */
.location-map { height: 320px; border-radius: 12px; overflow: hidden; }
.location-map-links { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.location-map-links a { font-size: 13px; display: inline-flex; align-items: center; gap: 6px; color: #000; text-decoration: none; border: 1px solid #ddd; border-radius: 8px; padding: 6px 12px; transition: background .2s; }
.location-map-links a:hover { background: #f5f5f5; }

/* ── Landmark cards ── */
.lm-card { border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid #f0f0f0; height: 100%; display: flex; flex-direction: column; }
.lm-card-img-wrap { position: relative; height: 131px; overflow: hidden; flex-shrink: 0; background: #1a1a2e; }
.lm-card-img-wrap img { width: 100%; height: 131px; object-fit: cover; display: block; transition: transform .5s ease; }
.lm-card:hover .lm-card-img-wrap img { transform: scale(1.07); }
.lm-card-overlay { position: absolute; inset: 0; background: linear-gradient( to bottom, rgba(0,0,0,.25) 0%, rgba(0,0,0,.55) 100% ); display: flex; align-items: center; justify-content: center; padding: 8px; }
.lm-card-name { color: #fff; font-size: 28px; font-weight: 700; text-transform: uppercase; text-align: center; line-height: 1.2; letter-spacing: .04em; }
.lm-card-body { padding: 10px 12px 12px; flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
.lm-card-desc { font-size: 13px; color: #555; line-height: 1.4; margin: 0 0 8px; }
.lm-card-footer { display: flex; justify-content: space-between; align-items: baseline; }
.lm-card-dist { font-size: 18px; font-weight: 600; color: #000; }
.lm-card-time { font-size: 13px; color: #888; }

/* ── Area block (About) ── */
.area-district-img-wrap { border-radius: 12px; overflow: hidden; }
.area-district-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.area-district-img-wrap:hover img { transform: scale(1.05); }
.area-btns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }

/* ── Nearby areas ── */
.na-card-img-wrap { border-radius: 12px; overflow: hidden; aspect-ratio: 3 / 4; }
.na-card-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.na-card-img-wrap:hover img { transform: scale(1.05); }
.na-card-ph { width: 100%; aspect-ratio: 3 / 4; background: #f0f0f0; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.na-card-label { margin-top: 8px; }
.na-card-label a { font-weight: 600; font-size: 14px; color: #000; text-decoration: none; display: block; }
.na-card-label a:hover { text-decoration: underline; }
.na-card-dist { font-size: 14px; color: #888; }


/* ===== Areas page ===== */
/* ==================== SECTION: Area pages (ge-*) ==================== */
.ge-area-hero{
    position:relative;border-radius:24px;overflow:hidden;
    background-color:#3B5BDB;background-size:cover;background-position:center;
    min-height:320px;display:flex;align-items:center;margin-bottom:48px;
}
.ge-area-hero::before{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(90deg,
        rgba(5,30,80,.85) 0%, rgba(11,52,120,.72) 30%,
        rgba(22,82,170,.40) 60%, rgba(22,82,170,0) 100%);
}
.ge-area-hero-content{position:relative;z-index:2;padding:48px;max-width:640px;color:#fff}
.ge-area-eyebrow{font-size:13px;letter-spacing:.12em;text-transform:uppercase;opacity:.85;
    margin-bottom:12px;padding-left:18px;position:relative}
.ge-area-eyebrow::before{content:"";position:absolute;left:0;top:50%;width:12px;height:1px;
    background:rgba(255,255,255,.8);transform:translateY(-50%)}
.ge-area-hero h1{margin:0 0 14px;color:#fff}
.ge-area-hero p{margin:0;font-size:16px;line-height:1.55;opacity:.92;max-width:520px}

.ge-emirate{margin-bottom:18px}
.ge-emirate-title{font-family:var(--ge-font-display);margin:0 0 22px}
.ge-emirate-title span{color:#896D56}

/* бенто через CSS-колонки (masonry, без дірок) */
.ge-area-grid{column-count:4;column-gap:24px;margin-bottom:40px}
@media(max-width:1199px){.ge-area-grid{column-count:3}}
@media(max-width:991px){.ge-area-grid{column-count:2}}
@media(max-width:575px){.ge-area-grid{column-count:1}}

.ge-area-card{
    position:relative;width:100%;margin:0 0 24px;
    border-radius:24px;overflow:hidden;background:#1c1c1c;color:#fff;
    break-inside:avoid;-webkit-column-break-inside:avoid;
    box-shadow:0 18px 60px rgba(0,0,0,.06);
}
.ge-h-full{height:440px}
.ge-h-75{height:330px}
.ge-h-50{height:220px}

.ge-area-photo{
    position:absolute;inset:0;background-size:cover;background-position:center;
    transition:transform .8s ease;will-change:transform;transform-origin:center;
}
.ge-area-card:hover .ge-area-photo{transform:scale(1.1)}
.ge-area-card.no-img .ge-area-photo{background:linear-gradient(135deg,#2a2723,#3a352e 60%,#4a4339)}

.ge-area-overlay{
    position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;
    padding:20px 20px 18px;
    background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.45) 28%,rgba(0,0,0,0) 60%);
}
.ge-area-card.no-img .ge-area-overlay{
    background:linear-gradient(to top,rgba(0,0,0,.55) 0%,rgba(0,0,0,.15) 45%,rgba(0,0,0,0) 70%);
}

.ge-area-name{font-family:var(--ge-font-display);font-size:23px;line-height:1.12;margin:0 0 9px}
.ge-h-50 .ge-area-name{font-size:19px;margin-bottom:6px}
.ge-area-name a{color:#fff;text-decoration:none}
.ge-area-name a::after{content:"";position:absolute;inset:0;z-index:1} /* stretched link → вся плитка веде в категорію */

.ge-area-metrics{position:relative;z-index:3;display:flex;flex-direction:column;gap:3px}
.ge-m-line{font-size:14px;font-weight:300;color:rgba(255,255,255,.92);letter-spacing:.01em}
.ge-h-50 .ge-m-line{font-size:13px}
.ge-m-line b{font-weight:600;color:#fff}
.ge-m-line .ge-price{color:#e6d6c4}
.ge-m-line a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s ease}
.ge-area-card:hover .ge-m-line a{border-bottom-color:rgba(255,255,255,.5)}
.ge-area-empty{font-size:13px;font-weight:300;color:rgba(255,255,255,.7)} 



/* ===== Areas featured block (homepage) ===== */
.ge-featured{padding-block:48px}
.ge-featured-head{display:flex;align-items:flex-end;justify-content:space-between;
    gap:20px;margin-bottom:28px;flex-wrap:wrap}
.ge-featured-eyebrow{font-size:13px;letter-spacing:.12em;text-transform:uppercase;
    color:#5e5e5e;margin-bottom:8px}
.ge-featured-head h2{font-family:var(--ge-font-display);margin:0}
.ge-featured-head h2 span{color:#896D56}
.ge-featured-cta{white-space:nowrap}


.filter-chips { font-size: 14px; }
.filter-chips-count { color: #6c757d; margin-right: 4px; }
.filter-chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 6px 14px; border: 1px solid #d9d9d9; border-radius: 999px;
	background: #fff; color: #051E50; text-decoration: none; line-height: 1;
}
.filter-chip:hover { border-color: #051E50; }
.filter-chip-x { font-size: 16px; color: #6c757d; }
.filter-chip-clear { background: #f4f4f4; border-color: #f4f4f4; }
.category-empty-state { padding: 40px 0; }

.category-stats-intro p { margin-bottom: 0; }
.category-browse-title { font-family: var(--ge-font-display); margin-bottom: 12px; }
.category-browse-text { color: #555; max-width: 720px; }
.category-browse-label { font-weight: 600; margin: 0 0 8px; }
.category-browse-links { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.category-browse-links-stack { flex-direction: column; align-items: flex-start; }
.category-browse-links-stack .browse-link { width: 100%; justify-content: space-between; }
.browse-link {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 10px 18px; border: 1px solid #d9d9d9; border-radius: 999px;
	background: #fff; color: #051E50; text-decoration: none; line-height: 1.2;
}
.browse-link:hover { border-color: #896D56; color: #896D56; }
.browse-link-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 22px; height: 22px; padding: 0 7px;
	border-radius: 999px; background: #f4f4f4; color: #555; font-size: 13px;
}

.category-developers-title,
.category-map-title { font-family: var(--ge-font-display); margin-bottom: 16px; }

/* Developer cards — logo tile (3:2) + hover zoom, centered body */
.dev-card {
	height: 100%; display: flex; flex-direction: column;
	background: #fff;
}
.dev-card-img-wrap {
	display: flex; align-items: center; justify-content: center;
	aspect-ratio: 3 / 2; padding: 10%;
	border-radius: 12px; overflow: hidden; background: #fff;
}
.dev-card-img-wrap img {
	max-width: 100%; max-height: 100%; object-fit: contain;
	transition: transform .35s ease;
}
.dev-card:hover .dev-card-img-wrap img { transform: scale(1.06); }
.dev-card-initial {
	display: inline-flex; align-items: center; justify-content: center;
	width: 64px; height: 64px; border-radius: 50%;
	background: #f0ece8; color: #896D56;
	font-family: var(--ge-font-display); font-size: 30px;
	transition: transform .35s ease;
}
.dev-card:hover .dev-card-initial { transform: scale(1.06); }
.dev-card-body {
	padding: 12px 8px 0;
	display: flex; flex-direction: column;
	align-items: center; text-align: center;
	gap: 10px;
}
.dev-card-name {
	font-size: 17px; margin: 0; line-height: 1.3;
	min-height: 2.6em; /* two lines: long names don't break row alignment */
	display: flex; align-items: flex-start; justify-content: center;
}
.dev-card-name a { color: #051E50; text-decoration: none; font-weight: 600; }
.dev-card-name a:hover { color: #896D56; }
.dev-card-links { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.dev-card-link {
	display: block; text-align: center;
	font-size: 13px; line-height: 1.35;
	color: #555; text-decoration: none;
}
.dev-card-link:hover { color: #896D56; }

/* Map styles live in template-parts/category-map.php; CTA styles in cta-lead.php */

/* ==================== SECTION: Filters ==================== */
.filter-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; }
.filter-toggle-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 22px; height: 22px; padding: 0 6px;
	border-radius: 999px; background: #896D56; color: #fff;
	font-size: 13px; line-height: 1;
}
@media (max-width: 767.98px) {
	.filter-collapse { display: none; padding-top: 12px; }
	.filter-collapse.is-open { display: block; }
}
@media (min-width: 768px) {
	.filter-collapse { display: block !important; }
	.filter-toggle { display: none; }
}

.developer-area-group { margin-bottom: 34px; }
.developer-area-head {
	display: flex; align-items: center; flex-wrap: wrap; gap: 12px;
	margin-bottom: 18px;
}
.developer-area-thumb {
	width: 44px; height: 44px; border-radius: 10px; flex-shrink: 0;
	background-size: cover; background-position: center;
}
.developer-area-title { margin: 0; font-size: 22px; }
.developer-area-all { margin-left: auto; color: #896D56; text-decoration: none; white-space: nowrap; }
.developer-area-all:hover { text-decoration: underline; }


/* archive developer  */
.category-stats-intro p { margin-bottom: 0; }
.category-browse-label { font-weight: 600; margin: 0 0 8px; }
.developers-chips .category-browse-label { margin-top: 16px; }
.category-browse-links { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.browse-link {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 10px 18px; border: 1px solid #d9d9d9; border-radius: 999px;
	background: #fff; color: #051E50; text-decoration: none; line-height: 1.2;
}
.browse-link:hover { border-color: #896D56; color: #896D56; }
.browse-link-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 22px; height: 22px; padding: 0 7px;
	border-radius: 999px; background: #f4f4f4; color: #555; font-size: 13px;
}
.developers-chips-note { font-size: 14px; color: #6c757d; margin: 12px 2px 0; }
.developers-chips-note a { color: #896D56; }
.developers-full-title { font-family: var(--ge-font-display); margin-bottom: 16px; }
.developers-chips-full { scroll-margin-top: 90px; }

/* template/cta-lead */
.ge-area-hero-content p.ge-cta-title {
	font-family: var(--ge-font-display);
	font-size: clamp(24px, 2.8vw, 38px);
	line-height: 1.15;
	color: #fff;
	margin: 14px 0 18px;
}
.ge-area-hero-content p.ge-cta-title + p { max-width: 640px; margin-bottom: 14px; }
.ge-cta-btn { margin-top: 24px; }


/* ================================================
   YouTube Channel Block
   ================================================ */
/* ==================== SECTION: YouTube / video blocks ==================== */
.yt-section {
    padding: 56px 0;
}
.yt-eyebrow {
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
    margin-bottom: 8px;
}
.yt-lead {
    color: #5e5e5e;
    font-size: 15px;
    font-weight: 100;
    max-width: 520px;
    margin-bottom: 0;
}
.yt-stats {
    display: flex;
    align-items: center;
    gap: 20px;
}
.yt-stat {
    display: flex;
    flex-direction: column;
}
.yt-stat-num {
    font-size: 22px;
    font-weight: 600;
    font-family: var(--ge-font-display);
    color: #000;
    line-height: 1;
}
.yt-stat-label {
    font-size: 11px;
    color: #888;
    margin-top: 3px;
}
.yt-stat-divider {
    width: 1px;
    height: 28px;
    background: #ddd;
}
/* Subscribe button */
.yt-subscribe-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #c8102e;
    color: #fff !important;
    font-size: 13px;
    font-weight: 500;
    padding: 10px 22px;
    border-radius: 999px;
    border: none;
    text-decoration: none;
    transition: opacity 0.2s ease;
}
.yt-subscribe-btn:hover {
    opacity: 0.88;
}
.yt-divider {
    border-color: #ebebeb;
    margin: 28px 0;
}
.yt-section-label {
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #888;
    margin-bottom: 14px;
}
/* --- Video cards --- */
.yt-video-card {
    cursor: pointer;
}
.yt-thumb-wrap {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 10px;
    background: #f0f0f0;
}
.yt-thumb-wrap img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform 0.8s ease;
}
.yt-video-card:hover .yt-thumb-wrap img {
    transform: scale(1.04);
}
.yt-duration {
    position: absolute;
    bottom: 9px;
    right: 9px;
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    padding: 2px 7px;
    border-radius: 4px;
}
.yt-play-btn {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.25s ease;
}
.yt-play-btn::before {
    content: '';
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.45);
    position: absolute;
}
.yt-play-btn svg {
    position: relative;
    z-index: 1;
    width: 18px;
    height: 18px;
    margin-left: 3px;
}
.yt-video-card:hover .yt-play-btn {
    opacity: 1;
}
.yt-video-title {
    font-size: 14px;
    font-weight: 500;
    color: #000;
    line-height: 1.4;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.yt-video-views {
    font-size: 12px;
    color: #888;
    margin-bottom: 0;
}
/* --- Shorts --- */
.yt-short-card {
    display: block;
    text-decoration: none;
    color: inherit;
}
.yt-short-thumb {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 8px;
    background: #f0f0f0;
}
.yt-short-thumb img {
    display: block;
    width: 100%;
    aspect-ratio: 9 / 16;
    object-fit: cover;
    object-position: top center;
    transition: transform 0.8s ease;
}
.yt-short-card:hover .yt-short-thumb img {
    transform: scale(1.04);
}
.yt-short-title {
    font-size: 12px;
    color: #000;
    line-height: 1.35;
    margin-bottom: 3px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.yt-short-views {
    font-size: 11px;
    color: #888;
    margin-bottom: 0;
}
.yt-video-desc {
    font-size: 13px;
    color: #5e5e5e;
    font-weight: 100;
    line-height: 1.5;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.yt-video-meta {
    font-size: 12px;
    color: #888;
    margin-bottom: 0;
}

/* ================================================
   Project video block (single project page)
   ================================================ */
.project-video {
    scroll-margin-top: 100px;
}
.project-video-grid {
    display: grid;
    grid-template-columns: 60% 1fr;
    gap: 28px;
    align-items: start;
    margin-top: 30px;
}
.project-video-heading {
    margin-bottom: 15px;
}
.project-video-intro {
    max-width: 75%;
    margin-bottom: 0;
}
.project-video-info {
    min-width: 0;
    margin-top: 40px;
}
.project-video-player .yt-play-btn {
    opacity: 1;
}
.project-video-player .yt-thumb-wrap {
    margin-bottom: 0;
}
.project-video-title {
    font-size: 18px;
    line-height: 1.35;
    margin-bottom: 8px;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}
.project-video-desc {
    font-size: 14px;
    margin-bottom: 10px;
    -webkit-line-clamp: 6;
    line-clamp: 6;
}
.project-video-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 26px;
    padding-top: 10px;
    border-top: 1px solid #ebebeb;
}
.project-video-byline {
    font-size: 13px;
    color: #5e5e5e;
    font-weight: 300;
    line-height: 1.55;
    max-width: 58ch;
    margin-bottom: 0;
}
.project-video-byline a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.project-video-cta {
    height: 48px;
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 991px) {
    .project-video-grid {
        gap: 20px;
    }
}

@media (max-width: 767px) {
    .project-video-grid {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-top: 24px;
    }
    .project-video-intro {
        max-width: 100%;
    }
    .project-video-info {
        margin-top: 4px;
    }
    .project-video-title {
        font-size: 17px;
        line-height: 1.4;
        margin-bottom: 10px;
    }
    .project-video-desc {
        font-size: 15px;
        line-height: 1.6;
        margin-bottom: 12px;
        -webkit-line-clamp: 5;
        line-clamp: 5;
    }
    .project-video-footer {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        margin-top: 24px;
        padding-top: 16px;
    }
    .project-video-byline {
        font-size: 14px;
        line-height: 1.6;
    }
    .project-video-footer .project-video-cta {
        display: block;
        width: 100%;
        max-width: none;
    }
}

/* ================================================
   Show more / show less
   Generic — reusable for any block, not video specific
   ================================================ */
.ge-more {
    margin-top: 24px;
}
.ge-more > summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 48px;
}
.ge-more > summary::-webkit-details-marker {
    display: none;
}
.ge-more[open] > summary {
    margin-bottom: 24px;
}
.ge-more-close,
.ge-more[open] .ge-more-open {
    display: none;
}
.ge-more[open] .ge-more-close {
    display: inline;
}

/* ================================================
   Category videos
   ================================================ */
.category-videos-intro {
    max-width: 75%;
    margin-bottom: 24px;
}
.yt-video-project {
    display: inline-block;
    margin-top: 6px;
    font-size: 12px;
    color: #6b6b6b;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.yt-video-project:hover {
    color: #000;
}

@media (max-width: 767px) {
    .category-videos-intro {
        max-width: 100%;
        margin-bottom: 20px;
    }
    .ge-more > summary {
        display: flex;
        width: 100%;
    }
}

/* ==========================================================================
   Styles moved from inline <style> blocks in templates
   ========================================================================== */

/* from category.php */
.filter-chips { font-size: 14px; }
.filter-chips-count { color: #6c757d; margin-right: 4px; }
.filter-chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 6px 14px; border: 1px solid #d9d9d9; border-radius: 999px;
	background: #fff; color: #051E50; text-decoration: none; line-height: 1;
}
.filter-chip:hover { border-color: #051E50; }
.filter-chip-x { font-size: 16px; color: #6c757d; }
.filter-chip-clear { background: #f4f4f4; border-color: #f4f4f4; }
.category-empty-state { padding: 40px 0; }
.category-stats-intro p { margin-bottom: 0; }
.category-browse-title { font-family: var(--ge-font-display); margin-bottom: 12px; }
.category-browse-text { color: #555; max-width: 720px; }
.category-browse-label { font-weight: 600; margin: 0 0 8px; }
.category-browse-links { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.category-browse-links-stack { flex-direction: column; align-items: flex-start; }
.category-browse-links-stack .browse-link { width: 100%; justify-content: space-between; }
.browse-link {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 10px 18px; border: 1px solid #d9d9d9; border-radius: 999px;
	background: #fff; color: #051E50; text-decoration: none; line-height: 1.2;
}
.browse-link:hover { border-color: #896D56; color: #896D56; }
.browse-link-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 22px; height: 22px; padding: 0 7px;
	border-radius: 999px; background: #f4f4f4; color: #555; font-size: 13px;
}
.category-developers-title,
.category-map-title { font-family: var(--ge-font-display); margin-bottom: 16px; }
/* Developer cards — compact logo tile (3:2, no padding/border) + hover zoom */
.dev-card {
	height: 100%; display: flex; flex-direction: column;
	background: #fff;
}
.dev-card-img-wrap {
	display: flex; align-items: center; justify-content: center;
	aspect-ratio: 3 / 2;
	border-radius: 12px; overflow: hidden; background: #fff;
}
.dev-card-img-wrap img {
	max-width: 100%; max-height: 100%; object-fit: contain;
	transition: transform .35s ease;
}
.dev-card:hover .dev-card-img-wrap img { transform: scale(1.06); }
.dev-card-initial {
	display: inline-flex; align-items: center; justify-content: center;
	width: 64px; height: 64px; border-radius: 50%;
	background: #f0ece8; color: #896D56;
	font-family: var(--ge-font-display); font-size: 30px;
	transition: transform .35s ease;
}
.dev-card:hover .dev-card-initial { transform: scale(1.06); }
.dev-card-body { padding: 12px 2px 0; display: flex; flex-direction: column; gap: 10px; }
.dev-card-name {
	font-size: 17px; margin: 0; line-height: 1.3;
	min-height: 2.6em; /* two lines: long names don't break row alignment */
	display: flex; align-items: flex-start;
}
.dev-card-name a { color: #051E50; text-decoration: none; font-weight: 600; }
.dev-card-name a:hover { color: #896D56; }
.dev-card-links { display: flex; flex-direction: column; gap: 8px; }
.dev-card-link {
	display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
	font-size: 13px; line-height: 1.35;
	color: #555; text-decoration: none;
}
.dev-card-link:hover { color: #896D56; }
.dev-card-arrow { color: #896D56; flex-shrink: 0; }
/* Map styles live in template-parts/category-map.php; CTA styles in cta-lead.php */
.filter-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; }
.filter-toggle-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 22px; height: 22px; padding: 0 6px;
	border-radius: 999px; background: #896D56; color: #fff;
	font-size: 13px; line-height: 1;
}
@media (max-width: 767.98px) {
	.filter-collapse { display: none; padding-top: 12px; }
	.filter-collapse.is-open { display: block; }
}
@media (min-width: 768px) {
	.filter-collapse { display: block !important; }
	.filter-toggle { display: none; }
}

/* from amenities.php */
/* ==================== SECTION: Amenities ==================== */
.amenity-col {
  padding-right: 10px;
  margin-bottom: 25px;
}

.amenity-header {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 600;
  font-size: 1rem;
  margin-bottom: 0.25rem;
}

.amenity-header svg,
.amenity-header img {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
}

.amenity-col p {
  font-size: 16px;
  color: #5e5e5e;
  line-height: 1.4;
  margin: 0;
}

/* from single.php */
	.single-post__title {
    font-size: 2.4rem;
    line-height: 1.2;
}

.single-post__content {
    font-size: 1.05rem;
    line-height: 1.7;
}

.single-breadcrumbs p {
    margin: 0;
    font-size: 0.9rem;
    opacity: 0.7;
}

/* from archive-developer.php */
.category-stats-intro p { margin-bottom: 0; }
.category-browse-label { font-weight: 600; margin: 0 0 8px; }
.developers-chips .category-browse-label { margin-top: 16px; }
.category-browse-links { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.browse-link {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 10px 18px; border: 1px solid #d9d9d9; border-radius: 999px;
	background: #fff; color: #051E50; text-decoration: none; line-height: 1.2;
}
.browse-link:hover { border-color: #896D56; color: #896D56; }
.browse-link-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 22px; height: 22px; padding: 0 7px;
	border-radius: 999px; background: #f4f4f4; color: #555; font-size: 13px;
}
/* ==================== SECTION: Developers grid ==================== */
.developers-chips-note { font-size: 14px; color: #6c757d; margin: 12px 2px 0; }
.developers-chips-note a { color: #896D56; }
.developers-full-title { font-family: var(--ge-font-display); margin-bottom: 16px; }
.developers-chips-full { scroll-margin-top: 90px; }

/* from template-parts/developers-grid.php */
.developers-grid-title { font-family: var(--ge-font-display); margin-bottom: 16px; }

/* from template-parts/news-slider-latest.php */
    .news-slider-section a{text-decoration: none; color: #000; font-size: 16px; font-weight: 500}
        .news-slider-section a:hover{text-decoration: underline;}
    .news-slider-section .blog-description{color: #5e5e5e;
    font-size: 15px;
    font-weight: 100;}
    .news-slider-section .property-item img {border-radius: 12px}

/* from template-parts/category-map.php */
.category-map { height: 440px; border-radius: 24px; overflow: hidden; background: #f4f4f4; }
.category-map-note { font-size: 13px; color: #8a8a8a; margin: 10px 4px 0; max-width: 860px; }
.category-map-popup { min-width: 150px; }
.category-map-popup strong { display: block; margin-bottom: 2px; }
.category-map-popup a { display: inline-block; margin-top: 4px; color: #896D56; }
@media (max-width: 767.98px) { .category-map { height: 320px; } }

/* from footer.php */
.otgs-development-site-front-end{display:none!important}

/* ---- Utilities / components replacing inline style="" ---- */
.u-h48 { height: 48px; }
.u-mt20 { margin-top: 20px; }
.u-hidden { display: none; }
.u-lowercase { text-transform: lowercase; }
.u-crimson { color: crimson; }
.u-overflow-hidden { overflow: hidden; }
.u-radius12 { border-radius: 12px; }
.page-title-left { display: block; width: 100%; text-align: left; }
.dev-check-icon { margin: auto 8px auto 50px; }
.form-submit-btn { width: 200px; height: 48px; }   /* вигляд: DESIGN SYSTEM · buttons */
.form-msg { display: none; }
.form-msg--sending { margin-top: 10px; color: #444; }
.form-msg--success { margin-top: 15px; color: green; font-size: 16px; }
.form-msg--error { margin-top: 15px; color: red; font-size: 16px; }
.lm-placeholder { width: 100%; height: 100%; background: #222; display: flex; align-items: center; justify-content: center; }
.lm-placeholder-icon { font-size: 2rem; color: rgba(255,255,255,.3); }
.na-card-ph-icon { font-size: 2rem; color: #ccc; }
.na-card-name { font-weight: 600; font-size: 14px; }
.map-pin { position: relative; width: 22px; height: 22px; }
.map-pin-dot { position: absolute; inset: 0; background: #000; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 3px 10px rgba(0,0,0,.4); }

/* Map price pins + clusters (category-map.php) */
.price-pin-wrap { background: none; border: 0; }
.price-pin { position: absolute; left: 0; top: 0; transform: translate(-50%, calc(-100% - 7px)); background: #000; color: #fff; font-size: 12px; font-weight: 600; line-height: 1; white-space: nowrap; padding: 7px 11px; border-radius: 999px; border: 2px solid #fff; box-shadow: 0 3px 10px rgba(0,0,0,.35); cursor: pointer; transition: background .15s; }
.price-pin::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 0; height: 0; transform: translateX(-50%); border: 5px solid transparent; border-top: 6px solid #000; border-bottom: 0; }
.price-pin-wrap:hover .price-pin { background: crimson; }
.price-pin-wrap:hover .price-pin::after { border-top-color: crimson; }
.price-pin-wrap:hover { z-index: 10000 !important; }
.cluster-pin { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); min-width: 36px; height: 36px; padding: 0 8px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; background: #fff; color: #000; font-size: 14px; font-weight: 700; border-radius: 999px; border: 3px solid #000; box-shadow: 0 3px 10px rgba(0,0,0,.35); cursor: pointer; }
.price-pin-wrap .map-pin { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); }
.price-pin--main { display: flex; align-items: center; gap: 6px; padding: 8px 12px; font-size: 13px; }
.price-pin--main i { font-size: 13px; }
.price-pin-pulse { position: absolute; left: 0; top: 0; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: rgba(220, 20, 60, .45); animation: price-pin-pulse 2s ease-out infinite; pointer-events: none; }
@keyframes price-pin-pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(3.2); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .price-pin-pulse { animation: none; } }


/* ==========================================================================
   HOME (gh-) · головна сторінка
   Нові блоки головної. Префікс gh- (Gorilla home), щоб не змішувати зі старими ge-* і Bootstrap.
   Розмітка: template-parts/home/*.php, дані: inc/home-data.php, скрипт: js/home.js.
   Старі правила головної (.hero, .hero-pocket, .property-item…) видалимо, коли всі блоки будуть переведені.
   ========================================================================== */

/* ---- Спільні компоненти секцій ---- */
.btn-ghost {
	--bs-btn-color: var(--ge-on-dark);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: rgba(255, 255, 255, .7);
	--bs-btn-hover-color: var(--ge-on-dark);
	--bs-btn-hover-bg: rgba(255, 255, 255, .12);
	--bs-btn-hover-border-color: #fff;
	--bs-btn-active-color: var(--ge-on-dark);
	--bs-btn-active-bg: rgba(255, 255, 255, .18);
	--bs-btn-active-border-color: #fff;
	background: transparent;
	color: var(--ge-on-dark);
	border-color: rgba(255, 255, 255, .7);
}
.btn-ghost:hover,
.btn-ghost:focus-visible { background: rgba(255, 255, 255, .12); border-color: #fff; color: var(--ge-on-dark); }
.btn-sm { min-height: 44px; padding-inline: 20px; font-size: 14px; }

.gh-sec { padding-block: clamp(56px, 7vw, 96px); }
.gh-sec--white { background: var(--ge-surface); }
.gh-sec--tint { background: var(--ge-tint); }

.gh-eyebrow { margin: 0; color: var(--ge-teal-700); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.gh-h2 { margin: 10px 0 0; max-width: 22ch; font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3rem); }
.gh-lede { margin: 14px 0 0; max-width: 60ch; color: var(--ge-ink-muted); font-size: 1.08rem; }
.gh-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 32px; margin-bottom: 34px; }
.gh-link-row { margin: 26px 0 0; }
.gh-link-row a { padding-bottom: 2px; border-bottom: 2px solid var(--ge-blue-500); font-weight: 700; text-decoration: none; }

/* ---- Hero ---- */
.gh-hero-wrap { padding-top: 14px; }

.gh-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 620px;
	padding: clamp(28px, 5vw, 72px);
	padding-bottom: clamp(110px, 14vw, 150px);
	overflow: hidden;
	border-radius: var(--ge-r-lg);
	background: var(--ge-hero-gradient);
	color: var(--ge-on-dark);
}

.gh-hero-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
}

.gh-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: var(--ge-hero-overlay);
}

.gh-hero-copy { position: relative; z-index: 2; max-width: 640px; }

.gh-hero .gh-eyebrow { display: flex; align-items: center; gap: 10px; color: var(--ge-on-dark-muted); }
.gh-hero .gh-eyebrow::before { content: ""; width: 14px; height: 1px; background: currentColor; }

.gh-hero h1 { margin: 14px 0 0; color: #fff; font-size: clamp(2.4rem, 1.3rem + 3.6vw, 4.2rem); }

.gh-hero-text { margin: 18px 0 0; max-width: 52ch; color: var(--ge-on-dark-muted); font-size: 1.05rem; }

.gh-hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* «Кишеня» автора: нерегулярна форма hero (виріз у правому нижньому куті з плавними кутами) */
.gh-pocket {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 20px 30px 20px 26px;
	background: var(--ge-bg);
	border-top-left-radius: var(--ge-r-lg);
	color: var(--ge-ink);
}

.gh-pocket::before,
.gh-pocket::after {
	content: "";
	position: absolute;
	width: 24px;
	height: 24px;
	background: radial-gradient(circle at 0 0, transparent 24px, var(--ge-bg) 24.5px);
}

.gh-pocket::before { left: -24px; bottom: 0; }
.gh-pocket::after { right: 0; top: -24px; }

.gh-pocket b { display: block; color: var(--ge-blue-800); font-size: 15px; }
.gh-pocket span { color: var(--ge-ink-muted); font-size: 13.5px; }

.gh-avatar {
	flex: none;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 18%;
	background: var(--ge-blue-100);
}

/* ---- Смуга фактів ---- */
.gh-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }

.gh-facts div {
	display: flex;
	flex-direction: column;
	padding: 18px 20px;
	background: var(--ge-surface);
	border: 1px solid var(--ge-line);
	border-radius: var(--ge-r-md);
}

.gh-facts b { color: var(--ge-blue-800); font-family: var(--ge-font-display); font-size: 2.2rem; font-weight: 700; line-height: 1; }
.gh-facts span { margin-top: 6px; color: var(--ge-ink-muted); font-size: 14px; }

/* ---- Вкладки і сітка проєктів ---- */
.gh-tabs { display: inline-flex; gap: 4px; padding: 4px; background: var(--ge-tint); border-radius: 999px; }

.gh-tabs button {
	min-height: 44px;
	padding-inline: 24px;
	background: transparent;
	color: var(--ge-ink-muted);
	border: 0;
	border-radius: 999px;
	font: 700 15px var(--ge-font-body);
	cursor: pointer;
}

.gh-tabs button[aria-selected="true"] { background: var(--ge-blue-800); color: #fff; }

.gh-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }

/* 7 карток + плитка «ще» = 8: на десктопі рівно 2 ряди по 4, на планшеті 4 ряди по 2 */
@media (min-width: 768px) { .gh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .gh-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.gh-grid[hidden] { display: none; }

/* ---- Нова картка проєкту ---- */
.gh-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	background: var(--ge-surface);
	border-radius: var(--ge-r-md);
	box-shadow: var(--ge-shadow-card);
}

.gh-card:has(.gh-card-title a:focus-visible) { outline: 3px solid var(--ge-blue-500); outline-offset: 2px; }

.gh-card-ph { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: linear-gradient(160deg, var(--ge-blue-500), var(--ge-blue-800)); }

.gh-card-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }

.gh-badge {
	position: absolute;
	z-index: 2;
	top: 14px;
	left: 14px;
	padding: 5px 13px;
	background: var(--ge-surface);
	color: var(--ge-blue-800);
	border-radius: 999px;
	box-shadow: 0 4px 14px rgba(14, 29, 82, .12);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.gh-badge + .gh-badge { top: 46px; }
.gh-badge--lux { background: var(--ge-blue-800); color: #fff; }

.gh-card-body { display: flex; flex: 1; flex-direction: column; gap: 10px; padding: 20px; }

.gh-card-title { margin: 0; font-size: 1.65rem; }
.gh-card-title a { color: var(--ge-blue-800); text-decoration: none; }
.gh-card-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }

.gh-card-meta { margin: -4px 0 0; color: var(--ge-ink-muted); font-size: 14px; }

.gh-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

.gh-pills li {
	padding: 3px 10px;
	color: var(--ge-teal-700);
	border: 1px solid var(--ge-teal-700);
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
}

.gh-pills .gh-pill--gv { background: var(--ge-tint); }

.gh-card-foot { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 10px 8px; margin-top: auto; padding-top: 6px; }

.gh-price small { display: block; color: var(--ge-ink-muted); font-size: 12px; }
.gh-price b { display: block; color: var(--ge-blue-800); font-family: var(--ge-font-display); font-size: 1.3rem; line-height: 1.15; white-space: nowrap; }
.gh-price span { display: block; color: var(--ge-ink-muted); font-size: 12.5px; white-space: nowrap; }
.gh-price .gh-price--ask { font-size: 1.15rem; }

/* WhatsApp: кнопка лишається на картці, у правому нижньому куті фото (над розтягнутим посиланням) */
.gh-wa {
	position: absolute;
	z-index: 3;
	right: 12px;
	bottom: 12px;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	background: #fff;
	color: var(--ge-ok);
	border-radius: 50%;
	box-shadow: 0 4px 14px rgba(14, 29, 82, .22);
	font-size: 24px;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

.gh-wa:hover { background: var(--ge-ok); color: #fff; }

/* Request details: праворуч від ціни; на дуже вузькій картці переноситься під ціну */
.gh-card-btn { position: relative; z-index: 2; flex: none; width: auto; max-width: none; margin: 0 0 0 auto; padding-inline: 10px; font-size: 13px; white-space: nowrap; }

/* Плитка «ще» */
.gh-more {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	gap: 14px;
	min-height: 280px;
	padding: 26px;
	background: var(--ge-hero-gradient);
	border-radius: var(--ge-r-md);
	color: #fff;
}

.gh-more h3 { margin: 0; color: #fff; font-size: 1.9rem; }
.gh-more p { margin: 0; color: var(--ge-on-dark-muted); }
.gh-more .btn { margin-top: 2px; }
.gh-more-link,
.gh-more-link:visited { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.gh-more-link:hover { color: #fff; }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.gh-card:hover .gh-card-ph img { transform: scale(1.06); }
}

/* ---- Адаптив головної ---- */
@media (max-width: 900px) {
	.gh-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
	.gh-hero { min-height: 0; padding-bottom: 120px; }
	/* фото лежить під текстом на всю ширину: рівна темна вуаль замість бокового згасання */
	.gh-hero::before { background: linear-gradient(180deg, rgba(14, 29, 82, .86) 0%, rgba(14, 29, 82, .62) 100%); }
	.gh-hero-ctas .btn { flex: 1 1 100%; }
	.gh-pocket { gap: 12px; padding: 16px 20px 16px 18px; }
	.gh-pocket .gh-avatar { width: 44px; height: 44px; }
	.gh-facts div { padding: 14px 16px; }
	.gh-facts b { font-size: 1.9rem; }
	.gh-head { margin-bottom: 24px; }
	.gh-tabs { width: 100%; }
	.gh-tabs button { flex: 1; padding-inline: 12px; }
	.gh-more { min-height: 0; }
}

@media (max-width: 380px) {
	.gh-card-body { padding: 16px; }
	.gh-card-title { font-size: 1.45rem; }
}

/* ---- HOME · Why us ---- */
.gh-h2--wide { max-width: 26ch; }

.gh-why-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; margin-top: 34px; align-items: start; }

.gh-vs { overflow: hidden; background: var(--ge-surface); border: 1px solid var(--ge-line); border-radius: var(--ge-r-md); }
.gh-vs-head,
.gh-vs-row { display: grid; grid-template-columns: 1fr 1fr; }
.gh-vs-head > div { padding: 14px 20px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.gh-vs-head .them { background: var(--ge-bg); color: var(--ge-ink-muted); }
.gh-vs-head .us { background: var(--ge-blue-800); color: #fff; }
.gh-vs-row > div { display: flex; align-items: flex-start; gap: 12px; padding: 16px 20px; border-top: 1px solid var(--ge-line); font-size: 15px; }
.gh-vs-row .them { background: var(--ge-bg); color: var(--ge-ink-muted); }
.gh-vs-row .us { background: var(--ge-tint); font-weight: 500; }
.gh-vs-row i { flex: none; width: 20px; font-style: normal; font-weight: 800; text-align: center; }
.gh-vs-row .them i { color: #8A99A0; }
.gh-vs-row .us i { color: var(--ge-teal-700); }

.gh-proof { display: flex; flex-direction: column; gap: 16px; padding: 26px; background: var(--ge-blue-100); border-radius: var(--ge-r-md); color: var(--ge-ink-muted); }
.gh-proof p { margin: 0; }
.gh-who { display: flex; align-items: center; gap: 14px; }
.gh-who h3 { margin: 0; color: var(--ge-blue-900); font-size: 1.8rem; }
.gh-role { font-size: 14px; }
.gh-avatar--lg { width: 64px; height: 64px; }
.gh-since { color: var(--ge-teal-700); font-size: 13px; font-weight: 600; }

/* Переваги: пласко, лише лінія зверху */
.gh-adv { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 28px 32px; margin-top: 40px; }
.gh-adv > div { padding: 18px 4px 0; border-top: 1px solid var(--ge-line); }
.gh-adv h3 { margin: 0; font-size: 1.45rem; }
.gh-adv p { margin: 8px 0 0; color: var(--ge-ink-muted); font-size: 15px; }

/* Темна смуга Brochure vs Reality: єдиний темний акцент секції */
.gh-insp {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: 28px;
	align-items: center;
	margin-top: 40px;
	padding: clamp(24px, 4vw, 44px);
	background: var(--ge-blue-900);
	border-radius: var(--ge-r-lg);
	color: var(--ge-on-dark-muted);
}

.gh-insp .gh-eyebrow { color: var(--ge-on-dark-subtle); }
.gh-insp h3 { margin: 10px 0 0; color: #fff; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); }
.gh-insp p { margin: 12px 0 0; }
.gh-insp .gh-eyebrow { margin: 0; }
.gh-insp-hint { color: #fff; font-size: 14px; font-weight: 600; }

.gh-chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }

.gh-chips button {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 64px;
	padding: 12px 40px 12px 14px;
	background: rgba(255, 255, 255, .08);
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--ge-r-sm);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease;
}

.gh-chips button:hover { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .4); }
.gh-chips b { font-size: 14.5px; line-height: 1.25; }
.gh-chips span { color: var(--ge-on-dark-subtle); font-size: 12.5px; }
.gh-chip-play { position: absolute; right: 14px; top: 50%; margin-top: -7px; color: var(--ge-gold-500); }

/* ---- HOME · відео каналу (пласко, без коробки) ---- */
.gh-watch { margin-top: 64px; }
.gh-watch-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 18px 32px; }
.gh-watch h3 { margin: 8px 0 0; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); }
.gh-watch-head p:not(.gh-eyebrow) { max-width: 52ch; margin: 8px 0 0; color: var(--ge-ink-muted); }
.gh-yt-stats { display: flex; gap: 26px; }
.gh-yt-stats b { display: block; color: var(--ge-blue-800); font-family: var(--ge-font-display); font-size: 2.1rem; line-height: 1; }
.gh-yt-stats span { color: var(--ge-ink-muted); font-size: 13px; }

.gh-vids { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 26px; }

.gh-vid { display: flex; flex-direction: column; gap: 10px; cursor: pointer; }
.gh-vid b { font-size: 15.5px; font-weight: 600; line-height: 1.35; }
.gh-vid:focus-visible { outline: 3px solid var(--ge-blue-500); outline-offset: 4px; border-radius: var(--ge-r-md); }

.gh-vid-th { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ge-blue-800); border-radius: var(--ge-r-md); }
.gh-vid-th img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.gh-vid-dur { position: absolute; right: 10px; bottom: 10px; z-index: 2; padding: 2px 8px; background: rgba(14, 29, 82, .85); color: #fff; border-radius: 6px; font-size: 12px; font-weight: 600; }

.gh-vid-play { position: absolute; left: 50%; top: 50%; z-index: 2; width: 58px; height: 58px; margin: -29px 0 0 -29px; background: rgba(255, 255, 255, .94); border-radius: 50%; box-shadow: 0 6px 20px rgba(14, 29, 82, .35); }
.gh-vid-play::after { content: ""; position: absolute; left: 23px; top: 18px; border-left: 17px solid var(--ge-blue-800); border-top: 11px solid transparent; border-bottom: 11px solid transparent; }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.gh-vid:hover .gh-vid-th img { transform: scale(1.05); }
}

/* ---- HOME · середній акцентний блок ---- */
.gh-mid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
	gap: 24px;
	align-items: center;
	margin-top: 64px;
	padding: clamp(22px, 3.5vw, 38px);
	background: var(--ge-tint);
	border-radius: var(--ge-r-lg);
}

.gh-mid h3 { margin: 0; font-size: 2rem; }
.gh-mid p { margin: 8px 0 0; color: var(--ge-ink-muted); }
.gh-mid-cta { display: flex; justify-content: flex-start; }

/* Поля форм (спільні для прев'ю адміністратора; видно лише їм до етапу форм) */
.gh-form { display: flex; flex-direction: column; gap: 12px; }
.gh-admin-note { margin: 0 !important; padding: 8px 12px; background: #FFF4D6; color: #6B4E00 !important; border-radius: var(--ge-r-sm); font-size: 13px; }

.gh-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; background: #D6E5E5; border-radius: 999px; }
.gh-toggle button { min-height: 42px; background: transparent; color: var(--ge-ink-muted); border: 0; border-radius: 999px; font: 700 14px/1 var(--ge-font-body); cursor: pointer; }
.gh-toggle button[aria-pressed="true"] { background: var(--ge-gold-500); color: var(--ge-ink); }

.gh-mid-fields { display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end; }
.gh-field { display: flex; flex-direction: column; gap: 6px; }
.gh-field label { color: var(--ge-ink-muted); font-size: 12px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }

.gh-form .gh-field input {
	width: 100%;
	height: 52px;
	margin: 0;
	padding: 0 16px;
	background: var(--ge-surface);
	color: var(--ge-ink);
	border: 1px solid var(--ge-line);
	border-radius: var(--ge-r-sm);
	font: 400 16px var(--ge-font-body);
}

.gh-form .gh-field input:focus { border-color: var(--ge-blue-700); box-shadow: 0 0 0 3px rgba(69, 96, 216, .25); outline: none; }

.gh-msg { padding: 10px 14px; border-radius: var(--ge-r-sm); font-size: 14.5px; font-weight: 600; }
.gh-msg.is-ok { background: #DDF0E6; color: var(--ge-ok); }
.gh-msg.is-err { background: #FBE4E2; color: var(--ge-err); }

/* ---- HOME · Golden Visa + чому Дубай ---- */
.gh-gv-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 22px 40px;
	padding: clamp(22px, 3.5vw, 40px);
	background: var(--ge-surface);
	border-left: 6px solid var(--ge-gold-500);
	border-radius: var(--ge-r-md);
	box-shadow: var(--ge-shadow-card);
}

.gh-gv-box > div { flex: 1 1 480px; min-width: 0; }
.gh-gv-box h2 { margin: 8px 0 0; font-size: clamp(1.7rem, 1.3rem + 1.6vw, 2.5rem); }
.gh-gv-box p:not(.gh-eyebrow) { max-width: 64ch; margin: 12px 0 0; color: var(--ge-ink-muted); }
.gh-gv-box small { display: block; margin-top: 10px; color: var(--ge-ink-muted); font-size: 13px; }

.gh-reasons { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 28px 32px; margin-top: 40px; }
.gh-reasons > div { padding: 18px 4px 0; border-top: 1px solid rgba(14, 37, 48, .18); }
.gh-reasons small { color: var(--ge-teal-700); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.gh-reasons h3 { margin: 8px 0 0; font-size: 1.45rem; }
.gh-reasons p { margin: 8px 0 0; color: var(--ge-ink-muted); font-size: 15px; }
.gh-note { margin: 18px 0 0; color: var(--ge-ink-muted); font-size: 13px; }

/* ---- HOME · райони: два ряди стрічок ---- */
.gh-sec--areas { padding-bottom: clamp(48px, 6vw, 80px); overflow: hidden; }
.gh-sec--areas .gh-head { margin-bottom: 0; }

.gh-marquee { overflow-x: auto; scrollbar-width: none; margin-top: 28px; padding-inline: 12px; cursor: grab; }
.gh-marquee::-webkit-scrollbar { display: none; }
.gh-marquee.dragging { cursor: grabbing; }
.gh-marquee.dragging a { pointer-events: none; }
.gh-marquee + .gh-marquee { margin-top: 16px; }

/* початок стрічки вирівняний по контейнеру сторінки */
@media (min-width: 576px) { .gh-marquee { padding-inline: max(12px, calc((100% - 540px) / 2 + 12px)); } }
@media (min-width: 768px) { .gh-marquee { padding-inline: max(12px, calc((100% - 720px) / 2 + 12px)); } }
@media (min-width: 992px) { .gh-marquee { padding-inline: max(12px, calc((100% - 960px) / 2 + 12px)); } }
@media (min-width: 1200px) { .gh-marquee { padding-inline: max(12px, calc((100% - 1140px) / 2 + 12px)); } }
@media (min-width: 1400px) { .gh-marquee { padding-inline: max(12px, calc((100% - 1320px) / 2 + 12px)); } }

.gh-track { display: flex; gap: 16px; width: max-content; }

.gh-area {
	position: relative;
	flex: none;
	overflow: hidden;
	background: linear-gradient(170deg, var(--ge-blue-500), var(--ge-blue-800));
	border-radius: var(--ge-r-md);
	color: #fff;
}

.gh-marquee--big .gh-area { width: 300px; aspect-ratio: 3 / 4; }
.gh-marquee--small .gh-area { width: 220px; aspect-ratio: 1 / 1; }

.gh-area img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gh-area::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 29, 82, 0) 40%, rgba(14, 29, 82, .88) 100%); }

.gh-area-text { position: absolute; z-index: 2; left: 16px; right: 16px; bottom: 14px; display: flex; flex-direction: column; gap: 2px; }
.gh-area h3 { margin: 0 0 4px; color: #fff; font-size: 1.6rem; line-height: 1.1; }
.gh-marquee--small .gh-area h3 { font-size: 1.3rem; }
.gh-area h3 a { color: #fff; text-decoration: none; }
.gh-area h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }   /* вся плитка веде в район */
.gh-area-line { position: relative; z-index: 3; color: var(--ge-on-dark-muted); font-size: 13.5px; }
.gh-area-line a { color: inherit; text-decoration: none; border-bottom: 1px solid transparent; }
.gh-area-line a:hover { color: #fff; border-bottom-color: rgba(255, 255, 255, .6); }
.gh-area-line b { color: #fff; font-weight: 700; }
.gh-area-line em { color: #F0DDB3; font-style: normal; }
.gh-area:has(h3 a:focus-visible) { outline: 3px solid var(--ge-blue-500); outline-offset: 2px; }

/* ---- HOME · діалог відео ---- */
.gh-vdlg { position: fixed; inset: 0; margin: auto; width: min(960px, calc(100vw - 24px)); max-width: none; height: fit-content; max-height: calc(100dvh - 24px); padding: 52px 0 0; overflow: hidden; background: #000; color: #fff; border: 0; border-radius: var(--ge-r-md); }
.gh-vdlg::backdrop { background: rgba(6, 11, 20, .82); }
.gh-vdlg-frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.gh-vdlg-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.gh-vdlg-title { margin: 0; padding: 12px 16px 14px; color: #D8DCE6; font-size: 14px; line-height: 1.4; }
.gh-vdlg-close { position: absolute; z-index: 3; top: 6px; right: 8px; bottom: auto; left: auto; float: none; display: grid; place-items: center; margin: 0; padding: 0; width: 40px; height: 40px; background: #fff; color: var(--ge-ink); border: 0; border-radius: 50%; font-size: 16px; line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .35); }
.gh-vdlg-close:hover { background: var(--ge-blue-100); }
html.gh-vopen { overflow: hidden; }

/* ---- HOME · адаптив (батч 2) ---- */
@media (max-width: 900px) {
	.gh-why-grid,
	.gh-insp,
	.gh-mid { grid-template-columns: minmax(0, 1fr); }
	.gh-mid-fields { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
	.gh-vids { grid-template-columns: minmax(0, 1fr); }
	.gh-yt-stats { gap: 20px; }
	.gh-watch { margin-top: 48px; }
	.gh-mid { margin-top: 48px; }
	.gh-gv-box .btn { width: 100%; }
	.gh-mid-cta .btn { width: 100%; }
	.gh-marquee--big .gh-area { width: 240px; }
	.gh-marquee--small .gh-area { width: 170px; }
	.gh-area h3 { font-size: 1.4rem; }
	.gh-marquee--small .gh-area h3 { font-size: 1.15rem; }
}

@media (max-width: 560px) {
	/* таблиця порівняння: пари рядків «типовий агент / Gorilla» одна під одною */
	.gh-vs-head,
	.gh-vs-row { grid-template-columns: minmax(0, 1fr); }
	.gh-vs-head .them { display: none; }
	.gh-vs-row .them { padding-bottom: 6px; border-bottom: 0; }
	.gh-vs-row .us { border-top: 0; }
	.gh-proof { padding: 22px; }
}

/* ---- HOME · девелопери ---- */
.gh-label { margin: 34px 0 12px; color: var(--ge-ink-muted); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

/* «Also available»: 14 плиток = 2 повні ряди по 7 на широкому екрані; на вужчих показано перші 12 (діляться на 2, 3, 4, 6) */
.gh-devs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gh-devs:not(.gh-devs--focus) > :nth-child(n + 13) { display: none; }
@media (min-width: 576px) { .gh-devs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px) { .gh-devs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .gh-devs { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1400px) {
	.gh-devs { grid-template-columns: repeat(7, minmax(0, 1fr)); }
	.gh-devs:not(.gh-devs--focus) > :nth-child(n + 13) { display: flex; }
}
.gh-devs.gh-devs--focus { grid-template-columns: repeat(3, minmax(0, 1fr)); }   /* 9 фокусних = рівно 3 ряди по 3 */


.gh-dev {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
	min-height: 104px;
	padding: 16px;
	background: var(--ge-surface);
	border: 1px solid var(--ge-line);
	border-radius: var(--ge-r-sm);
	color: var(--ge-ink-muted);
	text-decoration: none;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.gh-dev:hover { border-color: var(--ge-blue-700); box-shadow: var(--ge-shadow-card); color: var(--ge-ink-muted); }
.gh-dev--feat { min-height: 124px; border-color: var(--ge-blue-500); }

/* Логотипи на білому тлі плитки, єдина висота області, без обробки кольору */
.gh-dev-logo { display: flex; align-items: center; justify-content: center; height: 52px; }
.gh-dev--feat .gh-dev-logo { height: 64px; }
.gh-dev-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; background: #fff; }
.gh-dev-logo b { color: var(--ge-blue-800); font-family: var(--ge-font-display); font-size: 1.5rem; font-weight: 700; line-height: 1.1; text-align: center; }
.gh-dev-meta { color: var(--ge-ink-muted); font-size: 12.5px; text-align: center; }

/* ---- HOME · як це працює ---- */
.gh-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; margin: 30px 0 0; padding: 0; list-style: none; counter-reset: gh-step; }

.gh-steps li {
	position: relative;
	padding: 24px;
	background: var(--ge-bg);
	border-radius: var(--ge-r-md);
}

.gh-steps li::before {
	counter-increment: gh-step;
	content: counter(gh-step);
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	margin-bottom: 14px;
	background: var(--ge-blue-800);
	color: #fff;
	border-radius: 50%;
	font: 700 15px var(--ge-font-body);
}

.gh-steps h3 { margin: 0; font-size: 1.5rem; }
.gh-steps p { margin: 8px 0 0; color: var(--ge-ink-muted); font-size: 15px; }

.gh-also { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 26px; color: var(--ge-ink-muted); font-size: 14px; }
.gh-also .t { margin-right: 4px; color: var(--ge-ink); font-weight: 700; }
.gh-also .p { padding: 6px 14px; background: var(--ge-bg); border: 1px solid var(--ge-line); border-radius: 999px; }

/* ---- HOME · безпека ---- */
.gh-safe { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 34px; }

.gh-sc {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
	padding: 22px;
	background: var(--ge-surface);
	border-radius: var(--ge-r-md);
	box-shadow: 0 2px 10px rgba(14, 29, 82, .05);
}

.gh-sc small { color: var(--ge-teal-700); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.gh-sc h3 { margin: 0; font-size: 1.45rem; }
.gh-sc p { margin: 0; color: var(--ge-ink-muted); font-size: 15px; }
.gh-ico { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 4px; background: var(--ge-tint); color: var(--ge-teal-700); border-radius: 12px; }

/* ---- HOME · статті ---- */
.gh-posts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 20px; }
.gh-post { display: flex; flex-direction: column; gap: 12px; color: inherit; text-decoration: none; }
.gh-post-ph { position: relative; display: block; aspect-ratio: 3 / 2; overflow: hidden; background: linear-gradient(160deg, var(--ge-blue-500), var(--ge-blue-800)); border-radius: var(--ge-r-md); }
.gh-post-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.gh-post b { color: var(--ge-blue-800); font-family: var(--ge-font-display); font-size: 1.45rem; font-weight: 600; line-height: 1.15; }
.gh-post:hover b { color: var(--ge-blue-700); }
.gh-post-date { color: var(--ge-ink-muted); font-size: 14px; }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.gh-post:hover .gh-post-ph img { transform: scale(1.06); }
}

/* ---- HOME · FAQ ---- */
.gh-sec--line { border-top: 1px solid var(--ge-line); }
.gh-faq-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: start; }

.gh-faq details { border-bottom: 1px solid var(--ge-line); }
.gh-faq details:first-child { border-top: 1px solid var(--ge-line); }
.gh-faq summary { position: relative; padding: 20px 36px 20px 0; font-size: 1.05rem; font-weight: 700; list-style: none; cursor: pointer; }
.gh-faq summary::-webkit-details-marker { display: none; }
.gh-faq summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 10px; height: 10px; border-right: 2px solid var(--ge-blue-700); border-bottom: 2px solid var(--ge-blue-700); transform: translateY(-70%) rotate(45deg); transition: transform .25s ease; }
.gh-faq details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.gh-faq details p { max-width: 62ch; margin: 0; padding: 0 0 20px; color: var(--ge-ink-muted); }

/* ---- HOME · фінальна заявка (поки лише для адміністратора) ---- */
.gh-final-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 64px); align-items: center; }
.gh-formcard { padding: 24px; background: var(--ge-surface); border-radius: var(--ge-r-lg); box-shadow: var(--ge-shadow-card); }
.gh-formcard .gh-toggle { background: var(--ge-tint); }
.gh-fine { margin: 0; color: var(--ge-ink-muted); font-size: 13px; line-height: 1.5; }
.gh-wa-link { display: inline-block; margin-top: 22px; padding-block: 8px; font-weight: 700; }

/* ---- HOME · адаптив (батч 3) ---- */
@media (max-width: 1100px) {
	.gh-safe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
	.gh-faq-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}

@media (max-width: 860px) {
	.gh-final-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
	.gh-label { margin-top: 26px; }
	.gh-dev { min-height: 92px; padding: 12px; }
	.gh-dev--feat { min-height: 104px; }
}

@media (max-width: 560px) {
	.gh-devs.gh-devs--focus { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gh-devs--focus > :last-child:nth-child(odd) { grid-column: 1 / -1; }
	.gh-safe { grid-template-columns: minmax(0, 1fr); }
	.gh-formcard { padding: 20px; }
}