@layer page{main{ #intro { display: grid; grid-template-columns: 1fr; @media (width >= 48em) { grid-template-columns: 1fr 1fr; } gap: var(--size-6); img { align-self: center; box-shadow: none; } } .team { display: grid; grid-template-columns: 1fr; @media (width >= 48em) { grid-template-columns: 1fr 1fr; } @media (width >= 64em) { grid-template-columns: 1fr 1fr 1fr; } gap: var(--size-6); .person { display: grid; grid-template-columns: 1fr 1fr; gap: var(--size-6); img { width: 100%; height: auto; } .photo { text-align: center; } .info { display: flex; flex-direction: column; gap: var(--size-4); } .summary { line-height: 1.2; } .name { font-size: var(--text-xl); font-weight: bold; } .profile a { font-weight: bold; text-decoration: underline; } } }}}