/*
 * Partneriai (R12): /kvieciame-bendradarbiauti/, the architects' 5-step questionnaire (page 8900).
 * NO FRAME IS DRAWN for it, so nothing here is a drawn value: it is the live page's questionnaire
 * (same steps, questions, copy, order) set in this site's own system, read off the Kontaktai page it
 * is linked from (sections/kontaktai.css, frame 495:1451):
 *   gutters   the section gutter formula of every Kontaktai section (--mn-kt-inline): the 1176 container
 *             at 1440, never closer than the 20 px gutter
 *   page title  Geist 600 in #C69A37 on the 122 px title box, 15 under the header (a long title, so the
 *             48 px step of the size ramp, s-15, where Kontaktai's one word takes 70)
 *   card      #F8F8F8, radius 12, padding 37 / 41 / 33.72 (form card 495:1520), 439 tall at least so the
 *             five steps do not jump
 *   question  Geist 700 26/30 (the form card's title)
 *   fields    43 px, 1.86 px inside stroke #EBEBEB, radius 9.92, Geist 500 15.64, 20 in (the form's fields)
 *   choices   the form's consent box: 14.88 box, 1.24 gold ring, ticked = gold fill inside a card ring
 *   pills     gold pill 199 x 53.28 radius 36.93 with the white-to-clear stroke (the form's submit);
 *             Atgal is the branch tab's resting pill (#F2F2F2, 1 px gold stroke, #424242 label)
 *   messages  #D10000 (palette c-09) in the form's message type 13.16/18
 * Below 782 (no mobile frame; the Kontaktai rules): one column, 20 px gutter, 24 / 20 card padding.
 * assets/js/partneriai.js turns each option and field paragraph into its control; until it has run
 * (scripting on) only the invitation shows, and where scripting is off the invitation alone shows.
 * In the editor nothing is hidden: every step, message and the thank-you show stacked, to be edited.
 */

.mn-par {
	--mn-par-inline: max(var(--mn-gutter, 20px), (100% - var(--mn-content, 1176px)) / 2);
	box-sizing: border-box;
	padding: 15px var(--mn-par-inline) 63px;
	color: var(--wp--preset--color--c-02);
	font-family: var(--wp--preset--font-family--geist);
}

/* ---- page title ---- */

.mn-par > .mn-par__title {
	margin: 0 0 25px;
	padding-block: 32px;
	font-family: var(--wp--preset--font-family--geist);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--s-15);
	line-height: 1.2;
	letter-spacing: 0;
	color: var(--wp--preset--color--c-07);
}

/* ---- the card and its steps ---- */

.mn-par .mn-par__card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	min-height: 439px;
	padding: 37px 41px 33.72px;
	border-radius: 12px;
	background: var(--wp--preset--color--c-04);
}

.mn-par .mn-par__step {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: center;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
}

.mn-par .mn-par__step--0,
.mn-par .mn-par__step--thanks {
	justify-content: center;
}

.mn-par.is-par-ready .mn-par__step:not(.is-active) {
	display: none;
}

/* until the script has run, only the invitation shows; if it never runs the rest comes back after 4 s
 * (the same wait the tabs use), so a failed script costs the page nothing it had */
@keyframes mn-par-wait {
	from,
	to {
		display: none;
	}
}

@media (scripting: enabled) {
	.mn-par:not(.is-par-ready) .mn-par__step:not(.mn-par__step--0):not(.mn-par__step--thanks):not(.block-editor-block-list__block) {
		animation: mn-par-wait 4s step-end;
	}
}

/* The thank-you is shown by the script alone, after Contact Form 7 answered mail_sent, and by nothing else:
 * not by the 4 s wait above coming back, not by a browser without @media (scripting), not by a script that
 * is blocked or slow (R12-fix: the fallback used to un-hide it with no mail sent). Only the editor shows it. */
.mn-par .mn-par__step--thanks:not(.is-active):not(.block-editor-block-list__block) {
	display: none;
}

