@layer components{[data-context=project] .hero{max-height:30.3125rem;overflow:hidden}[data-context=project] .hero .hero-image{width:100%;height:30.3125rem;-o-object-fit:cover;object-fit:cover;display:block}[data-context=project] .layout{display:grid!important;grid-template-columns:1fr!important;gap:var(--space-10)}@media screen and (min-width:1024px){[data-context=project] .layout{grid-template-columns:repeat(12,1fr)!important;gap:0 var(--column-gutter)}}@media screen and (min-width:1024px){[name=ProjectDetail]{grid-column:8 / 13;padding-block-start:var(--space-24)}}[name=ProjectDetail] .sidebar{display:flex;flex-direction:column;gap:var(--space-10)}[name=ProjectDetail] .section{display:flex;flex-direction:column}[name=ProjectDetail] .section-title{font-size:var(--font-h5);font-weight:var(--font-weight-medium);line-height:var(--line-height-h5);margin-block-start:0;margin-block-end:var(--space-4)}[name=ProjectDetail] .details{display:flex;flex-direction:column;gap:var(--space-1)}[name=ProjectDetail] .detail-row{display:grid;grid-template-columns:10rem 1fr;gap:var(--space-4)}[name=ProjectDetail] .detail-row dt{font-weight:var(--font-weight-semibold);font-size:var(--font-base);line-height:var(--line-height-base)}[name=ProjectDetail] .detail-row dd{font-size:var(--font-base);line-height:var(--line-height-base)}[name=ProjectDetail] .tags{display:flex;flex-wrap:wrap;gap:var(--space-2);list-style:none;padding:0;margin:0}[name=ProjectDetail] .tag{display:inline-flex;align-items:center;padding:var(--space-2) var(--space-6);border:1.5px solid var(--color-text);font-size:var(--font-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-base);letter-spacing:.8px;white-space:nowrap}[name=ProjectDetail] .companies{display:flex;flex-direction:column;list-style:none;padding:0;margin:0}[name=ProjectDetail] .company-link{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) 0;font-size:var(--font-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-base);letter-spacing:.8px;color:var(--color-text);text-decoration:none;transition:color var(--transition-speed) var(--transition-timing-function)}[name=ProjectDetail] .company-link svg{flex-shrink:0;width:1.5rem;height:1.5rem}[name=ProjectDetail] .company-link:hover,[name=ProjectDetail] .company-link:focus-visible{color:var(--color-accent)}}