/**
 * Thaicon Theme — Блок: Hero с видео (clamp + rem подход)
 *
 * Все значения в rem. 1rem = 16px на дизайн-ширине 1440px.
 *
 * @package Thaicon
 */

.block-hero-video {
	position: relative;
	width: 100%;
	background: var(--t-white);
	padding: 0 0 2.5rem;                   /* 40px снизу */
	display: flex;
	justify-content: center;
}

.block-hero-video__wrap {
	position: relative;
	width: calc(100% - 3.75rem);           /* 100% - 60px */
	max-width: 86.5rem;                    /* 1384px */
	margin: 0 auto;
	padding: 1.25rem;                      /* 20px — белая рамка */
	background: var(--t-white);
	border-radius: 1.875rem;               /* 30px */
	aspect-ratio: 1384 / 800;
}

.block-hero-video__inner {
	position: absolute;
	inset: 1.25rem;                        /* 20px со всех сторон */
	border-radius: 1.25rem;                /* 20px */
	overflow: hidden;
	background: var(--t-black);
}

.block-hero-video__inner iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.block-hero-video__btn {
	position: absolute;
	left: 4.875rem;                        /* 78px */
	bottom: 2.5rem;                        /* 40px */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.9375rem 1.875rem;           /* 15px 30px */
	background: var(--t-dark);
	color: var(--t-white);
	font-size: 0.875rem;                   /* 14px */
	font-weight: 700;
	line-height: 1.55;
	text-transform: uppercase;
	border-radius: 1.0625rem;              /* 17px */
	transition: background-color var(--t-speed-normal) ease-in-out;
	z-index: 10;
	white-space: nowrap;
}

.block-hero-video__btn:hover {
	background: var(--t-blue);
	color: var(--t-white);
}


/* ================================================================
   МОБИЛЬНЫЙ АДАПТИВ (< 640px — фиксированные px)
   ================================================================ */

@media (max-width: 639px) {
	.block-hero-video {
		padding: 20px 0 30px;
	}

	.block-hero-video__wrap {
		width: calc(100% - 20px);
		padding: 10px;
		border-radius: 20px;
	}

	.block-hero-video__inner {
		inset: 10px;
		border-radius: 12px;
	}

	.block-hero-video__btn {
		position: static;
		display: flex;
		width: calc(100% - 40px);
		margin: 15px 20px 0;
		font-size: 12px;
		padding: 13px 30px;
	}
}


/* ================================================================
   МАЛЕНЬКИЙ МОБАЙЛ (< 480px)
   ================================================================ */

@media (max-width: 479px) {
	.block-hero-video__wrap {
		width: calc(100% - 10px);
		padding: 8px;
	}
	.block-hero-video__inner {
		inset: 8px;
	}
}
