/* OAN Marketplace layout rules.
   These utilities are used by the marketplace blocks but may be purged from the
   prebuilt tailwind-compiled.css (the page did not exist at build time), so we
   define the responsive grid explicitly and scoped to the marketplace blocks. */

/* Browse layout: sidebar + listing area */
.oan-mkt-grid .oan-mkt-layout { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); }
.oan-mkt-grid .oan-mkt-cards  { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); }

@media (min-width: 640px) {
    .oan-mkt-grid .oan-mkt-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .oan-mkt-grid .oan-mkt-layout { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .oan-mkt-grid .oan-mkt-aside  { grid-column: span 3 / span 3; }
    .oan-mkt-grid .oan-mkt-main   { grid-column: span 9 / span 9; }
}

@media (min-width: 1280px) {
    .oan-mkt-grid .oan-mkt-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Hero: restore utilities purged from the prebuilt tailwind-compiled.css */
.oan-mkt-hero { padding-bottom: 3rem; }                 /* pb-12 */
.oan-mkt-hero .oan-mkt-arrow { display: none; align-items: center; justify-content: center; }
@media (min-width: 768px) {
    .oan-mkt-hero { padding-bottom: 3.5rem; }           /* md:pb-14 */
    .oan-mkt-hero .oan-mkt-arrow { display: flex; }     /* md:flex */
}
