Shop
* { margin: 0; padding: 0; box-sizing: border-box; }
.kw { background: #0a0a0a; color: #e8e4dc; font-family: ‘Cormorant Garamond’, serif; width: 100%; }
.kw a { text-decoration: none; }
.k-nav { display: flex; justify-content: space-between; align-items: center; padding: 1.25rem 3rem; border-bottom: 0.5px solid rgba(232,228,220,0.15); }
.k-nav-logo { font-family: ‘Space Mono’, monospace; font-size: 13px; letter-spacing: 0.3em; color: #e8e4dc; text-transform: uppercase; }
.k-nav-links { display: flex; gap: 2rem; list-style: none; }
.k-nav-links a { font-family: ‘Space Mono’, monospace; font-size: 10px; letter-spacing: 0.2em; color: rgba(232,228,220,0.5); text-transform: uppercase; }
.k-nav-links a:hover, .k-nav-links a.active { color: #e8e4dc; }
.k-page-header { padding: 2rem 3rem 1.25rem; border-bottom: 0.5px solid rgba(232,228,220,0.1); display: flex; justify-content: space-between; align-items: flex-end; }
.k-page-title { font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 300; letter-spacing: -0.02em; line-height: 1; }
.k-page-tag { font-family: ‘Space Mono’, monospace; font-size: 9px; letter-spacing: 0.3em; color: rgba(232,228,220,0.3); text-transform: uppercase; padding-bottom: 0.4rem; }
.k-filter-bar { padding: 1rem 3rem; display: flex; gap: 0.75rem; align-items: center; border-bottom: 0.5px solid rgba(232,228,220,0.1); }
.k-filter-btn { font-family: ‘Space Mono’, monospace; font-size: 9px; letter-spacing: 0.15em; text-transform: uppercase; padding: 5px 14px; border: 0.5px solid rgba(232,228,220,0.2); background: transparent; color: rgba(232,228,220,0.5); cursor: pointer; }
.k-filter-btn.active { background: #e8e4dc; color: #0a0a0a; border-color: #e8e4dc; }
.k-featured-product { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 0.5px solid rgba(232,228,220,0.1); }
.k-feat-media { width: 100%; aspect-ratio: 1; background: #1a1a1a; border-right: 0.5px solid rgba(232,228,220,0.1); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.k-feat-media img { width: 100%; height: 100%; object-fit: cover; }
.k-feat-media span { font-family: ‘Space Mono’, monospace; font-size: 9px; color: rgba(232,228,220,0.2); letter-spacing: 0.15em; }
.k-feat-info { padding: 2.5rem; display: flex; flex-direction: column; gap: 1rem; justify-content: center; }
.k-feat-tag { font-family: ‘Space Mono’, monospace; font-size: 9px; letter-spacing: 0.3em; color: rgba(232,228,220,0.3); text-transform: uppercase; }
.k-feat-title { font-size: 2rem; font-weight: 300; color: #e8e4dc; line-height: 1.2; }
.k-feat-desc { font-size: 1rem; font-weight: 300; color: rgba(232,228,220,0.6); line-height: 1.7; font-style: italic; }
.k-feat-price { font-family: ‘Space Mono’, monospace; font-size: 1.1rem; color: #e8e4dc; letter-spacing: 0.1em; }
.k-feat-badge { font-family: ‘Space Mono’, monospace; font-size: 8px; letter-spacing: 0.1em; color: rgba(232,228,220,0.5); text-transform: uppercase; padding: 3px 10px; border: 0.5px solid rgba(232,228,220,0.2); display: inline-block; width: fit-content; }
.k-btn { font-family: ‘Space Mono’, monospace; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; padding: 11px 24px; background: #e8e4dc; color: #0a0a0a; border: none; cursor: pointer; display: inline-block; width: fit-content; }
.k-shop-section { padding: 2rem 3rem; border-bottom: 0.5px solid rgba(232,228,220,0.1); }
.k-label { font-family: ‘Space Mono’, monospace; font-size: 9px; letter-spacing: 0.3em; color: rgba(232,228,220,0.3); text-transform: uppercase; margin-bottom: 1.25rem; }
.k-products-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.k-product-card { display: flex; flex-direction: column; gap: 0.6rem; cursor: pointer; transition: opacity 0.3s; }
.k-product-card:hover { opacity: 0.75; }
.k-product-media { width: 100%; aspect-ratio: 1; background: #1a1a1a; border: 0.5px solid rgba(232,228,220,0.08); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.k-product-media img { width: 100%; height: 100%; object-fit: cover; }
.k-product-media span { font-family: ‘Space Mono’, monospace; font-size: 8px; color: rgba(232,228,220,0.2); letter-spacing: 0.1em; }
.k-product-name { font-size: 1rem; font-weight: 400; color: #e8e4dc; }
.k-product-type { font-family: ‘Space Mono’, monospace; font-size: 8px; letter-spacing: 0.1em; color: rgba(232,228,220,0.35); text-transform: uppercase; }
.k-product-price { font-family: ‘Space Mono’, monospace; font-size: 0.85rem; color: rgba(232,228,220,0.7); }
.k-village-section { display: grid; grid-template-columns: 1.5fr 1fr; border-bottom: 0.5px solid rgba(232,228,220,0.1); }
.k-village-left { padding: 2.5rem 3rem; border-right: 0.5px solid rgba(232,228,220,0.1); display: flex; flex-direction: column; gap: 1rem; }
.k-village-right { padding: 2.5rem 3rem; display: flex; flex-direction: column; gap: 0.75rem; justify-content: center; }
.k-village-title { font-size: 1.8rem; font-weight: 300; color: #e8e4dc; line-height: 1.2; }
.k-village-desc { font-size: 1rem; font-weight: 300; color: rgba(232,228,220,0.6); line-height: 1.7; font-style: italic; }
.k-perk { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 0.5px solid rgba(232,228,220,0.07); }
.k-perk-dot { width: 4px; height: 4px; background: rgba(232,228,220,0.4); border-radius: 50%; flex-shrink: 0; }
.k-perk-text { font-size: 0.95rem; color: rgba(232,228,220,0.65); }
.k-footer { padding: 1.5rem 3rem; display: flex; justify-content: space-between; align-items: center; }
.k-footer-logo { font-family: ‘Space Mono’, monospace; font-size: 10px; letter-spacing: 0.3em; color: rgba(232,228,220,0.3); }
.k-footer-links { display: flex; gap: 1.5rem; list-style: none; }
.k-footer-links a { font-family: ‘Space Mono’, monospace; font-size: 9px; letter-spacing: 0.2em; color: rgba(232,228,220,0.3); text-transform: uppercase; }
@media (max-width: 768px) {
.k-nav { padding: 1rem 1.5rem; } .k-nav-links { gap: 1rem; }
.k-featured-product { grid-template-columns: 1fr; }
.k-feat-media { border-right: none; border-bottom: 0.5px solid rgba(232,228,220,0.1); }
.k-products-grid { grid-template-columns: repeat(2, 1fr); }
.k-village-section { grid-template-columns: 1fr; }
.k-village-left { border-right: none; border-bottom: 0.5px solid rgba(232,228,220,0.1); padding: 1.5rem; }
.k-village-right { padding: 1.5rem; }
.k-shop-section { padding: 1.5rem; }
.k-footer { padding: 1rem 1.5rem; flex-direction: column; gap: 1rem; }
}
Shop
Music · Books · Art · Merch
The latest single from KALEEM. Support the work directly.
Music · Single
The Village is for those who believe in the work before it’s finished. Get closer access, exclusive content, and become part of what KALEEM is building.