.marielco-journal { --marielco-journal-gutter: 18px; width: 100%; padding-bottom: 80px; color: #242424; font-size: 15px; line-height: 1.6; }
.marielco-journal__masthead {
	padding: 32px var(--marielco-journal-gutter) 32px;
	border-bottom: 1px solid #e5e5e5;
}
.marielco-journal__breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
	color: #767676;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .08em;
	line-height: 1.4;
	text-transform: uppercase;
}
.marielco-journal__title-row h1 {
	margin: 0;
	font-size: 28px;
	font-weight: 400;
	letter-spacing: -.02em;
	line-height: 1.1;
}
.marielco-journal__toolbar {
	position: sticky;
	top: var(--marielco-header-height);
	z-index: calc(var(--marielco-z-header) - 1);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0 24px;
	min-height: 58px;
	padding: 8px var(--marielco-journal-gutter);
	border-bottom: 1px solid #e5e5e5;
	background: #fff;
}
.marielco-journal__controls { display: flex; align-items: center; flex-wrap: wrap; gap: 0 24px; }
.marielco-journal__filter-trigger,
.marielco-journal__filter-trigger:is(:hover,:focus,:active) { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #111; font-size: 11px; font-weight: 400; letter-spacing: .11em; text-transform: uppercase; transition: opacity 150ms ease; }
.marielco-journal__filter-trigger svg,
.marielco-journal__clear-icon svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.marielco-journal__filter-trigger:active { opacity: .5; }
.marielco-journal__filter-count { color: #767676; font-size: inherit; }
.marielco-journal__active-filter { overflow-wrap: anywhere; display: inline-flex; align-items: center; min-height: 44px; color: #666; font-size: 11px; letter-spacing: .07em; text-transform: uppercase; }
.marielco-journal__clear-icon { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; color: #767676; transition: color 150ms ease; }
.marielco-journal__active-filter:is(:hover,:focus-visible) .marielco-journal__clear-icon { color: #111; }
.marielco-journal__fallback-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; font-size: 12px; }
.marielco-journal__count {
	margin: 0;
	color: #767676;
	font-size: 12px;
	letter-spacing: .08em;
	line-height: 1.4;
	text-transform: uppercase;
	white-space: nowrap;
}
.marielco-journal__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	column-gap: 2px;
	row-gap: 8px;
	padding-inline: 2px;
}
.marielco-journal__empty { padding: 96px var(--marielco-journal-gutter); text-align: center; }
.marielco-journal__empty h2 { margin-bottom: 16px; font-size: 24px; font-weight: 400; line-height: 1.4; }
.marielco-journal__empty p { margin-bottom: 24px; color: #767676; }
.marielco-journal__pagination { margin-top: 64px; padding: 32px var(--marielco-journal-gutter) 0; border-top: 1px solid #e5e5e5; }
.marielco-journal__pagination ul { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 24px; margin: 0; padding: 0; list-style: none; }
.marielco-journal__pagination .page-numbers { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.marielco-journal__pagination .current { background: none; padding-bottom: 4px; border-bottom: 1px solid currentColor; }

/* Native left filter dialog using Shop's visual language. */

.marielco-journal-filter[open] { transform: none; transition: transform 250ms ease; display: flex; flex-direction: column; width: min(420px,92vw); padding: 0; border: 0; overflow: hidden; }
.marielco-journal-filter__header { display: grid; grid-template-columns: minmax(0,1fr) 44px; align-items: center; gap: 12px; flex: 0 0 62px; padding: 0 18px; border-bottom: 1px solid #e5e5e5; }
.marielco-journal-filter__header h2 { margin: 0; font-size: 10px; font-weight: 400; line-height: 1.4; letter-spacing: .11em; text-transform: uppercase; }
.marielco-journal-filter__close,
.marielco-journal-filter__close:is(:hover,:focus,:active) { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #111; transition: opacity 150ms ease; }
.marielco-journal-filter__close svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; }
.marielco-journal-filter__close:hover { opacity: .58; }
.marielco-journal-filter__form { display: flex; flex: 1; flex-direction: column; min-height: 0; margin: 0; }
.marielco-journal-filter__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 18px; }
.marielco-journal-filter__body fieldset { margin: 0; padding: 0; border: 0; }
.marielco-journal-filter__body legend { margin-bottom: 11px; padding: 0; color: #777; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.marielco-journal-filter__choice { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; margin: 0; border-bottom: 1px solid #f1f1f1; color: #111; cursor: pointer; transition: opacity 150ms ease; }
.marielco-journal-filter__choice:hover { opacity: .58; }
.marielco-journal-filter__choice > span { overflow-wrap: anywhere; display: inline-flex; align-items: center; gap: 10px; min-width: 0; font-size: 10px; letter-spacing: .025em; text-transform: uppercase; }
.marielco-journal-filter__choice input { position: relative; flex: none; width: 13px; height: 13px; margin: 0; border: 1px solid #aaa; border-radius: 0; background: #fff; appearance: none; }
.marielco-journal-filter__choice input:checked { border-color: #111; background: #111; }
.marielco-journal-filter__choice input:checked::after { position: absolute; top: 1px; left: 4px; width: 3px; height: 7px; border: solid #fff; border-width: 0 1px 1px 0; content: ''; transform: rotate(45deg); }
.marielco-journal-filter__choice small { flex: 0 0 26px; color: #999; font-size: 10px; font-weight: 400; text-align: center; }
.marielco-journal-filter__footer { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; flex: 0 0 auto; padding: 14px 18px 19px; border-top: 1px solid #e5e5e5; }
.marielco-journal-filter__footer button,
.marielco-journal-filter__footer button:is(:hover,:focus,:active) { min-height: 45px; padding: 0 8px; border: 1px solid #111; border-radius: 0; background: #fff; box-shadow: none; color: #111; font-size: 9px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; transition: opacity 150ms ease; }
.marielco-journal-filter__footer button:last-child { background: #111; color: #fff; }
.marielco-journal-filter__footer button:active { opacity: .5; }
.marielco-journal :is(button,input,a):focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
@media (forced-colors: active) {
	.marielco-journal-filter__choice input { appearance: auto; }
	.marielco-journal-filter__choice input::after { content: none; }
}

@media (max-width: 1024px) {

	.marielco-journal__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768.98px) {
	.marielco-journal { --marielco-journal-gutter: 12px; padding-bottom: 48px; }
	.marielco-journal-filter__footer { padding: 6px 2px calc(6px + env(safe-area-inset-bottom)); background: #fff; }
	.marielco-journal .marielco-journal-filter__footer button:focus-visible { outline-offset: -4px; }
	.marielco-journal__masthead { padding-block: 24px; }
	.marielco-journal__title-row h1 { font-size: 24px; }
	.marielco-journal__toolbar { gap: 8px 12px; }
	.marielco-journal__controls { column-gap: 8px; }
	.marielco-journal__count { font-size: 10px; }
	.marielco-journal__grid { grid-template-columns: minmax(0, 1fr); }
	.marielco-journal-filter__header h2,
	.marielco-journal-filter__body legend,
	.marielco-journal-filter__choice > span { font-size: 12px; }
	.marielco-journal-filter__choice small,
	.marielco-journal-filter__footer button,
	.marielco-journal-filter__footer button:is(:hover,:focus,:active) { font-size: 11px; }
}

.marielco-journal a { text-decoration: none; }
.marielco-journal__filter-trigger[hidden], .marielco-journal [hidden] { display: none; }
.marielco-journal-filter { position: fixed; inset: 0 auto 0 0; width: min(420px,92vw); max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; color: #242424; background: #fff; font-family: var(--marielco-font-family); font-size: 15px; line-height: 1.6; }
@starting-style { .marielco-journal-filter[open] { transform: translateX(-100%); } }
.marielco-journal-filter::backdrop { background: rgb(0 0 0 / 11%); }
.marielco-journal-filter :is(button,input):focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
.marielco-journal-filter button { cursor: pointer; }
.marielco-journal-filter-open { overflow: hidden; }
.marielco-journal-load { display: flex; flex-direction: column; align-items: center; padding: 54px 20px 62px; }
.marielco-journal-load__status { margin-bottom: 10px; color: #777; font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }
.marielco-journal-load__dot { display: inline-block; width: 4px; height: 4px; margin-left: 6px; border-radius: 50%; background: #111; opacity: 0; }
.marielco-journal-load.is-loading .marielco-journal-load__dot { animation: marielco-journal-pulse 1s infinite; }
@keyframes marielco-journal-pulse { 0%,100% { opacity: .15; } 50% { opacity: 1; } }
.marielco-journal-load__track { display: block; appearance: none; width: min(340px,74vw); height: 1px; border: 0; background: #ddd; color: #111; }
.marielco-journal-load__track::-webkit-progress-bar { background: #ddd; }
.marielco-journal-load__track::-webkit-progress-value { background: #111; }
.marielco-journal-load__track::-moz-progress-bar { background: #111; }
.marielco-journal-load__button { min-height: 44px; margin-top: 10px; padding: 0 0 8px; border: 0; background: transparent; color: #111; font-size: 9px; font-weight: 400; letter-spacing: .11em; text-transform: uppercase; cursor: pointer; }
.marielco-journal-load__button:active { opacity: .5; }
.marielco-journal-load :focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
@media (max-width:768.98px) { .marielco-journal-load { padding: 42px 16px 52px; } .marielco-journal-load__status,.marielco-journal-load__button { font-size: 11px; } }
@media (prefers-reduced-motion:reduce) { .marielco-journal-filter[open] { transition: none; } .marielco-journal-load.is-loading .marielco-journal-load__dot { animation: none; opacity: .6; } }