/*
Theme Name: Kruzhevo
Version: 1.3
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: kruzhevo
*/

@font-face {
	font-family: "Cormorant Garamond Variable";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-cyrillic-wght-normal.woff2") format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: "Cormorant Garamond Variable";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-latin-wght-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Cormorant Garamond Variable";
	font-style: italic;
	font-weight: 300 700;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-cyrillic-wght-italic.woff2") format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: "Cormorant Garamond Variable";
	font-style: italic;
	font-weight: 300 700;
	font-display: swap;
	src: url("assets/fonts/cormorant-garamond-latin-wght-italic.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Literata Variable";
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url("assets/fonts/literata-cyrillic-wght-normal.woff2") format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: "Literata Variable";
	font-style: normal;
	font-weight: 200 900;
	font-display: swap;
	src: url("assets/fonts/literata-latin-wght-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--night: #14130f;
	--cream: #efe6d2;
	--cream-muted: #c8bfaa;
	--canvas: #e8e9e0;
	--paper: #f7f6f0;
	--ink: #24231d;
	--muted: #55574a;
	--line: #c9cbbe;
	--sage: #777c5e;
	--copper: #93522a;
	--copper-deep: #7a4220;
	--brass: #b08d4c;
	--brass-light: #d9c08c;
	--moss: #2c3226;
	--moss-text: #e3e5da;
	--moss-muted: #b4b9a4;
	--error: #a3322a;
	--display: "Cormorant Garamond Variable", "Cormorant Garamond", Georgia, serif;
	--text: "Literata Variable", Literata, Georgia, serif;
	--gutter: clamp(20px, 5vw, 48px);
	--wrap: 1160px;
	--section: clamp(72px, 9vw, 128px);
	--radius: 6px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

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

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100svh;
	margin: 0;
	background: var(--canvas);
	color: var(--ink);
	font-family: var(--text);
	font-size: 1.0625rem;
	line-height: 1.68;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

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

figure {
	margin: 0;
}

p {
	margin: 0 0 1em;
	text-wrap: pretty;
}

h1,
h2,
h3 {
	margin: 0;
	font-family: var(--display);
	font-weight: 600;
	text-wrap: balance;
}

a {
	color: inherit;
}

::selection {
	background: var(--brass-light);
	color: var(--ink);
}

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

.skip-link {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 100;
	padding: 10px 16px;
	background: var(--paper);
	color: var(--ink);
	border-radius: var(--radius);
	transform: translateY(-200%);
}

.skip-link:focus {
	transform: none;
}

.wrap {
	width: 100%;
	max-width: calc(var(--wrap) + var(--gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.wrap--narrow {
	max-width: calc(780px + var(--gutter) * 2);
}

.heading {
	margin-bottom: 0.7em;
	font-size: clamp(2.3rem, 4.2vw, 3.4rem);
	font-weight: 600;
	line-height: 1.04;
	letter-spacing: -0.01em;
}

.heading--light {
	color: var(--moss-text);
}

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	padding: 14px 32px;
	border: 0;
	border-radius: var(--radius);
	background: var(--copper);
	color: var(--paper);
	font-family: var(--text);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s ease, box-shadow 0.3s ease;
}

.button:hover {
	background: var(--copper-deep);
}

.button--glow {
	background: var(--brass);
	color: var(--night);
	box-shadow: 0 0 0 1px rgb(217 192 140 / 0.35), 0 14px 44px -10px rgb(226 176 96 / 0.6);
}

.button--glow:hover {
	background: var(--brass-light);
	box-shadow: 0 0 0 1px rgb(217 192 140 / 0.5), 0 16px 56px -8px rgb(226 176 96 / 0.75);
}

.lace {
	--r: 18px;
	position: relative;
	z-index: 2;
	height: var(--r);
	background-color: var(--to);
	background-image:
		radial-gradient(circle at 50% 40%, var(--hole, var(--to)) 2.4px, #0000 3px),
		radial-gradient(circle at 50% 0, var(--from) calc(var(--r) - 0.5px), #0000 var(--r));
	background-size: calc(var(--r) * 2) var(--r);
	background-repeat: round no-repeat;
}

.lace--night {
	--from: var(--night);
	--to: var(--canvas);
	margin-top: -1px;
}

.lace--moss {
	--from: var(--canvas);
	--to: var(--moss);
}

.lace--moss-down {
	--from: var(--moss);
	--to: var(--canvas);
}

.lace--photo {
	--from: var(--canvas);
	--to: transparent;
	--hole: var(--night);
	position: absolute;
	inset: 0 0 auto;
}

.opening {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	min-height: max(100vh, 740px);
	min-height: max(100svh, 740px);
	overflow: hidden;
	background: var(--night);
	color: var(--cream);
}

.opening__photo {
	position: absolute;
	inset: 0;
	z-index: -1;
}

.opening__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 44% 16%;
}

.opening__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgb(20 19 15 / 0.35) 0%, rgb(20 19 15 / 0) 22%, rgb(20 19 15 / 0) 38%, rgb(20 19 15 / 0.82) 62%, var(--night) 86%);
}

.opening__content {
	padding-block: 48px 64px;
}

.opening__title {
	max-width: 11.5em;
	margin-bottom: 0.4em;
	font-size: clamp(2.45rem, 10.4vw, 3.4rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.015em;
	color: var(--cream);
}

.opening__lead {
	max-width: 32em;
	margin-bottom: 1.7em;
	color: var(--cream-muted);
	font-size: clamp(1rem, 1.3vw, 1.1875rem);
}

.opening__action {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 24px;
}

.opening__note {
	margin: 0;
	color: var(--cream-muted);
	font-size: 0.9rem;
}

.opening :focus-visible,
.closing :focus-visible,
.notice :focus-visible {
	outline-color: var(--brass-light);
}

.request {
	padding-block: calc(var(--section) - 18px) var(--section);
	background: var(--canvas);
}

.request__grid {
	display: grid;
	gap: 44px;
}

.request__intro > p {
	max-width: 34em;
}

.request__hint-title {
	margin: 1.6em 0 0.5em;
	font-weight: 600;
}

.request__hints {
	margin: 0 0 1.6em;
	padding: 0;
	list-style: none;
}

.request__hints li {
	position: relative;
	margin-bottom: 0.35em;
	padding-left: 26px;
}

.request__hints li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 0.62em;
	width: 12px;
	height: 6px;
	background: radial-gradient(circle at 50% 0, var(--copper) 5.6px, #0000 6px);
}

.request__privacy {
	color: var(--muted);
	font-size: 0.9rem;
}

.request__sheet {
	filter: drop-shadow(0 22px 32px rgb(36 35 29 / 0.14)) drop-shadow(0 2px 3px rgb(36 35 29 / 0.08));
}

.request__form {
	--r: 12px;
	position: relative;
	padding: calc(var(--r) + 10px + clamp(16px, 3.6vw, 38px));
	background: #fff;
	-webkit-mask:
		linear-gradient(#000 0 0) center / calc(100% - var(--r) * 2 + 2px) calc(100% - var(--r) * 2 + 2px) no-repeat,
		radial-gradient(circle at 50% 100%, #000 calc(var(--r) - 0.5px), #0000 var(--r)) top / calc(var(--r) * 2) var(--r) round no-repeat,
		radial-gradient(circle at 50% 0, #000 calc(var(--r) - 0.5px), #0000 var(--r)) bottom / calc(var(--r) * 2) var(--r) round no-repeat,
		radial-gradient(circle at 100% 50%, #000 calc(var(--r) - 0.5px), #0000 var(--r)) left / var(--r) calc(var(--r) * 2) no-repeat round,
		radial-gradient(circle at 0 50%, #000 calc(var(--r) - 0.5px), #0000 var(--r)) right / var(--r) calc(var(--r) * 2) no-repeat round;
	mask:
		linear-gradient(#000 0 0) center / calc(100% - var(--r) * 2 + 2px) calc(100% - var(--r) * 2 + 2px) no-repeat,
		radial-gradient(circle at 50% 100%, #000 calc(var(--r) - 0.5px), #0000 var(--r)) top / calc(var(--r) * 2) var(--r) round no-repeat,
		radial-gradient(circle at 50% 0, #000 calc(var(--r) - 0.5px), #0000 var(--r)) bottom / calc(var(--r) * 2) var(--r) round no-repeat,
		radial-gradient(circle at 100% 50%, #000 calc(var(--r) - 0.5px), #0000 var(--r)) left / var(--r) calc(var(--r) * 2) no-repeat round,
		radial-gradient(circle at 0 50%, #000 calc(var(--r) - 0.5px), #0000 var(--r)) right / var(--r) calc(var(--r) * 2) no-repeat round;
}

.request__form::before {
	content: "";
	position: absolute;
	inset: calc(var(--r) + 10px);
	border: 1px dashed rgb(176 141 76 / 0.55);
	border-radius: 3px;
	pointer-events: none;
}

.request__form::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(circle at 50% 72%, var(--canvas) 1.8px, #0000 2.4px) top / calc(var(--r) * 2) var(--r) round no-repeat,
		radial-gradient(circle at 50% 28%, var(--canvas) 1.8px, #0000 2.4px) bottom / calc(var(--r) * 2) var(--r) round no-repeat,
		radial-gradient(circle at 72% 50%, var(--canvas) 1.8px, #0000 2.4px) left / var(--r) calc(var(--r) * 2) no-repeat round,
		radial-gradient(circle at 28% 50%, var(--canvas) 1.8px, #0000 2.4px) right / var(--r) calc(var(--r) * 2) no-repeat round;
}

.form-missing {
	margin: 0;
	padding: 16px;
	border: 1px dashed var(--error);
	border-radius: var(--radius);
	color: var(--error);
}

.about {
	padding-block: var(--section);
	background: var(--paper);
	overflow: hidden;
}

.about__grid {
	display: grid;
	gap: 40px;
	align-items: center;
}

.about__photo {
	margin-inline: calc(var(--gutter) * -1);
}

.about__photo img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: 50% 62%;
}

.about__text {
	max-width: 36em;
}

.about__first::first-letter {
	float: left;
	margin: 0.08em 0.12em 0 0;
	color: var(--copper);
	font-family: var(--display);
	font-size: 4.4em;
	font-weight: 600;
	line-height: 0.76;
}

.about__quote {
	max-width: 21em;
	margin: clamp(64px, 8vw, 112px) auto 0;
	color: var(--copper-deep);
	font-family: var(--display);
	font-size: clamp(2rem, 4.4vw, 3.4rem);
	font-style: italic;
	font-weight: 400;
	line-height: 1.12;
	text-align: center;
	text-wrap: balance;
}

.about__quote::before {
	content: "";
	display: block;
	width: 84px;
	height: 14px;
	margin: 0 auto 28px;
	background: radial-gradient(circle at 50% 0, var(--brass) 13.5px, #0000 14px) 0 0 / 28px 14px repeat-x;
}

.topics {
	padding-block: var(--section);
}

.topics__list {
	margin: 0;
	border-top: 1px solid var(--line);
}

.topics__row {
	display: grid;
	gap: 4px;
	padding-block: 20px;
	border-bottom: 1px solid var(--line);
}

.topics__row dt {
	font-family: var(--display);
	font-size: clamp(1.75rem, 2.6vw, 2.25rem);
	font-style: italic;
	font-weight: 500;
	line-height: 1.15;
}

.topics__row dd {
	margin: 0;
	color: var(--muted);
}

.process {
	background: var(--moss);
	color: var(--moss-text);
}

.process > .wrap {
	padding-block: calc(var(--section) - 18px);
}

.process__steps {
	--num: 60px;
	--gap: 40px;
	display: grid;
	gap: var(--gap);
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.process__step {
	position: relative;
	display: flex;
	gap: 22px;
	align-items: flex-start;
}

.process__step:not(:last-child)::after {
	content: "";
	position: absolute;
	left: calc(var(--num) / 2);
	top: var(--num);
	bottom: calc(var(--gap) * -1);
	width: 1px;
	background: var(--brass);
	transform-origin: top;
	transition: transform 0.9s cubic-bezier(0.5, 0, 0.2, 1);
}

.process__step:nth-child(2)::after {
	transition-delay: 0.7s;
}

.process__steps.is-waiting:not(.is-drawn) .process__step::after {
	transform: scaleY(0);
}

.process__num {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--num);
	height: var(--num);
	border: 1px solid var(--brass);
	border-radius: 50%;
	background: var(--moss);
	color: var(--brass-light);
	font-family: var(--display);
	font-size: 1.9rem;
	font-weight: 500;
	line-height: 1;
}

.process__step h3 {
	margin: 10px 0 6px;
	color: var(--moss-text);
	font-size: 1.75rem;
	line-height: 1.15;
}

.process__step p {
	max-width: 30em;
	margin: 0;
	color: var(--moss-muted);
}

.values {
	padding-block: calc(var(--section) - 18px) var(--section);
}

.values__list {
	display: grid;
	gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.values__list li::before {
	content: "";
	display: block;
	width: 40px;
	height: 20px;
	margin-bottom: 20px;
	background: radial-gradient(circle at 50% 0, var(--brass) 19.5px, #0000 20px);
}

.values__list h3 {
	margin-bottom: 8px;
	font-size: 1.65rem;
	line-height: 1.12;
}

.values__list p {
	margin: 0;
	color: var(--muted);
}

.questions {
	padding-block: 0 calc(var(--section) + 18px);
}

.questions__list {
	border-top: 1px solid var(--line);
}

.question {
	border-bottom: 1px solid var(--line);
}

.question summary {
	position: relative;
	padding: 22px 48px 22px 0;
	font-family: var(--display);
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.22;
	list-style: none;
	cursor: pointer;
}

.question summary::-webkit-details-marker {
	display: none;
}

.question summary::after {
	content: "";
	position: absolute;
	right: 8px;
	top: 50%;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	background:
		linear-gradient(var(--copper), var(--copper)) center / 16px 1.5px no-repeat,
		linear-gradient(var(--copper), var(--copper)) center / 1.5px 16px no-repeat;
	transition: transform 0.25s ease;
}

.question[open] summary::after {
	transform: rotate(45deg);
}

.question summary:hover {
	color: var(--copper-deep);
}

.question p {
	max-width: 38em;
	margin: 0;
	padding-bottom: 24px;
	color: var(--muted);
}

.closing {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: var(--night);
	color: var(--cream);
}

.closing__photo {
	position: absolute;
	inset: 0;
	z-index: -1;
}

.closing__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 40% 45%;
}

.closing__photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at 50% 50%, rgb(20 19 15 / 0.62) 20%, rgb(20 19 15 / 0.35) 80%),
		linear-gradient(to bottom, rgb(20 19 15 / 0.2), rgb(20 19 15 / 0.75));
}

.closing__inner {
	max-width: calc(64rem + var(--gutter) * 2);
	padding-block: calc(var(--section) + 36px) calc(var(--section) + 12px);
	text-align: center;
}

.closing__title {
	margin-bottom: 0.45em;
	color: var(--cream);
	font-size: clamp(2.5rem, 5.4vw, 4.4rem);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -0.01em;
}

.closing__inner p {
	max-width: 32em;
	margin: 0 auto 2.2em;
	color: var(--cream-muted);
}

.colophon {
	background: var(--night);
	color: var(--cream-muted);
	font-size: 0.875rem;
}

.colophon .wrap {
	padding-block: 18px 30px;
}

.colophon p {
	margin: 0;
}

.float-cta {
	position: fixed;
	left: var(--gutter);
	right: var(--gutter);
	bottom: max(16px, env(safe-area-inset-bottom));
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	border-radius: var(--radius);
	background: var(--copper);
	color: var(--paper);
	font-weight: 600;
	text-decoration: none;
	box-shadow: 0 10px 28px rgb(36 35 29 / 0.28);
	opacity: 0;
	visibility: hidden;
	transform: translateY(calc(100% + 24px));
	transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s linear 0.3s;
}

.float-cta.is-shown {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}

.notice {
	flex: 1 0 auto;
	display: grid;
	align-items: center;
	padding-block: 64px;
	background: var(--night);
	color: var(--cream);
}

.notice__title {
	margin-bottom: 0.45em;
	color: var(--cream);
	font-size: clamp(2.5rem, 6vw, 4rem);
	font-weight: 500;
	line-height: 1.02;
}

.notice__lead {
	max-width: 34em;
	color: var(--cream-muted);
}

.notice__list {
	margin: 0 0 44px;
	padding: 0;
	list-style: none;
	border-top: 1px solid rgb(239 230 210 / 0.16);
}

.notice__list li {
	position: relative;
	padding: 18px 0 18px 36px;
	border-bottom: 1px solid rgb(239 230 210 / 0.16);
	color: var(--cream-muted);
}

.notice__list li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 1.65em;
	width: 16px;
	height: 8px;
	background: radial-gradient(circle at 50% 0, var(--brass) 7.6px, #0000 8px);
}

.notice__list strong {
	color: var(--cream);
	font-weight: 600;
}

.notice .button {
	background: var(--brass);
	color: var(--night);
}

.notice .button:hover {
	background: var(--brass-light);
}

#zayavka .wpforms-container {
	--wpforms-field-border-radius: 6px;
	--wpforms-field-border-style: solid;
	--wpforms-field-border-size: 1px;
	--wpforms-field-background-color: #fff;
	--wpforms-field-border-color: #bfc2b2;
	--wpforms-field-text-color: var(--ink);
	--wpforms-field-menu-color: #fff;
	--wpforms-label-color: var(--ink);
	--wpforms-label-sublabel-color: var(--muted);
	--wpforms-label-error-color: var(--error);
	--wpforms-button-border-radius: 6px;
	--wpforms-button-background-color: var(--copper);
	--wpforms-button-border-color: var(--copper);
	--wpforms-button-text-color: var(--paper);
	--wpforms-page-break-color: var(--copper);
	--wpforms-field-size-input-height: 52px;
	--wpforms-field-size-input-spacing: 18px;
	--wpforms-field-size-font-size: 17px;
	--wpforms-field-size-line-height: 1.4;
	--wpforms-field-size-padding-h: 14px;
	--wpforms-field-size-checkbox-size: 18px;
	--wpforms-field-size-sublabel-spacing: 6px;
	--wpforms-label-size-font-size: 16px;
	--wpforms-label-size-line-height: 1.35;
	--wpforms-label-size-sublabel-font-size: 14px;
	--wpforms-button-size-font-size: 17px;
	--wpforms-button-size-height: 56px;
	--wpforms-button-size-padding-h: 28px;
	margin: 0;
	padding: 0;
	max-width: none;
	font-family: var(--text);
}

#zayavka .wpforms-form {
	margin: 0;
	padding: 0;
}

#zayavka .wpforms-form .wpforms-field-container {
	display: block;
}

#zayavka .wpforms-form .wpforms-field {
	padding: 0 0 18px;
	margin: 0;
	clear: both;
}

#zayavka .wpforms-form .wpforms-field-label,
#zayavka .wpforms-form .wpforms-field-label-inline {
	margin: 0 0 8px;
	color: var(--ink);
	font-family: var(--text);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.35;
}

#zayavka .wpforms-form .wpforms-field-label-inline {
	font-weight: 400;
}

#zayavka .wpforms-form .wpforms-required-label {
	color: var(--copper);
}

#zayavka .wpforms-form .wpforms-field-sublabel,
#zayavka .wpforms-form .wpforms-field-description {
	margin-top: 6px;
	color: var(--muted);
	font-size: 0.875rem;
	line-height: 1.45;
}

#zayavka .wpforms-form input[type="text"],
#zayavka .wpforms-form input[type="email"],
#zayavka .wpforms-form input[type="tel"],
#zayavka .wpforms-form input[type="number"],
#zayavka .wpforms-form input[type="url"],
#zayavka .wpforms-form select,
#zayavka .wpforms-form textarea {
	display: block;
	width: 100%;
	max-width: 100%;
	min-height: 52px;
	margin: 0;
	padding-block: 12px;
	padding-inline-end: 14px;
	border: 1px solid #bfc2b2;
	border-radius: var(--radius);
	background-color: #fff;
	box-shadow: none;
	color: var(--ink);
	font-family: var(--text);
	font-size: 1.0625rem;
	line-height: 1.4;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#zayavka .wpforms-form :is(input, select, textarea):not(.wpforms-smart-phone-field) {
	padding-inline-start: 14px;
}

#zayavka .wpforms-form textarea {
	min-height: 128px;
	resize: vertical;
}

#zayavka .wpforms-form select {
	padding-inline-end: 40px;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23777c5e' stroke-width='1.6'/%3E%3C/svg%3E");
	background-position: right 16px center;
	background-repeat: no-repeat;
	background-size: 12px 8px;
}

#zayavka .wpforms-form ::placeholder {
	color: #8a8c7d;
	opacity: 1;
}

#zayavka .wpforms-form :is(input, select, textarea):focus {
	border-color: var(--copper);
	box-shadow: 0 0 0 3px rgb(147 82 42 / 0.18);
	outline: none;
}

#zayavka .wpforms-form :is(.wpforms-field-small, .wpforms-field-medium, .wpforms-field-large) {
	max-width: 100%;
}

#zayavka .wpforms-form .iti {
	display: block;
	width: 100%;
}

#zayavka .wpforms-form .choices {
	margin: 0;
	font-size: 1.0625rem;
}

#zayavka .wpforms-form .choices__inner {
	min-height: 52px;
	padding: 8px 14px;
	border: 1px solid #bfc2b2;
	border-radius: var(--radius);
	background: #fff;
}

