
/* ============================================================
   MOTORIN — Slider da Homepage (texto esquerda + imagem direita)
   ============================================================ */

/* wrapper edge-to-edge: sai das margens e ocupa a largura toda do ecrã */
/* impedir scroll horizontal causado por elementos edge-to-edge */
html, body { overflow-x: clip; }
.mot-home__slider-full {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: 34px;
	overflow: hidden;
}

.mot-slider {
	position: relative;
	width: 100%;
	height: 420px;
	overflow: hidden;
	background: #141414;
}
.mot-slider__track { width: 100%; height: 100%; position: relative; }

.mot-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity .5s ease;
	display: flex;
	align-items: stretch;
	pointer-events: none;
	background: linear-gradient(115deg, #141414 0%, #1a1a1a 42%, #5e1010 82%, #7a1212 100%);
}
.mot-slide.is-active { opacity: 1; pointer-events: auto; }

/* zona de texto à esquerda */
.mot-slide__content {
	position: relative;
	z-index: 2;
	flex: 1 1 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0 40px 0 96px;
	max-width: 560px;
}
.mot-slide__title {
	font-family: "Oswald", sans-serif;
	font-size: 44px;
	font-weight: 700;
	color: #fff;
	line-height: 1.06;
	margin: 0;
	letter-spacing: .3px;
	text-transform: uppercase;
	text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
.mot-slide__subtitle {
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	color: #e8e6df;
	margin: 16px 0 24px;
	line-height: 1.5;
	max-width: 440px;
	text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
.mot-slide__btn {
	display: inline-block;
	align-self: flex-start;
	background: #BA0707;
	color: #fff;
	font-family: "Oswald", sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: uppercase;
	padding: 13px 32px;
	border-radius: 6px;
	text-decoration: none;
	transition: background .15s, transform .15s;
}
.mot-slide__btn:hover { background: #fff; color: #BA0707; transform: translateY(-2px); }

/* imagem do produto — flutuante sobreposta ao fundo, à direita */
.mot-slide__media {
	position: absolute;
	right: 6%;
	top: 50%;
	transform: translateY(-50%);
	width: 44%;
	height: 92%;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}
.mot-slide__img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	filter: drop-shadow(0 22px 38px rgba(0,0,0,.55));
}

/* ===== ANIMAÇÕES (disparam quando o slide fica activo) ===== */
@keyframes motTextIn {
	from { opacity: 0; transform: translateX(-40px); }
	to   { opacity: 1; transform: translateX(0); }
}
@keyframes motImageIn {
	from { opacity: 0; transform: translateY(60px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes motBtnIn {
	from { opacity: 0; transform: translateY(22px); }
	to   { opacity: 1; transform: translateY(0); }
}
/* estado inicial (escondido) só nas slides activas para animar à entrada */
.mot-slide.is-active .mot-slide__title,
.mot-slide.is-active .mot-slide__subtitle {
	animation: motTextIn .6s ease both;
}
.mot-slide.is-active .mot-slide__subtitle { animation-delay: .12s; }
.mot-slide.is-active .mot-slide__img {
	animation: motImageIn .7s ease both;
}
.mot-slide.is-active .mot-slide__btn {
	animation: motBtnIn .5s ease both;
	animation-delay: .28s;
}

/* setas */
.mot-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 42px; height: 42px;
	border-radius: 50%;
	border: 0;
	background: rgba(255,255,255,.16);
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
	backdrop-filter: blur(2px);
}
.mot-slider__arrow:hover { background: #BA0707; }
.mot-slider__arrow--prev { left: 18px; }
.mot-slider__arrow--next { right: 18px; }

/* dots */
.mot-slider__dots {
	position: absolute;
	bottom: 20px;
	left: 96px;
	display: flex;
	gap: 8px;
	z-index: 3;
}
.mot-slider__dot {
	width: 9px; height: 9px;
	border-radius: 5px;
	border: 0;
	background: rgba(255,255,255,.5);
	cursor: pointer;
	padding: 0;
	transition: width .2s, background .2s;
}
.mot-slider__dot.is-active { width: 26px; background: #BA0707; }

@media (max-width: 860px) {
	.mot-slider { height: 340px; }
	.mot-slide { flex-direction: column; }
	.mot-slide__content { flex: none; padding: 22px 24px 26px; max-width: none; }
	.mot-slide__media { position: relative; right: auto; top: auto; transform: none; width: 100%; height: 150px; margin-top: 8px; }
	.mot-slide__title { font-size: 28px; }
	.mot-slide__subtitle { font-size: 13px; margin: 10px 0 16px; }
	.mot-slider__dots { left: 24px; bottom: auto; top: 12px; }
}
