.ucr-header-shell-style,
.elementor-location-header,
header.elementor-element-ecc7662 {
z-index: 9999 !important;
}
/*
* V2 header is always viewport-pinned: position fixed, top/left/right 0,
* full width, no floating capsule / side margins / border-radius.
* Elementor atomic CSS uses inset-block-start; force physical edges so
* scroll state cannot leave the bar “in the air” (user snip 2026-07-31).
*/
.ucr-header-shell-style,
header.elementor-element-ecc7662,
.elementor-location-header .elementor-element-ecc7662 {
position: fixed !important;
top: var(--ucr-admin-bar-h, 0px) !important;
left: 0 !important;
right: 0 !important;
inset-block-start: var(--ucr-admin-bar-h, 0px) !important;
inset-inline-start: 0 !important;
inset-inline-end: 0 !important;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
transform: none !important;
border-radius: 0 !important;
box-sizing: border-box !important;
}
.ucr-header-shell-style {
transition:
height 400ms cubic-bezier(0.16, 1, 0.3, 1),
min-height 400ms cubic-bezier(0.16, 1, 0.3, 1),
background-color 400ms cubic-bezier(0.16, 1, 0.3, 1),
border-color 400ms cubic-bezier(0.16, 1, 0.3, 1),
box-shadow 400ms cubic-bezier(0.16, 1, 0.3, 1),
top 0s,
inset-block-start 0s;
}
.ucr-header-shell-style.scrolled {
height: 70px !important;
min-height: 70px !important;
/* Keep flush to viewport top - never float as a pill/capsule. */
top: var(--ucr-admin-bar-h, 0px) !important;
inset-block-start: var(--ucr-admin-bar-h, 0px) !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
transform: none !important;
border-radius: 0 !important;
background-color: rgba(13, 29, 64, 0.85) !important;
border-bottom-color: rgba(237, 241, 244, 0.10) !important;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
}
/*
* --ucr-admin-bar-h is set ONLY by JS from the live #wpadminbar box
* (0 when missing/hidden). Do not set it on body.admin-bar via CSS -
* that left a 32/46px “air gap” when the bar was display:none or had
* scrolled away while body still carried .admin-bar.
*/
.ucr-language-switcher .cpel-switcher__lang > a {
border-radius: 2px !important;
transition: color 180ms ease, background-color 180ms ease !important;
/* V2 .lang-switch - Montserrat 12/600, letter-spacing 0.1em */
font-family: Montserrat, "Noto Sans Georgian", sans-serif !important;
font-size: 12px !important;
font-weight: 600 !important;
letter-spacing: 0.1em !important;
line-height: 1.2 !important;
padding: 6px 9px !important;
display: inline-block !important;
}
.ucr-language-switcher .cpel-switcher__lang--active > a {
color: #ffffff !important;
background-color: #50949A !important;
}
/* Wordmark Logo Styles */
.logo-box {
width: 120px !important;
height: 76px !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
text-decoration: none !important;
transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
flex-shrink: 0 !important;
margin: 0 !important;
}
.wordmark {
display: inline-flex !important;
flex-direction: column !important;
color: #EDF1F4 !important; /* var(--ink) */
}
.wm-tag {
font-family: 'Montserrat', sans-serif !important;
font-size: 7px !important;
letter-spacing: 0.25em !important;
color: #9DAAB8 !important; /* var(--ink-dim) */
text-transform: uppercase !important;
margin-bottom: 2px !important;
text-align: left !important;
max-height: 20px !important;
overflow: hidden !important;
transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1),
margin-bottom 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
opacity: 1 !important;
}
body.ucr-scrolled-past-hero .logo-box .wm-tag,
.ucr-header-shell-style.scrolled .logo-box .wm-tag {
opacity: 0 !important;
max-height: 0 !important;
margin-bottom: 0 !important;
}
body.ucr-scrolled-past-hero .logo-box,
.ucr-header-shell-style.scrolled .logo-box {
height: 54px !important;
}
.wm-rows {
font-family: 'Montserrat', sans-serif !important;
font-weight: 600 !important;
font-size: 15px !important;
letter-spacing: 0.1em !important;
line-height: 1.2 !important;
display: flex !important;
flex-direction: column !important;
width: 100% !important;
}
.wm-r {
display: flex !important;
justify-content: space-between !important;
width: 100% !important;
}
.wm-r1 {
padding-right: 55% !important;
}
.wm-r2 {
position: relative !important;
align-items: center !important;
}
.wm-r2::before {
content: '' !important;
position: absolute !important;
left: -8% !important;
right: -8% !important;
top: 50% !important;
height: 1.5px !important;
background: #EDF1F4 !important; /* var(--ink) */
}
.wm-r3 {
padding-left: 22% !important;
}
/*
* V2 header nav fonts (design-v2/assets/style.css):
* body → 'Noto Sans Georgian', Montserrat; .nav-item > a → 13.5/500,
* letter-spacing 0.04em, line-height inherits body 1.6.
* Elementor Global Typography was forcing Montserrat-only + tighter
* line-height (~1.25), so Georgian glyphs did not match the mockup.
*/
.elementor-location-header .elementor-nav-menu--main .elementor-item,
.elementor-location-header .elementor-nav-menu--main a.elementor-item,
.ucr-header-shell-style .elementor-nav-menu--main .elementor-item,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item {
font-family: "FiraGO", "Noto Sans Georgian", sans-serif !important;
font-size: 15px !important;
font-weight: 500 !important;
letter-spacing: 0 !important;
line-height: 1.6 !important;
text-transform: none !important;
position: relative !important;
min-height: 44px !important;
padding: 0 4px !important;
border-radius: 0 !important;
color: rgba(237, 241, 244, 0.76) !important;
background: transparent !important;
box-shadow: none !important;
transition: color 180ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu {
display: flex !important;
align-items: center !important;
gap: 28px !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item:hover,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:focus-within > a.elementor-item,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item:hover,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:focus-within > a.elementor-item {
color: #ffffff !important;
background: transparent !important;
transform: translateY(-1px);
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.elementor-item-active,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.elementor-item-highlighted,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.elementor-item-active,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.elementor-item-highlighted {
color: #50949A !important;
font-weight: 700 !important;
background: transparent !important;
box-shadow: none !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item::before,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item::before {
display: none !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item:focus-visible,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item:focus-visible {
outline: 2px solid #50949A !important;
outline-offset: 5px !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow {
display: inline-flex !important;
width: 7px !important;
height: 7px !important;
margin-left: 8px !important;
opacity: 0.58;
transition: transform 180ms ease, opacity 180ms ease !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow svg,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow svg {
display: none !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow::before,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow::before {
content: '';
display: block;
flex: 0 0 auto;
width: 6px;
height: 6px;
border-right: 1.5px solid currentColor;
border-bottom: 1.5px solid currentColor;
transform: rotate(45deg) translate(-1px, -1px);
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:hover > a.elementor-item .sub-arrow,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:focus-within > a.elementor-item .sub-arrow,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:hover > a.elementor-item .sub-arrow,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:focus-within > a.elementor-item .sub-arrow {
opacity: 1;
transform: translateY(2px);
}
/*
* V2 Active Nav Underline Parity:
* The mockup places the underline at bottom: 24px and constrains it
* from left: 16px to right: 16px (so it aligns with the text bounds,
* not the padding bounds). Elementor's native pointer line renders
* at bottom: 0 (or bottom: -Xpx) spanning 100% width. Force mockup dimensions.
*/
.elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after,
.elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item::after {
display: none !important;
}
/* EX-002: direction-aware active-colour transfer before desktop navigation. */
@keyframes ucr-nav-ink-forward {
from { clip-path: inset(0 100% 0 0); transform: translateX(-3px); }
to { clip-path: inset(0 0 0 0); transform: translateX(0); }
}
@keyframes ucr-nav-ink-backward {
from { clip-path: inset(0 0 0 100%); transform: translateX(3px); }
to { clip-path: inset(0 0 0 0); transform: translateX(0); }
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-leaving,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-leaving {
color: rgba(237, 241, 244, 0.76) !important;
font-weight: 500 !important;
transform: translateY(0) !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-arriving::after,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-arriving::after {
content: attr(data-ucr-nav-label) !important;
position: absolute !important;
inset: 0 !important;
z-index: 2 !important;
display: flex !important;
align-items: center !important;
box-sizing: border-box !important;
padding: 0 4px !important;
color: #50949A !important;
font: inherit !important;
font-weight: 700 !important;
white-space: nowrap !important;
pointer-events: none !important;
will-change: clip-path, transform;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-forward::after,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-forward::after {
animation: ucr-nav-ink-forward 360ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-backward::after,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-backward::after {
animation: ucr-nav-ink-backward 360ms cubic-bezier(0.16, 1, 0.3, 1) both !important;
}
/* V2 desktop dropdown panel and item contract. */
.elementor-location-header .elementor-nav-menu--main .sub-menu.elementor-nav-menu--dropdown,
.ucr-header-shell-style .elementor-nav-menu--main .sub-menu.elementor-nav-menu--dropdown {
width: 260px !important;
min-width: 260px !important;
left: 0 !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: 6px 0 !important;
background: rgba(248, 249, 246, 0.985) !important;
border: 0 !important;
border-top: 3px solid #50949A !important;
border-radius: 0 0 10px 10px !important;
box-shadow: 0 20px 46px rgba(8, 29, 66, 0.22) !important;
backdrop-filter: none;
-webkit-backdrop-filter: none;
}
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-item,
.elementor-location-header .elementor-nav-menu--dropdown .elementor-sub-item,
.ucr-header-shell-style .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item {
display: block !important;
width: 100% !important;
box-sizing: border-box !important;
font-family: "Noto Sans Georgian", Montserrat, sans-serif !important;
font-size: 13px !important;
font-weight: 400 !important;
letter-spacing: normal !important;
line-height: 1.6 !important;
padding: 12px 16px !important;
color: #0D1D40 !important;
border: 0 !important;
border-left: 2px solid transparent !important;
border-bottom: 1px solid rgba(13, 29, 64, 0.08) !important;
border-radius: 0 !important;
text-align: left !important;
white-space: normal !important;
transition: background 180ms ease, color 180ms ease, padding-left 180ms ease !important;
}
.elementor-location-header .elementor-nav-menu--dropdown .elementor-sub-item:hover,
.elementor-location-header .elementor-nav-menu--dropdown .elementor-sub-item:focus,
.elementor-location-header .elementor-nav-menu--dropdown .elementor-sub-item:focus-visible,
.ucr-header-shell-style .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item:hover,
.ucr-header-shell-style .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item:focus,
.ucr-header-shell-style .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item:focus-visible {
background: rgba(80, 148, 154, 0.10) !important;
color: #0D1D40 !important;
border-left-color: #50949A !important;
padding-left: 20px !important;
}
/*
* EX-002 amendment (2026-08-12, user-reported: „მობაილ მენიუზე სერიოზული
* პრობლემებია"). The rules directly above were written for the *desktop*
* submenu, which sits on its own light panel - hence `#0D1D40` text and
* `rgba(13,29,64,.08)` separators. Elementor's mobile Off-Canvas nav
* carries the same `.elementor-nav-menu--dropdown` class, so those rules
* also landed on it - but that panel (`.e-off-canvas__content`) is painted
* `#0D1D40`. Measured result: `color: rgb(13,29,64)` on a `rgb(13,29,64)`
* background, i.e. the entire mobile menu rendered invisible, with only the
* near-transparent separators and the submenu chevrons showing. Every other
* control already inside that panel (burger, close, language switcher) is
* light, confirming the panel is intentionally dark and it is the inherited
* text colour that is wrong. Repainted for a dark surface here, scoped to
* `.e-off-canvas` so the desktop submenu keeps its light-panel treatment.
*/
.e-off-canvas .elementor-nav-menu--dropdown a.elementor-item,
.e-off-canvas .elementor-nav-menu--dropdown .elementor-item,
.e-off-canvas .elementor-nav-menu--dropdown .elementor-sub-item {
color: #EDF1F4 !important;
border-bottom-color: rgba(255, 255, 255, 0.10) !important;
}
.e-off-canvas .elementor-nav-menu--dropdown a.elementor-item:hover,
.e-off-canvas .elementor-nav-menu--dropdown a.elementor-item:focus,
.e-off-canvas .elementor-nav-menu--dropdown a.elementor-item:focus-visible,
.e-off-canvas .elementor-nav-menu--dropdown .elementor-sub-item:hover,
.e-off-canvas .elementor-nav-menu--dropdown .elementor-sub-item:focus,
.e-off-canvas .elementor-nav-menu--dropdown .elementor-sub-item:focus-visible {
background: rgba(80, 148, 154, 0.18) !important;
color: #FFFFFF !important;
border-left-color: #50949A !important;
}
/* Current page marker stays legible on the dark panel too. */
.e-off-canvas .elementor-nav-menu--dropdown .elementor-item.elementor-item-active,
.e-off-canvas .elementor-nav-menu--dropdown .current-menu-item > a.elementor-item {
color: #FFFFFF !important;
border-left-color: #50949A !important;
}
/* Submenu expand chevrons inherit the same light treatment. */
.e-off-canvas .elementor-nav-menu--dropdown .sub-arrow,
.e-off-canvas .elementor-nav-menu--dropdown .sub-arrow i,
.e-off-canvas .elementor-nav-menu--dropdown .sub-arrow svg {
color: #EDF1F4 !important;
fill: currentColor !important;
}
/*
* Same inheritance problem, layout side: the desktop-submenu rule sets
* `display: block` on the item, which the desktop panel wants because it
* has no expand chevrons. In the off-canvas the chevron is a flex child,
* so on a block parent it fell onto its own line at full row width
* (measured 307px wide, 23px below the label). Rows become flex here so
* the label and its chevron share one line, chevron pinned right.
*/
.e-off-canvas .elementor-nav-menu--dropdown a.elementor-item.has-submenu,
.e-off-canvas .elementor-nav-menu--dropdown a.elementor-item {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
}
.e-off-canvas .elementor-nav-menu--dropdown .sub-arrow {
flex: 0 0 auto !important;
width: auto !important;
margin-left: auto !important;
}
html.night-mode .ucr-theme-toggle-style { } #ucr-theme-toggle-ka,#ucr-theme-toggle-en,.ucr-theme-toggle-style{display:none!important;visibility:hidden!important} html.night-mode .ucr-theme-toggle-style {
color: #50949A;
border-color: #50949A;
}
@media (prefers-reduced-motion: reduce) {
.ucr-header-shell-style,
.ucr-language-switcher .cpel-switcher__lang > a,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item::before,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item .sub-arrow {
transition: none;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-arriving::after,
.ucr-header-shell-style .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item.ucr-nav-ink-arriving::after {
animation: none !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item > a.elementor-item:hover,
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > .menu-item:focus-within > a.elementor-item {
transform: none;
}
.elementor-location-header .elementor-nav-menu--dropdown .elementor-sub-item,
.ucr-header-shell-style .elementor-nav-menu--main .elementor-nav-menu--dropdown .elementor-sub-item {
transition-duration: 0.001ms !important;
}
/* EX-004: preserve Loop Card feedback without spatial motion. */
.elementor .ucr-project-card.elementor-element.e-transform,
.elementor .ucr-project-card.elementor-element.e-transform:hover,
.elementor .ucr-insight-card.elementor-element.e-transform,
.elementor .ucr-insight-card.elementor-element.e-transform:hover {
transform: none !important;
}
}
/* EX-020: News cards pagination & meta-row styles matching mockup */
.elementor-widget-loop-grid .elementor-pagination {
display: flex !important;
justify-content: flex-start !important;
align-items: center !important;
gap: 8px !important;
margin-top: 56px !important;
margin-bottom: 24px !important;
}
.elementor-widget-loop-grid .elementor-pagination .page-numbers {
display: inline-flex !important;
align-items: center !important; justify-content: center !important;
width: auto !important;
min-width: 44px !important;
height: 44px !important;
min-height: 44px !important;
border: 1px solid rgba(13, 29, 64, 0.12) !important;
border-radius: 2px !important;
font-family: 'Montserrat', 'FiraGO', sans-serif !important;
font-size: 13.5px !important;
font-weight: 500 !important;
color: #4D4C4D !important;
text-decoration: none !important;
transition: all 0.25s !important;
box-sizing: border-box !important;
padding: 0 16px !important;
margin: 0 !important;
cursor: pointer !important;
}
/* Number-only links don't need side padding */
.elementor-widget-loop-grid .elementor-pagination .page-numbers:not(.prev):not(.next) {
width: 44px !important;
padding: 0 !important;
}
.elementor-widget-loop-grid .elementor-pagination .page-numbers:hover {
border-color: #0D1D40 !important;
color: #0D1D40 !important;
}
.elementor-widget-loop-grid .elementor-pagination .page-numbers.current {
background: #0D1D40 !important;
border-color: #0D1D40 !important;
color: #ffffff !important;
font-weight: 600 !important;
}
.elementor-widget-loop-grid .elementor-pagination .page-numbers.prev,
.elementor-widget-loop-grid .elementor-pagination .page-numbers.next {
width: auto !important;
padding: 0 20px !important;
font-weight: 600 !important;
}
/* Meta-row layout wrap flow (prevent squishing) */
.elementor-element-insight-meta-row {
display: block !important;
width: 100% !important;
margin-bottom: 12px !important;
}
.elementor-element-insight-meta-row > .e-con-inner,
.elementor-element-insight-meta-row > .elementor-container {
display: block !important;
padding: 0 !important;
}
.elementor-element-insight-meta-row .elementor-widget-heading {
display: inline-block !important;
width: auto !important;
vertical-align: middle !important;
margin: 0 !important;
}
.elementor-element-insight-meta-sep {
margin: 0 6px !important;
}
/* EX-005: native Loop Grid has no per-item sticky offset control. */
@media (min-width: 992px) {
.ucr-service-stack-qa .ucr-service-stack-list .elementor-loop-container {
isolation: isolate;
padding-bottom: clamp(280px, 46vh, 520px);
}
.ucr-service-stack-qa .ucr-service-stack-sidebar {
position: sticky;
top: 120px;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(1) {
position: sticky;
top: 92px;
z-index: 1;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(2) {
position: sticky;
top: 112px;
z-index: 2;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(3) {
position: sticky;
top: 132px;
z-index: 3;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(4) {
position: sticky;
top: 152px;
z-index: 4;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(5) {
position: sticky;
top: 172px;
z-index: 5;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(6) {
position: sticky;
top: 192px;
z-index: 6;
}
}
/* EX-006: source-matched Services sidebar state and decorative index reveal. */
.ucr-service-stack-qa .elementor-element-s15index {
opacity: 0;
transform: translateY(60px) scale(0.85);
filter: blur(24px);
transition:
opacity 1.4s cubic-bezier(0.16, 1, 0.3, 1),
transform 1.4s cubic-bezier(0.16, 1, 0.3, 1),
filter 1.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.ucr-service-stack-qa .elementor-element-s15index.ucr-service-index-visible {
opacity: 1;
transform: translateY(0) scale(1);
filter: blur(0);
}
/*
* EX-076 - brandbook secondary palette extended to small elements.
*
* User-requested (2026-08-12): bring the brandbook's vivid secondary
* colours onto small elements site-wide. Audited first: the site already
* has a consistent, unstated rule - colour never decorates, it always
* encodes either a CATEGORY (insight-type badges: News=Steel,
* Publication=Persian, Educational=Atlantis; project-type badges:
* Project=Carrot, Opportunity=Amethyst) or a POSITION IN A SEQUENCE
* (The Engine's 4 steps; the Home services teaser's 6 rows). This
* exception extends that existing rule to places that have a sequence
* or category but were left monochrome - it does not invent a new one.
*
* Hard constraint, measured rather than assumed: these are dark-ground
* colours. On white they run 1.34:1 (Sun) to 3.47:1 (Persian) - all
* below the 4.5:1 AA floor for small text - while on the brand navy they
* run 4.8:1 to 12.3:1. The site already respects this: the only vivid
* TEXT on the Home page sits on Prussian Blue #163C4F, and the sole
* vivid item on white is a decorative bullet glyph, not text. So every
* placement below is a watermark, a rule, or a fill - never small text
* on a light ground. Monza/Flamingo/Sun are deliberately excluded: red
* and amber read as error/warning states in a UI, and Sun is 1.34:1.
*
* (1) Services detail stack numerals. The same six services already
* cycle the palette on the Home teaser but were flat navy here, so one
* service had two different colour identities depending on the route.
* These are 100px watermarks at low alpha, so contrast is not a factor.
* Alpha is tuned per hue rather than shared: at one fixed alpha the
* light hues (Atlantis, Aqua) vanish while Persian and Amethyst read as
* much heavier, which would make the six look inconsistent rather than
* like one set.
*/
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(1) .elementor-element-s15index .elementor-heading-title {
color: rgba(84, 183, 225, 0.30) !important; /* Aqua */
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(2) .elementor-element-s15index .elementor-heading-title {
color: rgba(80, 148, 154, 0.24) !important; /* Persian Green */
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(3) .elementor-element-s15index .elementor-heading-title {
color: rgba(99, 144, 183, 0.26) !important; /* Steel Blue */
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(4) .elementor-element-s15index .elementor-heading-title {
color: rgba(228, 134, 60, 0.26) !important; /* Neon Carrot */
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(5) .elementor-element-s15index .elementor-heading-title {
color: rgba(183, 208, 83, 0.36) !important; /* Atlantis */
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(6) .elementor-element-s15index .elementor-heading-title {
color: rgba(136, 124, 179, 0.26) !important; /* Amethyst */
}
@media (min-width: 992px) {
.ucr-service-stack-qa .ucr-service-stack-sidebar {
transition:
top 0.8s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
will-change: top, transform;
}
.ucr-service-stack-qa .ucr-service-stack-sidebar.ucr-service-sidebar-stuck {
top: 50vh;
transform: translateY(-50%);
}
}
@media (prefers-reduced-motion: reduce) {
.ucr-service-stack-qa .elementor-element-s15index,
.ucr-service-stack-qa .ucr-service-stack-sidebar {
transition: none !important;
}
}
/* EX-046: R03 Services exact-V2 gaps Elementor cannot express natively:
theme-post-content inner margins, the outcome box's per-side
border-left color (v3 border_color is one value for all sides), the
outcome label's ::before checkmark glyph (no pseudo-element control),
the who-grid's 720px collapse (not an Elementor breakpoint), and the
who-card staggered editorial reveal (cross-element stagger + blur has
no native control). All values are copied verbatim from
design-v2/assets/style.css. */
/*
* V2 .svc-detail-row:hover → border-color rgba(80,148,154,0.42).
* Elementor container hover cannot express a one-side brand border tint
* without also restyling other sides; scope to stack cards only.
*/
.ucr-service-stack-qa .ucr-service-stack-card,
.ucr-service-stack-qa .elementor-element-s15c1001 {
transition: border-color 0.22s ease !important;
}
.ucr-service-stack-qa .ucr-service-stack-card:hover,
.ucr-service-stack-qa .elementor-element-s15c1001:hover {
border-color: rgba(80, 148, 154, 0.42) !important;
transform: none !important;
box-shadow: none !important;
}
@media (prefers-reduced-motion: reduce) {
.ucr-service-stack-qa .ucr-service-stack-card,
.ucr-service-stack-qa .elementor-element-s15c1001 {
transition: none !important;
}
}
.ucr-service-stack-qa .elementor-element-s15body p { margin: 0; }
.ucr-service-stack-qa .elementor-element.elementor-element-s15outcomebox.ucr-service-outcome { border-left-color: #50949A; }
.ucr-service-stack-qa .elementor-element-s15outcomelabel .elementor-heading-title {
display: flex;
align-items: center;
gap: 8px;
}
.ucr-service-stack-qa .elementor-element-s15outcomelabel .elementor-heading-title::before {
content: '';
display: inline-block;
width: 16px;
height: 16px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350949A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
}
/*
* EX-005 amendment (2026-08-12, user-reported: „სერვისების გვერდზე
* მობაილზე დასტის ეფექტი არ გამოდის როგორც desktop ზეა?"). Confirmed:
* the approved `design-v2` mockup itself renders zero sticky elements
* on mobile (measured directly against services.html at 390px) - the
* stack effect was intentionally desktop-only in the source, which is
* why EX-005 originally shipped WP mobile as static/normal-flow to
* match it. The user asked for the stack on mobile anyway, which is a
* deliberate, user-directed departure from V2's mobile behaviour (the
* project's normal 1:1-parity rule doesn't apply here), so this is
* built as a genuinely new WP-only mobile treatment, not a port.
*
* Why the desktop card can't just go sticky as-is: the fan/staircase
* effect only reads when a card is much shorter than the viewport, so
* several cards' tops are visible stacked at once. Desktop cards are
* ~475–500px in a ~900px+ viewport. Measured mobile cards at their
* existing (static) size were 843–896px - taller than the 844px
* viewport itself, which would make the "staircase" invisible even
* with position:sticky turned on (each card would fully cover the
* last with no edge showing). So this block does two things together:
* a compact mobile card (below) so a card is meaningfully shorter than
* the viewport, and the sticky staircase itself, tuned to that height.
*/
@media (max-width: 767px) {
.ucr-service-stack-qa .ucr-service-stack-list .elementor-loop-container {
isolation: isolate;
padding-bottom: clamp(60px, 12vh, 140px);
}
/* Base offset clears the mobile sticky header (measured 92px) plus
a small gap; each step is wider than desktop's 20px (92→192) so
the fanned edge stays legible at phone width. */
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(1) {
position: sticky;
top: 100px;
z-index: 1;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(2) {
position: sticky;
top: 128px;
z-index: 2;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(3) {
position: sticky;
top: 156px;
z-index: 3;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(4) {
position: sticky;
top: 184px;
z-index: 4;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(5) {
position: sticky;
top: 212px;
z-index: 5;
}
.ucr-service-stack-qa .ucr-service-stack-list .e-loop-item:nth-of-type(6) {
position: sticky;
top: 240px;
z-index: 6;
}
/* Compact card: the measured static-mobile card (896px) was mostly
the body excerpt (405px) and the outcome box (202px) - both are
full unclamped paragraphs sized for a normal-flow reading page,
not a stacked card. Clamping brings the card down to a size where
the staircase above actually has room to fan out. */
.ucr-service-stack-qa .elementor-element-s15c1001 {
padding: 20px !important;
}
/* The index numeral is already `position: absolute` on desktop (an
Elementor per-breakpoint setting) so it overlays as a watermark
without taking layout space; that setting doesn't carry to the
mobile breakpoint, so on mobile it was sitting in normal flow
consuming ~61px it doesn't need - reclaimed here to match desktop
intent, plus resized so a 72px watermark doesn't dominate a card
this much narrower than desktop's. */
.ucr-service-stack-qa .elementor-element-s15index {
position: absolute !important;
top: 10px !important;
right: 16px !important;
}
.ucr-service-stack-qa .elementor-element-s15index .elementor-heading-title {
font-size: 40px !important;
line-height: 1 !important;
}
.ucr-service-stack-qa .elementor-element-s15title .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
overflow: hidden !important;
}
.ucr-service-stack-qa .elementor-element-s15title {
margin-bottom: 10px !important;
/* Clears the absolutely-positioned watermark numeral above it. */
padding-right: 64px !important;
}
.ucr-service-stack-qa .elementor-element-s15pain .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
overflow: hidden !important;
}
.ucr-service-stack-qa .elementor-element-s15pain {
margin-bottom: 8px !important;
}
.ucr-service-stack-qa .elementor-element-s15body {
margin-bottom: 14px !important;
}
.ucr-service-stack-qa .elementor-element-s15body p {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
overflow: hidden !important;
}
.ucr-service-stack-qa .elementor-element-s15outcomebox {
padding: 14px !important;
}
.ucr-service-stack-qa .elementor-element-s15outcomelabel .elementor-heading-title {
margin-bottom: 6px !important;
}
.ucr-service-stack-qa .elementor-element-s15outcome .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
overflow: hidden !important;
}
}
/* V2 switches its .wrap gutters inclusively at 768px while Elementor
compiles mobile variants through 767px - the 768px line itself is
bridged here, the same one-pixel mechanism as EX-038. The doubled
class raises specificity above the generated element rules. */
@media (min-width: 768px) and (max-width: 768px) {
.elementor .s-svc-tb-wrap-ka.s-svc-tb-wrap-ka,
.elementor .s-svc-tb-wrap-en.s-svc-tb-wrap-en,
.elementor .s-svc-who-wrap-ka.s-svc-who-wrap-ka,
.elementor .s-svc-who-wrap-en.s-svc-who-wrap-en,
.elementor .s-svc-cta-wrap-ka.s-svc-cta-wrap-ka,
.elementor .s-svc-cta-wrap-en.s-svc-cta-wrap-en {
padding-inline-start: 24px;
padding-inline-end: 24px;
}
.elementor-element.elementor-element-svc-detail-root-ka.e-con,
.elementor-element.elementor-element-svc-detail-root-en.e-con {
padding-inline-start: 24px;
padding-inline-end: 24px;
}
}
/* EX-046 2026-07-29: Elementor v4.2.1 omits saved
border-width-v2 values while still emitting style/color. */
:is(body.page-id-209, body.page-id-210) [data-id^="svc-who-section-"] {
border-width: 1px 0 0 !important;
}
:is(body.page-id-209, body.page-id-210) [data-id^="svc-who-card-"] {
border-width: 1px !important;
}
.who-card {
box-shadow: 0 14px 34px rgba(35, 44, 56, 0.06);
transition: border-color 0.3s ease, box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.who-card:hover {
box-shadow: 0 22px 44px rgba(35, 44, 56, 0.12);
transform: translateY(-6px);
}
.who-card.who-reveal-ready {
will-change: opacity, transform, filter;
transition: opacity 0.62s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.72s cubic-bezier(0.16, 1, 0.3, 1),
filter 0.58s cubic-bezier(0.16, 1, 0.3, 1),
border-color 0.3s ease,
box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.who-card.who-reveal-ready:not(.who-reveal-visible) {
opacity: 0;
transform: translate3d(0, 24px, 0) scale(0.985);
filter: blur(5px);
pointer-events: none;
}
.who-card.who-reveal-ready.who-reveal-visible {
opacity: 1;
transform: translate3d(0, 0, 0) scale(1);
filter: blur(0);
pointer-events: auto;
transition-delay: var(--who-reveal-delay, 0ms);
}
/* .who-reveal-visible's own transform outranks the plain :hover rule
above on specificity (3 classes vs 2), so the lift would silently
never show once a card has scrolled into view - effectively always. */
.who-card.who-reveal-ready.who-reveal-visible:hover {
transform: translate3d(0, -6px, 0) scale(1);
}
/* User-reported: bare floating icons read as unfinished next to the
rest of the site's card system. Each icon's wrapper carries its own
per-instance atomic style class (no shared .who-icon class exists in
the native tree), so this overrides all six (KA/EN × 3) by id-suffix
pattern instead of editing six separate Elementor style objects. */
:is(body.page-id-209, body.page-id-210) [data-id$="-iconwrap"] {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 56px !important;
height: 56px !important;
margin-bottom: 28px !important;
border-radius: 14px !important;
background: rgba(80, 148, 154, 0.1) !important;
transition: background-color 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.who-card:hover [data-id$="-iconwrap"] {
background: rgba(80, 148, 154, 0.18) !important;
}
:is(body.page-id-209, body.page-id-210) [data-id$="-icon"] svg {
width: 26px !important;
height: 26px !important;
}
/* Source collapses .who-grid at ≤991px (design-v2 style.css:1457);
its separate ≤720px block only softens the reveal transforms. */
@media (max-width: 991px) {
.who-grid {
grid-template-columns: 1fr !important;
}
}
@media (max-width: 720px) {
.who-card.who-reveal-ready:not(.who-reveal-visible) {
transform: translate3d(0, 14px, 0) scale(0.99);
filter: blur(2px);
}
}
@media (prefers-reduced-motion: reduce) {
.who-card.who-reveal-ready,
.who-card.who-reveal-ready:not(.who-reveal-visible),
.who-card.who-reveal-ready.who-reveal-visible {
opacity: 1;
transform: none;
filter: none;
pointer-events: auto;
transition: none;
}
}
/* EX-007: normalize Hello Elementor's single global skip link. */
.skip-link.screen-reader-text {
position: absolute;
left: 16px;
top: -100px;
z-index: 10000;
width: auto;
height: auto;
margin: 0;
overflow: visible;
clip: auto;
clip-path: none;
white-space: normal;
border: 0;
border-radius: 4px;
padding: 12px 18px;
background: #0D1D40;
color: #FFFFFF;
font-family: Montserrat, sans-serif;
font-size: 13px;
font-weight: 600;
line-height: 1.2;
text-decoration: none;
transition: top 150ms ease;
}
.skip-link.screen-reader-text:focus,
.skip-link.screen-reader-text:focus-visible {
top: 16px;
outline: 2px solid #50949A;
outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
.skip-link.screen-reader-text {
transition: none;
}
}
/* EX-008: native Global Class states cannot express a parent-hover-triggers-child transform. */
.ucr-button-primary:hover .ucr-button-icon,
.ucr-button-primary:focus-visible .ucr-button-icon {
transform: translateX(3px);
}
@media (prefers-reduced-motion: reduce) {
.ucr-button-icon {
transition: none !important;
}
}
/* EX-010: card share button hover/focus cascade (parent surface + child icon color) and copied feedback. */
.ucr-share-btn {
transition: background-color 200ms ease, transform 200ms ease;
}
.ucr-share-btn svg {
transition: color 200ms ease;
}
.ucr-share-btn:hover,
.ucr-share-btn:focus-visible {
background-color: #50949A;
transform: scale(1.08);
outline: none;
}
.ucr-share-btn:hover svg,
.ucr-share-btn:focus-visible svg {
color: #FFFFFF;
}
.ucr-share-btn.ucr-share-copied svg {
color: #0D1D40;
}
@media (prefers-reduced-motion: reduce) {
.ucr-share-btn,
.ucr-share-btn svg {
transition: none !important;
}
}
/* EX-011: Project Hero glass card - 4-stop gradient + backdrop-filter (legacy v3 Container has no backdrop-filter control and only a 2-stop gradient overlay). */
.ucr-project-hero-glass-card {
background: linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.9) 40%, #ffffff 55%, #ffffff 100%) !important;
-webkit-backdrop-filter: blur(24px) saturate(160%);
backdrop-filter: blur(24px) saturate(160%);
border-bottom-color: rgba(13, 29, 64, 0.08) !important;
/* V2 geometry: left 40px, width calc(100%-80), max 520px */
left: 40px !important;
width: calc(100% - 80px) !important;
max-width: 520px !important;
/* V2 is block flow + margin-top:20 on the CTA row - Elementor flex gap double-counts. */
display: block !important;
gap: 0 !important;
/* V2 hang: card sits below the 380px image stage (source --scroll-y default 130px). */
opacity: 0;
transform: translateY(calc(var(--scroll-y, 130px) + 20px)) !important;
transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1),
opacity 0.45s ease,
background-color 0.3s ease,
border-color 0.3s ease;
transition-delay: 0s;
}
/* V2: only margin-top:20px around the CTA - strip Elementor boxed container chrome. */
.ucr-project-hero-glass-card [data-id="phero-cta-wrap"],
.ucr-project-hero-glass-card .elementor-element-phero-cta-wrap {
margin-top: 20px !important;
margin-bottom: 0 !important;
padding: 0 !important;
width: 100% !important;
max-width: none !important;
min-height: 0 !important;
}
.ucr-project-hero-glass-card [data-id="phero-cta-wrap"] > .e-con-inner,
.ucr-project-hero-glass-card .elementor-element-phero-cta-wrap > .e-con-inner {
padding: 0 !important;
width: 100% !important;
max-width: none !important;
}
/* Only the active slide glass is visible - do NOT key off .e-loop-item (all slides match). */
.swiper-slide-active .ucr-project-hero-glass-card {
opacity: 1;
transform: translateY(var(--scroll-y, 130px)) !important;
transition-delay: 0.18s;
}
/*
* Swiper defaults to overflow:hidden which clips the glass hang.
* CSS cannot combine overflow-x:hidden + overflow-y:visible, so give the
* track bottom padding for hang + soft shadow and keep horizontal clipping.
* Hang is translateY(130). V2 shadow is 0 8px 32px → needs ~40px below the
* card bottom. 150px only left ~20px under the glass so the blur was cut
* into a hard static edge (user screenshot 2026-07-19). 180 = 130 hang + 50.
* Negative margin pulls the white archive section up so the glass
* overlaps it exactly like V2 (source hero ends while glass hangs).
*/
.ucr-project-hero-wrapper .swiper,
body.page-id-213 .elementor-element-p14stage .swiper,
body.page-id-214 .elementor-element-p14stage .swiper {
overflow: hidden !important;
padding-bottom: 180px !important;
box-sizing: content-box !important;
}
.ucr-project-hero-wrapper,
body.page-id-213 .elementor-element-p14wrapper,
body.page-id-214 .elementor-element-p14wrapper {
overflow: visible !important;
margin-bottom: -120px !important;
}
/* Ensure V2 glass shadow is not stripped by Elementor container chrome. */
.swiper-slide-active .ucr-project-hero-glass-card,
.ucr-project-hero-glass-card {
box-shadow: 0 8px 32px rgba(10, 15, 28, 0.12) !important;
}
body.page-id-213 .elementor-element-p14stage,
body.page-id-214 .elementor-element-p14stage {
z-index: 2;
}
body.page-id-213 .elementor-element-parch-section,
body.page-id-214 .elementor-element-parch-section {
position: relative;
z-index: 1;
}
@media (prefers-reduced-motion: reduce) {
.ucr-project-hero-glass-card,
.swiper-slide-active .ucr-project-hero-glass-card {
transition: none !important;
transition-delay: 0s !important;
transform: translateY(var(--scroll-y, 130px)) !important;
opacity: 1 !important;
}
}
/* EX-043: Projects archive wrap + archive surface (R07). */
body.page-id-213 .elementor-element-p14inner,
body.page-id-214 .elementor-element-p14inner,
body.page-id-213 .elementor-element-parch-inner,
body.page-id-214 .elementor-element-parch-inner {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 56px !important;
padding-right: 56px !important;
box-sizing: border-box !important;
}
@media (max-width: 768px) {
body.page-id-213 .elementor-element-p14inner,
body.page-id-214 .elementor-element-p14inner,
body.page-id-213 .elementor-element-parch-inner,
body.page-id-214 .elementor-element-parch-inner {
padding-left: 24px !important;
padding-right: 24px !important;
}
}
body.page-id-213 .elementor-element-p14root,
body.page-id-214 .elementor-element-p14root,
[data-id="p14root"] {
background: transparent !important;
background-color: transparent !important;
padding-bottom: 0 !important;
margin-bottom: 0 !important;
}
body.page-id-213 .elementor-element-p14wrapper,
body.page-id-214 .elementor-element-p14wrapper,
body.page-id-213 [data-id="p14stage"],
body.page-id-214 [data-id="p14stage"] {
background: #081D42 !important;
padding: 0 !important;
width: 100% !important;
}
body.page-id-213 .elementor-element-parch-section,
body.page-id-214 .elementor-element-parch-section {
width: 100% !important;
max-width: none !important;
background: #ffffff !important;
margin-bottom: 0 !important;
}
/*
* EX-043b: Projects archive H2 + insight-card body geometry (V2 projects.html).
* Elementor Loop card body defaults to flex gap:20 which stacks on top of the
* V2 margin recipe (meta mb12 / excerpt mt10 / more mt20) and inflates cards
* ~80px. Archive h2 is also set to a global 32px instead of V2 clamp→40.
*/
body.page-id-213 .elementor-element-parch-heading .elementor-heading-title,
body.page-id-214 .elementor-element-parch-heading .elementor-heading-title {
font-size: clamp(28px, 3vw, 40px) !important;
line-height: 1.25 !important;
font-weight: 700 !important;
color: #242721 !important;
}
/* V2 .kicker - Montserrat 11, letter-spacing, accent line 44×1 before text */
body.page-id-213 .elementor-element-parch-kicker .elementor-heading-title,
body.page-id-214 .elementor-element-parch-kicker .elementor-heading-title {
display: inline-flex !important;
align-items: center !important;
gap: 14px !important;
font-family: Montserrat, sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.32em !important;
text-transform: uppercase !important;
color: #50949A !important;
line-height: 1.2 !important;
margin: 0 0 18px 0 !important;
width: auto !important;
}
body.page-id-213 .elementor-element-parch-kicker .elementor-heading-title::before,
body.page-id-214 .elementor-element-parch-kicker .elementor-heading-title::before { content: none !important; /* Client-directed 2026-08-15: kicker rule ("em dash") removed site-wide. */ }
/* V2 .type-toggle button height 36 via pad 9/20 + normal line-height */
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type {
line-height: normal !important;
height: 36px !important;
min-height: 36px !important;
box-sizing: border-box !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Project card root: no flex gap between media and body */
.ucr-project-card,
.ucr-project-card.e-con {
gap: 0 !important;
row-gap: 0 !important;
}
/* V2 .share-btn on project cards */
.ucr-project-card [data-id="project-card-share"],
.ucr-project-card .elementor-element-project-card-share,
.ucr-project-card .ucr-share-btn {
position: absolute !important;
top: 12px !important;
right: 12px !important;
width: 30px !important;
height: 30px !important;
min-width: 30px !important;
min-height: 30px !important;
border-radius: 50% !important;
background: rgba(255, 255, 255, 0.92) !important;
display: grid !important;
align-items: center !important; justify-content: center !important;
z-index: 4 !important;
margin: 0 !important;
padding: 0 !important;
box-shadow: none !important;
border: none !important;
}
.ucr-project-card [data-id="project-card-share"] svg,
.ucr-project-card .ucr-share-btn svg,
.ucr-project-card [data-id="project-card-share-icon"] svg {
width: 14px !important;
height: 14px !important;
stroke: #081D42 !important;
fill: none !important;
stroke-width: 2 !important;
color: #081D42 !important;
}
/* V2 .insight-body - padding 28, column flex, NO gap (margins own rhythm). */
.ucr-project-card [data-id="a0c1002"],
.ucr-project-card .elementor-element-a0c1002 {
display: flex !important;
flex-direction: column !important;
flex: 1 1 auto !important;
gap: 0 !important;
padding: 28px !important;
row-gap: 0 !important;
}
.ucr-project-card [data-id="a0c1002"] > .e-con-inner,
.ucr-project-card .elementor-element-a0c1002 > .e-con-inner {
display: flex !important;
flex-direction: column !important;
flex: 1 1 auto !important;
gap: 0 !important;
row-gap: 0 !important;
padding: 0 !important;
width: 100% !important;
max-width: none !important;
}
/* V2 .insight-meta */
.ucr-project-card [data-id="a0c1008"],
.ucr-project-card .elementor-element-a0c1008 {
margin: 0 0 12px 0 !important;
padding: 0 !important;
}
.ucr-project-card [data-id="a0c1008"] .elementor-heading-title {
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #8B948E !important;
line-height: 1.6 !important;
margin: 0 !important;
}
/* V2 .insight-body h4 */
.ucr-project-card [data-id="a0c1005"],
.ucr-project-card .elementor-element-a0c1005 {
margin: 0 !important;
padding: 0 !important;
flex: 1 1 auto !important;
}
.ucr-project-card [data-id="a0c1005"] .elementor-heading-title {
font-size: 17px !important;
font-weight: 600 !important;
line-height: 1.45 !important;
color: #242721 !important;
margin: 0 !important;
}
/* V2 excerpt p - 13.5 / 300 / #5C6772 / mt 10 */
.ucr-project-card [data-id="a0c1009"],
.ucr-project-card .elementor-element-a0c1009 {
margin: 10px 0 0 0 !important;
padding: 0 !important;
}
.ucr-project-card [data-id="a0c1009"] p,
.ucr-project-card [data-id="a0c1009"] .elementor-widget-container,
.ucr-project-card [data-id="a0c1009"] .elementor-text-editor {
font-size: 13.5px !important;
font-weight: 300 !important;
line-height: 1.6 !important;
color: #5C6772 !important;
margin: 0 !important;
}
/* V2 .insight-more */
.ucr-project-card [data-id="project-card-more"],
.ucr-project-card .elementor-element-project-card-more {
margin: 20px 0 0 0 !important;
padding: 0 !important;
}
.ucr-project-card [data-id="project-card-more"] .elementor-heading-title,
.ucr-project-card [data-id="project-card-more"] a {
font-size: 12.5px !important;
font-weight: 600 !important;
letter-spacing: 0.08em !important;
color: #0D1D40 !important;
line-height: 1.4 !important;
margin: 0 !important;
}
/* EX-054: Projects archive reuses News equal-height/title-flow contract. */
body.page-id-213 .ucr-project-card,
body.page-id-214 .ucr-project-card {
height: 100% !important;
min-height: 100% !important;
}
body.page-id-213 .ucr-project-card [data-id="a0c1005"],
body.page-id-214 .ucr-project-card [data-id="a0c1005"],
body.page-id-213 .ucr-project-card .elementor-element-a0c1005,
body.page-id-214 .ucr-project-card .elementor-element-a0c1005 {
flex: 0 0 auto !important;
min-height: 0 !important;
height: auto !important;
}
body.page-id-213 .ucr-project-card [data-id="a0c1005"] .elementor-heading-title,
body.page-id-214 .ucr-project-card [data-id="a0c1005"] .elementor-heading-title,
body.page-id-213 .ucr-project-card .elementor-element-a0c1005 .elementor-heading-title,
body.page-id-214 .ucr-project-card .elementor-element-a0c1005 .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
max-height: 73.95px !important;
overflow: hidden !important;
word-break: normal !important;
}
body.page-id-213 .ucr-project-card [data-id="project-card-more"],
body.page-id-214 .ucr-project-card [data-id="project-card-more"],
body.page-id-213 .ucr-project-card .elementor-element-project-card-more,
body.page-id-214 .ucr-project-card .elementor-element-project-card-more {
margin-top: auto !important;
}
/* V2 .insight-img fixed 200 + badge chrome */
.ucr-project-card [data-id="project-card-media"],
.ucr-project-card .elementor-element-project-card-media {
position: relative !important;
height: 200px !important;
min-height: 200px !important;
max-height: 200px !important;
overflow: hidden !important;
padding: 0 !important;
}
/* V2 .insight-type.type-project / .type-opportunity */
.ucr-project-card [data-id="project-card-badge-native"],
.ucr-project-card .elementor-element-project-card-badge-native {
position: absolute !important;
top: 14px !important;
left: 14px !important;
z-index: 3 !important;
margin: 0 !important;
width: auto !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
.ucr-project-card [data-id="project-card-badge-native"] .elementor-widget-container {
background: transparent !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;
}
.ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title {
display: inline-block !important;
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: 0.16em !important;
text-transform: uppercase !important;
padding: 5px 10px !important;
border-radius: 2px !important;
line-height: 1.2 !important;
margin: 0 !important;
background: #E4863C !important; /* V2 --carrot */
color: #ffffff !important;
}
.e-loop-item.ucr_project_type-shesadzlebloba .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title,
.e-loop-item.ucr_project_type-opportunity .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title {
background: #887CB3 !important; /* V2 --amethyst */
color: #ffffff !important;
}
/*
* Loop card badge label is a static/hardcoded heading in the project Loop
* template (always "პროექტი"). V2 shows "შესაძლებლობა" for opportunity
* cards. Native dynamic-term control is not wired on this widget, so swap
* the visible label via ::after keyed off the loop-item taxonomy class.
*/
html[lang^="ka"] .e-loop-item.ucr_project_type-shesadzlebloba .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title,
html[lang^="ka"] .e-loop-item.ucr_project_type-opportunity .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title {
font-size: 0 !important;
line-height: 0 !important;
color: transparent !important;
}
html[lang^="ka"] .e-loop-item.ucr_project_type-shesadzlebloba .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title::after,
html[lang^="ka"] .e-loop-item.ucr_project_type-opportunity .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title::after {
content: 'შესაძლებლობა';
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: 0.16em !important;
text-transform: uppercase !important;
line-height: 1.2 !important;
color: #ffffff !important;
}
html[lang^="en"] .e-loop-item.ucr_project_type-shesadzlebloba .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title,
html[lang^="en"] .e-loop-item.ucr_project_type-opportunity .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title {
font-size: 0 !important;
line-height: 0 !important;
color: transparent !important;
}
html[lang^="en"] .e-loop-item.ucr_project_type-shesadzlebloba .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title::after,
html[lang^="en"] .e-loop-item.ucr_project_type-opportunity .ucr-project-card [data-id="project-card-badge-native"] .elementor-heading-title::after {
content: 'Opportunity';
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: 0.16em !important;
text-transform: uppercase !important;
line-height: 1.2 !important;
color: #ffffff !important;
}
/* V2 services stack card titles use paper-ink, not brand teal. */
.ucr-service-stack-card [data-id="s15title"] .elementor-heading-title,
.elementor-element-s15c1001 [data-id="s15title"] .elementor-heading-title {
color: #242721 !important;
}
/* Projects filter facade hides native widgets once ready */
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-search,
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-taxonomy-filter,
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-clear-"],
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-announce-"],
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-search,
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-taxonomy-filter,
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-clear-"],
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-announce-"],
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > .elementor-widget-search,
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > .elementor-widget-taxonomy-filter,
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > [data-id^="ucr-filter-clear-"],
body.page-id-213 [data-id="parch-toolbar"].ucr-filter-facade-ready > [data-id^="ucr-filter-announce-"],
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > .elementor-widget-search,
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > .elementor-widget-taxonomy-filter,
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > [data-id^="ucr-filter-clear-"],
body.page-id-214 [data-id="parch-toolbar"].ucr-filter-facade-ready > [data-id^="ucr-filter-announce-"] {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
clip-path: inset(50%) !important;
white-space: nowrap !important;
border: 0 !important;
}
body.page-id-213 [data-id="parch-toolbar"],
body.page-id-214 [data-id="parch-toolbar"] {
display: block !important;
position: relative !important;
width: 100% !important;
/* Keep sector dropdown above project cards below */
z-index: 4 !important;
overflow: visible !important;
}
/* V2 projects: type-toggle row first, then search+sector 1.5fr/1fr. */
body.page-id-213 [data-id="parch-toolbar"] .ucr-home-filter-bar,
body.page-id-214 [data-id="parch-toolbar"] .ucr-home-filter-bar {
grid-template-columns: 1.5fr 1fr !important;
column-gap: 24px !important;
row-gap: 20px !important;
margin-bottom: 40px !important;
}
/* Mobile: single-column search/sector so long sector labels cannot overflow. */
@media (max-width: 900px) {
body.page-id-213 [data-id="parch-toolbar"] .ucr-home-filter-bar,
body.page-id-214 [data-id="parch-toolbar"] .ucr-home-filter-bar {
grid-template-columns: 1fr !important;
}
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type-wrapper,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type-wrapper {
grid-column: 1 / -1 !important;
grid-row: 1 !important;
padding-top: 0 !important;
width: auto !important;
justify-self: start !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-search-wrapper,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-search-wrapper,
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-select-wrapper,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-select-wrapper {
grid-row: 2 !important;
min-width: 0 !important;
}
@media (max-width: 900px) {
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-search-wrapper,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-search-wrapper {
grid-column: 1 !important;
grid-row: 2 !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-select-wrapper,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-select-wrapper {
grid-column: 1 !important;
grid-row: 3 !important;
}
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type-wrapper > .ucr-filter-label,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type-wrapper > .ucr-filter-label {
display: none !important;
}
/* Source .type-toggle segmented control */
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type-group,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type-group {
display: inline-flex !important;
flex-wrap: nowrap !important;
gap: 4px !important;
min-height: 0 !important;
padding: 4px !important;
border: 1px solid rgba(13, 29, 64, 0.12) !important;
border-radius: 8px !important;
background: #F3F4F1 !important;
width: auto !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type {
height: 36px !important;
min-height: 36px !important;
padding: 0 20px !important;
border: none !important;
border-radius: 5px !important;
background: transparent !important;
box-shadow: none !important;
color: #5C6772 !important;
font-size: 13px !important;
font-weight: 500 !important;
line-height: normal !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type:hover,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type:hover {
background: transparent !important;
color: #242721 !important;
box-shadow: none !important;
border: none !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type.is-active,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type.is-active {
background: #50949A !important;
color: #ffffff !important;
font-weight: 500 !important;
border: none !important;
box-shadow: none !important;
}
@media (max-width: 560px) {
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type-wrapper,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type-wrapper {
width: 100% !important;
justify-self: stretch !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type-group,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type-group {
display: grid !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
width: 100% !important;
max-width: none !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type {
width: 100% !important;
height: 44px !important;
min-height: 44px !important;
padding: 0 12px !important;
text-align: center !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type[data-filter-group="all"],
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type[data-filter-group="all"] {
grid-column: 1 !important;
grid-row: 1 !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type[data-filter-group="news"],
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type[data-filter-group="news"] {
grid-column: 2 !important;
grid-row: 1 !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-type[data-filter-group="publications"],
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-type[data-filter-group="publications"] {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
}
}
@media (max-width: 480px) {
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-catalog-toolbar,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-catalog-toolbar {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
align-items: start !important;
gap: 12px !important;
min-height: 0 !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-clear,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-clear {
width: 100% !important;
}
body.page-id-213 [data-id="parch-toolbar"] .ucr-filter-select-option,
body.page-id-214 [data-id="parch-toolbar"] .ucr-filter-select-option {
height: auto !important;
min-height: 44px !important;
white-space: normal !important;
text-overflow: clip !important;
overflow-wrap: anywhere !important;
}
}
/* EX-011: the Loop Carousel flex item defaults to min-width:auto (the classic
flexbox trap), so flex-shrink never actually engages and the carousel
keeps its full intrinsic content width, overflowing past its sibling
sidebar. This is the standard, minimal fix (min-width:0 on the flex item). */
.ucr-project-hero-wrapper > .elementor-widget-loop-carousel {
min-width: 0;
}
/* EX-011: sidebar nav <-> Loop Carousel sync (no native linked-list-plus-carousel widget). */
.ucr-project-hero-navcol {
counter-reset: ucr-project-nav;
}
.ucr-project-hero-navcol .ucr-nav-num {
counter-increment: ucr-project-nav;
}
.ucr-project-hero-navcol .ucr-nav-num::before {
content: counter(ucr-project-nav, decimal-leading-zero);
}
/* V2 .slider-nav-item - pad 12/20, left accent bar, num 11 + title 13.5 */
.ucr-project-hero-nav-item {
cursor: pointer;
display: flex !important;
flex-direction: column !important;
padding: 12px 20px !important;
border-left: 3px solid transparent !important;
margin-left: -2px !important;
width: 100% !important;
max-width: none !important;
box-sizing: border-box !important;
transition: background-color 0.3s ease, border-color 0.3s ease;
}
.ucr-project-hero-nav-item > .e-con-inner {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
padding: 0 !important;
width: 100% !important;
max-width: none !important;
}
.ucr-project-hero-nav-item .ucr-nav-num {
transition: color 0.3s ease;
margin: 0 0 4px 0 !important;
padding: 0 !important;
min-height: 0 !important;
}
/* Counter text lives on ::before (heading body is ZWSP). */
.ucr-project-hero-navcol .ucr-nav-num .elementor-heading-title,
.ucr-project-hero-nav-item .ucr-nav-num .elementor-heading-title {
font-size: 0 !important;
line-height: 0 !important;
color: transparent !important;
}
.ucr-project-hero-navcol .ucr-nav-num::before,
.ucr-project-hero-nav-item .ucr-nav-num::before {
display: block !important;
font-family: Montserrat, sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.1em !important;
line-height: 1.2 !important;
color: rgba(255, 255, 255, 0.3) !important;
}
.ucr-project-hero-nav-item .ucr-nav-title,
.ucr-project-hero-nav-item .elementor-element-pnav-title {
transition: color 0.3s ease;
margin: 0 !important;
padding: 0 !important;
}
body.page-id-213 .ucr-project-hero-nav-item .ucr-nav-title .elementor-heading-title,
body.page-id-214 .ucr-project-hero-nav-item .ucr-nav-title .elementor-heading-title,
body.page-id-213 .ucr-project-hero-nav-item .elementor-element-pnav-title .elementor-heading-title,
body.page-id-214 .ucr-project-hero-nav-item .elementor-element-pnav-title .elementor-heading-title,
.ucr-project-hero-nav-item .ucr-nav-title .elementor-heading-title,
.ucr-project-hero-nav-item .elementor-element-pnav-title .elementor-heading-title {
font-family: FiraGO, "Noto Sans Georgian", sans-serif !important;
font-size: 13.5px !important;
font-weight: 500 !important;
color: rgba(255, 255, 255, 0.6) !important;
line-height: 1.4 !important;
text-align: left !important;
margin: 0 !important;
}
.ucr-project-hero-nav-item:hover {
background-color: rgba(255, 255, 255, 0.02);
}
.ucr-project-hero-nav-item.ucr-nav-active {
background-color: rgba(255, 255, 255, 0.04) !important;
border-left-color: #50949A !important;
}
.ucr-project-hero-nav-item.ucr-nav-active .ucr-nav-num::before {
color: #50949A !important;
}
body.page-id-213 .ucr-project-hero-nav-item.ucr-nav-active .ucr-nav-title .elementor-heading-title,
body.page-id-214 .ucr-project-hero-nav-item.ucr-nav-active .ucr-nav-title .elementor-heading-title,
body.page-id-213 .ucr-project-hero-nav-item.ucr-nav-active .elementor-element-pnav-title .elementor-heading-title,
body.page-id-214 .ucr-project-hero-nav-item.ucr-nav-active .elementor-element-pnav-title .elementor-heading-title,
.ucr-project-hero-nav-item.ucr-nav-active .ucr-nav-title .elementor-heading-title,
.ucr-project-hero-nav-item.ucr-nav-active .elementor-element-pnav-title .elementor-heading-title {
color: #FFFFFF !important;
font-weight: 600 !important;
}
@media (prefers-reduced-motion: reduce) {
.ucr-project-hero-nav-item,
.ucr-project-hero-nav-item .ucr-nav-num,
.ucr-project-hero-nav-item .ucr-nav-title {
transition: none !important;
}
}
/* EX-011: below 1024px the source turns the sidebar into a horizontally
scrollable single row - native Loop Grid "columns" only fits/wraps N
columns, it has no "one row that scrolls" mode, so this is a scoped
layout override on the existing native Loop Grid container only. */
@media (max-width: 1024px) {
.ucr-project-hero-navcol {
border-left: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 12px;
}
.ucr-project-hero-navcol .elementor-loop-container {
display: flex !important;
flex-wrap: nowrap;
overflow-x: auto;
gap: 0 !important;
}
.ucr-project-hero-nav-item {
border-left: none !important;
border-bottom: 3px solid transparent;
padding: 8px 16px !important;
flex: 0 0 min(280px, calc(100vw - 64px));
width: min(280px, calc(100vw - 64px));
}
.ucr-project-hero-nav-item.ucr-nav-active {
border-bottom-color: #50949A;
background: none !important;
}
.ucr-project-hero-glass-card {
width: calc(100% - 80px) !important;
}
}
/*
* V2 @media (max-width: 768px): glass padding 20px + max-width 100%
* (drops the desktop 520px cap so the card fills the stage minus side inset).
* slidesPerView:1 at tablet is enforced in initializeProjectHeroSync JS
* (CSS width overrides fight Swiper's inline slide sizing and collapse the stage).
*/
@media (max-width: 768px) {
.ucr-project-hero-glass-card,
body.page-id-213 .ucr-project-hero-glass-card,
body.page-id-214 .ucr-project-hero-glass-card {
padding: 20px !important;
max-width: 100% !important;
}
}
/*
* EX-011 amendment (2026-08-12, responsive audit): on small phones the
* glass card grew tall enough to swallow the hero photo. Cause is content
* length, not layout - V2's mockup lead is ~116 chars, while the WP slot is
* bound to the real post excerpt (up to ~200). Elementor's `max_length`
* counts words, not characters, so it cannot cap this. The card is meant to
* be a compact overlay, so the lead is clamped at ≤414px to restore that
* intent; wider viewports keep the mockup's unclamped text exactly.
*/
@media (max-width: 414px) {
body.page-id-213 [data-id="phero-lead"] .elementor-heading-title,
body.page-id-214 [data-id="phero-lead"] .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 4 !important;
overflow: hidden !important;
}
}
/*
* EX-041 - News/Publication single full-bleed shell + hero title/badge
* geometry. Elementor Theme Builder single documents inherit kit/boxed
* container defaults that shrink the hero/body to ~1280 with 10px gutters;
* V2 is true full-bleed. Scoped to the article single template IDs only.
*/
/*
* EX-043c (2026-07-29): Projects hero/archive vertical parity.
* The archive Loop Grid loading reserve was page-scoped, so it also
* inflated the three-item hero navigation grid. Keep the reserve on
* the archive grid, but remove it from the nested hero navigation.
* The Swiper still owns 180px of internal clip room for the hanging
* glass shadow; fixed stage geometry keeps that safety area out of
* Elementor's parent flex sizing.
*/
body.page-id-213 .elementor-element-p14root,
body.page-id-214 .elementor-element-p14root,
body.page-id-213 [data-id="p14root"],
body.page-id-214 [data-id="p14root"] {
background: #081D42 !important;
background-color: #081D42 !important;
}
body.page-id-213 .elementor-element-p14inner,
body.page-id-214 .elementor-element-p14inner {
margin-bottom: 40px !important;
}
body.page-id-213 .elementor-element-p14inner > .e-con-inner,
body.page-id-214 .elementor-element-p14inner > .e-con-inner {
gap: 0 !important;
row-gap: 0 !important;
}
body.page-id-213 .elementor-element-p14kicker,
body.page-id-214 .elementor-element-p14kicker {
height: 44.296875px !important;
min-height: 44.296875px !important;
margin: 0 0 36px 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
}
body.page-id-213 .elementor-element-p14wrapper,
body.page-id-214 .elementor-element-p14wrapper {
height: 380px !important;
min-height: 380px !important;
max-height: 380px !important;
margin-bottom: 0 !important;
align-items: flex-start !important;
column-gap: 50px !important;
row-gap: 50px !important;
}
body.page-id-213 .elementor-element-p14navcol,
body.page-id-214 .elementor-element-p14navcol {
padding: 0 !important;
}
body.page-id-213 .elementor-element.elementor-element-p14navgrid,
body.page-id-214 .elementor-element.elementor-element-p14navgrid,
body.page-id-213 .elementor-element-p14navgrid > .elementor-widget-container,
body.page-id-214 .elementor-element-p14navgrid > .elementor-widget-container,
body.page-id-213 .elementor-element-p14navgrid .elementor-loop-container,
body.page-id-214 .elementor-element-p14navgrid .elementor-loop-container {
min-height: 0 !important;
height: auto !important;
padding-bottom: 0 !important;
margin-bottom: 0 !important;
gap: 16px !important;
row-gap: 16px !important;
}
body.page-id-213 .ucr-project-hero-nav-item .ucr-nav-num .elementor-heading-title,
body.page-id-214 .ucr-project-hero-nav-item .ucr-nav-num .elementor-heading-title {
display: none !important;
}
body.page-id-213 .ucr-project-hero-nav-item .ucr-nav-num::before,
body.page-id-214 .ucr-project-hero-nav-item .ucr-nav-num::before {
line-height: 1.6 !important;
}
body.page-id-213 .elementor-element-p14stage,
body.page-id-214 .elementor-element-p14stage,
body.page-id-213 .elementor-element-p14stage > .elementor-widget-container,
body.page-id-214 .elementor-element-p14stage > .elementor-widget-container,
body.page-id-213 .elementor-element-p14stage .elementor-swiper,
body.page-id-214 .elementor-element-p14stage .elementor-swiper {
height: 380px !important;
min-height: 0 !important;
max-height: 380px !important;
overflow: visible !important;
}
body.page-id-213 .elementor-element-p14stage .swiper,
body.page-id-214 .elementor-element-p14stage .swiper {
height: 380px !important;
min-height: 380px !important;
max-height: none !important;
}
body.page-id-213 .elementor-element-p14stage .swiper-wrapper,
body.page-id-214 .elementor-element-p14stage .swiper-wrapper,
body.page-id-213 .elementor-element-p14stage .swiper-slide,
body.page-id-214 .elementor-element-p14stage .swiper-slide,
body.page-id-213 .elementor-element-p14stage .ucr-project-hero-slide,
body.page-id-214 .elementor-element-p14stage .ucr-project-hero-slide {
height: 380px !important;
min-height: 380px !important;
max-height: 380px !important;
}
/* V2 archive heading/filter rhythm: 44.296875 heading lead + 24 gap. */
body.page-id-213 .elementor-element-parch-inner > .e-con-inner,
body.page-id-214 .elementor-element-parch-inner > .e-con-inner {
gap: 0 !important;
row-gap: 0 !important;
}
body.page-id-213 .elementor-element-parch-kicker,
body.page-id-214 .elementor-element-parch-kicker {
height: 44.296875px !important;
min-height: 44.296875px !important;
margin: 0 !important;
padding: 8.703125px 0 0 !important;
box-sizing: border-box !important;
}
body.page-id-213 .elementor-element-parch-kicker .elementor-heading-title,
body.page-id-214 .elementor-element-parch-kicker .elementor-heading-title {
line-height: 1.6 !important;
margin: 0 0 18px 0 !important;
}
body.page-id-213 .elementor-element-parch-heading,
body.page-id-214 .elementor-element-parch-heading {
margin-bottom: 24px !important;
}
body.page-id-213 .elementor-element-parch-toolbar,
body.page-id-214 .elementor-element-parch-toolbar {
margin-bottom: 0 !important;
}
@media (max-width: 1024px) {
body.page-id-213 .elementor-element-p14wrapper,
body.page-id-214 .elementor-element-p14wrapper {
height: auto !important;
min-height: 0 !important;
max-height: none !important;
column-gap: 30px !important;
row-gap: 30px !important;
}
body.page-id-213 .elementor-element-p14navcol,
body.page-id-214 .elementor-element-p14navcol {
width: 100% !important;
padding: 0 0 12px !important;
margin: 0 0 10px !important;
box-sizing: border-box !important;
}
body.page-id-213 .elementor-element-p14stage,
body.page-id-214 .elementor-element-p14stage {
width: 100% !important;
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: auto !important;
}
body.page-id-213 .elementor-element-p14navgrid .elementor-loop-container,
body.page-id-214 .elementor-element-p14navgrid .elementor-loop-container {
column-gap: 16px !important;
row-gap: 0 !important;
}
body.page-id-213 .elementor-element-p14navgrid .elementor-loop-container > .e-loop-item,
body.page-id-214 .elementor-element-p14navgrid .elementor-loop-container > .e-loop-item {
flex: 0 0 min(280px, calc(100vw - 64px)) !important;
width: min(280px, calc(100vw - 64px)) !important;
max-width: min(280px, calc(100vw - 64px)) !important;
}
body.page-id-213 .elementor-element-p14navgrid .ucr-project-hero-nav-item,
body.page-id-214 .elementor-element-p14navgrid .ucr-project-hero-nav-item {
width: 100% !important;
max-width: 100% !important;
margin: 0 2px 0 -2px !important;
}
/* Restores V2's own compact nav height (see note below). */
html[lang^="ka"] body.page-id-213 .elementor-element-p14navcol,
html[lang^="ka"] body.page-id-214 .elementor-element-p14navcol {
height: 95.265625px !important;
min-height: 95.265625px !important;
max-height: 95.265625px !important;
}
html[lang^="en"] body.page-id-213 .elementor-element-p14navcol,
html[lang^="en"] body.page-id-214 .elementor-element-p14navcol {
height: 76.375px !important;
min-height: 76.375px !important;
max-height: 76.375px !important;
}
/*
* The nav column's per-language pixel heights below are NOT
* arbitrary: they are design-v2's own measured
* `.project-slider-nav` heights at compact width (verified
* 2026-08-07: KA 95.266px, EN 76.375px), and the R07 parity
* gate asserts WP matches them to within 1px. They must stay.
*
* The real defect was one level in: the nav column was
* correctly 95.27px tall, but the Loop Grid container inside it
* was only being given 60.375px while its content needed 75px,
* so the Georgian title clipped mid-line. Fixed by letting the
* inner container take the height actually available to it,
* which fits the 75px content inside the unchanged 95.27px
* column - parity preserved, clipping gone.
*/
body.page-id-213 .elementor-element-p14navgrid,
body.page-id-214 .elementor-element-p14navgrid {
height: auto !important;
min-height: 0 !important;
align-self: stretch !important;
}
/*
* `overflow-x: auto` cannot stay paired with the initial
* `overflow-y: visible` - CSS forces the other axis to `auto`
* too, which is what actually rendered the vertical scrollbar
* over the clipped text. Pin it so only the intended horizontal
* row scrolls.
*/
body.page-id-213 .elementor-element-p14navgrid .elementor-loop-container,
body.page-id-214 .elementor-element-p14navgrid .elementor-loop-container {
overflow-y: hidden !important;
height: auto !important;
align-items: stretch !important;
}
/* V2 keeps scroll affordances discreet (its own custom-options
list uses a 6px thumb); a default OS scrollbar across the
nav row is not the house style. */
body.page-id-213 .elementor-element-p14navgrid .elementor-loop-container,
body.page-id-214 .elementor-element-p14navgrid .elementor-loop-container {
scrollbar-width: none;
-ms-overflow-style: none;
}
body.page-id-213 .elementor-element-p14navgrid .elementor-loop-container::-webkit-scrollbar,
body.page-id-214 .elementor-element-p14navgrid .elementor-loop-container::-webkit-scrollbar {
width: 0;
height: 0;
}
}
@media (max-width: 768px) {
body.page-id-213 .elementor-element-p14root,
body.page-id-214 .elementor-element-p14root {
padding-top: 60px !important;
}
body.page-id-213 .elementor-element-p14stage,
body.page-id-214 .elementor-element-p14stage,
body.page-id-213 .elementor-element-p14stage > .elementor-widget-container,
body.page-id-214 .elementor-element-p14stage > .elementor-widget-container,
body.page-id-213 .elementor-element-p14stage .elementor-swiper,
body.page-id-214 .elementor-element-p14stage .elementor-swiper {
height: 320px !important;
max-height: 320px !important;
}
body.page-id-213 .elementor-element-p14stage .swiper,
body.page-id-214 .elementor-element-p14stage .swiper {
height: 320px !important;
min-height: 320px !important;
}
body.page-id-213 .elementor-element-p14stage .swiper-wrapper,
body.page-id-214 .elementor-element-p14stage .swiper-wrapper,
body.page-id-213 .elementor-element-p14stage .swiper-slide,
body.page-id-214 .elementor-element-p14stage .swiper-slide,
body.page-id-213 .elementor-element-p14stage .ucr-project-hero-slide,
body.page-id-214 .elementor-element-p14stage .ucr-project-hero-slide {
height: 320px !important;
min-height: 320px !important;
max-height: 320px !important;
}
}
.elementor-676 .elementor-element-na-root,
.elementor-677 .elementor-element-na-root {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
/* V2: hero → body → related sit flush; Elementor default flex
gap:20px left a full-width white page-background strip
between article body and "სხვა სტატიები". */
gap: 0 !important;
row-gap: 0 !important;
column-gap: 0 !important;
}
/* V2 .related-section { padding: 48px 0 80px } - kill Elementor over-pad */
.elementor-676 .elementor-element-na-related,
.elementor-677 .elementor-element-na-related {
padding-top: 48px !important;
padding-bottom: 80px !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.elementor-676 .elementor-element-na-hero.ucr-article-hero,
.elementor-677 .elementor-element-na-hero.ucr-article-hero {
width: 100% !important;
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
left: 0 !important;
}
/* V2 .wrap inside hero: max-width 1280 + side gutters 56/24 */
.elementor-676 .elementor-element-na-hero-inner,
.elementor-677 .elementor-element-na-hero-inner {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 56px !important;
padding-right: 56px !important;
box-sizing: border-box !important;
}
@media (max-width: 768px) {
.elementor-676 .elementor-element-na-hero-inner,
.elementor-677 .elementor-element-na-hero-inner {
padding-left: 24px !important;
padding-right: 24px !important;
}
}
.elementor-676 .elementor-element-na-related-inner,
.elementor-677 .elementor-element-na-related-inner {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 56px !important;
padding-right: 56px !important;
box-sizing: border-box !important;
}
@media (max-width: 768px) {
.elementor-676 .elementor-element-na-related-inner,
.elementor-677 .elementor-element-na-related-inner {
padding-left: 24px !important;
padding-right: 24px !important;
}
}
.elementor-676 .elementor-element-na-body,
.elementor-677 .elementor-element-na-body,
.elementor-676 .elementor-element-na-related,
.elementor-677 .elementor-element-na-related {
width: 100% !important;
max-width: none !important;
}
/*
* EX-075 - Article body "paper unfurl" entrance.
*
* User-requested (2026-08-12): „ეს კონტენტის არეალი სქროვის დროს რო
* ფურცელივით ჩამოიშალოს დახვეწილი ანიმაციით" - the white article card
* should settle into place like a sheet of paper as it scrolls in. This
* is a new behaviour, not present in `design-v2`, so it is a deliberate
* user-directed addition rather than a parity fix.
*
* No new JS: `na-col` is tagged `scroll-reveal ucr-paper-unfurl` in the
* Elementor data, so the existing EX-018 observer (92%-viewport cutoff,
* top-to-bottom batch stagger) already drives the `.visible` toggle. This
* block only re-skins what that class transition looks like for this one
* card - reusing proven trigger logic instead of adding a second observer.
*
* The effect is a top-hinged rotateX rather than a clip-path wipe: the
* card is 559px on a short article but runs into the thousands on a long
* one, and a wipe over that distance degrades into a fast flicker, while
* a hinge reads the same at any height. `na-body` carries the perspective
* so the rotation has real depth; a flat rotateX with no perspective
* ancestor would just squash the card vertically.
*
* Children cascade in behind the sheet via pure CSS transition-delay off
* the parent's `.visible` state - this is what sells "unfurling" rather
* than "fading", and needs no per-element JS bookkeeping.
*/
.elementor-676 .elementor-element-na-body,
.elementor-677 .elementor-element-na-body {
perspective: 1600px;
perspective-origin: top center;
}
/*
* 2026-08-12 pacing amendment (user-reported): the first pass - 6deg
* tilt, 8px lift, 0.72–1.05s - was confirmed working by direct
* measurement (opacity/transform captured mid-flight), but the user
* reported the eye can't actually catch it while scrolling normally.
* The trigger point is EX-018's shared 92%-of-viewport cutoff (kept
* untouched here - it's shared by every `.scroll-reveal` element
* site-wide, so it fires almost as soon as the card's top edge appears
* at the bottom of the screen). At typical scroll speed the card
* reaches the eye's comfortable central viewing area well before a
* <1.1s motion finishes, and a 6deg/8px motion is subtle even when
* caught. Fixed by making the motion itself bigger and slower - not
* by changing when it starts - so more of it plays out while the card
* is scrolling through the visible part of the screen.
*/
/*
* EX-075 amendment (2026-08-13, user-requested): „ეგრე უნდა იყოს
* ჩამოსქროლვის დროს" - the user liked the unfurl they see on refresh and
* wanted the same entrance while scrolling down. The main article card
* cannot provide that: measured at 1650px tall on a 2405px page, it still
* occupies 717px of the viewport at maximum scroll, so it never leaves the
* screen and can never re-enter it. The section that genuinely does arrive
* on scroll is the related-posts block below it, so the same treatment is
* extended there - same tilt, lift and timing, so the page reads as one
* consistent motion language rather than two.
*/
.elementor-676 .elementor-element-na-related,
.elementor-677 .elementor-element-na-related {
perspective: 1600px;
perspective-origin: top center;
}
.elementor-676 .elementor-element-na-related.ucr-paper-unfurl,
.elementor-677 .elementor-element-na-related.ucr-paper-unfurl,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl {
opacity: 0;
transform: rotateX(-13deg) translateY(-26px);
transform-origin: top center;
/* The shared .scroll-reveal blur is dropped here: an 8px blur across a
full-width white surface reads as a rendering fault, not motion. */
filter: none;
box-shadow: 0 2px 8px rgba(13, 29, 64, 0.04);
transition:
opacity 1.15s cubic-bezier(0.16, 1, 0.3, 1),
transform 1.75s cubic-bezier(0.16, 1, 0.3, 1),
box-shadow 1.75s cubic-bezier(0.16, 1, 0.3, 1);
/* Deliberately NO `will-change` here. It was set in the first pass and
measured as a scroll-jank source: as a stylesheet declaration it never
expires, so this 1040x559 card kept a compositor layer alive for the
whole session long after its one-shot entrance finished. Chrome already
promotes an element for the duration of an active transform/opacity
transition, so the hint bought nothing and cost a permanent layer. */
backface-visibility: hidden;
}
.elementor-676 .elementor-element-na-related.ucr-paper-unfurl.visible,
.elementor-677 .elementor-element-na-related.ucr-paper-unfurl.visible,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible {
opacity: 1;
transform: rotateX(0) translateY(0);
/* Settles onto a slightly deeper shadow, as a sheet coming to rest. */
box-shadow: 0 18px 48px rgba(13, 29, 64, 0.10);
}
/* The related block sits on the page background, not on a white card, so it
takes the motion without the card shadow that would draw a false edge. */
.elementor-676 .elementor-element-na-related.ucr-paper-unfurl,
.elementor-677 .elementor-element-na-related.ucr-paper-unfurl,
.elementor-676 .elementor-element-na-related.ucr-paper-unfurl.visible,
.elementor-677 .elementor-element-na-related.ucr-paper-unfurl.visible {
box-shadow: none;
}
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-subtitle,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-subtitle,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-content > *,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-content > * {
opacity: 0;
transform: translateY(10px);
transition:
opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-subtitle,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-subtitle,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > * {
opacity: 1;
transform: none;
}
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-subtitle,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-subtitle {
transition-delay: 0.20s;
}
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(1),
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(1) {
transition-delay: 0.30s;
}
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(2),
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(2) {
transition-delay: 0.38s;
}
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(3),
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(3) {
transition-delay: 0.46s;
}
/* Everything from the 4th block on shares one delay: a long article must
not accumulate a delay so large that later paragraphs visibly lag. */
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(n+4),
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl.visible .elementor-element-na-content > *:nth-child(n+4) {
transition-delay: 0.54s;
}
/*
* Reduced motion: these selectors outrank EX-018's own reduced-motion
* reset, so the exemption has to be restated at this specificity or the
* card would still animate for users who asked it not to.
*/
@media (prefers-reduced-motion: reduce) {
.elementor-676 .elementor-element-na-related.ucr-paper-unfurl,
.elementor-677 .elementor-element-na-related.ucr-paper-unfurl,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-subtitle,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-subtitle,
.elementor-676 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-content > *,
.elementor-677 .elementor-element-na-col.ucr-paper-unfurl .elementor-element-na-content > * {
opacity: 1 !important;
transform: none !important;
transition: none !important;
transition-delay: 0s !important;
}
}
/* EX-041 amendment (2026-08-12, user-requested: "შიდა გვერდებზე ... სათაურის
ზომები შენვამციროთ 3-4px"). Both clamp endpoints shifted down 4px so the
fluid size drops by roughly that amount across the whole viewport range,
not just at the extremes. Was clamp(30px, 3.8vw, 52px). */
.elementor-676 .elementor-element-na-title .elementor-heading-title,
.elementor-677 .elementor-element-na-title .elementor-heading-title {
max-width: 820px !important;
font-size: clamp(26px, 3.8vw, 48px) !important;
line-height: 1.18 !important;
}
/* V2 hero badge kicker line (::before 24×2 accent) - shrink widget to content */
.elementor-676 .elementor-element-na-badge,
.elementor-677 .elementor-element-na-badge {
width: auto !important;
max-width: max-content !important;
align-self: flex-start !important;
background: transparent !important;
padding: 0 !important;
margin-bottom: 20px !important;
}
.elementor-676 .elementor-element-na-badge .elementor-widget-container,
.elementor-677 .elementor-element-na-badge .elementor-widget-container {
width: auto !important;
max-width: max-content !important;
padding: 0 !important;
background: transparent !important;
}
.elementor-676 .elementor-element-na-badge .elementor-heading-title,
.elementor-677 .elementor-element-na-badge .elementor-heading-title {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
width: auto !important;
max-width: max-content !important;
font-size: 11.5px !important;
font-weight: 600 !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #b0dcdb !important;
margin: 0 !important;
background: transparent !important;
padding: 0 !important;
}
.elementor-676 .elementor-element-na-badge .elementor-heading-title::before,
.elementor-677 .elementor-element-na-badge .elementor-heading-title::before {
content: '' !important;
display: inline-block !important;
width: 24px !important;
height: 2px !important;
background: #50949A !important;
flex-shrink: 0 !important;
}
/*
* EX-041 scroll transformer (V2 publication-single / news-article):
* hero content fades down + blurs; white header reveals from above.
* Project singles 742/743 already had this; News/Pub 676/677 only had
* the white-header half - user saw no top→bottom handoff on scroll.
*/
/*
* EX-013 amendment (2026-08-13, user-reported scroll jank): `background-size`
* was removed from this transition list. Profiled with CDP - scrolling deep
* inside the article is smooth (1.0% of frames >20ms), but scrolling across
* the hero threshold, which toggles `body.ucr-scrolled-past-hero`, measured
* **64.5%** janky frames on the equivalent project hero. Animating
* `background-size` forces the browser to re-rasterize a full-bleed 1440px
* background image on every frame of the 0.4s tween - it is not a composited
* property. The end state (`104% auto`) is kept, so the hero still zooms; it
* simply snaps rather than tweening. The zoom is only 4% and it happens while
* the same element is blurring to 2px, so the tween was not perceptible
* anyway - but its per-frame raster cost was. `filter` stays animated because
* that is the change the eye actually reads here.
*/
.elementor-676 .elementor-element-na-hero.ucr-article-hero,
.elementor-677 .elementor-element-na-hero.ucr-article-hero {
overflow: hidden !important;
background-size: cover !important;
background-position: center center !important;
transition: filter 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
body.ucr-scrolled-past-hero .elementor-676 .elementor-element-na-hero.ucr-article-hero,
body.ucr-scrolled-past-hero .elementor-677 .elementor-element-na-hero.ucr-article-hero {
filter: blur(2px) brightness(0.7) !important;
background-size: 104% auto !important;
}
.elementor-676 .elementor-element-na-hero-inner,
.elementor-677 .elementor-element-na-hero-inner {
transition:
opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
body.ucr-scrolled-past-hero .elementor-676 .elementor-element-na-hero-inner,
body.ucr-scrolled-past-hero .elementor-677 .elementor-element-na-hero-inner {
opacity: 0 !important;
transform: translateY(45px) !important;
pointer-events: none !important;
}
@media (prefers-reduced-motion: reduce) {
.elementor-676 .elementor-element-na-hero.ucr-article-hero,
.elementor-677 .elementor-element-na-hero.ucr-article-hero,
.elementor-676 .elementor-element-na-hero-inner,
.elementor-677 .elementor-element-na-hero-inner,
body.ucr-scrolled-past-hero .elementor-676 .elementor-element-na-hero.ucr-article-hero,
body.ucr-scrolled-past-hero .elementor-677 .elementor-element-na-hero.ucr-article-hero,
body.ucr-scrolled-past-hero .elementor-676 .elementor-element-na-hero-inner,
body.ucr-scrolled-past-hero .elementor-677 .elementor-element-na-hero-inner {
transition: none !important;
transform: none !important;
filter: none !important;
background-size: cover !important;
opacity: 1 !important;
pointer-events: auto !important;
}
}
/* V2 .article-badge-pill-white - MUST shrink to content (not full-row teal stripe) */
.elementor-676 .elementor-element-na-wh-badge,
.elementor-677 .elementor-element-na-wh-badge {
width: auto !important;
max-width: max-content !important;
align-self: flex-start !important;
flex: 0 0 auto !important;
display: inline-flex !important;
padding: 6px 14px !important;
border-radius: 4px !important;
background: #50949A !important;
margin: 0 0 24px 0 !important;
box-sizing: border-box !important;
}
.elementor-676 .elementor-element-na-wh-badge .elementor-widget-container,
.elementor-677 .elementor-element-na-wh-badge .elementor-widget-container,
.elementor-676 .elementor-element-na-wh-badge .elementor-heading-title,
.elementor-677 .elementor-element-na-wh-badge .elementor-heading-title {
width: auto !important;
max-width: max-content !important;
display: inline-block !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
color: #ffffff !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 11.5px !important;
font-weight: 700 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
line-height: 1.2 !important;
}
/* White-header title / crumbs / meta rhythm (V2 article-*-white) */
/* EX-041 amendment (2026-08-12): shrunk in tandem with na-title above -
this is the same headline re-rendered in the scroll-revealed sticky
header, so it should track the hero title's size change. Was
clamp(28px, 3.8vw, 44px). */
.elementor-676 .elementor-element-na-wh-title .elementor-heading-title,
.elementor-677 .elementor-element-na-wh-title .elementor-heading-title {
font-size: clamp(24px, 3.8vw, 40px) !important;
font-weight: 700 !important;
line-height: 1.22 !important;
color: #242721 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
margin: 0 0 24px 0 !important;
}
.elementor-676 .ucr-article-white-header,
.elementor-677 .ucr-article-white-header {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
}
/* V2 meta-actions row: date + horizontal share circles (not stacked 154px) */
.elementor-676 .elementor-element-na-wh-meta,
.elementor-677 .elementor-element-na-wh-meta {
width: 100% !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: space-between !important;
gap: 16px !important;
min-height: 0 !important;
}
.elementor-676 .elementor-element-na-wh-meta > .e-con-inner,
.elementor-677 .elementor-element-na-wh-meta > .e-con-inner {
width: 100% !important;
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: space-between !important;
gap: 16px !important;
padding-top: 8px !important;
padding-bottom: 8px !important;
}
.elementor-676 .elementor-element-na-wh-actions,
.elementor-677 .elementor-element-na-wh-actions {
width: auto !important;
max-width: 100% !important;
flex: 0 1 auto !important;
padding: 0 !important;
}
.elementor-676 .elementor-element-na-wh-actions > .e-con-inner,
.elementor-677 .elementor-element-na-wh-actions > .e-con-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 10px !important;
padding: 0 !important;
width: auto !important;
}
/* Elementor Share Buttons list - force horizontal circles */
.elementor-676 .elementor-element-na-share .elementor-share-btn,
.elementor-677 .elementor-element-na-share .elementor-share-btn,
.elementor-676 .elementor-element-na-share .elementor-grid,
.elementor-677 .elementor-element-na-share .elementor-grid {
/* grid host below */
}
.elementor-676 .elementor-element-na-share .elementor-grid,
.elementor-677 .elementor-element-na-share .elementor-grid {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
gap: 10px !important;
grid-template-columns: none !important;
}
.elementor-676 .elementor-element-na-share,
.elementor-677 .elementor-element-na-share {
width: auto !important;
max-width: max-content !important;
}
/* Article column hang card: ensure center on full body */
.elementor-676 .elementor-element-na-col.ucr-article-col,
.elementor-677 .elementor-element-na-col.ucr-article-col {
margin-left: auto !important;
margin-right: auto !important;
}
/*
* V2 .share-circle-btn (publication-single / news-article):
* 38px circle, transparent bg, 1.5px border, color #0D1D40
* icons 15px fill currentColor; brand fills ONLY on hover.
* Elementor Share Buttons "official" skin paints brand fills + white
* icons by default - force outline skin, then platform hover colors.
*/
.elementor-676 .elementor-share-btn,
.elementor-677 .elementor-share-btn,
.elementor-676 .elementor-share-btn .elementor-share-btn__icon,
.elementor-677 .elementor-share-btn .elementor-share-btn__icon {
width: 38px !important;
height: 38px !important;
min-width: 38px !important;
min-height: 38px !important;
border-radius: 50% !important;
margin: 0 !important;
box-sizing: border-box !important;
}
.elementor-676 .elementor-share-btn,
.elementor-677 .elementor-share-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border: 1.5px solid rgba(13, 29, 64, 0.18) !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #0D1D40 !important;
box-shadow: none !important;
transition:
transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
background 0.22s ease,
border-color 0.22s ease,
color 0.22s ease,
box-shadow 0.22s ease !important;
}
.elementor-676 .elementor-share-btn .elementor-share-btn__icon,
.elementor-677 .elementor-share-btn .elementor-share-btn__icon {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
background: transparent !important;
background-color: transparent !important;
border: 0 !important;
color: inherit !important;
padding: 0 !important;
}
.elementor-676 .elementor-share-btn svg,
.elementor-677 .elementor-share-btn svg,
.elementor-676 .elementor-share-btn .elementor-share-btn__icon svg,
.elementor-677 .elementor-share-btn .elementor-share-btn__icon svg,
.elementor-676 .elementor-share-btn i,
.elementor-677 .elementor-share-btn i {
width: 15px !important;
height: 15px !important;
font-size: 15px !important;
color: #0D1D40 !important;
fill: currentColor !important;
stroke: none !important;
}
.elementor-676 .elementor-share-btn svg path,
.elementor-677 .elementor-share-btn svg path {
fill: currentColor !important;
stroke: none !important;
}
/* Default: no brand fill (override Elementor official colors) */
.elementor-676 .elementor-share-btn_facebook,
.elementor-676 .elementor-share-btn_x-twitter,
.elementor-676 .elementor-share-btn_twitter,
.elementor-676 .elementor-share-btn_linkedin,
.elementor-677 .elementor-share-btn_facebook,
.elementor-677 .elementor-share-btn_x-twitter,
.elementor-677 .elementor-share-btn_twitter,
.elementor-677 .elementor-share-btn_linkedin {
background: transparent !important;
background-color: transparent !important;
color: #0D1D40 !important;
}
.elementor-676 .elementor-share-btn:hover,
.elementor-677 .elementor-share-btn:hover {
transform: translateY(-2px) !important;
color: #ffffff !important;
box-shadow: 0 4px 12px rgba(13, 29, 64, 0.2) !important;
}
.elementor-676 .elementor-share-btn:hover svg,
.elementor-677 .elementor-share-btn:hover svg,
.elementor-676 .elementor-share-btn:hover svg path,
.elementor-677 .elementor-share-btn:hover svg path,
.elementor-676 .elementor-share-btn:hover i,
.elementor-677 .elementor-share-btn:hover i {
color: #ffffff !important;
fill: currentColor !important;
}
.elementor-676 .elementor-share-btn_facebook:hover,
.elementor-677 .elementor-share-btn_facebook:hover {
background: #1877F2 !important;
background-color: #1877F2 !important;
border-color: #1877F2 !important;
}
.elementor-676 .elementor-share-btn_x-twitter:hover,
.elementor-676 .elementor-share-btn_twitter:hover,
.elementor-677 .elementor-share-btn_x-twitter:hover,
.elementor-677 .elementor-share-btn_twitter:hover {
background: #111111 !important;
background-color: #111111 !important;
border-color: #111111 !important;
}
.elementor-676 .elementor-share-btn_linkedin:hover,
.elementor-677 .elementor-share-btn_linkedin:hover {
background: #0A66C2 !important;
background-color: #0A66C2 !important;
border-color: #0A66C2 !important;
}
/* Copy = V2 .share-circle-btn.copy (clipboard icon, not trash) */
.elementor-676 .elementor-element-na-copy.ucr-copy-link-btn,
.elementor-677 .elementor-element-na-copy.ucr-copy-link-btn,
.elementor-676 .ucr-copy-link-btn,
.elementor-677 .ucr-copy-link-btn {
width: 38px !important;
height: 38px !important;
min-width: 38px !important;
border-radius: 50% !important;
border: 1.5px solid rgba(13, 29, 64, 0.18) !important;
background: transparent !important;
background-color: transparent !important;
color: #0D1D40 !important;
padding: 0 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-shadow: none !important;
cursor: pointer !important;
transition:
transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
background 0.22s ease,
border-color 0.22s ease,
color 0.22s ease,
box-shadow 0.22s ease !important;
}
.elementor-676 .ucr-copy-link-btn svg,
.elementor-677 .ucr-copy-link-btn svg,
.elementor-676 .ucr-copy-link-btn .e-svg-base,
.elementor-677 .ucr-copy-link-btn .e-svg-base,
.elementor-676 .ucr-copy-link-btn .ucr-copy-link-icon,
.elementor-677 .ucr-copy-link-btn .ucr-copy-link-icon {
width: 15px !important;
height: 15px !important;
color: inherit !important;
}
.elementor-676 .ucr-copy-link-btn svg,
.elementor-677 .ucr-copy-link-btn svg {
fill: none !important;
stroke: currentColor !important;
stroke-width: 2.2 !important;
}
.elementor-676 .ucr-copy-link-btn svg path,
.elementor-676 .ucr-copy-link-btn svg rect,
.elementor-677 .ucr-copy-link-btn svg path,
.elementor-677 .ucr-copy-link-btn svg rect {
fill: none !important;
stroke: currentColor !important;
}
.elementor-676 .ucr-copy-link-btn:hover,
.elementor-677 .ucr-copy-link-btn:hover,
.elementor-676 .ucr-copy-link-btn:focus-visible,
.elementor-677 .ucr-copy-link-btn:focus-visible {
transform: translateY(-2px) !important;
background: #50949A !important;
background-color: #50949A !important;
border-color: #50949A !important;
color: #ffffff !important;
box-shadow: 0 4px 12px rgba(13, 29, 64, 0.2) !important;
}
.elementor-676 .ucr-copy-link-btn.ucr-copy-done,
.elementor-677 .ucr-copy-link-btn.ucr-copy-done {
background: #47A447 !important;
background-color: #47A447 !important;
border-color: #47A447 !important;
color: #ffffff !important;
}
/* Optional share count label next to circles */
.elementor-676 .ucr-share-count-label,
.elementor-677 .ucr-share-count-label {
font-size: 13px !important;
font-weight: 500 !important;
color: #5C6772 !important;
margin-left: 4px !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
}
@media (prefers-reduced-motion: reduce) {
.elementor-676 .elementor-share-btn,
.elementor-677 .elementor-share-btn,
.elementor-676 .ucr-copy-link-btn,
.elementor-677 .ucr-copy-link-btn {
transition: none !important;
transform: none !important;
}
}
/*
* EX-044 - Project Single full-bleed shell + body/sidebar geometry.
* Theme Builder singles 742/743 inherit kit boxed defaults (~1280 + 10px
* gutters) and flex columns; V2 is full-bleed hero, 1140 grid 2fr/1fr
* hang, white main card, sidebar cards, and project title clamp.
*/
.elementor-742 .elementor-element-ka-root,
.elementor-743 .elementor-element-en-root {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
/* Boxed Elementor containers inject .e-con-inner at ~1280 - force full bleed. */
.elementor-742 .elementor-element-ka-root > .e-con-inner,
.elementor-743 .elementor-element-en-root > .e-con-inner,
.elementor-742 .elementor-element-ka-body > .e-con-inner,
.elementor-743 .elementor-element-en-body > .e-con-inner,
.elementor-742 .elementor-element-ka-hero > .e-con-inner,
.elementor-743 .elementor-element-en-hero > .e-con-inner {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
.elementor-742 .elementor-element-ka-hero.ucr-article-hero,
.elementor-743 .elementor-element-en-hero.ucr-article-hero {
width: 100% !important;
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
left: 0 !important;
min-height: max(62vh, 496px) !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
align-items: stretch !important;
padding-bottom: 88px !important;
overflow: hidden !important;
background-size: cover !important;
background-position: center !important;
/* Background scale via size (hero itself is both image+overlay; avoid
transform:scale on the section which would reflow layout).
EX-013 amendment (2026-08-13): `background-size` removed from the
transition - it is not composited, so tweening it re-rasterized the
full-bleed background every frame and measured 64.5% janky frames when
crossing the hero threshold here (vs 1.0% scrolling elsewhere on the
same page). The 104% end state is kept, so the zoom still happens; only
its 0.4s tween is dropped, which is imperceptible at 4% under a
simultaneous 2px blur. */
transition: filter 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
body.ucr-scrolled-past-hero .elementor-742 .elementor-element-ka-hero.ucr-article-hero,
body.ucr-scrolled-past-hero .elementor-743 .elementor-element-en-hero.ucr-article-hero {
/* V2 .project-hero-bg blur/brightness while scrolled past hero */
filter: blur(2px) brightness(0.7) !important;
background-size: 104% auto !important;
}
.elementor-742 .elementor-element-ka-hero-inner,
.elementor-743 .elementor-element-en-hero-inner {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 56px !important;
padding-right: 56px !important;
box-sizing: border-box !important;
transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
body.ucr-scrolled-past-hero .elementor-742 .elementor-element-ka-hero-inner,
body.ucr-scrolled-past-hero .elementor-743 .elementor-element-en-hero-inner {
opacity: 0 !important;
transform: translateY(45px) !important;
pointer-events: none !important;
}
@media (max-width: 768px) {
.elementor-742 .elementor-element-ka-hero.ucr-article-hero,
.elementor-743 .elementor-element-en-hero.ucr-article-hero {
min-height: 50vh !important;
padding-bottom: 48px !important;
}
.elementor-742 .elementor-element-ka-hero-inner,
.elementor-743 .elementor-element-en-hero-inner {
padding-left: 24px !important;
padding-right: 24px !important;
}
}
@media (prefers-reduced-motion: reduce) {
.elementor-742 .elementor-element-ka-hero.ucr-article-hero,
.elementor-743 .elementor-element-en-hero.ucr-article-hero,
.elementor-742 .elementor-element-ka-hero-inner,
.elementor-743 .elementor-element-en-hero-inner,
body.ucr-scrolled-past-hero .elementor-742 .elementor-element-ka-hero.ucr-article-hero,
body.ucr-scrolled-past-hero .elementor-743 .elementor-element-en-hero.ucr-article-hero,
body.ucr-scrolled-past-hero .elementor-742 .elementor-element-ka-hero-inner,
body.ucr-scrolled-past-hero .elementor-743 .elementor-element-en-hero-inner {
transition: none !important;
transform: none !important;
filter: none !important;
background-size: cover !important;
opacity: 1 !important;
pointer-events: auto !important;
}
}
/* V2 hero title + badge */
/* EX-044 amendment (2026-08-12): same request as the News single hero -
Project single is the other "inner page" using this hero-title-over-
photo pattern. Was clamp(26px, 3.4vw, 42px). */
.elementor-742 .elementor-element-ka-title .elementor-heading-title,
.elementor-743 .elementor-element-en-title .elementor-heading-title {
max-width: 860px !important;
margin: 0 !important;
color: #ffffff !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: clamp(22px, 3.4vw, 38px) !important;
font-weight: 700 !important;
line-height: 1.2 !important;
}
.elementor-742 .elementor-element-ka-badge,
.elementor-743 .elementor-element-en-badge {
width: auto !important;
max-width: max-content !important;
align-self: flex-start !important;
padding: 0 !important;
background: transparent !important;
}
.elementor-742 .elementor-element-ka-badge .elementor-widget-container,
.elementor-743 .elementor-element-en-badge .elementor-widget-container {
padding: 0 !important;
background: transparent !important;
}
.elementor-742 .elementor-element-ka-badge .elementor-heading-title,
.elementor-743 .elementor-element-en-badge .elementor-heading-title {
display: inline-block !important;
padding: 6px 14px !important;
border-radius: 4px !important;
background: #50949A !important;
color: #ffffff !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 11.5px !important;
font-weight: 700 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
line-height: 1.2 !important;
}
.elementor-742 .elementor-element-ka-bc .elementor-heading-title,
.elementor-743 .elementor-element-en-bc .elementor-heading-title,
.elementor-742 .elementor-element-ka-bc a,
.elementor-743 .elementor-element-en-bc a {
color: rgba(255, 255, 255, 0.85) !important;
font-family: 'FiraGO', sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
}
.elementor-742 .elementor-element-ka-bc-current .elementor-heading-title,
.elementor-743 .elementor-element-en-bc-current .elementor-heading-title {
color: #b0dcdb !important;
font-weight: 600 !important;
}
/* Body surface + 1140 hang grid */
.elementor-742 .elementor-element-ka-body,
.elementor-743 .elementor-element-en-body {
width: 100% !important;
max-width: none !important;
background: #F7F8FA !important;
padding: 0 0 80px !important;
}
.elementor-742 .elementor-element-ka-container,
.elementor-743 .elementor-element-en-container {
display: grid !important;
grid-template-columns: 2fr 1fr !important;
gap: 40px !important;
width: 100% !important;
max-width: 1140px !important;
margin-left: auto !important;
margin-right: auto !important;
padding: 0 !important;
position: relative !important;
top: -48px !important;
box-sizing: border-box !important;
}
@media (max-width: 960px) {
.elementor-742 .elementor-element-ka-container,
.elementor-743 .elementor-element-en-container {
grid-template-columns: 1fr !important;
gap: 30px !important;
top: -24px !important;
padding: 0 16px !important;
}
}
.elementor-742 .elementor-element-ka-main,
.elementor-743 .elementor-element-en-main {
width: 100% !important;
max-width: none !important;
padding: 56px 64px !important;
background: #ffffff !important;
border-radius: 6px !important;
box-shadow: 0 1px 3px rgba(13, 29, 64, 0.06), 0 8px 32px rgba(13, 29, 64, 0.04) !important;
box-sizing: border-box !important;
}
/*
* EX-075 amendment (2026-08-12, user-requested: „პროექტების შიდა
* გვერდზეც ეგრე უნდა იყოს"). Same paper-unfurl scroll entrance as the
* News single's `na-col` (EX-075) - the user asked for it on the
* Project single's equivalent white content card. `ka-main`/`en-main`
* is that card here (the 2fr column of EX-044's hang grid, holding the
* project history repeater). Reuses EX-018's shared `.scroll-reveal`
* observer exactly like the News version, and ships directly with the
* pacing already tuned there after user feedback (13deg / 26px lift /
* 1.15s–1.75s) rather than repeating the original too-fast pass.
*
* Box-shadow is deliberately left out of this transition: unlike
* `na-col`, `ka-main`/`en-main` already carries a permanent `!important`
* shadow (immediately above) that other rules key off of - animating a
* second shadow value here would mean fighting that rule for no real
* visual gain, so only opacity/transform move.
*/
.elementor-742 .elementor-element-ka-container,
.elementor-743 .elementor-element-en-container {
perspective: 1600px;
perspective-origin: top center;
}
.elementor-742 .elementor-element-ka-main.ucr-paper-unfurl,
.elementor-743 .elementor-element-en-main.ucr-paper-unfurl {
opacity: 0 !important;
transform: rotateX(-13deg) translateY(-26px) !important;
transform-origin: top center;
transition:
opacity 1.15s cubic-bezier(0.16, 1, 0.3, 1),
transform 1.75s cubic-bezier(0.16, 1, 0.3, 1) !important;
/* No `will-change` - see the note on the News-single rule: a stylesheet
declaration never expires and left a permanent compositor layer. */
backface-visibility: hidden;
}
.elementor-742 .elementor-element-ka-main.ucr-paper-unfurl.visible,
.elementor-743 .elementor-element-en-main.ucr-paper-unfurl.visible {
opacity: 1 !important;
transform: rotateX(0) translateY(0) !important;
}
@media (prefers-reduced-motion: reduce) {
.elementor-742 .elementor-element-ka-main.ucr-paper-unfurl,
.elementor-743 .elementor-element-en-main.ucr-paper-unfurl {
opacity: 1 !important;
transform: none !important;
transition: none !important;
}
}
/* Strip Elementor boxed inners that shrink challenge/approach/outcomes cards. */
.elementor-742 .elementor-element-ka-main > .e-con-inner,
.elementor-743 .elementor-element-en-main > .e-con-inner,
.elementor-742 .elementor-element-ka-sidebar > .e-con-inner,
.elementor-743 .elementor-element-en-sidebar > .e-con-inner,
.elementor-742 .elementor-element-ka-container > .e-con-inner,
.elementor-743 .elementor-element-en-container > .e-con-inner {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
@media (max-width: 768px) {
.elementor-742 .elementor-element-ka-main,
.elementor-743 .elementor-element-en-main {
padding: 40px 24px !important;
}
}
.elementor-742 .elementor-element-ka-sidebar,
.elementor-743 .elementor-element-en-sidebar {
width: 100% !important;
padding: 0 !important;
gap: 30px !important;
min-width: 0 !important;
}
.elementor-742 .elementor-element-ka-details,
.elementor-743 .elementor-element-en-details,
.elementor-742 .elementor-element-ka-dlcard,
.elementor-743 .elementor-element-en-dlcard,
.elementor-742 .elementor-element-ka-ctacard,
.elementor-743 .elementor-element-en-ctacard {
width: 100% !important;
padding: 30px !important;
background: #ffffff !important;
border-radius: 6px !important;
border: 1px solid rgba(13, 29, 64, 0.04) !important;
box-shadow: 0 1px 3px rgba(13, 29, 64, 0.06), 0 8px 32px rgba(13, 29, 64, 0.04) !important;
box-sizing: border-box !important;
}
/*
* Night: sidebar cards stay white via the day rule above, while night
* heading lists force light ink → ghost text on white ("განაცხადის შეტანა").
* Elevate to surface + explicit light/dark ink + button contrast.
*/
html.night-mode .elementor-742 .elementor-element-ka-details,
html.night-mode .elementor-743 .elementor-element-en-details,
html.night-mode .elementor-742 .elementor-element-ka-dlcard,
html.night-mode .elementor-743 .elementor-element-en-dlcard,
html.night-mode .elementor-742 .elementor-element-ka-ctacard,
html.night-mode .elementor-743 .elementor-element-en-ctacard,
html.night-mode .ucr-project-cta-card {
background: #1E2740 !important;
border-color: rgba(237, 241, 244, 0.12) !important;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35) !important;
color: #EDF1F4 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-cta-title .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-cta-title .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-details-title .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-details-title .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-dlcard-title .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-dlcard-title .elementor-heading-title {
color: #EDF1F4 !important;
-webkit-text-fill-color: #EDF1F4 !important;
}
/*
* Project details sidebar hierarchy (V2 .detail-label / .detail-val):
* labels muted uppercase, values brighter - broad night heading sweeps
* were painting both #EDF1F4 and flattening the card.
*/
html.night-mode .elementor-742 .elementor-element-ka-detail-sector-label .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-status-label .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-partners-label .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-period-label .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-sector-label .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-status-label .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-partners-label .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-period-label .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-sector-label,
html.night-mode .elementor-742 .elementor-element-ka-detail-status-label,
html.night-mode .elementor-742 .elementor-element-ka-detail-partners-label,
html.night-mode .elementor-742 .elementor-element-ka-detail-period-label,
html.night-mode .elementor-743 .elementor-element-en-detail-sector-label,
html.night-mode .elementor-743 .elementor-element-en-detail-status-label,
html.night-mode .elementor-743 .elementor-element-en-detail-partners-label,
html.night-mode .elementor-743 .elementor-element-en-detail-period-label {
color: #9DAAB8 !important;
-webkit-text-fill-color: #9DAAB8 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-detail-sector-val .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-status-val .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-partners-val .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-period-val .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-sector-val .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-status-val .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-partners-val .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-detail-period-val .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-detail-sector-val .elementor-heading-title span,
html.night-mode .elementor-742 .elementor-element-ka-detail-status-val .elementor-heading-title span,
html.night-mode .elementor-742 .elementor-element-ka-detail-partners-val .elementor-heading-title span,
html.night-mode .elementor-742 .elementor-element-ka-detail-period-val .elementor-heading-title span,
html.night-mode .elementor-743 .elementor-element-en-detail-sector-val .elementor-heading-title span,
html.night-mode .elementor-743 .elementor-element-en-detail-status-val .elementor-heading-title span,
html.night-mode .elementor-743 .elementor-element-en-detail-partners-val .elementor-heading-title span,
html.night-mode .elementor-743 .elementor-element-en-detail-period-val .elementor-heading-title span {
color: #EDF1F4 !important;
-webkit-text-fill-color: #EDF1F4 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-details-title .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-details-title .elementor-heading-title {
border-bottom-color: rgba(237, 241, 244, 0.12) !important;
}
html.night-mode .elementor-742 .elementor-element-ka-cta-body .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-cta-body .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-cta-body,
html.night-mode .elementor-743 .elementor-element-en-cta-body {
color: #AAB4C4 !important;
-webkit-text-fill-color: #AAB4C4 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-btn-cta .elementor-button,
html.night-mode .elementor-743 .elementor-element-en-btn-cta .elementor-button {
background-color: #EDF1F4 !important;
background-image: none !important;
border-color: #EDF1F4 !important;
color: #0D1D40 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-btn-cta .elementor-button-text,
html.night-mode .elementor-743 .elementor-element-en-btn-cta .elementor-button-text,
html.night-mode .elementor-742 .elementor-element-ka-btn-cta .elementor-button span,
html.night-mode .elementor-743 .elementor-element-en-btn-cta .elementor-button span {
color: #0D1D40 !important;
-webkit-text-fill-color: #0D1D40 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-btn-cta .elementor-button:hover,
html.night-mode .elementor-743 .elementor-element-en-btn-cta .elementor-button:hover {
background-color: #ffffff !important;
border-color: #ffffff !important;
color: #0D1D40 !important;
}
.elementor-742 .elementor-element-ka-challenge,
.elementor-743 .elementor-element-en-challenge,
.elementor-742 .elementor-element-ka-approach,
.elementor-743 .elementor-element-en-approach,
.elementor-742 .elementor-element-ka-outcomes,
.elementor-743 .elementor-element-en-outcomes {
width: 100% !important;
padding: 0 !important;
}
.elementor-742 .elementor-element-ka-challenge-card,
.elementor-743 .elementor-element-en-challenge-card {
width: 100% !important;
padding: 24px 28px !important;
background: rgba(216, 41, 73, 0.05) !important;
border-left: 4px solid #D8364A !important;
border-radius: 0 6px 6px 0 !important;
box-sizing: border-box !important;
}
.elementor-742 .elementor-element-ka-outcomes-card,
.elementor-743 .elementor-element-en-outcomes-card {
width: 100% !important;
padding: 24px 28px !important;
background: rgba(50, 98, 127, 0.05) !important;
border-left: 4px solid #3E617C !important;
border-radius: 0 6px 6px 0 !important;
box-sizing: border-box !important;
}
/*
* V2 .detail-label = UI chrome (Montserrat) but Montserrat has no Georgian
* glyphs - bare "Montserrat, sans-serif" falls to system fonts and looks
* wrong on KA. Stack FiraGO/Noto for mkhedruli; Latin still prefers Montserrat.
*/
/* EN: Montserrat first (Latin UI chrome). KA: FiraGO first (mkhedruli). */
.elementor-743 .elementor-element-en-detail-sector-label .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-status-label .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-partners-label .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-period-label .elementor-heading-title {
font-family: 'Montserrat', 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 12px !important;
font-weight: 600 !important;
letter-spacing: 0.05em !important;
text-transform: uppercase !important;
line-height: 1.3 !important;
}
.elementor-742 .elementor-element-ka-detail-sector-label .elementor-heading-title,
.elementor-742 .elementor-element-ka-detail-status-label .elementor-heading-title,
.elementor-742 .elementor-element-ka-detail-partners-label .elementor-heading-title,
.elementor-742 .elementor-element-ka-detail-period-label .elementor-heading-title {
font-family: 'FiraGO', 'Noto Sans Georgian', 'Montserrat', sans-serif !important;
font-size: 12px !important;
font-weight: 600 !important;
letter-spacing: 0.05em !important;
text-transform: uppercase !important;
line-height: 1.3 !important;
}
.elementor-742 .elementor-element-ka-detail-sector-val .elementor-heading-title,
.elementor-742 .elementor-element-ka-detail-status-val .elementor-heading-title,
.elementor-742 .elementor-element-ka-detail-partners-val .elementor-heading-title,
.elementor-742 .elementor-element-ka-detail-period-val .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-sector-val .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-status-val .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-partners-val .elementor-heading-title,
.elementor-743 .elementor-element-en-detail-period-val .elementor-heading-title {
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
line-height: 1.4 !important;
}
.elementor-742 .elementor-element-ka-details-title .elementor-heading-title,
.elementor-743 .elementor-element-en-details-title .elementor-heading-title {
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
}
.elementor-742 .elementor-element-ka-challenge-text,
.elementor-743 .elementor-element-en-challenge-text,
.elementor-742 .elementor-element-ka-approach-text,
.elementor-743 .elementor-element-en-approach-text,
.elementor-742 .elementor-element-ka-outcomes-text,
.elementor-743 .elementor-element-en-outcomes-text {
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 15.5px !important;
line-height: 1.7 !important;
color: #4D4C4D !important;
}
.elementor-742 .elementor-element-ka-challenge-h-text .elementor-heading-title,
.elementor-743 .elementor-element-en-challenge-h-text .elementor-heading-title,
.elementor-742 .elementor-element-ka-approach-h-text .elementor-heading-title,
.elementor-743 .elementor-element-en-approach-h-text .elementor-heading-title,
.elementor-742 .elementor-element-ka-outcomes-h-text .elementor-heading-title,
.elementor-743 .elementor-element-en-outcomes-h-text .elementor-heading-title {
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 20px !important;
font-weight: 700 !important;
color: #0D1D40 !important;
}
/*
* Night: day rules above pin #0D1D40 / #4D4C4D with !important on
* .elementor-742|743 - generic night heading lists lose to that pair.
* Match template+widget specificity and lift card surfaces so body
* copy ("არსებული გამოწვევა" block) stays readable on dark hang card.
*/
html.night-mode .elementor-742 .elementor-element-ka-challenge-h-text .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-challenge-h-text .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-approach-h-text .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-approach-h-text .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-outcomes-h-text .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-outcomes-h-text .elementor-heading-title {
color: #EDF1F4 !important;
-webkit-text-fill-color: #EDF1F4 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-challenge-text,
html.night-mode .elementor-743 .elementor-element-en-challenge-text,
html.night-mode .elementor-742 .elementor-element-ka-approach-text,
html.night-mode .elementor-743 .elementor-element-en-approach-text,
html.night-mode .elementor-742 .elementor-element-ka-outcomes-text,
html.night-mode .elementor-743 .elementor-element-en-outcomes-text,
html.night-mode .elementor-742 .elementor-element-ka-challenge-text p,
html.night-mode .elementor-743 .elementor-element-en-challenge-text p,
html.night-mode .elementor-742 .elementor-element-ka-approach-text p,
html.night-mode .elementor-743 .elementor-element-en-approach-text p,
html.night-mode .elementor-742 .elementor-element-ka-outcomes-text p,
html.night-mode .elementor-743 .elementor-element-en-outcomes-text p,
html.night-mode .elementor-742 .elementor-element-ka-challenge-text .elementor-widget-container,
html.night-mode .elementor-743 .elementor-element-en-challenge-text .elementor-widget-container,
html.night-mode .elementor-742 .elementor-element-ka-approach-text .elementor-widget-container,
html.night-mode .elementor-743 .elementor-element-en-approach-text .elementor-widget-container,
html.night-mode .elementor-742 .elementor-element-ka-outcomes-text .elementor-widget-container,
html.night-mode .elementor-743 .elementor-element-en-outcomes-text .elementor-widget-container {
color: #C5CED9 !important;
-webkit-text-fill-color: #C5CED9 !important;
}
html.night-mode .elementor-742 .elementor-element-ka-challenge-card,
html.night-mode .elementor-743 .elementor-element-en-challenge-card {
background: rgba(216, 41, 73, 0.14) !important;
border-left-color: #D8364A !important;
}
html.night-mode .elementor-742 .elementor-element-ka-outcomes-card,
html.night-mode .elementor-743 .elementor-element-en-outcomes-card {
background: rgba(80, 148, 154, 0.14) !important;
border-left-color: #50949A !important;
}
/* Challenge section icon (warning triangle) if present as SVG/icon widget */
html.night-mode .elementor-742 .elementor-element-ka-challenge-h .elementor-icon,
html.night-mode .elementor-743 .elementor-element-en-challenge-h .elementor-icon,
html.night-mode .elementor-742 .elementor-element-ka-challenge-h svg,
html.night-mode .elementor-743 .elementor-element-en-challenge-h svg,
html.night-mode .elementor-742 .elementor-element-ka-challenge-h i,
html.night-mode .elementor-743 .elementor-element-en-challenge-h i {
color: #EDF1F4 !important;
fill: currentColor !important;
stroke: currentColor !important;
}
/* Share row circular treatment on project white header */
/* Same V2 outline share circles as article/publication singles */
.elementor-742 .elementor-share-btn,
.elementor-743 .elementor-share-btn {
width: 38px !important;
height: 38px !important;
min-width: 38px !important;
border-radius: 50% !important;
border: 1.5px solid rgba(13, 29, 64, 0.18) !important;
background: transparent !important;
background-color: transparent !important;
color: #0D1D40 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-shadow: none !important;
transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), background 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s !important;
}
/* Elementor minimal+official skin sets brand bg on __icon span, not the btn wrapper.
Override here so the outer btn circle/border is the visible element. */
.elementor-742 .elementor-share-btn__icon,
.elementor-743 .elementor-share-btn__icon {
background-color: transparent !important;
background: transparent !important;
color: #0D1D40 !important;
width: 100% !important;
height: 100% !important;
padding: 0 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
.elementor-742 .elementor-share-btn:hover .elementor-share-btn__icon,
.elementor-743 .elementor-share-btn:hover .elementor-share-btn__icon {
color: #ffffff !important;
}
.elementor-742 .elementor-share-btn svg,
.elementor-743 .elementor-share-btn svg,
.elementor-742 .elementor-share-btn svg path,
.elementor-743 .elementor-share-btn svg path,
.elementor-742 .elementor-share-btn__icon svg,
.elementor-743 .elementor-share-btn__icon svg,
.elementor-742 .elementor-share-btn__icon svg path,
.elementor-743 .elementor-share-btn__icon svg path {
width: 15px !important;
height: 15px !important;
color: inherit !important;
fill: currentColor !important;
}
.elementor-742 .elementor-share-btn:hover,
.elementor-743 .elementor-share-btn:hover {
transform: translateY(-2px) !important;
color: #ffffff !important;
box-shadow: 0 4px 12px rgba(13, 29, 64, 0.2) !important;
}
.elementor-742 .elementor-share-btn:hover svg,
.elementor-743 .elementor-share-btn:hover svg,
.elementor-742 .elementor-share-btn:hover svg path,
.elementor-743 .elementor-share-btn:hover svg path {
color: #ffffff !important;
fill: currentColor !important;
}
.elementor-742 .elementor-share-btn_facebook:hover,
.elementor-743 .elementor-share-btn_facebook:hover {
background: #1877F2 !important;
border-color: #1877F2 !important;
}
.elementor-742 .elementor-share-btn_x-twitter:hover,
.elementor-742 .elementor-share-btn_twitter:hover,
.elementor-743 .elementor-share-btn_x-twitter:hover,
.elementor-743 .elementor-share-btn_twitter:hover {
background: #111111 !important;
border-color: #111111 !important;
}
.elementor-742 .elementor-share-btn_linkedin:hover,
.elementor-743 .elementor-share-btn_linkedin:hover {
background: #0A66C2 !important;
border-color: #0A66C2 !important;
}
@media (prefers-reduced-motion: reduce) {
.elementor-742 .elementor-share-btn,
.elementor-743 .elementor-share-btn {
transition: none !important;
}
}
/*
* EX-046 - Project Single White-Header (R08)
* Templates 742 (KA) / 743 (EN): ka-wh / en-wh container sits at the top
* of the white card and holds breadcrumbs, badge, title, meta-actions,
* and the featured image. Elementor defaults give it no layout; the badge
* renders as a full-width block next to breadcrumbs; the meta row stacks
* vertically; share circles stack. CSS below fixes all geometry to match
* V2 .project-white-header layout (badge pill, horizontal meta+share,
* full-width wide image).
*/
/* --- White-header outer wrapper --- */
.elementor-742 .ucr-article-white-header,
.elementor-743 .ucr-article-white-header {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
gap: 0 !important;
padding: 0 !important;
margin-bottom: 32px !important;
padding-bottom: 0 !important;
}
/* --- Breadcrumb row (ka-wh-bc / en-wh-bc):
The bc container holds bc links AND badge AND title as siblings.
Use flex-wrap so badge/title drop to their own rows. --- */
.elementor-742 .elementor-element-ka-wh-bc,
.elementor-743 .elementor-element-en-wh-bc {
width: 100% !important;
max-width: none !important;
padding: 0 0 16px 0 !important;
margin: 0 0 8px 0 !important;
}
.elementor-742 .elementor-element-ka-wh-bc > .e-con-inner,
.elementor-743 .elementor-element-en-wh-bc > .e-con-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 4px !important;
row-gap: 14px !important;
padding: 0 !important;
width: 100% !important;
}
/* Breadcrumb link items - stay on first row (auto width) */
.elementor-742 .elementor-element-ka-wh-bc-home,
.elementor-742 .elementor-element-ka-wh-bc-sep1,
.elementor-742 .elementor-element-ka-wh-bc-projects,
.elementor-742 .elementor-element-ka-wh-bc-sep2,
.elementor-742 .elementor-element-ka-wh-bc-current,
.elementor-743 .elementor-element-en-wh-bc-home,
.elementor-743 .elementor-element-en-wh-bc-sep1,
.elementor-743 .elementor-element-en-wh-bc-projects,
.elementor-743 .elementor-element-en-wh-bc-sep2,
.elementor-743 .elementor-element-en-wh-bc-current {
flex: 0 0 auto !important;
width: auto !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
.elementor-742 .elementor-element-ka-wh-bc-home .elementor-heading-title,
.elementor-742 .elementor-element-ka-wh-bc-sep1 .elementor-heading-title,
.elementor-742 .elementor-element-ka-wh-bc-projects .elementor-heading-title,
.elementor-742 .elementor-element-ka-wh-bc-sep2 .elementor-heading-title,
.elementor-742 .elementor-element-ka-wh-bc-current .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-home .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-sep1 .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-projects .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-sep2 .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-current .elementor-heading-title {
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 12.5px !important;
font-weight: 500 !important;
color: rgba(13, 29, 64, 0.55) !important;
margin: 0 !important;
white-space: nowrap !important;
}
.elementor-742 .elementor-element-ka-wh-bc-current .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-current .elementor-heading-title {
color: rgba(13, 29, 64, 0.75) !important;
font-weight: 600 !important;
white-space: normal !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
max-width: 320px !important;
}
.elementor-742 .elementor-element-ka-wh-bc a,
.elementor-743 .elementor-element-en-wh-bc a {
color: rgba(13, 29, 64, 0.55) !important;
text-decoration: none !important;
}
.elementor-742 .elementor-element-ka-wh-bc a:hover,
.elementor-743 .elementor-element-en-wh-bc a:hover {
color: #50949A !important;
}
/* --- Badge (inside bc container): forces to own row, pill-shaped --- */
.elementor-742 .elementor-element-ka-wh-badge,
.elementor-743 .elementor-element-en-wh-badge {
flex-basis: 100% !important;
width: 100% !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
}
.elementor-742 .elementor-element-ka-wh-badge .elementor-widget-container,
.elementor-743 .elementor-element-en-wh-badge .elementor-widget-container {
background: transparent !important;
padding: 0 !important;
}
.elementor-742 .elementor-element-ka-wh-badge .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-badge .elementor-heading-title {
display: inline-block !important;
width: auto !important;
max-width: max-content !important;
padding: 5px 13px !important;
border-radius: 4px !important;
background: #50949A !important;
color: #ffffff !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 11px !important;
font-weight: 700 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
line-height: 1.25 !important;
margin: 0 !important;
}
/* --- White-header title (inside bc container): own row --- */
.elementor-742 .elementor-element-ka-wh-title,
.elementor-743 .elementor-element-en-wh-title {
flex-basis: 100% !important;
width: 100% !important;
padding: 0 !important;
margin: 10px 0 0 0 !important;
}
.elementor-742 .elementor-element-ka-wh-title .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-title .elementor-heading-title {
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: clamp(22px, 2.6vw, 34px) !important;
font-weight: 700 !important;
color: #0D1D40 !important;
line-height: 1.22 !important;
margin: 0 !important;
}
/* --- Meta actions row (ka-wh-meta): date left, share right --- */
.elementor-742 .elementor-element-ka-wh-meta,
.elementor-743 .elementor-element-en-wh-meta {
width: 100% !important;
padding: 0 !important;
margin: 20px 0 24px !important;
border-top: 1px solid rgba(13, 29, 64, 0.09) !important;
border-bottom: 1px solid rgba(13, 29, 64, 0.09) !important;
}
.elementor-742 .elementor-element-ka-wh-meta > .e-con-inner,
.elementor-743 .elementor-element-en-wh-meta > .e-con-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
padding: 12px 0 !important;
width: 100% !important;
}
/* Date widget */
.elementor-742 .elementor-element-ka-wh-date,
.elementor-743 .elementor-element-en-wh-date {
flex: 0 0 auto !important;
width: auto !important;
}
.elementor-742 .elementor-element-ka-wh-date .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-date .elementor-heading-title {
font-family: 'Noto Sans Georgian', 'FiraGO', sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
color: rgba(13, 29, 64, 0.55) !important;
margin: 0 !important;
}
/* Share + copy actions container */
.elementor-742 .elementor-element-ka-wh-actions,
.elementor-743 .elementor-element-en-wh-actions {
flex: 0 0 auto !important;
width: auto !important;
max-width: 100% !important;
padding: 0 !important;
}
.elementor-742 .elementor-element-ka-wh-actions > .e-con-inner,
.elementor-743 .elementor-element-en-wh-actions > .e-con-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 10px !important;
padding: 0 !important;
width: auto !important;
}
/* Share grid: horizontal row of circle buttons */
.elementor-742 .elementor-element-ka-share,
.elementor-743 .elementor-element-en-share {
width: auto !important;
max-width: max-content !important;
}
.elementor-742 .elementor-element-ka-share .elementor-grid,
.elementor-743 .elementor-element-en-share .elementor-grid {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
gap: 10px !important;
grid-template-columns: none !important;
}
.elementor-742 .elementor-element-ka-share .elementor-grid-item,
.elementor-743 .elementor-element-en-share .elementor-grid-item {
width: auto !important;
}
/* --- Featured image below meta row --- */
.elementor-742 .elementor-element-ka-wh-image,
.elementor-743 .elementor-element-en-wh-image {
width: 100% !important;
margin: 0 0 36px !important;
padding: 0 !important;
}
.elementor-742 .elementor-element-ka-wh-image img,
.elementor-743 .elementor-element-en-wh-image img {
width: 100% !important;
height: auto !important;
max-height: 400px !important;
object-fit: cover !important;
border-radius: 4px !important;
display: block !important;
}
/* --- Night-mode overrides for wh meta --- */
html.night-mode .elementor-742 .elementor-element-ka-wh-meta,
html.night-mode .elementor-743 .elementor-element-en-wh-meta {
border-top-color: rgba(237, 241, 244, 0.12) !important;
border-bottom-color: rgba(237, 241, 244, 0.12) !important;
}
html.night-mode .elementor-742 .elementor-element-ka-wh-date .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-wh-date .elementor-heading-title {
color: rgba(237, 241, 244, 0.55) !important;
}
/*
* Night: article/publication/project share circles - day navy (#0D1D40)
* + rgba(13,29,64,.18) border vanish on dark paper. Light outline + ink.
* Hover brand fills stay (Facebook/X/LinkedIn/copy).
*/
html.night-mode .elementor-share-btn,
html.night-mode .elementor-share-btn .elementor-share-btn__icon,
html.night-mode .ucr-copy-link-btn,
html.night-mode .elementor-element-na-copy.ucr-copy-link-btn {
border-color: rgba(237, 241, 244, 0.32) !important;
color: #EDF1F4 !important;
background: transparent !important;
background-color: transparent !important;
}
html.night-mode .elementor-share-btn svg,
html.night-mode .elementor-share-btn .elementor-share-btn__icon svg,
html.night-mode .elementor-share-btn i,
html.night-mode .elementor-share-btn svg path,
html.night-mode .elementor-share-btn__icon svg path {
color: #EDF1F4 !important;
fill: currentColor !important;
stroke: none !important;
}
html.night-mode .ucr-copy-link-btn svg,
html.night-mode .ucr-copy-link-btn .e-svg-base,
html.night-mode .ucr-copy-link-btn .ucr-copy-link-icon {
color: #EDF1F4 !important;
}
html.night-mode .ucr-copy-link-btn svg,
html.night-mode .ucr-copy-link-btn svg path,
html.night-mode .ucr-copy-link-btn svg rect {
fill: none !important;
stroke: currentColor !important;
color: #EDF1F4 !important;
}
html.night-mode .elementor-share-btn:hover,
html.night-mode .ucr-copy-link-btn:hover,
html.night-mode .ucr-copy-link-btn:focus-visible {
color: #ffffff !important;
}
html.night-mode .elementor-share-btn:hover svg,
html.night-mode .elementor-share-btn:hover svg path,
html.night-mode .elementor-share-btn:hover i,
html.night-mode .ucr-copy-link-btn:hover svg,
html.night-mode .ucr-copy-link-btn:hover svg path,
html.night-mode .ucr-copy-link-btn:hover svg rect {
color: #ffffff !important;
fill: currentColor !important;
}
html.night-mode .ucr-copy-link-btn:hover svg,
html.night-mode .ucr-copy-link-btn:hover svg path,
html.night-mode .ucr-copy-link-btn:hover svg rect {
fill: none !important;
stroke: currentColor !important;
}
/* X/Twitter hover black chip needs a visible edge on dark paper */
html.night-mode .elementor-share-btn_x-twitter:hover,
html.night-mode .elementor-share-btn_twitter:hover {
background: #0a0a0a !important;
border-color: rgba(237, 241, 244, 0.45) !important;
}
html.night-mode .ucr-share-count-label {
color: rgba(237, 241, 244, 0.55) !important;
}
/* News/pub white-header meta dividers + date on article templates 676/677 */
html.night-mode .elementor-676 .elementor-element-na-wh-meta,
html.night-mode .elementor-677 .elementor-element-na-wh-meta {
border-top-color: rgba(237, 241, 244, 0.12) !important;
border-bottom-color: rgba(237, 241, 244, 0.12) !important;
}
html.night-mode .elementor-676 .elementor-element-na-wh-date .elementor-heading-title,
html.night-mode .elementor-677 .elementor-element-na-wh-date .elementor-heading-title {
color: rgba(237, 241, 244, 0.62) !important;
}
html.night-mode .elementor-742 .elementor-element-ka-wh-bc .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-wh-bc .elementor-heading-title,
html.night-mode .elementor-742 .elementor-element-ka-wh-bc a,
html.night-mode .elementor-743 .elementor-element-en-wh-bc a {
color: rgba(237, 241, 244, 0.5) !important;
}
html.night-mode .elementor-742 .elementor-element-ka-wh-bc-current .elementor-heading-title,
html.night-mode .elementor-743 .elementor-element-en-wh-bc-current .elementor-heading-title {
color: rgba(237, 241, 244, 0.75) !important;
}
/* --- Responsive adjustments for wh section --- */
@media (max-width: 768px) {
.elementor-742 .elementor-element-ka-wh-bc-current .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-bc-current .elementor-heading-title {
max-width: 180px !important;
}
.elementor-742 .elementor-element-ka-wh-title .elementor-heading-title,
.elementor-743 .elementor-element-en-wh-title .elementor-heading-title {
font-size: clamp(20px, 5vw, 28px) !important;
}
.elementor-742 .elementor-element-ka-wh-image img,
.elementor-743 .elementor-element-en-wh-image img {
max-height: 240px !important;
}
}
/*
* EX-047 - Archive Grid Footer Spacing & Min-Height Fix
* Fixes issue where filtering cards to 1-2 items caused grid height to collapse,
* sticking cards directly onto the footer with 0px gap.
*/
body.page-id-211 .ucr-insight-grid,
body.page-id-212 .ucr-insight-grid,
body.page-id-213 .ucr-project-grid,
body.page-id-214 .ucr-project-grid,
body.page-id-211 .elementor-widget-loop-grid,
body.page-id-212 .elementor-widget-loop-grid,
body.page-id-213 .elementor-widget-loop-grid,
body.page-id-214 .elementor-widget-loop-grid,
body.page-id-211 .elementor-loop-container,
body.page-id-212 .elementor-loop-container,
body.page-id-213 .elementor-loop-container,
body.page-id-214 .elementor-loop-container,
body.page-id-211 .e-loop-builder,
body.page-id-212 .e-loop-builder,
body.page-id-213 .e-loop-builder,
body.page-id-214 .e-loop-builder,
body.page-id-211 main, body.page-id-212 main,
body.page-id-213 main, body.page-id-214 main,
body.page-id-211 .elementor-widget-loop-grid,
body.page-id-212 .elementor-widget-loop-grid,
body.page-id-213 .elementor-widget-loop-grid,
body.page-id-214 .elementor-widget-loop-grid {
padding-bottom: 96px !important;
margin-bottom: 0 !important;
min-height: 480px !important;
}
.elementor-widget-loop-grid .elementor-widget-container.is-filter-loading,
.elementor-loop-container.is-filter-loading {
opacity: 0.45 !important;
pointer-events: none !important;
transition: opacity 0.15s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
/*
* EX-048 - About Page Engine 4-Step Methodology Colorful Number Cards (R02)
* Restores 1:1 V2 mockup colors: Step 1 (Persian #50949A), Step 2 (Carrot #E4863C),
* Step 3 (Steel #6390B7), Step 4 (Amethyst #887CB3).
*/
.engine-track .engine-step:nth-child(1),
[data-id="engine-step-0"],
.elementor-element-engine-step-0 {
border-top: 3px solid #50949A !important;
}
.engine-track .engine-step:nth-child(1):hover,
[data-id="engine-step-0"]:hover,
.elementor-element-engine-step-0:hover {
border-color: #50949A !important;
border-top-color: #50949A !important;
}
.engine-track .engine-step:nth-child(1) .engine-num,
.engine-track .engine-step:nth-child(1) .engine-num .elementor-heading-title,
.engine-track .engine-step:nth-child(1) .elementor-heading-title,
[data-id="engine-step-num-0"] .elementor-heading-title,
.elementor-element-engine-step-num-0 .elementor-heading-title {
color: #50949A !important;
}
.engine-track .engine-step:nth-child(2),
[data-id="engine-step-1"],
.elementor-element-engine-step-1 {
border-top: 3px solid #E4863C !important;
}
.engine-track .engine-step:nth-child(2):hover,
[data-id="engine-step-1"]:hover,
.elementor-element-engine-step-1:hover {
border-color: #E4863C !important;
border-top-color: #E4863C !important;
}
.engine-track .engine-step:nth-child(2) .engine-num,
.engine-track .engine-step:nth-child(2) .engine-num .elementor-heading-title,
.engine-track .engine-step:nth-child(2) .elementor-heading-title,
[data-id="engine-step-num-1"] .elementor-heading-title,
.elementor-element-engine-step-num-1 .elementor-heading-title {
color: #E4863C !important;
}
.engine-track .engine-step:nth-child(3),
[data-id="engine-step-2"],
.elementor-element-engine-step-2 {
border-top: 3px solid #6390B7 !important;
}
.engine-track .engine-step:nth-child(3):hover,
[data-id="engine-step-2"]:hover,
.elementor-element-engine-step-2:hover {
border-color: #6390B7 !important;
border-top-color: #6390B7 !important;
}
.engine-track .engine-step:nth-child(3) .engine-num,
.engine-track .engine-step:nth-child(3) .engine-num .elementor-heading-title,
.engine-track .engine-step:nth-child(3) .elementor-heading-title,
[data-id="engine-step-num-2"] .elementor-heading-title,
.elementor-element-engine-step-num-2 .elementor-heading-title {
color: #6390B7 !important;
}
.engine-track .engine-step:nth-child(4),
[data-id="engine-step-3"],
.elementor-element-engine-step-3 {
border-top: 3px solid #887CB3 !important;
}
.engine-track .engine-step:nth-child(4):hover,
[data-id="engine-step-3"]:hover,
.elementor-element-engine-step-3:hover {
border-color: #887CB3 !important;
border-top-color: #887CB3 !important;
}
.engine-track .engine-step:nth-child(4) .engine-num,
.engine-track .engine-step:nth-child(4) .engine-num .elementor-heading-title,
.engine-track .engine-step:nth-child(4) .elementor-heading-title,
[data-id="engine-step-num-3"] .elementor-heading-title,
.elementor-element-engine-step-num-3 .elementor-heading-title {
color: #887CB3 !important;
}
/*
* EX-045 - Experts route (R09) wrap + founder/join geometry.
* Pages 215/216 use Elementor boxed inners that either expand full-bleed
* without the V2 1280 wrap or keep 10px gutters; join form stretches full
* width; founder pad/gap and photo gradient drift from design-v2.
*/
body.page-id-215 .elementor-element-p14inner,
body.page-id-216 .elementor-element-p14inner,
body.page-id-215 .elementor-element-parch-inner,
body.page-id-216 .elementor-element-parch-inner {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 56px !important;
padding-right: 56px !important;
box-sizing: border-box !important;
}
body.page-id-215 .elementor-element-p14inner > .e-con-inner,
body.page-id-216 .elementor-element-p14inner > .e-con-inner,
body.page-id-215 .elementor-element-parch-inner > .e-con-inner,
body.page-id-216 .elementor-element-parch-inner > .e-con-inner {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
/* V2 .wrap has no container gap - Elementor default 20px inflated the banner */
gap: 0 !important;
row-gap: 0 !important;
column-gap: 0 !important;
}
@media (max-width: 768px) {
body.page-id-215 .elementor-element-p14inner,
body.page-id-216 .elementor-element-p14inner,
body.page-id-215 .elementor-element-parch-inner,
body.page-id-216 .elementor-element-parch-inner {
padding-left: 24px !important;
padding-right: 24px !important;
}
}
body.page-id-215 .elementor-element-exp-banner-sec,
body.page-id-216 .elementor-element-exp-banner-sec {
width: 100% !important;
max-width: none !important;
background: #F3F4F1 !important;
padding: 60px 0 40px !important;
border-bottom: 1px solid rgba(36, 39, 33, 0.12) !important;
}
body.page-id-215 .elementor-element-exp-content-sec,
body.page-id-216 .elementor-element-exp-content-sec {
width: 100% !important;
max-width: none !important;
background: #ffffff !important;
padding: 60px 0 100px !important;
}
/* Banner kicker: Montserrat + line (V2 .kicker with teal/#0D1D40) */
body.page-id-215 .elementor-element-exp-banner-kicker,
body.page-id-216 .elementor-element-exp-banner-kicker {
width: auto !important;
max-width: max-content !important;
margin-bottom: 12px !important;
}
body.page-id-215 .elementor-element-exp-banner-kicker .elementor-heading-title,
body.page-id-216 .elementor-element-exp-banner-kicker .elementor-heading-title {
display: inline-flex !important;
align-items: center !important;
gap: 14px !important;
margin: 0 !important;
color: #0D1D40 !important;
font-family: 'Montserrat', 'FiraGO', sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.32em !important;
text-transform: uppercase !important;
line-height: 1 !important;
}
body.page-id-215 .elementor-element-exp-banner-kicker .elementor-widget-container,
body.page-id-216 .elementor-element-exp-banner-kicker .elementor-widget-container {
line-height: 1 !important;
}
body.page-id-215 .elementor-element-exp-banner-kicker .elementor-heading-title::before,
body.page-id-216 .elementor-element-exp-banner-kicker .elementor-heading-title::before { content: none !important; /* Client-directed 2026-08-15: kicker rule ("em dash") removed site-wide. */ }
body.page-id-215 .elementor-element-exp-banner-h1 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-banner-h1 .elementor-heading-title {
margin: 0 !important;
color: #242721 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: clamp(32px, 3.8vw, 48px) !important;
font-weight: 700 !important;
line-height: 1.2 !important;
}
body.page-id-215 .elementor-element-exp-banner-desc,
body.page-id-216 .elementor-element-exp-banner-desc {
max-width: 60ch !important;
margin-top: 14px !important;
}
body.page-id-215 .elementor-element-exp-banner-desc,
body.page-id-216 .elementor-element-exp-banner-desc {
max-width: 60ch !important;
margin-top: 14px !important;
margin-bottom: 0 !important;
}
body.page-id-215 .elementor-element-exp-banner-desc p,
body.page-id-216 .elementor-element-exp-banner-desc p {
color: #5C6772 !important;
font-family: 'Noto Sans Georgian', 'FiraGO', sans-serif !important;
font-size: 15px !important;
font-weight: 300 !important;
line-height: 1.6 !important;
margin: 0 !important;
}
/* Team / network section spacing */
body.page-id-215 .elementor-element-exp-team-container,
body.page-id-216 .elementor-element-exp-team-container,
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container {
margin-bottom: 80px !important;
width: 100% !important;
max-width: none !important;
padding: 0 !important;
}
body.page-id-215 .elementor-element-exp-team-container > .e-con-inner,
body.page-id-216 .elementor-element-exp-team-container > .e-con-inner,
body.page-id-215 .elementor-element-exp-network-container > .e-con-inner,
body.page-id-216 .elementor-element-exp-network-container > .e-con-inner {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
gap: 0 !important;
row-gap: 0 !important;
column-gap: 0 !important;
}
body.page-id-215 .elementor-element-exp-founder-info > .e-con-inner,
body.page-id-216 .elementor-element-exp-founder-info > .e-con-inner {
gap: 0 !important;
row-gap: 0 !important;
column-gap: 0 !important;
padding: 0 !important;
margin: 0 !important;
width: 100% !important;
max-width: none !important;
}
body.page-id-215 .elementor-element-exp-founder-photo,
body.page-id-216 .elementor-element-exp-founder-photo {
width: 160px !important;
max-width: 160px !important;
min-width: 160px !important;
flex: 0 0 160px !important;
}
body.page-id-215 .elementor-element-exp-founder-photo .elementor-widget-container,
body.page-id-216 .elementor-element-exp-founder-photo .elementor-widget-container {
width: 160px !important;
height: 160px !important;
line-height: 0 !important;
}
body.page-id-215 .elementor-element-exp-team-h2 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-team-h2 .elementor-heading-title,
body.page-id-215 .elementor-element-exp-network-h2 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-network-h2 .elementor-heading-title {
color: #0D1D40 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 24px !important;
font-weight: 700 !important;
}
body.page-id-215 .elementor-element-exp-team-h2,
body.page-id-216 .elementor-element-exp-team-h2 {
margin-bottom: 30px !important;
}
body.page-id-215 .elementor-element-exp-network-h2,
body.page-id-216 .elementor-element-exp-network-h2 {
margin-bottom: 20px !important;
}
body.page-id-215 .elementor-element-exp-network-desc,
body.page-id-215 .elementor-element-exp-network-desc p,
body.page-id-216 .elementor-element-exp-network-desc,
body.page-id-216 .elementor-element-exp-network-desc p {
max-width: 80ch !important;
color: #4A5560 !important;
font-family: 'Noto Sans Georgian', 'FiraGO', sans-serif !important;
font-size: 15px !important;
font-weight: 300 !important;
line-height: 1.8 !important;
}
/* Founder block */
body.page-id-215 .elementor-element-exp-founder-block,
body.page-id-216 .elementor-element-exp-founder-block {
display: flex !important;
flex-direction: row !important;
align-items: flex-start !important;
gap: 24px !important;
width: 100% !important;
max-width: 100% !important;
padding: 26px !important;
border: 1px solid rgba(36, 39, 33, 0.12) !important;
border-radius: 4px !important;
background: #F3F4F1 !important;
box-sizing: border-box !important;
}
body.page-id-215 .elementor-element-exp-founder-block > .e-con-inner,
body.page-id-216 .elementor-element-exp-founder-block > .e-con-inner {
display: flex !important;
flex-direction: row !important;
align-items: flex-start !important;
gap: 24px !important;
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
body.page-id-215 .founder-photo,
body.page-id-216 .founder-photo {
width: 160px !important;
height: 160px !important;
border-radius: 50% !important;
flex-shrink: 0 !important;
display: block !important;
/* V2 .founder-photo: persian → stratos (placeholder when no featured image) */
background: linear-gradient(135deg, #50949A, #081D42) !important;
background-image: linear-gradient(135deg, #50949A, #081D42) !important;
}
/* CPT-hydrated photo (EX-045 data bridge) */
body.page-id-215 img.founder-photo,
body.page-id-216 img.founder-photo {
object-fit: cover !important;
object-position: center 20% !important;
background: none !important;
background-image: none !important;
}
body.page-id-215 .elementor-element-exp-founder-name .elementor-heading-title,
body.page-id-216 .elementor-element-exp-founder-name .elementor-heading-title {
color: #0D1D40 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 20px !important;
font-weight: 600 !important;
margin: 0 0 4px !important;
}
body.page-id-215 .elementor-element-exp-founder-role .elementor-heading-title,
body.page-id-216 .elementor-element-exp-founder-role .elementor-heading-title {
color: #50949A !important;
font-family: 'Montserrat', 'FiraGO', sans-serif !important;
font-size: 11px !important;
font-weight: 600 !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
}
body.page-id-215 .elementor-element-exp-founder-bio,
body.page-id-215 .elementor-element-exp-founder-bio p,
body.page-id-216 .elementor-element-exp-founder-bio,
body.page-id-216 .elementor-element-exp-founder-bio p {
width: 100% !important;
max-width: none !important;
box-sizing: border-box !important;
margin-top: 10px !important;
color: #5C6772 !important;
font-family: 'Noto Sans Georgian', 'FiraGO', sans-serif !important;
font-size: 14.5px !important;
font-weight: 300 !important;
line-height: 1.7 !important;
}
/* EX-067: user-directed Experts page realignment. Reuses the native
* media-library layer, but gives this route the same dark photo-hero
* contract as About/Services and a deliberate editorial content flow. */
body.page-id-215 .elementor-element-exp-banner-sec,
body.page-id-216 .elementor-element-exp-banner-sec {
position: relative !important;
min-height: 520px !important;
padding: 0 !important;
border: 0 !important;
background: #0D1D40 !important;
overflow: hidden !important;
justify-content: center !important;
}
body.page-id-215 .elementor-element-exp-banner-sec > .e-con-inner,
body.page-id-216 .elementor-element-exp-banner-sec > .e-con-inner {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
min-height: 520px !important;
}
body.page-id-215 .elementor-element-exp-banner-photo,
body.page-id-216 .elementor-element-exp-banner-photo {
background-position: right 30% !important;
}
body.page-id-215 .elementor-element-exp-banner-kicker .elementor-heading-title,
body.page-id-216 .elementor-element-exp-banner-kicker .elementor-heading-title {
color: #50949A !important;
}
body.page-id-215 .elementor-element-exp-banner-h1 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-banner-h1 .elementor-heading-title {
max-width: 17ch !important;
color: #FFFFFF !important;
font-size: clamp(38px, 4vw, 56px) !important;
line-height: 1.08 !important;
}
body.page-id-215 .elementor-element-exp-banner-desc,
body.page-id-216 .elementor-element-exp-banner-desc {
max-width: 58ch !important;
margin-top: 16px !important;
}
body.page-id-215 .elementor-element-exp-banner-desc p,
body.page-id-216 .elementor-element-exp-banner-desc p {
color: #EDF1F4 !important;
font-size: 16px !important;
line-height: 1.7 !important;
}
body.page-id-215 .elementor-element-exp-content-sec,
body.page-id-216 .elementor-element-exp-content-sec {
background: #F3F4F1 !important;
padding: clamp(72px, 8vw, 112px) 0 !important;
}
body.page-id-215 .elementor-element-exp-team-container,
body.page-id-216 .elementor-element-exp-team-container,
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container {
margin-bottom: clamp(72px, 8vw, 104px) !important;
}
body.page-id-215 .elementor-element-exp-team-h2 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-team-h2 .elementor-heading-title,
body.page-id-215 .elementor-element-exp-network-h2 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-network-h2 .elementor-heading-title {
font-size: 30px !important;
line-height: 1.15 !important;
}
body.page-id-215 .elementor-element-exp-team-h2,
body.page-id-216 .elementor-element-exp-team-h2,
body.page-id-215 .elementor-element-exp-network-h2,
body.page-id-216 .elementor-element-exp-network-h2 {
margin-bottom: 28px !important;
}
body.page-id-215 .elementor-element-exp-founder-block,
body.page-id-216 .elementor-element-exp-founder-block {
gap: 32px !important;
padding: 40px !important;
border: 1px solid rgba(13, 29, 64, 0.14) !important;
border-top: 3px solid #50949A !important;
border-radius: 6px !important;
background: #FFFFFF !important;
}
body.page-id-215 .elementor-element-exp-founder-block > .e-con-inner,
body.page-id-216 .elementor-element-exp-founder-block > .e-con-inner {
gap: 32px !important;
}
body.page-id-215 .elementor-element-exp-founder-name .elementor-heading-title,
body.page-id-216 .elementor-element-exp-founder-name .elementor-heading-title {
font-size: 24px !important;
line-height: 1.15 !important;
}
body.page-id-215 .elementor-element-exp-founder-bio,
body.page-id-215 .elementor-element-exp-founder-bio p,
body.page-id-216 .elementor-element-exp-founder-bio,
body.page-id-216 .elementor-element-exp-founder-bio p {
color: #4A5560 !important;
font-size: 15px !important;
line-height: 1.75 !important;
}
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container {
padding: 40px !important;
border-top: 1px solid rgba(13, 29, 64, 0.14) !important;
border-bottom: 1px solid rgba(13, 29, 64, 0.14) !important;
background: rgba(80, 148, 154, 0.08) !important;
}
body.page-id-215 .elementor-element-exp-join-container,
body.page-id-216 .elementor-element-exp-join-container {
border-radius: 6px !important;
}
@media (max-width: 1024px) {
body.page-id-215 .elementor-element-exp-banner-sec,
body.page-id-216 .elementor-element-exp-banner-sec,
body.page-id-215 .elementor-element-exp-banner-sec > .e-con-inner,
body.page-id-216 .elementor-element-exp-banner-sec > .e-con-inner { min-height: 440px !important; }
}
@media (max-width: 640px) {
body.page-id-215 .elementor-element-exp-banner-sec,
body.page-id-216 .elementor-element-exp-banner-sec,
body.page-id-215 .elementor-element-exp-banner-sec > .e-con-inner,
body.page-id-216 .elementor-element-exp-banner-sec > .e-con-inner { min-height: 400px !important; }
body.page-id-215 .elementor-element-exp-banner-h1 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-banner-h1 .elementor-heading-title { max-width: 12ch !important; font-size: 34px !important; }
body.page-id-215 .elementor-element-p14inner,
body.page-id-216 .elementor-element-p14inner { transform: translateY(32px) !important; }
body.page-id-215 .elementor-element-exp-banner-desc p,
body.page-id-216 .elementor-element-exp-banner-desc p { font-size: 15px !important; }
body.page-id-215 .elementor-element-exp-founder-block,
body.page-id-216 .elementor-element-exp-founder-block { gap: 22px !important; padding: 28px 24px !important; }
body.page-id-215 .elementor-element-exp-founder-block > .e-con-inner,
body.page-id-216 .elementor-element-exp-founder-block > .e-con-inner { gap: 22px !important; }
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container { padding: 28px 24px !important; }
body.page-id-215 .elementor-element-exp-team-h2 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-team-h2 .elementor-heading-title,
body.page-id-215 .elementor-element-exp-network-h2 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-network-h2 .elementor-heading-title { font-size: 26px !important; }
}
@media (max-width: 640px) {
body.page-id-215 .elementor-element-exp-founder-block,
body.page-id-216 .elementor-element-exp-founder-block,
body.page-id-215 .elementor-element-exp-founder-block > .e-con-inner,
body.page-id-216 .elementor-element-exp-founder-block > .e-con-inner {
flex-direction: column !important;
align-items: flex-start !important;
}
body.page-id-215 .elementor-element-exp-founder-photo,
body.page-id-216 .elementor-element-exp-founder-photo {
width: 128px !important;
max-width: 128px !important;
min-width: 128px !important;
flex-basis: 128px !important;
}
body.page-id-215 .elementor-element-exp-founder-photo .elementor-widget-container,
body.page-id-216 .elementor-element-exp-founder-photo .elementor-widget-container,
body.page-id-215 .founder-photo,
body.page-id-216 .founder-photo {
width: 128px !important;
height: 128px !important;
}
}
/* Join card - beat Elementor generated page CSS specificity. */
/* EX-045 amendment (2026-08-05, user-directed): associate-network facts.
The section was a single paragraph; its own copy already names a
headcount and five disciplines, so they are surfaced as a stat
lockup plus chips (markup in the `exp-network-facts` HTML widget).
Numerals use Montserrat and localized labels Noto Sans Georgian,
the same split as the homepage stat band; radius stays at the
site's 4px surface language (this system has no pill components). */
body.page-id-215 .ucr-network-stat,
body.page-id-216 .ucr-network-stat {
display: flex;
align-items: baseline;
gap: 12px;
margin: 0 0 22px;
}
body.page-id-215 .ucr-network-stat-num,
body.page-id-216 .ucr-network-stat-num {
font-family: 'Montserrat', sans-serif;
font-size: 40px;
font-weight: 700;
line-height: 1;
letter-spacing: -0.02em;
color: #50949A;
}
body.page-id-215 .ucr-network-stat-label,
body.page-id-216 .ucr-network-stat-label {
font-family: 'Noto Sans Georgian', sans-serif;
font-size: 13.5px;
font-weight: 400;
line-height: 1.4;
color: #5C6772;
}
body.page-id-215 .ucr-network-disciplines,
body.page-id-216 .ucr-network-disciplines {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0 0 22px;
padding: 0;
list-style: none;
}
body.page-id-215 .ucr-network-disciplines li,
body.page-id-216 .ucr-network-disciplines li {
font-family: 'Noto Sans Georgian', sans-serif;
font-size: 13px;
line-height: 1.35;
color: #5C6772;
background: #ffffff;
border: 1px solid #D5D8D1;
border-left: 2px solid #50949A;
border-radius: 4px;
padding: 7px 13px;
margin: 0;
}
/*
* EX-076 (2) - the five discipline chips are five distinct categories
* (forestry / ecology / agri-tech / sociology / M&E) that all carried
* the same Persian Green rule, so the colour conveyed nothing. Each now
* takes its own step of the palette cycle. Only the 2px LEFT RULE is
* recoloured - the label text stays #5C6772 - because these chips sit on
* white, where every vivid hue fails AA as text (Atlantis 1.73:1). A rule
* carries no text contrast requirement, so this is safe at any hue.
* `nth-of-type` is stable here: the list is a plain
of - .
*/
body.page-id-215 .ucr-network-disciplines li:nth-of-type(1),
body.page-id-216 .ucr-network-disciplines li:nth-of-type(1) {
border-left-color: #54B7E1 !important; /* Aqua */
}
body.page-id-215 .ucr-network-disciplines li:nth-of-type(2),
body.page-id-216 .ucr-network-disciplines li:nth-of-type(2) {
border-left-color: #50949A !important; /* Persian Green */
}
body.page-id-215 .ucr-network-disciplines li:nth-of-type(3),
body.page-id-216 .ucr-network-disciplines li:nth-of-type(3) {
border-left-color: #6390B7 !important; /* Steel Blue */
}
body.page-id-215 .ucr-network-disciplines li:nth-of-type(4),
body.page-id-216 .ucr-network-disciplines li:nth-of-type(4) {
border-left-color: #E4863C !important; /* Neon Carrot */
}
body.page-id-215 .ucr-network-disciplines li:nth-of-type(5),
body.page-id-216 .ucr-network-disciplines li:nth-of-type(5) {
border-left-color: #B7D053 !important; /* Atlantis */
}
@media (max-width: 480px) {
body.page-id-215 .ucr-network-stat-num,
body.page-id-216 .ucr-network-stat-num { font-size: 34px; }
body.page-id-215 .ucr-network-disciplines,
body.page-id-216 .ucr-network-disciplines { gap: 6px; }
body.page-id-215 .ucr-network-disciplines li,
body.page-id-216 .ucr-network-disciplines li { font-size: 12.5px; padding: 6px 11px; }
}
/* EX-067 amendment (2026-08-11): the network is a metric rail, not a
loose, low-contrast panel. The existing HTML widget retains the data;
only its editorial reading order changes. */
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container {
padding: 48px !important;
border: 1px solid rgba(13, 29, 64, 0.14) !important;
border-top: 3px solid #50949A !important;
background: #ffffff !important;
}
body.page-id-215 .elementor-element-exp-network-container > .e-con-inner,
body.page-id-216 .elementor-element-exp-network-container > .e-con-inner {
display: grid !important;
grid-template-columns: 220px minmax(0, 1fr) !important;
column-gap: 44px !important;
row-gap: 24px !important;
}
body.page-id-215 .elementor-element-exp-network-h2,
body.page-id-216 .elementor-element-exp-network-h2,
body.page-id-215 .elementor-element-exp-network-facts,
body.page-id-216 .elementor-element-exp-network-facts {
grid-column: 1 / -1 !important;
}
body.page-id-215 .elementor-element-exp-network-h2,
body.page-id-216 .elementor-element-exp-network-h2 { margin: 0 !important; }
body.page-id-215 .elementor-element-exp-network-facts,
body.page-id-216 .elementor-element-exp-network-facts {
display: grid !important;
grid-template-columns: 220px minmax(0, 1fr) !important;
column-gap: 44px !important;
align-items: start !important;
}
body.page-id-215 .ucr-network-stat,
body.page-id-216 .ucr-network-stat {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
gap: 9px !important;
min-height: 124px !important;
margin: 0 !important;
padding-right: 32px !important;
border-right: 1px solid rgba(13, 29, 64, 0.14) !important;
}
body.page-id-215 .ucr-network-stat-num,
body.page-id-216 .ucr-network-stat-num { font-size: 64px !important; line-height: .92 !important; }
body.page-id-215 .ucr-network-stat-label,
body.page-id-216 .ucr-network-stat-label { max-width: 15ch; color: #242721 !important; }
body.page-id-215 .ucr-network-disciplines,
body.page-id-216 .ucr-network-disciplines { margin: 0 !important; gap: 10px !important; }
body.page-id-215 .ucr-network-disciplines li,
body.page-id-216 .ucr-network-disciplines li {
color: #0D1D40 !important;
background: #F3F4F1 !important;
border-color: rgba(13, 29, 64, 0.14) !important;
border-left-width: 3px !important;
padding: 8px 13px !important;
}
body.page-id-215 .elementor-element-exp-network-desc,
body.page-id-216 .elementor-element-exp-network-desc { grid-column: 2 !important; margin: 0 !important; }
body.page-id-215 .elementor-element-exp-network-desc p,
body.page-id-216 .elementor-element-exp-network-desc p { max-width: 60ch; margin: 0 !important; color: #242721 !important; line-height: 1.7 !important; }
@media (max-width: 768px) {
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container { padding: 32px 28px !important; }
body.page-id-215 .elementor-element-exp-network-container > .e-con-inner,
body.page-id-216 .elementor-element-exp-network-container > .e-con-inner,
body.page-id-215 .elementor-element-exp-network-facts,
body.page-id-216 .elementor-element-exp-network-facts { display: block !important; }
body.page-id-215 .elementor-element-exp-network-h2,
body.page-id-216 .elementor-element-exp-network-h2 { margin-bottom: 26px !important; }
body.page-id-215 .ucr-network-stat,
body.page-id-216 .ucr-network-stat {
min-height: 0 !important;
margin-bottom: 24px !important;
padding: 0 0 20px !important;
border-right: 0 !important;
border-bottom: 1px solid rgba(13, 29, 64, 0.14) !important;
}
body.page-id-215 .ucr-network-stat-num,
body.page-id-216 .ucr-network-stat-num { font-size: 52px !important; }
body.page-id-215 .elementor-element-exp-network-desc,
body.page-id-216 .elementor-element-exp-network-desc { margin-top: 24px !important; }
}
@media (max-width: 480px) {
body.page-id-215 .elementor-element-exp-network-container,
body.page-id-216 .elementor-element-exp-network-container { padding: 28px 24px !important; }
body.page-id-215 .ucr-network-stat-num,
body.page-id-216 .ucr-network-stat-num { font-size: 48px !important; }
body.page-id-215 .ucr-network-disciplines,
body.page-id-216 .ucr-network-disciplines { gap: 7px !important; }
body.page-id-215 .ucr-network-disciplines li,
body.page-id-216 .ucr-network-disciplines li { font-size: 12.5px !important; padding: 7px 10px !important; }
}
body.page-id-215 .elementor-215 .elementor-element.elementor-element-exp-join-container,
body.page-id-216 .elementor-216 .elementor-element.elementor-element-exp-join-container,
body.page-id-215 .elementor-215 .elementor-element.elementor-element-exp-join-container:not(.elementor-motion-effects-element-type-background),
body.page-id-216 .elementor-216 .elementor-element.elementor-element-exp-join-container:not(.elementor-motion-effects-element-type-background),
body.page-id-215 .elementor-element.elementor-element-exp-join-container.ucr-experts-join-card,
body.page-id-216 .elementor-element.elementor-element-exp-join-container.ucr-experts-join-card {
position: relative !important;
overflow: hidden !important;
width: 100% !important;
max-width: none !important;
padding: 48px !important;
/* Brandbook surface: both gradient stops are official palette values
(Upcomrise Teal #0D1D40 -> Stratos #081D42), the same dark family
the news slider and footer already use. The edge is Persian Green
at low alpha so border, ::before glow and site accent are one
family - the previous slate base (#2A3A54/#1B2334) with a Steel
Blue edge was off-palette and fought the green glow above it. */
border: 1px solid rgba(80, 148, 154, 0.25) !important;
border-radius: 4px !important;
background: linear-gradient(160deg, #0D1D40 0%, #081D42 100%) !important;
background-color: #081D42 !important;
background-image: linear-gradient(160deg, #0D1D40 0%, #081D42 100%) !important;
box-sizing: border-box !important;
}
body.page-id-215 .elementor-element-exp-join-container.ucr-experts-join-card > .e-con-inner,
body.page-id-216 .elementor-element-exp-join-container.ucr-experts-join-card > .e-con-inner {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
position: relative !important;
z-index: 1 !important;
/* V2 join-card is normal flow (h3 mb 16 + p mb 30 + form mt collapses) - no 20px flex gap */
gap: 0 !important;
row-gap: 0 !important;
column-gap: 0 !important;
}
body.page-id-215 .elementor-element-exp-join-container.ucr-experts-join-card::before,
body.page-id-216 .elementor-element-exp-join-container.ucr-experts-join-card::before {
content: '' !important;
position: absolute !important;
top: -40px !important;
right: -40px !important;
width: 160px !important;
height: 160px !important;
border-radius: 50% !important;
background: radial-gradient(circle, rgba(80, 148, 154, 0.18), transparent 70%) !important;
pointer-events: none !important;
z-index: 0 !important;
}
body.page-id-215 .elementor-element-exp-join-h3,
body.page-id-216 .elementor-element-exp-join-h3 {
margin: 0 0 16px !important;
width: 100% !important;
}
body.page-id-215 .elementor-element-exp-join-h3 .elementor-heading-title,
body.page-id-216 .elementor-element-exp-join-h3 .elementor-heading-title {
color: #EDF1F4 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 24px !important;
font-weight: 700 !important;
line-height: 1.35 !important;
margin: 0 !important;
}
body.page-id-215 .elementor-element-exp-join-desc,
body.page-id-216 .elementor-element-exp-join-desc {
margin: 0 0 30px !important;
width: 100% !important;
}
body.page-id-215 .elementor-element-exp-join-desc p,
body.page-id-216 .elementor-element-exp-join-desc p {
color: #9DAAB8 !important;
font-family: 'Noto Sans Georgian', 'FiraGO', sans-serif !important;
font-size: 14px !important;
font-weight: 300 !important;
line-height: 1.7 !important;
margin: 0 !important;
}
body.page-id-215 .elementor-element-exp-join-form,
body.page-id-216 .elementor-element-exp-join-form {
width: 100% !important;
max-width: 600px !important;
margin-top: 0 !important;
}
/*
* V2 join-form: column stack with 16px gap; name+email sit in .form-group-row
* (grid 1fr 1fr, column-gap 32px). Earlier flex-direction:column + 50% width
* left name/email half-width and stacked - the main design break.
*/
body.page-id-215 .elementor-element-exp-join-form .elementor-form-fields-wrapper,
body.page-id-216 .elementor-element-exp-join-form .elementor-form-fields-wrapper {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: stretch !important;
align-content: flex-start !important;
gap: 16px 32px !important;
width: 100% !important;
max-width: 600px !important;
box-sizing: border-box !important;
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group {
float: none !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
}
/* Name + email side-by-side on desktop (V2 .form-group-row) */
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-name,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-name,
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-email,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-email {
flex: 1 1 calc(50% - 16px) !important;
width: calc(50% - 16px) !important;
max-width: calc(50% - 16px) !important;
min-width: 0 !important;
display: flex !important;
flex-direction: column !important;
margin: 0 !important;
margin-left: 0 !important;
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-expertise,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-expertise,
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-experience,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-experience,
body.page-id-215 .elementor-element-exp-join-form .elementor-field-type-submit,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-type-submit {
flex: 1 1 100% !important;
width: 100% !important;
max-width: 100% !important;
}
/* Honeypot must stay in DOM but must not consume flex gap/height (was +17px on join card). */
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-hp_website,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-hp_website {
position: absolute !important;
left: -10000px !important;
top: auto !important;
width: 1px !important;
height: 1px !important;
max-width: 1px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
flex: 0 0 0 !important;
}
@media (max-width: 640px) {
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-name,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-name,
body.page-id-215 .elementor-element-exp-join-form .elementor-field-group-email,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-group-email {
flex: 1 1 100% !important;
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
}
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-textual,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-textual {
width: 100% !important;
max-width: 100% !important;
min-height: 52px !important;
padding: 14px 17px !important;
border: 1px solid rgba(13, 29, 64, 0.14) !important;
border-radius: 9px !important;
background: #ffffff !important;
box-shadow: 0 1px 2px rgba(13, 29, 64, 0.03), 0 8px 18px rgba(13, 29, 64, 0.025) !important;
color: #242721 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
font-size: 14px !important;
line-height: 1.35 !important;
box-sizing: border-box !important;
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-textual::placeholder,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-textual::placeholder {
color: #91a2b7 !important;
font-weight: 400 !important;
opacity: 1 !important;
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-textual:hover,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-textual:hover {
border-color: rgba(13, 29, 64, 0.26) !important;
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-textual:focus,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-textual:focus {
border-color: #0D1D40 !important;
box-shadow: 0 0 0 4px rgba(13, 29, 64, 0.1), 0 8px 22px rgba(13, 29, 64, 0.06) !important;
outline: none !important;
}
body.page-id-215 .elementor-element-exp-join-form textarea.elementor-field-textual,
body.page-id-216 .elementor-element-exp-join-form textarea.elementor-field-textual {
min-height: 140px !important;
resize: vertical !important;
}
body.page-id-215 .elementor-element-exp-join-form .elementor-field-type-submit,
body.page-id-216 .elementor-element-exp-join-form .elementor-field-type-submit {
width: auto !important;
max-width: max-content !important;
flex: 0 0 auto !important;
align-self: flex-start !important;
justify-content: flex-start !important;
}
body.page-id-215 .elementor-element-exp-join-form button[type="submit"],
body.page-id-216 .elementor-element-exp-join-form button[type="submit"] {
width: auto !important;
min-width: 0 !important;
height: auto !important;
padding: 16px 28px !important;
border: none !important;
border-radius: 3px !important;
background: #50949A !important;
color: #ffffff !important;
font-family: 'Montserrat', 'FiraGO', sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
cursor: pointer !important;
transition: background 0.22s ease !important;
}
body.page-id-215 .elementor-element-exp-join-form button[type="submit"]:hover,
body.page-id-216 .elementor-element-exp-join-form button[type="submit"]:hover {
background: #5FA6AC !important;
}
@media (prefers-reduced-motion: reduce) {
body.page-id-215 .elementor-element-exp-join-form button[type="submit"],
body.page-id-216 .elementor-element-exp-join-form button[type="submit"] {
transition: none !important;
}
}
/* EX-013: Article/Publication/Project Single - transformer scroll-reveal
white header. No native Elementor control toggles an element's visibility
past a scroll threshold with staggered per-child reveal delays (Motion
Effects "Scrolling Effects" are continuous scroll-linked transforms, not a
threshold class-toggle) - same category of gap as EX-002's header shrink,
applied to a different element/threshold here. */
.ucr-article-white-header {
opacity: 0;
max-height: 0;
overflow: hidden;
margin-bottom: 0 !important;
transition:
opacity 0.38s cubic-bezier(0.16, 1, 0.3, 1),
max-height 0.38s cubic-bezier(0.16, 1, 0.3, 1),
margin-bottom 0.38s cubic-bezier(0.16, 1, 0.3, 1);
}
body.ucr-scrolled-past-hero .ucr-article-white-header {
opacity: 1;
max-height: 1600px;
margin-bottom: 40px !important;
}
.ucr-article-white-header > * {
opacity: 0;
transform: translateY(-35px);
filter: blur(1.5px);
transition:
opacity 0.38s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.38s cubic-bezier(0.16, 1, 0.3, 1),
filter 0.38s cubic-bezier(0.16, 1, 0.3, 1);
}
body.ucr-scrolled-past-hero .ucr-article-white-header > * {
opacity: 1;
transform: translateY(0);
filter: blur(0);
}
body.ucr-scrolled-past-hero .ucr-article-white-header > *:nth-child(1) { transition-delay: 0.02s; }
body.ucr-scrolled-past-hero .ucr-article-white-header > *:nth-child(2) { transition-delay: 0.04s; }
body.ucr-scrolled-past-hero .ucr-article-white-header > *:nth-child(3) { transition-delay: 0.06s; }
body.ucr-scrolled-past-hero .ucr-article-white-header > *:nth-child(4) { transition-delay: 0.08s; }
body.ucr-scrolled-past-hero .ucr-article-white-header > *:nth-child(5) { transition-delay: 0.1s; }
body.ucr-scrolled-past-hero .ucr-article-white-header > *:nth-child(6) { transition-delay: 0.12s; }
body:not(.ucr-scrolled-past-hero) .ucr-article-white-header > * {
transition-duration: 0.25s;
transition-delay: 0s !important;
}
@media (prefers-reduced-motion: reduce) {
.ucr-article-white-header,
.ucr-article-white-header > * {
transition: none !important;
}
}
/* EX-013: native Share Buttons widget has no "copy link" platform option;
this is the exact same clipboard-copy pattern as EX-010, applied to the
Article/Publication/Project Single meta row's own circular button. */
.ucr-copy-link-btn {
transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease;
}
.ucr-copy-link-btn:hover,
.ucr-copy-link-btn:focus-visible {
background-color: #50949A;
border-color: #50949A;
color: #FFFFFF;
outline: none;
}
.ucr-copy-link-btn.ucr-copy-done {
background-color: #47A447;
border-color: #47A447;
color: #FFFFFF;
}
@media (prefers-reduced-motion: reduce) {
.ucr-copy-link-btn {
transition: none !important;
}
}
/* EX-014: Article/Publication Single body typography hierarchy. The native
Post Content widget exposes exactly one typography control for its whole
rendered output; the source distinguishes h2/h3/blockquote/list styling
within that same body - a real, source-required visual hierarchy, not
decorative. Scoped purely to tag selectors inside the native widget's own
markup; no new elements/behavior. */
.ucr-article-body h2 {
font-size: 24px;
font-weight: 700;
color: #0D1D40;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif;
margin: 64px 0 20px;
line-height: 1.28;
padding-bottom: 16px;
border-bottom: 2px solid rgba(80,148,154,0.25);
}
.ucr-article-body h3 {
font-size: 13px;
font-weight: 700;
color: #50949A;
margin: 40px 0 12px;
letter-spacing: 0.08em;
text-transform: uppercase;
font-family: 'Montserrat', sans-serif;
}
.ucr-article-body blockquote {
border-left: 4px solid #D8364A;
padding: 28px 36px;
margin: 52px 0;
background: rgba(50, 98, 127, 0.06);
border-radius: 0 4px 4px 0;
font-size: 20px;
font-weight: 600;
line-height: 1.58;
color: #3E617C;
font-family: 'Noto Sans Georgian', sans-serif;
}
.ucr-article-body blockquote p {
margin: 0;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
color: inherit;
}
.ucr-article-body ul,
.ucr-article-body ol {
list-style: none;
padding: 0;
margin: 24px 0 32px 0;
}
.ucr-article-body ul li,
.ucr-article-body ol li {
font-size: 16px;
line-height: 1.75;
color: #5C6772;
padding: 0 0 0 28px;
margin-bottom: 16px;
position: relative;
}
.ucr-article-body ul li::before,
.ucr-article-body ol li::before {
content: '';
position: absolute;
left: 6px;
top: 10px;
width: 6px;
height: 6px;
border-radius: 50%;
background: #3E617C;
}
/* EX-015: singular ucr_insight type-conditional content (News/Article vs
Publication). One shared Single template contains both bodies since News
Article and Publication are the same real CPT; toggled purely by the real
body class the EX-015 PHP filter adds (see above) - no JS. `publication`
(EN) and `publikatsia` (KA) are the two real term slugs. */
.ucr-pub-download-center {
display: none;
}
body.ucr-insight-type-publication .ucr-article-gallery,
body.ucr-insight-type-publikatsia .ucr-article-gallery,
body.ucr-insight-type-publication .ucr-article-tags,
body.ucr-insight-type-publikatsia .ucr-article-tags,
body.ucr-insight-type-publication .ucr-article-dl-bar,
body.ucr-insight-type-publikatsia .ucr-article-dl-bar {
display: none;
}
/*
* EX-042 - Publication download center two-column grid.
* Elementor containers default to flex. With content_width:full the
* preview/action columns are direct children - grid on the outer marker.
* When a boxed `.e-con-inner` is present, grid targets that wrapper instead.
*/
body.ucr-insight-type-publication .ucr-pub-download-center,
body.ucr-insight-type-publikatsia .ucr-pub-download-center {
display: grid !important;
grid-template-columns: 260px minmax(0, 1fr) !important;
gap: 36px !important;
align-items: start !important;
background: #FFFFFF;
border: 1px solid rgba(13, 29, 64, 0.08);
border-radius: 8px;
padding: 36px;
margin: 48px 0;
box-shadow: 0 4px 20px rgba(13, 29, 64, 0.03), 0 20px 48px rgba(13, 29, 64, 0.04);
}
/* EX-042 grid uses body+class !important; hide without resource must beat it. */
body.ucr-insight-type-publication .ucr-pub-download-center.ucr-pub-download-hidden,
body.ucr-insight-type-publikatsia .ucr-pub-download-center.ucr-pub-download-hidden {
display: none !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-download-center > .e-con-inner {
display: contents !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-preview,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-preview {
width: 100% !important;
max-width: 260px !important;
min-width: 0 !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-action,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-action {
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-action > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-action > .e-con-inner {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
}
/* File rows: full-width stacked cards matching V2 */
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-filerows,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-filerows {
width: 100% !important;
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en {
width: 100% !important;
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 16px !important;
padding: 16px 20px !important;
border: 1px solid rgba(13, 29, 64, 0.05) !important;
border-radius: 6px !important;
background: #F8FAFC !important;
box-sizing: border-box !important;
transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka:hover,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en:hover,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka:hover,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en:hover {
background: #ffffff !important;
border-color: rgba(50, 98, 127, 0.25) !important;
box-shadow: 0 4px 16px rgba(13, 29, 64, 0.06) !important;
transform: translateY(-2px) !important;
}
@media (prefers-reduced-motion: reduce) {
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en {
transition: none !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka:hover,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en:hover,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka:hover,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en:hover {
transform: none !important;
}
}
/* File item icon sizing and color overrides to prevent text overlap */
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-icon,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-icon {
width: 26px !important;
height: 26px !important;
flex-shrink: 0 !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon .elementor-icon-wrapper,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-icon .elementor-icon-wrapper,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon .elementor-icon-wrapper,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-icon .elementor-icon-wrapper,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon .elementor-icon,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-icon .elementor-icon,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon .elementor-icon,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-icon .elementor-icon,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon svg,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-icon svg,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon svg,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-icon svg {
width: 26px !important;
height: 26px !important;
font-size: 26px !important;
line-height: 26px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon .elementor-icon,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-icon .elementor-icon,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-icon .elementor-icon,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-icon .elementor-icon {
color: #D8364A !important;
}
/* Publication side panel metadata icon and text layout fixes.
NOTE: no margin-bottom here - the parent `na-pub-meta` container
already carries V2's 12px row rhythm as a native Elementor flex
`gap`. A margin-bottom on the rows double-counted it into 24px
(the same Elementor flex-gap double-count documented on EX-011). */
[data-id="na-pub-meta-date"],
[data-id="na-pub-meta-lang"],
[data-id="na-pub-meta-size"] {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 10px !important;
}
[data-id="na-pub-meta-date-icon"],
[data-id="na-pub-meta-lang-icon"],
[data-id="na-pub-meta-size-icon"] {
width: 14px !important;
height: 14px !important;
min-width: 14px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin: 0 !important;
}
[data-id="na-pub-meta-date-icon"] .elementor-icon,
[data-id="na-pub-meta-lang-icon"] .elementor-icon,
[data-id="na-pub-meta-size-icon"] .elementor-icon {
font-size: 14px !important;
width: 14px !important;
height: 14px !important;
line-height: 1 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
color: #50949A !important; /* var(--teal) */
opacity: 0.8 !important;
}
[data-id="na-pub-meta-date-icon"] .elementor-icon-wrapper,
[data-id="na-pub-meta-lang-icon"] .elementor-icon-wrapper,
[data-id="na-pub-meta-size-icon"] .elementor-icon-wrapper {
padding: 0 !important;
margin: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
[data-id="na-pub-meta-date-text"] .elementor-heading-title,
[data-id="na-pub-meta-lang-text"] .elementor-heading-title,
[data-id="na-pub-meta-size-text"] .elementor-heading-title {
font-size: 12.5px !important;
color: #5C6772 !important; /* var(--emperor) */
font-family: 'FiraGO', sans-serif !important;
line-height: 1.2 !important;
margin: 0 !important;
font-weight: 400 !important;
}
[data-id="na-pub-meta-date-text"] .elementor-heading-title b,
[data-id="na-pub-meta-lang-text"] .elementor-heading-title b,
[data-id="na-pub-meta-size-text"] .elementor-heading-title b {
color: #0D1D40 !important; /* var(--navy-deep) */
font-weight: 600 !important;
}
/* File item details layout override */
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-details,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-details,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-details,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-details {
width: auto !important;
flex: 1 1 auto !important;
min-width: 0 !important;
padding: 0 !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-details > .e-con-inner,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-details > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-details > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-details > .e-con-inner {
width: 100% !important;
padding: 0 !important;
display: flex !important;
flex-direction: column !important;
gap: 4px !important;
}
/* File name heading styles */
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-name"] .elementor-heading-title,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-name"] .elementor-heading-title {
font-size: 14.5px !important;
font-weight: 600 !important;
color: #0D1D40 !important;
font-family: 'FiraGO', sans-serif !important;
line-height: 1.35 !important;
margin: 0 !important;
}
/* File meta heading styles */
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-meta"] .elementor-heading-title,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-meta"] .elementor-heading-title {
font-size: 11.5px !important;
color: #555555 !important;
font-family: 'FiraGO', sans-serif !important;
margin: 0 !important;
}
@media (max-width: 860px) {
body.ucr-insight-type-publication .ucr-pub-download-center,
body.ucr-insight-type-publikatsia .ucr-pub-download-center {
grid-template-columns: minmax(0, 1fr) !important;
padding: 24px;
gap: 28px;
}
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-preview,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-preview {
max-width: none !important;
}
}
.ucr-pub-doc-mockup {
position: relative;
display: flex;
flex-direction: column;
justify-content: space-between;
width: 145px;
height: 200px;
background: linear-gradient(135deg, #0D1D40 0%, #163C4F 100%);
border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: 0 12px 28px rgba(13, 29, 64, 0.22);
padding: 18px 16px 16px 20px;
margin: 0 auto 24px;
overflow: hidden;
transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.ucr-pub-doc-mockup:hover,
.ucr-pub-doc-mockup:focus-visible {
transform: translateY(-6px) rotate(-1.5deg);
box-shadow: 0 20px 35px rgba(13, 29, 64, 0.3);
outline: none;
}
.ucr-pub-doc-mockup::before {
content: '';
position: absolute;
top: 0; left: 0; bottom: 0;
width: 5px;
background: linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(255,255,255,0.15) 50%, rgba(0,0,0,0.2) 100%);
border-right: 1px solid rgba(0,0,0,0.4);
}
@media (prefers-reduced-motion: reduce) {
.ucr-pub-doc-mockup {
transition: none !important;
}
}
.ucr-pub-email-collapse {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.ucr-pub-email-collapse.ucr-pub-email-open {
max-height: 140px;
}
.ucr-pub-email-success {
display: none;
}
@media (prefers-reduced-motion: reduce) {
.ucr-pub-email-collapse {
transition: none !important;
}
}
/* Publication download center buttons & email input styling */
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-ka-actions > .e-con-inner,
body.ucr-insight-type-publication .ucr-pub-download-center .elementor-element-na-pub-file-en-actions > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-ka-actions > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-download-center .elementor-element-na-pub-file-en-actions > .e-con-inner {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 10px !important;
justify-content: flex-end !important;
width: auto !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"],
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"],
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"],
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] {
width: 36px !important;
height: 36px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin: 0 !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button,
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 36px !important;
height: 36px !important;
min-height: 36px !important;
border-radius: 50% !important;
background: #ffffff !important;
border: 1.5px solid rgba(13, 29, 64, 0.12) !important;
color: #0D1D40 !important;
padding: 0 !important;
margin: 0 !important;
transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
box-shadow: none !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button svg,
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button svg,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button svg,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button svg {
width: 15px !important;
height: 15px !important;
fill: none !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button svg path,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button svg path {
fill: currentColor !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button svg path,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button svg path {
fill: currentColor !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button:hover,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-preview"] a.elementor-button:hover {
transform: scale(1.05) !important;
box-shadow: 0 4px 12px rgba(13, 29, 64, 0.12) !important;
border-color: #54B7E1 !important;
color: #54B7E1 !important;
}
body.ucr-insight-type-publication .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button:hover,
body.ucr-insight-type-publikatsia .ucr-pub-download-center [class*="na-pub-file-"][class*="-download"] a.elementor-button:hover {
transform: scale(1.05) !important;
box-shadow: 0 4px 12px rgba(13, 29, 64, 0.12) !important;
background: #13A89E !important;
border-color: #13A89E !important;
color: #ffffff !important;
}
/* Email toggle button styling */
body.ucr-insight-type-publication .ucr-pub-email-toggle,
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle {
display: inline-flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 8px !important;
background: rgba(50, 98, 127, 0.06) !important;
border: 1px dashed rgba(13, 29, 64, 0.15) !important;
padding: 8px 16px !important;
border-radius: 4px !important;
cursor: pointer !important;
transition: all 0.22s !important;
width: auto !important;
height: auto !important;
}
body.ucr-insight-type-publication .ucr-pub-email-toggle [data-id="na-pub-email-toggle-text"],
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle [data-id="na-pub-email-toggle-text"] {
margin: 0 !important;
padding: 0 !important;
display: inline-block !important;
width: auto !important;
}
body.ucr-insight-type-publication .ucr-pub-email-toggle::before,
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle::before {
content: '' !important;
display: inline-block !important;
width: 14px !important;
height: 14px !important;
background-color: #0d1d40 !important;
-webkit-mask-image: url('data:image/svg+xml;utf8,') !important;
mask-image: url('data:image/svg+xml;utf8,') !important;
-webkit-mask-repeat: no-repeat !important;
mask-repeat: no-repeat !important;
-webkit-mask-position: center !important;
mask-position: center !important;
-webkit-mask-size: contain !important;
mask-size: contain !important;
transition: background-color 0.22s !important;
}
body.ucr-insight-type-publication .ucr-pub-email-toggle:hover::before,
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle:hover::before {
background-color: #13A89E !important;
}
body.ucr-insight-type-publication .ucr-pub-email-toggle:hover,
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle:hover {
background: rgba(50, 98, 127, 0.12) !important;
border-color: #13A89E !important;
}
body.ucr-insight-type-publication .ucr-pub-email-toggle:hover .elementor-heading-title,
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle:hover .elementor-heading-title {
color: #13A89E !important;
}
body.ucr-insight-type-publication .ucr-pub-email-toggle .elementor-heading-title,
body.ucr-insight-type-publikatsia .ucr-pub-email-toggle .elementor-heading-title {
color: #0d1d40 !important;
font-size: 12.5px !important;
font-weight: 600 !important;
font-family: 'FiraGO', sans-serif !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.2 !important;
}
/* Email form container */
body.ucr-insight-type-publication .ucr-pub-email-collapse > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-email-collapse > .e-con-inner {
padding: 0 !important;
width: 100% !important;
}
/* Email input row */
body.ucr-insight-type-publication .ucr-pub-email-input > .e-con-inner,
body.ucr-insight-type-publikatsia .ucr-pub-email-input > .e-con-inner {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 8px !important;
margin-top: 12px !important;
width: 100% !important;
padding: 0 !important;
}
/* Input field */
body.ucr-insight-type-publication .ucr-pub-email-field,
body.ucr-insight-type-publikatsia .ucr-pub-email-field {
height: 38px !important;
font-size: 13.5px !important;
border-radius: 3px !important;
padding: 0 12px !important;
border: 1px solid rgba(13, 29, 64, 0.15) !important;
background: #ffffff !important;
color: #0D1D40 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
outline: none !important;
transition: border-color 0.22s !important;
flex: 1 !important;
box-shadow: none !important;
width: 100% !important;
box-sizing: border-box !important;
}
body.ucr-insight-type-publication .ucr-pub-email-field:focus,
body.ucr-insight-type-publikatsia .ucr-pub-email-field:focus {
border-color: #13A89E !important;
}
/* Submit button */
body.ucr-insight-type-publication .ucr-pub-email-submit,
body.ucr-insight-type-publikatsia .ucr-pub-email-submit {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 20px !important;
height: 38px !important;
width: auto !important;
border-radius: 3px !important;
background: #0d1d40 !important;
border: none !important;
cursor: pointer !important;
transition: background 0.25s, transform 0.2s !important;
box-sizing: border-box !important;
}
body.ucr-insight-type-publication .ucr-pub-email-submit:hover,
body.ucr-insight-type-publikatsia .ucr-pub-email-submit:hover {
background: #13A89E !important;
}
body.ucr-insight-type-publication .ucr-pub-email-submit .elementor-heading-title,
body.ucr-insight-type-publikatsia .ucr-pub-email-submit .elementor-heading-title {
color: #ffffff !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.05em !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
margin: 0 !important;
padding: 0 !important;
}
body.ucr-insight-type-publication .ucr-pub-email-success,
body.ucr-insight-type-publikatsia .ucr-pub-email-success {
color: #47A447 !important;
font-size: 12.5px !important;
margin-top: 8px !important;
font-weight: 500 !important;
font-family: 'FiraGO', 'Noto Sans Georgian', sans-serif !important;
}
/* EX-014: Post Terms dynamic tag renders a plain inline run of links; the
source shows each as a bordered pill - scoped styling of that native
tag's own generated anchors only. */
.ucr-article-tags a {
display: inline-block;
padding: 5px 12px;
border: 1px solid #E2E4DE;
border-radius: 2px;
font-size: 12px;
color: #5C6772;
font-weight: 500;
letter-spacing: 0.04em;
text-decoration: none;
margin: 4px 4px 4px 0;
transition: border-color 0.2s, color 0.2s;
}
.ucr-article-tags a:hover {
border-color: #50949A;
color: #50949A;
}
@media (prefers-reduced-motion: reduce) {
.ucr-article-tags a {
transition: none !important;
}
}
/* EX-017: Project Single sidebar - Download card (type=project) vs CTA
card (type=opportunity). Same real-term/body-class toggle technique as
EX-015 (ucr_project_type is a term on the same ucr_project CPT, so the
two states are one shared template, not two posts) - `project`/`proeqti`
and `opportunity`/`shesadzlebloba` are the real term slugs. The report
doc-mockup card reuses EX-015's exact structural pattern (spine/header/
title/footer) but the source gives it its own red gradient palette and
vertical stacked layout, distinct from the Publication card, so it is a
separate marker class rather than a reuse of `.ucr-pub-doc-mockup`. */
.ucr-project-cta-card {
display: none;
}
body.ucr-project-type-project .ucr-project-cta-card,
body.ucr-project-type-proeqti .ucr-project-cta-card {
display: none !important;
}
body.ucr-project-type-opportunity .ucr-project-download-card,
body.ucr-project-type-shesadzlebloba .ucr-project-download-card {
display: none !important;
}
body.ucr-project-type-opportunity .ucr-project-cta-card,
body.ucr-project-type-shesadzlebloba .ucr-project-cta-card {
display: block !important;
}
.ucr-project-doc-mockup {
position: relative;
display: flex;
flex-direction: column;
justify-content: space-between;
width: 135px;
height: 185px;
background: linear-gradient(135deg, #DC5A48 0%, #D8364A 100%);
border-radius: 4px;
border: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: 0 12px 28px rgba(13, 29, 64, 0.22);
padding: 16px 14px 14px 18px;
margin: 0 auto 24px;
overflow: hidden;
transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.ucr-project-doc-mockup:hover,
.ucr-project-doc-mockup:focus-visible {
transform: translateY(-6px) rotate(-1.5deg);
box-shadow: 0 20px 35px rgba(13, 29, 64, 0.3);
outline: none;
}
.ucr-project-doc-mockup::before {
content: '';
position: absolute;
top: 0; left: 0; bottom: 0;
width: 6px;
background: linear-gradient(to right, #081D42 0%, #0D1D40 50%, #081D42 100%);
border-right: 1px solid rgba(0,0,0,0.3);
}
@media (prefers-reduced-motion: reduce) {
.ucr-project-doc-mockup {
transition: none !important;
}
}
/* EX-018: site-wide scroll-reveal fade-up, first used on the Home route
(P5) but scoped purely to the `.scroll-reveal` marker class so it is
safe to load globally. Exact source values: opacity/translateY(20px)/
blur(8px) → visible, 0.8s cubic-bezier(0.16,1,0.3,1). */
.scroll-reveal {
opacity: 0;
transform: translateY(20px);
filter: blur(8px);
transition:
opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.scroll-reveal.visible {
opacity: 1;
transform: none;
filter: blur(0);
}
@media (prefers-reduced-motion: reduce) {
.scroll-reveal {
opacity: 1;
transform: none;
filter: blur(0);
transition: none !important;
}
}
/* EX-019: Home Services teaser row layout + full V2 hover.
Elementor's atomic grid-column cannot place description in col 2;
atomic hover variants cannot style descendants when the *row* is
hovered. Exact V2 source values from design-v2/assets/style.css. */
.ucr-row-desc {
grid-column: 2;
}
/* EX-019 amendment, client-directed 2026-08-15: the description occupies the implicit second grid row, so an arrow left in row 1 centred against the title only and measured 25px above the row's real middle. Spanning every row lets align-self centre it on the row itself. */
.ucr-row-arrow-circle { grid-row: 1 / span 2; align-self: center; }
/*
* V2: .service-row.scroll-reveal must keep BOTH hover transitions
* (background/padding) AND the EX-018 reveal transitions
* (opacity/transform/filter). A hover-only transition shorthand
* with !important was cancelling the 0.8s fade-up, so service
* rows snapped in instead of animating on scroll.
*/
a.service-row,
.service-row {
transition: background 0.25s ease, padding 0.25s ease !important;
}
/* Combined hover + reveal - matches design-v2 .service-row.scroll-reveal */
a.service-row.scroll-reveal,
.service-row.scroll-reveal {
transition: background 0.25s ease, padding 0.25s ease, opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), filter 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
a.service-row:hover,
.service-row:hover,
body a.service-row:hover,
body .service-row:hover {
background: rgba(237, 241, 244, 0.04) !important;
/* V2 base is padding:28px 10px; hover only overrides padding-left → 24. */
padding-top: 28px !important;
padding-right: 10px !important;
padding-bottom: 28px !important;
padding-left: 24px !important;
}
a.service-row:hover .ucr-row-arrow-circle,
a.service-row:hover .row-arrow,
.service-row:hover .ucr-row-arrow-circle,
.service-row:hover .row-arrow {
background: #50949A !important;
border-color: #50949A !important;
}
a.service-row:hover .ucr-row-arrow-icon,
a.service-row:hover .ucr-row-arrow-icon svg,
a.service-row:hover .row-arrow svg,
.service-row:hover .ucr-row-arrow-icon,
.service-row:hover .ucr-row-arrow-icon svg,
.service-row:hover .row-arrow svg {
stroke: #081D42 !important;
color: #081D42 !important;
}
@media (prefers-reduced-motion: reduce) {
a.service-row,
.service-row,
a.service-row.scroll-reveal,
.service-row.scroll-reveal {
transition: none !important;
}
}
/*
* EX-062 - Home services hover-preview stage.
* The homepage services block was the only full-height section on the
* site carrying no imagery. V2 now pairs the list with a sticky photo
* stage that crossfades to the hovered/focused row.
*
* Native-first: the stage container and its six photos are real atomic
* Elementor elements on pages 205/206 (`hsv-preview-{ka,en}` +
* `hsv-shot-{lang}-1..6`), each carrying its own media-library image as
* a native `background` prop - so the photos stay editable data.
*
* This bridge carries only what Elementor cannot express:
* - the 992px breakpoint (not in the kit's breakpoint set),
* - grid placement of head/list/stage inside the existing wrap
* (no tree restructuring, so the R01 landmark set is unchanged),
* - sticky + aspect-ratio stage geometry,
* - the crossfade state pair driven by initializeServicePreview().
* Below 992px the stage is removed from layout entirely and the list
* renders exactly as before.
*/
.services .ucr-hsv-preview {
display: none;
}
@media (min-width: 992px) {
.services .ucr-layout-container-wide {
display: grid !important;
grid-template-columns: minmax(0, 1fr) 420px !important;
column-gap: 56px !important;
align-items: start !important;
}
.services .ucr-layout-container-wide > .sec-head {
grid-column: 1 / -1 !important;
}
.services .ucr-layout-container-wide > .service-list {
grid-column: 1 !important;
}
.services .ucr-hsv-preview {
display: block !important;
grid-column: 2 !important;
position: sticky !important;
top: 118px !important;
aspect-ratio: 5 / 8 !important;
border-radius: 6px !important;
overflow: hidden !important;
background-color: rgba(13, 29, 64, 0.35) !important;
border: 1px solid rgba(237, 241, 244, 0.14) !important;
}
/* Bottom scrim seats the photo into the dark section instead of
reading as a bright rectangle pasted on top of it. */
.services .ucr-hsv-preview::after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(13, 29, 64, 0) 45%, rgba(13, 29, 64, 0.5) 100%);
pointer-events: none;
z-index: 2;
}
.services .ucr-hsv-shot {
position: absolute !important;
inset: 0 !important;
background-size: cover !important;
background-position: center !important;
opacity: 0 !important;
transform: scale(1.06) !important;
transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.9s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.services .ucr-hsv-shot.is-active {
opacity: 1 !important;
transform: scale(1) !important;
}
}
@media (prefers-reduced-motion: reduce) {
.services .ucr-hsv-shot {
transition: none !important;
}
}
/*
* EX-063 - Photographic page-hero layer (About / Services / Experts).
* These three inner heroes carried the page title on the left and a
* flat colour field across the whole right half. V2 now puts a
* full-bleed photo behind the hero, revealed by a directional scrim:
* solid brand colour under the copy, dissolving to the right so the
* image runs off the viewport edge.
*
* Native-first: the photo itself is a real Elementor child element on
* each page, carrying a media-library image as a native background -
* legacy v3 `background_image` on About (207/208) and Experts
* (215/216), atomic v4 `background` prop on Services (209/210), since
* those routes are built on different Elementor generations. The
* layer is always the FIRST child, so `~ *` reliably lifts the real
* content above it without naming each page's inner container.
*
* This bridge carries only what Elementor cannot express: the
* absolute full-bleed placement of a child element, the multi-stop
* scrim (Elementor's gradient control is limited to two stops), and
* the 1024px cutoff. Below 1024px the copy already fills the width,
* so there is no dead space to solve and the layer is removed.
*/
.ucr-hero-photo {
position: absolute !important;
inset: 0 !important;
z-index: 0 !important;
margin: 0 !important;
padding: 0 !important;
min-height: 0 !important;
min-width: 0 !important;
width: auto !important;
height: auto !important;
pointer-events: none !important;
background-size: cover !important;
background-repeat: no-repeat !important;
}
/* Everything after the layer is real content - lift it above. */
.ucr-hero-photo ~ * {
position: relative;
z-index: 1;
}
.ucr-hero-photo::after {
content: '';
position: absolute;
inset: 0;
}
.ucr-hero-photo-dark::after {
background: linear-gradient(
90deg,
#0D1D40 0%,
#0D1D40 30%,
rgba(13, 29, 64, 0.82) 50%,
rgba(13, 29, 64, 0.38) 78%,
rgba(13, 29, 64, 0.24) 100%
);
}
/* The Experts hero is a short band; anchor its crop to the upper third
so faces stay in frame instead of the bottom of the scene. */
.ucr-hero-photo-light {
background-position: right 28% !important;
}
.ucr-hero-photo-light::after {
background: linear-gradient(
90deg,
#F3F4F1 0%,
#F3F4F1 40%,
rgba(243, 244, 241, 0.93) 58%,
rgba(243, 244, 241, 0.56) 84%,
rgba(243, 244, 241, 0.38) 100%
);
}
@media (max-width: 1024px) {
.ucr-hero-photo {
display: none !important;
}
}
/*
* EX-064 - Homepage featured-publications carousel.
* `hnw-featured-{lang}` is a native dynamic Loop Grid (ucr_insight,
* taxonomy-filtered to Publication, real posts, no hardcoded slides)
* rendering Loop Item template 374/375 once per post - Elementor owns
* the content/query entirely, native-first as usual on this project.
* This bridge supplies only what Elementor cannot express natively:
* - full-bleed breakout (the boxed section wraps every child in one
* shared 1168px inner regardless of the child's own width control;
* there is no per-child "escape the boxed wrapper" setting),
* - the crossfade slide-stack (a Loop Grid lays items out in a CSS
* grid; there is no native "show one, absolute-stack the rest"
* skin for it), and
* - the dot switcher, generated by JS to match however many real
* posts render (V2's mockup used a fixed 8; here the count is
* whatever the CMS actually has).
*/
/*
* Full-bleed breakout, scrollbar-safe.
*
* `100vw` is the viewport width INCLUDING the classic scrollbar
* gutter, while the visible content box is only
* `document.documentElement.clientWidth`. A plain `width:100vw`
* breakout therefore overhangs by exactly the scrollbar width and
* gives the whole document real horizontal overflow on any browser
* that renders classic (non-overlay) scrollbars.
*
* `--ucr-sbw` is published on by the runtime JS below
* (innerWidth - clientWidth, recomputed on resize) and defaults to
* 0px, so this degrades to the old behaviour if the JS never runs.
*
* NOTE for future QA: headless Chromium uses OVERLAY scrollbars,
* so it measures a 0px gutter and cannot reproduce this bug -
* `p5-home-featured-carousel-wp-qa.js` now asserts the corrected
* geometry against an injected non-zero --ucr-sbw as well.
*
* Bottom margin 72px matches design-v2's own `.featured-split`
* (`margin: 0 0 72px`) - without it the News section's heading
* butts straight up against the panel.
*/
.elementor-element-hnw-featured-ka,
.elementor-element-hnw-featured-en {
width: calc(100vw - var(--ucr-sbw, 0px)) !important;
max-width: calc(100vw - var(--ucr-sbw, 0px)) !important;
margin-left: calc(-50vw + 50% + (var(--ucr-sbw, 0px) / 2)) !important;
margin-right: calc(-50vw + 50% + (var(--ucr-sbw, 0px) / 2)) !important;
margin-bottom: 72px !important;
position: relative !important;
}
/* 2026-08-15 feedback: align the split-slide copy with the 1168px section heading. */
@media (min-width: 768px) and (max-width: 1023px) {
.elementor-element-hnw-featured-ka .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .elementor-element-f8c1003 {
padding-left: 24px !important;
}
}
@media (min-width: 1024px) {
.elementor-element-hnw-featured-ka .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .elementor-element-f8c1003 {
padding-left: max(56px, calc(((100vw - var(--ucr-sbw, 0px)) - 1168px) / 2)) !important;
}
}
.elementor-element-hnw-featured-ka .elementor-loop-container,
.elementor-element-hnw-featured-en .elementor-loop-container {
display: block !important;
position: relative !important;
background: #081D42 !important;
min-height: 680px !important;
}
.elementor-element-hnw-featured-ka .e-loop-item,
.elementor-element-hnw-featured-en .e-loop-item {
position: absolute !important;
inset: 0 !important;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
min-height: 680px !important;
transition: opacity 0.5s ease !important;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-active,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-active {
position: relative !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
}
/* No-JS/pre-init first paint: never leave the 680px publication stage blank. */
.elementor-element-hnw-featured-ka .elementor-loop-container:not(:has(> .e-loop-item.ucr-fs-active)) > .e-loop-item:first-of-type,
.elementor-element-hnw-featured-en .elementor-loop-container:not(:has(> .e-loop-item.ucr-fs-active)) > .e-loop-item:first-of-type {
position: relative !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-active.ucr-fs-entering,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-active.ucr-fs-entering {
z-index: 2;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-leaving,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-leaving {
z-index: 1;
visibility: visible !important;
pointer-events: none !important;
opacity: 0 !important;
transition: opacity 440ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
@keyframes ucr-fs-copy-in-forward {
from { opacity: 0; transform: translate3d(28px, 0, 0); }
to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes ucr-fs-copy-in-backward {
from { opacity: 0; transform: translate3d(-28px, 0, 0); }
to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes ucr-fs-copy-out-forward {
from { opacity: 1; transform: translate3d(0, 0, 0); }
to { opacity: 0; transform: translate3d(-16px, 0, 0); }
}
@keyframes ucr-fs-copy-out-backward {
from { opacity: 1; transform: translate3d(0, 0, 0); }
to { opacity: 0; transform: translate3d(16px, 0, 0); }
}
@keyframes ucr-fs-image-in {
from { opacity: 0.48; transform: scale(1.045); filter: saturate(0.9) brightness(0.88); }
to { opacity: 1; transform: scale(1); filter: saturate(1) brightness(1); }
}
@keyframes ucr-fs-image-out {
from { opacity: 1; transform: scale(1); filter: saturate(1) brightness(1); }
to { opacity: 0.36; transform: scale(1.025); filter: saturate(0.9) brightness(0.88); }
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-enter-forward .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-enter-forward .elementor-element-f8c1003 {
animation: ucr-fs-copy-in-forward 620ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-enter-backward .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-enter-backward .elementor-element-f8c1003 {
animation: ucr-fs-copy-in-backward 620ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-entering .elementor-element-f8c1002,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-entering .elementor-element-f8c1002 {
animation: ucr-fs-image-in 700ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-leaving-forward .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-leaving-forward .elementor-element-f8c1003 {
animation: ucr-fs-copy-out-forward 400ms cubic-bezier(0.4, 0, 1, 1) both;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-leaving-backward .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-leaving-backward .elementor-element-f8c1003 {
animation: ucr-fs-copy-out-backward 400ms cubic-bezier(0.4, 0, 1, 1) both;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-leaving .elementor-element-f8c1002,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-leaving .elementor-element-f8c1002 {
animation: ucr-fs-image-out 400ms cubic-bezier(0.4, 0, 1, 1) both;
}
/* The Loop Item's own flex wrapper (native , id f8c1001) sizes
itself to its content (429px) instead of filling the 680px slide,
since it has no height set of its own - align-items:stretch on it
only stretches ITS children to ITS OWN height, not to the
ancestor's. Without this the photo/content columns stop short and
the dot row sits inside a dead navy gap below them. */
.elementor-element-hnw-featured-ka .e-loop-item > a,
.elementor-element-hnw-featured-en .e-loop-item > a {
height: 100% !important;
min-height: 680px !important;
}
/*
* EX-064 amendment (2026-08-12, mobile visual audit - user-directed,
* WP-only: V2's own responsive behaviour is explicitly NOT the reference
* here). Below the split breakpoint the two columns stack, so the slide
* needs text-height + image-height, but `min-height:680px` above is a
* fixed desktop figure. Measured at 390px: the text column ranged
* 377→487px across slides (excerpt 112→196px, i.e. 4→7 lines) while the
* image column is a constant 240px - so the longest slides needed 727px
* inside a 680px box and their text collided with the photo/controls.
* Two coordinated fixes: clamp the excerpt so every slide carries the
* same maximum text block (a carousel must not jump height between
* slides), and let the slide grow if a title still needs the room.
*/
@media (max-width: 767px) {
.elementor-element-hnw-featured-ka .elementor-element-f8excerpt .elementor-heading-title,
.elementor-element-hnw-featured-en .elementor-element-f8excerpt .elementor-heading-title,
.elementor-element-hnw-featured-ka .elementor-element-f8excerpt p,
.elementor-element-hnw-featured-en .elementor-element-f8excerpt p {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 4 !important;
overflow: hidden !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8title .elementor-heading-title,
.elementor-element-hnw-featured-en .elementor-element-f8title .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
overflow: hidden !important;
}
.elementor-element-hnw-featured-ka .e-loop-item > a,
.elementor-element-hnw-featured-en .e-loop-item > a {
height: auto !important;
min-height: 680px !important;
}
}
/*
* EX-064 amendment (2026-08-12, user-reported): on phones the per-slide
* bar row is unreadable - 10 real publications share a ~250px track, so
* each bar is ~20px of 4px-tall, low-contrast rule sitting over a photo
* edge. User asked to drop it and keep only the arrows; arrows alone
* would lose all position/length context, so the row is replaced by a
* compact "02 / 10" counter beside them instead of simply removed.
* Phones only - from 768px up the bars are ~57px wide and read fine.
*/
@media (max-width: 767px) {
.ucr-fs-dots {
display: none !important;
}
/* Scoped through the parent so it outranks the base
`.ucr-fs-counter{display:none}` regardless of source order. */
.ucr-fs-arrows .ucr-fs-counter {
display: inline-block;
margin-right: 4px;
color: #FFFFFF;
font-family: "Montserrat", sans-serif;
font-size: 12px;
font-weight: 600;
letter-spacing: 0.08em;
font-variant-numeric: tabular-nums;
white-space: nowrap;
text-shadow: 0 1px 6px rgba(8, 20, 42, 0.55);
}
}
/*
* EX-064 amendment (2026-08-13, user-directed mobile refinement).
* Phones use deliberate copy, media and control-rail bands instead
* of controls straddling a photo edge and a desktop-height remainder.
*/
@media (max-width: 767px) {
.elementor-element-hnw-featured-ka,
.elementor-element-hnw-featured-en {
margin-bottom: 56px !important;
}
.elementor-element-hnw-featured-ka .elementor-loop-container,
.elementor-element-hnw-featured-en .elementor-loop-container,
.elementor-element-hnw-featured-ka .e-loop-item,
.elementor-element-hnw-featured-en .e-loop-item {
min-height: 0 !important;
}
.elementor-element-hnw-featured-ka .e-loop-item > a,
.elementor-element-hnw-featured-en .e-loop-item > a {
height: auto !important;
min-height: 0 !important;
padding-bottom: 64px !important;
background: #081D42 !important;
box-sizing: border-box !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .elementor-element-f8c1003 {
height: 368px !important;
min-height: 368px !important;
flex: 0 0 368px !important;
flex-wrap: nowrap !important;
padding: 28px 24px !important;
justify-content: center !important;
box-sizing: border-box !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8kicker,
.elementor-element-hnw-featured-en .elementor-element-f8kicker {
margin-bottom: 12px !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8meta,
.elementor-element-hnw-featured-en .elementor-element-f8meta {
margin-bottom: 10px !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8title,
.elementor-element-hnw-featured-en .elementor-element-f8title {
margin-bottom: 12px !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8title .elementor-heading-title,
.elementor-element-hnw-featured-en .elementor-element-f8title .elementor-heading-title {
font-size: clamp(20px, 5.4vw, 22px) !important;
line-height: 1.3 !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8excerpt,
.elementor-element-hnw-featured-en .elementor-element-f8excerpt {
margin-bottom: 20px !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8excerpt .elementor-heading-title,
.elementor-element-hnw-featured-en .elementor-element-f8excerpt .elementor-heading-title,
.elementor-element-hnw-featured-ka .elementor-element-f8excerpt p,
.elementor-element-hnw-featured-en .elementor-element-f8excerpt p {
-webkit-line-clamp: 3 !important;
font-size: 15.5px !important;
line-height: 1.65 !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8button-wrap,
.elementor-element-hnw-featured-en .elementor-element-f8button-wrap {
justify-content: flex-start !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8button,
.elementor-element-hnw-featured-en .elementor-element-f8button {
min-height: 44px !important;
padding: 11px 18px !important;
box-sizing: border-box !important;
}
.elementor-element-hnw-featured-ka .elementor-element-f8c1002,
.elementor-element-hnw-featured-en .elementor-element-f8c1002 {
height: clamp(240px, 64vw, 265px) !important;
min-height: 0 !important;
flex: 0 0 clamp(240px, 64vw, 265px) !important;
}
/* A two-line KA sector label needs 24px more than the standard
* phone copy band. Without this reserve Elementor wraps the CTA
* into an off-canvas second flex column at 360px. */
@media (max-width: 374px) {
.elementor-element-hnw-featured-ka .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .elementor-element-f8c1003 {
height: 392px !important;
min-height: 392px !important;
flex-basis: 392px !important;
}
}
.elementor-element-hnw-featured-ka .ucr-fs-arrows,
.elementor-element-hnw-featured-en .ucr-fs-arrows {
left: 24px;
right: 24px;
bottom: 10px;
height: 44px;
gap: 8px;
}
.elementor-element-hnw-featured-ka .ucr-fs-arrows .ucr-fs-counter,
.elementor-element-hnw-featured-en .ucr-fs-arrows .ucr-fs-counter {
margin-right: auto;
color: #9DAAB8;
font-size: 11px;
letter-spacing: 0.12em;
text-shadow: none;
}
.elementor-element-hnw-featured-ka .ucr-fs-arrow,
.elementor-element-hnw-featured-en .ucr-fs-arrow {
width: 44px;
height: 44px;
-webkit-backdrop-filter: none;
backdrop-filter: none;
transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 180ms ease, color 180ms ease, background-color 180ms ease;
}
.elementor-element-hnw-featured-ka .ucr-fs-arrow-prev,
.elementor-element-hnw-featured-en .ucr-fs-arrow-prev {
background: transparent;
border-color: rgba(237, 241, 244, 0.32);
}
.elementor-element-hnw-featured-ka .ucr-fs-arrow-next,
.elementor-element-hnw-featured-en .ucr-fs-arrow-next {
background: #50949A;
border-color: #50949A;
color: #FFFFFF;
}
.elementor-element-hnw-featured-ka .ucr-fs-arrow svg,
.elementor-element-hnw-featured-en .ucr-fs-arrow svg {
width: 17px;
height: 17px;
}
.elementor-element-hnw-featured-ka .ucr-fs-arrow:active,
.elementor-element-hnw-featured-en .ucr-fs-arrow:active {
transform: scale(0.94);
}
}
@media (prefers-reduced-motion: reduce) {
.elementor-element-hnw-featured-ka .e-loop-item,
.elementor-element-hnw-featured-en .e-loop-item {
transition: none !important;
}
.elementor-element-hnw-featured-ka .ucr-fs-arrow,
.elementor-element-hnw-featured-en .ucr-fs-arrow {
transition: none !important;
}
}
/* Capsule-bar dot switcher - same device as the homepage's own
Projects pagination (.projects-page-bar): transparent hit-area +
`::before` core, outer stretches on hover, core widens on active. */
.ucr-fs-dots {
position: absolute;
left: max(56px, calc((100% - 1168px) / 2));
bottom: 28px;
z-index: 3;
display: flex;
gap: 8px;
}
.ucr-fs-dot {
position: relative;
width: 42px;
height: 5px;
padding: 19.5px 4px;
margin-block: -8px;
border-radius: 2.5px;
background: transparent;
background-clip: content-box;
border: none;
cursor: pointer;
box-sizing: content-box;
transition: transform 0.16s cubic-bezier(0.22, 1, 0.36, 1);
flex-shrink: 0;
}
.ucr-fs-dot::before {
content: '';
display: block;
width: 100%;
height: 100%;
border-radius: 2.5px;
background: rgba(255, 255, 255, 0.32);
transform: scaleX(1);
transition: background-color 0.26s ease, transform 0.26s ease;
}
.ucr-fs-dot::after {
content: '';
position: absolute;
inset: 19.5px 4px;
border-radius: 2.5px;
background: #50949A;
transform: scaleX(0.18);
transform-origin: left center;
opacity: 0;
pointer-events: none;
}
.ucr-fs-dot:not(.is-active):hover {
transform: scaleY(1.35);
}
.ucr-fs-dot.is-active {
transform: none;
background: transparent;
box-shadow: none;
}
.ucr-fs-dot:hover::before {
background: rgba(255, 255, 255, 0.55);
}
.ucr-fs-dot.is-active::before {
background: rgba(80, 148, 154, 0.38);
transform: scaleX(1);
}
@keyframes ucr-fs-progress {
from { transform: scaleX(0.18); }
to { transform: scaleX(1); }
}
:is(.elementor-element-hnw-featured-ka, .elementor-element-hnw-featured-en).ucr-fs-timing .ucr-fs-dot.is-active::after {
opacity: 1;
animation: ucr-fs-progress 7000ms linear both;
}
:is(.elementor-element-hnw-featured-ka, .elementor-element-hnw-featured-en).ucr-fs-paused .ucr-fs-dot.is-active::after {
animation-play-state: paused;
}
.ucr-fs-dot:focus-visible {
outline: none;
box-shadow: none;
}
.ucr-fs-dot:focus-visible::before {
box-shadow: 0 4px 0 #50949A;
}
@keyframes ucr-fs-indicator-in {
0% {
opacity: 0;
transform: translateY(10px) scaleX(0.72);
}
62% {
opacity: 1;
transform: translateY(-1px) scaleX(1.04);
}
100% {
opacity: 1;
transform: translateY(0) scaleX(1);
}
}
.ucr-fs-dots.is-revealing .ucr-fs-dot {
animation: ucr-fs-indicator-in 680ms cubic-bezier(0.16, 1, 0.3, 1) var(--ucr-fs-dot-delay, 0ms) both;
}
@media (prefers-reduced-motion: reduce) {
:is(.elementor-element-hnw-featured-ka, .elementor-element-hnw-featured-en).ucr-fs-timing .ucr-fs-dot.is-active::after {
opacity: 0;
animation: none !important;
}
.ucr-fs-dots.is-revealing .ucr-fs-dot {
animation: none !important;
}
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-entering .elementor-element-f8c1003,
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-entering .elementor-element-f8c1002,
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-leaving .elementor-element-f8c1003,
.elementor-element-hnw-featured-ka .e-loop-item.ucr-fs-leaving .elementor-element-f8c1002,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-entering .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-entering .elementor-element-f8c1002,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-leaving .elementor-element-f8c1003,
.elementor-element-hnw-featured-en .e-loop-item.ucr-fs-leaving .elementor-element-f8c1002 {
animation: none !important;
}
}
/*
* Prev/next arrows - mirrors design-v2's `.featured-split-arrows`.
* Geometry/chrome copied from V2's own `.arrow-btn` (44px circle,
* 18px stroke icon, 12px gap, bottom-right opposite the dots).
*
* The translucent navy backing is NOT decoration: V2 measurement
* across all slides put a bare transparent arrow at 1.84-2.31
* contrast over the bright photos (below the 3.0 UI-control
* minimum), because unlike the News hero these slides carry no
* scrim. With the backing the worst case is 4.92.
*/
.ucr-fs-arrows {
position: absolute;
right: max(56px, calc((100% - 1168px) / 2));
bottom: 28px;
z-index: 3;
display: flex;
align-items: center;
gap: 12px;
}
/* Counter is the phone-only stand-in for the bar row (see the ≤767px
block below); the bars remain the control from 768px up. */
.ucr-fs-counter {
display: none;
}
.ucr-fs-arrow {
width: 44px;
height: 44px;
padding: 0;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.38);
background: rgba(8, 29, 66, 0.55);
-webkit-backdrop-filter: blur(10px) saturate(140%);
backdrop-filter: blur(10px) saturate(140%);
color: #ffffff;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: border-color 0.25s ease, color 0.25s ease, background-color 0.25s ease;
}
.ucr-fs-arrow svg {
width: 18px;
height: 18px;
stroke: currentColor;
fill: none;
stroke-width: 2.5;
}
.ucr-fs-arrow:hover {
background: rgba(8, 29, 66, 0.78);
border-color: #50949A;
color: #50949A;
}
.ucr-fs-arrow:focus-visible {
outline: 3px solid #50949A;
outline-offset: 3px;
}
@media (max-width: 992px) {
.ucr-fs-dots {
left: 24px;
bottom: 20px;
gap: 6px;
/* Reserve the arrows' corner (24px inset + 96px of buttons
+ 16px clearance) so the two controls can never collide.
This matters more here than in V2: the mockup has a fixed
8 slides, while this row renders one bar per REAL
publication (10 today, more as the CMS grows).
EX-064 amendment (2026-08-12, mobile visual audit): this row
used to `flex-wrap: wrap` to survive that growth, but with 10
real publications at 390px the 10 fixed-width bars (26px + 6px
gap = 320px) overflowed the 250px track and broke onto a second
line that overlapped the photo edge - reading as a rendering
fault rather than a control. The bars are now proportional
instead of fixed-width, so any number of publications always
resolves to exactly one row. */
/* A definite width is required, not just max-width: the row is
absolutely positioned, so it shrink-wraps to content and
`flex:1 1 0` bars would collapse to their minimum (~6px)
instead of sharing the available track. */
width: calc(100% - 160px);
max-width: calc(100% - 160px);
flex-wrap: nowrap;
}
.ucr-fs-dot {
flex: 1 1 0;
min-width: 0;
width: auto;
flex-shrink: 1;
height: 4px;
padding: 20px 3px;
margin-block: -10px;
border-radius: 2px;
}
.ucr-fs-dot::before,
.ucr-fs-dot::after {
border-radius: 2px;
}
.ucr-fs-dot::after {
inset: 20px 3px;
}
/* Reserve 160px for two true 44px touch targets. Phones hide
the dots and use the dedicated control rail above. */
.ucr-fs-arrows {
right: 24px;
bottom: 20px;
gap: 8px;
}
.ucr-fs-arrow {
width: 44px;
height: 44px;
}
.ucr-fs-arrow svg {
width: 17px;
height: 17px;
}
}
/*
* Brand watermark depth - port of design-v2's `footer::before`
* (proposal item #4, built and gated in V2 first).
*
* Scope: FOOTER ONLY. It was briefly also on the Home stats band;
* the user asked for the footer alone ("footer ზე მინდა მხოლოდ რო
* ეწეროს ეგ წარწერა ზედა სექციებზე არ გვინდა"), so the stats
* section keeps its original flat fill - no watermark, no clip,
* no stacking context.
*
* Why this needs custom code: Elementor has no authoring path for
* a decorative pseudo-element behind a section's content. The
* nearest native option is a real child element, which would enter
* the accessibility tree as readable text and still need CSS for
* the absolute bleed and the clip.
*
* Alpha 0.012 is copied verbatim from design-v2 and is measured:
* the footer's tightest element (teal column headings, 4.95:1
* clean) lands at 4.80 over the mark.
*
* `content: "…" / ""` supplies empty alt text so assistive tech
* skips the mark rather than announcing it.
*/
footer.elementor-location-footer > .e-con:first-child {
position: relative;
overflow: hidden;
}
footer.elementor-location-footer > .e-con:first-child > .e-con {
position: relative;
z-index: 1;
}
footer.elementor-location-footer > .e-con:first-child::before {
content: "UPCOMRISE" / "";
position: absolute;
z-index: 0;
left: 50%;
/*
* WP-only detail with no V2 equivalent: Elementor's own base
* `.e-con::before` rule (custom-frontend.min.css) pins this
* pseudo-element to `top:0`, `left:calc(0 - border)`, and -
* the one that actually broke centering - a forced
* `width: max(100% + borders, 100%)`. None of those carry
* `!important`, so this selector's higher specificity wins for
* every property WE declare - but `width` was never one of
* them, so Elementor's 100%-wide rule applied uncontested.
* With width pinned to the full 1440px footer instead of
* shrink-to-fit on the text, `translateX(-50%)` shifted the
* mark by half of 1440px, not half of its own real width -
* visibly left of centre (user screenshot, 2026-08-07: "ეს
* წარწერა ცენტრში უნდა იყოს"). `width: auto !important`
* restores shrink-to-fit sizing so the translateX actually
* centres the rendered text. The rest were already correctly
* overridden and stay `!important` for the same reason.
*/
width: auto !important;
top: auto !important;
right: auto !important;
height: auto !important;
bottom: -0.22em !important;
transform: translateX(-50%);
font-family: 'Montserrat', sans-serif;
font-weight: 800;
font-size: clamp(120px, 17vw, 240px);
line-height: 1;
white-space: nowrap;
letter-spacing: 0.06em;
color: rgba(255, 255, 255, 0.012);
pointer-events: none;
user-select: none;
}
@media (max-width: 768px) {
footer.elementor-location-footer > .e-con:first-child::before {
display: none;
}
}
/*
* Proposal item #5: hero slow zoom - WP port of design-v2's
* `.slide-bg-clip`/`.slide-bg` device (built and gated in V2 first).
*
* Both hero roots (h13root/nhero-root) hold their photo as a native
* background AND the glass card as a normal-flow child in the SAME
* element - there's no separate photo layer to scale independently,
* and the two roots need OPPOSITE overflow behaviour at once (News
* must let its card hang 80px past the root via EX-040's own
* `overflow: visible !important`; the zoomed photo must NOT). Same
* conflict already solved once in V2 with a dedicated clip layer -
* ported here as a real native child rather than reinvented in CSS:
* `h13zoom`/`nherozoom` were inserted as each root's FIRST child
* (`css_classes: ucr-hero-zoom-bg`), carrying every background_*
* setting (including the dynamic `post-featured-image` tag and the
* gradient scrim) moved off the root. The scrim moves with the
* photo intentionally - matching V2, where both live in one
* `background` shorthand on the same scaling element.
*
* The glass card stays a normal sibling, so it is completely
* unaffected and keeps its existing EX-040 overflow behaviour.
*/
.ucr-hero-zoom-bg {
position: absolute !important;
inset: 0 !important;
overflow: hidden !important;
z-index: 0 !important;
width: auto !important;
min-height: 0 !important;
}
.ucr-hero-zoom-bg ~ * {
position: relative !important;
z-index: 1 !important;
}
/* Values copied verbatim from design-v2's `@keyframes hero-slow-zoom`. */
@keyframes hero-slow-zoom {
from { transform: scale(1); }
to { transform: scale(1.08); }
}
/*
* Base rule is generic on `.ucr-hero-zoom-bg` (a class invented
* solely for these two hero photo layers, not reused elsewhere),
* not scoped per-carousel - an earlier version scoped the full
* `animation:` shorthand to Home's selector only and gave News just
* an `animation-duration` override with no base rule to attach to,
* so News never actually got an animation-name and never animated
* at all (caught by direct measurement: transform stayed `none` at
* both 200ms and 1600ms). Duration matches each carousel's OWN
* native `autoplay_speed` (checked directly in Elementor's
* settings, not assumed to match V2's numbers - they happen to,
* exactly: Home 8000ms; News is intentionally overridden to 6000ms
* for readable automatic dwell). `.swiper-slide-duplicate-
* active` is included because Swiper's loop mode clones slides and
* can present a duplicate as the active one; this codebase already
* carries that same dual-selector pattern for the News card
* entrance animation (`news-card-in`, mobile block).
*/
.swiper-slide-active .ucr-hero-zoom-bg,
.swiper-slide-duplicate-active .ucr-hero-zoom-bg {
animation: hero-slow-zoom 8s ease-out forwards;
}
.elementor-widget-loop-carousel.elementor-element-ucr-news-hero-ka .swiper-slide-active .ucr-hero-zoom-bg,
.elementor-widget-loop-carousel.elementor-element-ucr-news-hero-en .swiper-slide-active .ucr-hero-zoom-bg,
.elementor-widget-loop-carousel.elementor-element-ucr-news-hero-ka .swiper-slide-duplicate-active .ucr-hero-zoom-bg,
.elementor-widget-loop-carousel.elementor-element-ucr-news-hero-en .swiper-slide-duplicate-active .ucr-hero-zoom-bg {
animation-duration: 6s;
}
@media (prefers-reduced-motion: reduce) {
.ucr-hero-zoom-bg {
animation: none !important;
transform: scale(1) !important;
}
}
/*
* Global Loop Grid / archive pagination - Elementor/Hello default
* uses a pink link color (#CC3366) that never appears in design-v2.
* V2 pagination is navy/teal brand chrome.
*/
.elementor-pagination .page-numbers {
color: #0D1D40 !important;
font-family: 'Montserrat', 'FiraGO', sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
text-decoration: none !important;
}
.elementor-pagination .page-numbers.current {
color: #50949A !important;
font-weight: 700 !important;
}
.elementor-pagination .page-numbers:hover {
color: #50949A !important;
}
.elementor-pagination .page-numbers.prev,
.elementor-pagination .page-numbers.next {
color: #0D1D40 !important;
}
.elementor-pagination .page-numbers.prev:hover,
.elementor-pagination .page-numbers.next:hover {
color: #50949A !important;
}
/* EX-020: Home Partners marquee auto-scroll. Elementor's atomic style
schema has no `animation`/`animation-name` property and no
`mask-image` property (confirmed via novamira/elementor-get-style-
schema - both land in unknown_properties), so the infinite
translateX loop and the edge fade cannot be authored natively.
Values copied verbatim from design-v2/assets/style.css. */
/*
* V2 .partners-banner-inner: display:flex; align-items:center; gap:50px
* and .partners-marquee { flex:1 }. Elementor atomic flex row defaulted
* gap:0 + marquee flex-grow:0, so the marquee sat flush against the
* title (~48px too wide / too far left).
*/
.elementor-element-hpt-inner-ka,
.elementor-element-hpt-inner-en,
[data-id="hpt-inner-ka"],
[data-id="hpt-inner-en"] {
display: flex !important;
align-items: center !important;
gap: 50px !important;
flex-wrap: wrap !important;
}
.partners-title,
.elementor-element-hpt-title-ka,
.elementor-element-hpt-title-en,
[data-id="hpt-title-ka"],
[data-id="hpt-title-en"] {
flex: 0 0 auto !important;
white-space: nowrap !important;
}
.partners-marquee,
.elementor-element-hpt-marquee-ka,
.elementor-element-hpt-marquee-en,
[data-id="hpt-marquee-ka"],
[data-id="hpt-marquee-en"] {
overflow: hidden;
flex: 1 1 0% !important;
min-width: 0 !important;
-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.partners-track {
width: max-content;
display: flex !important;
align-items: center !important;
/* Static row: each logo shown once (user decision 2026-08-06).
No marquee loop - with only 3-4 unique logos a seamless
translateX(-50%) loop would need duplicated content. */
animation: none !important;
}
.partners-marquee:hover .partners-track,
.elementor-element-hpt-marquee-ka:hover .partners-track,
.elementor-element-hpt-marquee-en:hover .partners-track {
animation-play-state: paused;
}
@keyframes ucr-partners-scroll {
to {
transform: translateX(-50%);
}
}
@media (prefers-reduced-motion: reduce) {
.partners-track {
animation: none !important;
}
}
/* EX-021: Home Hero Slider content-kind-conditional CTA label and
date/period display. The shared Hero Slide Loop Item (384 KA /
385 EN) spans two real, differently-shaped content kinds - real
`ucr_project_type:project/proeqti` records (source shows a real
period string, e.g. "2025" or "2019-2022", and a "Details" CTA)
vs everything else: opportunity-subtype projects and ucr_insight
records (source shows a real specific post date and a "Read
more" CTA). WordPress's own native post_class() already prints
the real term slug on the Loop Carousel item wrapper - no PHP
filter needed, just a toggle keyed off that native class. */
.ucr-hero-cta-details,
.ucr-hero-date-period {
display: none;
}
.e-loop-item.ucr_project_type-proeqti .ucr-hero-cta-details,
.e-loop-item.ucr_project_type-project .ucr-hero-cta-details,
.e-loop-item.ucr_project_type-proeqti .ucr-hero-date-period,
.e-loop-item.ucr_project_type-project .ucr-hero-date-period {
display: inline-flex;
}
.e-loop-item.ucr_project_type-proeqti .ucr-hero-cta-readmore,
.e-loop-item.ucr_project_type-project .ucr-hero-cta-readmore,
.e-loop-item.ucr_project_type-proeqti .ucr-hero-date-default,
.e-loop-item.ucr_project_type-project .ucr-hero-date-default {
display: none;
}
/*
* EX-029/EX-035: theme page-title is removed from DOM via
* hello_elementor_page_title filter. Keep a CSS belt for any residual
* .page-header (plugins/cache) so chrome titles never paint under the
* fixed site header again. Accessible name: Elementor H1 or .ucr-sr-only.
*/
.page-header,
.page-header .entry-title,
main .page-header,
.site-main > .page-header {
display: none !important;
}
.ucr-sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
clip-path: inset(50%) !important;
white-space: nowrap !important;
border: 0 !important;
}
body.home .elementor-element-home-hero-carousel-ka,
body.home .elementor-element-home-hero-carousel-en {
--ucr-home-hero-inline: max(56px, calc((100vw - 1280px) / 2 + 56px));
position: relative;
/* V2 .news-slider height 600 - extra widget chrome was 616px and
left a transparent strip (white body) between hero and stats. */
height: 600px !important;
min-height: 600px !important;
max-height: 600px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
body.home .elementor-element-home-hero-carousel-ka .swiper,
body.home .elementor-element-home-hero-carousel-en .swiper,
body.home .elementor-element-home-hero-carousel-ka .swiper-wrapper,
body.home .elementor-element-home-hero-carousel-en .swiper-wrapper,
body.home .elementor-element-home-hero-carousel-ka .swiper-slide,
body.home .elementor-element-home-hero-carousel-en .swiper-slide {
height: 600px !important;
max-height: 600px !important;
}
/* Flush stats band to hero (V2: gap 0). Keep V2 pad 50px 0. */
body.home [data-id="home-stats-section-ka"],
body.home [data-id="home-stats-section-en"],
body.home .elementor-element-home-stats-section-ka,
body.home .elementor-element-home-stats-section-en {
margin-top: 0 !important;
padding: 50px 0 !important;
}
@media (max-width: 1024px) {
body.home .elementor-element-home-hero-carousel-ka,
body.home .elementor-element-home-hero-carousel-en,
body.home .elementor-element-home-hero-carousel-ka .swiper,
body.home .elementor-element-home-hero-carousel-en .swiper,
body.home .elementor-element-home-hero-carousel-ka .swiper-wrapper,
body.home .elementor-element-home-hero-carousel-en .swiper-wrapper,
body.home .elementor-element-home-hero-carousel-ka .swiper-slide,
body.home .elementor-element-home-hero-carousel-en .swiper-slide {
height: 580px !important;
min-height: 580px !important;
max-height: 580px !important;
}
}
@media (max-width: 768px) {
body.home .elementor-element-home-hero-carousel-ka,
body.home .elementor-element-home-hero-carousel-en,
body.home .elementor-element-home-hero-carousel-ka .swiper,
body.home .elementor-element-home-hero-carousel-en .swiper,
body.home .elementor-element-home-hero-carousel-ka .swiper-wrapper,
body.home .elementor-element-home-hero-carousel-en .swiper-wrapper,
body.home .elementor-element-home-hero-carousel-ka .swiper-slide,
body.home .elementor-element-home-hero-carousel-en .swiper-slide {
height: 480px !important;
min-height: 480px !important;
max-height: 480px !important;
}
body.home [data-id="home-stats-section-ka"],
body.home [data-id="home-stats-section-en"],
body.home .elementor-element-home-stats-section-ka,
body.home .elementor-element-home-stats-section-en {
padding: 40px 0 !important;
}
}
/*
* V2 .sec-link - "ყველა სიახლე →" / "ყველა სერვისი →"
* nowrap + bottom border + 13.5/600; WP heading-link was wrapping
* and missing the underline.
*/
body.home [data-id="hnw-link-ka"] a,
body.home [data-id="hnw-link-en"] a,
body.home [data-id="hsv-link-ka"] a,
body.home [data-id="hsv-link-en"] a,
body.home .s-hnw-link-ka a,
body.home .s-hnw-link-en a,
body.home a.e-heading-link-base {
display: inline-block !important;
white-space: nowrap !important;
font-size: 13.5px !important;
font-weight: 600 !important;
letter-spacing: 0.06em !important;
line-height: 1.3 !important;
color: #50949A !important;
border-bottom: 1px solid currentColor !important;
padding-bottom: 6px !important;
text-decoration: none !important;
max-width: none !important;
}
body.home [data-id="hnw-link-ka"],
body.home [data-id="hnw-link-en"],
body.home [data-id="hsv-link-ka"],
body.home [data-id="hsv-link-en"] {
white-space: nowrap !important;
max-width: max-content !important;
}
/*
* The old light single-card `.featured-insight-card` chrome (white
* bg, 1.2fr/1fr split, border/shadow) that used to live here was
* superseded by EX-064's dark full-bleed carousel (see below) - it
* was fighting the new native template styling with !important,
* repainting the panel white. Removed rather than layered over.
* f8c1001/f8c1002/f8c1003 sizing/colour now come from Elementor's
* own generated CSS (native settings on templates 374/375), and the
* full-bleed + slide-stack + dots behaviour comes from the EX-064
* block further down.
*/
/*
* V2 Home hero has BOTH:
* 1) .card-dots bottom-left (8px / active scale 1.3 accent)
* 2) 3px .slider-progress-track at the very bottom (8s fill)
* Elementor Loop Carousel allows only one pagination mode - we use
* bullets for the dots and inject .ucr-home-hero-progress for the bar.
*/
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullets,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullets {
position: absolute !important;
top: auto !important;
bottom: 44px !important;
left: var(--ucr-home-hero-inline) !important;
right: auto !important;
width: auto !important;
height: auto !important;
transform: none !important;
display: flex !important;
align-items: center !important;
gap: 10px !important;
z-index: 12 !important;
padding: 0 !important;
margin: 0 !important;
}
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullet,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullet {
width: 8px !important;
height: 8px !important;
margin: 0 !important;
border-radius: 50% !important;
background: rgba(255, 255, 255, 0.35) !important;
opacity: 1 !important;
transition: background 0.25s ease, transform 0.25s ease !important;
}
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullet:hover,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullet:hover {
background: rgba(255, 255, 255, 0.6) !important;
}
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullet-active,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullet-active {
background: #50949A !important;
transform: scale(1.3) !important;
}
/* V2 .card-dots mobile: left 24px (wrap gutter), not desktop 56px formula. */
@media (max-width: 768px) {
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullets,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullets {
left: 24px !important;
bottom: 28px !important;
}
}
/*
* EX-021 amendment (2026-08-12, user-reported mobile visual pass -
* WP-only; V2's responsive is explicitly not the reference).
* Three measured defects on the Home hero at 390px, all consequences of
* a 480px slide having to hold copy sized for a 640px desktop stage:
* 1. The dot row (518→544) overlapped the CTA button (479→532), so the
* first dot sat underneath the button.
* 2. The excerpt ran ~6 lines / 153px, which is what pushed the CTA
* down into the dots in the first place.
* 3. Elementor's overlay starts at only 0.2 alpha at the top, so title
* and body text washed out over bright photos (e.g. an open-sky or
* pale-chart featured image).
* Clamping the excerpt frees the vertical room that removes the overlap
* at its source rather than nudging the dots into the slide edge, and a
* stronger scrim makes the type legible over any image the CMS supplies.
* Desktop keeps its existing composition untouched.
*/
@media (max-width: 767px) {
body.home .elementor-element-home-hero-carousel-ka [data-id="h13excerpt"] .elementor-heading-title,
body.home .elementor-element-home-hero-carousel-en [data-id="h13excerpt"] .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
overflow: hidden !important;
}
body.home .elementor-element-home-hero-carousel-ka [data-id="h13title"] .elementor-heading-title,
body.home .elementor-element-home-hero-carousel-en [data-id="h13title"] .elementor-heading-title {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
overflow: hidden !important;
}
body.home .elementor-element-home-hero-carousel-ka .ucr-hero-zoom-bg::before,
body.home .elementor-element-home-hero-carousel-en .ucr-hero-zoom-bg::before {
background: linear-gradient(
180deg,
rgba(13, 29, 64, 0.62) 0%,
rgba(13, 29, 64, 0.72) 45%,
rgba(13, 29, 64, 0.94) 100%
) !important;
}
/* Larger, higher-contrast targets: the 6px teal-on-photo dots were
both hard to see and under the 44px touch guidance. */
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullet,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullet {
width: 8px !important;
height: 8px !important;
background: rgba(255, 255, 255, 0.45) !important;
opacity: 1 !important;
}
/* Active state is carried by colour + the existing scale(1.3) only.
A glow ring was tried here first and removed: it read as the very
"ring" artefact the user objected to rather than as a state. */
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-bullet-active,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-bullet-active {
background: #50949A !important;
}
}
/* V2 .slider-progress-track / .slider-progress-bar (custom inject) */
body.home .elementor-element-home-hero-carousel-ka .ucr-home-hero-progress,
body.home .elementor-element-home-hero-carousel-en .ucr-home-hero-progress {
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 10;
width: 100%;
height: 3px;
margin: 0;
background: rgba(237, 241, 244, 0.1);
pointer-events: none;
overflow: hidden;
}
body.home .elementor-element-home-hero-carousel-ka .ucr-home-hero-progress > i,
body.home .elementor-element-home-hero-carousel-en .ucr-home-hero-progress > i {
display: block;
height: 100%;
width: 0%;
/* V2: from --teal (#0D1D40) → --accent (#50949A) */
background: #0D1D40;
animation: ucr-home-hero-fill 5s linear forwards;
}
@keyframes ucr-home-hero-fill {
from {
width: 0%;
background-color: #0D1D40;
}
to {
width: 100%;
background-color: #50949A;
}
}
@media (prefers-reduced-motion: reduce) {
body.home .elementor-element-home-hero-carousel-ka .ucr-home-hero-progress > i,
body.home .elementor-element-home-hero-carousel-en .ucr-home-hero-progress > i {
animation: none !important;
width: 100% !important;
background-color: #50949A !important;
}
}
/* legacy progressbar mode (if re-enabled) */
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-progressbar,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-progressbar {
position: absolute;
top: auto;
bottom: 0;
left: 0;
right: 0;
z-index: 10;
width: 100%;
height: 3px;
margin: 0;
background: rgba(237, 241, 244, 0.1);
}
body.home .elementor-element-home-hero-carousel-ka .swiper-pagination-progressbar-fill,
body.home .elementor-element-home-hero-carousel-en .swiper-pagination-progressbar-fill {
background: #50949A;
}
/*
* V2 .arrow-btn - 44 circle, 1px rgba(255,255,255,.25), transparent fill,
* stroke arrows 18px, gap 12, bottom 40 / right 56. Elementor Loop Carousel
* nav ships filled chevrons + widget hover that drops the border and sets
* color to rgba(238,238,238,.9) (messy vs design-v2). Force chrome + hover.
*/
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button {
top: auto !important;
bottom: 40px !important;
width: 44px !important;
height: 44px !important;
min-width: 44px !important;
min-height: 44px !important;
max-width: 44px !important;
max-height: 44px !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
color: #ffffff !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: 1px solid rgba(255, 255, 255, 0.25) !important;
border-radius: 50% !important;
box-shadow: none !important;
font-size: 0 !important;
line-height: 0 !important;
opacity: 1 !important;
overflow: visible !important;
transition: border-color 0.25s ease, color 0.25s ease, background-color 0.25s ease !important;
cursor: pointer;
}
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button-next,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button-next {
right: var(--ucr-home-hero-inline) !important;
left: auto !important;
}
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button-prev,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button-prev {
/* V2 overlay: flex gap 12 → prev sits 44+12 left of next */
right: calc(var(--ucr-home-hero-inline) + 56px) !important;
left: auto !important;
}
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button:hover,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button:hover,
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button:focus-visible,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button:focus-visible {
border: 1px solid #50949A !important;
border-color: #50949A !important;
color: #50949A !important;
background: rgba(255, 255, 255, 0.05) !important;
background-color: rgba(255, 255, 255, 0.05) !important;
box-shadow: none !important;
}
/* Kill Elementor chevron SVG / icon font - V2 uses stroke arrows via mask. */
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button svg,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button svg,
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button i,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button i,
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button .e-font-icon-svg,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button .e-font-icon-svg {
display: none !important;
width: 0 !important;
height: 0 !important;
opacity: 0 !important;
visibility: hidden !important;
}
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button::before,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button::before {
content: "" !important;
display: block !important;
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
background-color: currentColor !important;
background-image: none !important;
-webkit-mask-repeat: no-repeat !important;
mask-repeat: no-repeat !important;
-webkit-mask-position: center !important;
mask-position: center !important;
-webkit-mask-size: contain !important;
mask-size: contain !important;
}
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button-prev::before,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button-prev::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M12 19l-7-7 7-7'/%3E%3C/svg%3E") !important;
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M12 19l-7-7 7-7'/%3E%3C/svg%3E") !important;
}
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button-next::before,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button-next::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") !important;
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") !important;
}
/* EX-056: keep the Home mobile control row clear. Native Swiper
* touch/swipe + bullets remain; desktop arrows are unchanged. This
* comes after the desktop arrow display rule so the breakpoint wins. */
@media (max-width: 768px) {
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button {
display: none !important;
}
}
@media (prefers-reduced-motion: reduce) {
body.home .elementor-element-home-hero-carousel-ka .elementor-swiper-button,
body.home .elementor-element-home-hero-carousel-en .elementor-swiper-button {
transition: none !important;
}
}
/* EX-009 refinement: Elementor's Taxonomy Filter has no dropdown
render mode. The Home/News facade is progressively built from the
native filter buttons, and only then replaces their visual layer.
Geometry and states mirror design-v2/assets/style.css. */
body.home [data-id^="hnw-filter-toolbar-"],
body.page-id-211 [data-id^="ucr-filter-toolbar-"],
body.page-id-212 [data-id^="ucr-filter-toolbar-"] {
display: block !important;
position: relative;
/* Open category list must stack above following card grids */
z-index: 4;
overflow: visible;
}
body.home [data-id^="hnw-filter-toolbar-"].ucr-filter-facade-ready > .elementor-widget-search,
body.home [data-id^="hnw-filter-toolbar-"].ucr-filter-facade-ready > .elementor-widget-taxonomy-filter,
body.home [data-id^="hnw-filter-toolbar-"].ucr-filter-facade-ready > [data-id^="hnw-filter-clear-"],
body.home [data-id^="hnw-filter-toolbar-"].ucr-filter-facade-ready > [data-id^="hnw-filter-announce-"],
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-search,
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-taxonomy-filter,
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-clear-"],
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-announce-"],
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-search,
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > .elementor-widget-taxonomy-filter,
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-clear-"],
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .e-con-inner > [data-id^="ucr-filter-announce-"],
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .elementor-widget-search,
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .elementor-widget-taxonomy-filter,
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > [data-id^="ucr-filter-clear-"],
body.page-id-211 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > [data-id^="ucr-filter-announce-"],
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .elementor-widget-search,
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > .elementor-widget-taxonomy-filter,
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > [data-id^="ucr-filter-clear-"],
body.page-id-212 [data-id^="ucr-filter-toolbar-"].ucr-filter-facade-ready > [data-id^="ucr-filter-announce-"] {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
clip-path: inset(50%) !important;
white-space: nowrap !important;
border: 0 !important;
}
/* News archive list surface: V2 .news-list-section + .wrap gutters */
body.page-id-211 .elementor-element-ucr-filter-root-ka,
body.page-id-212 .elementor-element-ucr-filter-root-en {
background: #ffffff !important;
/* Hero + toolbar + grid are flex children - Elementor default
gap:20px added a dead band under the stage (mobile shot 2026-07-31).
V2 has zero inter-section gap; hang clearance is toolbar pad only. */
gap: 0 !important;
row-gap: 0 !important;
column-gap: 0 !important;
}
/*
* V2 .news-list-section { padding: 140px 0 100px }.
* Hero box is 680 (= 600 image + 80 hang pad), so the list's remaining
* clear pad below the hang is 140 − 80 = 60px desktop.
*/
body.page-id-211 .elementor-element-ucr-filter-toolbar-ka,
body.page-id-212 .elementor-element-ucr-filter-toolbar-en {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-top: 60px !important;
padding-right: 56px !important;
padding-bottom: 0 !important;
padding-left: 56px !important;
box-sizing: border-box !important;
}
/* Ensure glass hang paints above the list surface */
body.page-id-211 .elementor-element-ucr-news-hero-ka,
body.page-id-212 .elementor-element-ucr-news-hero-en {
position: relative !important;
z-index: 5 !important;
}
/*
* Filter toolbar must stack ABOVE the loop grid so the category
* dropdown paints over insight cards. Keep it below hero glass (5).
* Previously both were z-index:1 → DOM order put cards on top.
*/
body.page-id-211 .elementor-element-ucr-filter-toolbar-ka,
body.page-id-212 .elementor-element-ucr-filter-toolbar-en {
position: relative !important;
z-index: 4 !important;
overflow: visible !important;
}
body.page-id-211 .elementor-element-f03c3cb,
body.page-id-212 .elementor-element-e46327b {
position: relative !important;
z-index: 1 !important;
}
body.page-id-211 .elementor-element-ucr-filter-toolbar-ka > .e-con-inner,
body.page-id-212 .elementor-element-ucr-filter-toolbar-en > .e-con-inner {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
}
@media (max-width: 768px) {
/*
* V2 .news-list-section { padding: 140px 0 100px } also on mobile.
* Hero is exactly 480 (no hang), so list pad-top must be the full
* 140 - not 120 on top of a leftover 80 hang band (that stacked to
* ~200px of empty white under the photo).
*/
body.page-id-211 .elementor-element-ucr-filter-toolbar-ka,
body.page-id-212 .elementor-element-ucr-filter-toolbar-en {
padding-top: 140px !important;
padding-right: 24px !important;
padding-left: 24px !important;
}
}
body.page-id-211 .elementor-element-ucr-filter-toolbar-ka .ucr-home-filter-bar,
body.page-id-212 .elementor-element-ucr-filter-toolbar-en .ucr-home-filter-bar {
margin-bottom: 44px !important;
}
/*
* Grid uses the same V2 .wrap geometry as the filter toolbar:
* max-width 1280 centered + side pad 56 (desktop) / 24 (≤768).
* Without side pad, centered 1280 lands at x=80 (not V2's 136).
*/
body.page-id-211 .elementor-element-f03c3cb,
body.page-id-212 .elementor-element-e46327b {
width: 100% !important;
max-width: 1280px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 56px !important;
padding-right: 56px !important;
box-sizing: border-box !important;
}
body.page-id-211 .elementor-element-f03c3cb .elementor-widget-container,
body.page-id-212 .elementor-element-e46327b .elementor-widget-container {
width: 100% !important;
max-width: none !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
@media (max-width: 768px) {
body.page-id-211 .elementor-element-f03c3cb,
body.page-id-212 .elementor-element-e46327b {
padding-left: 24px !important;
padding-right: 24px !important;
}
}
.ucr-home-filter-facade {
display: flow-root;
width: 100%;
}
.ucr-home-filter-bar {
display: grid;
grid-template-columns: 1.6fr 1fr;
align-items: start;
column-gap: 20px;
row-gap: 16px;
width: 100%;
margin: 0 0 32px;
}
.ucr-filter-search-wrapper,
.ucr-filter-select-wrapper,
.ucr-filter-type-wrapper {
position: relative;
width: 100%;
min-width: 0;
}
.ucr-filter-type-wrapper {
grid-column: 1 / -1;
padding-top: 4px;
}
/*
* EX-064 follow-up: the HOMEPAGE News section has no content-type
* filter. design-v2/index.html's own type