.experiments-page { max-width: 1180px; margin: 0 auto; padding: 36px 24px 80px; }
.xp-head { margin: 8px 0 28px; }
.xp-head h1 { font-size: clamp(32px, 5vw, 54px); line-height: 1.04; letter-spacing: -.02em; margin: 6px 0 10px; }
.xp-head .lede { max-width: 56ch; opacity: .8; font-size: 17px; }
.xp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.xp-card { display: flex; flex-direction: column; gap: 6px; color: inherit; text-decoration: none; min-width: 0; }
.xp-card.xp-lead { grid-column: 1 / -1; }
.xp-art { position: relative; display: block; border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 10; background: #241f2b; }
.xp-lead .xp-art { aspect-ratio: 2.05; }
.xp-art img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.xp-card:hover .xp-art img, .xp-card:focus-visible .xp-art img { transform: scale(1.03); }
.xp-new { position: absolute; left: 12px; top: 12px; background: #ff8fb8; color: #2a1020; font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; }
.xp-meta { margin-top: 8px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; opacity: .65; }
.xp-title { font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.xp-lead .xp-title { font-size: 30px; }
.xp-text { opacity: .8; }
@media (max-width: 860px) { .xp-grid { grid-template-columns: 1fr; } .experiments-page { padding: 24px 16px 60px; } }