/*
Theme Name: ROK
Theme URI:
Author: ROK
Description: Custom WordPress theme for ROK
Version: 1.0
Text Domain: rok
*/


/* ========================================
   BASE
======================================== */

* {
    box-sizing: border-box;
}

html {
    margin: 0;
    padding: 0;
}

body {
    margin: 0;
    padding: 0;
}


/* ========================================
   HEADER
======================================== */

.rok-header {
    width: 100%;
    height: 88px;
    margin: 0;
    padding: 0;

    background: #F5F4F0;
}


/* Header inner container */

.rok-header__inner {
    width: 1200px;
    max-width: 1200px;
    height: 88px;

    margin: 0 auto;
    padding: 0;

    display: grid;
    grid-template-columns: 180px 1fr auto;
    align-items: center;
}


/* ========================================
   HEADER — LOGO
======================================== */

.rok-header__logo {
    margin: 0;
    padding: 0;

    flex-shrink: 0;
}

.rok-header__logo a {
    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;

    text-decoration: none;
}


/* ========================================
   HEADER — NAVIGATION
======================================== */

.rok-header__nav {
    justify-self: start;

    margin: 0;
    padding: 0;

    gap: 32px;
}

.rok-header__nav .wp-block-navigation__container {
    gap: 32px;
}

.rok-header__nav .wp-block-navigation-item {
    margin: 0;
    padding: 0;
}

.rok-header__nav a {
    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;

    text-decoration: none;
}


/* ========================================
   HEADER — RIGHT SIDE
======================================== */

.rok-header__actions {
    justify-self: end;

    margin: 0;
    padding: 0;

    gap: 24px;
}

.rok-header__phone {
    margin: 0;
    padding: 0;

    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;

    white-space: nowrap;
    text-decoration: none;
}

.rok-header__phone:visited {
    color: #151719;
}

.rok-header__phone:hover {
    color: #F05A24;
    text-decoration: none;
}


/* ========================================
   HEADER — PRIMARY BUTTON
======================================== */

.rok-button--primary {
    margin: 0;
}

.rok-button--primary .wp-block-button__link {
    width: 158px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    padding: 12px 20px;

    background: #F05A24;
    color: #FFFFFF;

    border: 0;
    border-radius: 4px;

    font-family: Manrope, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;

    text-decoration: none;
    white-space: nowrap;
}


/* ========================================
   MAIN
======================================== */

.rok-main {
    margin: 0;
    padding: 0;
}
/* ========================================
   HERO
======================================== */

.rok-hero {
    width: 100%;
    margin: 0;
    padding: 0;

    background: #F5F4F0;
}

.rok-hero__inner {
    width: 1200px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 64px 0 80px;

    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 24px;
}


/* ========================================
   HERO — CONTENT
======================================== */

.rok-hero__content {
    margin: 0;
    padding: 0;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.rok-hero__label {
    margin: 0 0 24px;
}

.rok-hero__title {
    margin: 0;
}

.rok-hero__text {
    max-width: 500px;
    margin: 32px 0 0;
}

.rok-hero__buttons {
    margin-top: 40px;
    gap: 12px;
}


/* ========================================
   HERO — IMAGE PLACEHOLDER
======================================== */

.rok-hero__media {
    width: 100%;
    height: 520px;
    min-height: 0;

    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #E7E5E0;
}

.rok-hero__placeholder {
    margin: 0;

    color: #70767C;

    font-family: "IBM Plex Mono", monospace;
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
}

.rok-hero__media {
    overflow: hidden;
}

.rok-hero__media .rok-home-hero-image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
    object-position: center;
}
/* ========================================
   HERO — TYPOGRAPHY
======================================== */

.rok-hero__label {
    margin: 0 0 24px;

    color: #F05A24;

    font-family: "IBM Plex Mono", monospace;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.rok-hero__title {
    margin: 0;

    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 64px;
    font-weight: 700;
    line-height: 68px;
    letter-spacing: -0.02em;
}

.rok-hero__text {
    max-width: 500px;
    margin: 32px 0 0;

    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
}


/* ========================================
   SECONDARY BUTTON
======================================== */

.rok-button--secondary .wp-block-button__link {
    min-width: 158px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 12px 20px;

    background: transparent;
    color: #151719;

    border: 1px solid #151719;
    border-radius: 4px;

    font-family: Manrope, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;

    text-decoration: none;
    white-space: nowrap;
}
/* ========================================
   HERO — TYPOGRAPHY
======================================== */

.rok-hero__label {
    margin: 0 0 24px;

    color: #F05A24;

    font-family: "IBM Plex Mono", monospace;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.rok-hero__title {
    margin: 0;

    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 64px;
    font-weight: 700;
    line-height: 68px;
    letter-spacing: -0.02em;
}

.rok-hero__text {
    max-width: 500px;
    margin: 32px 0 0;

    color: #151719;

    font-family: Manrope, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
}


/* ========================================
   SECONDARY BUTTON
======================================== */

.rok-button--secondary .wp-block-button__link {
    min-width: 158px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 12px 20px;

    background: transparent;
    color: #151719;

    border: 1px solid #151719;
    border-radius: 4px;

    font-family: Manrope, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;

    text-decoration: none;
    white-space: nowrap;
}
/* =========================================================
   SERVICES
   ========================================================= */

.rok-services {
	background: #ffffff;
	margin: 0;
	padding: 96px 0 104px;
}

.rok-services__inner {
	width: calc(100% - 240px);
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
}

/* Section label */

.rok-section-label {
	margin: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: 0;
	color: #f05a24;
	text-transform: uppercase;
}

/* Main heading */

.rok-services__title {
	max-width: 760px;
	margin: 16px 0 0;
	font-family: "Manrope", sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
	color: #151719;
}

/* Services grid */

.rok-services__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	margin-top: 64px;
	padding: 0;
}

/* Individual service */

.rok-service-card {
	position: relative;
	min-width: 0;
	margin: 0;
	padding: 24px 0 0;
	border-top: 1px solid #70767c;
}

/* Number */

.rok-service-card__number {
	margin: 0 0 48px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	color: #f05a24;
}

/* Card heading */

.rok-service-card__title {
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
	letter-spacing: 0;
	color: #151719;
}

/* Description */

.rok-service-card__text {
	max-width: 340px;
	margin: 16px 0 0;
	font-family: "Manrope", sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
	color: #70767c;
}

/* Remove WordPress block spacing inside Services */

.rok-services .wp-block-group,
.rok-services .wp-block-heading,
.rok-services p {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* Restore the exact spacing we need */

.rok-services .rok-services__title {
	margin-top: 16px;
}

.rok-services .rok-services__grid {
	margin-top: 64px;
}

.rok-services .rok-service-card__number {
	margin-bottom: 48px;
}

.rok-services .rok-service-card__text {
	margin-top: 16px;
}
/* =========================================================
   EXCHANGE FUND
   ========================================================= */

.rok-exchange {
	background: #151719;
	margin: 0;
	padding: 96px 0;
	color: #ffffff;
}

.rok-exchange__inner {
	width: calc(100% - 240px);
	max-width: 1200px;
	margin: 0 auto;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 80px;
	align-items: stretch;
}

/* LEFT SIDE */

.rok-exchange__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0;
	padding: 0;
}

.rok-exchange__label {
	margin: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	color: #f05a24;
	text-transform: uppercase;
}

.rok-exchange__title {
	max-width: 520px;
	margin: 16px 0 0;

	font-family: "Manrope", sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;

	color: #ffffff;
}

.rok-exchange__text {
	max-width: 480px;
	margin: 32px 0 0;

	font-family: "Manrope", sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;

	color: #e7e5e0;
}

/* BUTTON */

.rok-exchange__buttons {
	margin: 48px 0 0;
}

.rok-button--exchange .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 48px;
	padding: 12px 20px;

	background: #f05a24;
	color: #ffffff;

	border: 1px solid #f05a24;
	border-radius: 4px;

	font-family: "Manrope", sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;

	text-decoration: none;
}

/* RIGHT SIDE — PHOTO PLACEHOLDER */

.rok-exchange__media {
	min-height: 480px;
	margin: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	background: #26292c;
}

.rok-exchange__placeholder {
	margin: 0;
	padding: 32px;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	color: #70767c;
	text-align: center;
	text-transform: uppercase;
}

/* REMOVE WORDPRESS DEFAULT SPACING */

.rok-exchange .wp-block-group,
.rok-exchange .wp-block-heading,
.rok-exchange .wp-block-buttons,
.rok-exchange p {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* RESTORE OUR SPACING */

.rok-exchange .rok-exchange__title {
	margin-top: 16px;
}

.rok-exchange .rok-exchange__text {
	margin-top: 32px;
}

.rok-exchange .rok-exchange__buttons {
	margin-top: 48px;
}
/* =========================================================
   PROCESS
   ========================================================= */

.rok-process {
	width: 100%;
	margin: 0;
	padding: 104px 0 112px;

	background: #F5F4F0;
}

.rok-process__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 0;
}


/* ========================================
   PROCESS — HEADER
======================================== */

.rok-process .rok-section-label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}

.rok-process__title {
	max-width: 760px;

	margin: 16px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}


/* ========================================
   PROCESS — GRID
======================================== */

.rok-process__grid {
	display: grid;

	grid-template-columns: repeat(3, 1fr);

	column-gap: 24px;
	row-gap: 72px;

	margin: 72px 0 0;
	padding: 0;
}


/* ========================================
   PROCESS — CARD
======================================== */

.rok-process-card {
	margin: 0;
	padding: 24px 0 0;

	border-top: 1px solid #70767C;
}

.rok-process-card__number {
	margin: 0 0 40px;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}

.rok-process-card__title {
	margin: 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
}

.rok-process-card__text {
	max-width: 340px;

	margin: 16px 0 0;

	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-process .wp-block-group,
.rok-process .wp-block-heading,
.rok-process p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE PROCESS SPACING
======================================== */

.rok-process .rok-process__title {
	margin-top: 16px;
}

.rok-process .rok-process__grid {
	margin-top: 72px;
}

.rok-process .rok-process-card__number {
	margin-bottom: 40px;
}

.rok-process .rok-process-card__text {
	margin-top: 16px;
}
/* =========================================================
   FACTS
   ========================================================= */

.rok-facts {
	width: 100%;
	margin: 0;
	padding: 88px 0 96px;

	background: #FFFFFF;
}

.rok-facts__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 0;
}


/* ========================================
   FACTS — LABEL
======================================== */

.rok-facts__label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}


/* ========================================
   FACTS — GRID
======================================== */

.rok-facts__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);

	column-gap: 24px;

	margin: 48px 0 0;
	padding: 0;
}


/* ========================================
   FACT
======================================== */

.rok-fact {
	margin: 0;
	padding: 24px 0 0;

	border-top: 1px solid #70767C;
}

.rok-fact__value {
	margin: 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 64px;
	font-weight: 700;
	line-height: 68px;
	letter-spacing: -0.02em;
}

.rok-fact__text {
	max-width: 220px;

	margin: 24px 0 0;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-facts .wp-block-group,
.rok-facts p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE FACTS SPACING
======================================== */

.rok-facts .rok-facts__grid {
	margin-top: 48px;
}

.rok-facts .rok-fact__text {
	margin-top: 24px;
}
/* =========================================================
   TRUSTED
   ========================================================= */

.rok-trusted {
	width: 100%;
	margin: 0;
	padding: 104px 0 112px;

	background: #F5F4F0;
}

.rok-trusted__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 0;
}


/* ========================================
   TRUSTED — HEADER
======================================== */

.rok-trusted__header {
	margin: 0;
	padding: 0;
}

.rok-trusted .rok-section-label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}

.rok-trusted__title {
	max-width: 820px;

	margin: 16px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}


/* ========================================
   TRUSTED — GRID
======================================== */

.rok-trusted__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);

	column-gap: 24px;
	row-gap: 56px;

	margin: 72px 0 0;
	padding: 0;
}


/* ========================================
   TRUSTED — COMPANY
======================================== */

.rok-trusted-company {
	min-height: 128px;

	margin: 0;
	padding: 20px 0 0;

	border-top: 1px solid #70767C;

	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.rok-trusted-company__number {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;
}

.rok-trusted-company__name {
	max-width: 250px;

	margin: 32px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;

	text-transform: uppercase;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-trusted .wp-block-group,
.rok-trusted .wp-block-heading,
.rok-trusted p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE TRUSTED SPACING
======================================== */

.rok-trusted .rok-trusted__title {
	margin-top: 16px;
}

.rok-trusted .rok-trusted__grid {
	margin-top: 72px;
}

.rok-trusted .rok-trusted-company__name {
	margin-top: 32px;
}
/* =========================================================
   EQUIPMENT
   ========================================================= */

.rok-equipment {
	width: 100%;
	margin: 0;
	padding: 112px 0;

	background: #FFFFFF;
}

.rok-equipment__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 0;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 80px;
	align-items: start;
}


/* ========================================
   EQUIPMENT — LEFT SIDE
======================================== */

.rok-equipment__header {
	margin: 0;
	padding: 0;
}

.rok-equipment .rok-section-label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}

.rok-equipment__title {
	max-width: 520px;

	margin: 16px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}

.rok-equipment__text {
	max-width: 480px;

	margin: 32px 0 0;

	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
}


/* ========================================
   EQUIPMENT — RIGHT SIDE
======================================== */

.rok-equipment__list {
	margin: 0;
	padding: 0;

	border-top: 1px solid #70767C;
}

.rok-equipment-item {
	min-height: 72px;

	margin: 0;
	padding: 0;

	display: grid;
	grid-template-columns: 56px 1fr;
	align-items: center;

	border-bottom: 1px solid #E7E5E0;
}

.rok-equipment-item__number {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;
}

.rok-equipment-item__name {
	margin: 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-equipment .wp-block-group,
.rok-equipment .wp-block-heading,
.rok-equipment p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE EQUIPMENT SPACING
======================================== */

.rok-equipment .rok-equipment__title {
	margin-top: 16px;
}

.rok-equipment .rok-equipment__text {
	margin-top: 32px;
}
/* =========================================================
   CASES
   ========================================================= */

.rok-cases {
	width: 100%;
	margin: 0;
	padding: 112px 0 120px;

	background: #F5F4F0;
}

.rok-cases__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 0;
}


/* ========================================
   CASES — HEADER
======================================== */

.rok-cases__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;

	margin: 0;
	padding: 0;
}

.rok-cases .rok-section-label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}

.rok-cases__title {
	max-width: 760px;

	margin: 16px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}

.rok-cases__all {
	margin: 0 0 8px;

	color: #151719;

	font-family: "IBM Plex Mono", monospace;
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;

	text-decoration: none;
}


/* ========================================
   CASES — GRID
======================================== */

.rok-cases__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);

	column-gap: 24px;

	margin: 64px 0 0;
	padding: 0;
}


/* ========================================
   CASE CARD
======================================== */

.rok-case-card {
	min-width: 0;

	margin: 0;
	padding: 0;
}


/* ========================================
   CASE CARD — IMAGE
======================================== */

.rok-case-card__media {
	width: 100%;
	aspect-ratio: 1.25 / 1;

	margin: 0;
	padding: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	overflow: hidden;

	background: #E7E5E0;
}

.rok-case-card__media p {
	margin: 0;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;
}


/* ========================================
   CASE CARD — META
======================================== */

.rok-case-card__meta {
	display: flex;
	align-items: center;
	gap: 8px;

	margin: 20px 0 0;
}

.rok-case-card__meta span {
	display: inline-flex;
	align-items: center;

	padding: 5px 8px;

	border: 1px solid #70767C;
	border-radius: 2px;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;

	text-transform: uppercase;
}


/* ========================================
   CASE CARD — TITLE
======================================== */

.rok-case-card__title {
	margin: 16px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
}


/* ========================================
   CASE CARD — LINK
======================================== */

.rok-case-card__link {
	display: inline-block;

	margin: 24px 0 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	text-decoration: none;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-cases .wp-block-group,
.rok-cases .wp-block-heading,
.rok-cases p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE CASES SPACING
======================================== */

.rok-cases .rok-cases__title {
	margin-top: 16px;
}

.rok-cases .rok-cases__grid {
	margin-top: 64px;
}

.rok-cases .rok-case-card__media p {
	margin: 0;
}
/* =========================================================
   DELIVERY
   ========================================================= */

.rok-delivery {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #26292C;
}

.rok-delivery__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 550px;

	margin: 0 auto;
	padding: 96px 0;

	display: grid;
	grid-template-columns: 2fr 1fr;
	column-gap: 80px;
	align-items: start;
}


/* ========================================
   DELIVERY — LEFT
======================================== */

.rok-delivery__content {
	margin: 0;
	padding: 0;
}

.rok-delivery__label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}

.rok-delivery__title {
	max-width: 700px;

	margin: 32px 0 0;

	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}

.rok-delivery__text {
	max-width: 650px;

	margin: 40px 0 0;

	color: #E7E5E0;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
}


/* ========================================
   DELIVERY — RIGHT / ROUTE
======================================== */

.rok-delivery__route {
	margin: 16px 0 0;
	padding: 0;
}

.rok-delivery__route-label {
	margin: 0;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;

	text-transform: uppercase;
}

.rok-delivery__city {
	margin: 28px 0 0;

	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 40px;

	text-transform: uppercase;
}

.rok-delivery__arrow {
	margin: 32px 0 0;

	color: #F05A24;

	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 400;
	line-height: 40px;
}

.rok-delivery__country {
	margin: 28px 0 0;

	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 40px;

	text-transform: uppercase;
}

.rok-delivery__route-text {
	margin: 28px 0 0;

	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-delivery .wp-block-group,
.rok-delivery .wp-block-heading,
.rok-delivery p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE DELIVERY SPACING
======================================== */

.rok-delivery .rok-delivery__title {
	margin-top: 32px;
}

.rok-delivery .rok-delivery__text {
	margin-top: 40px;
}

.rok-delivery .rok-delivery__route {
	margin-top: 16px;
}

.rok-delivery .rok-delivery__city {
	margin-top: 28px;
}

.rok-delivery .rok-delivery__arrow {
	margin-top: 32px;
}

.rok-delivery .rok-delivery__country {
	margin-top: 28px;
}

.rok-delivery .rok-delivery__route-text {
	margin-top: 28px;
}
/* =========================================================
   WARRANTY
   ========================================================= */

.rok-warranty {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #FFFFFF;
}

.rok-warranty__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 560px;

	margin: 0 auto;
	padding: 96px 0 104px;

	display: grid;
	grid-template-columns: 2fr 1fr;
	column-gap: 80px;
	align-items: start;
}


/* ========================================
   WARRANTY — LEFT
======================================== */

.rok-warranty__content {
	margin: 0;
	padding: 0;
}

.rok-warranty__label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}

.rok-warranty__title {
	max-width: 720px;

	margin: 32px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}

.rok-warranty__text {
	max-width: 650px;

	margin: 40px 0 0;

	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
}


/* ========================================
   WARRANTY — RIGHT
======================================== */

.rok-warranty__items {
	margin: 16px 0 0;
	padding: 0;
}

.rok-warranty-item {
	margin: 0;
	padding: 0;
}

.rok-warranty-item + .rok-warranty-item {
	margin-top: 72px;
}

.rok-warranty-item__number {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
}

.rok-warranty-item__title {
	margin: 28px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
}