@media (scripting: none) {
	.mn-par .mn-par__step:not(.mn-par__step--0):not(.block-editor-block-list__block) {
		display: none;
	}

	.mn-par .mn-par__start {
		display: none;
	}
}

@keyframes mn-par-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
}

.mn-par.is-par-ready .mn-par__step:not(.mn-par__step--0).is-active {
	animation: mn-par-in 0.35s ease-out;
}

@media (prefers-reduced-motion: reduce) {
	.mn-par.is-par-ready .mn-par__step.is-active {
		animation: none;
	}
}

/* The Contact Form 7 mount (R12): it carries the answers and sends the mail, and nothing in its form is seen (its fields, its
 * submit and its messages are never shown; the section has its own). Since R19 it holds one more thing, Cloudflare Turnstile's
 * widget (R19, only when the operator has saved keys), and that one has to be where the visitor can click it: Cloudflare may ask for
 * a click, and a widget in a display:none box could never get one. So the mount is not display:none. Until step 5 it is rendered
 * but clipped to a 1 px line (the widget runs its check in the background, a token is ready when the visitor arrives; the script also
 * makes it inert, so no invisible control can be tabbed to); on step 5 (.is-par-at-5, set by partneriai.js) it opens under the
 * buttons, where a widget that has nothing to ask takes no room. Without scripting the first step is all there is, so the mount
 * is hidden for real. */
.mn-par .mn-par__cf7 {
	position: absolute;
	left: 0; /* no ancestor is positioned, so 100% is the window: from the left edge it can never stick out past the right one (G6: 39 px at 320) */
	box-sizing: border-box;
	width: 335px; /* the widget's own width, so it is laid out as it will be on step 5; only 1 px of it is ever on show */
	max-width: 100%;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.mn-par .mn-par__cf7 .mn-cf7__fields,
.mn-par .mn-par__cf7 .wpcf7-response-output,
.mn-par .mn-par__cf7 .screen-reader-response {
	display: none;
}

.mn-par .mn-par__cf7 .wp-block-contact-form-7-contact-form-selector,
.mn-par .mn-par__cf7 .wpcf7-form {
	margin: 0;
}

.mn-par.is-par-at-5 .mn-par__cf7 {
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip-path: none;
	white-space: normal;
}

/* the widget: as wide as the 335 px column the fields use, centred; flexible, so it never needs more than its box (300 px at
 * the least, which the 310 px a phone's card leaves holds) */
.mn-par .mn-par__cf7 .wpcf7-turnstile {
	width: 100%;
	max-width: 335px;
	margin: 0 auto;
}

/* partneriai.js sets .is-par-ts while the widget has a box (Cloudflare is asking for a click): only then does it need air above */
.mn-par.is-par-at-5.is-par-ts .mn-par__cf7 {
	margin-top: 20px;
}

@media (scripting: none) {
	.mn-par .mn-par__cf7 {
		display: none;
	}
}

/* ---- the invitation ---- */

.mn-par .mn-par__lead {
	max-width: 774px;
	margin: 0;
	font-weight: 500;
	font-size: var(--wp--preset--font-size--s-05);
	line-height: 30px;
	color: var(--wp--preset--color--c-02);
}

.mn-par .mn-par__actions {
	justify-content: center;
	margin: 41px 0 0;
}

/* ---- progress 1 - 5 (built by the script) ---- */

.mn-par .mn-par__progress {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
}

.mn-par .mn-par__dot {
	position: relative;
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 32px;
	height: 32px;
	margin: 0;
	border: 1.5px solid var(--wp--preset--color--c-15);
	border-radius: 50%;
	color: rgb(66 66 66 / 0.6);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--s-02);
	line-height: 1;
}

.mn-par .mn-par__dot + .mn-par__dot {
	margin-left: 40px;
}

.mn-par .mn-par__dot + .mn-par__dot::before {
	content: "";
	position: absolute;
	top: 50%;
	right: calc(100% + 1.5px);
	width: 40px;
	height: 2px;
	margin-top: -1px;
	background: var(--wp--preset--color--c-15);
}

