/*
Theme Name:   Kadence Child – Klaipėda
Theme URI:    https://klaipedosajc.lt
Description:  Kadence child theme with Klaipėda brand identity
Author:       Klaipėda AJC
Template:     kadence
Version:      1.9.26
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  kadence-child
*/

/* ==========================================================================
   Klaipėda Brand Identity – CSS Variable Overrides
   Brandbook: https://brandpad.io/klaipeda-identitetas/
   ========================================================================== */

:root {
	/* Brand blues – primary accent family */
	--global-palette1:  #1EA0DC; /* Primary accent */
	--global-palette2:  #32BBE9; /* Hover / accent alt */

	/* Text scale – kept from previous palette */
	--global-palette3:  #000000; /* Strongest text */
	--global-palette4:  #000000; /* Strong text */
	--global-palette5:  #000000; /* Medium text */
	--global-palette6:  #000000; /* Subtle text */

	/* Backgrounds – light blue tints */
	--global-palette7:  #E5F4FB; /* Subtle background – tint of #84D6F2 */
	--global-palette8:  #F2FAFD; /* Lighter background */
	--global-palette9:  #FFFFFF; /* White */

	/* Brand secondary families (available as helpers) */
	--brand-yellow-1:   #FFEB94;
	--brand-yellow-2:   #FFDE45;
	--brand-green-1:    #67C599;
	--brand-green-2:    #35B177;
	--brand-green-3:    #029E55;
	--brand-green-4:    #027740;
	--brand-blue-3:     #5BC9ED;
	--brand-blue-4:     #84D6F2;

	/* Typography */
	--global-body-font-family:     'Plus Jakarta Sans', Arial, sans-serif;
	--global-heading-font-family:  'Plus Jakarta Sans', Arial, sans-serif;
	--global-body-font-weight:     300; /* Light */
	--global-heading-font-weight:  500; /* Medium */
}

/* Logo size */
.site-logo img,
.custom-logo {
	max-height: 60px;
	width: auto;
}

/* ==========================================================================
   Klaipėda brand graphic element — stepped colour bands.
   A single self-contained element: the bottom colour fills the strip, and a
   staggered "comb" of the top colour hangs from the top edge, creating the
   brand's offset-band transition. Drop one between any two sections and set
   the two colours via custom properties:
       <div class="kjc-band-divider"
            style="--kjc-d-top:#32BBE9; --kjc-d-bottom:#5BC9ED"></div>
   Pin-sharp at any size, no media file.
   ========================================================================== */
.kjc-band-divider {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	height: clamp(26px, 3.2vw, 54px);
	background-color: var(--kjc-d-bottom, #5BC9ED);
	overflow: hidden;
	line-height: 0;
	/* default staircase (3 shifts, descending) — overridden per divider by the
	   .kjc-st-Nd / .kjc-st-Nu variant classes below */
	--kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='300'%20height='26'/%3E%3Crect%20x='300'%20y='0'%20width='300'%20height='42'/%3E%3Crect%20x='600'%20y='0'%20width='300'%20height='58'/%3E%3Crect%20x='900'%20y='0'%20width='300'%20height='74'/%3E%3C/g%3E%3C/svg%3E");
}
/* The top colour hangs from the top edge in a UNIFORM staircase (every riser is
   the same 16-unit step; treads are equal). The shape comes from --kjc-mask, so
   each divider can carry a different stair pattern. */
.kjc-band-divider::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--kjc-d-top, #32BBE9);
	-webkit-mask-image: var(--kjc-mask);
	mask-image: var(--kjc-mask);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}
/* Staircase variants — 1 to 5 shifts (kjc-st-N), descending (…d) or ascending
   (…u). Every shift is the same size; only the count and direction change, so
   dividers can be varied/"randomised" while staying on-brand. */
