body { background: #0e0e0e; }
.idk-project { max-width: 1200px; margin: auto; padding: clamp(140px, 18vh, 210px) max(24px, 4vw) 6rem; color: #f0e9dd; }
.idk-project-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.idk-project-art { width: 100%; max-height: 620px; object-fit: cover; box-shadow: 0 20px 60px #000a; border: 1px solid #a58b5266; }
.idk-project h1 { font: clamp(3rem, 6vw, 5.5rem)/1.1 'Cormorant Garamond', serif; margin: 1.5rem 0; }
.idk-project p { font: 1.2rem/1.8 'Crimson Pro', serif; color: #d2c8b8; }
.idk-project .idk-project-label { font: .7rem Inter, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #bca379; }
.idk-project-platforms { margin-top: 4rem; padding-top: 2rem; border-top: 1px solid #ffffff25; }
.idk-project-platforms h2 { font: 2rem 'Cormorant Garamond', serif; }
.idk-project-platforms ul { display: flex; gap: 1.5rem; flex-wrap: wrap; padding: 0; list-style: none; }
.idk-project-platforms li { border: 1px solid #bca37966; padding: .8rem 1.4rem; font: .85rem Inter, sans-serif; }
.idk-project a { color: #e4d1aa; }
.idk-project a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
@media (max-width: 700px) { .idk-project-hero { grid-template-columns: 1fr; } .idk-project-art { max-height: 45svh; } }