.mn-par .mn-par__dot.is-active {
	border-color: var(--wp--preset--color--c-12);
	background: var(--wp--preset--color--c-12);
	color: var(--wp--preset--color--c-01);
}

/* ---- the question ---- */

.mn-par .mn-par__q {
	margin: 0;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--s-11);
	line-height: 30px;
	letter-spacing: 0;
	color: var(--wp--preset--color--c-02);
}

.mn-par .mn-par__hint {
	margin: 4px 0 0;
	font-weight: 500;
	font-size: var(--wp--preset--font-size--s-02);
	line-height: 24px;
	color: rgb(66 66 66 / 0.7);
}

/* ---- the answers ---- */

.mn-par .mn-par__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
	justify-items: start;
	box-sizing: border-box;
	width: 100%;
	max-width: 820px;
	margin: 32px auto 0;
	text-align: left;
}

.mn-par .mn-par__body > p {
	margin: 0;
}

/* step 1: three columns of radios, the "Kita" words beside them */
.mn-par .mn-par__step--1 .mn-par__body {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px 48px;
}

/* the "Kita" words' field shares its row with two answers (three columns) or one (two columns): its
 * text sits on their line (R21, operator 2026-10-21). An answer's line is 24 px tall at the row top, the
 * field's 43 px box centres its text, so the field rises by half the difference: (24 - 43) / 2. Below
 * 782 px the field has a row of its own and stays put. */
@media (min-width: 782px) {
	.mn-par .mn-par__step--1 .mn-par__body > .mn-par__field {
		margin-top: calc((24px - 43px) / 2);
	}
}

/* steps 2 and 3: two columns of boxes, centred as a pair */
.mn-par .mn-par__body--checks,
.mn-par .mn-par__body--team {
	grid-template-columns: repeat(2, minmax(0, auto));
	justify-content: center;
	gap: 22px 64px;
	width: auto;
	max-width: 100%;
}

/* step 3: the two groups are told apart by a rule */
.mn-par .mn-par__body--team {
	width: 100%;
	max-width: 864px;
	margin-top: 28px;
	padding-top: 28px;
	border-top: 1px solid var(--wp--preset--color--c-15);
}

/* step 4: two columns of fields, the portfolio link across both */
.mn-par .mn-par__body--fields {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 25px;
}

.mn-par .mn-par__body--area {
	grid-template-columns: minmax(0, 1fr);
}

.mn-par .mn-par__body .mn-par__field {
	width: 100%;
}

.mn-par .mn-par__body .mn-par__field--wide {
	grid-column: 1 / -1;
}

.mn-par .mn-par__choice {
	position: relative;
	display: inline-flex;
	align-items: flex-start;
	gap: 12px;
	cursor: pointer;
}

.mn-par .mn-par__choice input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.mn-par .mn-par__mark {
	flex: 0 0 14.88px;
	box-sizing: border-box;
	width: 14.88px;
	height: 14.88px;
	margin-top: 4.56px;
	border-radius: 2.48px;
	box-shadow: inset 0 0 0 1.24px var(--wp--preset--color--c-05);
}

.mn-par .mn-par__choice input[type="radio"] + .mn-par__mark {
	border-radius: 50%;
}

.mn-par .mn-par__choice input:checked + .mn-par__mark {
	background: var(--wp--preset--color--c-05);
	box-shadow: inset 0 0 0 1.24px var(--wp--preset--color--c-05), inset 0 0 0 3.24px var(--wp--preset--color--c-04);
}

.mn-par .mn-par__choice input:focus-visible + .mn-par__mark {
	/* the user agent's own :focus-visible ring (Firefox reads the first line, Chromium and WebKit the second) */
	outline: 1px auto Highlight;
	outline: 1px auto -webkit-focus-ring-color;
	outline-offset: 2px;
}

.mn-par .mn-par__choice.is-invalid .mn-par__mark {
	box-shadow: inset 0 0 0 1.86px var(--wp--preset--color--c-09);
}

