.shop-links-section {
color: #111;
padding: clamp(3rem, 7vw, 5rem) 0;
}

.shop-links-heading {
width: min(900px, calc(100% - 2rem));
margin: 0 auto 2.25rem;
text-align: center;
}

.section-kicker {
margin: 0 0 .75rem;
font-family: 'Courier New', monospace;
font-size: .75rem;
letter-spacing: .16em;
text-transform: uppercase;
color: rgba(0,0,0,.45);
}

.shop-links-heading h2 {
margin: 0;
font-family: 'Pretzel', sans-serif;
font-size: clamp(2.4rem, 7vw, 6rem);
line-height: .9;
text-transform: uppercase;
font-weight: normal;
}

.shop-links-heading p:last-child {
max-width: 620px;
margin: 1rem auto 0;
color: rgba(0,0,0,.62);
line-height: 1.6;
}

.shop-split-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
width: min(1500px, calc(100% - 2rem));
margin: 0 auto;
min-height: clamp(420px, 55vw, 620px);
border-radius: 28px;
overflow: hidden;
background: #111;
box-shadow: 0 30px 80px rgba(0,0,0,.14);
}

.shop-split-card {
position: relative;
display: flex;
align-items: flex-end;
min-height: 100%;
overflow: hidden;
isolation: isolate;
border-right: 1px solid rgba(255,255,255,.14);
}

.shop-split-card:last-child {
border-right: 0;
}

.shop-split-card img {
position: absolute;
inset: 0;
z-index: -2;
width: 100%;
height: 100%;
object-fit: cover;
filter: grayscale(0) contrast(1.05) brightness(.95);
transform: scale(1.02);
transition:
filter .55s ease,
transform .75s ease;
}

.shop-split-card::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background:
linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.82)),
radial-gradient(circle at center, rgba(255,255,255,.08), transparent 55%);
opacity: .9;
transition: opacity .45s ease;
}

.shop-split-overlay {
width: 100%;
padding: clamp(1rem, 2vw, 1.5rem);
color: #fff;
transform: translateY(.6rem);
transition: transform .45s ease;
}

.shop-split-overlay span {
display: inline-block;
margin-bottom: .75rem;
font-family: 'Courier New', monospace;
font-size: .72rem;
letter-spacing: .16em;
color: rgba(255,255,255,.58);
}

.shop-split-overlay h3 {
margin: 0;
font-family: 'Pretzel', sans-serif;
font-size: clamp(2.2rem, 4vw, 4.6rem);
line-height: .86;
text-transform: uppercase;
font-weight: normal;
}

.shop-split-overlay p {
max-width: 260px;
margin: .8rem 0 0;
font-size: .9rem;
line-height: 1.45;
color: rgba(255,255,255,.68);
opacity: 0;
transform: translateY(.5rem);
transition:
opacity .35s ease,
transform .35s ease;
}

.shop-split-card:hover img {
filter: grayscale(0) contrast(1.05) brightness(.95);
transform: scale(1.1);
}

.shop-split-card:hover::before {
opacity: .62;
}

.shop-split-card:hover .shop-split-overlay {
transform: translateY(0);
}

.shop-split-card:hover .shop-split-overlay p {
opacity: 1;
transform: translateY(0);
}

.shop-split-card:hover .shop-split-overlay span {
color: #d9ff3f;
}

@media (min-width: 901px) {

.shop-split-grid:hover .shop-split-card {
opacity: .72;
transition: opacity .35s ease, flex .45s ease;
}

.shop-split-grid:hover .shop-split-card img {
filter: grayscale(1) contrast(1.1) brightness(.7);
}

.shop-split-grid:hover .shop-split-card:hover {
opacity: 1;
}

.shop-split-grid:hover .shop-split-card:hover img {
filter: grayscale(0) contrast(1.05) brightness(.95);
}

}

@media (max-width: 900px) {

.shop-split-grid {
grid-template-columns: repeat(2, 1fr);
min-height: auto;
}

.shop-split-card {
min-height: 420px;
}

}

@media (max-width: 560px) {

.shop-links-section {
padding-top: 3rem;
}

.shop-split-grid {
grid-template-columns: 1fr;
width: calc(100% - 1rem);
border-radius: 22px;
}

.shop-split-card {
min-height: 340px;
border-right: 0;
border-bottom: 1px solid rgba(255,255,255,.14);
}

.shop-split-card:last-child {
border-bottom: 0;
}

.shop-split-overlay p {
opacity: 1;
transform: none;
}

}