.arch-home #bloq {
    --blog-ink: #271f19;
    --blog-accent: #765136;
    --blog-line: #76513640;
    background:
        radial-gradient(ellipse at 88% 10%, #faf5ed, transparent 63%),
        repeating-linear-gradient(115deg, #76513608 0 1px, transparent 1px 7px),
        #e9dfd0;
    color: var(--blog-ink);
    padding-block: clamp(44px, 6vw, 88px);
}
.arch-home #bloq .arch-heading {
    gap: clamp(12px, 2vw, 28px);
    margin-bottom: clamp(24px, 3vw, 44px);
}
.arch-home #bloq .arch-heading::after { background: var(--blog-line); }
.arch-home #bloq .arch-heading h2 { color: var(--blog-ink); }
.arch-home #bloq .arch-heading .arch-link {
    color: var(--blog-accent);
    border-bottom: 1px solid var(--blog-line);
    padding-block: 8px;
}
.arch-home #bloq .arch-heading .arch-link:hover { color: var(--blog-ink); }

.arch-home #bloq .arch-articles {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
    grid-auto-rows: min-content;
    align-items: start;
    gap: clamp(14px, 2vw, 24px) clamp(24px, 4vw, 60px);
}
.arch-home #bloq .arch-articles > a { color: var(--blog-ink); min-width: 0; }
.arch-home #bloq .arch-articles > a:hover { color: var(--blog-accent); }
.arch-home #bloq .arch-articles > :first-child {
    grid-row: span 2;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--blog-line);
}
.arch-home #bloq .arch-articles > :first-child:only-child {
    grid-column: 1 / -1;
    max-width: 900px;
}
.arch-home #bloq .arch-articles > :first-child .arch-frame {
    aspect-ratio: 16 / 10;
    clip-path: polygon(0 0, 93% 0, 100% 13%, 100% 100%, 0 100%);
}
.arch-home #bloq .arch-articles > :not(:first-child) {
    display: grid;
    grid-template-columns: minmax(90px, 38%) minmax(0, 1fr);
    align-items: center;
    gap: clamp(12px, 1.5vw, 22px);
    padding-bottom: clamp(14px, 2vw, 24px);
    border-bottom: 1px solid var(--blog-line);
}
.arch-home #bloq .arch-articles > :nth-child(2) .arch-frame {
    aspect-ratio: 5 / 4;
    border-radius: 44% 44% 0 0 / 30% 30% 0 0;
}
.arch-home #bloq .arch-articles > :nth-child(3) .arch-frame {
    aspect-ratio: 5 / 4;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%, 0 82%);
}
.arch-home #bloq .arch-caption {
    gap: 10px;
    font-size: clamp(.9rem, 1.15vw, 1.16rem);
    line-height: 1.4;
    overflow-wrap: anywhere;
}
.arch-home #bloq .arch-articles > :first-child .arch-caption {
    font-size: clamp(1.15rem, 2vw, 2rem);
    letter-spacing: -.03em;
    padding-top: 16px;
}
.arch-home #bloq .arch-caption > span:last-child { color: var(--blog-accent); }
.arch-home #bloq a:focus-visible { outline: 2px solid var(--blog-accent); outline-offset: 4px; }

@media (max-width: 760px) {
    .arch-home #bloq .arch-articles { grid-template-columns: minmax(0, 1fr); }
    .arch-home #bloq .arch-articles > :first-child { grid-row: auto; }
}

/* Arch.az: compact homepage blog */
.arch-home #bloq {
    padding-block: clamp(30px, 3.5vw, 58px);
}
.arch-home #bloq .arch-heading {
    margin-bottom: clamp(16px, 2vw, 28px);
}
.arch-home #bloq .arch-articles {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
    gap: clamp(14px, 2vw, 26px) clamp(20px, 3vw, 46px);
}
.arch-home #bloq .arch-articles > :first-child .arch-frame {
    aspect-ratio: 16 / 9;
    max-height: 460px;
}
.arch-home #bloq .arch-articles > :not(:first-child) {
    grid-template-columns: minmax(0, 29%) minmax(0, 1fr);
    padding-bottom: 14px;
}
.arch-home #bloq .arch-articles > :not(:first-child) .arch-frame {
    max-height: 155px;
}
.arch-home #bloq .arch-articles > :first-child .arch-caption {
    font-size: clamp(1.05rem, 1.45vw, 1.5rem);
    padding-top: 12px;
}
@media (max-width: 760px) {
    .arch-home #bloq .arch-articles {
        grid-template-columns: minmax(0, 1fr);
    }
}