.bohemista-section {
width: 100%;
max-width: 980px;
margin: 0 auto 38px;
box-sizing: border-box;
font-family: inherit;
color: #1f2933;
}
.bohemista-section *,
.bohemista-section *::before,
.bohemista-section *::after {
box-sizing: border-box;
}
.bohemista-section__header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
margin-bottom: 14px;
padding: 0 0 9px;
border-bottom: 3px solid #0f766e;
}
.bohemista-section__title {
margin: 0;
font-size: clamp(1.25rem, 1.8vw, 1.55rem);
line-height: 1.15;
font-weight: 800;
letter-spacing: -.02em;
color: #17202a;
}
.bohemista-section__all {
flex: 0 0 auto;
color: #0f766e;
text-decoration: none;
font-size: .86rem;
font-weight: 750;
}
.bohemista-section__all:hover,
.bohemista-section__all:focus-visible {
text-decoration: underline;
text-underline-offset: 3px;
}
.bohemista-section__content {
background: transparent;
} .bohemista-section__featured {
margin: 0;
padding: 0 0 14px;
border-bottom: 1px solid #dfe5e8;
}
.bohemista-section__featured-link,
.bohemista-section__item-link {
color: inherit;
text-decoration: none;
}
.bohemista-section__featured-link {
display: grid;
grid-template-columns: minmax(220px, 36%) minmax(0, 1fr);
gap: 22px;
align-items: center;
}
.bohemista-section__image-wrap {
position: relative;
overflow: hidden;
width: 100%;
aspect-ratio: 16 / 9;
margin: 0;
background: #edf2f3;
border-radius: 7px;
}
.bohemista-section__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .22s ease;
}
.bohemista-section__featured-link:hover .bohemista-section__image {
transform: scale(1.018);
}
.bohemista-section__featured-body {
min-width: 0;
padding-right: 4px;
}
.bohemista-section__featured-title {
margin: 0;
font-size: clamp(1.25rem, 2.1vw, 1.72rem);
line-height: 1.16;
font-weight: 800;
letter-spacing: -.025em;
color: #17202a;
}
.bohemista-section__featured-link:hover .bohemista-section__featured-title,
.bohemista-section__item-link:hover .bohemista-section__item-title {
color: #0f766e;
}
.bohemista-section__excerpt {
margin: 8px 0 0;
color: #5b6570;
font-size: .95rem;
line-height: 1.48;
}
.bohemista-section__date {
display: block;
margin-top: 7px;
color: #7b858e;
font-size: .76rem;
line-height: 1.25;
font-variant-numeric: tabular-nums;
} .bohemista-section__item {
margin: 0;
padding: 0;
border-bottom: 1px solid #e6eaec;
}
.bohemista-section__item:last-child {
border-bottom: 0;
}
.bohemista-section__item-link {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 10px 2px;
}
.bohemista-section__item-main {
min-width: 0;
}
.bohemista-section__item-title {
margin: 0;
font-size: .98rem;
line-height: 1.32;
font-weight: 700;
color: #26313a;
transition: color .15s ease;
}
.bohemista-section__item .bohemista-section__date {
margin-top: 3px;
}
.bohemista-section__arrow {
flex: 0 0 auto;
color: #9aa3aa;
font-size: .95rem;
transition: transform .15s ease, color .15s ease;
}
.bohemista-section__item-link:hover .bohemista-section__arrow {
color: #0f766e;
transform: translateX(2px);
}
@media (max-width: 720px) {
.bohemista-section {
margin-bottom: 32px;
}
.bohemista-section__header {
margin-bottom: 12px;
}
.bohemista-section__featured-link {
grid-template-columns: 39% minmax(0, 1fr);
gap: 14px;
align-items: start;
}
.bohemista-section__featured-title {
font-size: 1.15rem;
}
.bohemista-section__excerpt {
display: none;
}
}
@media (max-width: 500px) {
.bohemista-section__featured-link {
grid-template-columns: 118px minmax(0, 1fr);
gap: 12px;
}
.bohemista-section__image-wrap {
border-radius: 6px;
}
.bohemista-section__featured-title {
font-size: 1.02rem;
line-height: 1.22;
}
.bohemista-section__item-link {
padding: 9px 0;
}
.bohemista-section__item-title {
font-size: .94rem;
}
}