.kjc-band-divider.kjc-st-1d { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='600'%20height='42'/%3E%3Crect%20x='600'%20y='0'%20width='600'%20height='58'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-1u { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='600'%20height='58'/%3E%3Crect%20x='600'%20y='0'%20width='600'%20height='42'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-2d { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='400'%20height='34'/%3E%3Crect%20x='400'%20y='0'%20width='400'%20height='50'/%3E%3Crect%20x='800'%20y='0'%20width='400'%20height='66'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-2u { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='400'%20height='66'/%3E%3Crect%20x='400'%20y='0'%20width='400'%20height='50'/%3E%3Crect%20x='800'%20y='0'%20width='400'%20height='34'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-3d { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='300'%20height='26'/%3E%3Crect%20x='300'%20y='0'%20width='300'%20height='42'/%3E%3Crect%20x='600'%20y='0'%20width='300'%20height='58'/%3E%3Crect%20x='900'%20y='0'%20width='300'%20height='74'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-3u { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='300'%20height='74'/%3E%3Crect%20x='300'%20y='0'%20width='300'%20height='58'/%3E%3Crect%20x='600'%20y='0'%20width='300'%20height='42'/%3E%3Crect%20x='900'%20y='0'%20width='300'%20height='26'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-4d { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='240'%20height='18'/%3E%3Crect%20x='240'%20y='0'%20width='240'%20height='34'/%3E%3Crect%20x='480'%20y='0'%20width='240'%20height='50'/%3E%3Crect%20x='720'%20y='0'%20width='240'%20height='66'/%3E%3Crect%20x='960'%20y='0'%20width='240'%20height='82'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-4u { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='240'%20height='82'/%3E%3Crect%20x='240'%20y='0'%20width='240'%20height='66'/%3E%3Crect%20x='480'%20y='0'%20width='240'%20height='50'/%3E%3Crect%20x='720'%20y='0'%20width='240'%20height='34'/%3E%3Crect%20x='960'%20y='0'%20width='240'%20height='18'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-5d { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='200'%20height='10'/%3E%3Crect%20x='200'%20y='0'%20width='200'%20height='26'/%3E%3Crect%20x='400'%20y='0'%20width='200'%20height='42'/%3E%3Crect%20x='600'%20y='0'%20width='200'%20height='58'/%3E%3Crect%20x='800'%20y='0'%20width='200'%20height='74'/%3E%3Crect%20x='1000'%20y='0'%20width='200'%20height='90'/%3E%3C/g%3E%3C/svg%3E"); }
.kjc-band-divider.kjc-st-5u { --kjc-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='200'%20height='90'/%3E%3Crect%20x='200'%20y='0'%20width='200'%20height='74'/%3E%3Crect%20x='400'%20y='0'%20width='200'%20height='58'/%3E%3Crect%20x='600'%20y='0'%20width='200'%20height='42'/%3E%3Crect%20x='800'%20y='0'%20width='200'%20height='26'/%3E%3Crect%20x='1000'%20y='0'%20width='200'%20height='10'/%3E%3C/g%3E%3C/svg%3E"); }

/* ==========================================================================
   Homepage "Mūsų veiklos sritys" cards — interactive. On hover the card lifts
   and a brand STAIRCASE "steps in" from the bottom (the brand graphic element).
   Each card carries a different colour family + its own stair pattern.
   ========================================================================== */
.kjc-veikla-card {
	position: relative;
	overflow: hidden;
	padding-bottom: 3.4rem !important;   /* reserve room for the stepping band, clear of text */
	transition: transform .4s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease;
}
.kjc-veikla-card::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 0;
	background-image: var(--kjc-step-img);
	background-size: 100% 46px;
	background-position: center bottom;
	background-repeat: no-repeat;
	transition: height .42s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}
.kjc-veikla-card:hover,
.kjc-veikla-card:focus-within {
	transform: translateY(-7px);
	box-shadow: 0 20px 32px -16px rgba(10, 26, 74, 0.5);
}
.kjc-veikla-card:hover::after,
.kjc-veikla-card:focus-within::after {
	height: 46px;
}
/* heading nudges up slightly as the steps arrive */
.kjc-veikla-card h3 {
	transition: transform .4s cubic-bezier(.22, .61, .36, 1);
	/* a11y: the inline brand blue #1EA0DC on white is ~2.9:1 — fails WCAG 1.4.3.
	   Black keeps the brandbook rule (hierarchy via size/weight, not colour). */
	color: #000000 !important;
}
.kjc-veikla-card:hover h3,
.kjc-veikla-card:focus-within h3 {
	transform: translateY(-2px);
}
/* per-card colour family + stair pattern (bottom-anchored, uniform risers) */
.kjc-veikla-card:nth-child(1) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%231EA0DC'%3E%3Crect%20x='0'%20y='72'%20width='300'%20height='28'/%3E%3Crect%20x='300'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='600'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='900'%20y='18'%20width='300'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-veikla-card:nth-child(2) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23FFDE45'%3E%3Crect%20x='0'%20y='18'%20width='300'%20height='82'/%3E%3Crect%20x='300'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='600'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='900'%20y='72'%20width='300'%20height='28'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-veikla-card:nth-child(3) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2335B177'%3E%3Crect%20x='0'%20y='66'%20width='400'%20height='34'/%3E%3Crect%20x='400'%20y='42'%20width='400'%20height='58'/%3E%3Crect%20x='800'%20y='18'%20width='400'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
@media (prefers-reduced-motion: reduce) {
	.kjc-veikla-card,
	.kjc-veikla-card::after,
	.kjc-veikla-card h3 { transition: none; }
}
/* Each veiklos card is a link to the Apie accordion (stretched heading link —
   heading forced black above for contrast, makes the whole card clickable,
   a11y name from the heading text). #veikla is the Apie accordion anchor. */
.kjc-veikla-card__link {
	color: inherit;
	text-decoration: none;
}
.kjc-veikla-card__link:hover,
.kjc-veikla-card__link:focus-visible { text-decoration: none; }
.kjc-veikla-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
}
#veikla { scroll-margin-top: 110px; }

/* ==========================================================================
   Real photography (uploads/photos/) — veiklos card media, the "Mūsų erdvė"
   gallery in the visit block, the Apie "Akimirkos" gallery, a featured photo
   on the VR page. Photos are content, exempt from the text-colour rules.
   ========================================================================== */
/* photo at the top of each veiklos card (bleeds past the 1.75rem card padding) */
.kjc-veikla-card__media {
	margin: -1.75rem -1.75rem 1.25rem;
	height: 168px;
	overflow: hidden;
}
.kjc-veikla-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
/* generic responsive photo grid for galleries */
.kjc-photo-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
	max-width: 1040px;
	margin: 1.5rem auto 0;
}
.kjc-photo-grid figure { margin: 0; }
.kjc-photo-grid img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
}
.kjc-photo-grid figcaption {
	margin-top: 0.45rem;
	text-align: center;
	font-size: 0.88rem;
}
.kjc-gallery-title {
	text-align: center;
	font-weight: 500;
	margin: 0 0 0.5rem;
}
.kjc-erdve { margin-top: 2.5rem; }
/* the "Mūsų erdvė" gallery sits on the blue visit band → white labels */
.kjc-visit-wrap .kjc-gallery-title { color: #FFFFFF !important; }
.kjc-visit-wrap .kjc-photo-grid figcaption { color: #FFFFFF; }
/* featured single photo (VR page) */

/* ==========================================================================
   Homepage hero — brand graphic element (replaces the low-res 640×360 video).
   Solid Jūra 5.2 (#32BBE9) field, the darkest Jūra 5.1 (#1EA0DC) stepping in
   from the top edge, with the title as interactive white type — no box.
   ========================================================================== */
.kjc-band-hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: 0;
	margin-bottom: 0;
	min-height: clamp(440px, 64vh, 680px);
	padding-top: clamp(28px, 4.5vh, 56px);
	padding-bottom: clamp(54px, 9vh, 116px);
	overflow: hidden;
	background-color: #32BBE9;
}
/* Top comb sits inside the hero, so neutralise the divider's full-bleed. */
.kjc-band-hero .kjc-band-hero__top {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	max-width: 100%;
	margin: 0;
	height: clamp(26px, 3.2vw, 54px);
	z-index: 0;
}
/* --------------------------------------------------------------------------
   Hero title = the brand logo as an INTERACTIVE lockup (replaces the old
   white text title). The pixel-exact transparent logo WebP (492×507) is shown
   as an <img>; a diagonal gloss masked by the SAME logo sweeps only its opaque
   pixels on hover, so the transparent diamond interior keeps revealing the
   moving sea. Ambient bob/sway live on an INNER element while hover lift/scale/
   glow live on the OUTER element — so the hover state wins the cascade cleanly
   (a paused animation would otherwise override hover transform/filter).
   -------------------------------------------------------------------------- */
.kjc-logo-hero {
	position: relative;
	z-index: 3;                  /* above .kjc-band-hero__sea (z:0) */
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 0;
	transform: translateY(-18%); /* lift the lockup into the clean blue — gentle enough that the top diamond tip never clips the hero edge */
	pointer-events: none;        /* interaction handled on the media box */
}
/* Hero content column: logo + tagline + CTA, centred above the wave band.
   The logo's own -18% lift is neutralised here so the stack reads as one unit;
   the asymmetric hero padding keeps the column sitting above the lower waves. */
.kjc-hero-content {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: clamp(0.9rem, 2.2vw, 1.5rem);
	padding: 0 1.25rem;
}
.kjc-hero-content .kjc-logo-hero { transform: none !important; }
.kjc-hero-tagline {
	margin: 0;
	/* Wide enough for the two-sentence tagline to settle on two lines; a third
	   line pushes the text down onto the wave divider and loses contrast. */
	max-width: min(38ch, 100%);
	text-wrap: balance;
	color: #FFFFFF !important;
	font-weight: 500;
	font-size: clamp(1.15rem, 2.7vw, 1.75rem);
	line-height: 1.25;
	text-shadow: 0 2px 12px rgba(20, 40, 60, 0.30);
}
.kjc-hero-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	background: #FFDE45 !important;
	color: #000000 !important;
	font-weight: 500;
	font-size: clamp(1rem, 1.7vw, 1.18rem);
	line-height: 1;
	text-decoration: none;
	padding: 0.9rem 2rem;
	box-shadow: 0 8px 20px rgba(20, 40, 60, 0.24);
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
	            box-shadow 0.3s, background-color 0.3s;
}
.kjc-hero-cta:hover,
.kjc-hero-cta:focus-visible {
	background: #FFEB94 !important;
	transform: translateY(-3px);
	box-shadow: 0 16px 28px rgba(20, 40, 60, 0.32);
}
.kjc-hero-cta__arrow { transition: transform 0.3s ease; }
.kjc-hero-cta:hover .kjc-hero-cta__arrow { transform: translateY(3px); }
/* OUTER: hover lift/scale + glow. No ambient animation here, so hover wins. */
.kjc-logo-hero__media {
	position: relative;
	display: block;
	height: clamp(190px, 38vh, 360px);   /* sized by height so it scales with the hero and never overflows the top */
	width: auto;
	aspect-ratio: 492 / 507;
	pointer-events: auto;
	cursor: default;
	filter: drop-shadow(0 10px 18px rgba(20, 40, 60, 0.22));
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
	            filter 0.45s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform, filter;
}
/* INNER: continuous ambient bob + sway, isolated from the hover transform. */
.kjc-logo-hero__motion {
	position: absolute;
	inset: 0;
	transform-origin: 50% 72%;
	animation: kjc-logo-bob 6.5s ease-in-out infinite,
	           kjc-logo-sway 9s ease-in-out infinite;
	will-change: transform, rotate;
}
.kjc-logo-hero__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	-webkit-user-select: none;
	user-select: none;
	-webkit-user-drag: none;
}
/* Diagonal gloss, masked by the SAME WebP so the shine only crosses the
   logo's opaque pixels (frame, yellow box, lettering) — never the transparent
   diamond interior, which keeps showing the water/waves through it. */
.kjc-logo-hero__gloss {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0;
	background: linear-gradient(115deg,
		rgba(255, 255, 255, 0)    38%,
		rgba(255, 255, 255, 0.12) 47%,
		rgba(255, 255, 255, 0.45) 50%,
		rgba(255, 255, 255, 0.12) 53%,
		rgba(255, 255, 255, 0)    62%);
	background-repeat: no-repeat;
	background-size: 220% 220%;
	background-position: 130% 130%;
	mix-blend-mode: screen;
	-webkit-mask-image: url("/wp-content/uploads/2026/07/kajc-logo-white.png");
	        mask-image: url("/wp-content/uploads/2026/07/kajc-logo-white.png");
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-position: center;
	        mask-position: center;
	-webkit-mask-size: contain;
	        mask-size: contain;
}
/* Hover — local (the logo) AND hero-wide (matches the wave-speedup behaviour) */
.kjc-logo-hero__media:hover,
.kjc-band-hero:hover .kjc-logo-hero__media {
	transform: translateY(-10px) scale(1.05);
	filter: drop-shadow(0 22px 30px rgba(20, 40, 60, 0.30))
	        drop-shadow(0 0 16px rgba(255, 222, 69, 0.55));
}
.kjc-logo-hero__media:hover .kjc-logo-hero__gloss,
.kjc-band-hero:hover .kjc-logo-hero__media .kjc-logo-hero__gloss {
	animation: kjc-logo-gloss 0.95s cubic-bezier(0.4, 0, 0.2, 1) 1 both;
}
@keyframes kjc-logo-bob {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-9px); }
}
@keyframes kjc-logo-sway {
	0%, 100% { rotate: -1.1deg; }
	50%      { rotate: 1.1deg; }
}
@keyframes kjc-logo-gloss {
	0%   { opacity: 0; background-position: 130% 130%; }
	12%  { opacity: 1; }
	88%  { opacity: 1; }
	100% { opacity: 0; background-position: -30% -30%; }
}
/* Accessible heading text (kept for SEO + screen readers, visually hidden) */
.kjc-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}
@media (max-width: 600px) {
	.kjc-logo-hero { transform: translateY(-12%); }
	.kjc-logo-hero__media { height: clamp(170px, 30vh, 280px); width: auto; }
	.kjc-hero-content { gap: 0.85rem; }
	.kjc-hero-cta { padding: 0.8rem 1.6rem; }
}

/* Moving sea — a band of scrolling waves in the lower part of the hero.
   #32BBE9 stays dominant (it's the water body + the hero field above and
   below the band); the lighter Jūra blues and white foam are the crests.
   Any sub-pixel gap behind a layer reveals the hero's own #32BBE9, so the
   band blends seamlessly above and below. */
.kjc-band-hero__sea {
	position: absolute;
	left: 0;
	right: 0;
	top: 60%;
	bottom: 6%;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
}
.kjc-band-hero__sea .kjc-wv {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	background-repeat: repeat-x;
	background-position-x: 0;
	background-position-y: bottom;
	will-change: background-position, transform;
}
.kjc-wv--back {
	height: 100%;
	opacity: 0.5;
	background-size: 1100px 100%;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='600'%20height='100'%20viewBox='0%200%20600%20100'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0,30%20C150,0%20150,60%20300,30%20C450,0%20450,60%20600,30%20V100%20H0%20Z'%20fill='%2384D6F2'/%3E%3C/svg%3E");
	animation: kjc-wv-back 26s linear infinite, kjc-wv-bob 9s ease-in-out infinite;
}
.kjc-wv--mid {
	height: 80%;
	opacity: 0.7;
	background-size: 760px 100%;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='600'%20height='100'%20viewBox='0%200%20600%20100'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0,30%20C150,0%20150,60%20300,30%20C450,0%20450,60%20600,30%20V100%20H0%20Z'%20fill='%235BC9ED'/%3E%3C/svg%3E");
	animation: kjc-wv-mid 17s linear infinite, kjc-wv-bob 7s ease-in-out infinite reverse;
}
.kjc-wv--water {
	height: 60%;
	opacity: 1;
	background-size: 600px 100%;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='600'%20height='100'%20viewBox='0%200%20600%20100'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0,30%20C150,0%20150,60%20300,30%20C450,0%20450,60%20600,30%20V100%20H0%20Z'%20fill='%2332BBE9'/%3E%3C/svg%3E");
	animation: kjc-wv-water 13s linear infinite, kjc-wv-bob 5.5s ease-in-out infinite;
}
.kjc-wv--foam {
	height: 62%;
	opacity: 0.55;
	background-size: 520px 100%;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='600'%20height='100'%20viewBox='0%200%20600%20100'%20preserveAspectRatio='none'%3E%3Cpath%20d='M0,28%20C150,-2%20150,58%20300,28%20C450,-2%20450,58%20600,28'%20fill='none'%20stroke='%23FFFFFF'%20stroke-width='4'/%3E%3C/svg%3E");
	animation: kjc-wv-foam 9s linear infinite, kjc-wv-bob 5.5s ease-in-out infinite;
}
@keyframes kjc-wv-back  { from { background-position-x: 0; } to { background-position-x: -1100px; } }
@keyframes kjc-wv-mid   { from { background-position-x: 0; } to { background-position-x:  760px; } }
@keyframes kjc-wv-water { from { background-position-x: 0; } to { background-position-x: -600px; } }
@keyframes kjc-wv-foam  { from { background-position-x: 0; } to { background-position-x: -520px; } }
@keyframes kjc-wv-bob   { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

.kjc-band-hero:hover .kjc-wv--back  { animation-duration: 14s, 9s; }
.kjc-band-hero:hover .kjc-wv--mid   { animation-duration: 9s, 7s; }
.kjc-band-hero:hover .kjc-wv--water { animation-duration: 7s, 5.5s; }
.kjc-band-hero:hover .kjc-wv--foam  { animation-duration: 5s, 5.5s; }

@media (prefers-reduced-motion: reduce) {
	.kjc-band-hero__sea .kjc-wv,
	.kjc-logo-hero__media,
	.kjc-logo-hero__motion {
		animation: none !important;
		transition: none !important;
	}
	.kjc-logo-hero__media,
	.kjc-logo-hero__media:hover,
	.kjc-band-hero:hover .kjc-logo-hero__media {
		transform: none !important;
		filter: drop-shadow(0 10px 18px rgba(20, 40, 60, 0.22)) !important;
	}
	.kjc-logo-hero__gloss { opacity: 0 !important; }
}

/* ==========================================================================
   Homepage "Apsilankyk" visit block — practical info surfaced in the body.
   Sits right after the hero on the same Jūra blue (#32BBE9, no divider) so the
   sea flows straight into it; white reassurance pills, a map, and a white info
   card (blue labels, black values). Anchor target for the hero CTA.
   ========================================================================== */
#apsilankyk { scroll-margin-top: 110px; }
.kjc-visit__title {
	text-align: center;
	color: #FFFFFF !important;
	font-weight: 500;
	margin: 0 0 1.25rem !important;
}
.kjc-visit-pills {
	list-style: none;
	margin: 0 auto 2.25rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.6rem 0.75rem;
}
.kjc-visit-pills li {
	background: #FFFFFF;
	color: #000000;
	font-weight: 500;
	font-size: 0.95rem;
	padding: 0.5rem 1.15rem;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
}
.kjc-visit-pills li::before {
	content: "✓";
	color: #1EA0DC;
	font-weight: 500;
}
.kjc-visit__lead {
	text-align: center;
	color: #FFFFFF;
	margin: 0 auto 1.5rem;
	max-width: 52ch;
	font-size: 1.05rem;
	line-height: 1.6;
}
.kjc-visit-locs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	max-width: 1000px;
	margin: 0 auto;
}
.kjc-visit-loc {
	background: #FFFFFF;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}
.kjc-visit-loc__head {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	padding: 1rem 1.25rem;
	color: #FFFFFF;
}
.kjc-visit-loc__head--blue  { background: #1EA0DC; }
.kjc-visit-loc__head--green { background: #35B177; }
.kjc-visit-loc__badge {
	flex: none;
	width: 1.9rem;
	height: 1.9rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.25);
	border-radius: 999px;
	font-weight: 500;
}
.kjc-visit-loc__addr {
	font-weight: 500;
	font-size: 1.05rem;
	line-height: 1.3;
}
.kjc-visit-loc__map {
	position: relative;
	min-height: 230px;
	background: rgba(0, 0, 0, 0.06);
}
.kjc-visit-loc__map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}
.kjc-visit-loc__foot {
	margin-top: auto;
	padding: 1rem 1.25rem;
}
.kjc-visit-loc__dir {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	color: #1EA0DC;
	font-weight: 500;
	text-decoration: none;
}
.kjc-visit-loc__dir:hover,
.kjc-visit-loc__dir:focus-visible { text-decoration: underline; }
.kjc-visit-meta {
	margin: 2rem auto 0;
	max-width: 1000px;
	text-align: center;
	color: #FFFFFF;
	font-size: 1rem;
	line-height: 1.8;
}
.kjc-visit-meta strong { font-weight: 500; }
.kjc-visit-meta a {
	color: #FFFFFF;
	text-decoration: underline;
}
@media (max-width: 760px) {
	.kjc-visit-locs { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Homepage Projektai (#FFEB94 band) — a condensed HORIZONTAL timeline of the
   project objects moved off the old /projektai/ page. Year nodes on a blue
   connector line, compact white cards (image + blue title + short desc + link
   to the detail page). Cards keep the brand "steps" reveal on hover. The old
   /projektai/ listing now redirects here (#projektai), nav points here too.
   ========================================================================== */
#projektai { scroll-margin-top: 110px; }
.kjc-proj-sub {
	text-align: center;
	color: #000000;
	margin: 0 auto 1.75rem;
	max-width: 56ch;
	font-size: 1.05rem;
	line-height: 1.6;
}
.kjc-htimeline {
	list-style: none;
	margin: 2.25rem auto 0;
	padding: 0;
	max-width: 1040px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}
.kjc-htl-item {
	display: flex;
	flex-direction: column;
}
.kjc-htl-node {
	position: relative;
	display: flex;
	justify-content: center;
	margin-bottom: 1.1rem;
}
/* horizontal connector between adjacent year circles */
.kjc-htl-item:not(:last-child) .kjc-htl-node::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(100% + 1.5rem);
	height: 3px;
	background: #1EA0DC;
	transform: translateY(-50%);
	z-index: 0;
}
.kjc-htl-year {
	position: relative;
	z-index: 1;
	width: 60px;
	height: 60px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #1EA0DC;
	color: #FFFFFF;
	font-weight: 500;
	font-size: 0.95rem;
	border-radius: 50%;
	box-shadow: 0 0 0 6px #FFDE45;   /* halo matches the band (Projektai teaser is #FFDE45) so the line stops cleanly at the circle */
}
.kjc-htl-card {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #FFFFFF;
	border-top: 4px solid #1EA0DC;
	transition: transform .4s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease;
}
.kjc-htl-media {
	height: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	overflow: hidden;
}
.kjc-htl-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kjc-htl-media--contain { padding: 0.9rem 1.25rem; }
.kjc-htl-media--contain img { object-fit: contain; }
.kjc-htl-body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 1.1rem 1.25rem 3.2rem;   /* reserve room for the step band, clear of the link */
}
.kjc-htl-body h3 {
	margin: 0 0 0.4rem;
	color: #1EA0DC;
	font-weight: 500;
	font-size: 1.1rem;
	line-height: 1.25;
}
.kjc-htl-body p {
	margin: 0 0 0.9rem;
	color: #000000;
	font-size: 0.92rem;
	line-height: 1.5;
}
.kjc-htl-link {
	margin-top: auto;
	align-self: flex-start;
	color: #1EA0DC;
	font-weight: 500;
	text-decoration: none;
}
.kjc-htl-link:hover,
.kjc-htl-link:focus-visible { text-decoration: underline; }
/* brand staircase steps in from the bottom on hover (GPU-safe height animation) */
.kjc-htl-card::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 0;
	background-image: var(--kjc-step-img);
	background-size: 100% 42px;
	background-position: center bottom;
	background-repeat: no-repeat;
	transition: height .42s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}
.kjc-htl-card:hover,
.kjc-htl-card:focus-within {
	transform: translateY(-6px);
	box-shadow: 0 18px 30px -16px rgba(10, 26, 74, 0.5);
}
.kjc-htl-card:hover::after,
.kjc-htl-card:focus-within::after { height: 42px; }
.kjc-htl-item:nth-child(1) .kjc-htl-card {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%231EA0DC'%3E%3Crect%20x='0'%20y='72'%20width='300'%20height='28'/%3E%3Crect%20x='300'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='600'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='900'%20y='18'%20width='300'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-htl-item:nth-child(2) .kjc-htl-card {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2335B177'%3E%3Crect%20x='0'%20y='18'%20width='300'%20height='82'/%3E%3Crect%20x='300'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='600'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='900'%20y='72'%20width='300'%20height='28'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-htl-item:nth-child(3) .kjc-htl-card {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2332BBE9'%3E%3Crect%20x='0'%20y='66'%20width='400'%20height='34'/%3E%3Crect%20x='400'%20y='42'%20width='400'%20height='58'/%3E%3Crect%20x='800'%20y='18'%20width='400'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
@media (max-width: 760px) {
	.kjc-htimeline { grid-template-columns: 1fr; gap: 2rem; max-width: 420px; }
	.kjc-htl-item:not(:last-child) .kjc-htl-node::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.kjc-htl-card,
	.kjc-htl-card::after { transition: none; }
}

/* ==========================================================================
   Homepage Naujienos — anchor + news search bar. The /naujienos/ page now
   redirects here and the nav points here; the search submits to the site
   (?s=…, restricted to posts) so all news stays findable.
   ========================================================================== */
#naujienos { scroll-margin-top: 110px; }
.kjc-news-search {
	display: flex;
	max-width: 520px;
	margin: 0 auto 2.5rem;
}
.kjc-news-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	border: 0;
	border-radius: 0;
	background: #FFFFFF;
	color: #000000;
	font-size: 1rem;
	padding: 0.9rem 1.1rem;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}
.kjc-news-search input[type="search"]::placeholder { color: #000000; opacity: 0.55; }
/* visible keyboard focus (Kadence zeroes the input outline, child zeroes the
   border — without this the only cue was a 10%-opacity shadow) */
.kjc-news-search input[type="search"]:focus {
	outline: 3px solid #000000;
	outline-offset: 2px;
}
.kjc-news-search button {
	flex: none;
	border: 0;
	cursor: pointer;
	background: #1EA0DC;
	color: #FFFFFF;
	font-weight: 500;
	font-size: 1rem;
	padding: 0 1.4rem;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	transition: background-color .25s;
}
.kjc-news-search button:hover,
.kjc-news-search button:focus-visible { background: #000000; }
.kjc-news-search button svg { width: 18px; height: 18px; }

/* "Visos naujienos" link below the homepage news grid → /category/naujiena/ */
.kjc-news-all { display: flex; justify-content: center; margin-top: 2.5rem; }
.kjc-news-all a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: #1EA0DC !important;
	color: #FFFFFF !important;
	font-weight: 500;
	text-decoration: none;
	padding: 0.85rem 1.8rem;
	transition: background-color .3s, transform .3s;
}
.kjc-news-all a:hover,
.kjc-news-all a:focus-visible {
	background: #000000 !important;
	transform: translateY(-2px);
}

/* ==========================================================================
   Search results + news ("naujiena") category archive — brand-framed by the
   functions.php hooks (header → #84D6F2 field → footer). White result cards on
   the blue field, same look as the homepage news + single posts.
   ========================================================================== */
.kjc-search-band {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: #84D6F2;
	padding: 2.5rem clamp(1.25rem, 4vw, 3rem) 0.5rem;
}
.kjc-search-band__inner { max-width: 1040px; margin: 0 auto; }
.kjc-search-band .kjc-news-search { margin-bottom: 0; }
body.search #inner-wrap,
body.category #inner-wrap,
body.error404 #inner-wrap {
	background: #84D6F2 !important;
}
body.search .content-container,
body.category .content-container,
body.search #main,
body.category #main,
body.search .content-area,
body.category .content-area {
	background: transparent !important;
}

/* Institutional info pages (decree-480 skeleton + /en/, body class set in
   functions.php): full brand-band pages — colour sections + dividers live in
   the page CONTENT (Apie-style, each page with its own stair sequence). The
   class provides the shared page-wrapper treatment: paint the theme's
   footer-push grow-space with the strip's final green and zero all article
   margins/padding so the first and last dividers sit flush. */
body.kjc-info-page #inner-wrap {
	background-color: #029E55;
}
body.kjc-info-page article.entry {
	box-shadow: none !important;
}
body.kjc-info-page .content-area,
body.kjc-info-page #main,
body.kjc-info-page article.entry,
body.kjc-info-page .entry-content-wrap,
body.kjc-info-page .entry-content {
	margin-top: 0 !important;
	padding-top: 0 !important;
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

/* Branded 404 page */
.kjc-404 {
	max-width: 720px;
	margin: 0 auto;
	padding: clamp(3rem, 7vw, 5.5rem) clamp(1.25rem, 4vw, 3rem);
	text-align: center;
	color: #FFFFFF;
}
.kjc-404__code {
	margin: 0;
	font-weight: 500;
	font-size: clamp(4rem, 14vw, 7rem);
	line-height: 1;
	color: #FFFFFF;
	opacity: 0.9;
}
.kjc-404__title {
	color: #FFFFFF !important;
	font-weight: 500;
	margin: 0.4rem 0 1rem;
}
.kjc-404__text {
	color: #FFFFFF;
	font-size: 1.05rem;
	line-height: 1.6;
	margin: 0 auto 2rem;
	max-width: 48ch;
}
.kjc-404__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.75rem;
	margin-bottom: 2rem;
}
.kjc-404__btn {
	display: inline-flex;
	align-items: center;
	background: #FFDE45;
	color: #000000 !important;
	font-weight: 500;
	text-decoration: none;
	padding: 0.8rem 1.6rem;
	transition: background-color .25s, transform .25s;
}
.kjc-404__btn:hover,
.kjc-404__btn:focus-visible { background: #FFEB94; transform: translateY(-2px); }
.kjc-404__btn--ghost {
	background: rgba(255, 255, 255, 0.18);
	color: #FFFFFF !important;
}
.kjc-404__btn--ghost:hover,
.kjc-404__btn--ghost:focus-visible { background: rgba(255, 255, 255, 0.3); }
.kjc-404__search { max-width: 420px; margin: 0 auto; }

/* Contact form (CF7) in the Apsilankyk block — white fields on the blue band */
.kjc-cf-wrap { max-width: 600px; margin: 3rem auto 0; text-align: center; }
.kjc-cf-title { color: #FFFFFF !important; font-weight: 500; margin: 0 0 0.4rem; }
.kjc-cf-lead { color: #FFFFFF; margin: 0; font-size: 1rem; }
.kjc-visit-wrap .wpcf7 { max-width: 600px; margin: 1.25rem auto 0; }
.kjc-visit-wrap .wpcf7 label {
	display: block;
	text-align: left;
	color: #FFFFFF;
	font-weight: 500;
	font-size: 0.95rem;
	margin-bottom: 1rem;
}
.kjc-visit-wrap .wpcf7 .kjc-cf-row { margin: 0 0 1rem; }
.kjc-visit-wrap .wpcf7 input[type="text"],
.kjc-visit-wrap .wpcf7 input[type="email"],
.kjc-visit-wrap .wpcf7 textarea {
	width: 100%;
	border: 0;
	border-radius: 0;
	background: #FFFFFF;
	color: #000000;
	font-size: 1rem;
	padding: 0.8rem 0.9rem;
	margin-top: 0.35rem;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}
.kjc-visit-wrap .wpcf7 textarea { min-height: 130px; resize: vertical; }
.kjc-visit-wrap .wpcf7 .kjc-cf-submit { text-align: center; margin: 0.5rem 0 0; }
.kjc-visit-wrap .wpcf7 input[type="submit"] {
	background: #1EA0DC;
	color: #FFFFFF;
	border: 0;
	border-radius: 0;
	font-weight: 500;
	font-size: 1rem;
	padding: 0.85rem 2rem;
	cursor: pointer;
	transition: background-color .25s, transform .25s;
}
.kjc-visit-wrap .wpcf7 input[type="submit"]:hover { background: #000000; transform: translateY(-2px); }
.kjc-visit-wrap .wpcf7-response-output {
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.6) !important;
	margin: 1rem 0 0 !important;
}
.kjc-visit-wrap .wpcf7-not-valid-tip { color: #FFEB94; font-weight: 500; }
/* page title: white, centred, no rule line */
body.search .page-title,
body.category .page-title {
	color: #FFFFFF !important;
	font-weight: 500;
	text-align: center;
}
body.search .page-title span,
body.category .page-title span { color: #FFFFFF !important; }
body.search .search-archive-title,
body.category .archive-title,
body.category .search-archive-title {
	text-align: center;
	border-bottom: 0 !important;
}
/* result cards (Kadence .content-bg boxes) → sharp brand corners + soft shadow */
body.search .loop-entry.content-bg,
body.category .loop-entry.content-bg {
	border-radius: 0 !important;
	box-shadow: 0 12px 26px -18px rgba(10, 26, 74, 0.55);
}
body.search .entry-title a,
body.category .entry-title a { color: #1EA0DC; }
body.search .entry-meta .posted-by,
body.category .entry-meta .posted-by { display: none; }   /* hide "By Admin" */
/* pagination on the blue field */
body.search .kadence-pagination a,
body.category .kadence-pagination a,
body.search .navigation .page-numbers,
body.category .navigation .page-numbers { color: #FFFFFF; }
body.search .navigation .page-numbers.current,
body.category .navigation .page-numbers.current { color: #1EA0DC; background: #FFFFFF; }
/* brandbook typography on result cards: headings Medium (500), body Light (300),
   links palette-blue — no heavier weights, only black/white/blue text */
body.search .entry-title,
body.category .entry-title,
body.search .entry-title a,
body.category .entry-title a { font-weight: 500; }
body.search .entry-summary,
body.category .entry-summary,
body.search .entry-summary p,
body.category .entry-summary p {
	font-weight: 300;
	color: #000000;
}
body.search .post-more-link,
body.category .post-more-link {
	color: #1EA0DC !important;
	font-weight: 500;
}
/* page title stays Medium, never heavy */
body.search .page-title,
body.category .page-title { font-weight: 500 !important; }

/* Homepage "Sek mus" social strip (#35B177 band) — a slim accent band before
   the footer. White pill chips with palette-blue icons. Fills the previously-
   empty #35B177 green step. */
.kjc-social-strip { text-align: center; }
.kjc-social-strip__title {
	color: #FFFFFF !important;
	font-weight: 500;
	margin: 0 0 1.25rem !important;
}
.kjc-social-chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.85rem;
}
.kjc-social-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	background: #FFFFFF;
	color: #000000 !important;
	font-weight: 500;
	text-decoration: none;
	padding: 0.7rem 1.4rem;
	border-radius: 999px;
	transition: transform 0.3s, box-shadow 0.3s;
}
.kjc-social-chip:hover,
.kjc-social-chip:focus-visible {
	transform: translateY(-3px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.18);
}
.kjc-social-chip svg {
	width: 20px;
	height: 20px;
	flex: none;
	color: #1EA0DC;
}
/* stack the social chips on narrow phones so they never overflow */
@media (max-width: 480px) {
	.kjc-social-chips { flex-direction: column; align-items: center; }
	.kjc-social-chip { width: 100%; max-width: 280px; justify-content: center; }
}

/* Kadence's boxed-content drop-shadow (on article.entry) casts a faint dark
   band onto the footer's green top edge — it reads as a "line" separating the
   page's #029E55 from the footer's identical #029E55. Remove it on the brand-
   band pages so the greens flow as one continuous element. */
body.page-id-15 article.entry,
body.page-id-16 article.entry,
body.page-id-19 article.entry,
body.page-id-21 article.entry,
body.page-id-22 article.entry,
body.parent-pageid-19 article.entry {
	box-shadow: none !important;
}

/* ==========================================================================
   Footer: brand band element between the two greens
   (Žemynas 5.3 #029E55 middle row → Žemynas 5.4 #027740 bottom row).
   The footer is theme-rendered, so the divider is drawn with a pseudo-element
   on the bottom row: #029E55 comb steps hang from the top edge into #027740.
   ========================================================================== */
.site-bottom-footer-wrap .site-footer-row-container-inner {
	position: relative;
}
.site-bottom-footer-wrap .site-footer-inner-wrap,
.site-bottom-footer-wrap .site-bottom-footer-inner-wrap {
	padding-top: 104px !important;
}
/* Make the second green (the middle footer row, #029E55) a larger, more
   dominant band. */
.site-middle-footer-wrap .site-middle-footer-inner-wrap {
	padding-top: 56px !important;
	padding-bottom: 56px !important;
}
.site-bottom-footer-wrap .site-footer-row-container-inner::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: clamp(48px, 5vw, 78px);
	background-color: #029E55;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='520'%20height='52'/%3E%3Crect%20x='520'%20y='0'%20width='430'%20height='80'/%3E%3Crect%20x='950'%20y='0'%20width='250'%20height='62'/%3E%3C/g%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='0'%20y='0'%20width='520'%20height='52'/%3E%3Crect%20x='520'%20y='0'%20width='430'%20height='80'/%3E%3Crect%20x='950'%20y='0'%20width='250'%20height='62'/%3E%3C/g%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	pointer-events: none;
	z-index: 0;
}

/* ==========================================================================
   Brand "transition block" for sub-pages — the full palette as an empty
   stepped-band strip. Sub-pages have fewer sections, so this carries the whole
   brand colour journey (Jūra → Krantas → Žemynas) and flows into the footer,
   exactly like the homepage. Reuses .kjc-band-divider; here the dividers are
   stacked edge-to-edge inside one full-bleed flex column. Drop in via a
   wp:html block at the end of the page content.
   ========================================================================== */
.kjc-band-stack {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: 0;
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
	line-height: 0;
}
.kjc-band-stack .kjc-band-divider {
	width: 100%;
	max-width: 100%;
	margin: 0;
	flex: 0 0 auto;
}

/* Sub-pages (Naujienos 16, Projektai 19, Apie 21, Kontaktai 22): the theme
   grows #inner-wrap to push the footer to the viewport bottom, which left a big
   empty gap on these sparse pages. Paint that grow-space with the strip's final
   green (#029E55 = the footer's top row) so the brand band flows seamlessly
   into the footer at ANY viewport height, and drop the top margin so no green
   shows above the content. */
body.page-id-16 #inner-wrap,
body.page-id-19 #inner-wrap,
body.page-id-21 #inner-wrap,
body.page-id-22 #inner-wrap,
body.parent-pageid-19 #inner-wrap {
	background-color: #029E55;
}
body.page-id-16 .content-area,
body.page-id-19 .content-area,
body.page-id-21 .content-area,
body.page-id-22 .content-area,
body.parent-pageid-19 .content-area {
	margin-top: 0 !important;
}
/* Naujienos (16), Projektai (19), Apie (21) & Kontaktai (22) START with a
   full-bleed colour band/divider, so also drop the article's top padding/margin
   — otherwise a 2rem white strip shows between the header and the first band. */
body.page-id-16 article.entry,
body.page-id-19 article.entry,
body.page-id-21 article.entry,
body.page-id-22 article.entry,
body.parent-pageid-19 article.entry,
body.page-id-16 .entry-content-wrap,
body.page-id-19 .entry-content-wrap,
body.page-id-21 .entry-content-wrap,
body.page-id-22 .entry-content-wrap,
body.parent-pageid-19 .entry-content-wrap,
body.page-id-16 .entry-content,
body.page-id-19 .entry-content,
body.page-id-21 .entry-content,
body.page-id-22 .entry-content,
body.parent-pageid-19 .entry-content {
	margin-top: 0 !important;
	padding-top: 0 !important;
}
body.page-id-16 .content-area,
body.page-id-19 .content-area,
body.page-id-21 .content-area,
body.page-id-22 .content-area,
body.parent-pageid-19 .content-area,
body.page-id-16 #main,
body.page-id-19 #main,
body.page-id-21 #main,
body.page-id-22 #main,
body.parent-pageid-19 #main,
body.page-id-16 article.entry,
body.page-id-19 article.entry,
body.page-id-21 article.entry,
body.page-id-22 article.entry,
body.parent-pageid-19 article.entry,
body.page-id-16 .entry-content-wrap,
body.page-id-19 .entry-content-wrap,
body.page-id-21 .entry-content-wrap,
body.page-id-22 .entry-content-wrap,
body.parent-pageid-19 .entry-content-wrap,
body.page-id-16 .entry-content,
body.page-id-19 .entry-content,
body.page-id-21 .entry-content,
body.page-id-22 .entry-content,
body.parent-pageid-19 .entry-content {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

/* Sharp edges on social icons (header & footer) */
.header-social-wrap .social-button,
.header-social-inner-wrap .social-button,
.footer-social-wrap .social-button,
.footer-social-inner-wrap .social-button,
.social-button.header-social-item,
.social-button.footer-social-item {
	border-radius: 0 !important;
}

/* ==========================================================================
   Footer formatting — brand-styled widget columns on the green (#029E55).
   White text/links per brandbook; a brand-yellow accent bar under each column
   heading + a yellow underline on link hover (decoration, not text colour,
   matching the nav). Content lives in Kadence footer text widgets.
   ========================================================================== */
.site-middle-footer-wrap .widget-title {
	color: #FFFFFF !important;
	font-weight: 500;
	font-size: 0.85rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin: 0 0 1.15rem;
	padding-bottom: 0.65rem;
	position: relative;
}
.site-middle-footer-wrap .widget-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 34px;
	height: 3px;
	background: #FFDE45;
}
.site-middle-footer-wrap .textwidget,
.site-middle-footer-wrap .textwidget p {
	color: #FFFFFF;
	font-size: 0.98rem;
	line-height: 1.8;
	margin: 0;
}
.site-middle-footer-wrap a {
	color: #FFFFFF !important;
	text-decoration: none;
	transition: color 0.2s ease;
}
.site-middle-footer-wrap a:hover,
.site-middle-footer-wrap a:focus-visible {
	text-decoration: underline;
	text-decoration-color: #FFDE45;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}
/* PUSLAPIAI: stack the links with a little breathing room */
.site-footer-middle-section-4 .textwidget a {
	display: inline-block;
	font-weight: 500;
	letter-spacing: 0.05em;
	padding: 0.12rem 0;
}
/* Bottom bar (copyright) */
.site-bottom-footer-wrap .footer-html p {
	color: #FFFFFF;
	line-height: 1.7;
	margin: 0;
}
.site-bottom-footer-wrap .footer-html strong { font-weight: 500; }

/* ==========================================================================
   Brand-section design — any page using full-bleed .kjc-apie-sec colour bands
   (Apie 21, Projektai 19 + its inner pages 20/33). Scoped to the class itself,
   so it applies wherever the sections are used. Regular text black, Plus Jakarta
   Sans; headings → navy; pale callout boxes → frosted.
   ========================================================================== */
/* Body text → black, but ONLY where a colour wasn't explicitly set. Elements
   with .has-text-color (white-on-blue / navy stat cards, etc.) keep their own
   inline colour — we just don't force black over it (don't use color:inherit,
   which would discard the explicit colour and pull a dark one from the parent). */
.kjc-apie-sec p:not(.has-text-color),
.kjc-apie-sec li:not(.has-text-color),
.kjc-apie-sec blockquote:not(.has-text-color) {
	color: #000000 !important;
}
.kjc-apie-sec p,
.kjc-apie-sec li,
.kjc-apie-sec blockquote,
.kjc-apie-sec strong,
.kjc-apie-sec em {
	font-family: 'Plus Jakarta Sans', Arial, sans-serif !important;
}

/* headings → navy; first heading flush to the section padding */
.kjc-apie-sec h1,
.kjc-apie-sec h2,
.kjc-apie-sec h3 {
	color: #000000 !important;
}
/* (a blanket h2 margin-top reset used to live here — it crushed the authored
   2.5rem gap above second headings inside a band; the :first-child rule below
   already handles the flush-top case) */
.kjc-apie-sec h3 { margin-top: 1.75rem !important; }
.kjc-apie-sec > .wp-block-group__inner-container > :first-child { margin-top: 0 !important; }
/* Only the PALE callout/note boxes (#E5F4FB / #F2FAFD) get frosted so they read
   as a soft lighter tint of their band; the bold brand-colour stat cards
   (#1EA0DC / #FFDE45 / #35B177) and white logo cards keep their solid fill. */
.kjc-apie-sec .wp-block-group.has-background[style*="#E5F4FB"],
.kjc-apie-sec .wp-block-column.has-background[style*="#E5F4FB"],
.kjc-apie-sec .wp-block-group.has-background[style*="#F2FAFD"] {
	background-color: rgba(255, 255, 255, 0.34) !important;
	border-left-color: rgba(255, 255, 255, 0.6) !important;
}
/* sections + dividers flush, no gaps */
.kjc-apie-sec,
.kjc-band-stack {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/* Education-film cards (e.g. VR the Future page): responsive grid of white
   cards with a brand-blue left accent. Titles + body are black per the
   .kjc-apie-sec rules above; hierarchy comes from size + weight. */
.kjc-edu-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 1rem;
	margin-top: 1.5rem;
}
.kjc-edu-card {
	background: #FFFFFF;
	border-left: 4px solid #1EA0DC;
	padding: 1.5rem 1.5rem 1.6rem;
}
.kjc-apie-sec .kjc-edu-card h3 {
	margin-top: 0 !important;
	margin-bottom: 0.5rem;
	font-size: 1.15rem;
	font-weight: 500;
	line-height: 1.25;
}
.kjc-apie-sec .kjc-edu-card p {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.6;
}

/* ==========================================================================
   Naujienos archive page (page-id-16): yellow top, green bottom, no white gaps
   ========================================================================== */
body.page-id-16 {
	background-color: #FFEB94 !important;
}
/* Close the gap above the yellow title band and below the green posts band */
body.page-id-16 .content-area,
body.page-id-16 #main,
body.page-id-16 main#inner-wrap,
body.page-id-16 .entry-content-wrap,
body.page-id-16 article.entry {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	background-color: transparent !important;
}
/* Any leftover gap below the green posts band → green */

/* ==========================================================================
   Single post: yellow page background, white text card, green strip below Similar Posts
   ========================================================================== */
/* Brand light-blue backdrop outside the post column (body + outer containers) —
   matches the homepage Naujienos band; the post column itself stays white. */
body.single-post,
body.single-post .content-container,
body.single-post .site-main,
body.single-post main#inner-wrap,
body.single-post #primary {
	background-color: #84D6F2 !important;
}
/* The whole post column: featured image + title + body all on white */
body.single-post .content-wrap,
body.single-post article.entry.single-entry,
body.single-post .entry-content-wrap,
body.single-post .entry-content,
body.single-post .entry-header,
body.single-post .entry-header.post-title,
body.single-post .post-thumbnail.article-post-thumbnail {
	background-color: #FFFFFF !important;
}
/* Close the gap below Similar Posts so the footer sits flush — no yellow strip,
   and the footer's own rows (#029E55 / #027740) show their distinct colors */
body.single-post .content-area,
body.single-post #main,
body.single-post main#inner-wrap {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}
body.single-post .entry-related {
	margin-bottom: 0 !important;
}
body.single-post #colophon,
body.single-post .site-footer {
	margin-top: 0 !important;
}
/* Keep the header/navigation untouched on single posts */
body.single-post #masthead,
body.single-post .site-header,
body.single-post .site-header-row-container,
body.single-post .site-main-header-wrap,
body.single-post .header-navigation,
body.single-post #colophon,
body.single-post .site-footer {
	background-color: revert !important;
}

/* Similar / Related posts panel — sits on the same light-blue backdrop, white cards */
body.single-post .entry-related {
	background-color: #84D6F2 !important;
	padding: 3rem 0;
}
/* Force inner containers to the backdrop colour too — they otherwise pick up a
   different bg from the global .content-container rule above */
body.single-post .entry-related .entry-related-inner,
body.single-post .entry-related .entry-related-inner-content,
body.single-post .entry-related.alignfull .content-container,
body.single-post .entry-related .site-container {
	background-color: #84D6F2 !important;
}
body.single-post .entry-related .entry-related-title {
	color: #000000 !important;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	font-weight: 500;
}
/* Each related card: solid white with sharp corners */
body.single-post .entry-related .entry-list-item .entry,
body.single-post .entry-related .entry.content-bg,
body.single-post .entry-related .loop-entry {
	background-color: #FFFFFF !important;
	border-radius: 0 !important;
	overflow: hidden;
}
body.single-post .entry-related .entry-content-wrap {
	padding: 1.25rem !important;
}
body.single-post .entry-related .entry-title,
body.single-post .entry-related .entry-title a {
	color: #000000 !important;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	font-weight: 500;
}
body.single-post .entry-related .entry-title a:hover {
	color: #1EA0DC !important;
}
body.single-post .entry-related .entry-meta,
body.single-post .entry-related .entry-meta *,
body.single-post .entry-related .entry-summary,
body.single-post .entry-related .entry-summary p {
	color: #000000 !important;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}
body.single-post .entry-related .category-links a {
	color: #1EA0DC !important;
}
body.single-post .entry-related .post-more-link {
	color: #1EA0DC !important;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	font-weight: 500;
}
body.single-post .entry-related .splide__pagination button,
body.single-post .entry-related .splide__arrow {
	background-color: #FFFFFF !important;
	color: #000000 !important;
}
body.single-post .entry-content,
body.single-post .entry-content p,
body.single-post .entry-content li,
body.single-post .entry-content blockquote,
body.single-post .entry-content h1,
body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .entry-content h4,
body.single-post .entry-content h5,
body.single-post .entry-content h6,
body.single-post .entry-header .entry-title,
body.single-post .entry-header .entry-meta,
body.single-post .entry-content strong,
body.single-post .entry-content em {
	color: #000000;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}
body.single-post .entry-content a {
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}

/* ==========================================================================
   Naujienos (Latest posts) on light blue panel
   ========================================================================== */
.kjc-news-wrap {
	background-color: #84D6F2 !important;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-top: 4rem !important;
	padding-bottom: 4rem !important;
	padding-left: clamp(1.25rem, 4vw, 3rem) !important;
	padding-right: clamp(1.25rem, 4vw, 3rem) !important;
}
.kjc-news-wrap h2 { color: #FFFFFF; }
.kjc-news-wrap .wp-block-latest-posts.is-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.75rem;
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
}
.kjc-news-wrap .wp-block-latest-posts__list li {
	background: #FFFFFF;
	border-radius: 0;
	overflow: hidden;
	box-shadow: 0 4px 18px rgba(2, 119, 64, 0.10);
	display: flex;
	flex-direction: column;
}
.kjc-news-wrap .wp-block-latest-posts__featured-image {
	margin: 0;
}
.kjc-news-wrap .wp-block-latest-posts__featured-image img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
}
.kjc-news-wrap .wp-block-latest-posts__list li > a {
	display: block;
	padding: 1.25rem 1.25rem 0;
	color: #1EA0DC;
	font-weight: 500;
	font-size: 1.1rem;
	line-height: 1.35;
	text-decoration: none;
}
.kjc-news-wrap .wp-block-latest-posts__list li > a:hover {
	color: #000000;
}
.kjc-news-wrap .wp-block-latest-posts__post-date {
	display: block;
	padding: 0.5rem 1.25rem;
	color: #000000;
	font-size: 0.85rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}
.kjc-news-wrap .wp-block-latest-posts__post-excerpt {
	padding: 0.25rem 1.25rem 1.25rem;
	color: #000000;
	font-size: 0.95rem;
	line-height: 1.5;
}
/* Interactive (same as the veiklos sritys cards): the post lifts and a brand
   STAIRCASE "steps in" from the bottom on hover. Each post = a colour family +
   stair pattern. Reserve bottom space so the band never overlaps the excerpt. */
.kjc-news-wrap .wp-block-latest-posts__list li {
	position: relative;
	padding-bottom: 1.9rem;
	transition: transform .4s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease;
}
.kjc-news-wrap .wp-block-latest-posts__list li::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 0;
	background-image: var(--kjc-step-img);
	background-size: 100% 40px;
	background-position: center bottom;
	background-repeat: no-repeat;
	transition: height .42s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}
.kjc-news-wrap .wp-block-latest-posts__list li:hover {
	transform: translateY(-7px);
	box-shadow: 0 20px 30px -14px rgba(2, 119, 64, 0.4);
}
.kjc-news-wrap .wp-block-latest-posts__list li:hover::after { height: 40px; }
.kjc-news-wrap .wp-block-latest-posts__list li:nth-child(1) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2335B177'%3E%3Crect%20x='0'%20y='72'%20width='300'%20height='28'/%3E%3Crect%20x='300'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='600'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='900'%20y='18'%20width='300'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-news-wrap .wp-block-latest-posts__list li:nth-child(2) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%231EA0DC'%3E%3Crect%20x='0'%20y='18'%20width='300'%20height='82'/%3E%3Crect%20x='300'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='600'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='900'%20y='72'%20width='300'%20height='28'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-news-wrap .wp-block-latest-posts__list li:nth-child(3) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23FFDE45'%3E%3Crect%20x='0'%20y='66'%20width='400'%20height='34'/%3E%3Crect%20x='400'%20y='42'%20width='400'%20height='58'/%3E%3Crect%20x='800'%20y='18'%20width='400'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
@media (prefers-reduced-motion: reduce) {
	.kjc-news-wrap .wp-block-latest-posts__list li,
	.kjc-news-wrap .wp-block-latest-posts__list li::after { transition: none; }
}
@media (max-width: 850px) {
	.kjc-news-wrap .wp-block-latest-posts.is-grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Informacinių svetainių sąrašas — band colour comes from the page content
   (currently Žemynas 5.1 #67C599); this class only forces the full-bleed
   layout so the band spans edge to edge.
   ========================================================================== */
.kjc-info-wrap {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-top: 4rem !important;
	padding-bottom: 4rem !important;
	padding-left: clamp(1.25rem, 4vw, 3rem) !important;
	padding-right: clamp(1.25rem, 4vw, 3rem) !important;
}
.kjc-info-wrap h2 { color: #000000; }
.kjc-info-wrap .kjc-info-links {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: 1100px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.6rem 0.75rem;
}
.kjc-info-wrap .kjc-info-links li {
	margin: 0;
}
.kjc-info-wrap .kjc-info-links a {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.6rem 1rem;
	background: rgba(255, 255, 255, 0.55);
	border-radius: 999px;
	color: #000000;
	text-decoration: none;
	font-weight: 500;
	font-size: 0.95rem;
	line-height: 1.2;
	transition: background 0.15s ease, transform 0.15s ease;
}
.kjc-info-wrap .kjc-info-links a:hover {
	background: #FFFFFF;
	transform: translateY(-2px);
	color: #000000;
}
.kjc-info-wrap .kjc-info-links .kjc-arrow {
	font-size: 0.95rem;
	flex-shrink: 0;
	opacity: 0.7;
}
.kjc-info-wrap .kjc-info-links a:hover .kjc-arrow {
	opacity: 1;
}

/* ==========================================================================
   Calendar (Tribe events embed) — band colour comes from the page content
   (currently Krantas 5.1 #FFEB94); this class only forces the full-bleed
   layout so the band spans edge to edge.
   ========================================================================== */
.kjc-calendar-wrap {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-top: 4rem !important;
	padding-bottom: 4rem !important;
	padding-left: clamp(1.25rem, 4vw, 3rem) !important;
	padding-right: clamp(1.25rem, 4vw, 3rem) !important;
}
.kjc-calendar-wrap h2,
.kjc-calendar-wrap h3,
.kjc-calendar-wrap p {
	color: #000000;   /* black on the Krantas yellow band (brandbook) */
}
.kjc-calendar-wrap iframe[data-tec-events-ece-iframe="true"] {
	border-radius: 0;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
	max-width: 1100px;
	margin: 0 auto;
	display: block;
}

/* Same forced full-bleed for events list panel */

/* ==========================================================================
   Upcoming events (Tribe events list) on green panel
   ========================================================================== */

/* ==========================================================================
   Partner logos row (Jungtys, JRA, EU funding)
   ========================================================================== */
.kjc-partner-logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: clamp(1.5rem, 4vw, 3rem);
	margin: 0 0 2.5rem;
	padding: 1.25rem 0;
	border-top: 1px solid #E5F4FB;
	border-bottom: 1px solid #E5F4FB;
}
.kjc-partner-logos img {
	height: 56px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	display: block;
}
.kjc-partner-logos.kjc-logos-center {
	justify-content: center;
}
.kjc-partner-logos.kjc-logos-lg-row img {
	height: 80px;
}
.kjc-partner-logos.kjc-logos-lg-row img.kjc-logo-xl {
	height: 116px;
}
.kjc-partner-logos img.kjc-logo-md {
	height: 72px;
}
.kjc-partner-logos img.kjc-logo-lg {
	height: 90px;
}
@media (max-width: 600px) {
	.kjc-partner-logos {
		justify-content: center;
		gap: 1.25rem;
	}
	.kjc-partner-logos img {
		height: 44px;
	}
	.kjc-partner-logos img.kjc-logo-md {
		height: 56px;
	}
	.kjc-partner-logos img.kjc-logo-lg {
		height: 70px;
	}
	.kjc-partner-logos.kjc-logos-lg-row img {
		height: 60px;
	}
	.kjc-partner-logos.kjc-logos-lg-row img.kjc-logo-xl {
		height: 78px;
	}
}

/* ==========================================================================
   Klaipėda offset-bands hero (sea → sand → land)
   ========================================================================== */

/* Homepage: kill leftover top spacing/padding around the hero */
body.home .entry-content,
body.page-id-15 .entry-content,
body.home .content-container,
body.page-id-15 .content-container {
	padding-top: 0 !important;
	margin-top: 0 !important;
}
body.home .entry-content > *:first-child,
body.page-id-15 .entry-content > *:first-child {
	margin-top: 0 !important;
}
body.home .kjc-band-hero,
body.page-id-15 .kjc-band-hero {
	margin-top: 0 !important;
}
/* Brand band dividers sit flush between full-bleed sections — no gaps */
body.home .kjc-band-divider,
body.page-id-15 .kjc-band-divider {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}
/* Drop Kadence's bottom gap so the final divider meets the footer flush
   (the footer's top row is #029E55, matching the last divider's bottom).
   The content sits on a white "card" (article.content-bg) whose wrapper has
   2rem bottom padding — that plus the content-area margin is the white strip
   under the last divider, so zero both. */
body.home .content-area,
body.page-id-15 .content-area,
body.home #main,
body.page-id-15 #main,
body.home .content-container,
body.page-id-15 .content-container,
body.home article.entry,
body.page-id-15 article.entry,
body.home .entry-content-wrap,
body.page-id-15 .entry-content-wrap,
body.home .entry-content,
body.page-id-15 .entry-content {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

/* Respect reduced-motion (no transforms) — covers the LIVE hover-lift
   elements (the old kjc-contact-* selectors matched nothing anymore) */
@media (prefers-reduced-motion: reduce) {
	.kjc-social-chip,
	.kjc-hero-cta,
	.kjc-hero-cta__arrow,
	.kjc-news-all a {
		transition: none !important;
	}
	.kjc-social-chip:hover,
	.kjc-social-chip:focus-visible,
	.kjc-hero-cta:hover,
	.kjc-hero-cta:focus-visible,
	.kjc-news-all a:hover,
	.kjc-news-all a:focus-visible {
		transform: none !important;
	}
}


/* --- Title band: short Lithuanian intro line under the "Naujienos" H1 --- */
/* Naujienos blue title hero (#32BBE9) — big white title. Gives the top blue
   a purpose (the title) instead of empty stepped bands; the #1EA0DC header
   steps into it, like the homepage hero. */

/* --- News search bar in the yellow title band (sharp, brand) --- */
/* Trim the empty space in the yellow band that holds the intro + search */

/* --- Posts band shell: centre + width-cap the query inside the green band --- */

/* --------------------------------------------------------------------------
   The feed — ONE post-template rendered as a responsive CSS grid.
   Default = 3 columns; the FIRST item spans all columns as a wide hero row.
   -------------------------------------------------------------------------- */
/* The newest post takes the whole first row as the featured hero */

/* --------------------------------------------------------------------------
   Shared card chrome — white, sharp, soft brand-green shadow, hover lift,
   blue top-edge accent that reveals on hover.
   -------------------------------------------------------------------------- */
/* Core wraps group children in an .wp-block-group__inner-container; that
   wrapper is the real flex parent, so it must inherit the card's layout. */

/* Featured image (links to the post) — never look like a default blue link */

/* Card body fills remaining height so the read-more pins to the bottom */
/* The body's own inner-container holds meta/title/excerpt/more — make IT the
   vertical flex column so margin-top:auto on the read-more works. */

/* --------------------------------------------------------------------------
   GRID cards (posts 2+) — fixed 16:9 image on top, then the body.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   FEATURED hero (post 1) — image left / text right, taller, larger title,
   blue accent bar + yellow "Naujausia" ribbon. Stacks on mobile.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Shared inner elements — meta row (date + category chip), title, excerpt,
   read-more. Used by both the hero and the grid cards.
   -------------------------------------------------------------------------- */
.kjc-news-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem 0.8rem;
	margin: 0;
}

/* Uppercase brand-blue formatted date */
.kjc-news-date,
.kjc-news-date time {
	margin: 0;
	color: #1EA0DC;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Category chip (wp:post-terms) — sharp brand-yellow tag */
.kjc-news-chip {
	margin: 0;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	font-size: 0.7rem;
	line-height: 1;
}
.kjc-news-chip .wp-block-post-terms__separator { display: none; }
.kjc-news-chip a {
	display: inline-block;
	padding: 0.32rem 0.62rem;
	background-color: #FFDE45;
	color: #000000 !important;
	text-decoration: none;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-radius: 0;                 /* SHARP */
	transition: background-color 0.15s ease, color 0.15s ease;
}
.kjc-news-chip a + a { margin-left: 0.35rem; }
.kjc-news-chip a:hover { background-color: #029E55; color: #FFFFFF !important; }

/* Title link — navy → blue on hover */
.kjc-news-title {
	margin: 0;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	font-size: 1.18rem;
	font-weight: 500;
	line-height: 1.3;
}
.kjc-news-title a {
	color: #000000 !important;
	text-decoration: none;
	transition: color 0.15s ease;
}
.kjc-news-title a:hover { color: #1EA0DC !important; }

/* Excerpt — clamped for consistent card heights */
.kjc-news-excerpt {
	margin: 0;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
	color: #000000;
	font-size: 0.95rem;
	font-weight: 300;
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.kjc-news-excerpt p { margin: 0; }
/* Hide the excerpt block's built-in "read more" — we use wp:read-more instead */
.kjc-news-excerpt .wp-block-post-excerpt__more-text { display: none; }

/* "Skaityti daugiau →" — pinned to the card bottom, brand blue, sliding arrow */
.kjc-news-more {
	margin-top: auto;
	padding-top: 0.4rem;
	font-family: 'Plus Jakarta Sans', Arial, sans-serif;
}
.kjc-news-more a,
.kjc-news-more.wp-block-read-more {
	display: inline-flex;
	align-items: center;
	color: #1EA0DC !important;
	font-weight: 500;
	font-size: 0.92rem;
	text-decoration: none;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	transition: color 0.15s ease, transform 0.15s ease;
}
.kjc-news-more a:hover {
	color: #1EA0DC !important;
	transform: translateX(3px);
}

/* --------------------------------------------------------------------------
   Pagination — sharp white brand buttons; blue on hover; navy current page.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Friendly empty state — white card on the green band, yellow top accent.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Visible keyboard focus (accessibility) across all interactive elements.
   -------------------------------------------------------------------------- */
.kjc-news-title a:focus-visible,
.kjc-news-more a:focus-visible,
.kjc-news-chip a:focus-visible {
	outline: 3px solid #000000;
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Responsive — column count is handled by auto-fit; here the hero stacks.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Respect reduced motion.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.kjc-news-more a {
		transition: none !important;
	}
}

/* ==========================================================================
   Brandbook typography compliance: text must be black / white / palette-blue.
   The primary nav sits on the blue (#1EA0DC) header, so hover/active links stay
   WHITE (not the old yellow text) — the brand-yellow stays only as a decorative
   underline accent (an underline is decoration, not font colour).
   ========================================================================== */
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover,
.main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a,
.main-navigation .primary-menu-container > ul > li.menu-item.current-menu-ancestor > a {
	color: #FFFFFF !important;
	text-decoration: underline;
	text-decoration-color: #FFDE45;
	text-decoration-thickness: 3px;
	text-underline-offset: 6px;
}

/* ==========================================================================
   Projektai — vertical project TIMELINE (year nodes + image card per project).
   White cards on the brand band; connector line + year circles in brand blue.
   ========================================================================== */
/* connector line: from this item's year circle down into the next item's circle */
.kjc-tl-btn {
	display: inline-block;
	background: #1EA0DC;
	color: #FFFFFF;
	font-weight: 500;
	text-decoration: none;
	padding: 0.8rem 1.5rem;
	transition: background .25s ease;
}
.kjc-tl-btn:hover,
.kjc-tl-btn:focus-visible { background: #000000; }
.kjc-tl-btn:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 2px; }

/* ==========================================================================
   Apie — interactive accordion (native <details>) categorising the work forms.
   White cards on the band; blue titles, black body, +/− toggle. No JS.
   ========================================================================== */
.kjc-acc {
	max-width: 840px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
}
.kjc-acc-item {
	background: #FFFFFF;
	box-shadow: 0 12px 28px -18px rgba(2, 119, 64, 0.4);
}
.kjc-acc-item > .kjc-acc-head {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.15rem clamp(1.25rem, 3vw, 1.75rem);
	font-weight: 500;
	color: #1EA0DC;
	user-select: none;
}
.kjc-acc-item > .kjc-acc-head::-webkit-details-marker { display: none; }
.kjc-acc-title { font-size: clamp(1.1rem, 2.4vw, 1.3rem); line-height: 1.3; }
.kjc-acc-item > .kjc-acc-head:hover .kjc-acc-title { text-decoration: underline; text-underline-offset: 4px; }
.kjc-acc-item:focus-within > .kjc-acc-head { outline: 3px solid rgba(30,160,220,0.4); outline-offset: -3px; }
/* +/− icon */
.kjc-acc-icon { position: relative; width: 22px; height: 22px; flex: 0 0 auto; }
.kjc-acc-icon::before,
.kjc-acc-icon::after {
	content: "";
	position: absolute;
	background: #1EA0DC;
	border-radius: 2px;
}
.kjc-acc-icon::before { left: 0; top: 10px; width: 22px; height: 3px; }
.kjc-acc-icon::after { left: 10px; top: 0; width: 3px; height: 22px; transition: transform .3s ease; }
.kjc-acc-item[open] .kjc-acc-icon::after { transform: scaleY(0); }
.kjc-acc-body {
	padding: 0 clamp(1.25rem, 3vw, 1.75rem) 1.6rem;
	color: #000000;
	animation: kjc-acc-in .32s ease;
}
@keyframes kjc-acc-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.kjc-acc-body p { line-height: 1.7; margin: 0 0 1rem; }
.kjc-acc-body ul { line-height: 1.75; margin: 0 0 1.1rem; padding-left: 1.2rem; }
.kjc-acc-body li { margin-bottom: 0.3rem; }
.kjc-acc-subh { font-weight: 500; margin: 1.25rem 0 0.5rem !important; }
.kjc-acc-tag {
	border-left: 4px solid #1EA0DC;
	padding-left: 1rem;
	font-style: italic;
}
.kjc-acc-note {
	border-left: 4px solid #1EA0DC;
	padding-left: 1rem;
}
/* topic chips */
.kjc-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1.25rem; }
.kjc-chip {
	background: #1EA0DC;
	color: #FFFFFF;
	font-size: 0.92rem;
	font-weight: 500;
	padding: 0.45rem 0.9rem;
}
/* nested sub-accordion */
.kjc-acc-sub {
	border-top: 1px solid rgba(30,160,220,0.25);
	margin-top: 0.5rem;
}
.kjc-acc-sub > summary {
	list-style: none;
	cursor: pointer;
	color: #1EA0DC;
	font-weight: 500;
	font-size: 0.95rem;
	padding: 0.9rem 0 0.6rem;
	user-select: none;
}
.kjc-acc-sub > summary::-webkit-details-marker { display: none; }
/* alt-text syntax keeps the +/− out of the accessible name (AT announced
   "+ Institucinės formos" before) */
.kjc-acc-sub > summary::before { content: "+ " / ""; font-weight: 500; }
.kjc-acc-sub[open] > summary::before { content: "− " / ""; }
.kjc-acc-sub-body { animation: kjc-acc-in .32s ease; }
.kjc-acc-btn { margin-top: 0.5rem; }

@media (prefers-reduced-motion: reduce) {
	.kjc-acc-body, .kjc-acc-sub-body { animation: none; }
	.kjc-acc-icon::after { transition: none; }
}

/* ==========================================================================
   Sticky header (Kadence native sticky enabled via theme mod header_sticky)
   -------------------------------------------------------------------------
   When the main row becomes fixed on scroll, Kadence's higher-specificity
   header_wrap_background rule repaints the inner container #ffffff — which
   would hide the white nav text. Keep the fixed bar on the brand blue so it
   reads identically to the at-rest header, and add a soft shadow so it floats
   cleanly above the coloured content bands.
   ========================================================================== */
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) > .site-header-row-container-inner {
	background: #1EA0DC !important;
}
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start):not(.item-at-start) {
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}


/* ==========================================================================
   2026-07 audit fixes
   ========================================================================== */
/* Kadence's generated '.wp-site-blocks .post-title h1{font-weight:700}' wins
   over the global h1 rule, and 700 isn't loaded — the browser faux-bolds the
   article title. Brandbook allows 300/500 only. */
body.single-post .post-title h1,
.wp-site-blocks .post-title h1 {
	font-weight: 500 !important;
}

/* Links inside the brand colour bands resolved to #1EA0DC (1.5–2.5:1 on the
   band colours). Black underlined links pass on every band (7.7:1+) and stay
   within the brandbook text palette. Buttons, chips, the hero CTA and the
   hover-step card links keep their own component styling. */
.kjc-apie-sec a:not(.wp-block-button__link):not(.kjc-tl-btn):not(.kjc-social-chip):not(.kjc-hero-cta):not(.kjc-veikla-card__link) {
	color: #000000 !important;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}
.kjc-apie-sec a:not(.wp-block-button__link):not(.kjc-tl-btn):not(.kjc-social-chip):not(.kjc-hero-cta):not(.kjc-veikla-card__link):hover,
.kjc-apie-sec a:not(.wp-block-button__link):not(.kjc-tl-btn):not(.kjc-social-chip):not(.kjc-hero-cta):not(.kjc-veikla-card__link):focus-visible {
	text-decoration-thickness: 3px;
}
/* Hover-step card titles: black, no underline at rest (the card itself lifts
   and reveals the staircase); underline appears on hover/focus like homepage */
.kjc-apie-sec .kjc-veikla-card__link {
	color: #000000 !important;
	text-decoration: none;
}
.kjc-veikla-card:hover .kjc-veikla-card__link,
.kjc-veikla-card:focus-within .kjc-veikla-card__link {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* Homepage events-calendar section anchor (linked from DUK) */
#renginiai { scroll-margin-top: 110px; }

/* ==========================================================================
   2026-07-04: blue-on-white text → black (user decision). #1EA0DC on white is
   ~2.9:1 (fails WCAG 1.4.3). Blue stays for icons, buttons and backgrounds.
   ========================================================================== */
.kjc-htl-body h3,
body.search .entry-title a,
body.category .entry-title a,
.kjc-news-wrap .wp-block-latest-posts__list li > a,
.kjc-acc-head,
.kjc-acc-sub > summary,
.kjc-news-date,
.kjc-news-date time {
	color: #000000 !important;
}
.kjc-htl-link,
body.search .post-more-link,
body.category .post-more-link,
body.single-post .entry-related .post-more-link,
body.single-post .entry-related .category-links a,
.kjc-news-more a,
.kjc-news-more.wp-block-read-more,
.kjc-visit-loc__dir {
	color: #000000 !important;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}
body.single-post .entry-related .entry-title a:hover,
.kjc-news-title a:hover {
	color: #000000 !important;
	text-decoration: underline;
}

/* Privatumo politika (page 3): framed treatment — band stacks are injected by
   functions.php (kjc_is_brand_framed), the legal text sits on a white card. */
body.page-id-3 #inner-wrap {
	background: #84D6F2 !important;
}
body.page-id-3 .content-container,
body.page-id-3 #main,
body.page-id-3 .content-area {
	background: transparent !important;
}
body.page-id-3 article.content-bg {
	background: #FFFFFF !important;
	padding: clamp(1.75rem, 4vw, 3rem);
	box-shadow: none;
	border-radius: 0;
}
body.page-id-3 .content-area {
	margin-top: 2.5rem;
	margin-bottom: 2.5rem;
}

/* "Lengvai suprantama kalba / Mūsų taisyklės" line in the visit block */
.kjc-easy-link {
	text-align: center;
	margin-top: 1rem;
}
.kjc-easy-link a {
	color: #FFFFFF !important;
	font-weight: 500;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* New wave/tetrapod logo (2026-07): more detailed than the old diamond —
   give it a little more presence in the 80px header bar. */
.site-branding a.brand img.custom-logo {
	max-height: 66px;
	width: auto;
}

/* EN page offer grid reuses the veikla hover-step cards in a 5-card layout —
   cards 4-5 need their own baked-colour step patterns (the homepage grid has
   only 3 cards, so these nth-child slots never matched before). */
.kjc-veikla-card:nth-child(4) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%235BC9ED'%3E%3Crect%20x='0'%20y='18'%20width='300'%20height='82'/%3E%3Crect%20x='300'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='600'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='900'%20y='72'%20width='300'%20height='28'/%3E%3C/g%3E%3C/svg%3E");
}
.kjc-veikla-card:nth-child(5) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2367C599'%3E%3Crect%20x='0'%20y='18'%20width='400'%20height='82'/%3E%3Crect%20x='400'%20y='42'%20width='400'%20height='58'/%3E%3Crect%20x='800'%20y='66'%20width='400'%20height='34'/%3E%3C/g%3E%3C/svg%3E");
}
#visit-us { scroll-margin-top: 110px; }
/* photo captions inside colour-band sections stay black */
.kjc-apie-sec .kjc-photo-grid figcaption { color: #000000; }

/* EN offer grid: 3 columns max so five cards fall 3+2 instead of leaving a
   lone orphan on the second row */
.kjc-en-offer {
	grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
}

/* ---------------------------------------------------------------------------
   WP Accessibility toolbar (text size / contrast)
   ---------------------------------------------------------------------------
   The plugin ships a neutral grey widget that reads as an unstyled add-on. These
   rules put it inside the brandbook: Jūra blue at rest, black on hover, and
   Krantas yellow with black glyphs when a mode is switched ON, so the active
   state is obvious without inventing a colour. Anchored to the middle of the
   left edge, which keeps it clear of the sticky header, the social icons and the
   cookie banner in the bottom-right. This stylesheet loads after the plugin's,
   so no !important is needed.
   --------------------------------------------------------------------------- */
.a11y-toolbar,
.a11y-toolbar.custom-location {
	/* The plugin adds .custom-location (position:absolute;top:0) whenever its
	   location option is unset rather than empty, which parks the toolbar on top
	   of the header. Pin it to the viewport regardless. */
	position: fixed;
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
}
.a11y-toolbar ul {
	overflow: hidden;
	border-radius: 0 10px 10px 0;
	box-shadow: 0 6px 20px rgba(20, 40, 60, 0.24);
}
.a11y-toolbar ul li button {
	background: #1EA0DC;
	color: #FFFFFF;
	border-top: 1px solid rgba(255, 255, 255, 0.3);
	border-bottom: 0;
	padding: 13px 13px;
	transition: background 0.2s ease, color 0.2s ease;
}
.a11y-toolbar ul li:first-child button {
	border-top: 0;
	border-radius: 0;
}
.a11y-toolbar ul li:last-child button {
	border-radius: 0;
}
.a11y-toolbar ul li button:hover,
.a11y-toolbar ul li button:focus-visible {
	background: #000000;
	color: #FFFFFF;
}
/* Toggled on: yellow + black is an approved brandbook pairing and reads clearly
   as "this mode is currently active". */
.a11y-toolbar ul li button.active {
	background: #FFDE45;
	color: #000000;
	border-bottom: 0;
}
.a11y-toolbar ul li button.active:hover,
.a11y-toolbar ul li button.active:focus-visible {
	background: #FFEB94;
	color: #000000;
}
/* Phones: most visitors here. Keep the toolbar available but tuck it lower so it
   never lands on the logo, and trim it so it takes less of a narrow screen. */
@media (max-width: 800px) {
	.a11y-toolbar,
	.a11y-toolbar.custom-location {
		top: auto;
		bottom: 12px;
		transform: none;
	}
	.a11y-toolbar ul li button {
		padding: 11px;
		font-size: 18px !important;
	}
}

/* ---------------------------------------------------------------------------
   High-contrast mode repairs
   ---------------------------------------------------------------------------
   WP Accessibility's contrast mode forces `background: black !important` using
   bare element selectors (div, p, h2 ...). This theme forces BLACK TEXT with
   class selectors, which have higher specificity and therefore survive — the
   result was black text on a black background, most visibly on /apie/.
   These rules repaint exactly those runs of text in the plugin's own contrast
   palette: #f3f3f3 for copy, #FFFF40 for links, so links stay distinguishable.
   The toolbar puts the class on <body>, so `body.contrast` is enough to outrank
   the theme's own rules, and being last in the file settles any ties.
   --------------------------------------------------------------------------- */
body.contrast .kjc-apie-sec h1,
body.contrast .kjc-apie-sec h2,
body.contrast .kjc-apie-sec h3,
body.contrast .kjc-apie-sec p,
body.contrast .kjc-apie-sec li,
body.contrast .kjc-veikla-card h3,
body.contrast .kjc-veikla-card p,
body.contrast .kjc-hero-cta,
body.contrast .kjc-404__btn,
body.contrast .kjc-social-chip,
body.contrast .kjc-acc__head,
body.contrast .kjc-edu-card,
body.contrast .kjc-edu-card *,
body.contrast .kjc-gallery-title,
body.contrast figcaption,
body.contrast .entry-related .entry-related-title,
body.contrast .entry-related .entry-meta,
body.contrast .entry-related .entry-meta *,
body.contrast .entry-related .entry-summary,
body.contrast .entry-related .splide__pagination button,
body.contrast .entry-related .splide__arrow {
	color: #f3f3f3 !important;
}
body.contrast .kjc-apie-sec a,
body.contrast .kjc-news-title a,
body.contrast .kjc-news-chip a,
body.contrast .kjc-htl-link,
body.contrast .kjc-veikla-card__link,
body.contrast .kjc-visit-loc__dir,
body.contrast .kjc-easy-link a,
body.contrast .post-more-link,
body.contrast .entry-related .entry-title,
body.contrast .entry-related .entry-title a {
	color: #FFFF40 !important;
}
/* The stepped band dividers are pure decoration drawn with background colours;
   contrast mode blacks them out, so reclaim the vertical space rather than
   leaving unexplained gaps. */
body.contrast .kjc-band-divider {
	display: none !important;
}

/* ---------------------------------------------------------------------------
   Contrast mode, part 2: decorative pseudo-elements
   ---------------------------------------------------------------------------
   a11y-contrast.css applies `background: black !important` to a selector list
   that includes EVERY element's :before and :after. This theme uses those for
   two different jobs, and both broke:

   1. Full-card overlays. `.kjc-veikla-card__link::after` is a stretched link
      covering the card (inset:0; z-index:3). Painted black it became an opaque
      rectangle hiding the photo, heading and text of all three "Mūsų veiklos
      sritys" cards — the section looked completely empty. Same pattern on the
      news cards and the project timeline. These must go back to transparent.
   2. Real UI glyphs. The accordion +/- icon is drawn as two coloured bars via
      ::before/::after. Black-on-black made the control invisible, so they are
      repainted in the contrast foreground colour instead.
   --------------------------------------------------------------------------- */
body.contrast .kjc-veikla-card__link::after,
body.contrast .kjc-veikla-card::after,
body.contrast .kjc-news-wrap .wp-block-latest-posts__list li::after,
body.contrast .kjc-htl-card::after,
body.contrast .kjc-htl-item:not(:last-child) .kjc-htl-node::after,
body.contrast .site-bottom-footer-wrap .site-footer-row-container-inner::before,
body.contrast .site-middle-footer-wrap .widget-title::after {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
}
/* The accordion open/close control and the visit-block ticks are information,
   not decoration — keep them legible against the black background. */
body.contrast .kjc-acc-icon::before,
body.contrast .kjc-acc-icon::after {
	background: #f3f3f3 !important;
	background-color: #f3f3f3 !important;
}
body.contrast .kjc-visit-pills li::before,
body.contrast .kjc-acc-sub[open] > summary::before {
	color: #f3f3f3 !important;
	background: transparent !important;
	background-color: transparent !important;
}

/* ---------------------------------------------------------------------------
   Contrast mode, part 3: the remaining forced-black selectors
   ---------------------------------------------------------------------------
   The first pass missed several rules from the 2026-07-04 "blue-on-white → black"
   batch, which use higher specificity than the generic overrides above — most
   visibly the homepage news-card titles and the accordion headings, which stayed
   black on black. Each theme selector is mirrored verbatim with a body.contrast
   prefix so it always outranks the original. `.contrast` sits on <body>, so
   page-context classes are chained (body.contrast.search) rather than nested.
   --------------------------------------------------------------------------- */
body.contrast .kjc-htl-body h3,
body.contrast .kjc-acc-head,
body.contrast .kjc-acc-sub > summary,
body.contrast .kjc-news-date,
body.contrast .kjc-news-date time,
body.contrast .kjc-apie-sec p:not(.has-text-color),
body.contrast .kjc-apie-sec li:not(.has-text-color),
body.contrast .kjc-apie-sec blockquote:not(.has-text-color),
body.contrast.single-post .entry-related .entry-summary p {
	color: #f3f3f3 !important;
}
body.contrast .kjc-news-wrap .wp-block-latest-posts__list li > a,
body.contrast .kjc-apie-sec a:not(.wp-block-button__link):not(.kjc-tl-btn):not(.kjc-social-chip):not(.kjc-hero-cta):not(.kjc-veikla-card__link),
body.contrast .kjc-apie-sec .kjc-veikla-card__link,
body.contrast .kjc-news-more a,
body.contrast .kjc-news-more.wp-block-read-more,
body.contrast.search .entry-title a,
body.contrast.category .entry-title a,
body.contrast.search .post-more-link,
body.contrast.category .post-more-link,
body.contrast.single-post .entry-related .post-more-link,
body.contrast.single-post .entry-related .category-links a,
body.contrast.single-post .entry-related .entry-title a {
	color: #FFFF40 !important;
}

/* ===========================================================================
   Skaitmeninis jaunimo centras (page 33) — interactive layer
   ===========================================================================
   Added as PROGRESSIVE ENHANCEMENT. None of this exists in the page content:
   a script scoped to this page builds the markup from text already on the page.
   With JavaScript off, or if the script fails, the page renders exactly as it
   did before — every fact stays visible. That is deliberate, so the "keep the
   old page as a backup" requirement holds without a second copy going stale.

   Colours stay inside the brandbook: white cards, black text, and palette
   fills (#027740, #1EA0DC, #FFDE45). The band chain and stair dividers are
   untouched.
   ========================================================================= */

/* --- live implementation progress, in the #32BBE9 hero band --------------- */
.kjc-pp-progress {
	margin: 0 0 1.75rem;
	padding: 1.15rem 1.35rem 1.25rem;
	background: #FFFFFF;
	border-radius: 0;
	box-shadow: 0 10px 26px -18px rgba(2, 119, 64, 0.55);
}
.kjc-pp-progress__head {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem 0.9rem;
	margin: 0 0 0.75rem;
}
.kjc-pp-progress__label {
	font-size: 0.82rem; letter-spacing: 0.14em; text-transform: uppercase;
	font-weight: 500; color: #000000; margin: 0;
}
.kjc-pp-progress__pct {
	margin: 0 0 0 auto; font-size: 1.35rem; font-weight: 500; line-height: 1;
	color: #027740; font-variant-numeric: tabular-nums;
}
.kjc-pp-progress__track {
	position: relative; height: 12px; border-radius: 999px;
	background: rgba(0, 0, 0, 0.10); overflow: hidden;
}
.kjc-pp-progress__fill {
	position: absolute; inset: 0 auto 0 0; width: 0;
	background: #027740; border-radius: 999px;
	transition: width 1.4s cubic-bezier(.22, .61, .36, 1);
}
.kjc-pp-progress__scale {
	display: flex; justify-content: space-between; gap: 1rem;
	margin: 0.6rem 0 0; padding: 0; list-style: none;
	font-size: 0.82rem; color: #000000;
}
.kjc-pp-progress__scale b { font-weight: 500; }
.kjc-pp-progress__note { margin: 0.45rem 0 0; font-size: 0.8rem; color: #000000; opacity: .68; }

/* --- partner cards, in the #5BC9ED band ---------------------------------- */
.kjc-pp-partners {
	list-style: none; margin: 0 0 2rem; padding: 0;
	display: grid; gap: 0.85rem;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.kjc-pp-partners li {
	margin: 0; padding: 1rem 1.15rem;
	background: #FFFFFF; color: #000000;
	display: flex; flex-direction: column; gap: 0.4rem;
	box-shadow: 0 8px 20px -16px rgba(2, 119, 64, 0.6);
	transition: transform .3s cubic-bezier(.22, .61, .36, 1), box-shadow .3s ease;
}
.kjc-pp-partners li:hover { transform: translateY(-4px); box-shadow: 0 16px 26px -18px rgba(2, 119, 64, 0.75); }
.kjc-pp-partners__name { font-weight: 500; line-height: 1.4; }
.kjc-pp-partners__country {
	align-self: flex-start; font-size: 0.72rem; letter-spacing: 0.1em;
	text-transform: uppercase; font-weight: 500;
	padding: 0.22rem 0.6rem; border-radius: 999px;
	background: #FFDE45; color: #000000;
}
.kjc-pp-partners__country--lv { background: #67C599; }

/* --- counters ------------------------------------------------------------ */
.kjc-pp-count { font-variant-numeric: tabular-nums; }

/* --- funding split, inside the pale card in the #35B177 band ------------- */
.kjc-pp-fund { margin: 1.1rem 0 0; }
.kjc-pp-fund__bar {
	display: flex; height: 16px; border-radius: 999px; overflow: hidden;
	background: rgba(0, 0, 0, 0.08);
}
.kjc-pp-fund__seg { width: 0; transition: width 1.4s cubic-bezier(.22, .61, .36, 1); }
.kjc-pp-fund__seg--eu { background: #027740; }
.kjc-pp-fund__seg--co { background: #1EA0DC; }
.kjc-pp-fund__legend {
	display: flex; flex-wrap: wrap; gap: 0.45rem 1.4rem;
	margin: 0.75rem 0 0; padding: 0; list-style: none;
	font-size: 0.85rem; color: #000000;
}
.kjc-pp-fund__legend li { display: flex; align-items: center; gap: 0.5rem; }
.kjc-pp-fund__dot { width: 11px; height: 11px; border-radius: 50%; flex: 0 0 auto; }
.kjc-pp-fund__dot--eu { background: #027740; }
.kjc-pp-fund__dot--co { background: #1EA0DC; }
.kjc-pp-fund__legend b { font-weight: 500; font-variant-numeric: tabular-nums; }

/* --- high-contrast mode: these are new elements, so they need the same
       treatment as the rest of the page (see the contrast blocks above) ---- */
body.contrast .kjc-pp-progress,
body.contrast .kjc-pp-partners li {
	background: #000000 !important;
	border: 1px solid #f3f3f3 !important;
}
body.contrast .kjc-pp-progress__label,
body.contrast .kjc-pp-progress__scale,
body.contrast .kjc-pp-progress__note,
body.contrast .kjc-pp-partners__name,
body.contrast .kjc-pp-fund__legend {
	color: #f3f3f3 !important;
}
body.contrast .kjc-pp-progress__pct { color: #FFFF40 !important; }
body.contrast .kjc-pp-partners__country {
	background: #f3f3f3 !important;
	color: #000000 !important;
}
body.contrast .kjc-pp-progress__track,
body.contrast .kjc-pp-fund__bar { background: #404040 !important; }
body.contrast .kjc-pp-progress__fill,
body.contrast .kjc-pp-fund__seg--eu,
body.contrast .kjc-pp-fund__dot--eu { background: #FFFF40 !important; }
body.contrast .kjc-pp-fund__seg--co,
body.contrast .kjc-pp-fund__dot--co { background: #00b0FF !important; }

@media (prefers-reduced-motion: reduce) {
	.kjc-pp-progress__fill,
	.kjc-pp-fund__seg,
	.kjc-pp-partners li { transition: none !important; }
}

/* ===========================================================================
   Hero logo — horizontal lockup variant (2026-09-10)
   ===========================================================================
   The hero logo used to be a near-square badge, so the original rules size it
   by HEIGHT (clamp(190px, 38vh, 360px)) against aspect-ratio 492/507, and mask
   the gloss with that badge's PNG. The new mark is a 2.8:1 horizontal lockup,
   so all three of those assumptions have to change: size by width, correct the
   ratio, and re-point the gloss mask, otherwise the shine is clipped to the
   silhouette of a logo that is no longer on the page.

   The width ceiling is deliberately modest. The supplied artwork is only 337px
   wide at source, so anything larger than roughly 520px starts to look soft.
   Raise it once a vector or high-resolution original is available.
   ========================================================================= */
.kjc-logo-hero--lockup .kjc-logo-hero__media {
	height: auto;
	/* The supplied artwork is 4096px wide, so the old 520px ceiling — which
	   existed only to hide upscaling of the low-res original — is gone. */
	width: clamp(280px, 58vw, 640px);
	aspect-ratio: 4096 / 1198;
}

/* A badge can bob happily. A line of type doing the same reads as unsteady, so
   the ambient motion is reduced to a slow vertical drift with no sway. */
.kjc-logo-hero--lockup .kjc-logo-hero__motion {
	transform-origin: 50% 50%;
	animation: kjc-logo-drift 8s ease-in-out infinite;
}
@keyframes kjc-logo-drift {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-5px); }
}

/* Hover lift, scaled down to suit a wider element. */
.kjc-logo-hero--lockup .kjc-logo-hero__media:hover,
.kjc-band-hero:hover .kjc-logo-hero--lockup .kjc-logo-hero__media {
	transform: translateY(-7px) scale(1.035);
}

/* Re-point the gloss mask at the new artwork so the shine follows the real
   silhouette of the wave, the tetrapod and the lettering. */
.kjc-logo-hero--lockup .kjc-logo-hero__gloss {
	-webkit-mask-image: url("/wp-content/uploads/2026/09/kajc-lockup-white.png");
	mask-image: url("/wp-content/uploads/2026/09/kajc-lockup-white.png");
}

@media (max-width: 767px) {
	.kjc-logo-hero--lockup .kjc-logo-hero__media {
		height: auto;
		width: min(84vw, 400px);
	}
}

/* The header lockup is wide, not square: let Kadence's square-ish logo box
   accommodate it without squashing. */
.custom-logo-link img.custom-logo {
	width: auto;
	max-height: 100%;
	object-fit: contain;
}

/* ===========================================================================
   English page (135) — live badge, events list, contact card
   ===========================================================================
   .kjc-open is filled by JS with "Open now" / "Closed · opens …" computed in
   Europe/Vilnius; it is empty (and hidden) until then, so no JS = no lie.
   Palette only: Žemynas green #67C599/#027740 for open, neutral tint for closed,
   Krantas yellow #FFDE45 for the event date chips, white cards, black text.
   ========================================================================= */
.kjc-open {
	display: inline-flex; align-items: center; gap: .4rem;
	margin-left: .45rem; padding: .22rem .65rem; border-radius: 999px;
	font-size: .76rem; font-weight: 500; letter-spacing: .05em; text-transform: uppercase;
	color: #000000; background: rgba(0, 0, 0, .08);
	vertical-align: middle; white-space: nowrap;
}
.kjc-open:empty { display: none; }
.kjc-open::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #000000; opacity: .45; flex: 0 0 auto; }
.kjc-open--yes { background: #67C599; }
.kjc-open--yes::before { background: #027740; opacity: 1; }

.kjc-edu-card .kjc-visit-loc__map { margin: .9rem 0 .6rem; }

.kjc-en-events { display: grid; gap: .85rem; margin: 0 0 1rem; }
.kjc-en-event {
	display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: start;
	background: #FFFFFF; padding: 1rem 1.15rem;
	box-shadow: 0 8px 20px -16px rgba(2, 119, 64, .6);
}
.kjc-en-event__date {
	min-width: 3.5rem; padding: .4rem .5rem; text-align: center; line-height: 1.1;
	background: #FFDE45; color: #000000;
}
.kjc-en-event__date b { display: block; font-size: 1.4rem; font-weight: 500; }
.kjc-en-event__date small { display: block; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.kjc-en-event h3 { margin: 0 0 .3rem; font-size: 1.05rem; font-weight: 500; line-height: 1.35; }
.kjc-en-event p { margin: 0; font-size: .92rem; }
.kjc-en-events__empty, .kjc-en-events__loading { margin: 0; }

.kjc-en-contact dl { display: grid; grid-template-columns: auto 1fr; gap: .5rem 1.2rem; margin: .25rem 0 0; }
.kjc-en-contact dt { font-weight: 500; }
.kjc-en-contact dd { margin: 0; }
@media (max-width: 560px) {
	.kjc-en-contact dl { grid-template-columns: 1fr; gap: .1rem; }
	.kjc-en-contact dd { margin-bottom: .65rem; }
}

/* high-contrast mode: keep the new elements legible */
body.contrast .kjc-open { background: #404040 !important; color: #f3f3f3 !important; }
body.contrast .kjc-open::before { background: #f3f3f3 !important; }
body.contrast .kjc-open--yes { background: #FFFF40 !important; color: #000000 !important; }
body.contrast .kjc-open--yes::before { background: #000000 !important; }
body.contrast .kjc-en-event { background: #000000 !important; border: 1px solid #f3f3f3 !important; }
body.contrast .kjc-en-event__date { background: #FFFF40 !important; color: #000000 !important; }
body.contrast .kjc-en-event p, body.contrast .kjc-en-contact dt, body.contrast .kjc-en-contact dd,
body.contrast .kjc-en-events__empty, body.contrast .kjc-en-events__loading { color: #f3f3f3 !important; }
body.contrast .kjc-en-event h3 a, body.contrast .kjc-en-contact a { color: #FFFF40 !important; }

/* ---------------------------------------------------------------------------
   Responsive video embed (Jungtys page) — the iframe is consent-gated by
   Complianz exactly like the map embeds; the 16:9 box keeps its size while
   the placeholder is shown, so the layout never jumps.
   ------------------------------------------------------------------------- */
.kjc-video-figure { margin: 0; max-width: 960px; }
.kjc-video { position: relative; aspect-ratio: 16 / 9; background: #000; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18); }
.kjc-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.kjc-video-figure figcaption { margin-top: 0.75rem; font-size: 0.9rem; }

/* ---------------------------------------------------------------------------
   Homepage calendar iframe (The Events Calendar "calendar embed" page,
   /calendar-embed/…/embed/). It is a full WordPress page, so every
   page-level floating widget (language floater, cookie banner + button, WP
   Accessibility toolbar) renders a second time inside the frame and shows
   up "under the calendar". Hide those copies there only; the real ones on the
   surrounding page are untouched.
   ------------------------------------------------------------------------- */
body.single-tec_calendar_embed nav.trp-language-switcher.trp-floating-switcher,
body.single-tec_calendar_embed #trp-floater-ls,
body.single-tec_calendar_embed #cmplz-manage-consent,
body.single-tec_calendar_embed #cmplz-cookiebanner-container,
body.single-tec_calendar_embed .a11y-toolbar,
body.single-tec_calendar_embed #a11y-toolbar { display: none !important; }

/* ===========================================================================
   Struktūra ir kontaktai (page 122) — interactive layer            v1.9.25
   Progressive enhancement: with JavaScript off the page is exactly its static
   self. Every rule that HIDES something first is gated on html.kjc-js, which
   only the page-122 head snippet in functions.php adds, so no JS = nothing is
   ever hidden. The footer script reveals cards and band dividers as they scroll
   in.
   Motion on pseudo-elements is height/background-size only (never transform /
   mask / clip-path on a pseudo over a transformed parent — see the veiklos
   cards reveal gotcha). Colours: palette only.
   ========================================================================= */
/* -- 1. Staff cards: a brand staircase "object" sits at the foot of every card
      (20px at rest), the card lifts and the stairs grow to 48px on hover.  -- */
body.page-id-122 .kjc-edu-card {
	position: relative;
	overflow: hidden;
	padding-bottom: 3.6rem !important;   /* room for the staircase, clear of text */
	transition: transform .4s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease, opacity .55s ease;
}
body.page-id-122 .kjc-edu-card::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 20px;
	background-image: var(--kjc-step-img);
	background-size: 100% 20px;
	background-position: center bottom;
	background-repeat: no-repeat;
	transition: height .45s cubic-bezier(.22, .61, .36, 1), background-size .45s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}
body.page-id-122 .kjc-edu-card:hover,
body.page-id-122 .kjc-edu-card:focus-within {
	transform: translateY(-6px);
	box-shadow: 0 20px 32px -16px rgba(10, 26, 74, 0.45);
}
body.page-id-122 .kjc-edu-card:hover::after,
body.page-id-122 .kjc-edu-card:focus-within::after {
	height: 48px;
	background-size: 100% 48px;
}
/* three colour families + stair patterns cycling across each grid (same SVGs
   as the homepage veiklos cards: blue ascending, yellow descending, green) */
body.page-id-122 .kjc-edu-card:nth-child(3n+1) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%231EA0DC'%3E%3Crect%20x='0'%20y='72'%20width='300'%20height='28'/%3E%3Crect%20x='300'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='600'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='900'%20y='18'%20width='300'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-122 .kjc-edu-card:nth-child(3n+2) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%23FFDE45'%3E%3Crect%20x='0'%20y='18'%20width='300'%20height='82'/%3E%3Crect%20x='300'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='600'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='900'%20y='72'%20width='300'%20height='28'/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-122 .kjc-edu-card:nth-child(3n+3) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2335B177'%3E%3Crect%20x='0'%20y='66'%20width='400'%20height='34'/%3E%3Crect%20x='400'%20y='42'%20width='400'%20height='58'/%3E%3Crect%20x='800'%20y='18'%20width='400'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}

/* -- 2. Location cards (homepage map cards reused in Asmenų aptarnavimas):
      same lift, a staircase in the header colour at the foot.             -- */
body.page-id-122 .kjc-visit-locs {
	max-width: none;
	margin-top: 1.5rem;
}
body.page-id-122 .kjc-visit-loc {
	position: relative;
	transition: transform .4s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease, opacity .55s ease;
}
body.page-id-122 .kjc-visit-loc::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 20px;
	background-image: var(--kjc-step-img);
	background-size: 100% 20px;
	background-position: center bottom;
	background-repeat: no-repeat;
	transition: height .45s cubic-bezier(.22, .61, .36, 1), background-size .45s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}
body.page-id-122 .kjc-visit-loc:nth-child(1) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%231EA0DC'%3E%3Crect%20x='0'%20y='72'%20width='300'%20height='28'/%3E%3Crect%20x='300'%20y='54'%20width='300'%20height='46'/%3E%3Crect%20x='600'%20y='36'%20width='300'%20height='64'/%3E%3Crect%20x='900'%20y='18'%20width='300'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-122 .kjc-visit-loc:nth-child(2) {
	--kjc-step-img: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='1200'%20height='100'%20viewBox='0%200%201200%20100'%20preserveAspectRatio='none'%20shape-rendering='crispEdges'%3E%3Cg%20fill='%2335B177'%3E%3Crect%20x='0'%20y='66'%20width='400'%20height='34'/%3E%3Crect%20x='400'%20y='42'%20width='400'%20height='58'/%3E%3Crect%20x='800'%20y='18'%20width='400'%20height='82'/%3E%3C/g%3E%3C/svg%3E");
}
body.page-id-122 .kjc-visit-loc:hover,
body.page-id-122 .kjc-visit-loc:focus-within {
	transform: translateY(-6px);
	box-shadow: 0 20px 32px -16px rgba(10, 26, 74, 0.45);
}
body.page-id-122 .kjc-visit-loc:hover::after,
body.page-id-122 .kjc-visit-loc:focus-within::after {
	height: 48px;
	background-size: 100% 48px;
}
body.page-id-122 .kjc-visit-loc__foot {
	padding-bottom: 2.9rem;              /* clear of the staircase */
}
body.page-id-122 .kjc-apie-sec .kjc-visit-loc__hours {
	margin: 0 0 0.6rem;
	font-size: 0.95rem;
	color: #000000;
}
body.page-id-122 .kjc-visit-loc__map {
	min-height: 240px;
}

/* -- 3. Band dividers unfold: the top-colour staircase grows down into place
      as each divider scrolls into view (uniform risers at every frame).   -- */
body.page-id-122 .kjc-band-divider::before {
	inset: auto;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	transition: height .8s cubic-bezier(.22, .61, .36, 1);
}

/* -- 4. Scroll-reveal start states (JS only) ------------------------------- */
html.kjc-js body.page-id-122 .kjc-edu-card:not(.kjc-in),
html.kjc-js body.page-id-122 .kjc-visit-loc:not(.kjc-in) {
	opacity: 0;
	transform: translateY(18px);
}
html.kjc-js body.page-id-122 .kjc-edu-card:not(.kjc-in)::after,
html.kjc-js body.page-id-122 .kjc-visit-loc:not(.kjc-in)::after {
	height: 0;
}
html.kjc-js body.page-id-122 .kjc-band-divider:not(.kjc-in)::before {
	height: 0;
}

/* -- 5. Reduced motion, print, high-contrast toolbar ----------------------- */
@media (prefers-reduced-motion: reduce) {
	body.page-id-122 .kjc-edu-card,
	body.page-id-122 .kjc-edu-card::after,
	body.page-id-122 .kjc-visit-loc,
	body.page-id-122 .kjc-visit-loc::after,
	body.page-id-122 .kjc-band-divider::before { transition: none !important; }
	body.page-id-122 .kjc-edu-card:hover,
	body.page-id-122 .kjc-visit-loc:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce), print {
	html.kjc-js body.page-id-122 .kjc-edu-card:not(.kjc-in),
	html.kjc-js body.page-id-122 .kjc-visit-loc:not(.kjc-in) { opacity: 1; transform: none; }
	html.kjc-js body.page-id-122 .kjc-edu-card:not(.kjc-in)::after,
	html.kjc-js body.page-id-122 .kjc-visit-loc:not(.kjc-in)::after { height: 20px; }
	html.kjc-js body.page-id-122 .kjc-band-divider:not(.kjc-in)::before { height: 100%; }
}
body.contrast.page-id-122 .kjc-edu-card::after,
body.contrast.page-id-122 .kjc-visit-loc::after { display: none !important; }
body.contrast.page-id-122 .kjc-edu-card,
body.contrast.page-id-122 .kjc-visit-loc { padding-bottom: 1.6rem !important; transform: none !important; box-shadow: none !important; }