.fokus21-research-page {
--stop-red: #d71920;
--stop-red-dark: #94161c;
--stop-red-deep: #650f15;
--stop-green: #2f8f57;
--stop-amber: #f0b33c;
--stop-ink: #171a22;
--stop-muted: #666b76;
--stop-line: rgba(23, 26, 34, 0.12);
--stop-soft: #f7f7f8;
--stop-warm: #fff4f4;
--accent: var(--stop-red);
--accent-dark: var(--stop-red-dark);
--accent-deep: var(--stop-red-deep);
color: var(--stop-ink);
} .fokus21-research-page.theme-blue {
--accent: #1f6feb;
--accent-dark: #134a9e;
--accent-deep: #0d306a;
}
.fokus21-research-page.theme-teal {
--accent: #15837a;
--accent-dark: #0f615a;
--accent-deep: #0a443f;
}
.fokus21-research-page.theme-violet {
--accent: #6b3fa0;
--accent-dark: #4f2d78;
--accent-deep: #371d55;
}
.fokus21-research-page.theme-green {
--accent: #2f8f57;
--accent-dark: #226b41;
--accent-deep: #16472b;
}
.fokus21-research-page * {
box-sizing: border-box;
}
.fokus21-research-page #primary {
float: none;
width: 100%;
}
.fokus21-research-page .site-main {
display: block;
}
.fokus21-research-page a,
.fokus21-research-page a:hover,
.fokus21-research-page a:focus,
.fokus21-research-page a:visited {
text-decoration: none;
}
.fokus21-research-article,
.fokus21-research-metrics,
.fokus21-research-section {
margin-bottom: 30px;
} .fokus21-research-hero {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
gap: 34px;
align-items: center;
padding: 42px;
border-radius: 8px;
background:
linear-gradient(135deg, var(--accent-deep), var(--accent));
overflow: hidden;
}
.fokus21-research-hero.is-solo {
grid-template-columns: minmax(0, 1fr);
}
.fokus21-research-hero::before {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(120deg, transparent 0 45%, rgba(255, 255, 255, 0.12) 45% 47%, transparent 47% 100%),
linear-gradient(120deg, transparent 0 58%, rgba(255, 255, 255, 0.08) 58% 60%, transparent 60% 100%);
pointer-events: none;
}
.fokus21-research-hero-copy,
.fokus21-research-hero-aside {
position: relative;
z-index: 1;
}
.fokus21-research-mark {
display: inline-flex;
align-items: center;
max-width: 100%;
margin-bottom: 16px;
padding: 8px 13px 8px 8px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.96);
color: var(--stop-ink);
box-shadow: 0 18px 42px rgba(0, 0, 0, 0.16);
}
.fokus21-research-mark img {
flex: 0 0 auto;
width: 44px;
height: 44px;
margin-right: 10px;
object-fit: contain;
}
.fokus21-research-mark span {
color: var(--stop-ink);
font-size: 14px;
font-weight: 800;
line-height: 1.35;
overflow-wrap: anywhere;
}
.fokus21-research-badge {
display: inline-flex;
margin-bottom: 14px;
padding: 5px 10px;
border: 1px solid rgba(255, 255, 255, 0.34);
border-radius: 999px;
background: rgba(23, 26, 34, 0.2);
color: #ffffff;
font-size: 12px;
font-weight: 800;
}
.fokus21-research-hero .entry-title {
max-width: 860px;
margin: 0;
color: #ffffff;
font-size: 42px !important;
line-height: 1.1;
overflow-wrap: anywhere;
}
.fokus21-research-hero p.fokus21-research-lead {
max-width: 780px;
margin: 18px 0 0;
color: rgba(255, 255, 255, 0.9);
font-size: 18px;
line-height: 1.7;
overflow-wrap: anywhere;
}
.fokus21-research-hero-meta {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 24px;
}
.fokus21-research-hero-meta span {
display: inline-flex;
padding: 7px 11px;
border: 1px solid rgba(255, 255, 255, 0.24);
border-radius: 999px;
color: #ffffff;
font-size: 13px;
font-weight: 700;
}
.fokus21-research-hero-aside {
display: grid;
gap: 14px;
padding: 24px;
border: 1px solid rgba(255, 255, 255, 0.35);
border-radius: 8px;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0 24px 58px rgba(0, 0, 0, 0.18);
}
.fokus21-research-hero-aside .fokus21-research-aside-title {
margin: 0;
color: var(--accent-dark);
font-size: 13px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.fokus21-research-hero-aside ul {
margin: 0;
padding: 0;
list-style: none;
display: grid;
gap: 12px;
}
.fokus21-research-hero-aside li {
display: grid;
grid-template-columns: minmax(64px, max-content) minmax(0, 1fr);
gap: 12px;
align-items: baseline;
}
.fokus21-research-hero-aside li strong {
color: var(--accent);
font-size: 26px;
line-height: 1;
white-space: nowrap;
}
.fokus21-research-hero-aside li span {
color: var(--stop-ink);
font-size: 14px;
font-weight: 700;
line-height: 1.35;
}
.fokus21-research-hero-aside blockquote {
margin: 0;
padding: 14px 0 0;
border-top: 1px solid var(--stop-line);
color: var(--accent-dark);
font-size: 16px;
font-weight: 800;
line-height: 1.45;
} .fokus21-research-entry {
margin-top: 18px;
padding: 26px;
border: 1px solid var(--stop-line);
border-radius: 8px;
background: #ffffff;
} .fokus21-research-metrics {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px;
}
.fokus21-research-metrics.cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fokus21-research-metrics.cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fokus21-research-metric {
min-width: 0;
min-height: 124px;
padding: 22px 22px;
border: 1px solid var(--stop-line);
border-top: 4px solid var(--accent);
border-radius: 8px;
background: linear-gradient(135deg, #ffffff, var(--stop-warm)), #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-metric strong {
display: block;
color: var(--accent);
font-size: 34px;
line-height: 1.04;
overflow-wrap: anywhere;
}
.fokus21-research-metric span {
display: block;
margin-top: 10px;
color: var(--stop-ink);
font-size: 15px;
font-weight: 800;
line-height: 1.35;
}
.fokus21-research-metric em {
display: block;
margin-top: 6px;
color: var(--stop-muted);
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 1.4;
} .fokus21-research-section {
padding: 30px 0;
background: transparent;
}
.fokus21-research-head {
margin-bottom: 24px;
padding-bottom: 16px;
border-bottom: 2px solid color-mix(in srgb, var(--accent) 22%, transparent);
}
.fokus21-research-head p {
margin: 0 0 8px;
color: var(--accent);
font-size: 13px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: 0.03em;
}
.fokus21-research-head h2 {
display: table;
width: -moz-fit-content;
width: fit-content;
max-width: min(100%, 940px);
margin: 0;
padding: 0.1em 0.6em 0.18em;
color: var(--stop-ink);
font-size: 30px !important;
line-height: 1.32;
overflow-wrap: anywhere; background-color: transparent;
background-image: linear-gradient(101deg,
transparent 0,
color-mix(in srgb, var(--accent) 30%, #fff) 1.8%,
color-mix(in srgb, var(--accent) 36%, #fff) 28%,
color-mix(in srgb, var(--accent) 30%, #fff) 72%,
color-mix(in srgb, var(--accent) 24%, #fff) 98%,
transparent 100%);
border-radius: 7px 20px 9px 22px;
} @supports not (background-image: linear-gradient(1deg, color-mix(in srgb, red 10%, #fff), #fff)) {
.fokus21-research-head h2 {
background-image: none;
background-color: var(--stop-warm);
}
}
.fokus21-research-head span {
display: block;
max-width: 820px;
margin-top: 10px;
color: var(--stop-muted);
font-size: 15px;
line-height: 1.65;
} .fokus21-research-callout {
display: grid;
gap: 12px;
padding: 28px 30px;
border-radius: 8px;
border-left: 5px solid var(--accent);
background: linear-gradient(135deg, var(--accent-deep), var(--accent));
color: #ffffff;
box-shadow: 0 18px 42px rgba(23, 26, 34, 0.12);
}
.fokus21-research-callout .fokus21-research-callout-kicker {
margin: 0;
color: rgba(255, 255, 255, 0.85);
font-size: 12px;
font-weight: 900;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.fokus21-research-callout h2 {
margin: 0;
color: #ffffff;
font-size: 24px !important;
line-height: 1.3;
}
.fokus21-research-callout p {
margin: 0;
color: rgba(255, 255, 255, 0.92);
font-size: 16px;
line-height: 1.7;
} .fokus21-research-cards {
display: grid;
gap: 16px;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fokus21-research-cards.cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fokus21-research-cards.cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.fokus21-research-card {
min-width: 0;
padding: 22px;
border: 1px solid var(--stop-line);
border-radius: 8px;
background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 6%, #ffffff), #ffffff);
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-card .fokus21-research-card-tag {
display: inline-flex;
margin-bottom: 14px;
padding: 5px 10px;
border-radius: 999px;
background: color-mix(in srgb, var(--accent) 12%, transparent);
color: var(--accent);
font-size: 12px;
font-weight: 900;
}
.fokus21-research-card h3 {
margin: 0;
color: var(--stop-ink);
font-size: 19px !important;
line-height: 1.3;
overflow-wrap: anywhere;
}
.fokus21-research-card p {
margin: 12px 0 0;
color: var(--stop-muted);
font-size: 15px;
line-height: 1.7;
} .fokus21-research-steps {
display: grid;
gap: 16px;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fokus21-research-steps.cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fokus21-research-step {
min-width: 0;
padding: 22px;
border: 1px solid var(--stop-line);
border-left: 4px solid var(--accent);
border-radius: 8px;
background: #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-step .fokus21-research-step-num {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 34px;
height: 34px;
margin-bottom: 14px;
padding: 0 8px;
border-radius: 999px;
background: var(--accent);
color: #ffffff;
font-size: 14px;
font-weight: 900;
}
.fokus21-research-step h3 {
margin: 0;
color: var(--stop-ink);
font-size: 18px !important;
line-height: 1.3;
overflow-wrap: anywhere;
}
.fokus21-research-step p {
margin: 10px 0 0;
color: var(--stop-muted);
font-size: 15px;
line-height: 1.7;
} .fokus21-research-bars {
display: grid;
gap: 16px;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fokus21-research-bars.cols-1 {
grid-template-columns: minmax(0, 1fr);
}
.fokus21-research-bars.cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fokus21-research-bar-card {
min-width: 0;
padding: 22px;
border: 1px solid var(--stop-line);
border-top: 4px solid var(--bar-accent, var(--accent));
border-radius: 8px;
background: #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-bar-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
margin-bottom: 18px;
}
.fokus21-research-bar-head h3 {
margin: 0;
color: var(--stop-ink);
font-size: 18px !important;
line-height: 1.3;
overflow-wrap: anywhere;
}
.fokus21-research-bar-head span {
flex: 0 0 auto;
padding: 4px 9px;
border-radius: 999px;
background: rgba(23, 26, 34, 0.06);
color: var(--stop-muted);
font-size: 12px;
font-weight: 800;
}
.fokus21-research-bar-list {
display: grid;
gap: 14px;
}
.fokus21-research-bar-meta {
display: flex;
justify-content: space-between;
gap: 12px;
margin-bottom: 7px;
color: var(--stop-ink);
font-size: 14px;
}
.fokus21-research-bar-meta span,
.fokus21-research-bar-meta strong {
min-width: 0;
overflow-wrap: anywhere;
}
.fokus21-research-bar-meta strong {
flex: 0 0 auto;
}
.fokus21-research-bar-track {
height: 10px;
border-radius: 999px;
background: rgba(23, 26, 34, 0.08);
overflow: hidden;
}
.fokus21-research-bar-track i {
display: block;
height: 100%;
min-width: 2px;
border-radius: 999px;
background: var(--bar-accent, var(--accent));
} .fokus21-research-ba {
display: grid;
gap: 16px;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fokus21-research-ba.cols-1 {
grid-template-columns: minmax(0, 1fr);
}
.fokus21-research-ba.cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fokus21-research-ba-card {
min-width: 0;
padding: 24px;
border: 1px solid var(--stop-line);
border-radius: 8px;
background: linear-gradient(135deg, #ffffff, var(--stop-warm)), #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-ba-card > h3 {
margin: 0 0 18px;
color: var(--stop-ink);
font-size: 18px !important;
line-height: 1.3;
}
.fokus21-research-ba-row {
display: grid;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
gap: 12px;
align-items: center;
}
.fokus21-research-ba-cell {
text-align: center;
}
.fokus21-research-ba-cell em {
display: block;
margin-bottom: 6px;
color: var(--stop-muted);
font-size: 12px;
font-style: normal;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.fokus21-research-ba-cell strong {
display: block;
color: var(--stop-ink);
font-size: 32px;
line-height: 1;
}
.fokus21-research-ba-cell.is-from strong {
color: var(--stop-muted);
}
.fokus21-research-ba-cell.is-to strong {
color: var(--accent);
}
.fokus21-research-ba-arrow {
color: var(--accent);
font-size: 24px;
font-weight: 900;
line-height: 1;
}
.fokus21-research-ba-foot {
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid var(--stop-line);
display: flex;
align-items: center;
gap: 12px;
}
.fokus21-research-ba-delta {
flex: 0 0 auto;
padding: 6px 12px;
border-radius: 999px;
background: var(--stop-green);
color: #ffffff;
font-size: 14px;
font-weight: 900;
}
.fokus21-research-ba-delta.is-down {
background: var(--stop-green);
}
.fokus21-research-ba-delta.is-up {
background: var(--accent);
}
.fokus21-research-ba-foot p {
margin: 0;
color: var(--stop-muted);
font-size: 13px;
line-height: 1.5;
} .fokus21-research-rank {
padding: 26px;
border: 1px solid var(--stop-line);
border-radius: 8px;
background: #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-rank-list {
display: grid;
gap: 16px;
}
.fokus21-research-rank-item {
display: grid;
grid-template-columns: 30px minmax(0, 1fr);
gap: 14px;
align-items: start;
}
.fokus21-research-rank-num {
display: inline-flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 8px;
background: color-mix(in srgb, var(--accent) 12%, transparent);
color: var(--accent);
font-size: 14px;
font-weight: 900;
}
.fokus21-research-rank-body {
min-width: 0;
}
.fokus21-research-rank-meta {
display: flex;
justify-content: space-between;
gap: 12px;
margin-bottom: 7px;
color: var(--stop-ink);
font-size: 15px;
font-weight: 700;
}
.fokus21-research-rank-meta strong {
flex: 0 0 auto;
color: var(--accent);
}
.fokus21-research-rank-track {
height: 10px;
border-radius: 999px;
background: rgba(23, 26, 34, 0.08);
overflow: hidden;
}
.fokus21-research-rank-track i {
display: block;
height: 100%;
min-width: 2px;
border-radius: 999px;
background: linear-gradient(90deg, var(--accent), var(--accent-dark));
} .fokus21-research-stack {
display: grid;
gap: 16px;
padding: 26px;
border: 1px solid var(--stop-line);
border-radius: 8px;
background: linear-gradient(135deg, #ffffff, var(--stop-warm)), #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-stack-row {
display: grid;
grid-template-columns: 150px minmax(0, 1fr);
gap: 14px;
align-items: center;
}
.fokus21-research-stack-title {
color: var(--stop-ink);
font-size: 14px;
font-weight: 800;
}
.fokus21-research-stack-bar {
display: flex;
min-width: 0;
height: 42px;
border-radius: 8px;
background: rgba(23, 26, 34, 0.08);
overflow: hidden;
}
.fokus21-research-stack-seg {
display: flex;
align-items: center;
justify-content: center;
min-width: 0;
color: #ffffff;
font-size: 13px;
font-weight: 800;
overflow: hidden;
}
.fokus21-research-stack-seg span {
display: block;
min-width: 28px;
padding: 0 3px;
text-align: center;
}
.fokus21-research-stack-seg.seg-0 { background: var(--stop-red); }
.fokus21-research-stack-seg.seg-1 { background: var(--stop-amber); }
.fokus21-research-stack-seg.seg-2 { background: var(--stop-green); }
.fokus21-research-legend {
display: flex;
flex-wrap: wrap;
gap: 10px 16px;
color: var(--stop-muted);
font-size: 13px;
}
.fokus21-research-legend span {
display: inline-flex;
align-items: center;
gap: 7px;
}
.fokus21-research-legend span::before {
content: "";
width: 12px;
height: 12px;
border-radius: 50%;
}
.fokus21-research-legend .lg-0::before { background: var(--stop-red); }
.fokus21-research-legend .lg-1::before { background: var(--stop-amber); }
.fokus21-research-legend .lg-2::before { background: var(--stop-green); } .fokus21-research-tablecard {
padding: 24px;
border: 1px solid var(--stop-line);
border-radius: 8px;
background: #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
}
.fokus21-research-tablecard h3 {
margin: 0 0 16px;
color: var(--stop-ink);
font-size: 19px !important;
line-height: 1.3;
}
.fokus21-research-table-wrap {
overflow-x: auto;
}
.fokus21-research-table-wrap table {
width: 100%;
min-width: 520px;
margin: 0;
border-collapse: collapse;
font-size: 14px;
}
.fokus21-research-table-wrap th,
.fokus21-research-table-wrap td {
padding: 12px 12px;
border-bottom: 1px solid rgba(23, 26, 34, 0.09);
text-align: left;
vertical-align: top;
line-height: 1.5;
}
.fokus21-research-table-wrap thead th {
background: color-mix(in srgb, var(--accent) 12%, transparent);
color: var(--stop-ink);
font-weight: 800;
}
.fokus21-research-table-wrap tbody tr:last-child th,
.fokus21-research-table-wrap tbody tr:last-child td {
border-bottom: 0;
}
.fokus21-research-pill {
display: inline-flex;
padding: 3px 10px;
border-radius: 999px;
background: color-mix(in srgb, var(--stop-green) 16%, transparent);
color: var(--stop-green);
font-size: 12px;
font-weight: 800;
} .fokus21-research-quote {
position: relative;
padding: 30px 34px;
border-radius: 8px;
border-left: 5px solid var(--accent);
background: linear-gradient(135deg, #ffffff, var(--stop-warm)), #ffffff;
box-shadow: 0 14px 32px rgba(23, 26, 34, 0.06);
overflow: hidden;
}
.fokus21-research-quote::before {
content: "\201C";
position: absolute;
top: 4px;
right: 24px;
color: color-mix(in srgb, var(--accent) 14%, transparent);
font-size: 96px;
line-height: 1;
}
.fokus21-research-quote .fokus21-research-quote-tag {
display: inline-flex;
position: relative;
z-index: 1;
margin-bottom: 14px;
padding: 5px 10px;
border-radius: 999px;
background: color-mix(in srgb, var(--accent) 12%, transparent);
color: var(--accent);
font-size: 12px;
font-weight: 900;
}
.fokus21-research-quote blockquote {
position: relative;
z-index: 1;
margin: 0;
color: var(--stop-ink);
font-size: 20px;
font-weight: 700;
line-height: 1.5;
overflow-wrap: anywhere;
}
.fokus21-research-quote p {
position: relative;
z-index: 1;
margin: 14px 0 0;
color: var(--stop-muted);
font-size: 15px;
line-height: 1.7;
} @media (max-width: 1100px) {
.fokus21-research-hero {
grid-template-columns: 1fr;
}
.fokus21-research-metrics,
.fokus21-research-metrics.cols-3 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fokus21-research-cards,
.fokus21-research-steps,
.fokus21-research-cards.cols-4,
.fokus21-research-bars.cols-3 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 782px) {
.fokus21-research-hero {
padding: 24px;
gap: 20px;
}
.fokus21-research-hero .entry-title {
font-size: 30px !important;
}
.fokus21-research-hero p.fokus21-research-lead {
font-size: 16px;
}
.fokus21-research-hero-aside {
padding: 18px;
}
.fokus21-research-head h2 {
font-size: 24px !important;
}
.fokus21-research-callout {
padding: 22px;
}
.fokus21-research-callout h2 {
font-size: 20px !important;
}
.fokus21-research-metrics,
.fokus21-research-metrics.cols-2,
.fokus21-research-metrics.cols-3,
.fokus21-research-cards,
.fokus21-research-cards.cols-2,
.fokus21-research-cards.cols-4,
.fokus21-research-steps,
.fokus21-research-steps.cols-2,
.fokus21-research-bars,
.fokus21-research-bars.cols-3,
.fokus21-research-ba,
.fokus21-research-ba.cols-3 {
grid-template-columns: 1fr;
}
.fokus21-research-stack-row {
grid-template-columns: 1fr;
gap: 8px;
}
.fokus21-research-rank,
.fokus21-research-stack,
.fokus21-research-tablecard,
.fokus21-research-card,
.fokus21-research-step,
.fokus21-research-bar-card,
.fokus21-research-ba-card,
.fokus21-research-quote {
padding: 18px;
}
.fokus21-research-quote blockquote {
font-size: 18px;
}
.fokus21-research-table-wrap table {
min-width: 460px;
}
}
@media (max-width: 520px) {
.fokus21-research-metric {
min-height: 0;
}
.fokus21-research-metric strong {
font-size: 30px;
}
.fokus21-research-bar-head,
.fokus21-research-bar-meta {
display: block;
}
.fokus21-research-bar-head span {
display: inline-flex;
margin-top: 8px;
}
.fokus21-research-bar-meta strong {
display: inline-block;
margin-top: 4px;
}
.fokus21-research-ba-cell strong {
font-size: 26px;
}
.fokus21-research-ba-foot {
flex-direction: column;
align-items: flex-start;
}
.fokus21-research-stack-bar {
height: 36px;
}
.fokus21-research-stack-seg {
font-size: 11px;
}
.fokus21-research-hero-aside li {
grid-template-columns: 1fr;
gap: 2px;
}
}