@layer addon { .templateCollection.collectionFaq { @media (min-width: 56em) { .inner { grid-template-columns: repeat(12, 1fr); display: grid; grid-column: span 12; .intro { grid-column: 1 / span 5; } .grid { grid-column: 6 / span 7; } } } @media (--min-fablet) { .inner { grid-template-columns: repeat(12, 1fr); display: grid; grid-column: span 12; .intro { grid-column: 1 / span 5; } .grid { grid-column: 6 / span 7; } } } } }