.rok-warranty-item__text {
	max-width: 380px;

	margin: 24px 0 0;

	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-warranty .wp-block-group,
.rok-warranty .wp-block-heading,
.rok-warranty p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE WARRANTY SPACING
======================================== */

.rok-warranty .rok-warranty__title {
	margin-top: 32px;
}

.rok-warranty .rok-warranty__text {
	margin-top: 40px;
}

.rok-warranty .rok-warranty__items {
	margin-top: 16px;
}

.rok-warranty .rok-warranty-item + .rok-warranty-item {
	margin-top: 72px;
}

.rok-warranty .rok-warranty-item__title {
	margin-top: 28px;
}

.rok-warranty .rok-warranty-item__text {
	margin-top: 24px;
}
/* =========================================================
   REVIEWS
   ========================================================= */

.rok-reviews {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #F5F4F0;
}

.rok-reviews__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 560px;

	margin: 0 auto;
	padding: 96px 0 88px;

	display: grid;
	grid-template-columns: 1fr 2fr;
	column-gap: 80px;
	align-items: start;
}


/* ========================================
   REVIEWS — LEFT
======================================== */

.rok-reviews__header {
	margin: 0;
	padding: 0;
}

.rok-reviews__label {
	margin: 0;

	color: #F05A24;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}

.rok-reviews__title {
	margin: 32px 0 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}


/* ========================================
   REVIEWS — RIGHT
======================================== */

.rok-reviews__content {
	margin: 80px 0 0;
	padding: 0;
}

.rok-reviews__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 72px;

	margin: 0;
	padding: 0;
}


/* ========================================
   REVIEW
======================================== */

.rok-review {
	margin: 0;
	padding: 0;

	display: flex;
	flex-direction: column;
}

.rok-review__text {
	max-width: 330px;
	min-height: 160px;

	margin: 0;

	color: #151719;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 30px;
}

.rok-review__author {
	margin: 24px 0 0;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}


/* ========================================
   REVIEWS — NAVIGATION
======================================== */

.rok-reviews__navigation {
	margin: 72px 0 0;

	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 32px;
}

.rok-reviews__arrow {
	margin: 0;
	padding: 0;

	width: 32px;
	height: 32px;

	display: flex;
	align-items: center;
	justify-content: center;

	background: transparent;
	color: #151719;

	border: 0;

	font-family: Manrope, sans-serif;
	font-size: 26px;
	font-weight: 400;
	line-height: 32px;

	cursor: pointer;
}

.rok-reviews__counter {
	display: flex;
	align-items: center;
	gap: 10px;

	margin: 0;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-reviews .wp-block-group,
.rok-reviews .wp-block-heading,
.rok-reviews p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE REVIEWS SPACING
======================================== */

.rok-reviews .rok-reviews__title {
	margin-top: 32px;
}

.rok-reviews .rok-reviews__content {
	margin-top: 80px;
}

.rok-reviews .rok-review__author {
	margin-top: 24px;
}

.rok-reviews .rok-reviews__navigation {
	margin-top: 72px;
}
/* =========================================================
   FINAL CTA
   ========================================================= */

.rok-final-cta {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #F05A24;
}

.rok-final-cta__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 560px;

	margin: 0 auto;
	padding: 88px 0;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}


/* ========================================
   FINAL CTA — LEFT
======================================== */

.rok-final-cta__content {
	margin: 0;
	padding: 0;
}

.rok-final-cta__label {
	margin: 0;

	color: #151719;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}

.rok-final-cta__title {
	max-width: 520px;

	margin: 24px 0 0;

	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;
}

.rok-final-cta__text {
	max-width: 520px;

	margin: 32px 0 0;

	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;
}


/* ========================================
   FINAL CTA — FORM
======================================== */

.rok-final-cta__form {
	margin: 0;
	padding: 0;
}

.rok-final-cta__field {
	margin: 0 0 28px;
	padding: 0;
}

.rok-final-cta__field label {
	display: block;

	margin: 0 0 8px;

	color: #151719;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}

.rok-final-cta__field input {
	display: block;

	width: 100%;
	height: 42px;

	margin: 0;
	padding: 4px 0;

	background: transparent;
	color: #FFFFFF;

	border: 0;
	border-bottom: 1px solid rgba(21, 23, 25, 0.55);
	border-radius: 0;
	outline: none;

	font-family: Manrope, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 28px;
}

.rok-final-cta__field input:focus {
	border-bottom-color: #151719;
}


/* ========================================
   FINAL CTA — BUTTON
======================================== */

.rok-final-cta__button {
	width: 100%;
	height: 52px;

	margin: 12px 0 0;
	padding: 0 24px;

	display: flex;
	align-items: center;
	justify-content: center;

	background: #151719;
	color: #FFFFFF;

	border: 1px solid #151719;
	border-radius: 4px;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;

	cursor: pointer;
}

.rok-final-cta__button:hover {
	background: #26292C;
	border-color: #26292C;
}


/* ========================================
   FINAL CTA — PRIVACY
======================================== */

.rok-final-cta__privacy {
	max-width: 440px;

	margin: 16px 0 0;

	color: rgba(21, 23, 25, 0.65);

	font-family: Manrope, sans-serif;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-final-cta .wp-block-group,
.rok-final-cta .wp-block-heading,
.rok-final-cta p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE FINAL CTA SPACING
======================================== */

.rok-final-cta .rok-final-cta__title {
	margin-top: 24px;
}

.rok-final-cta .rok-final-cta__text {
	margin-top: 32px;
}

.rok-final-cta .rok-final-cta__privacy {
	margin-top: 16px;
}
/* =========================================================
   FOOTER
   ========================================================= */

.rok-footer {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #151719;
	color: #FFFFFF;
}

.rok-footer__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 80px 0 48px;
}


/* ========================================
   FOOTER — TOP
======================================== */

.rok-footer__top {
	display: grid;
	grid-template-columns: 2fr 1fr 1.5fr 1.5fr;
	column-gap: 64px;

	margin: 0;
	padding: 0 0 64px;
}


/* ========================================
   FOOTER — BRAND
======================================== */

.rok-footer__brand {
	margin: 0;
	padding: 0;
}

.rok-footer__logo {
	margin: 0;

	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;
}

.rok-footer__descriptor {
	margin: 24px 0 0;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}


/* ========================================
   FOOTER — COLUMNS
======================================== */

.rok-footer__column {
	margin: 0;
	padding: 0;
}

.rok-footer__heading {
	margin: 0 0 32px;

	color: #70767C;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 20px;

	text-transform: uppercase;
}


/* ========================================
   FOOTER — NAVIGATION
======================================== */

.rok-footer__nav {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 18px;
}

.rok-footer__nav a {
	color: #E7E5E0;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;

	text-decoration: none;
}

.rok-footer__nav a:hover {
	color: #F05A24;
}


/* ========================================
   FOOTER — CONTACTS
======================================== */

.rok-footer__contact-list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}

.rok-footer__contact-list a,
.rok-footer__contact-list p {
	margin: 0;

	color: #E7E5E0;

	font-family: Manrope, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 26px;

	text-decoration: none;
}

.rok-footer__contact-list a:hover {
	color: #F05A24;
}

.rok-footer__contact-list .rok-footer__address {
	color: #70767C;
}


/* ========================================
   FOOTER — BOTTOM
======================================== */

.rok-footer__bottom {
	padding: 40px 0 0;

	border-top: 1px solid #26292C;

	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.rok-footer__copyright {
	margin: 0;

	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
}

.rok-footer__legal {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;

	width: 280px;
}

.rok-footer__legal a {
	color: #70767C;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;

	text-decoration: none;
}

.rok-footer__legal a:hover {
	color: #E7E5E0;
}


/* ========================================
   REMOVE WORDPRESS DEFAULT SPACING
======================================== */

.rok-footer .wp-block-group,
.rok-footer p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* ========================================
   RESTORE FOOTER SPACING
======================================== */

.rok-footer .rok-footer__descriptor {
	margin-top: 24px;
}

.rok-footer .rok-footer__heading {
	margin-bottom: 32px;
}
/* =========================================================
   FORM STATUS
   ========================================================= */

.rok-final-cta__status {
	margin: 16px 0 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
}

.rok-final-cta__status:empty {
	display: none;
}

.rok-final-cta__status.is-success {
	color: #151719;
}

.rok-final-cta__status.is-error {
	color: #151719;
}

.rok-final-cta__button:disabled {
	cursor: wait;
	opacity: 0.65;
}
/* =========================================================
   SERVICE PAGE — HERO
   ========================================================= */

.rok-service-hero {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #F5F4F0;
}


.rok-service-hero__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 640px;

	margin: 0 auto;
	padding: 88px 0;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;

	align-items: stretch;
}


/* =========================================================
   SERVICE HERO — CONTENT
   ========================================================= */

.rok-service-hero__content {
	margin: 0;
	padding: 0;

	display: flex;
	flex-direction: column;
	align-items: flex-start;
}


.rok-service-hero__label {
	margin: 0 0 32px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	color: #F05A24;
}


.rok-service-hero__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 64px;
	font-weight: 700;
	line-height: 68px;
	letter-spacing: -0.02em;

	color: #151719;
}


.rok-service-hero__text {
	max-width: 520px;

	margin: 32px 0 40px;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;

	color: #151719;
}


/* =========================================================
   SERVICE HERO — BUTTON
   ========================================================= */

.rok-service-hero .wp-block-buttons {
	margin: 0;
	padding: 0;
}


.rok-service-hero .rok-button--primary
.wp-block-button__link {
	min-height: 48px;

	padding: 14px 24px;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	border: 0;
	border-radius: 0;

	background: #F05A24;
	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;

	text-decoration: none;
}


.rok-service-hero .rok-button--primary
.wp-block-button__link:hover {
	background: #151719;
	color: #FFFFFF;
}


/* =========================================================
   SERVICE HERO — MEDIA
   ========================================================= */

.rok-service-hero__media {
	width: 100%;
	min-height: 464px;

	margin: 0;
	padding: 32px;

	display: flex;
	align-items: center;
	justify-content: center;

	background: #E7E5E0;

	overflow: hidden;
}


.rok-service-hero__placeholder {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	color: #70767C;

	text-align: center;
}
/* =========================================================
   SERVICE PAGE — ENGINE MODELS
   ========================================================= */

.rok-service-models {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #FFFFFF;
}


.rok-service-models__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 72px 0 88px;
}


/* =========================================================
   ENGINE MODELS — HEADING
   ========================================================= */

.rok-service-models__heading {
	margin: 0;
	padding: 0;
}


.rok-service-models__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


.rok-service-models__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;
	letter-spacing: -0.015em;

	color: #151719;
}


.rok-service-models__text {
	margin: 24px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;

	color: #70767C;
}


/* =========================================================
   ENGINE MODELS — GROUPS
   ========================================================= */

.rok-service-models__groups {
	width: 100%;

	margin: 72px 0 0;
	padding: 0;

	display: grid;
	grid-template-columns: 2fr 1fr;
	column-gap: 72px;
}


.rok-service-models__group {
	margin: 0;
	padding: 0;
}


.rok-service-models__group-label {
	margin: 0 0 20px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;

	color: #70767C;
}


.rok-service-models__list {
	margin: 0;
	padding: 0;

	display: flex;
	flex-direction: column;
	gap: 12px;
}


.rok-service-models__list p {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 18px;
	font-weight: 500;
	line-height: 26px;

	color: #151719;
}


/* =========================================================
   ENGINE MODELS — GRID
   ========================================================= */

.rok-service-models__grid {
	width: 100%;

	display: grid;
	grid-template-columns: repeat(4, 1fr);

	border-top: 1px solid #E7E5E0;
	border-left: 1px solid #E7E5E0;
}


.rok-service-model {
	min-height: 136px;

	margin: 0;
	padding: 24px;

	display: flex;
	flex-direction: column;
	justify-content: space-between;

	border-right: 1px solid #E7E5E0;
	border-bottom: 1px solid #E7E5E0;

	background: #FFFFFF;
}


.rok-service-model span {
	display: block;

	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
}


.rok-service-model p {
	margin: 24px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;

	color: #151719;
}


/* =========================================================
   ENGINE MODELS — LAST ITEM
   ========================================================= */

.rok-service-model:last-child {
	background: #F5F4F0;
}
/* =========================================================
   SERVICE PAGE — EQUIPMENT
   ========================================================= */

.rok-service-equipment {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #FFFFFF;
}


.rok-service-equipment__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 72px 0 80px;
}


/* =========================================================
   EQUIPMENT — LABEL
   ========================================================= */

.rok-service-equipment .rok-section-label {
	margin: 0 0 32px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
}


/* =========================================================
   EQUIPMENT — BRANDS
   ========================================================= */

.rok-service-equipment__brands {
	margin: 0;
	padding: 0;

	display: flex;
	align-items: center;
	flex-wrap: nowrap;

	gap: 24px;
}


.rok-service-equipment__brands p {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 28px;
	font-weight: 600;
	line-height: 36px;

	color: #151719;

	white-space: nowrap;
}
/* =========================================================
   SERVICE PAGE — PROCESS
   ========================================================= */

.rok-service-process {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #F5F4F0;
}


.rok-service-process__inner {
	width: 1200px;
	max-width: 1200px;

	margin: 0 auto;
	padding: 80px 0 96px;
}


/* =========================================================
   PROCESS — HEADING
   ========================================================= */

.rok-service-process__heading {
	margin: 0 0 64px;
	padding: 0;
}


.rok-service-process__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


.rok-service-process__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;

	color: #151719;
}


/* =========================================================
   PROCESS — CONTENT
   ========================================================= */

.rok-service-process__content {
	width: 100%;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 48px;

	align-items: start;
}


/* =========================================================
   PROCESS — PHOTO
   ========================================================= */

.rok-service-process__media {
	width: 100%;
	height: 464px;

	margin: 0;
	padding: 32px;

	display: flex;
	align-items: center;
	justify-content: center;

	background: #E7E5E0;

	overflow: hidden;
}


.rok-service-process__media p {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;

	text-align: center;
}


/* =========================================================
   PROCESS — STEPS
   ========================================================= */

.rok-service-process__steps {
	width: 100%;
	margin: 0;
	padding: 0;
}


.rok-service-process__item {
	width: 100%;

	margin: 0;
	padding: 0 0 24px;

	display: grid;
	grid-template-columns: 40px 1fr;
	column-gap: 8px;

	border-bottom: 1px solid #E7E5E0;
}


.rok-service-process__item + .rok-service-process__item {
	padding-top: 24px;
}


.rok-service-process__item span {
	margin: 2px 0 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


.rok-service-process__item h3 {
	margin: 0 0 12px;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 30px;

	color: #151719;
}


.rok-service-process__item p {
	max-width: 500px;

	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* =========================================================
   PROCESS — LAST STEP
   ========================================================= */

.rok-service-process__item:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
/* =========================================================
   SERVICE PAGE — EXCHANGE
   ========================================================= */

.rok-service-exchange {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #151719;
	color: #FFFFFF;
}


.rok-service-exchange__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 536px;

	margin: 0 auto;
	padding: 72px 0 80px;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;

	align-items: start;
}


/* =========================================================
   EXCHANGE — LEFT
   ========================================================= */

.rok-service-exchange__content {
	margin: 0;
	padding: 0;
}


.rok-service-exchange__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


.rok-service-exchange__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;

	color: #FFFFFF;
}


.rok-service-exchange__text {
	margin: 24px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


.rok-service-exchange__time {
	margin: 40px 0 0;
	padding: 0;
}


.rok-service-exchange__days {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;

	color: #F05A24;
}


.rok-service-exchange__after {
	margin: 4px 0 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
}


/* =========================================================
   EXCHANGE — RIGHT
   ========================================================= */

.rok-service-exchange__stock {
	margin: 0;
	padding: 0;
}


.rok-service-exchange__stock-label {
	margin: 0 0 16px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
}


.rok-service-exchange__list {
	margin: 0;
	padding: 0;
}


.rok-service-exchange__item {
	min-height: 67px;

	margin: 0;
	padding: 18px 0;

	display: grid;
	grid-template-columns: 1fr 160px;
	column-gap: 24px;

	align-items: center;

	border-bottom: 1px solid #26292C;
}


.rok-service-exchange__model {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;

	color: #FFFFFF;
}


.rok-service-exchange__availability {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;

	color: #70767C;

	white-space: nowrap;
}


.rok-service-exchange__availability.is-available {
	color: #F05A24;
}


/* =========================================================
   EXCHANGE — BUTTON
   ========================================================= */

.rok-service-exchange__button {
	margin: 24px 0 0;
	padding: 14px 20px;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 48px;

	background: #F05A24;
	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;

	text-decoration: none;
}


.rok-service-exchange__button:visited {
	color: #FFFFFF;
}


.rok-service-exchange__button:hover {
	background: #FFFFFF;
	color: #151719;
}
/* =========================================================
   SERVICE PAGE — DEFECT INSPECTION
   ========================================================= */

.rok-service-defect {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #FFFFFF;
}


.rok-service-defect__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 512px;

	margin: 0 auto;
	padding: 64px 0;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;

	align-items: start;
}


/* =========================================================
   DEFECT — CONTENT
   ========================================================= */

.rok-service-defect__content {
	margin: 0;
	padding: 0;
}


.rok-service-defect__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


.rok-service-defect__title {
	max-width: 520px;

	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 14px;
	font-weight: 500;
	line-height: 22px;
	letter-spacing: 0;

	color: #151719;
}


