/* Manchete Studio — front-end */

.mst {
	position: relative;
	width: 100%;
	max-width: var(--mst-maxw, 100%);
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}
.mst *, .mst *::before, .mst *::after { box-sizing: border-box; }

/* ---------- Item ---------- */
.mst .mst-item {
	position: relative;
	height: 100%;
	border-radius: var(--mst-radius);
	overflow: hidden;
	background: #111827;
	isolation: isolate;
	transition: transform .3s ease, box-shadow .3s ease;
}
.mst .mst-link {
	position: absolute;
	inset: 0;
	display: block;
	color: inherit;
	text-decoration: none;
	box-shadow: none;
	outline-offset: -3px;
}
.mst .mst-media, .mst .mst-overlay { position: absolute; inset: 0; }
.mst .mst-media img, .mst .mst-noimg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	border-radius: 0;
	transition: transform .7s cubic-bezier(.2,.7,.2,1), filter .4s ease;
	-webkit-user-drag: none;
	user-select: none;
}
.mst .mst-noimg { background: linear-gradient(135deg, #1f2937, #4b5563); }
.mst .mst-overlay { background: var(--mst-ov); pointer-events: none; }

.mst .mst-content {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: var(--mst-cgap, 10px);
	padding: var(--mst-pad);
	pointer-events: none;
}
.mst.mst-pos-center .mst-content { justify-content: center; }
.mst.mst-pos-top .mst-content { justify-content: flex-start; }
.mst.mst-align-left .mst-content { align-items: flex-start; text-align: left; }
.mst.mst-align-center .mst-content { align-items: center; text-align: center; }
.mst.mst-align-right .mst-content { align-items: flex-end; text-align: right; }

.mst .mst-title {
	margin: 0;
	padding: 0;
	max-width: 52ch;
	font-family: var(--mst-font);
	font-size: var(--mst-tss);
	font-weight: var(--mst-tw);
	line-height: var(--mst-lh);
	text-transform: var(--mst-tt);
	letter-spacing: -.01em;
	color: var(--mst-tc);
	transition: color .2s ease;
	overflow-wrap: break-word;
}
.mst .mst-item-main .mst-title { font-size: var(--mst-ts); max-width: 34ch; }
.mst.mst-clamp .mst-title {
	display: -webkit-box;
	-webkit-line-clamp: var(--mst-lines);
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.mst.mst-tshadow .mst-title, .mst.mst-tshadow .mst-excerpt { text-shadow: var(--mst-tsh); }
.mst .mst-link:hover .mst-title, .mst .mst-link:focus-visible .mst-title { color: var(--mst-thc); }

.mst .mst-kicker {
	display: inline-block;
	font-family: var(--mst-font);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.mst.mst-k-badge .mst-kicker { padding: 6px 10px; border-radius: 4px; background: var(--mst-kbg); color: var(--mst-kc); }
.mst.mst-k-text .mst-kicker { color: var(--mst-kbg); }

.mst .mst-excerpt { margin: 0; max-width: 60ch; font-size: 16px; line-height: 1.5; color: var(--mst-mc); }
.mst .mst-meta { display: flex; flex-wrap: wrap; gap: 6px; font-size: 13px; color: var(--mst-mc); opacity: .9; }
.mst .mst-meta i { font-style: normal; opacity: .6; }

/* ---------- Efeitos de hover ---------- */
.mst.mst-hover-zoom .mst-link:hover .mst-media img { transform: scale(1.06); }
.mst.mst-hover-darken .mst-link:hover .mst-media img { filter: brightness(.7); }
.mst.mst-hover-lighten .mst-link:hover .mst-media img { filter: brightness(1.15); }
.mst.mst-hover-lift .mst-cell .mst-item:hover,
.mst.mst-l-carousel .mst-item:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(0,0,0,.25); }

/* ---------- Grades ---------- */
.mst .mst-grid {
	display: grid;
	gap: var(--mst-gap-r, var(--mst-gap)) var(--mst-gap);
	height: var(--mst-h);
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
}
.mst .mst-cell { position: relative; min-width: 0; min-height: 0; }
.mst.mst-l-duo .mst-grid { grid-template-columns: 1fr 1fr; }
.mst.mst-l-one_two .mst-grid,
.mst.mst-l-slider_side .mst-grid { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.mst.mst-l-mosaic .mst-grid { grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 1fr 1fr; }
.mst.mst-l-one_two .mst-cell-main,
.mst.mst-l-mosaic .mst-cell-main,
.mst.mst-l-slider_side .mst-cell-main { grid-row: 1 / span 2; }

/* ---------- Slider / carrossel ---------- */
.mst .mst-slider {
	--mst-pv: 1;
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
}
.mst.mst-l-carousel .mst-slider { --mst-pv: var(--mst-cols); }
.mst .mst-viewport { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; border-radius: var(--mst-radius); touch-action: pan-y; }
.mst.mst-l-carousel .mst-viewport { border-radius: 0; overflow: hidden; padding: 6px 0; margin: -6px 0; }
.mst .mst-track {
	display: flex;
	gap: var(--mst-gap);
	height: 100%;
	transition: transform var(--mst-speed) cubic-bezier(.25,.8,.25,1);
	will-change: transform;
}
.mst .mst-slide {
	position: relative;
	flex: 0 0 calc((100% - (var(--mst-pv) - 1) * var(--mst-gap)) / var(--mst-pv));
	height: var(--mst-h);
	min-width: 0;
}
.mst.mst-l-slider_side .mst-slide { height: 100%; }
.mst.mst-l-slider .mst-slide .mst-item,
.mst.mst-l-slider_side .mst-slide .mst-item { border-radius: 0; }

/* Fade */
.mst .mst-fade .mst-track { display: grid; transform: none !important; }
.mst .mst-fade .mst-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity var(--mst-speed) ease, visibility 0s linear var(--mst-speed); }
.mst .mst-fade .mst-slide.is-active { opacity: 1; visibility: visible; transition: opacity var(--mst-speed) ease; z-index: 1; }

/* Setas */
.mst .mst-arrow {
	position: absolute;
	top: 50%;
	z-index: 5;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	margin: -23px 0 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--mst-abg);
	color: var(--mst-ac);
	cursor: pointer;
	transition: opacity .25s ease, background .2s ease, transform .2s ease;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.mst .mst-arrow:hover { background: var(--mst-abgh); }
.mst .mst-arrow:focus-visible { outline: 2px solid var(--mst-ba); outline-offset: 2px; }
.mst .mst-arrow svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.mst .mst-prev { left: 14px; }
.mst .mst-next { right: 14px; }
.mst.mst-arrow-square .mst-arrow { border-radius: 6px; }
.mst.mst-arrow-minimal .mst-arrow { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; filter: drop-shadow(0 1px 4px rgba(0,0,0,.5)); }
.mst.mst-arrow-minimal .mst-arrow svg { width: 36px; height: 36px; }
.mst.mst-arrows-hover .mst-arrow { opacity: 0; }
.mst.mst-arrows-hover .mst-slider:hover .mst-arrow,
.mst.mst-arrows-hover .mst-arrow:focus-visible { opacity: 1; }
.mst .mst-arrow[disabled] { opacity: .3 !important; cursor: default; }
@media (hover: none) { .mst.mst-arrows-hover .mst-arrow { opacity: 1; } }

/* Bullets */
.mst .mst-bullets { display: flex; flex-wrap: wrap; align-items: center; gap: var(--mst-bgap); z-index: 5; }
.mst.mst-ba-left .mst-bullets { justify-content: flex-start; }
.mst.mst-ba-center .mst-bullets { justify-content: center; }
.mst.mst-ba-right .mst-bullets { justify-content: flex-end; }

/* Sobre a imagem: embaixo / em cima */
.mst.mst-bp-inside-bottom .mst-bullets,
.mst.mst-bp-inside-top .mst-bullets { position: absolute; left: var(--mst-pad); right: var(--mst-pad); }
.mst.mst-bp-inside-bottom .mst-bullets { bottom: var(--mst-bo); }
.mst.mst-bp-inside-top .mst-bullets { top: var(--mst-bo); }
/* Sobre a imagem: laterais (vertical) */
.mst.mst-bp-inside-left .mst-bullets,
.mst.mst-bp-inside-right .mst-bullets { position: absolute; top: 50%; transform: translateY(-50%); flex-direction: column; flex-wrap: nowrap; }
.mst.mst-bp-inside-left .mst-bullets { left: var(--mst-bo); }
.mst.mst-bp-inside-right .mst-bullets { right: var(--mst-bo); }
/* Fora: abaixo / acima */
.mst.mst-bp-outside-bottom .mst-bullets { order: 2; margin-top: var(--mst-bo); }
.mst.mst-bp-outside-top .mst-bullets { order: -1; margin-bottom: var(--mst-bo); }

/* Abre espaço no texto para os bullets não ficarem por cima */
.mst.mst-place-inside.mst-bp-inside-bottom:not(.mst-b-none) .mst-slide .mst-content { padding-bottom: calc(var(--mst-pad) + var(--mst-bo) + var(--mst-bs) + 6px); }
.mst.mst-place-inside.mst-bp-inside-bottom.mst-b-thumbs .mst-slide .mst-content { padding-bottom: calc(var(--mst-pad) + var(--mst-bo) + var(--mst-bs) * 5); }
.mst.mst-place-inside.mst-bp-inside-top:not(.mst-b-none) .mst-slide .mst-content { padding-top: calc(var(--mst-pad) + var(--mst-bo) + var(--mst-bs) + 6px); }
.mst.mst-bp-inside-left:not(.mst-b-none) .mst-slide .mst-content { padding-left: calc(var(--mst-pad) + var(--mst-bo) + var(--mst-bs) * 2); }
.mst.mst-bp-inside-right:not(.mst-b-none) .mst-slide .mst-content { padding-right: calc(var(--mst-pad) + var(--mst-bo) + var(--mst-bs) * 2); }
.mst.mst-bp-inside-left .mst-prev { left: calc(var(--mst-bo) + var(--mst-bs) * 2 + 14px); }
.mst.mst-bp-inside-right .mst-next { right: calc(var(--mst-bo) + var(--mst-bs) * 2 + 14px); }

.mst .mst-bullet {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	cursor: pointer;
	background: var(--mst-bc);
	opacity: .55;
	transition: all .25s ease;
	font: inherit;
}
.mst .mst-bullet:hover { opacity: .85; }
.mst .mst-bullet.is-active { background: var(--mst-ba); opacity: 1; }
.mst .mst-bullet:focus-visible { outline: 2px solid var(--mst-ba); outline-offset: 3px; }

.mst.mst-b-dots .mst-bullet { width: var(--mst-bs); height: var(--mst-bs); border-radius: 50%; }
.mst.mst-b-dots .mst-bullet.is-active { transform: scale(1.25); }
.mst.mst-b-lines .mst-bullet { width: calc(var(--mst-bs) * 2.6); height: max(3px, calc(var(--mst-bs) * .4)); border-radius: 2px; }
.mst.mst-b-lines .mst-bullet.is-active { width: calc(var(--mst-bs) * 4.4); }
.mst.mst-bp-inside-left.mst-b-lines .mst-bullet,
.mst.mst-bp-inside-right.mst-b-lines .mst-bullet { width: max(3px, calc(var(--mst-bs) * .4)); height: calc(var(--mst-bs) * 2.6); }
.mst.mst-bp-inside-left.mst-b-lines .mst-bullet.is-active,
.mst.mst-bp-inside-right.mst-b-lines .mst-bullet.is-active { width: max(3px, calc(var(--mst-bs) * .4)); height: calc(var(--mst-bs) * 4.4); }
.mst.mst-b-numbers .mst-bullet {
	display: grid; place-items: center;
	width: calc(var(--mst-bs) * 3); height: calc(var(--mst-bs) * 3); border-radius: 50%;
	background: transparent; border: 2px solid var(--mst-bc); color: var(--mst-bc);
	font-size: calc(var(--mst-bs) * 1.3); font-weight: 700; line-height: 1;
}
.mst.mst-b-numbers .mst-bullet.is-active { background: var(--mst-ba); border-color: var(--mst-ba); color: #fff; }
.mst.mst-b-thumbs .mst-bullet { width: calc(var(--mst-bs) * 7.2); height: calc(var(--mst-bs) * 4.8); border-radius: 6px; overflow: hidden; background: #000; border: 2px solid transparent; }
.mst.mst-b-thumbs .mst-bullet img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mst.mst-b-thumbs .mst-bullet.is-active { border-color: var(--mst-ba); }

/* Barra de progresso */
.mst .mst-progress { position: absolute; left: 0; right: 0; bottom: 0; z-index: 6; height: 3px; background: rgba(255,255,255,.18); }
.mst .mst-progress span { display: block; width: 0; height: 100%; background: var(--mst-ba); }
.mst-slider.is-paused .mst-progress span { animation-play-state: paused !important; }
@keyframes mst-progress { from { width: 0; } to { width: 100%; } }

.mst .mst-slider.is-dragging .mst-track { transition: none; }
.mst .mst-slider.is-dragging .mst-link { cursor: grabbing; }

.mst-empty { padding: 16px; border: 1px dashed #cbd5e1; border-radius: 6px; color: #64748b; font-size: 14px; }

/* ---------- Tablet ---------- */
@media (max-width: 1023px) {
	.mst.mst-l-carousel .mst-slider { --mst-pv: var(--mst-cols-t); }
	.mst.mst-l-mosaic .mst-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 2fr 1fr 1fr; }
	.mst.mst-l-mosaic .mst-cell-main { grid-row: auto; grid-column: 1 / -1; }
}

/* ---------- Celular ---------- */
@media (max-width: 767px) {
	.mst .mst-grid { height: auto; grid-template-columns: 1fr !important; grid-template-rows: none !important; }
	.mst .mst-cell { height: max(200px, calc(var(--mst-hm) * .62)); }
	.mst .mst-cell-main { grid-row: auto !important; grid-column: auto !important; height: var(--mst-hm); }
	.mst.mst-l-duo .mst-cell { height: var(--mst-hm); }
	.mst.mst-mcols-2 .mst-grid { grid-template-columns: 1fr 1fr !important; }
	.mst.mst-mcols-2 .mst-cell-main { grid-column: 1 / -1 !important; }
	.mst.mst-mcols-2 .mst-cell:not(.mst-cell-main) { height: max(180px, calc(var(--mst-hm) * .55)); }
	.mst .mst-slide { height: var(--mst-hm); }
	.mst.mst-l-slider_side .mst-slide { height: var(--mst-hm); }
	.mst .mst-title { font-size: calc(var(--mst-tsm) * .82); }
	.mst .mst-item-main .mst-title { font-size: var(--mst-tsm); }
	.mst .mst-content { padding: calc(var(--mst-pad) * .7); }
	.mst .mst-excerpt { font-size: 14px; }
	.mst .mst-arrow { width: 38px; height: 38px; margin-top: -19px; }
	.mst .mst-prev { left: 8px; }
	.mst .mst-next { right: 8px; }
	
}
@media (max-width: 639px) {
	.mst.mst-l-carousel .mst-slider { --mst-pv: var(--mst-cols-m); }
}

@media (prefers-reduced-motion: reduce) {
	.mst *, .mst *::before, .mst *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
}

/* ---------- Texto abaixo da imagem ---------- */
.mst.mst-place-below .mst-item { display: flex; flex-direction: column; background: var(--mst-bbg); }
.mst.mst-place-below .mst-link { position: relative; inset: auto; display: flex; flex-direction: column; height: 100%; }
.mst.mst-place-below .mst-media { position: relative; inset: auto; flex: 1 1 auto; min-height: 90px; overflow: hidden; }
.mst.mst-place-below .mst-overlay { display: none; }
.mst.mst-place-below .mst-content { position: relative; inset: auto; flex: 0 0 auto; justify-content: flex-start; gap: var(--mst-cgap, 8px); padding: calc(var(--mst-pad) * .6) calc(var(--mst-pad) * .7); }
.mst.mst-place-below .mst-title { color: var(--mst-btc); text-shadow: none; }
.mst.mst-place-below .mst-link:hover .mst-title, .mst.mst-place-below .mst-link:focus-visible .mst-title { color: var(--mst-bthc); }
.mst.mst-place-below .mst-excerpt, .mst.mst-place-below .mst-meta { color: var(--mst-bmc); text-shadow: none; }
.mst.mst-place-below .mst-item-main .mst-title { font-size: calc(var(--mst-ts) * .8); }
.mst.mst-place-below.mst-bp-inside-bottom:not(.mst-b-none) .mst-slide .mst-content { padding-bottom: calc(var(--mst-pad) * .6 + var(--mst-bo) + var(--mst-bs) + 6px); }

/* ---------- Grade modular (2 + 1 + 2 e personalizada) ---------- */
.mst .mst-grid-modular { grid-auto-flow: row dense; }
@media (max-width: 1023px) {
	.mst.mst-l-custom .mst-grid, .mst.mst-l-two_one_two .mst-grid { height: auto; grid-template-columns: repeat(2, 1fr) !important; grid-template-rows: none !important; }
	.mst.mst-l-custom .mst-cell, .mst.mst-l-two_one_two .mst-cell { height: max(200px, calc(var(--mst-h) * .45)); }
	.mst.mst-l-custom .mst-cell-main, .mst.mst-l-two_one_two .mst-cell-main { grid-column: 1 / -1 !important; grid-row: auto !important; height: calc(var(--mst-h) * .8); }
}
@media (max-width: 767px) {
	.mst.mst-l-custom .mst-grid, .mst.mst-l-two_one_two .mst-grid { grid-template-columns: 1fr !important; }
	.mst.mst-l-custom.mst-mcols-2 .mst-grid, .mst.mst-l-two_one_two.mst-mcols-2 .mst-grid { grid-template-columns: 1fr 1fr !important; }
	.mst.mst-l-custom .mst-cell, .mst.mst-l-two_one_two .mst-cell { height: max(200px, calc(var(--mst-hm) * .62)); }
	.mst.mst-l-custom.mst-mcols-2 .mst-cell, .mst.mst-l-two_one_two.mst-mcols-2 .mst-cell { height: max(180px, calc(var(--mst-hm) * .55)); }
	.mst.mst-l-custom .mst-cell-main, .mst.mst-l-two_one_two .mst-cell-main { height: var(--mst-hm); }
}