/* ----------------------------------------------------------
   Offer page Figma implementation pass
   Grounded on frame 622:3231 from Figma dev mode.
   ---------------------------------------------------------- */

html:has(body.k404-offer-page),
body.k404-offer-page {
	--home-max-width: 1520px;
	--home-frame-width: 1600px;
	--home-gutter: clamp(20px, 1.323vw + 14.84px, 40px);
	--home-ui-fg: #101010;
	--home-ui-border: rgba(16, 16, 16, 0.92);
	--home-ui-code: #fe3334;
	--home-spectrum-current: #fe4a32;
	--home-button-fill-red: #fe4a32;
	--home-button-fill-orange: #ff8737;
	--home-button-fill-yellow: #ffd84d;
	--home-pill-radius: 999px;
	--home-transition: 380ms cubic-bezier(0.22, 1, 0.36, 1);
	--home-bottom-offset: 0px;
	--home-fixed-nav-space: calc(77px + var(--home-bottom-offset));
	--offer-col-gap: clamp(12px, 1.184vw + 7.37px, 30px);
	--offer-section-gap: clamp(48px, 5.132vw + 27.98px, 126px);
	--offer-copy-width: 1004px;
	background: #fff;
	margin: 0 !important;
	padding: 0;
	scroll-behavior: smooth;
	overflow-x: clip;
}

body.k404-offer-page .elastic-fields,
body.k404-offer-page .section {
	margin: 0;
}

body.k404-offer-page .offer-fields *,
body.k404-offer-page .offer-fields *::before,
body.k404-offer-page .offer-fields *::after {
	min-width: 0;
}

body.k404-offer-page .offer-page {
	padding-bottom: var(--home-fixed-nav-space);
}

body.k404-offer-page .section-width,
body.k404-offer-page .home-top-controls .section-width,
body.k404-offer-page .footer-wrapper .section-width,
body.k404-offer-page .header.home-bottom-nav {
	width: min(calc(100% - (2 * var(--home-gutter))), var(--home-max-width));
	max-width: calc(100vw - (2 * var(--home-gutter)));
	margin-inline: auto;
	padding-inline: 0;
}

body.k404-offer-page .home-top-controls {
	position: fixed;
	top: 40px;
	left: 0;
	right: 0;
	z-index: 48;
	pointer-events: none;
}

body.k404-offer-page .home-top-controls .section-width {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	pointer-events: auto;
}

body.k404-offer-page .home-top-right {
	display: flex;
	align-items: center;
	gap: 0;
}

body.k404-offer-page .home-ui-pill,
body.k404-offer-page .section .button-section a,
body.k404-offer-page .footer-wrapper .button-section a {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 20px 30px;
	border: 1px solid var(--home-ui-border);
	border-radius: var(--home-pill-radius);
	background: rgba(255, 255, 255, 0.14);
	backdrop-filter: blur(6px);
	color: var(--home-ui-fg);
	font-family: inherit;
	font-size: 17px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
	text-decoration: none;
	overflow: hidden;
	transition:
		color var(--home-transition),
		border-color var(--home-transition),
		background-color var(--home-transition),
		transform var(--home-transition);
	isolation: isolate;
}

body.k404-offer-page .home-ui-pill::before,
body.k404-offer-page .section .button-section a::before,
body.k404-offer-page .footer-wrapper .button-section a::before {
	content: "";
	position: absolute;
	inset: -1px;
	border-radius: inherit;
	background-color: var(--home-button-fill-red);
	opacity: 0;
	transform: scale(1.04);
	transition:
		opacity 420ms cubic-bezier(0.22, 1, 0.36, 1),
		transform 620ms cubic-bezier(0.22, 1, 0.36, 1);
	z-index: -1;
}

body.k404-offer-page .home-ui-pill:hover,
body.k404-offer-page .home-ui-pill.is-active,
body.k404-offer-page .home-ui-pill:focus-visible,
body.k404-offer-page .section .button-section a:hover,
body.k404-offer-page .section .button-section a:focus-visible,
body.k404-offer-page .footer-wrapper .button-section a:focus-visible,
body.k404-offer-page .footer-wrapper .button-section a:hover {
	color: var(--home-ui-fg);
	border-color: transparent;
	box-shadow: none;
	transform: none;
}