#zayavka .wpforms-form .choices.is-focused .choices__inner,
#zayavka .wpforms-form .choices.is-open .choices__inner {
	border-color: var(--copper);
	box-shadow: 0 0 0 3px rgb(147 82 42 / 0.18);
}

#zayavka .wpforms-form .choices__list--dropdown {
	border-color: #bfc2b2;
	border-radius: 0 0 var(--radius) var(--radius);
}

#zayavka .wpforms-form ul:is(.wpforms-field-checkbox ul, .wpforms-field-radio ul) {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#zayavka .wpforms-form :is(.wpforms-field-checkbox, .wpforms-field-radio) li {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
}

#zayavka .wpforms-form input:is([type="radio"], [type="checkbox"]) {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--copper);
}

#zayavka .wpforms-form .wpforms-field-layout-columns {
	display: flex;
	flex-wrap: wrap;
	gap: 0 16px;
	margin: 0;
}

#zayavka .wpforms-form .wpforms-layout-column {
	flex: 1 1 100%;
	width: 100%;
	padding: 0;
}

#zayavka .wpforms-form :is(label.wpforms-error, em.wpforms-error) {
	display: block;
	margin-top: 6px;
	color: var(--error);
	font-size: 0.875rem;
	font-style: normal;
	font-weight: 500;
}