.rok-service-defect__text {
	max-width: 520px;

	margin: 24px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* =========================================================
   DEFECT — PHOTO
   ========================================================= */

.rok-service-defect__media {
	width: 100%;
	height: 400px;

	margin: 0;
	padding: 32px;

	display: flex;
	align-items: center;
	justify-content: center;

	background: #E7E5E0;

	overflow: hidden;
}


.rok-service-defect__media p {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;

	text-align: center;
}
/* =========================================================
   SERVICE PAGE — WARRANTY
   ========================================================= */

.rok-service-warranty {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-service-warranty__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 360px;

	margin: 0 auto;
	padding: 72px 0 80px;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}


/* LEFT */

.rok-service-warranty__content {
	margin: 0;
	padding: 0;
}

.rok-service-warranty__label {
	margin: 0 0 28px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-service-warranty__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;

	color: #151719;
}


/* RIGHT */

.rok-service-warranty__info {
	margin: 28px 0 0;
	padding: 0;
}

.rok-service-warranty__value {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;

	color: #151719;
}

.rok-service-warranty__subtitle {
	margin: 4px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 32px;

	color: #151719;
}

.rok-service-warranty__text {
	margin: 12px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;

	color: #70767C;
}
/* =========================================================
   SERVICE PAGE — CASES
   ========================================================= */

.rok-service-cases {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-service-cases__inner {
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 72px 0 88px;
}


/* HEADING */

.rok-service-cases__heading {
	margin: 0 0 16px;
	padding: 0;
}

.rok-service-cases__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-service-cases__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: -0.015em;

	color: #151719;
}


/* GRID */

.rok-service-cases__grid {
	width: 100%;
	margin: 0;
	padding: 0;

	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
}


/* CARD */

.rok-service-case {
	min-width: 0;
	margin: 0;
	padding: 0;
}


/* PHOTO */

.rok-service-case__media {
	width: 100%;
	height: 294px;

	margin: 0;
	padding: 24px;

	display: flex;
	align-items: center;
	justify-content: center;

	background: #E7E5E0;
	overflow: hidden;
}

.rok-service-case__media p {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
	text-align: center;
}


/* MODEL */

.rok-service-case__model {
	margin: 12px 0 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


/* TITLE */

.rok-service-case__title {
	margin: 12px 0 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #151719;
}
/* =========================================================
   EXCHANGE PAGE — HERO
   ========================================================= */

.rok-exchange-hero {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-exchange-hero__inner {
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 56px 0 64px;
}


/* BREADCRUMBS */

.rok-exchange-hero__breadcrumbs {
	margin: 0 0 32px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
}


/* GRID */

.rok-exchange-hero__grid {
	width: 100%;
	margin: 0;
	padding: 0;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: stretch;
}


/* LEFT */

.rok-exchange-hero__content {
	margin: 0;
	padding: 8px 0;
}

.rok-exchange-hero__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-exchange-hero__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 64px;
	font-weight: 700;
	line-height: 68px;
	letter-spacing: -0.02em;

	color: #151719;
}

.rok-exchange-hero__text {
	max-width: 500px;
	margin: 32px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* BUTTON */

.rok-exchange-hero__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 48px;
	margin: 32px 0 0;
	padding: 14px 20px;

	background: #F05A24;
	color: #FFFFFF;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;

	text-decoration: none;
}

.rok-exchange-hero__button:visited {
	color: #FFFFFF;
}

.rok-exchange-hero__button:hover {
	background: #151719;
	color: #FFFFFF;
}


/* RIGHT — PHOTO */

.rok-exchange-hero__media {
	width: 100%;
	height: 440px;
	margin: 0;
	padding: 32px;

	display: flex;
	align-items: flex-end;
	justify-content: center;

	background: #E7E5E0;
	overflow: hidden;
}

.rok-exchange-hero__media p {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #70767C;
	text-align: center;
}
/* =========================================================
   EXCHANGE PAGE — STOCK
   ========================================================= */

.rok-exchange-stock {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #FFFFFF;
}

.rok-exchange-stock__inner {
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 72px 0 88px;
}

/* HEADING */

.rok-exchange-stock__heading {
	margin: 0;
	padding: 0;
}

.rok-exchange-stock__label {
	margin: 0 0 24px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-exchange-stock__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;
	letter-spacing: -0.015em;
	color: #151719;
}

.rok-exchange-stock__text {
	margin: 20px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #70767C;
}

/* FILTERS */

.rok-exchange-stock__tabs {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 40px 0 48px;
	padding: 0;
}

.rok-exchange-stock__tab {
	margin: 0;
	padding: 10px 16px;
	border: 1px solid #D4D2CD;
	border-radius: 2px;
	background: transparent;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #70767C;
	cursor: pointer;
}

.rok-exchange-stock__tab.is-active {
	border-color: #151719;
	background: #151719;
	color: #FFFFFF;
}

/* GRID */

.rok-exchange-stock__grid {
	width: 100%;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 24px;
	row-gap: 56px;
}

.rok-exchange-stock__grid > p {
	display: none !important;
}

.rok-exchange-stock__grid[hidden] {
	display: none;
}

/* CARD */

.rok-exchange-card {
	min-width: 0;
	margin: 0;
	padding: 0;
}

.rok-exchange-card[hidden] {
	display: none !important;
}

/* IMAGE */

.rok-exchange-card__media {
	width: 100%;
	height: 196px;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #F5F4F0;
	border: 1px solid #E7E5E0;
	overflow: hidden;
}

.rok-exchange-card__media img,
.rok-exchange-card__image {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	object-fit: cover;
	object-position: center;
}

/* CARD TEXT */

.rok-exchange-card__title {
	margin: 20px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 28px;
	font-weight: 600;
	line-height: 36px;
	color: #151719;
}

.rok-exchange-card__meta {
	margin: 8px 0 0;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #70767C;
}

/* STATUS */

.rok-exchange-card__status {
	margin: 16px 0 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #70767C;
	white-space: nowrap;
}

.rok-exchange-card__status-dot {
	display: block;
	width: 9px;
	height: 9px;
	flex: 0 0 9px;
	border-radius: 50%;
	background: #70767C;
}

.rok-exchange-card__status-text {
	display: inline;
	width: auto;
	height: auto;
	flex: 0 1 auto;
	border-radius: 0;
	background: transparent;
}

.rok-exchange-card__status.is-available {
	color: #F05A24;
}

.rok-exchange-card__status.is-available .rok-exchange-card__status-dot {
	background: #F05A24;
}

.rok-exchange-card__status.is-unavailable {
	color: #70767C;
}

.rok-exchange-card__status.is-unavailable .rok-exchange-card__status-dot {
	background: #70767C;
}

/* =========================================================
   EXCHANGE PAGE — STEPS
   ========================================================= */

.rok-exchange-steps {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-exchange-steps__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 536px;
	margin: 0 auto;
	padding: 72px 0 88px;
}


/* =========================================================
   EXCHANGE STEPS — HEADING
   ========================================================= */

.rok-exchange-steps__heading {
	margin: 0;
	padding: 0;
}

.rok-exchange-steps__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-exchange-steps__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;
	letter-spacing: -0.015em;

	color: #151719;
}


/* =========================================================
   EXCHANGE STEPS — GRID
   ========================================================= */

.rok-exchange-steps__grid {
	width: 100%;
	margin: 64px 0 0;
	padding: 0;

	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 24px;
}


/* =========================================================
   EXCHANGE STEP
   ========================================================= */

.rok-exchange-step {
	margin: 0;
	padding: 0;
}

.rok-exchange-step__number {
	margin: 0 0 8px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-exchange-step__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 20px;
	font-weight: 500;
	line-height: 26px;

	color: #151719;
}

.rok-exchange-step__text {
	max-width: 250px;
	margin: 8px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* =========================================================
   REMOVE WORDPRESS DEFAULT SPACING
   ========================================================= */

.rok-exchange-steps .wp-block-group,
.rok-exchange-steps .wp-block-heading,
.rok-exchange-steps p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* =========================================================
   RESTORE EXACT SPACING
   ========================================================= */

.rok-exchange-steps .rok-exchange-steps__label {
	margin-bottom: 24px;
}

.rok-exchange-steps .rok-exchange-steps__grid {
	margin-top: 64px;
}

.rok-exchange-steps .rok-exchange-step__number {
	margin-bottom: 8px;
}

.rok-exchange-steps .rok-exchange-step__text {
	margin-top: 8px;
}
/* =========================================================
   EXCHANGE PAGE — CONDITIONS
   ========================================================= */

.rok-exchange-conditions {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #E7E5E0;
}

.rok-exchange-conditions__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 536px;
	margin: 0 auto;
	padding: 72px 0 80px;

	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}


/* =========================================================
   CONDITIONS — LEFT
   ========================================================= */

.rok-exchange-conditions__content {
	margin: 0;
	padding: 0;
}

.rok-exchange-conditions__label {
	margin: 0 0 24px;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-exchange-conditions__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;
	letter-spacing: -0.015em;

	color: #151719;
}

.rok-exchange-conditions__text {
	margin: 24px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* =========================================================
   CONDITIONS — RIGHT
   ========================================================= */

.rok-exchange-conditions__list {
	margin: 0;
	padding: 0;
}

.rok-exchange-condition {
	width: 100%;
	margin: 0;
	padding: 0 0 32px;

	display: grid;
	grid-template-columns: 40px 1fr;
	column-gap: 8px;

	border-bottom: 1px solid rgba(112, 118, 124, 0.25);
}

.rok-exchange-condition + .rok-exchange-condition {
	padding-top: 32px;
}

.rok-exchange-condition:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.rok-exchange-condition__number {
	margin: 2px 0 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}

.rok-exchange-condition__title {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 20px;
	font-weight: 500;
	line-height: 26px;

	color: #151719;
}

.rok-exchange-condition__text {
	margin: 12px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* =========================================================
   REMOVE WORDPRESS DEFAULT SPACING
   ========================================================= */

.rok-exchange-conditions .wp-block-group,
.rok-exchange-conditions .wp-block-heading,
.rok-exchange-conditions p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* =========================================================
   RESTORE EXACT SPACING
   ========================================================= */

.rok-exchange-conditions .rok-exchange-conditions__label {
	margin-bottom: 24px;
}

.rok-exchange-conditions .rok-exchange-conditions__text {
	margin-top: 24px;
}

.rok-exchange-conditions .rok-exchange-condition__text {
	margin-top: 12px;
}
/* =========================================================
   EXCHANGE PAGE — BENEFITS
   ========================================================= */

.rok-exchange-benefits {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #151719;
}

.rok-exchange-benefits__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 360px;
	margin: 0 auto;
	padding: 72px 0 80px;
}


/* =========================================================
   BENEFITS — SECTION LABEL
   ========================================================= */

.rok-exchange-benefits__label {
	margin: 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;

	color: #F05A24;
}


/* =========================================================
   BENEFITS — GRID
   ========================================================= */

.rok-exchange-benefits__grid {
	width: 100%;
	margin: 48px 0 0;
	padding: 0;

	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 72px;
}


/* =========================================================
   BENEFIT
   ========================================================= */

.rok-exchange-benefit {
	margin: 0;
	padding: 0;
}

.rok-exchange-benefit__value {
	margin: 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 600;
	line-height: 48px;

	color: #FFFFFF;
}

.rok-exchange-benefit__label {
	margin: 16px 0 0;
	padding: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;

	color: #70767C;
}

.rok-exchange-benefit__text {
	max-width: 330px;
	margin: 16px 0 0;
	padding: 0;

	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;

	color: #70767C;
}


/* =========================================================
   REMOVE WORDPRESS DEFAULT SPACING
   ========================================================= */

.rok-exchange-benefits .wp-block-group,
.rok-exchange-benefits p {
	margin-block-start: 0;
	margin-block-end: 0;
}


/* =========================================================
   RESTORE EXACT SPACING
   ========================================================= */

.rok-exchange-benefits .rok-exchange-benefits__grid {
	margin-top: 48px;
}

.rok-exchange-benefits .rok-exchange-benefit__label {
	margin-top: 16px;
}

.rok-exchange-benefits .rok-exchange-benefit__text {
	margin-top: 16px;
}
/* =========================================================
   EXCHANGE PAGE — CTA
   ========================================================= */

.rok-exchange-cta {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F05A24;
}

.rok-exchange-cta__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 500px;
	margin: 0 auto;
	padding: 72px 0 64px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}

/* LEFT */

.rok-exchange-cta__content {
	margin: 0;
	padding: 0;
}

.rok-exchange-cta__label {
	margin: 0 0 28px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-exchange-cta__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 44px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-exchange-cta__text {
	margin: 32px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #151719;
}

/* FORM */

.rok-exchange-cta__form {
	margin: 0;
	padding: 10px 0 0;
}

.rok-exchange-cta__field {
	margin: 0 0 32px;
	padding: 0;
}

.rok-exchange-cta__field label {
	display: block;
	margin: 0 0 12px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-exchange-cta__field input {
	display: block;
	width: 100%;
	height: 32px;
	margin: 0;
	padding: 0 0 8px;
	border: 0;
	border-bottom: 1px solid #151719;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: Manrope, sans-serif;
	font-size: 15px;
	color: #151719;
	appearance: none;
}

.rok-exchange-cta__field input:focus {
	border-bottom-color: #151719;
	outline: none;
}

/* BUTTON */

.rok-exchange-cta__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin: 8px 0 0;
	padding: 0 20px;
	border: 0;
	border-radius: 3px;
	background: #151719;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	color: #FFFFFF;
	cursor: pointer;
}

.rok-exchange-cta__privacy {
	margin: 24px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	color: #151719;
}
/* =========================================================
   CASES PAGE — HERO
   ========================================================= */

.rok-cases-page {
	margin: 0;
	padding: 0;
}

.rok-cases-hero {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-cases-hero__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 480px;
	margin: 0 auto;
	padding: 62px 0 72px;
	display: grid;
	grid-template-columns: 1fr 384px;
	column-gap: 96px;
	align-items: start;
}

.rok-cases-hero__content {
	margin: 0;
	padding: 0;
}

.rok-cases-hero__breadcrumbs {
	margin: 0 0 34px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}

.rok-cases-hero__label {
	margin: 0 0 28px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-cases-hero__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 52px;
	font-weight: 600;
	line-height: 1.04;
	letter-spacing: -0.025em;
	color: #151719;
}

.rok-cases-hero__text {
	margin: 30px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #70767C;
}

.rok-cases-hero__media {
	width: 384px;
	height: 320px;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #E7E5E0;
}

.rok-cases-hero__media span {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}

.rok-cases-hero__media {
	overflow: hidden;
}

.rok-cases-hero__media .rok-cases-hero-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
/* =========================================================
   CASES PAGE — CASES GRID
   ========================================================= */

.rok-cases-grid {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #FFFFFF;
}

.rok-cases-grid__inner {
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 88px 0 104px;
}

.rok-cases-grid__label {
	margin: 0 0 22px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-cases-grid__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #151719;
}

/* FILTERS */

.rok-cases-grid__filters {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 40px 0 48px;
	padding: 0;
}

.rok-cases-grid__filter {
	margin: 0;
	padding: 10px 16px;
	border: 1px solid #D4D2CD;
	border-radius: 2px;
	background: transparent;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #70767C;
	cursor: pointer;
}

.rok-cases-grid__filter.is-active {
	border-color: #151719;
	background: #151719;
	color: #FFFFFF;
}

/* GRID */

.rok-cases-grid__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	row-gap: 52px;
	margin: 0;
	padding: 0;
}

/* CARD */

.rok-case-card {
	margin: 0;
	padding: 0;
}

.rok-case-card__image {
	width: 100%;
	height: 240px;
	margin: 0 0 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #E7E5E0;
}

.rok-case-card__image span {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}

.rok-case-card__type {
	margin: 0 0 10px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 500;
	line-height: 16px;
	color: #F05A24;
}

.rok-case-card__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	color: #151719;
}

.rok-case-card__meta {
	margin: 10px 0 0;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 400;
	line-height: 16px;
	color: #70767C;
}
/* =========================================================
   CASES PAGE — CTA
   ========================================================= */

.rok-cases-cta {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F05A24;
}

.rok-cases-cta__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 500px;
	margin: 0 auto;
	padding: 72px 0 64px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}

/* LEFT */

.rok-cases-cta__content {
	margin: 0;
	padding: 0;
}

.rok-cases-cta__label {
	margin: 0 0 28px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-cases-cta__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 44px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-cases-cta__text {
	margin: 32px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #151719;
}

/* FORM */

.rok-cases-cta__form {
	margin: 0;
	padding: 10px 0 0;
}

.rok-cases-cta__field {
	margin: 0 0 32px;
	padding: 0;
}

.rok-cases-cta__field label {
	display: block;
	margin: 0 0 12px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-cases-cta__field input {
	display: block;
	width: 100%;
	height: 32px;
	margin: 0;
	padding: 0 0 8px;
	border: 0;
	border-bottom: 1px solid #151719;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: Manrope, sans-serif;
	font-size: 15px;
	color: #151719;
	appearance: none;
}

.rok-cases-cta__field input:focus {
	border-bottom-color: #151719;
	outline: none;
}

/* BUTTON */

.rok-cases-cta__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin: 8px 0 0;
	padding: 0 20px;
	border: 0;
	border-radius: 3px;
	background: #151719;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	color: #FFFFFF;
	cursor: pointer;
}

.rok-cases-cta__privacy {
	margin: 24px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	color: #151719;
}
/* =========================================================
   SINGLE CASE PAGE — HERO
   ========================================================= */

.rok-single-case {
	margin: 0;
	padding: 0;
}

.rok-single-case-hero {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-single-case-hero__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 500px;
	margin: 0 auto;
	padding: 62px 0 72px;
	display: grid;
	grid-template-columns: 1fr 492px;
	column-gap: 72px;
	align-items: start;
}

.rok-single-case-hero__content {
	margin: 0;
	padding: 0;
}

.rok-single-case-hero__breadcrumbs {
	margin: 0 0 42px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}

.rok-single-case-hero__label {
	margin: 0 0 30px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-single-case-hero__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 52px;
	font-weight: 600;
	line-height: 1.04;
	letter-spacing: -0.025em;
	color: #151719;
}

.rok-single-case-hero__text {
	margin: 24px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #70767C;
}

.rok-single-case-hero__media {
	width: 492px;
	height: 368px;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #E7E5E0;
}

.rok-single-case-hero__media span {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}
/* =========================================================
   CASES PAGE — CARDS / FIGMA FINAL
   ========================================================= */

.rok-cases-grid__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 24px;
	row-gap: 52px;
	margin: 0;
	padding: 0;
}

.rok-case-card {
	margin: 0;
	padding: 0;
}

.rok-case-card__image {
	width: 100%;
	height: 240px;
	margin: 0 0 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #E7E5E0;
}

.rok-case-card__image span {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-case-card__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-case-card__description {
	margin: 10px 0 0;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 400;
	line-height: 16px;
	color: #70767C;
}

.rok-case-card__link {
	display: inline-block;
	margin: 18px 0 0;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 500;
	line-height: 16px;
	color: #F05A24;
	text-decoration: none;
}

.rok-case-card__link:hover {
	color: #F05A24;
	text-decoration: none;
}
/* =========================================================
   SINGLE CASE — REPAIR PROCESS
   ========================================================= */

.rok-single-case-process {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #FFFFFF;
}

.rok-single-case-process__inner {
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 88px 0 96px;
}

.rok-single-case-process__label {
	margin: 0 0 22px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-single-case-process__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #151719;
}

/* STEPS */

.rok-single-case-process__steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 24px;
	margin: 64px 0 0;
	padding: 0;
}

.rok-single-case-process__step {
	margin: 0;
	padding: 0;
}

.rok-single-case-process__number {
	display: block;
	margin: 0 0 28px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-single-case-process__step h3 {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	color: #151719;
}

.rok-single-case-process__step p {
	margin: 16px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 400;
	line-height: 21px;
	color: #70767C;
}

/* PHOTOS */

.rok-single-case-process__photos {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 24px;
	margin: 64px 0 0;
	padding: 0;
}

.rok-single-case-process__photo {
	height: 320px;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #E7E5E0;
}

.rok-single-case-process__photo span {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}
/* =========================================================
   SINGLE CASE — RESULT
   ========================================================= */

.rok-single-case-result {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-single-case-result__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 420px;
	margin: 0 auto;
	padding: 72px 0;
	display: grid;
	grid-template-columns: 1fr 492px;
	column-gap: 72px;
	align-items: center;
}

.rok-single-case-result__content {
	margin: 0;
	padding: 0;
}

.rok-single-case-result__label {
	margin: 0 0 26px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
}

.rok-single-case-result__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 40px;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-single-case-result__text {
	margin: 28px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #70767C;
}

.rok-single-case-result__media {
	width: 492px;
	height: 280px;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #E7E5E0;
}

.rok-single-case-result__media span {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}
/* =========================================================
   SINGLE CASE — CTA
   ========================================================= */

.rok-single-case-cta {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #F05A24;
}

.rok-single-case-cta__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 500px;
	margin: 0 auto;
	padding: 72px 0 64px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}

.rok-single-case-cta__content {
	margin: 0;
	padding: 0;
}

.rok-single-case-cta__label {
	margin: 0 0 28px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-single-case-cta__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 44px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-single-case-cta__text {
	margin: 32px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #151719;
}

/* FORM */

.rok-single-case-cta__form {
	margin: 0;
	padding: 10px 0 0;
}

.rok-single-case-cta__field {
	margin: 0 0 32px;
	padding: 0;
}

.rok-single-case-cta__field label {
	display: block;
	margin: 0 0 12px;
	padding: 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-single-case-cta__field input {
	display: block;
	width: 100%;
	height: 32px;
	margin: 0;
	padding: 0 0 8px;
	border: 0;
	border-bottom: 1px solid #151719;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: Manrope, sans-serif;
	font-size: 15px;
	color: #151719;
	appearance: none;
}

.rok-single-case-cta__field input:focus {
	border-bottom-color: #151719;
	outline: none;
}

/* BUTTON */

.rok-single-case-cta__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin: 8px 0 0;
	padding: 0 20px;
	border: 0;
	border-radius: 3px;
	background: #151719;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	color: #FFFFFF;
	cursor: pointer;
}

.rok-single-case-cta__privacy {
	margin: 24px 0 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	color: #151719;
}
/* =========================================================
   SINGLE CASE — DYNAMIC POST TITLE FIX
   ========================================================= */

.rok-single-case-hero .wp-block-post-title.rok-single-case-hero__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 52px;
	font-weight: 600;
	line-height: 1.04;
	letter-spacing: -0.025em;
	color: #151719;
}
/* =========================================================
   SINGLE CASE — DYNAMIC HERO IMAGE
   ========================================================= */