body.k404-offer-page .home-ui-pill:hover::before,
body.k404-offer-page .home-ui-pill.is-active::before,
body.k404-offer-page .home-ui-pill:focus-visible::before,
body.k404-offer-page .section .button-section a:hover::before,
body.k404-offer-page .section .button-section a:focus-visible::before,
body.k404-offer-page .footer-wrapper .button-section a:focus-visible::before,
body.k404-offer-page .footer-wrapper .button-section a:hover::before {
	opacity: 1;
	transform: scale(1);
	animation: k404-button-fill-sequence 9s linear infinite;
}

body.k404-offer-page .home-top-left .home-ui-pill {
	min-width: 202px;
}

body.k404-offer-page .home-top-right .home-ui-pill:nth-child(1) {
	min-width: 142px;
}

body.k404-offer-page .home-top-right .home-ui-pill:nth-child(2) {
	min-width: 96px;
}

body.k404-offer-page .home-top-right .home-ui-pill:nth-child(3) {
	min-width: 100px;
}

body.k404-offer-page .home-top-right .home-ui-pill + .home-ui-pill {
	margin-left: -1px;
}

body.k404-offer-page .header-wrapper-home {
	position: fixed;
	left: 0;
	right: 0;
	bottom: max(0px, var(--home-bottom-offset));
	z-index: 44;
}

body.k404-offer-page .header.home-bottom-nav {
	display: grid;
	grid-template-columns: 330px minmax(0, 1fr) 437px;
	align-items: center;
	height: 77px;
	background: rgba(255, 255, 255, 0.98);
	backdrop-filter: blur(16px);
	border-top: 1px solid rgba(16, 16, 16, 0.12);
}

body.k404-offer-page .menu-home {
	display: flex;
	align-items: center;
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.k404-offer-page .menu-home li {
	margin: 0;
	padding: 0;
}

body.k404-offer-page .menu-home a,
body.k404-offer-page .home-socials a,
body.k404-offer-page .home-socials span,
body.k404-offer-page .site-mark {
	color: var(--home-ui-fg);
	text-decoration: none;
	transition: color var(--home-transition), opacity var(--home-transition);
}

body.k404-offer-page .menu-home a {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding-left: 20px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: uppercase;
}

body.k404-offer-page .menu-home a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--home-ui-code);
	opacity: 0;
	transform: translateY(-50%) scale(0.5);
	transition: opacity var(--home-transition), transform var(--home-transition);
}

body.k404-offer-page .menu-home a:hover::before,
body.k404-offer-page .menu-home a.is-active::before,
body.k404-offer-page .menu-home .current-menu-item a::before,
body.k404-offer-page .menu-home .current_page_item a::before {
	opacity: 1;
	transform: translateY(-50%) scale(1);
}

body.k404-offer-page .header.home-bottom-nav .col-center {
	justify-self: center;
}

body.k404-offer-page .site-mark {
	display: inline-flex;
	align-items: center;
	font-family: "Bricolage Grotesque", inherit;
	font-size: 25px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
}

body.k404-offer-page .home-socials {
	display: grid;
	grid-template-columns: max-content max-content max-content 7.8ch;
	align-items: center;
	justify-content: end;
	gap: 40px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: uppercase;
	white-space: nowrap;
}

body.k404-offer-page .home-socials .header-code {
	color: var(--home-ui-code);
	text-align: left;
}

body.k404-offer-page .offer-hero {
	padding: 292px 0 120px;
}

body.k404-offer-page .offer-hero .section-content,
body.k404-offer-page .offer-media .section-content,
body.k404-offer-page .offer-points .section-content {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--offer-col-gap);
}

body.k404-offer-page .offer-hero-copy {
	grid-column: 1 / span 9;
	min-width: 0;
}