#zayavka .wpforms-form :is(input, select, textarea).wpforms-error {
	border-color: var(--error);
}

#zayavka .wpforms-form .wpforms-recaptcha-container {
	padding: 4px 0 18px;
}

#zayavka .wpforms-form .wpforms-submit-container {
	margin: 0;
	padding: 6px 0 0;
}

#zayavka .wpforms-form button.wpforms-submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 56px;
	height: auto;
	margin: 0;
	padding: 14px 28px;
	border: 0;
	border-radius: var(--radius);
	background: var(--copper);
	box-shadow: none;
	color: var(--paper);
	font-family: var(--text);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

#zayavka .wpforms-form button.wpforms-submit:is(:hover, :active) {
	background: var(--copper-deep);
}

#zayavka .wpforms-form button.wpforms-submit:focus-visible {
	outline: 2px solid var(--copper);
	outline-offset: 3px;
}

#zayavka .wpforms-form button.wpforms-submit::after {
	display: none;
}

#zayavka .wpforms-confirmation-container-full {
	margin: 0;
	padding: 18px 20px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--paper);
	color: var(--ink);
}

#zayavka .wpforms-confirmation-container-full p {
	margin: 0;
}

@media (prefers-reduced-motion: no-preference) {
	.opening__photo img {
		animation: kruzhevo-settle 2.6s cubic-bezier(0.2, 0.6, 0.2, 1) both;
	}

	.opening__content {
		animation: kruzhevo-rise 1s cubic-bezier(0.2, 0.6, 0.2, 1) 0.35s both;
	}
}