.mn-par .mn-par__text {
	font-weight: 500;
	font-size: 15.64px;
	line-height: 24px;
	color: var(--wp--preset--color--c-02);
}

/* the fields: the Kontaktai form's own (43 px, inside stroke, no fill) */
.mn-par .mn-par__control {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: 43px;
	margin: 0;
	padding: 0 20px;
	border: 0;
	border-radius: 9.92px;
	box-shadow: inset 0 0 0 1.86px #ebebeb;
	background: transparent;
	color: var(--wp--preset--color--c-02);
	font-family: var(--wp--preset--font-family--geist);
	font-weight: 500;
	font-size: 15.64px;
	line-height: 32.23px;
	letter-spacing: 0;
	-webkit-appearance: none;
	appearance: none;
}

.mn-par textarea.mn-par__control {
	height: auto;
	min-height: 111px;
	padding: 12px 20px;
	line-height: 24px;
	resize: vertical;
}

.mn-par .mn-par__control::placeholder {
	color: var(--wp--preset--color--c-02);
	opacity: 1;
}

.mn-par .mn-par__control[aria-invalid="true"] {
	box-shadow: inset 0 0 0 1.86px var(--wp--preset--color--c-09);
}

/* each field's name for screen readers (the words are the placeholder; a label is still the name) */
.mn-par .mn-par__sr {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.mn-par .mn-par__field {
	position: relative;
}

/* Windows high contrast drops box-shadows: the controls keep a real outline there */
@media (forced-colors: active) {
	.mn-par .mn-par__control {
		border: 1px solid CanvasText;
	}

	.mn-par .mn-par__mark {
		border: 1px solid CanvasText;
	}
}

/* messages: a rule's own words (hidden until it fires) and Contact Form 7's, in the form's message type */
.mn-par .mn-par__error,
.mn-par .mn-par__live,
.mn-par .mn-par__status {
	margin: 0;
	font-weight: 500;
	font-size: 13.16px;
	line-height: 18px;
	color: var(--wp--preset--color--c-09);
}

.mn-par .mn-par__body > .mn-par__error,
.mn-par .mn-par__body > .mn-par__live {
	grid-column: 1 / -1;
}

.mn-par.is-par-ready .mn-par__error:not(.is-shown) {
	display: none;
}

.mn-par .mn-par__status {
	max-width: 820px;
	margin: 16px auto 0;
	text-align: center;
}

.mn-par .mn-par__status:empty {
	display: none;
}

/* ---- the buttons ---- */

.mn-par .mn-par__nav {
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
	margin: 36px 0 0;
}

.mn-par .mn-par__nav .wp-block-button,
.mn-par .mn-par__actions .wp-block-button {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 199px;
	max-width: 100%;
	height: 53.28px;
	margin: 0;
	border-radius: 36.93px;
}

/* the gold pill of the form's submit */
.mn-par .mn-par__next,
.mn-par .mn-par__submit,
.mn-par .mn-par__start {
	background-color: var(--wp--preset--color--c-12);
	background-image: linear-gradient(90deg, #caa140 0%, #caa140 54%, #c99d3b 63%, #c69935 78%, #c79b38 90%, #c79b38 100%);
}

.mn-par .mn-par__next::before,
.mn-par .mn-par__submit::before,
.mn-par .mn-par__start::before {
	content: "";
	position: absolute;
	inset: 0;
	padding: 1.15px;
	border-radius: inherit;
	background: linear-gradient(to bottom, rgb(255 255 255 / 0.2), rgb(255 255 255 / 0));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask-composite: exclude;
	pointer-events: none;
}

/* Atgal: the branch tab's resting pill */
.mn-par .mn-par__nav .mn-par__back {
	width: 140px;
	border: 1px solid var(--wp--preset--color--c-05);
	background: var(--wp--preset--color--c-06);
}

.mn-par .mn-par__nav .wp-block-button__link,
.mn-par .mn-par__actions .wp-block-button__link {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0 20.77px;
	border: 0;
	border-radius: inherit;
	background: transparent;
	color: var(--wp--preset--color--c-01);
	font-family: var(--wp--preset--font-family--geist);
	font-weight: 600;
	font-size: 16.16px;
	line-height: 23.08px;
	letter-spacing: 0;
	text-align: center;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.mn-par .mn-par__nav .mn-par__back .wp-block-button__link {
	color: var(--wp--preset--color--c-02);
}

/* the click area is the whole pill (base.css rings the pill itself on keyboard focus) */
.mn-par .mn-par__nav .wp-block-button__link::after,
.mn-par .mn-par__actions .wp-block-button__link::after {
	content: "";
	position: absolute;
	inset: -1px;
	border-radius: inherit;
}

.mn-par .mn-par__nav .wp-block-button__link:disabled {
	cursor: default;
	opacity: 0.7;
}

/* ---- the thank-you (the live page's step 6) ---- */

.mn-par .mn-par__thanks-icon {
	flex: none;
	width: 80px;
	height: 80px;
	margin: 0 0 28px;
	background: url("../../img/partneriai/ok.svg") no-repeat center / contain;
}

.mn-par .mn-par__thanks-title {
	margin: 0;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--s-13);
	line-height: 42px;
	color: var(--wp--preset--color--c-02);
}

.mn-par .mn-par__thanks-text {
	max-width: 620px;
	margin: 16px 0 0;
	font-weight: 500;
	font-size: 15.64px;
	line-height: 24px;
	color: var(--wp--preset--color--c-02);
}

/* ---- narrower ---- */

@media (max-width: 1023.98px) {
	.mn-par .mn-par__step--1 .mn-par__body {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 32px;
	}

	.mn-par .mn-par__body--checks,
	.mn-par .mn-par__body--team {
		column-gap: 40px;
	}
}

/* below 782: one column, the 20 px gutter (base), the card's padding as the form card's */
@media (max-width: 781.98px) {
	.mn-par {
		padding-bottom: 32px;
	}

	.mn-par > .mn-par__title {
		margin-bottom: 12px;
		padding-block: 20px;
		font-size: var(--wp--preset--font-size--s-12);
	}

	.mn-par .mn-par__card {
		min-height: 0;
		padding: 24px 20px;
	}

	.mn-par .mn-par__progress {
		margin-bottom: 20px;
	}

	.mn-par .mn-par__dot {
		width: 28px;
		height: 28px;
		font-size: 12px;
	}

	.mn-par .mn-par__dot + .mn-par__dot {
		margin-left: 24px;
	}

	.mn-par .mn-par__dot + .mn-par__dot::before {
		width: 24px;
	}

	.mn-par .mn-par__q {
		font-size: var(--wp--preset--font-size--s-09);
		line-height: 30px;
	}

	.mn-par .mn-par__lead {
		font-size: var(--wp--preset--font-size--s-03);
		line-height: 24px;
	}

	.mn-par .mn-par__actions {
		margin-top: 28px;
	}

	.mn-par .mn-par__body {
		margin-top: 24px;
	}

	.mn-par .mn-par__step--1 .mn-par__body,
	.mn-par .mn-par__body--checks,
	.mn-par .mn-par__body--team,
	.mn-par .mn-par__body--fields {
		grid-template-columns: minmax(0, 1fr);
		justify-content: start;
		width: 100%;
		max-width: 360px;
		row-gap: 16px;
	}

	.mn-par .mn-par__body--fields {
		row-gap: 12px;
	}

	.mn-par .mn-par__body--team {
		margin-top: 22px;
		padding-top: 22px;
	}

	/* 16 px on phones: iOS Safari zooms the page into any field set smaller */
	.mn-par .mn-par__control {
		font-size: var(--wp--preset--font-size--s-03);
	}

	.mn-par .mn-par__nav {
		gap: 12px;
		margin-top: 28px;
	}

	.mn-par .mn-par__nav .mn-par__back {
		width: 110px;
	}

	.mn-par .mn-par__thanks-title {
		font-size: var(--wp--preset--font-size--s-12);
		line-height: 36px;
	}
}