body.k404-offer-page .offer-hero h1 {
	margin: 0;
	max-width: 1134px;
	font-size: 50px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-benefits {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	column-gap: var(--offer-col-gap);
	row-gap: 42px;
	margin-top: 90px;
}

body.k404-offer-page .offer-benefit {
	display: grid;
	align-content: start;
	row-gap: 24px;
	min-width: 0;
}

body.k404-offer-page .offer-benefit-mark {
	display: block;
	width: 99px;
	height: 99px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0) 34%),
		#e5e5e5;
}

body.k404-offer-page .offer-benefit h2,
body.k404-offer-page .offer-benefit p {
	margin: 0;
	max-width: 100%;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-benefit h2 {
	font-weight: 500;
}

body.k404-offer-page .offer-media {
	padding: 0 0 0;
}

body.k404-offer-page .offer-media .section-content {
	row-gap: 30px;
}

body.k404-offer-page figure {
	margin: 0;
}

body.k404-offer-page img {
	display: block;
	max-width: 100%;
	height: auto;
}

body.k404-offer-page .offer-media-wide {
	grid-column: 1 / -1;
}

body.k404-offer-page .offer-media-wide img {
	width: 100%;
	aspect-ratio: 1520 / 834;
	object-fit: cover;
}

body.k404-offer-page .offer-split,
body.k404-offer-page .offer-duo {
	display: contents;
}

body.k404-offer-page .offer-split-first .offer-split-image {
	grid-column: 1 / span 6;
}

body.k404-offer-page .offer-split-first .offer-split-copy {
	grid-column: 8 / span 4;
}

body.k404-offer-page .offer-duo figure:first-child {
	grid-column: 1 / span 6;
}

body.k404-offer-page .offer-duo figure:last-child {
	grid-column: 7 / span 6;
}

body.k404-offer-page .offer-split-reverse .offer-split-copy {
	grid-column: 2 / span 4;
}

body.k404-offer-page .offer-split-reverse .offer-split-image {
	grid-column: 7 / span 6;
}

body.k404-offer-page .offer-split-image img,
body.k404-offer-page .offer-duo img {
	width: 100%;
	aspect-ratio: 745 / 834;
	object-fit: cover;
}

body.k404-offer-page .offer-split-first .offer-split-image img {
	object-position: center;
}

body.k404-offer-page .offer-duo figure:first-child img {
	object-position: 45% center;
}

body.k404-offer-page .offer-duo figure:last-child img {
	object-position: center;
}

body.k404-offer-page .offer-split-reverse .offer-split-image img {
	object-position: center;
}

body.k404-offer-page .offer-split-copy {
	align-self: center;
	display: grid;
	row-gap: 30px;
	width: min(100%, 490px);
	min-width: 0;
}

body.k404-offer-page .offer-split-copy h2 {
	margin: 0;
	max-width: 100%;
	font-size: 25px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-split-copy p {
	margin: 0;
	max-width: 100%;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-split-copy .button-section,
body.k404-offer-page .offer-large-copy .button-section,
body.k404-offer-page .offer-cooperation .button-section,
body.k404-offer-page .offer-final .button-section {
	margin: 0;
}

body.k404-offer-page .offer-split-copy .button-section a {
	min-width: 207px;
	background: #fff;
}

body.k404-offer-page .offer-triptych {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: var(--offer-col-gap);
	margin-top: 0;
}

body.k404-offer-page .offer-triptych img {
	width: 100%;
	aspect-ratio: 487 / 553;
	object-fit: cover;
}

body.k404-offer-page .offer-triptych figure:first-child img {
	object-position: center;
}

body.k404-offer-page .offer-triptych figcaption {
	margin-top: 15px;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
}

body.k404-offer-page .offer-large-copy {
	grid-column: 1 / span 7;
	display: grid;
	justify-items: start;
	row-gap: 48px;
	margin-top: 70px;
}

body.k404-offer-page .offer-large-copy p {
	margin: 0;
	max-width: 100%;
	font-size: 30px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-large-copy .button-section a {
	min-width: 252px;
	background: #fff;
}

body.k404-offer-page .offer-cooperation {
	margin-top: 80px;
	padding: 166px 0 165px;
	background: #fe4a32;
}

body.k404-offer-page .offer-cooperation .section-content,
body.k404-offer-page .offer-final .section-content {
	display: grid;
	justify-items: center;
	row-gap: 40px;
	width: min(100%, var(--offer-copy-width));
	margin-inline: auto;
	text-align: center;
}

body.k404-offer-page .offer-cooperation h2,
body.k404-offer-page .offer-final h2 {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0;
	color: #000;
}

body.k404-offer-page .offer-cooperation p,
body.k404-offer-page .offer-final p {
	margin: 0;
	max-width: 100%;
	font-size: 30px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-cooperation .button-section a {
	min-width: 223px;
	background: transparent;
}

body.k404-offer-page .offer-portfolio {
	padding: 80px 0 0;
}

body.k404-offer-page .offer-portfolio .section-content {
	display: grid;
	grid-template-areas:
		"top"
		"posts";
	row-gap: 60px;
}

body.k404-offer-page .offer-portfolio .col-top {
	grid-area: top;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 30px;
}

body.k404-offer-page .offer-portfolio .support-wrapper {
	display: flex;
	align-items: flex-start;
	gap: 15px;
}

body.k404-offer-page .offer-portfolio .title-wrapper h2 {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0;
	color: #000;
}

body.k404-offer-page .offer-portfolio .dopisek {
	padding-top: 2px;
}

body.k404-offer-page .offer-portfolio .dopisek span,
body.k404-offer-page .offer-portfolio .portfolio-meta .dopisek span {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--section-note, #7f52ff);
}

body.k404-offer-page .offer-portfolio .button-section a {
	min-width: 224px;
	background: #fff;
}

body.k404-offer-page .offer-portfolio .posts-shell {
	grid-area: posts;
	display: grid;
	row-gap: 36px;
}

body.k404-offer-page .offer-portfolio .portfolio-viewport {
	width: 100%;
	overflow: hidden;
}

body.k404-offer-page .offer-portfolio .portfolio-rail.posts {
	display: flex;
	align-items: stretch;
	flex-wrap: nowrap;
	gap: 30px;
	width: 100%;
	transition: transform 0.72s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

body.k404-offer-page .offer-portfolio .portfolio-card {
	height: auto;
	flex: 0 0 calc((100% - 30px) / 2);
	width: calc((100% - 30px) / 2);
	max-width: calc((100% - 30px) / 2);
}

body.k404-offer-page .offer-portfolio .post-item {
	display: grid;
	height: 100%;
	row-gap: 20px;
}

body.k404-offer-page .offer-portfolio .post-thumbnail {
	position: relative;
	overflow: hidden;
	background: rgba(16, 16, 16, 0.06);
}

body.k404-offer-page .offer-portfolio .post-thumbnail a {
	display: block;
}

body.k404-offer-page .offer-portfolio .post-thumbnail img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 745 / 409;
	object-fit: cover;
	border-radius: 0;
}

body.k404-offer-page .offer-portfolio .portfolio-card:hover .post-thumbnail img,
body.k404-offer-page .offer-portfolio .portfolio-card:focus-within .post-thumbnail img {
	transform: none;
}

body.k404-offer-page .offer-portfolio .meta {
	padding: 0;
}

body.k404-offer-page .offer-portfolio .portfolio-meta {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 6px;
}

body.k404-offer-page .offer-portfolio .post-title,
body.k404-offer-page .offer-portfolio .portfolio-meta .dopisek {
	display: block !important;
}

body.k404-offer-page .offer-portfolio .portfolio-meta .post-title h5 {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
}

body.k404-offer-page .offer-portfolio .portfolio-navigation {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 151px;
	width: 305px;
	max-width: 100%;
}

body.k404-offer-page .offer-portfolio .portfolio-arrow {
	position: relative;
	width: 77px;
	height: 14px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

body.k404-offer-page .offer-portfolio .portfolio-arrow-line {
	position: absolute;
	top: 50%;
	width: 77px;
	height: 1px;
	background: #101010;
	transform: translateY(-50%);
	transition: opacity var(--home-transition);
}

body.k404-offer-page .offer-portfolio .portfolio-arrow-prev .portfolio-arrow-line {
	left: 0;
}

body.k404-offer-page .offer-portfolio .portfolio-arrow-next .portfolio-arrow-line {
	right: 0;
}

body.k404-offer-page .offer-portfolio .portfolio-arrow::before {
	content: "";
	position: absolute;
	top: 50%;
	width: 10px;
	height: 10px;
	border-top: 1px solid #101010;
	transform: translateY(-50%);
	transition: opacity var(--home-transition);
}

body.k404-offer-page .offer-portfolio .portfolio-arrow-prev::before {
	left: 0;
	border-left: 1px solid #101010;
	transform: translateY(-50%) rotate(-45deg);
}

body.k404-offer-page .offer-portfolio .portfolio-arrow-next::before {
	right: 0;
	border-right: 1px solid #101010;
	transform: translateY(-50%) rotate(45deg);
}

body.k404-offer-page .offer-portfolio .portfolio-arrow:hover .portfolio-arrow-line,
body.k404-offer-page .offer-portfolio .portfolio-arrow:hover::before {
	opacity: 0.72;
}

body.k404-offer-page .offer-portfolio .portfolio-arrow:disabled,
body.k404-offer-page .offer-portfolio .portfolio-navigation[data-static-nav] .portfolio-arrow {
	opacity: 1;
	cursor: default;
}

body.k404-offer-page .offer-points {
	padding: 80px 0 0;
}

body.k404-offer-page .offer-points .section-content {
	row-gap: 84px;
}

body.k404-offer-page .offer-points-block {
	grid-column: 1 / -1;
	display: grid;
	row-gap: 52px;
}

body.k404-offer-page .offer-points h2 {
	margin: 0;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0;
	color: #000;
}

body.k404-offer-page .offer-points-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: var(--offer-col-gap);
	row-gap: 40px;
}

body.k404-offer-page .offer-point {
	display: grid;
	grid-template-columns: 15px minmax(0, 1fr);
	column-gap: 20px;
	align-items: start;
}

body.k404-offer-page .offer-point span {
	width: 15px;
	height: 15px;
	margin-top: 2px;
	border-radius: 50%;
	background: var(--section-note, #fe3334);
}

body.k404-offer-page .offer-point strong {
	font-size: 20px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0;
	color: var(--section-note, #fe3334);
}

body.k404-offer-page .offer-point p {
	margin: 0;
	max-width: 452px;
	font-size: 20px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
	overflow-wrap: anywhere;
	word-break: break-word;
}

body.k404-offer-page .offer-final {
	margin-top: 80px;
	padding: 100px 0 90px;
	border-top: 1px solid rgba(16, 16, 16, 0.18);
}

body.k404-offer-page .offer-final .button-section a {
	min-width: 207px;
	background: #fff;
}

body.k404-offer-page .footer-wrapper {
	position: relative;
	padding: 78px 0 calc(105px + var(--home-fixed-nav-space));
	background-color: var(--home-spectrum-current);
	animation: none;
	overflow: hidden;
	isolation: isolate;
}

body.k404-offer-page .footer-wrapper .section-content {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

body.k404-offer-page .footer-wrapper .columns {
	display: grid;
	grid-template-columns: minmax(280px, 399px) 192px minmax(320px, 487px);
	justify-content: space-between;
	column-gap: 0;
	row-gap: 0;
	align-items: start;
}

body.k404-offer-page .footer-wrapper .col-left {
	width: min(100%, 399px);
	margin: 0;
	display: grid;
	align-content: start;
	row-gap: 60px;
}

body.k404-offer-page .footer-wrapper .col-left > * {
	margin: 0;
}

body.k404-offer-page .footer-wrapper .col-left > p {
	display: none;
}

body.k404-offer-page .footer-wrapper .col-left h3 {
	margin: 0;
	font-size: 30px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
}

body.k404-offer-page .footer-wrapper .col-center {
	width: 192px;
	margin: 0;
	display: grid;
	align-content: start;
	row-gap: 48px;
	padding-top: 0;
}

body.k404-offer-page .footer-wrapper .col-right {
	width: min(100%, 487px);
	margin: 0;
	display: grid;
	align-content: start;
	justify-items: start;
	row-gap: 48px;
	padding-top: 0;
}

body.k404-offer-page .footer-wrapper .col-right .text-editor {
	margin: 0;
	width: min(100%, 487px);
}

body.k404-offer-page .footer-wrapper .col-center p,
body.k404-offer-page .footer-wrapper .col-right p {
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	color: #000;
}

body.k404-offer-page .footer-wrapper .button-section {
	margin: 0;
}

body.k404-offer-page .footer-wrapper .button-section a {
	min-width: 202px;
}

body.k404-offer-page .home-top-controls,
body.k404-offer-page .header-wrapper-home,
body.k404-offer-page .section .button-section a,
body.k404-offer-page .menu-home a,
body.k404-offer-page .home-socials a,
body.k404-offer-page .home-ui-pill {
	cursor: pointer;
}

@keyframes k404-button-fill-sequence {
	0%,
	100% {
		background-color: var(--home-button-fill-red);
	}
	33% {
		background-color: var(--home-button-fill-orange);
	}
	66% {
		background-color: var(--home-button-fill-yellow);
	}
}

@media (max-width: 991px) {
	body.k404-offer-page {
		--home-fixed-nav-space: calc(72px + var(--home-bottom-offset));
	}

	body.k404-offer-page .home-top-controls {
		top: 12px;
	}

	body.k404-offer-page .home-top-controls .section-width {
		align-items: flex-start;
		overflow: hidden;
	}

	body.k404-offer-page .home-top-left,
	body.k404-offer-page .home-top-right {
		display: flex;
		overflow-x: auto;
		gap: 10px;
		min-width: 0;
		max-width: 100%;
	}

	body.k404-offer-page .home-top-right .home-ui-pill + .home-ui-pill {
		margin-left: 0;
	}

	body.k404-offer-page .home-top-left .home-ui-pill,
	body.k404-offer-page .home-top-right .home-ui-pill {
		min-width: max-content;
	}

	body.k404-offer-page .home-ui-pill,
	body.k404-offer-page .section .button-section a,
	body.k404-offer-page .footer-wrapper .button-section a {
		min-height: 36px;
		padding: 10px 16px;
		font-size: 14px;
	}

	body.k404-offer-page .header.home-bottom-nav {
		grid-template-columns: 1fr;
		height: auto;
		padding: 14px var(--home-gutter);
		row-gap: 10px;
	}

	body.k404-offer-page .header.home-bottom-nav .col-left,
	body.k404-offer-page .header.home-bottom-nav .col-center,
	body.k404-offer-page .header.home-bottom-nav .col-right {
		width: 100%;
	}

	body.k404-offer-page .header.home-bottom-nav .col-center {
		order: -1;
		display: flex;
		justify-content: flex-start;
	}

	body.k404-offer-page .menu-home,
	body.k404-offer-page .home-socials {
		overflow-x: auto;
	}

	body.k404-offer-page .home-socials {
		display: flex;
		justify-content: flex-start;
		gap: 22px;
	}

	body.k404-offer-page .offer-hero {
		padding: 118px 0 66px;
	}

	body.k404-offer-page .offer-hero .section-content,
	body.k404-offer-page .offer-media .section-content,
	body.k404-offer-page .offer-points .section-content {
		grid-template-columns: 1fr;
		row-gap: 28px;
	}

	body.k404-offer-page .offer-hero-copy,
	body.k404-offer-page .offer-benefits,
	body.k404-offer-page .offer-media-wide,
	body.k404-offer-page .offer-split-first .offer-split-image,
	body.k404-offer-page .offer-split-first .offer-split-copy,
	body.k404-offer-page .offer-duo figure:first-child,
	body.k404-offer-page .offer-duo figure:last-child,
	body.k404-offer-page .offer-split-reverse .offer-split-copy,
	body.k404-offer-page .offer-split-reverse .offer-split-image,
	body.k404-offer-page .offer-triptych,
	body.k404-offer-page .offer-large-copy,
	body.k404-offer-page .offer-points-block {
		grid-column: 1 / -1;
	}

	body.k404-offer-page .offer-hero h1 {
		font-size: 32px;
		line-height: 1.25;
	}

	body.k404-offer-page .offer-benefits {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 30px 18px;
		margin-top: 48px;
	}

	body.k404-offer-page .offer-benefit {
		row-gap: 14px;
	}

	body.k404-offer-page .offer-benefit-mark {
		width: 72px;
		height: 72px;
	}

	body.k404-offer-page .offer-media-wide img,
	body.k404-offer-page .offer-split-image img,
	body.k404-offer-page .offer-duo img {
		aspect-ratio: 1 / 1.08;
	}

	body.k404-offer-page .offer-split-copy {
		width: 100%;
		row-gap: 18px;
	}

	body.k404-offer-page .offer-split-copy h2 {
		font-size: 24px;
	}

	body.k404-offer-page .offer-triptych {
		grid-template-columns: 1fr;
		row-gap: 24px;
	}

	body.k404-offer-page .offer-large-copy {
		row-gap: 28px;
		margin-top: 20px;
	}

	body.k404-offer-page .offer-large-copy p,
	body.k404-offer-page .offer-cooperation p,
	body.k404-offer-page .offer-final p {
		font-size: 22px;
	}

	body.k404-offer-page .offer-cooperation {
		margin-top: 54px;
		padding: 82px 0;
	}

	body.k404-offer-page .offer-cooperation h2,
	body.k404-offer-page .offer-final h2,
	body.k404-offer-page .offer-portfolio .title-wrapper h2,
	body.k404-offer-page .offer-points h2 {
		font-size: 30px;
	}

	body.k404-offer-page .offer-portfolio {
		padding-top: 54px;
	}

	body.k404-offer-page .offer-portfolio .section-content {
		row-gap: 34px;
	}

	body.k404-offer-page .offer-portfolio .col-top {
		flex-direction: column;
		align-items: flex-start;
		gap: 22px;
	}

	body.k404-offer-page .offer-portfolio .support-wrapper {
		display: grid;
		gap: 8px;
	}

	body.k404-offer-page .offer-portfolio .portfolio-rail.posts {
		gap: 20px;
	}

	body.k404-offer-page .offer-portfolio .portfolio-card {
		flex-basis: 100%;
		width: 100%;
		max-width: 100%;
	}

	body.k404-offer-page .offer-portfolio .post-thumbnail img {
		aspect-ratio: 1.15 / 1;
	}

	body.k404-offer-page .offer-portfolio .portfolio-navigation {
		gap: 80px;
		width: 237px;
	}

	body.k404-offer-page .offer-portfolio .portfolio-arrow,
	body.k404-offer-page .offer-portfolio .portfolio-arrow-line {
		width: 68px;
	}

	body.k404-offer-page .offer-points {
		padding-top: 58px;
	}

	body.k404-offer-page .offer-points .section-content {
		row-gap: 58px;
	}

	body.k404-offer-page .offer-points-block {
		row-gap: 28px;
	}

	body.k404-offer-page .offer-points-grid {
		grid-template-columns: 1fr;
		row-gap: 22px;
	}

	body.k404-offer-page .offer-point p {
		font-size: 18px;
	}

	body.k404-offer-page .offer-final {
		margin-top: 58px;
		padding: 72px 0 68px;
	}

	body.k404-offer-page .footer-wrapper {
		padding: 52px 0 calc(82px + var(--home-fixed-nav-space));
	}

	body.k404-offer-page .footer-wrapper .columns {
		grid-template-columns: 1fr;
		row-gap: 42px;
	}

	body.k404-offer-page .footer-wrapper .col-left,
	body.k404-offer-page .footer-wrapper .col-center,
	body.k404-offer-page .footer-wrapper .col-right {
		width: 100%;
		row-gap: 24px;
	}
}

@media (max-width: 520px) {
	body.k404-offer-page .offer-benefits {
		grid-template-columns: 1fr;
	}

	body.k404-offer-page .site-mark {
		font-size: 22px;
	}

	body.k404-offer-page .menu-home a,
	body.k404-offer-page .home-socials {
		font-size: 13px;
	}
}