@keyframes kruzhevo-settle {
	from {
		opacity: 0.4;
		transform: scale(1.08);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes kruzhevo-rise {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (min-width: 640px) {
	.values__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 48px 40px;
	}

	#zayavka .wpforms-form .wpforms-layout-column {
		flex: 1 1 0;
		min-width: 0;
	}
}

@media (min-width: 860px) {
	.topics__list {
		border-top: 0;
	}

	.topics__row {
		grid-template-columns: minmax(0, 1fr) minmax(0, 27rem);
		gap: 28px;
		align-items: baseline;
		padding-block: 18px;
		border-bottom: 0;
	}

	.topics__row dt {
		display: flex;
		align-items: baseline;
		gap: 20px;
	}

	.topics__row dt::after {
		content: "";
		flex: 1 1 auto;
		min-width: 40px;
		height: 3px;
		background: radial-gradient(circle, var(--brass) 1.3px, #0000 1.7px) 0 50% / 9px 3px repeat-x;
	}

	.process__steps {
		--gap: 48px;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		margin-top: 28px;
	}

	.process__step {
		display: block;
	}

	.process__step:not(:last-child)::after {
		left: var(--num);
		right: calc(var(--gap) * -1);
		top: calc(var(--num) / 2);
		bottom: auto;
		width: auto;
		height: 1px;
		transform-origin: left;
	}

	.process__steps.is-waiting:not(.is-drawn) .process__step::after {
		transform: scaleX(0);
	}

	.process__step h3 {
		margin-top: 20px;
	}

	.float-cta {
		display: none;
	}
}

@media (min-width: 960px) {
	.opening {
		align-items: center;
		min-height: max(660px, min(100vh, 980px));
	}

	.opening__photo {
		left: auto;
		width: 60%;
	}

	.opening__photo img {
		object-position: 50% 22%;
	}

	.opening__photo::after {
		background:
			linear-gradient(to right, var(--night) 0%, rgb(20 19 15 / 0.7) 16%, rgb(20 19 15 / 0) 52%),
			linear-gradient(to top, rgb(20 19 15 / 0.7) 0%, rgb(20 19 15 / 0) 28%);
	}

	.opening__content {
		padding-block: 96px;
	}

	.opening__title {
		max-width: 9em;
		font-size: clamp(3.4rem, 5vw, 4.9rem);
	}

	.opening__lead {
		max-width: 28em;
	}

	.request__grid {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: clamp(48px, 6vw, 96px);
		align-items: center;
	}

	.about__grid {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: clamp(56px, 7vw, 112px);
	}

	.about__photo {
		margin-inline: calc(max(var(--gutter), (100vw - var(--wrap)) / 2) * -1) 0;
	}

	.about__photo img {
		aspect-ratio: 600 / 744;
		object-position: 50% 50%;
	}
}

@media (min-width: 1180px) {
	.values__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		transition-delay: 0s !important;
		animation: none !important;
	}
}