.rok-single-case-hero__media--image {
	overflow: hidden;
}

.rok-single-case-hero__media--image .rok-single-case-hero__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* =========================================================
   SINGLE CASE — CONTENT IMAGES
   ========================================================= */

/* PROCESS PHOTOS */

.rok-single-case-process__photo {
    overflow: hidden;
}

.rok-single-case-process__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}


/* RESULT PHOTO */

.rok-single-case-result__media {
    overflow: hidden;
}

.rok-single-case-result__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
/* =========================================================
   HOME CASES — META
   ========================================================= */

.rok-cases .rok-case-card__meta {
	display: flex;
	gap: 16px;
	align-items: center;
	margin-top: 16px;
}

.rok-cases .rok-case-card__meta span {
	display: inline-block;
	padding: 0;
	border: 0;
	background: transparent;
	border-radius: 0;

	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
	color: #70767C;
	text-transform: uppercase;
}

/* =========================================================
   ARTICLES PAGE — HERO
   ========================================================= */

.rok-articles-page { margin: 0; padding: 0; }

.rok-articles-hero {
	width: 100%; margin: 0; padding: 0; background: #F5F4F0;
}

.rok-articles-hero__inner {
	width: 1200px; max-width: 1200px; min-height: 480px;
	margin: 0 auto; padding: 62px 0 72px;
}

.rok-articles-hero__breadcrumbs {
	margin: 0 0 34px; padding: 0;
	font-family: "IBM Plex Mono", monospace; font-size: 11px; font-weight: 400;
	line-height: 18px; color: #70767C;
}

.rok-articles-hero__grid {
	display: grid; grid-template-columns: 1fr 384px; column-gap: 96px; align-items: start;
}

.rok-articles-hero__content { margin: 0; padding: 0; }
.rok-articles-hero__label {
	margin: 0 0 28px; padding: 0; font-family: "IBM Plex Mono", monospace;
	font-size: 11px; font-weight: 500; line-height: 18px; color: #F05A24;
}
.rok-articles-hero__title {
	margin: 0; padding: 0; font-family: Manrope, sans-serif; font-size: 52px;
	font-weight: 600; line-height: 1.04; letter-spacing: -0.025em; color: #151719;
}
.rok-articles-hero__text {
	margin: 30px 0 0; padding: 0; font-family: Manrope, sans-serif;
	font-size: 14px; font-weight: 400; line-height: 24px; color: #70767C;
}
.rok-articles-hero__media {
	width: 384px; height: 320px; margin: 0; display: flex; align-items: center;
	justify-content: center; background: #E7E5E0; overflow: hidden;
}
.rok-articles-hero__media p,
.rok-articles-hero__media span {
	margin: 0; font-family: "IBM Plex Mono", monospace; font-size: 11px;
	font-weight: 400; line-height: 18px; color: #70767C;
}

/* =========================================================
   ARTICLES PAGE — GRID
   ========================================================= */

