.tiles-icon-text {
padding: var(--space-3xl) 0;
}
.tiles-icon-text .row {
justify-content: center;
}
.tiles-icon-text .row .col-tiles {
margin-bottom: var(--space-xl);
}
.tile {
background: var(--color-sable);
border-radius: var(--border-radius);
padding: var(--space-xl);
height: 100%;
}
.tile-icon {
margin-bottom: var(--space-lg);
}
.tile-icon img {
width: 60px;
height: 60px;
object-fit: contain;
}
.tile-title {
font-size: var(--font-size-lg);
font-weight: var(--font-weight-bold);
margin-bottom: var(--space-md);
color: var(--color-primary);
}
.tile-content p {
margin-bottom: var(--space-sm);
}
.tile-content p a {
color: var(--color-primary);
text-decoration: none;
display: inline-block;
align-items: center;
gap: 6px;
transition: var(--transition);
margin-top: var(--space-sm);
&:hover {
opacity: 0.8;
color: var(--color-accent);
}
}
.tile-content p:last-child {
margin-bottom: 0;
}  @media screen and (max-width: 1024px) {
.tiles-icon-text {
padding: var(--space-2xl) 0;
}
.tiles-icon-text .row .col-tiles {
margin-bottom: var(--space-lg);
}
} @media screen and (max-width: 768px) {
.tiles-icon-text {
padding: var(--space-xl) 0;
}
.tile {
padding: var(--space-lg);
}
.tile-icon {
margin-bottom: var(--space-md);
}
.tile-icon img {
width: 50px;
height: 50px;
}
.tile-title {
margin-bottom: var(--space-sm);
}
} @media screen and (max-width: 480px) {
.tiles-icon-text {
padding: var(--space-lg) 0;
}
.tiles-icon-text .row .col-tiles {
margin-bottom: var(--space-md);
}
.tile {
padding: var(--space-md);
}
.tile-icon img {
width: 45px;
height: 45px;
}
}