@layer master {
    .search {
        .templateContent {
            .container {
                
                /*Voor de zoekpagina*/
                [x-data="searchData"]& {
                    .inner {
                        @media (min-width: 56em) {
                            grid-column: 4 / span 6;
                        }
                        @media (--min-fablet) {
                            grid-column: 4 / span 6;
                        }
                    }
                }
                .results {
                    grid-column: 2 / span 10;
                    display: flex;
                    flex-direction: column;
                    gap: var(--section);
                    padding-top: var(--padding);
                    .result {
                        display: flex;
                        flex-direction: column;
                        gap: var(--gutter);
                    }
                    .content {
                        display: flex;
                        flex-wrap: wrap;
                        gap: var(--gutter);
                        .item {
                            flex: 0 calc(100%/3 - var(--gutter));
                        }
                    }
                }
            }
            
        }
    }
}