.rok-articles-grid { width: 100%; margin: 0; padding: 0; background: #FFFFFF; }
.rok-articles-grid__inner {
	width: 1200px; max-width: 1200px; margin: 0 auto; padding: 88px 0 104px;
}
.rok-articles-grid__label {
	margin: 0 0 22px; padding: 0; font-family: "IBM Plex Mono", monospace;
	font-size: 11px; font-weight: 500; line-height: 18px; color: #F05A24;
}
.rok-articles-grid__title {
	margin: 0; padding: 0; font-family: Manrope, sans-serif; font-size: 40px;
	font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; color: #151719;
}
.rok-articles-grid__filters {
	display: flex; align-items: center; gap: 8px; margin: 40px 0 48px; padding: 0;
}
.rok-articles-grid__filter {
	margin: 0; padding: 10px 16px; border: 1px solid #D4D2CD; border-radius: 2px;
	background: transparent; font-family: "IBM Plex Mono", monospace; font-size: 11px;
	font-weight: 500; line-height: 16px; color: #70767C; cursor: pointer;
}
.rok-articles-grid__filter.is-active { border-color: #151719; background: #151719; color: #FFFFFF; }
.rok-articles-grid__cards {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 24px; row-gap: 52px; margin: 0; padding: 0;
}
.rok-article-card { margin: 0; padding: 0; min-width: 0; }
.rok-article-card[hidden] { display: none !important; }
.rok-article-card__media {
	display: flex; width: 100%; height: 240px; margin: 0 0 20px;
	align-items: center; justify-content: center; overflow: hidden; background: #E7E5E0;
	text-decoration: none;
}
.rok-article-card__media > span {
	font-family: "IBM Plex Mono", monospace; font-size: 11px; font-weight: 400;
	line-height: 18px; color: #70767C;
}
.rok-article-card__image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.rok-article-card__category {
	margin: 0 0 14px; padding: 0; font-family: "IBM Plex Mono", monospace;
	font-size: 11px; font-weight: 500; line-height: 18px; color: #F05A24; text-transform: uppercase;
}
.rok-article-card__title {
	margin: 0; padding: 0; font-family: Manrope, sans-serif; font-size: 24px;
	font-weight: 600; line-height: 1.2; letter-spacing: -0.015em; color: #151719;
}
.rok-article-card__title a { color: inherit; text-decoration: none; }
.rok-article-card__link {
	display: inline-block; margin: 24px 0 0; padding: 0;
	font-family: "IBM Plex Mono", monospace; font-size: 11px; font-weight: 500;
	line-height: 18px; color: #151719; text-decoration: none;
}

/* =========================================================
   ARTICLES PAGE — CTA
   ========================================================= */

.rok-articles-cta { width: 100%; margin: 0; padding: 0; background: #F05A24; }
.rok-articles-cta__inner {
	width: 1200px; max-width: 1200px; min-height: 560px; margin: 0 auto; padding: 88px 0;
	display: grid; grid-template-columns: 1fr 1fr; column-gap: 72px; align-items: start;
}
.rok-articles-cta__content, .rok-articles-cta__form { margin: 0; padding: 0; }
.rok-articles-cta__label {
	margin: 0; color: #151719; font-family: "IBM Plex Mono", monospace;
	font-size: 14px; font-weight: 500; line-height: 20px; text-transform: uppercase;
}
.rok-articles-cta__title {
	max-width: 540px; margin: 24px 0 0; color: #FFFFFF; font-family: Manrope, sans-serif;
	font-size: 48px; font-weight: 700; line-height: 54px; letter-spacing: -0.015em;
}
.rok-articles-cta__text {
	max-width: 520px; margin: 32px 0 0; color: #FFFFFF; font-family: Manrope, sans-serif;
	font-size: 16px; font-weight: 400; line-height: 26px;
}
.rok-articles-cta__field { margin: 0 0 28px; padding: 0; }
.rok-articles-cta__field label {
	display: block; margin: 0 0 8px; color: #151719; font-family: "IBM Plex Mono", monospace;
	font-size: 12px; font-weight: 500; line-height: 20px; text-transform: uppercase;
}
.rok-articles-cta__field input {
	display: block; width: 100%; height: 42px; margin: 0; padding: 4px 0;
	background: transparent; color: #FFFFFF; border: 0;
	border-bottom: 1px solid rgba(21, 23, 25, 0.55); border-radius: 0; outline: none;
	font-family: Manrope, sans-serif; font-size: 18px; font-weight: 400; line-height: 28px;
}
.rok-articles-cta__field input:focus { border-bottom-color: #151719; }
.rok-articles-cta__button {
	width: 100%; height: 52px; margin: 8px 0 0; border: 0; border-radius: 3px;
	background: #151719; color: #FFFFFF; font-family: Manrope, sans-serif;
	font-size: 13px; font-weight: 600; cursor: pointer;
}
.rok-articles-cta__privacy {
	margin: 18px 0 0; padding: 0; color: #151719; font-family: Manrope, sans-serif;
	font-size: 12px; font-weight: 400; line-height: 18px;
}

@media (max-width: 1240px) {
	.rok-articles-hero__inner,
	.rok-articles-grid__inner,
	.rok-articles-cta__inner { width: auto; max-width: none; margin-left: 24px; margin-right: 24px; }
}


/* =========================================================
   ARTICLES HERO — FEATURED ARTICLE
   ========================================================= */

.rok-articles-hero__media:has(.rok-articles-featured) {
	width: 384px;
	height: auto;
	display: block;
	background: transparent;
	overflow: visible;
}

.rok-articles-featured {
	width: 100%;
	margin: 0;
	padding: 0;
}

.rok-articles-featured__media {
	display: flex;
	width: 100%;
	height: 260px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: #E7E5E0;
	text-decoration: none;
}

.rok-articles-featured__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.rok-articles-featured__placeholder {
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 400;
	line-height: 18px;
	color: #70767C;
}

.rok-articles-featured__category {
	margin: 16px 0 10px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
	text-transform: uppercase;
}

.rok-articles-featured__title {
	margin: 0;
	padding: 0;
	font-family: Manrope, sans-serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: -0.015em;
	color: #151719;
}

.rok-articles-featured__title a {
	color: inherit;
	text-decoration: none;
}

.rok-articles-featured__link {
	display: inline-block;
	margin: 18px 0 0;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 18px;
	color: #F05A24;
	text-decoration: none;
}

/* =========================================================
   SINGLE ARTICLE
   ========================================================= */
.rok-single-article { margin:0; padding:0; }
.rok-single-article-hero { width:100%; margin:0; padding:0; background:#F5F4F0; }
.rok-single-article-hero__inner { width:1200px; max-width:1200px; margin:0 auto; padding:72px 0 88px; }
.rok-single-article-hero__breadcrumbs { display:flex; gap:12px; align-items:center; margin:0 0 44px; font-family:"IBM Plex Mono",monospace; font-size:11px; line-height:18px; color:#70767C; text-transform:uppercase; }
.rok-single-article-hero__breadcrumbs a { color:inherit; text-decoration:none; }
.rok-single-article-hero__grid { display:grid; grid-template-columns:minmax(0,1fr) 384px; gap:96px; align-items:start; }
.rok-single-article-hero__category { margin:0 0 28px; font-family:"IBM Plex Mono",monospace; font-size:11px; font-weight:500; line-height:18px; color:#F05A24; text-transform:uppercase; }
.rok-single-article-hero .wp-block-post-title.rok-single-article-hero__title { max-width:700px; margin:0; padding:0; font-family:Manrope,sans-serif; font-size:52px; font-weight:600; line-height:1.04; letter-spacing:-0.025em; color:#151719; text-transform:uppercase; }
.rok-single-article-hero__media { display:flex; width:384px; height:300px; align-items:center; justify-content:center; overflow:hidden; background:#E7E5E0; }
.rok-single-article-hero__image { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.rok-single-article-hero__placeholder { font-family:"IBM Plex Mono",monospace; font-size:11px; color:#70767C; }

.rok-single-article-body { width:100%; margin:0; padding:0; background:#fff; }
.rok-single-article-body__inner { width:660px; max-width:660px; margin:0 auto; padding:72px 0 104px; font-family:Manrope,sans-serif; font-size:15px; font-weight:400; line-height:1.7; color:#404449; }
.rok-single-article-body__inner > :first-child { margin-top:0; }
.rok-single-article-body__inner > :last-child { margin-bottom:0; }
.rok-single-article-body__inner h2 { margin:0 0 28px; padding:0; font-family:Manrope,sans-serif; font-size:36px; font-weight:600; line-height:1.12; letter-spacing:-0.02em; color:#151719; text-transform:uppercase; }
.rok-single-article-body__inner h2:not(:first-child) { margin-top:64px; }
.rok-single-article-body__inner h3 { margin:48px 0 20px; font-family:Manrope,sans-serif; font-size:26px; font-weight:600; line-height:1.2; color:#151719; }
.rok-single-article-body__inner p { margin:0 0 22px; }
.rok-single-article-body__inner ul, .rok-single-article-body__inner ol { margin:0 0 24px; padding-left:24px; }
.rok-single-article-body__inner li { margin:0 0 8px; }
.rok-single-article-body__inner figure { width:100%; margin:48px 0; }
.rok-single-article-body__inner img { display:block; width:100%; height:auto; max-height:520px; object-fit:cover; }
.rok-single-article-body__inner .wp-caption { max-width:100%; }
.rok-single-article-body__inner a { color:#F05A24; }

@media (max-width:1240px) {
  .rok-single-article-hero__inner { width:auto; max-width:none; margin-left:24px; margin-right:24px; }
}

/* =========================================================
   ARTICLES — FULLY CLICKABLE CARDS
========================================================= */

.rok-article-card,
.rok-articles-featured {
	position: relative;
}

.rok-article-card__title a::after,
.rok-articles-featured__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 5;
}

.rok-article-card__media,
.rok-article-card__link,
.rok-articles-featured__media,
.rok-articles-featured__link {
	position: relative;
	z-index: 6;
}

.rok-article-card:hover .rok-article-card__title,
.rok-articles-featured:hover .rok-articles-featured__title {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}

/* ========================================
   ABOUT PAGE
======================================== */
.rok-about-page{margin:0}.rok-about-hero{background:#F5F4F0}.rok-about-hero__inner,.rok-about-stats__inner,.rok-about-base__inner,.rok-about-services__inner,.rok-about-cta__inner{width:min(1200px,calc(100% - 48px));margin:0 auto}.rok-about-hero__inner{padding:64px 0 72px}.rok-about-hero__breadcrumbs{margin:0 0 54px;font:500 11px/16px "IBM Plex Mono",monospace;color:#70767C}.rok-about-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) 480px;gap:96px;align-items:center}.rok-about-kicker{margin:0 0 26px;font:500 11px/16px "IBM Plex Mono",monospace;color:#F05A24}.rok-about-hero__title{margin:0;font:500 52px/1.02 Manrope,sans-serif;letter-spacing:-2px;color:#151719}.rok-about-hero__text{max-width:510px;margin:28px 0 0;font:400 14px/1.7 Manrope,sans-serif;color:#70767C}.rok-about-hero__media,.rok-about-base__media{display:flex;align-items:center;justify-content:center;background:#E7E5E0;color:#70767C;font:500 11px/16px "IBM Plex Mono",monospace}.rok-about-hero__media{height:326px}.rok-about-stats{background:#151719;color:#fff}.rok-about-stats__inner{padding:62px 0 66px}.rok-about-stats__label{margin:0 0 42px;font:500 11px/16px "IBM Plex Mono",monospace;color:#F05A24}.rok-about-stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:48px}.rok-about-stats__grid div{display:flex;flex-direction:column;gap:12px}.rok-about-stats__grid strong{font:500 38px/1.1 Manrope,sans-serif;white-space:nowrap}.rok-about-stats__grid span{font:500 10px/15px "IBM Plex Mono",monospace;color:#70767C}.rok-about-base{background:#fff}.rok-about-base__inner{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;padding:72px 0}.rok-about-base__media{height:390px}.rok-about-base__content{padding-right:60px}.rok-about-base__content h2,.rok-about-services h2,.rok-about-cta h2{margin:0;color:#151719;font:500 40px/1.08 Manrope,sans-serif;letter-spacing:-1.4px}.rok-about-base__content p:not(.rok-about-kicker){margin:24px 0 0;font:400 14px/1.75 Manrope,sans-serif;color:#555B60}.rok-about-services{background:#F5F4F0}.rok-about-services__inner{padding:70px 0 76px}.rok-about-services h2{font-size:36px;margin-bottom:46px}.rok-about-services__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:64px}.rok-about-services__grid h3{margin:0 0 15px;font:500 20px/1.2 Manrope,sans-serif;color:#151719}.rok-about-services__grid p{margin:0;font:400 14px/1.65 Manrope,sans-serif;color:#70767C}.rok-about-cta{background:#F05A24}.rok-about-cta__inner{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding:72px 0 68px}.rok-about-cta__label{margin:0 0 26px;font:500 11px/16px "IBM Plex Mono",monospace;color:#151719}.rok-about-cta h2{font-size:40px}.rok-about-cta__inner>div>p:last-child{max-width:450px;margin:54px 0 0;font:400 14px/1.65 Manrope,sans-serif;color:#151719}.rok-about-cta__form{display:flex;flex-direction:column}.rok-about-cta__form label{display:flex;flex-direction:column;font:500 10px/15px "IBM Plex Mono",monospace;color:#151719}.rok-about-cta__form input{height:42px;margin:0 0 18px;padding:0;border:0;border-bottom:1px solid rgba(21,23,25,.65);border-radius:0;background:transparent;outline:0;font:400 15px Manrope,sans-serif;color:#151719}.rok-about-cta__form button{align-self:flex-start;margin-top:10px;padding:13px 18px;border:0;border-radius:2px;background:#151719;color:#fff;font:500 10px/14px "IBM Plex Mono",monospace;cursor:pointer}.rok-about-cta__form small{margin-top:18px;font:400 9px/1.55 Manrope,sans-serif;color:#151719}
@media(max-width:900px){.rok-about-hero__grid{grid-template-columns:1fr;gap:42px}.rok-about-hero__media{height:300px}.rok-about-stats__grid{grid-template-columns:repeat(2,1fr)}.rok-about-base__inner,.rok-about-cta__inner{grid-template-columns:1fr;gap:48px}.rok-about-base__content{padding-right:0}.rok-about-services__grid{grid-template-columns:1fr;gap:32px}}@media(max-width:600px){.rok-about-hero__inner,.rok-about-stats__inner,.rok-about-base__inner,.rok-about-services__inner,.rok-about-cta__inner{width:calc(100% - 32px)}.rok-about-hero__title{font-size:40px}.rok-about-stats__grid{grid-template-columns:1fr}.rok-about-base__content h2,.rok-about-services h2,.rok-about-cta h2{font-size:32px}}

/* =========================================================
   ABOUT PAGE — PHOTO + CTA ALIGNMENT
   ========================================================= */

.rok-about-hero__media,
.rok-about-base__media {
	overflow: hidden;
}

.rok-about-managed-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* CTA uses the same visual scale as the established Cases CTA. */
.rok-about-cta__inner {
	width: 1200px;
	max-width: 1200px;
	min-height: 500px;
	margin: 0 auto;
	padding: 72px 0 64px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 72px;
	align-items: start;
}

.rok-about-cta__label {
	margin: 0 0 28px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-about-cta h2 {
	margin: 0;
	font-family: Manrope, sans-serif;
	font-size: 44px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-about-cta__inner > div > p:last-child {
	max-width: 450px;
	margin: 32px 0 0;
	font-family: Manrope, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #151719;
}

.rok-about-cta__form {
	margin: 0;
	padding: 10px 0 0;
}

.rok-about-cta__form label {
	display: flex;
	flex-direction: column;
	margin: 0 0 32px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	color: #151719;
}

.rok-about-cta__form input {
	display: block;
	width: 100%;
	height: 32px;
	margin: 12px 0 0;
	padding: 0 0 8px;
	border: 0;
	border-bottom: 1px solid #151719;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: Manrope, sans-serif;
	font-size: 15px;
	color: #151719;
	appearance: none;
}

.rok-about-cta__form button {
	align-self: flex-start;
	min-height: 44px;
	margin: 8px 0 0;
	padding: 0 20px;
	border: 0;
	border-radius: 3px;
	background: #151719;
	font-family: Manrope, sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	color: #fff;
	cursor: pointer;
}

.rok-about-cta__form small {
	margin-top: 24px;
	font-family: Manrope, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	color: #151719;
}

@media (max-width: 1240px) {
	.rok-about-cta__inner {
		width: auto;
		max-width: none;
		margin-left: 24px;
		margin-right: 24px;
	}
}

/* ========================================
   INFO — DELIVERY / PAYMENT / WARRANTY
======================================== */

.rok-info-page {
	margin: 0;
	padding: 0;
}

.rok-info-hero {
	margin: 0;
	padding: 0;
	background: #F5F4F0;
}

.rok-info-hero__inner,
.rok-info-terms__inner,
.rok-info-cta__inner {
	width: min(1200px, calc(100% - 48px));
	margin: 0 auto;
}

.rok-info-hero__inner {
	min-height: 560px;
	padding: 68px 0 78px;
	box-sizing: border-box;
}

.rok-info-hero__breadcrumbs {
	margin: 0 0 46px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #70767C;
}

.rok-info-hero__breadcrumbs span {
	margin: 0 12px;
}

.rok-info-hero__label,
.rok-info-terms__label {
	margin: 0 0 28px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #F05A24;
}

.rok-info-hero__title {
	max-width: 560px;
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 56px;
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -0.035em;
	color: #151719;
}

.rok-info-hero__text {
	max-width: 590px;
	margin: 34px 0 0;
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #70767C;
}

.rok-info-terms {
	margin: 0;
	padding: 0;
	background: #FFFFFF;
}

.rok-info-terms__inner {
	padding: 78px 0 84px;
}

.rok-info-terms__label {
	margin-bottom: 22px;
}

.rok-info-terms__title {
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 40px;
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: -0.03em;
	color: #151719;
}

.rok-info-terms__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 58px;
	margin-top: 48px;
}

.rok-info-term__number {
	margin: 0 0 22px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #F05A24;
}

.rok-info-term__title {
	margin: 0 0 18px;
	font-family: "Manrope", sans-serif;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-info-term__text {
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #70767C;
}

.rok-info-cta {
	margin: 0;
	padding: 0;
	background: #F05A24;
}

.rok-info-cta__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 92px;
	min-height: 500px;
	padding: 72px 0 64px;
	box-sizing: border-box;
}

.rok-info-cta__label {
	margin: 0 0 28px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #151719;
}

.rok-info-cta__title {
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 44px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.035em;
	color: #151719;
}

.rok-info-cta__text {
	max-width: 500px;
	margin: 56px 0 0;
	font-family: "Manrope", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	color: #151719;
}

.rok-info-cta__form {
	padding-top: 2px;
}

.rok-info-cta__field {
	display: block;
	margin: 0 0 26px;
}

.rok-info-cta__field span {
	display: block;
	margin-bottom: 12px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	color: #151719;
}

.rok-info-cta__field input {
	display: block;
	width: 100%;
	height: 30px;
	padding: 0;
	border: 0;
	border-bottom: 1px solid rgba(21, 23, 25, 0.72);
	border-radius: 0;
	outline: none;
	background: transparent;
	font-family: "Manrope", sans-serif;
	font-size: 15px;
	color: #151719;
}

.rok-info-cta__button {
	margin-top: 4px;
	padding: 14px 20px;
	border: 0;
	border-radius: 2px;
	background: #151719;
	font-family: "IBM Plex Mono", monospace;
	font-size: 13px;
	font-weight: 500;
	line-height: 16px;
	color: #FFFFFF;
	cursor: pointer;
}

.rok-info-cta__privacy {
	margin: 18px 0 0;
	font-family: "Manrope", sans-serif;
	font-size: 10px;
	font-weight: 400;
	line-height: 14px;
	color: #151719;
}

@media (max-width: 900px) {
	.rok-info-hero__inner,
	.rok-info-terms__inner,
	.rok-info-cta__inner {
		width: min(100% - 32px, 1200px);
	}

	.rok-info-hero__title {
		font-size: 44px;
	}

	.rok-info-terms__title {
		font-size: 34px;
	}

	.rok-info-terms__grid {
		grid-template-columns: 1fr;
		gap: 38px;
	}

	.rok-info-cta__inner {
		grid-template-columns: 1fr;
		gap: 54px;
	}
}


/* =========================================================
   CONTACTS PAGE
   ========================================================= */

.rok-contacts-page,
.rok-contacts-page .wp-block-group,
.rok-contacts-page p,
.rok-contacts-page h1 {
	margin-block-start: 0;
	margin-block-end: 0;
}

.rok-contacts {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #FFFFFF;
}

.rok-contacts__inner {
	width: 1200px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 30px 0 96px;
}

.rok-contacts__breadcrumbs {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 78px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 500;
	line-height: 14px;
	color: #A4A8AB;
	text-transform: uppercase;
}

.rok-contacts__breadcrumbs a {
	color: #A4A8AB;
	text-decoration: none;
}

.rok-contacts__breadcrumbs a:hover {
	color: #151719;
}

.rok-contacts__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 110px;
	align-items: start;
}

.rok-contacts__content {
	padding: 0;
}

.rok-contacts__label {
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	color: #F05A24;
	text-transform: uppercase;
}

.rok-contacts__title {
	margin-top: 24px !important;
	font-family: "Manrope", sans-serif;
	font-size: 58px;
	font-weight: 700;
	line-height: 0.98;
	letter-spacing: -0.025em;
	color: #151719;
}

.rok-contacts__details {
	margin-top: 64px;
}

.rok-contacts__item + .rok-contacts__item {
	margin-top: 38px;
}

.rok-contacts__item-label {
	display: block;
	margin-bottom: 10px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 500;
	line-height: 14px;
	color: #A4A8AB;
	text-transform: uppercase;
}

.rok-contacts__item-value {
	display: inline-block;
	margin: 0;
	font-family: "Manrope", sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 22px;
	color: #151719;
	text-decoration: none;
}

a.rok-contacts__item-value:hover {
	color: #F05A24;
}

.rok-contacts__address {
	display: block;
	font-weight: 400;
}

.rok-contacts__form {
	width: 100%;
	max-width: 420px;
	margin: 0 0 0 auto;
	padding-top: 26px;
}

.rok-contacts__field {
	display: block;
	margin: 0 0 28px;
}

.rok-contacts__field span {
	display: block;
	margin-bottom: 12px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 10px;
	font-weight: 500;
	line-height: 14px;
	color: #151719;
	text-transform: uppercase;
}

.rok-contacts__field input {
	display: block;
	width: 100%;
	height: 30px;
	padding: 0;
	border: 0;
	border-bottom: 1px solid rgba(21, 23, 25, 0.72);
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: "Manrope", sans-serif;
	font-size: 15px;
	color: #151719;
}

.rok-contacts__field input:focus {
	border-bottom-color: #F05A24;
}

.rok-contacts__button {
	margin-top: 2px;
	padding: 14px 22px;
	border: 0;
	border-radius: 2px;
	background: #151719;
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #FFFFFF;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .2s ease;
}

.rok-contacts__button:hover {
	background: #F05A24;
}

.rok-contacts__privacy {
	margin-top: 18px !important;
	font-family: "Manrope", sans-serif;
	font-size: 9px;
	font-weight: 400;
	line-height: 13px;
	color: #A4A8AB;
}

.rok-contacts__map {
	position: relative;
	width: 100%;
	height: 430px;
	margin-top: 78px;
	overflow: hidden;
	background: #E7E5E0;
}

.rok-contacts__map iframe {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	border: 0;
}

@media (max-width: 900px) {
	.rok-contacts__inner {
		width: min(100% - 32px, 1200px);
		padding-top: 24px;
		padding-bottom: 64px;
	}

	.rok-contacts__breadcrumbs {
		margin-bottom: 54px;
	}

	.rok-contacts__grid {
		grid-template-columns: 1fr;
		row-gap: 60px;
	}

	.rok-contacts__title {
		font-size: 44px;
	}

	.rok-contacts__details {
		margin-top: 48px;
	}

	.rok-contacts__form {
		max-width: none;
		margin: 0;
		padding-top: 0;
	}

	.rok-contacts__map {
		height: 360px;
		margin-top: 60px;
	}
}

@media (max-width: 520px) {
	.rok-contacts__title {
		font-size: 38px;
	}

	.rok-contacts__map {
		height: 320px;
	}
}

/* Contacts: the form already has its own CTA, so hide the duplicate header CTA */
body.rok-page-contacts .rok-header .rok-button--primary {
	display: none;
}


/* ========================================
   HOME — SERVICES / FINAL FIGMA
======================================== */
.rok-services {
	background:#F5F4F0;
}
.rok-services__inner {
	max-width:1200px;
	margin:0 auto;
	padding:72px 0 80px;
}
.rok-services__title {
	max-width:640px;
	margin:10px 0 40px;
	font-size:44px;
	font-weight:600;
	line-height:1.02;
	letter-spacing:-0.035em;
	color:#151719;
}
.rok-services__grid {
	display:grid;
	gap:8px;
}
.rok-services__grid--primary {
	grid-template-columns:repeat(2,minmax(0,1fr));
	margin-bottom:8px;
}
.rok-services__grid--secondary {
	grid-template-columns:repeat(3,minmax(0,1fr));
}
.rok-service-card {
	box-sizing:border-box;
	margin:0;
	border:0;
	background:#EDECE8;
}
.rok-service-card--large {
	min-height:178px;
	padding:24px 28px 26px;
}
.rok-service-card--small {
	min-height:132px;
	padding:22px 24px 24px;
}
.rok-service-card__number {
	margin:0 0 28px;
	font-family:"IBM Plex Mono",monospace;
	font-size:11px;
	font-weight:500;
	line-height:1;
	color:#F05A24;
}
.rok-service-card--small .rok-service-card__number { margin-bottom:22px; }
.rok-service-card__title {
	margin:0;
	font-size:16px;
	font-weight:600;
	line-height:1.15;
	letter-spacing:-0.02em;
	color:#151719;
}
.rok-service-card__text {
	max-width:460px;
	margin:8px 0 0;
	font-size:12px;
	font-weight:400;
	line-height:1.5;
	color:#70767C;
}
@media (max-width: 1240px) {
	.rok-services__inner { padding-left:24px; padding-right:24px; }
}
@media (max-width: 767px) {
	.rok-services__inner { padding:56px 20px 64px; }
	.rok-services__title { font-size:34px; margin-bottom:28px; }
	.rok-services__grid--primary,
	.rok-services__grid--secondary { grid-template-columns:1fr; }
	.rok-services__grid--primary { margin-bottom:8px; }
	.rok-service-card--large,
	.rok-service-card--small { min-height:0; padding:22px; }
}


/* ==========================================================
   HOME — FINAL FIGMA ALIGNMENT / 2026-09-10
   Consolidated overrides for front page only
========================================================== */

/* Header divider from final layout */
.rok-header__inner {
	border-bottom: 1px solid #E7E5E0;
}

/* Shared homepage rhythm */
.rok-services,
.rok-process,
.rok-facts,
.rok-trusted,
.rok-equipment,
.rok-cases,
.rok-delivery,
.rok-warranty,
.rok-reviews {
	min-height: 0 !important;
}

.rok-services__inner,
.rok-process__inner,
.rok-facts__inner,
.rok-trusted__inner,
.rok-equipment__inner,
.rok-cases__inner,
.rok-delivery__inner,
.rok-warranty__inner,
.rok-reviews__inner {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* SERVICES */
.rok-services {
	background: #FFFFFF !important;
	padding: 72px 0 80px !important;
}
.rok-services__title {
	margin: 12px 0 42px !important;
}
.rok-services__grid {
	display: grid !important;
	grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
	gap: 8px !important;
}
.rok-service-card {
	grid-column: span 2;
	min-height: 138px !important;
	padding: 24px 24px 22px !important;
	background: #F5F4F0 !important;
	border: 0 !important;
}
.rok-service-card--wide {
	grid-column: span 3;
	min-height: 176px !important;
}
.rok-service-card__number { margin: 0 0 30px !important; color: #F05A24 !important; }
.rok-service-card__title { margin: 0 !important; }
.rok-service-card__text { margin: 12px 0 0 !important; }

/* EXCHANGE */
.rok-exchange {
	padding: 72px 0 76px !important;
}
.rok-exchange__inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr) !important;
	gap: 100px !important;
	align-items: start !important;
}
.rok-exchange__media { display: none !important; }
.rok-exchange__steps {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px 44px;
	padding-top: 8px;
}
.rok-exchange-step {
	border-top: 1px solid rgba(255,255,255,.18);
	padding-top: 12px;
}
.rok-exchange-step__number {
	margin: 0 0 12px;
	color: #F05A24;
	font: 500 11px/1.4 "IBM Plex Mono", monospace;
}
.rok-exchange-step__title {
	margin: 0;
	color: #fff;
	font: 500 13px/1.35 "IBM Plex Mono", monospace;
}
.rok-exchange-step--time { grid-column: 1 / -1; max-width: 220px; }
.rok-exchange-step__time {
	margin: 0;
	color: #F05A24;
	font-size: 30px;
	font-weight: 600;
	line-height: 1;
}

/* PROCESS */
.rok-process {
	padding: 72px 0 78px !important;
}
.rok-process__title {
	margin: 12px 0 44px !important;
}
.rok-process__grid {
	gap: 0 !important;
}
.rok-process-card {
	min-height: 160px !important;
	padding: 22px 24px !important;
}

/* FACTS */
.rok-facts {
	padding: 38px 0 42px !important;
}
.rok-facts__label { margin-bottom: 24px !important; }
.rok-fact--accent .rok-fact__value { color: #F05A24 !important; }

/* TRUSTED */
.rok-trusted {
	padding: 48px 0 52px !important;
}
.rok-trusted__header { margin-bottom: 28px !important; }
.rok-trusted__title { margin-bottom: 0 !important; }
.rok-trusted__grid { margin-top: 28px !important; }

/* EQUIPMENT */
.rok-equipment {
	padding: 58px 0 64px !important;
}
.rok-equipment__header { margin-bottom: 38px !important; }
.rok-equipment__brands {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	padding: 18px 0 26px;
	border-top: 1px solid rgba(21,23,25,.18);
	border-bottom: 1px solid rgba(21,23,25,.18);
}
.rok-equipment__brands p {
	margin: 0;
	font-weight: 600;
	font-size: 18px;
}
.rok-equipment__matrix {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	padding: 24px 0;
	border-bottom: 1px solid rgba(21,23,25,.18);
}
.rok-equipment__matrix div { display: flex; flex-direction: column; gap: 10px; }
.rok-equipment__matrix span {
	color: #70767C;
	font: 500 10px/1.4 "IBM Plex Mono", monospace;
}
.rok-equipment__matrix strong {
	font-size: 13px;
	line-height: 1.6;
	font-weight: 500;
}

/* CASES */
.rok-cases {
	padding: 66px 0 72px !important;
}
.rok-cases__header { margin-bottom: 38px !important; }

/* DELIVERY */
.rok-delivery {
	padding: 70px 0 72px !important;
}
.rok-delivery__inner {
	min-height: 0 !important;
}

/* WARRANTY */
.rok-warranty {
	padding: 70px 0 72px !important;
}
.rok-warranty__inner {
	min-height: 0 !important;
}

/* REVIEWS */
.rok-reviews {
	padding: 70px 0 72px !important;
}
.rok-reviews__inner {
	min-height: 0 !important;
}

/* Avoid giant inherited block gaps */
.rok-services + .rok-exchange,
.rok-exchange + .rok-process,
.rok-process + .rok-facts,
.rok-facts + .rok-trusted,
.rok-trusted + .rok-equipment,
.rok-equipment + .rok-cases,
.rok-cases + .rok-delivery,
.rok-delivery + .rok-warranty,
.rok-warranty + .rok-reviews,
.rok-reviews + .rok-final-cta {
	margin-top: 0 !important;
}

/* Responsive */
@media (max-width: 900px) {
	.rok-services__grid { grid-template-columns: 1fr !important; }
	.rok-service-card,
	.rok-service-card--wide { grid-column: auto !important; }
	.rok-exchange__inner { grid-template-columns: 1fr !important; gap: 48px !important; }
	.rok-equipment__brands,
	.rok-equipment__matrix { grid-template-columns: repeat(2, 1fr); }
}


/* ==========================================================
   HOME — SAFE CORRECTIONS / TRUSTED + EQUIPMENT
   Preserve all previously approved sections.
========================================================== */

/* TRUSTED — compact, without decorative horizontal rules */
.rok-trusted {
	padding: 44px 0 48px !important;
}
.rok-trusted__header {
	margin-bottom: 22px !important;
}
.rok-trusted__grid {
	margin-top: 0 !important;
	row-gap: 10px !important;
}
.rok-trusted-company {
	min-height: 92px !important;
	padding: 8px 0 14px !important;
	border: 0 !important;
}
.rok-trusted-company::before,
.rok-trusted-company::after {
	display: none !important;
	content: none !important;
}
.rok-trusted-company__number {
	margin: 0 0 18px !important;
}
.rok-trusted-company__name {
	margin: 0 !important;
}

/* EQUIPMENT — restore compact composition from the reference */
.rok-equipment {
	padding: 54px 0 58px !important;
}
.rok-equipment__inner {
	display: grid !important;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr) !important;
	column-gap: 72px !important;
	row-gap: 28px !important;
	align-items: start !important;
}
.rok-equipment__header {
	grid-column: 1 !important;
	grid-row: 1 !important;
	margin: 0 !important;
}
.rok-equipment .rok-section-label {
	margin: 0 0 12px !important;
}
.rok-equipment__title {
	margin: 0 !important;
	font-size: 44px !important;
	line-height: 1.04 !important;
	max-width: 620px !important;
}
.rok-equipment__brands {
	grid-column: 2 !important;
	grid-row: 1 !important;
	align-self: start !important;
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	gap: 18px !important;
	margin: 0 !important;
	padding: 18px 0 !important;
	border-top: 1px solid #D4D2CD !important;
	border-bottom: 1px solid #D4D2CD !important;
}
.rok-equipment__brands p {
	margin: 0 !important;
	font-size: 16px !important;
	line-height: 1.2 !important;
}
.rok-equipment__matrix {
	margin: 0 !important;
	padding: 18px 0 !important;
	border-top: 0 !important;
	border-bottom: 1px solid #D4D2CD !important;
	gap: 18px !important;
}
.rok-equipment__matrix:not(.rok-equipment__matrix--aggregates) {
	grid-column: 1 !important;
	grid-row: 2 !important;
}
.rok-equipment__matrix--aggregates {
	grid-column: 2 !important;
	grid-row: 2 !important;
}
.rok-equipment__matrix span {
	font-size: 9px !important;
}
.rok-equipment__matrix strong {
	font-size: 12px !important;
	line-height: 1.45 !important;
}

/* Remove the accidental numeric prefix without changing the block structure */
.rok-equipment .rok-section-label {
	font-size: 0 !important;
}
.rok-equipment .rok-section-label::after {
	content: "КАКУЮ ТЕХНИКУ РЕМОНТИРУЕМ";
	font-family: "IBM Plex Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	color: #F05A24;
}

@media (max-width: 900px) {
	.rok-equipment__inner {
		grid-template-columns: 1fr !important;
	}
	.rok-equipment__header,
	.rok-equipment__brands,
	.rok-equipment__matrix:not(.rok-equipment__matrix--aggregates),
	.rok-equipment__matrix--aggregates {
		grid-column: 1 !important;
		grid-row: auto !important;
	}
}


/* ==========================================================
   HOME — FINAL REFERENCE MATCH
   Based strictly on the supplied full-page mockup.
   No extra decorative lines/numbers.
========================================================== */

/* PROCESS — compact 3×2, no invented horizontal rules */
.rok-process {
	padding: 56px 0 60px !important;
}
.rok-process__title {
	margin: 10px 0 30px !important;
	font-size: 38px !important;
	line-height: 1.05 !important;
}
.rok-process__grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 12px 32px !important;
	border: 0 !important;
}
.rok-process-card {
	min-height: 118px !important;
	padding: 16px 0 14px !important;
	border: 0 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
	background: transparent !important;
}
.rok-process-card::before,
.rok-process-card::after {
	display: none !important;
	content: none !important;
}
.rok-process-card__number {
	margin: 0 0 16px !important;
}
.rok-process-card__title {
	margin: 0 0 10px !important;
	font-size: 18px !important;
	line-height: 1.15 !important;
}
.rok-process-card__text {
	margin: 0 !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
	max-width: 330px !important;
}

/* FACTS — reference has NO lines above the values */
.rok-facts {
	padding: 38px 0 42px !important;
}
.rok-facts__label {
	margin: 0 0 24px !important;
}
.rok-facts__grid {
	gap: 32px !important;
}
.rok-fact {
	min-height: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
}
.rok-fact::before,
.rok-fact::after {
	display: none !important;
	content: none !important;
}
.rok-fact__value {
	margin: 0 0 10px !important;
	font-size: 38px !important;
	line-height: 1 !important;
}
.rok-fact__text {
	margin: 0 !important;
	font-size: 10px !important;
	line-height: 1.4 !important;
}

/* TRUSTED — mockup is a compact logo strip; text fallback stays compact */
.rok-trusted {
	padding: 42px 0 46px !important;
}
.rok-trusted__header {
	margin: 0 0 24px !important;
}
.rok-trusted__title {
	margin: 8px 0 0 !important;
	font-size: 30px !important;
	line-height: 1.08 !important;
	max-width: 760px !important;
}
.rok-trusted__grid {
	display: grid !important;
	grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
	gap: 22px !important;
	margin: 0 !important;
	align-items: center !important;
}
.rok-trusted-company {
	min-height: 56px !important;
	padding: 0 !important;
	border: 0 !important;
	display: flex !important;
	align-items: center !important;
}
.rok-trusted-company__number {
	display: none !important;
}
.rok-trusted-company__name {
	margin: 0 !important;
	font-size: 10px !important;
	line-height: 1.25 !important;
	font-weight: 600 !important;
	color: #70767C !important;
}

/* EQUIPMENT — compact two-column composition from the mockup */
.rok-equipment {
	padding: 48px 0 52px !important;
}
.rok-equipment__inner {
	display: grid !important;
	grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
	column-gap: 64px !important;
	row-gap: 26px !important;
	align-items: start !important;
}
.rok-equipment__header {
	grid-column: 1 !important;
	grid-row: 1 !important;
	margin: 0 !important;
}
.rok-equipment .rok-section-label {
	font-size: 11px !important;
	margin: 0 0 10px !important;
}
.rok-equipment .rok-section-label::after {
	content: none !important;
	display: none !important;
}
.rok-equipment__title {
	margin: 0 !important;
	font-size: 36px !important;
	line-height: 1.03 !important;
	max-width: 500px !important;
}
.rok-equipment__brands {
	grid-column: 2 !important;
	grid-row: 1 !important;
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	gap: 16px !important;
	margin: 0 !important;
	padding: 14px 0 !important;
	border-top: 1px solid #D4D2CD !important;
	border-bottom: 1px solid #D4D2CD !important;
}
.rok-equipment__brands p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
}
.rok-equipment__matrix {
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	gap: 16px !important;
	margin: 0 !important;
	padding: 14px 0 !important;
	border-top: 0 !important;
	border-bottom: 1px solid #D4D2CD !important;
}
.rok-equipment__matrix:not(.rok-equipment__matrix--aggregates) {
	grid-column: 1 !important;
	grid-row: 2 !important;
}
.rok-equipment__matrix--aggregates {
	grid-column: 2 !important;
	grid-row: 2 !important;
}
.rok-equipment__matrix div {
	gap: 7px !important;
}
.rok-equipment__matrix span {
	font-size: 8px !important;
	line-height: 1.3 !important;
}
.rok-equipment__matrix strong {
	font-size: 11px !important;
	line-height: 1.45 !important;
}

/* Keep the already-approved sections compact and untouched structurally */
.rok-services { padding-top: 72px !important; padding-bottom: 80px !important; }
.rok-exchange { padding-top: 68px !important; padding-bottom: 70px !important; }
.rok-cases { padding-top: 60px !important; padding-bottom: 64px !important; }
.rok-delivery,
.rok-warranty,
.rok-reviews { padding-top: 58px !important; padding-bottom: 60px !important; }

/* Remove accidental decorative rules inherited from older homepage CSS */
.rok-process *,
.rok-facts *,
.rok-trusted * {
	box-shadow: none !important;
}

@media (max-width: 900px) {
	.rok-process__grid {
		grid-template-columns: 1fr !important;
	}
	.rok-trusted__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
	.rok-equipment__inner {
		grid-template-columns: 1fr !important;
	}
	.rok-equipment__header,
	.rok-equipment__brands,
	.rok-equipment__matrix:not(.rok-equipment__matrix--aggregates),
	.rok-equipment__matrix--aggregates {
		grid-column: 1 !important;
		grid-row: auto !important;
	}
}


/* ==========================================================
   HOME — COMPLETE FINAL PASS / supplied mockup
========================================================== */

/* Global vertical rhythm on homepage */
.rok-services { padding: 64px 0 68px !important; }
.rok-exchange { padding: 62px 0 64px !important; }
.rok-process { padding: 58px 0 60px !important; }
.rok-facts { padding: 34px 0 36px !important; }
.rok-trusted { padding: 38px 0 42px !important; }
.rok-equipment { padding: 50px 0 54px !important; }
.rok-cases { padding: 56px 0 60px !important; }
.rok-delivery,
.rok-warranty,
.rok-reviews { padding: 56px 0 58px !important; }

/* Process — compact, no horizontal dividers */
.rok-process__title { margin: 10px 0 28px !important; }
.rok-process__grid {
	display:grid !important;
	grid-template-columns:repeat(3,minmax(0,1fr)) !important;
	gap:24px 42px !important;
	border:0 !important;
}
.rok-process-card {
	min-height:0 !important;
	padding:0 !important;
	border:0 !important;
	background:transparent !important;
}
.rok-process-card__number { margin:0 0 14px !important; }
.rok-process-card__title { margin:0 0 8px !important; }
.rok-process-card__text { margin:0 !important; }

/* Facts — absolutely no lines in the reference */
.rok-facts__grid { gap:32px !important; }
.rok-fact {
	min-height:0 !important;
	padding:0 !important;
	border:0 !important;
}
.rok-fact::before,.rok-fact::after { display:none !important; content:none !important; }
.rok-fact__value { margin:0 0 8px !important; }
.rok-fact__text { margin:0 !important; }

/* Trusted — compact strip, no numbered table treatment */
.rok-trusted__header { margin:0 0 22px !important; }
.rok-trusted__grid {
	display:grid !important;
	grid-template-columns:repeat(8,minmax(0,1fr)) !important;
	gap:18px !important;
	margin:0 !important;
}
.rok-trusted-company {
	min-height:44px !important;
	padding:0 !important;
	border:0 !important;
}
.rok-trusted-company::before,.rok-trusted-company::after { display:none !important; content:none !important; }
.rok-trusted-company__number { display:none !important; }
.rok-trusted-company__name {
	margin:0 !important;
	font-size:10px !important;
	line-height:1.25 !important;
	color:#70767C !important;
}

/* EQUIPMENT — one compact composition; removes the huge empty middle */
.rok-equipment__inner {
	display:grid !important;
	grid-template-columns:380px minmax(0,1fr) !important;
	gap:56px !important;
	align-items:start !important;
}
.rok-equipment__header {
	grid-column:auto !important;
	grid-row:auto !important;
	margin:0 !important;
}
.rok-equipment .rok-section-label {
	margin:0 0 10px !important;
	font-size:10px !important;
}
.rok-equipment__title {
	margin:0 !important;
	font-size:34px !important;
	line-height:1.04 !important;
	max-width:380px !important;
}
.rok-equipment__data {
	display:flex;
	flex-direction:column;
	gap:22px;
	min-width:0;
}
.rok-equipment__brands {
	display:grid !important;
	grid-template-columns:repeat(5,minmax(0,1fr)) !important;
	gap:16px !important;
	margin:0 !important;
	padding:14px 0 !important;
	border-top:1px solid #D4D2CD !important;
	border-bottom:1px solid #D4D2CD !important;
}
.rok-equipment__brands p {
	margin:0 !important;
	font-size:14px !important;
	font-weight:600 !important;
}
.rok-equipment__details {
	display:grid;
	grid-template-columns:2.3fr repeat(5,1fr);
	gap:18px;
	align-items:start;
	padding:0 0 14px;
	border-bottom:1px solid #D4D2CD;
}
.rok-equipment__detail {
	display:flex;
	flex-direction:column;
	gap:10px;
	min-width:0;
}
.rok-equipment__detail span {
	color:#70767C;
	font:500 8px/1.25 "IBM Plex Mono",monospace;
}
.rok-equipment__detail strong {
	font-size:11px;
	line-height:1.45;
	font-weight:500;
}
.rok-equipment__engine-list {
	display:grid;
	grid-template-columns:repeat(5,minmax(0,1fr));
	gap:10px;
}
.rok-equipment__engine-list strong {
	font-size:11px;
	line-height:1.45;
	font-weight:500;
}

/* Prevent old equipment matrix rules from affecting rebuilt markup */
.rok-equipment__matrix { display:none !important; }

/* Approved services remain white with light cards */
.rok-services { background:#fff !important; }
.rok-service-card { background:#F5F4F0 !important; }

/* Keep section transitions tight */
.rok-services + .rok-exchange,
.rok-exchange + .rok-process,
.rok-process + .rok-facts,
.rok-facts + .rok-trusted,
.rok-trusted + .rok-equipment,
.rok-equipment + .rok-cases,
.rok-cases + .rok-delivery,
.rok-delivery + .rok-warranty,
.rok-warranty + .rok-reviews,
.rok-reviews + .rok-final-cta {
	margin-top:0 !important;
}

@media (max-width:900px) {
	.rok-process__grid { grid-template-columns:1fr !important; }
	.rok-trusted__grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
	.rok-equipment__inner { grid-template-columns:1fr !important; gap:32px !important; }
	.rok-equipment__details { grid-template-columns:1fr 1fr !important; }
	.rok-equipment__detail--engines { grid-column:1 / -1; }
}


/* ==========================================================
   HOME — EQUIPMENT / EXACT FIGMA STRUCTURE
   This block supersedes all previous .rok-equipment rules.
========================================================== */

.rok-equipment--figma {
	background: #E7E5E0 !important;
	padding: 64px 0 68px !important;
}

.rok-equipment--figma .rok-equipment__inner {
	width: min(1200px, calc(100% - 48px)) !important;
	margin: 0 auto !important;
	display: block !important;
}

.rok-equipment--figma .rok-equipment__header {
	margin: 0 0 28px !important;
	display: block !important;
}

.rok-equipment--figma .rok-section-label {
	margin: 0 0 12px !important;
	font-family: "IBM Plex Mono", monospace !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	line-height: 14px !important;
	color: #F05A24 !important;
}

.rok-equipment--figma .rok-equipment__title {
	margin: 0 !important;
	max-width: 590px !important;
	font-size: 36px !important;
	font-weight: 600 !important;
	line-height: 1.03 !important;
	letter-spacing: -0.03em !important;
}

.rok-equipment--figma .rok-equipment__brands {
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	gap: 28px !important;
	margin: 0 0 46px !important;
	padding: 0 !important;
	border: 0 !important;
}

.rok-equipment--figma .rok-equipment__brands p {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
}

.rok-equipment--figma .rok-equipment__row {
	margin: 0 0 22px !important;
	padding: 0 !important;
	border: 0 !important;
}

.rok-equipment--figma .rok-equipment__row:last-child {
	margin-bottom: 0 !important;
}

.rok-equipment--figma .rok-equipment__row-label {
	margin: 0 0 10px !important;
	font-family: "IBM Plex Mono", monospace !important;
	font-size: 8px !important;
	font-weight: 500 !important;
	line-height: 12px !important;
	color: #70767C !important;
}

.rok-equipment--figma .rok-equipment__row-values {
	display: grid !important;
	align-items: start !important;
	margin: 0 !important;
	padding: 0 !important;
}

.rok-equipment--figma .rok-equipment__row-values--8 {
	grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
	gap: 20px !important;
}

.rok-equipment--figma .rok-equipment__row-values--3 {
	grid-template-columns: repeat(3, 140px) !important;
	gap: 58px !important;
}

.rok-equipment--figma .rok-equipment__row-values--4 {
	grid-template-columns: repeat(4, 120px) !important;
	gap: 42px !important;
}

.rok-equipment--figma .rok-equipment__row-values p {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	line-height: 1.35 !important;
}

@media (max-width: 900px) {
	.rok-equipment--figma {
		padding: 48px 0 !important;
	}
	.rok-equipment--figma .rok-equipment__title {
		font-size: 30px !important;
	}
	.rok-equipment--figma .rok-equipment__brands {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 16px 24px !important;
		margin-bottom: 34px !important;
	}
	.rok-equipment--figma .rok-equipment__row-values--8,
	.rok-equipment--figma .rok-equipment__row-values--3,
	.rok-equipment--figma .rok-equipment__row-values--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px 24px !important;
	}
}

/* =========================================================
   ROK — IMAGE CONTAINMENT AUDIT
   Keeps every managed site image inside its designed frame.
   ========================================================= */

/* Home hero */
.rok-hero__media {
	overflow: hidden;
}
.rok-hero__media > img,
.rok-hero__media .rok-home-hero-image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	object-position: center;
}

/* Case cards — homepage and Works archive use different wrappers/classes. */
.rok-case-card__media,
.rok-cases-grid__cards .rok-case-card__image {
	overflow: hidden;
}
.rok-case-card__media > img,
.rok-case-card__media .rok-case-card__image,
.rok-cases-grid__cards .rok-case-card__image > img,
.rok-cases-grid__cards .rok-case-card__photo {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	object-fit: cover;
	object-position: center;
}
/* Important: on homepage rok-case-card__image is the IMG itself, not its frame. */
.rok-case-card__media > .rok-case-card__image {
	min-height: 0;
	flex: 0 0 100%;
}

/* Single case — hero, process and result. */
.rok-single-case-hero__media,
.rok-single-case-process__photo,
.rok-single-case-result__media {
	overflow: hidden;
}
.rok-single-case-hero__media > img,
.rok-single-case-hero__image,
.rok-single-case-process__photo > img,
.rok-single-case-process__image,
.rok-single-case-result__media > img,
.rok-single-case-result__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	object-fit: cover;
	object-position: center;
}

/* Exchange fund cards. */
.rok-exchange-card__media {
	overflow: hidden;
}
.rok-exchange-card__media > img,
.rok-exchange-card__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	object-position: center;
}

/* Article cards, featured article and single article hero. */
.rok-article-card__media,
.rok-articles-featured__media,
.rok-single-article-hero__media {
	overflow: hidden;
}
.rok-article-card__media > img,
.rok-article-card__image,
.rok-articles-featured__media > img,
.rok-articles-featured__image,
.rok-single-article-hero__media > img,
.rok-single-article-hero__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	object-position: center;
}
/* Images intentionally placed inside article text keep their natural aspect ratio. */
.rok-single-article-body__inner img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	max-height: 520px;
	object-fit: cover;
}

/* About page managed photos. */
.rok-about-hero__media,
.rok-about-base__media {
	overflow: hidden;
}
.rok-about-hero__media > img,
.rok-about-base__media > img,
.rok-about-managed-image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	object-position: center;
}


/* =========================================================
   ROK — NAVIGATION LINK VISUAL PRESERVATION
   Breadcrumb links remain visually identical to breadcrumb text.
   ========================================================= */
.rok-about-hero__breadcrumbs a,
.rok-articles-hero__breadcrumbs a,
.rok-cases-hero__breadcrumbs a,
.rok-contacts__breadcrumbs a,
.rok-info-hero__breadcrumbs a,
.rok-exchange-hero__breadcrumbs a,
.rok-single-case-hero__breadcrumbs a,
.rok-single-article-hero__breadcrumbs a {
	color: inherit;
	text-decoration: none;
}

/* =========================================================
   ROK — UNIFIED INNER PAGE HERO TYPOGRAPHY
   ========================================================= */
.rok-service-hero__title,
.rok-exchange-hero__title,
.rok-articles-hero__title,
.rok-about-hero__title,
.rok-contacts__title {
    font-family: Manrope, sans-serif !important;
    font-size: 64px !important;
    font-weight: 700 !important;
    line-height: 1.06 !important;
    letter-spacing: -0.02em !important;
    color: #151719 !important;
}

.rok-service-hero__label,
.rok-exchange-hero__label,
.rok-articles-hero__label,
.rok-about-kicker,
.rok-contacts__label {
    font-family: "IBM Plex Mono", monospace !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;
    color: #F05A24 !important;
    text-transform: uppercase !important;
}

@media (max-width: 900px) {
    .rok-service-hero__title,
    .rok-exchange-hero__title,
    .rok-articles-hero__title,
    .rok-about-hero__title,
    .rok-contacts__title {
        font-size: 52px !important;
    }
}

@media (max-width: 600px) {
    .rok-service-hero__title,
    .rok-exchange-hero__title,
    .rok-articles-hero__title,
    .rok-about-hero__title,
    .rok-contacts__title {
        font-size: 40px !important;
        line-height: 1.08 !important;
    }
}

/* =========================================================
   ROK — SERVICE PAGE PHOTOS
   ========================================================= */
.rok-service-hero__media .rok-service-photo,
.rok-service-process__media .rok-service-photo,
.rok-service-defect__media .rok-service-photo,
.rok-service-case__media .rok-service-photo {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.rok-service-hero__media:has(.rok-service-photo),
.rok-service-process__media:has(.rok-service-photo),
.rok-service-defect__media:has(.rok-service-photo),
.rok-service-case__media:has(.rok-service-photo) {
    padding: 0;
}

.rok-service-photo__placeholder {
    margin: 0;
    font-family: "IBM Plex Mono", monospace;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #70767C;
    text-align: center;
}

/* =========================================================
   ROK — SERVICE PAGE SPACING / WARRANTY ALIGNMENT FIX
   ========================================================= */
.rok-service-models__inner {
    padding-bottom: 48px;
}

.rok-service-equipment__inner {
    padding-top: 48px;
}

.rok-service-warranty__info {
    margin-top: 46px;
}

/* =========================================================
   ROK — ARTICLES CARD INTERACTION PRESERVATION
   Keep the whole card clickable without adding an underline.
   ========================================================= */
.rok-article-card:hover .rok-article-card__title,
.rok-articles-featured:hover .rok-articles-featured__title {
    text-decoration: none !important;
}

.rok-article-card__title a,
.rok-articles-featured__title a,
.rok-article-card__media,
.rok-article-card__link,
.rok-articles-featured__media,
.rok-articles-featured__link {
    text-decoration: none !important;
}


/* SERVICE PAGE — ALL CASES LINK */
.rok-service-cases__footer {
	display: flex;
	justify-content: flex-end;
	margin-top: 36px;
}

.rok-service-cases__all {
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	color: #151719;
	text-decoration: none;
}

.rok-service-cases__all:hover {
	color: #F05A24;
	text-decoration: none;
}


/* =========================================================
   EXCHANGE PAGE — MANAGED HERO PHOTO
   ========================================================= */
.rok-exchange-hero__media > img,
.rok-exchange-hero__media .rok-exchange-hero-image {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
}
/* EXCHANGE PAGE — HERO PHOTO FIX */

.rok-exchange-hero__media {
	height: 440px;
	padding: 0;
	overflow: hidden;
}

.rok-exchange-hero__media img,
.rok-exchange-hero__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
}
/* EXCHANGE PAGE — STEPS FIX */

.rok-exchange-steps__inner {
	min-height: 0;
	padding-top: 56px;
	padding-bottom: 64px;
}

/* Заголовки шагов */
.rok-exchange-step__title {
	color: #151719;
}

/* Описание */
.rok-exchange-step__text {
	color: #70767C;
}
/* ========================================
   LEGAL PAGES
======================================== */

.rok-legal {
	background: #F5F4F0;
	color: #151719;
}

.rok-legal__inner {
	width: min(1200px, calc(100% - 48px));
	margin: 0 auto;
	padding: 72px 0 96px;
}

.rok-legal__title {
	max-width: 900px;
	margin: 0 0 56px;
	font-family: Manrope, sans-serif;
	font-size: 52px;
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: #151719;
}

.rok-legal__content {
	max-width: 900px;
	font-family: Manrope, sans-serif;
	font-size: 16px;
	line-height: 1.65;
	color: #151719;
}

.rok-legal__content h2 {
	margin: 56px 0 20px;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.rok-legal__content h3 {
	margin: 36px 0 16px;
	font-size: 21px;
	line-height: 1.3;
}

.rok-legal__content p {
	margin: 0 0 18px;
}

.rok-legal__content ul,
.rok-legal__content ol {
	margin: 0 0 24px;
	padding-left: 24px;
}

.rok-legal__content li {
	margin-bottom: 8px;
}

.rok-legal__content a {
	color: #151719;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.rok-legal__content a:hover {
	color: #F05A24;
}

@media (max-width: 900px) {

	.rok-legal__inner {
		padding: 56px 0 72px;
	}

	.rok-legal__title {
		font-size: 42px;
		margin-bottom: 40px;
	}
}

@media (max-width: 600px) {

	.rok-legal__inner {
		width: min(100% - 32px, 1200px);
		padding: 40px 0 56px;
	}

	.rok-legal__title {
		font-size: 34px;
		margin-bottom: 32px;
	}

	.rok-legal__content h2 {
		margin-top: 40px;
		font-size: 24px;
	}
}
/* DELIVERY / PAYMENT — HERO SPACING FIX */

.rok-info-hero__inner {
	padding-bottom: 48px;
	min-height: 0;
}
/* DELIVERY / PAYMENT — HERO SPACING FIX */

.rok-info-hero,
.rok-info-hero__inner {
	min-height: 0;
}

.rok-info-hero__inner {
	padding-bottom: 48px;
}
/* ========================================
   REQUEST FORM — STATUS MESSAGE
======================================== */

.rok-final-cta__status {
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	margin-top: 16px;
}

.rok-final-cta__status.is-success {
	color: #151719;
}

.rok-final-cta__status.is-error {
	color: #F05A24;
}/* ========================================
   REQUEST FORM — STATUS MESSAGE
======================================== */

.rok-final-cta__status {
	font-family: "IBM Plex Mono", monospace;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	margin-top: 16px;
}

.rok-final-cta__status.is-success {
	color: #151719;
}

.rok-final-cta__status.is-error {
	color: #F05A24;
}
/* ========================================
   CTA — CHROME AUTOFILL
======================================== */

.rok-final-cta__field input {
	background-color: transparent;
}

.rok-final-cta__field input:-webkit-autofill,
.rok-final-cta__field input:-webkit-autofill:hover,
.rok-final-cta__field input:-webkit-autofill:focus,
.rok-final-cta__field input:-webkit-autofill:active {
	-webkit-text-fill-color: #151719 !important;
	caret-color: #151719 !important;

	-webkit-box-shadow:
		0 0 0 1000px #F05A24 inset !important;

	box-shadow:
		0 0 0 1000px #F05A24 inset !important;

	border: 0 !important;
	border-bottom: 1px solid #151719 !important;

	transition:
		background-color 5000s ease-in-out 0s !important;
}
/* ========================================
   ALL CTA FORMS — CHROME AUTOFILL
======================================== */

section[id="request"] form input:-webkit-autofill,
section[id="request"] form input:-webkit-autofill:hover,
section[id="request"] form input:-webkit-autofill:focus,
section[id="request"] form input:-webkit-autofill:active {
	-webkit-text-fill-color: #151719 !important;
	caret-color: #151719 !important;

	-webkit-box-shadow: 0 0 0 1000px #F05A24 inset !important;
	box-shadow: 0 0 0 1000px #F05A24 inset !important;

	transition: background-color 9999s ease-out 0s !important;
}
/* ========================================
   RESPONSIVE
======================================== */

@media (max-width: 768px) {

	/* mobile rules */

}

/* ==========================================================
   ROK — RESPONSIVE LAYER / ALL PAGES
   Added 2026-09-11. Desktop rules above remain unchanged.
========================================================== */

@media (max-width: 900px) {
    html, body { max-width:100%; overflow-x:hidden; }
    img, iframe { max-width:100%; }

    .rok-header__inner,
    .rok-hero__inner, .rok-services__inner, .rok-exchange__inner, .rok-process__inner,
    .rok-facts__inner, .rok-trusted__inner, .rok-equipment__inner, .rok-cases__inner,
    .rok-delivery__inner, .rok-warranty__inner, .rok-reviews__inner, .rok-final-cta__inner,
    .rok-footer__inner,
    .rok-service-hero__inner, .rok-service-defect__inner, .rok-service-models__inner,
    .rok-service-process__inner, .rok-service-exchange__inner, .rok-service-warranty__inner,
    .rok-service-cases__inner, .rok-service-equipment__inner,
    .rok-exchange-hero__inner, .rok-exchange-benefits__inner, .rok-exchange-steps__inner,
    .rok-exchange-stock__inner, .rok-exchange-conditions__inner, .rok-exchange-cta__inner,
    .rok-cases-hero__inner, .rok-cases-grid__inner, .rok-cases-cta__inner,
    .rok-single-case-hero__inner, .rok-single-case-process__inner, .rok-single-case-result__inner,
    .rok-single-case-cta__inner,
    .rok-articles-hero__inner, .rok-articles-grid__inner, .rok-articles-cta__inner,
    .rok-single-article-hero__inner, .rok-single-article-body__inner,
    .rok-about-hero__inner, .rok-about-base__inner, .rok-about-services__inner,
    .rok-about-stats__inner, .rok-about-cta__inner,
    .rok-info-hero__inner, .rok-info-terms__inner, .rok-info-cta__inner,
    .rok-contacts__inner, .rok-legal__inner {
        width:min(100% - 48px, 1200px) !important;
        max-width:1200px !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    .rok-hero__inner, .rok-exchange__inner, .rok-final-cta__inner,
    .rok-service-hero__inner, .rok-service-defect__inner, .rok-service-process__inner,
    .rok-service-exchange__inner, .rok-service-warranty__inner,
    .rok-exchange-hero__grid, .rok-exchange-conditions__content, .rok-exchange-cta__inner,
    .rok-cases-hero__content, .rok-cases-cta__inner,
    .rok-single-case-hero__inner, .rok-single-case-result__inner, .rok-single-case-cta__inner,
    .rok-articles-hero__grid, .rok-articles-cta__inner,
    .rok-single-article-hero__grid,
    .rok-about-hero__grid, .rok-about-base__inner, .rok-about-cta__inner,
    .rok-contacts__grid {
        grid-template-columns:1fr !important;
    }

    .rok-services__grid, .rok-services__grid--primary, .rok-services__grid--secondary,
    .rok-cases__grid, .rok-cases-grid__cards, .rok-articles-grid__cards,
    .rok-service-cases__grid, .rok-exchange-stock__grid,
    .rok-about-services__grid, .rok-about-stats__grid {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .rok-process__grid, .rok-exchange-steps__grid,
    .rok-service-models__grid, .rok-service-models__groups,
    .rok-single-case-process__steps {
        grid-template-columns:1fr !important;
    }

    .rok-facts__grid, .rok-trusted__grid {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .rok-equipment--figma .rok-equipment__inner,
    .rok-equipment__inner { display:block !important; }
    .rok-equipment__brands { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
    .rok-equipment__details { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .rok-equipment__detail--engines { grid-column:1 / -1 !important; }
    .rok-equipment__engine-list { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }

    .rok-footer__top { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }

    .rok-hero__media, .rok-service-hero__media, .rok-exchange-hero__media,
    .rok-cases-hero__media, .rok-articles-hero__media, .rok-single-article-hero__media,
    .rok-about-hero__media, .rok-single-case-hero__media,
    .rok-service-defect__media, .rok-service-process__media,
    .rok-single-case-result__media {
        width:100% !important;
        max-width:none !important;
    }

    .rok-home-hero-image, .rok-exchange-hero-image, .rok-cases-hero-image,
    .rok-about-managed-image, .rok-single-case-hero__image,
    .rok-single-case-result__image, .rok-single-article-hero__image {
        width:100% !important;
        height:auto !important;
        max-width:none !important;
        object-fit:cover;
    }
}

@media (max-width: 768px) {
    .rok-header__inner { min-height:64px !important; height:auto !important; }
    .rok-header__nav { display:none !important; }
    .rok-header__actions { margin-left:auto !important; }
    .rok-header__phone { white-space:nowrap; }

    .rok-hero__inner, .rok-exchange__inner,
    .rok-final-cta__inner, .rok-service-hero__inner,
    .rok-exchange-hero__grid, .rok-cases-hero__content,
    .rok-single-case-hero__inner, .rok-single-case-result__inner,
    .rok-articles-hero__grid, .rok-single-article-hero__grid,
    .rok-about-hero__grid, .rok-about-base__inner {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:32px !important;
    }

    .rok-hero__content, .rok-service-hero__content, .rok-exchange-hero__content,
    .rok-cases-hero__content, .rok-articles-hero__content,
    .rok-single-case-hero__content, .rok-about-hero__text {
        width:100% !important;
        max-width:none !important;
    }

    .rok-hero__title, .rok-service-hero__title, .rok-exchange-hero__title,
    .rok-cases-hero__title, .rok-articles-hero__title,
    .rok-single-case-hero__title, .rok-single-article-hero__title,
    .rok-about-hero__title, .rok-info-hero__title, .rok-contacts__title {
        max-width:none !important;
        font-size:clamp(36px, 7vw, 52px) !important;
        line-height:.98 !important;
        overflow-wrap:break-word;
    }

    .rok-services__title, .rok-process__title, .rok-exchange__title,
    .rok-trusted__title, .rok-equipment__title, .rok-cases__title,
    .rok-delivery__title, .rok-warranty__title, .rok-reviews__title,
    .rok-final-cta__title, .rok-service-models__title, .rok-service-process__title,
    .rok-service-exchange__title, .rok-service-warranty__title, .rok-service-cases__title,
    .rok-exchange-stock__title, .rok-exchange-steps__title, .rok-exchange-conditions__title,
    .rok-cases-grid__title, .rok-articles-grid__title, .rok-info-terms__title {
        max-width:none !important;
        font-size:clamp(30px, 6vw, 44px) !important;
        line-height:1 !important;
    }

    .rok-final-cta__form, .rok-exchange-cta__form, .rok-cases-cta__form,
    .rok-articles-cta__form, .rok-single-case-cta__form,
    .rok-about-cta__form, .rok-info-cta__form, .rok-contacts__form {
        width:100% !important;
        max-width:none !important;
        margin-left:0 !important;
    }

    .rok-delivery__content, .rok-warranty__content, .rok-reviews__content,
    .rok-service-warranty__content, .rok-exchange-conditions__content {
        grid-template-columns:1fr !important;
    }

    .rok-single-case-process__photos { grid-template-columns:1fr 1fr !important; }
    .rok-exchange-benefits__grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }

    .rok-articles-grid__filters, .rok-cases-grid__filters, .rok-exchange-stock__tabs {
        display:flex !important;
        flex-wrap:wrap !important;
        gap:8px !important;
    }
}

@media (max-width: 520px) {
    .rok-header__inner,
    .rok-hero__inner, .rok-services__inner, .rok-exchange__inner, .rok-process__inner,
    .rok-facts__inner, .rok-trusted__inner, .rok-equipment__inner, .rok-cases__inner,
    .rok-delivery__inner, .rok-warranty__inner, .rok-reviews__inner, .rok-final-cta__inner,
    .rok-footer__inner,
    .rok-service-hero__inner, .rok-service-defect__inner, .rok-service-models__inner,
    .rok-service-process__inner, .rok-service-exchange__inner, .rok-service-warranty__inner,
    .rok-service-cases__inner, .rok-service-equipment__inner,
    .rok-exchange-hero__inner, .rok-exchange-benefits__inner, .rok-exchange-steps__inner,
    .rok-exchange-stock__inner, .rok-exchange-conditions__inner, .rok-exchange-cta__inner,
    .rok-cases-hero__inner, .rok-cases-grid__inner, .rok-cases-cta__inner,
    .rok-single-case-hero__inner, .rok-single-case-process__inner, .rok-single-case-result__inner,
    .rok-single-case-cta__inner,
    .rok-articles-hero__inner, .rok-articles-grid__inner, .rok-articles-cta__inner,
    .rok-single-article-hero__inner, .rok-single-article-body__inner,
    .rok-about-hero__inner, .rok-about-base__inner, .rok-about-services__inner,
    .rok-about-stats__inner, .rok-about-cta__inner,
    .rok-info-hero__inner, .rok-info-terms__inner, .rok-info-cta__inner,
    .rok-contacts__inner, .rok-legal__inner {
        width:calc(100% - 32px) !important;
    }

    .rok-header__phone { display:none !important; }

    .rok-hero__title, .rok-service-hero__title, .rok-exchange-hero__title,
    .rok-cases-hero__title, .rok-articles-hero__title,
    .rok-single-case-hero__title, .rok-single-article-hero__title,
    .rok-about-hero__title, .rok-info-hero__title, .rok-contacts__title {
        font-size:36px !important;
        letter-spacing:-.04em !important;
    }

    .rok-services__title, .rok-process__title, .rok-exchange__title,
    .rok-trusted__title, .rok-equipment__title, .rok-cases__title,
    .rok-delivery__title, .rok-warranty__title, .rok-reviews__title,
    .rok-final-cta__title, .rok-service-models__title, .rok-service-process__title,
    .rok-service-exchange__title, .rok-service-warranty__title, .rok-service-cases__title,
    .rok-exchange-stock__title, .rok-exchange-steps__title, .rok-exchange-conditions__title,
    .rok-cases-grid__title, .rok-articles-grid__title, .rok-info-terms__title {
        font-size:30px !important;
    }

    .rok-hero__buttons, .rok-exchange__buttons {
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        gap:10px !important;
    }
    .rok-hero__buttons a, .rok-exchange__buttons a { width:100% !important; text-align:center; }

    .rok-services__grid, .rok-services__grid--primary, .rok-services__grid--secondary,
    .rok-cases__grid, .rok-cases-grid__cards, .rok-articles-grid__cards,
    .rok-service-cases__grid, .rok-exchange-stock__grid,
    .rok-about-services__grid, .rok-about-stats__grid,
    .rok-facts__grid, .rok-trusted__grid, .rok-exchange-benefits__grid {
        grid-template-columns:1fr !important;
    }

    .rok-service-card, .rok-case-card, .rok-article-card, .rok-exchange-card,
    .rok-fact, .rok-trusted-company, .rok-exchange-benefit {
        width:100% !important;
        max-width:none !important;
        min-width:0 !important;
    }

    .rok-equipment__brands { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .rok-equipment__details { grid-template-columns:1fr !important; }
    .rok-equipment__engine-list { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }

    .rok-single-case-process__photos { grid-template-columns:1fr !important; }

    .rok-footer__top { grid-template-columns:1fr !important; gap:32px !important; }
    .rok-footer__bottom { display:flex !important; flex-direction:column !important; gap:12px !important; align-items:flex-start !important; }

    .rok-final-cta__button, .rok-exchange-cta__button, .rok-cases-cta__button,
    .rok-articles-cta__button, .rok-single-case-cta__button,
    .rok-info-cta__button, .rok-contacts__button {
        width:100% !important;
    }

    .rok-contacts__map { height:300px !important; }

    .rok-legal__content, .rok-single-article-body__inner {
        overflow-wrap:anywhere;
    }
}

@media (max-width: 380px) {
    .rok-header__inner,
    .rok-hero__inner, .rok-services__inner, .rok-exchange__inner, .rok-process__inner,
    .rok-facts__inner, .rok-trusted__inner, .rok-equipment__inner, .rok-cases__inner,
    .rok-delivery__inner, .rok-warranty__inner, .rok-reviews__inner, .rok-final-cta__inner,
    .rok-footer__inner,
    .rok-service-hero__inner, .rok-service-defect__inner, .rok-service-models__inner,
    .rok-service-process__inner, .rok-service-exchange__inner, .rok-service-warranty__inner,
    .rok-service-cases__inner, .rok-service-equipment__inner,
    .rok-exchange-hero__inner, .rok-exchange-benefits__inner, .rok-exchange-steps__inner,
    .rok-exchange-stock__inner, .rok-exchange-conditions__inner, .rok-exchange-cta__inner,
    .rok-cases-hero__inner, .rok-cases-grid__inner, .rok-cases-cta__inner,
    .rok-single-case-hero__inner, .rok-single-case-process__inner, .rok-single-case-result__inner,
    .rok-single-case-cta__inner,
    .rok-articles-hero__inner, .rok-articles-grid__inner, .rok-articles-cta__inner,
    .rok-single-article-hero__inner, .rok-single-article-body__inner,
    .rok-about-hero__inner, .rok-about-base__inner, .rok-about-services__inner,
    .rok-about-stats__inner, .rok-about-cta__inner,
    .rok-info-hero__inner, .rok-info-terms__inner, .rok-info-cta__inner,
    .rok-contacts__inner, .rok-legal__inner {
        width:calc(100% - 24px) !important;
    }
    .rok-hero__title, .rok-service-hero__title, .rok-exchange-hero__title,
    .rok-cases-hero__title, .rok-articles-hero__title,
    .rok-single-case-hero__title, .rok-single-article-hero__title,
    .rok-about-hero__title, .rok-info-hero__title, .rok-contacts__title {
        font-size:32px !important;
    }
}

/* ==========================================================
   HOME — MOBILE CORRECTIONS / 2026-09-11
   Fixes verified from 430px screenshots.
========================================================== */
@media (max-width: 520px) {
    /* Exchange: stack the steps; never leave empty desktop cells. */
    .rok-exchange__inner {
        display:block !important;
    }
    .rok-exchange__content {
        width:100% !important;
        max-width:none !important;
    }
    .rok-exchange__steps {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:24px !important;
        width:100% !important;
        margin-top:48px !important;
        padding-top:0 !important;
    }
    .rok-exchange-step,
    .rok-exchange-step--time {
        grid-column:auto !important;
        width:100% !important;
        max-width:none !important;
        min-height:0 !important;
        padding-top:12px !important;
    }
    .rok-exchange-step__number { margin-bottom:10px !important; }
    .rok-exchange-step__title {
        display:block !important;
        font-size:13px !important;
        line-height:1.35 !important;
    }
    .rok-exchange-step__time { font-size:34px !important; }

    /* Trusted companies: compact readable two-column list. */
    .rok-trusted__header { margin-bottom:28px !important; }
    .rok-trusted__title {
        max-width:none !important;
        font-size:30px !important;
        line-height:1.02 !important;
    }
    .rok-trusted__grid {
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:0 20px !important;
        width:100% !important;
        align-items:start !important;
    }
    .rok-trusted-company {
        display:flex !important;
        align-items:flex-start !important;
        justify-content:flex-start !important;
        min-height:0 !important;
        width:100% !important;
        padding:14px 0 !important;
        margin:0 !important;
        border-top:1px solid #D4D2CD !important;
    }
    .rok-trusted-company__name {
        width:100% !important;
        font-size:10px !important;
        line-height:1.35 !important;
        text-align:left !important;
    }

    /* Cases: mobile header and cards must use the whole content width. */
    .rok-cases__header {
        display:flex !important;
        flex-direction:column !important;
        align-items:flex-start !important;
        gap:24px !important;
        margin-bottom:32px !important;
    }
    .rok-cases__all { margin:0 !important; }
    .rok-cases .rok-cases__grid {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:40px !important;
        width:100% !important;
        margin-top:0 !important;
    }
    .rok-case-card__media { aspect-ratio:4 / 3 !important; }
    .rok-case-card__title {
        font-size:22px !important;
        line-height:1.2 !important;
    }

    /* Delivery: desktop 2-column grid was still active. */
    .rok-delivery__inner {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:52px !important;
        min-height:0 !important;
    }
    .rok-delivery__content,
    .rok-delivery__route {
        width:100% !important;
        max-width:none !important;
        margin-left:0 !important;
    }
    .rok-delivery__title {
        max-width:none !important;
        font-size:30px !important;
        line-height:1 !important;
    }
    .rok-delivery__text {
        max-width:none !important;
        font-size:16px !important;
        line-height:1.55 !important;
    }
    .rok-delivery__text br { display:none !important; }
    .rok-delivery__route { margin-top:0 !important; }
    .rok-delivery__city,
    .rok-delivery__country {
        font-size:30px !important;
        line-height:1.1 !important;
        overflow-wrap:anywhere;
    }

    /* Warranty: stack intro and both warranty points. */
    .rok-warranty__inner {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:52px !important;
        min-height:0 !important;
    }
    .rok-warranty__content,
    .rok-warranty__items,
    .rok-warranty-item {
        width:100% !important;
        max-width:none !important;
        margin-left:0 !important;
    }
    .rok-warranty__title {
        max-width:none !important;
        font-size:30px !important;
        line-height:1 !important;
    }
    .rok-warranty__text {
        max-width:none !important;
        font-size:16px !important;
        line-height:1.55 !important;
    }
    .rok-warranty__text br { display:none !important; }
    .rok-warranty__items { margin-top:0 !important; }
    .rok-warranty-item + .rok-warranty-item { margin-top:44px !important; }
    .rok-warranty-item__title {
        max-width:none !important;
        font-size:22px !important;
        line-height:1.2 !important;
    }
    .rok-warranty-item__text { max-width:none !important; }

    /* Reviews: desktop 1/2 + two-card grid caused horizontal clipping. */
    .rok-reviews__inner {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:40px !important;
        min-height:0 !important;
    }
    .rok-reviews__header,
    .rok-reviews__content {
        width:100% !important;
        max-width:none !important;
        margin-left:0 !important;
    }
    .rok-reviews__title {
        max-width:none !important;
        font-size:30px !important;
        line-height:1 !important;
    }
    .rok-reviews .rok-reviews__content { margin-top:0 !important; }
    .rok-reviews__grid {
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:36px !important;
        width:100% !important;
    }
    .rok-review {
        width:100% !important;
        min-width:0 !important;
    }
    .rok-review__text {
        width:100% !important;
        max-width:none !important;
        min-height:0 !important;
        font-size:16px !important;
        line-height:1.55 !important;
    }
    .rok-reviews__navigation {
        width:100% !important;
        margin-top:40px !important;
        justify-content:space-between !important;
    }
}

/* ==========================================================
   MOBILE HOTFIX — HOME / 2026-09-11 B
========================================================== */
@media (max-width: 768px) {
    /* Header: keep the Navigation block alive so WordPress can render its mobile overlay button. */
    .rok-header__inner {
        display:grid !important;
        grid-template-columns:auto 1fr !important;
        align-items:center !important;
        gap:16px !important;
    }
    .rok-header__nav {
        display:flex !important;
        justify-self:end !important;
        margin-left:auto !important;
    }
    .rok-header__nav .wp-block-navigation__container {
        display:none !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container-open {
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        width:44px !important;
        height:44px !important;
        padding:0 !important;
        color:#151719 !important;
    }
    .rok-header__actions {
        display:none !important;
    }
}

@media (max-width: 520px) {
    /* Homepage exchange titles were being recoloured by the Exchange-page rule. */
    .rok-exchange .rok-exchange-step__title {
        display:block !important;
        visibility:visible !important;
        opacity:1 !important;
        color:#FFFFFF !important;
    }

    /* Cases: prevent heading from touching/clipping the section edge. */
    .rok-cases {
        padding-top:56px !important;
        padding-bottom:56px !important;
        overflow:hidden !important;
    }
    .rok-cases__inner {
        overflow:visible !important;
    }
    .rok-cases__title {
        margin-top:8px !important;
        font-size:30px !important;
        line-height:1 !important;
    }
    .rok-cases__all {
        display:inline-block !important;
    }
}

/* ==========================================================
   MOBILE HOTFIX — HERO MEDIA + WP NAV OVERLAY / 2026-09-11 C
========================================================== */
@media (max-width: 768px) {
    /* The image must occupy the complete designed media frame. */
    .rok-hero__media,
    .rok-exchange-hero__media {
        padding: 0 !important;
        overflow: hidden !important;
    }
    .rok-hero__media > img,
    .rok-hero__media .rok-home-hero-image,
    .rok-exchange-hero__media > img,
    .rok-exchange-hero__media img,
    .rok-exchange-hero__media .rok-exchange-hero-image,
    .rok-exchange-hero__media .rok-exchange-hero__image {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    /* WordPress navigation: hide only the desktop list when overlay is closed.
       Once WP opens the responsive container, restore its own menu contents. */
    .rok-header__nav > .wp-block-navigation__container {
        display: none !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open {
        display: flex !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 100000 !important;
        width: 100vw !important;
        height: 100dvh !important;
        padding: 24px !important;
        background: #F5F4F0 !important;
        color: #151719 !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        display: flex !important;
        width: 100% !important;
        height: 100% !important;
        padding-top: 72px !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 22px !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        display: block !important;
        width: auto !important;
        color: #151719 !important;
        font-family: Manrope, sans-serif !important;
        font-size: 26px !important;
        font-weight: 600 !important;
        line-height: 1.15 !important;
        text-decoration: none !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container-close {
        top: 20px !important;
        right: 20px !important;
        color: #151719 !important;
    }
}

/* ==========================================================
   MOBILE HOTFIX — SERVICE + EXCHANGE INNER PAGES / 2026-09-11 D
   Based on 430px verification screenshots.
========================================================== */
@media (max-width: 768px) {
    /* Service page — equipment/brands: desktop nowrap row must not overflow. */
    .rok-service-equipment__brands {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        gap: 12px 22px !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .rok-service-equipment__brands p {
        white-space: normal !important;
        font-size: 22px !important;
        line-height: 1.2 !important;
    }

    /* Service page — repair process: photo first, then steps below it. */
    .rok-service-process__content {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 32px !important;
        width: 100% !important;
    }
    .rok-service-process__media,
    .rok-service-process__steps {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }
    .rok-service-process__media {
        height: auto !important;
        aspect-ratio: 4 / 3 !important;
        padding: 0 !important;
    }
    .rok-service-process__media > img,
    .rok-service-process__media .rok-service-photo {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
        object-fit: cover !important;
        object-position: center !important;
    }
    .rok-service-process__item {
        grid-template-columns: 32px minmax(0, 1fr) !important;
        column-gap: 12px !important;
    }
    .rok-service-process__item h3,
    .rok-service-process__item p {
        max-width: none !important;
        overflow-wrap: break-word !important;
    }

    /* Exchange page — conditions: desktop two-column layout was still active. */
    .rok-exchange-conditions__inner {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 48px !important;
        min-height: 0 !important;
    }
    .rok-exchange-conditions__content,
    .rok-exchange-conditions__list {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
    }
    .rok-exchange-condition {
        grid-template-columns: 32px minmax(0, 1fr) !important;
        column-gap: 12px !important;
    }
    .rok-exchange-condition__title,
    .rok-exchange-condition__text {
        max-width: none !important;
        overflow-wrap: break-word !important;
    }
}

@media (max-width: 520px) {
    .rok-service-equipment__brands {
        gap: 10px 18px !important;
    }
    .rok-service-equipment__brands p {
        font-size: 20px !important;
    }
    .rok-service-process__heading {
        margin-bottom: 32px !important;
    }
    .rok-service-process__content {
        gap: 28px !important;
    }
    .rok-exchange-conditions__inner {
        gap: 40px !important;
    }
    .rok-exchange-condition {
        padding-right: 4px !important;
    }
}

/* ==========================================================
   MOBILE QA HOTFIX — CASES / ARTICLES / CONTACTS / NAV
   2026-09-11 E
========================================================== */
@media (max-width: 768px) {
    /* ALL CASES — hero must be one column on phones. */
    .rok-cases-hero__inner {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 32px !important;
        min-height: 0 !important;
        padding-top: 32px !important;
        padding-bottom: 48px !important;
    }
    .rok-cases-hero__content {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }
    .rok-cases-hero__breadcrumbs {
        margin-bottom: 42px !important;
        white-space: normal !important;
    }
    .rok-cases-hero__title {
        max-width: none !important;
    }
    .rok-cases-hero__text br { display: none !important; }
    .rok-cases-hero__media {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 4 / 3 !important;
        margin: 0 !important;
    }
    .rok-cases-hero__media img,
    .rok-cases-hero__media .rok-cases-hero-image {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* ARTICLES — keep the whole CTA inside the mobile viewport. */
    .rok-articles-cta,
    .rok-articles-cta__inner,
    .rok-articles-cta__content,
    .rok-articles-cta__form {
        box-sizing: border-box !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    .rok-articles-cta__inner {
        width: auto !important;
        margin-left: 24px !important;
        margin-right: 24px !important;
    }
    .rok-articles-cta__form {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .rok-articles-cta__title,
    .rok-articles-cta__text {
        width: 100% !important;
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }
    .rok-articles-cta__title br,
    .rok-articles-cta__text br { display: none !important; }
    .rok-articles-cta__field,
    .rok-articles-cta__field input,
    .rok-articles-cta__button {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* CONTACTS — preserve a real iframe box on mobile. */
    .rok-contacts__map {
        display: block !important;
        position: relative !important;
        width: 100% !important;
        height: 320px !important;
        min-height: 320px !important;
        overflow: hidden !important;
    }
    .rok-contacts__map iframe {
        display: block !important;
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 320px !important;
        opacity: 1 !important;
        visibility: visible !important;
        border: 0 !important;
    }

    /* NAV — compact right-side drawer; page remains visible behind it. */
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open {
        display: flex !important;
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100dvh !important;
        padding: 0 !important;
        background: rgba(21, 23, 25, 0.18) !important;
        justify-content: flex-end !important;
        align-items: stretch !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
        width: min(82vw, 320px) !important;
        max-width: 320px !important;
        height: 100% !important;
        margin: 0 0 0 auto !important;
        padding: 0 !important;
        background: rgba(245, 244, 240, 0.96) !important;
        box-shadow: -10px 0 30px rgba(21, 23, 25, 0.10) !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        width: 100% !important;
        height: auto !important;
        padding: 82px 28px 28px !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
        gap: 14px !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
    }
    .rok-header__nav .wp-block-navigation__responsive-container-close {
        top: 22px !important;
        right: 22px !important;
        width: 32px !important;
        height: 32px !important;
    }
}

@media (max-width: 380px) {
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
        width: 86vw !important;
    }
    .rok-articles-cta__inner {
        margin-left: 18px !important;
        margin-right: 18px !important;
    }
}

/* =========================================================
   TABLET / SMALL DESKTOP — 901–1240px
   Keep the 1200px desktop header from creating horizontal overflow.
   ========================================================= */
@media (min-width: 901px) and (max-width: 1240px) {
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .rok-header,
    .rok-articles-page,
    .rok-articles-hero,
    .rok-articles-grid,
    .rok-articles-cta {
        width: 100% !important;
        max-width: 100% !important;
    }

    .rok-header__inner {
        width: calc(100% - 48px) !important;
        max-width: 1200px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        grid-template-columns: 120px minmax(0, 1fr) auto !important;
    }

    .rok-header__nav,
    .rok-header__nav .wp-block-navigation__container {
        gap: 20px !important;
    }

    .rok-header__actions {
        gap: 16px !important;
    }

    .rok-button--primary .wp-block-button__link {
        width: 150px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .rok-articles-hero__inner,
    .rok-articles-grid__inner,
    .rok-articles-cta__inner {
        width: calc(100% - 48px) !important;
        max-width: 1200px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .rok-articles-hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 38%) !important;
        column-gap: 40px !important;
        align-items: start !important;
    }

    .rok-articles-hero__content,
    .rok-articles-hero__media {
        min-width: 0 !important;
    }

    .rok-articles-hero__title {
        font-size: 48px !important;
        line-height: 1.06 !important;
    }

    .rok-articles-hero__media,
    .rok-articles-hero__media:has(.rok-articles-featured) {
        width: 100% !important;
        max-width: none !important;
        justify-self: stretch !important;
    }
}


/* =========================================================
   ROK — TABLET / SMALL DESKTOP SYSTEM LAYOUT
   901–1100px
   ========================================================= */
@media (min-width: 901px) and (max-width: 1100px) {
    html, body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    /* One consistent content width across the whole site. */
    [class*="__inner"] {
        max-width: calc(100vw - 64px) !important;
    }

    .rok-header__inner {
        width: calc(100% - 64px) !important;
        max-width: none !important;
        grid-template-columns: auto minmax(0, 1fr) auto !important;
        column-gap: 24px !important;
    }
    .rok-header__nav .wp-block-navigation__container {
        gap: 24px !important;
    }
    .rok-header__actions {
        gap: 18px !important;
    }
    .rok-header__cta {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    /* Service page: keep desktop character, but actually fit the viewport. */
    .rok-service-hero__inner {
        width: calc(100% - 64px) !important;
        min-height: 560px !important;
        padding: 64px 0 !important;
        grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr) !important;
        column-gap: 48px !important;
    }
    .rok-service-hero__title {
        font-size: clamp(48px, 5.5vw, 60px) !important;
        line-height: .98 !important;
    }
    .rok-service-hero__text br { display: none !important; }
    .rok-service-hero__media,
    .rok-service-hero__media img {
        width: 100% !important;
        max-width: 100% !important;
    }

    .rok-service-models__inner,
    .rok-service-process__inner,
    .rok-service-exchange__inner,
    .rok-service-warranty__inner,
    .rok-service-cases__inner,
    .rok-service-defect__inner,
    .rok-service-equipment__inner {
        width: calc(100% - 64px) !important;
        max-width: none !important;
    }

    .rok-service-models__title,
    .rok-service-process__title,
    .rok-service-exchange__title,
    .rok-service-warranty__title,
    .rok-service-cases__title {
        font-size: 42px !important;
        line-height: 1.05 !important;
        max-width: 100% !important;
    }

    .rok-service-models__content {
        grid-template-columns: minmax(0, 1.35fr) minmax(240px, .65fr) !important;
        column-gap: 64px !important;
    }

    .rok-service-process__content {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        column-gap: 48px !important;
        align-items: start !important;
    }
    .rok-service-process__media,
    .rok-service-process__media img,
    .rok-service-process__image {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
    .rok-service-process__steps,
    .rok-service-process__step,
    .rok-service-process__step-content {
        min-width: 0 !important;
        max-width: 100% !important;
    }
    .rok-service-process__step-title,
    .rok-service-process__step-text {
        overflow-wrap: anywhere !important;
    }

    .rok-service-exchange__inner {
        grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr) !important;
        column-gap: 64px !important;
    }

    .rok-service-warranty__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        column-gap: 48px !important;
    }
    .rok-service-warranty__value,
    .rok-service-warranty__title {
        font-size: 42px !important;
        line-height: 1.08 !important;
    }
    .rok-service-warranty__subtitle {
        font-size: 22px !important;
        line-height: 1.25 !important;
    }
    .rok-service-warranty__text {
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }

    .rok-service-cases__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 24px !important;
    }
    .rok-service-cases__card,
    .rok-service-cases__image,
    .rok-service-cases__image img {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Articles page. */
    .rok-articles-hero__inner,
    .rok-articles-grid__inner,
    .rok-articles-cta__inner {
        width: calc(100% - 64px) !important;
        max-width: none !important;
    }
    .rok-articles-hero__grid {
        grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr) !important;
        column-gap: 48px !important;
    }
    .rok-articles-hero__title {
        font-size: 48px !important;
        line-height: 1.02 !important;
    }
    .rok-articles-hero__text br { display: none !important; }
    .rok-articles-grid__cards {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 24px !important;
    }

    /* Generic cards/images must never force a wider page. */
    .rok-case-card,
    .rok-article-card,
    .rok-articles-featured,
    .rok-case-card img,
    .rok-article-card img,
    .rok-articles-featured img {
        min-width: 0 !important;
        max-width: 100% !important;
    }
}

/* ========================================
   HEADER — ROK BRAND LOGO
======================================== */
.rok-header__brand {
    margin: 0;
    padding: 0;
    flex-shrink: 0;
    line-height: 0;
}

.rok-header__brand-link,
.rok-header__brand-link picture {
    display: block;
    line-height: 0;
}

.rok-header__brand-logo {
    display: block;
    width: 180px;
    height: auto;
    max-width: 100%;
}

@media (min-width: 901px) and (max-width: 1100px) {
    .rok-header__brand-logo {
        width: 145px;
    }
}

@media (max-width: 900px) {
    .rok-header__brand-logo {
        width: 132px;
    }
}

@media (max-width: 768px) {
    .rok-header__brand-logo {
        width: 60px;
    }
}

@media (max-width: 380px) {
    .rok-header__brand-logo {
        width: 54px;
    }
}


/* ========================================
   HOME — EXCHANGE STEPS COLOR RESTORE
   Keeps the Exchange page styles isolated.
======================================== */
.rok-exchange .rok-exchange-step__title {
    color: #F5F4F0 !important;
}

/* ========================================
   HOME HERO — 769–900px VERTICAL GAP FIX
   Prevents CTA buttons from touching hero image
======================================== */
@media (min-width: 769px) and (max-width: 900px) {
    .rok-hero__inner {
        row-gap: 32px !important;
    }
}

/* =========================================================
   HEADER — BURGER FROM 1009px AND BELOW
   Desktop navigation remains from 1010px.
   Uses the native WordPress Navigation overlay; no custom JS.
   ========================================================= */
@media (max-width: 1009px) {
    .rok-header__inner {
        display: grid !important;
        grid-template-columns: auto 1fr !important;
        align-items: center !important;
        gap: 16px !important;
    }

    .rok-header__nav {
        display: flex !important;
        justify-self: end !important;
        margin-left: auto !important;
    }

    .rok-header__nav > .wp-block-navigation__container,
    .rok-header__nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: none !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container-open {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        color: #151719 !important;
    }

    .rok-header__actions {
        display: none !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open {
        display: flex !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 100000 !important;
        width: 100vw !important;
        height: 100dvh !important;
        padding: 0 !important;
        background: rgba(21, 23, 25, 0.18) !important;
        justify-content: flex-end !important;
        align-items: stretch !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
        width: min(82vw, 320px) !important;
        max-width: 320px !important;
        height: 100% !important;
        margin: 0 0 0 auto !important;
        padding: 0 !important;
        background: rgba(245, 244, 240, 0.96) !important;
        box-shadow: -10px 0 30px rgba(21, 23, 25, 0.10) !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        display: flex !important;
        width: 100% !important;
        height: auto !important;
        padding: 82px 28px 28px !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 14px !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
    .rok-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        display: block !important;
        width: auto !important;
        color: #151719 !important;
        font-family: Manrope, sans-serif !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        text-decoration: none !important;
    }

    .rok-header__nav .wp-block-navigation__responsive-container-close {
        top: 22px !important;
        right: 22px !important;
        width: 32px !important;
        height: 32px !important;
        color: #151719 !important;
    }
}