/* ==========================================================
   2. VIDEO POPUP (.itc-pop)
   ========================================================== */
.itc-pop {
	--pop-navy: var(--brand-primary-deep);
	--pop-blue: var(--brand-primary);
	--pop-accent: var(--brand-accent);
	--pop-film: #050B1E;
	--pop-max: 1120px;
	--pop-font: var(--font-display, 'Mark Pro', 'Plus Jakarta Sans', sans-serif);
	--pop-ease: cubic-bezier(.22, 1, .36, 1);
	--pop-gutter: 32px;
	--pop-radius: 24px;
	--pop-edge: clamp(12px, 1.6vw, 20px);
	position: fixed; inset: 0; z-index: 999999;
	display: grid; place-items: center;
	padding: max(var(--pop-gutter), env(safe-area-inset-top)) max(var(--pop-gutter), env(safe-area-inset-right)) max(var(--pop-gutter), env(safe-area-inset-bottom)) max(var(--pop-gutter), env(safe-area-inset-left));
	font-family: var(--pop-font);
	-webkit-font-smoothing: antialiased;
	overscroll-behavior: contain;
	visibility: hidden; opacity: 0;
	transition: opacity .45s var(--pop-ease), visibility 0s linear .45s;
}
.itc-pop.is-open { visibility: visible; opacity: 1; transition: opacity .45s var(--pop-ease), visibility 0s; }
.itc-pop *, .itc-pop *::before, .itc-pop *::after { box-sizing: border-box; }
.itc-pop svg { display: block; }
html.itc-pop-lock, html.itc-pop-lock body { overflow: hidden !important; }
.itc-pop button {
	-webkit-appearance: none !important; appearance: none !important;
	background: transparent !important; border: 0 !important; border-radius: 0 !important;
	box-shadow: none !important; margin: 0 !important; padding: 0 !important;
	width: auto; height: auto; min-height: 0 !important;
	text-transform: none !important; letter-spacing: normal !important; line-height: 1.2 !important;
	color: #fff !important; font-family: var(--pop-font) !important; cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
.itc-pop__backdrop { position: absolute; inset: 0; background: rgba(5,11,30,0.82); -webkit-backdrop-filter: blur(10px) saturate(120%); backdrop-filter: blur(10px) saturate(120%); cursor: pointer; }
.itc-pop__dialog {
	position: relative; z-index: 1;
	width: min(var(--pop-max), 100%, calc((100vh - var(--pop-gutter) * 2) * 16 / 9));
	outline: none; opacity: 0;
	transform: translate3d(0, 28px, 0) scale(.94);
	transition: opacity .6s var(--pop-ease) .06s, transform .7s var(--pop-ease) .06s;
}
@supports (height: 100dvh) {
	.itc-pop__dialog { width: min(var(--pop-max), 100%, calc((100dvh - var(--pop-gutter) * 2) * 16 / 9)); }
}
.itc-pop.is-open .itc-pop__dialog { opacity: 1; transform: none; }
.itc-pop__card { position: relative; border-radius: var(--pop-radius); overflow: hidden; background: var(--pop-film); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 0 0 6px rgba(33,64,154,0.22), 0 40px 120px -24px rgba(0,0,0,0.75); }
.itc-pop__stage { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--pop-film); cursor: pointer; }
.itc-pop__yt { position: absolute; inset: 0; overflow: hidden; }
.itc-pop__yt iframe { position: absolute; left: 0; top: 50%; width: 100% !important; height: calc(100% + 240px) !important; max-width: none !important; transform: translateY(-50%); border: 0; pointer-events: none; }
.itc-pop .itc-pop__poster { position: absolute !important; inset: 0; z-index: 1; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; object-fit: cover; transform: scale(1.06); transition: opacity .6s var(--pop-ease), transform 1.2s var(--pop-ease); pointer-events: none; }
.itc-pop.is-open .itc-pop__poster { transform: scale(1); }
.itc-pop.is-started .itc-pop__poster { opacity: 0; }
.itc-pop__veil { position: absolute; inset: 0; z-index: 2; background: rgba(5,11,30,0.45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .4s var(--pop-ease); pointer-events: none; }
.itc-pop.is-started.needs-play .itc-pop__veil { opacity: 1; }
.itc-pop__loader { position: absolute; left: 50%; top: 50%; z-index: 3; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%; border: 3px solid rgba(255,255,255,0.22); border-top-color: var(--pop-accent); animation: itcPopSpin .9s linear infinite; transition: opacity .3s var(--pop-ease); pointer-events: none; }
.itc-pop.is-playing .itc-pop__loader, .itc-pop.needs-play .itc-pop__loader { opacity: 0; animation-play-state: paused; }
.itc-pop .itc-pop__close { position: absolute; z-index: 7; top: var(--pop-edge); right: var(--pop-edge); display: grid !important; place-items: center; width: 44px !important; height: 44px !important; border-radius: 50% !important; background: rgba(9,17,42,0.55) !important; border: 1px solid rgba(255,255,255,0.22) !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background-color .3s var(--pop-ease), border-color .3s var(--pop-ease), color .3s var(--pop-ease); }
.itc-pop .itc-pop__close svg { width: 20px; height: 20px; transition: transform .45s var(--pop-ease); }
.itc-pop .itc-pop__close:hover, .itc-pop .itc-pop__close:focus-visible { background: var(--pop-accent) !important; border-color: var(--pop-accent) !important; color: var(--pop-navy) !important; }
.itc-pop .itc-pop__close:hover svg { transform: rotate(90deg); }
.itc-pop .itc-pop__play { position: absolute; left: 50%; top: 50%; z-index: 4; width: clamp(64px,7vw,104px) !important; height: clamp(64px,7vw,104px) !important; display: grid !important; place-items: center; border: 3px solid rgba(255,255,255,0.92) !important; border-radius: 30% !important; background: rgba(255,255,255,0.16) !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transform: translate3d(-50%,-50%,0) scale(.85); opacity: 0; visibility: hidden; transition: opacity .3s var(--pop-ease), transform .45s var(--pop-ease), visibility .3s, background-color .25s, border-color .25s; }
.itc-pop.needs-play .itc-pop__play { opacity: 1; visibility: visible; transform: translate3d(-50%,-50%,0) scale(1); }
.itc-pop .itc-pop__play:hover { background: var(--pop-blue) !important; border-color: var(--pop-blue) !important; }
.itc-pop .itc-pop__play svg { width: 40%; height: 40%; transform: translateX(6%); }
.itc-pop__bar { position: absolute; right: var(--pop-edge); bottom: calc(var(--pop-edge) + 3px); z-index: 6; display: flex; justify-content: flex-end; pointer-events: none; }
.itc-pop__vol { --vol: 0; position: relative; display: flex; align-items: center; height: 42px; border-radius: 999px; background: rgba(9,17,42,0.55); border: 1px solid rgba(255,255,255,0.18); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); pointer-events: auto; transition: background-color .28s var(--pop-ease); }
.itc-pop__vol:hover { background: rgba(9,17,42,0.72); }
.itc-pop .itc-pop__mute { flex: none; display: grid !important; place-items: center; width: 40px !important; height: 40px !important; border-radius: 50% !important; }
.itc-pop .itc-pop__mute:focus-visible { outline: 3px solid var(--pop-accent) !important; outline-offset: 2px; }
.itc-pop .itc-pop__ico { display: none; width: 21px; height: 21px; }
.itc-pop[data-vol="muted"] .itc-pop__ico--muted, .itc-pop[data-vol="low"] .itc-pop__ico--low, .itc-pop[data-vol="high"] .itc-pop__ico--high { display: block; }
.itc-pop__slider { position: relative; width: 0; height: 40px; margin-left: 0; overflow: hidden; opacity: 0; transition: width .35s var(--pop-ease), margin .35s var(--pop-ease), opacity .25s var(--pop-ease); }
.itc-pop__vol:hover .itc-pop__slider, .itc-pop__vol:focus-within .itc-pop__slider { width: 76px; margin-left: 14px; opacity: 1; }
.itc-pop__track { position: absolute; left: 6px; right: 6px; top: 50%; height: 3px; margin-top: -1.5px; border-radius: 3px; background: rgba(255,255,255,0.32); pointer-events: none; }
.itc-pop__fill { position: absolute; left: 0; top: 0; bottom: 0; width: calc(var(--vol) * 1%); border-radius: 3px; background: #fff; }
.itc-pop__knob { position: absolute; top: 50%; left: calc(var(--vol) * 1%); width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.35); transition: transform .2s var(--pop-ease); }
.itc-pop__slider:hover .itc-pop__knob { transform: scale(1.15); }
.itc-pop .itc-pop__range { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; -webkit-appearance: none !important; appearance: none !important; opacity: 0; cursor: pointer; touch-action: none; }
.itc-pop .itc-pop__range::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; }
.itc-pop .itc-pop__range::-moz-range-thumb { width: 12px; height: 12px; border: 0; }
.itc-pop .itc-pop__range::-moz-range-track { background: transparent; }
.itc-pop__vol:has(.itc-pop__range:focus-visible) { outline: 3px solid var(--pop-accent); outline-offset: 2px; }
.itc-pop__vol::after { content: ""; position: absolute; inset: -1px; border-radius: 999px; border: 2px solid var(--pop-accent); opacity: 0; pointer-events: none; }
.itc-pop.is-playing:not(.sound-touched):not(.is-loud) .itc-pop__vol::after { animation: itcPopHint 2.2s var(--pop-ease) 1.2s infinite; }
.itc-pop__vol:hover::after { animation: none !important; opacity: 0 !important; }
@media (hover: none) { .itc-pop__slider { display: none; } }
.itc-pop__progress { position: absolute; left: 0; right: 0; bottom: 0; z-index: 6; height: 3px; background: rgba(255,255,255,0.14); pointer-events: none; }
.itc-pop__progress i { display: block; height: 100%; background: var(--pop-accent); transform: scaleX(0); transform-origin: left center; transition: transform .25s linear; }
@keyframes itcPopSpin { to { transform: rotate(360deg); } }
@keyframes itcPopHint { 0% { transform: scale(1); opacity: .9; } 70%, 100% { transform: scale(1.25); opacity: 0; } }
@media (max-width: 1024px) { .itc-pop { --pop-gutter: 24px; --pop-radius: 22px; } }
@media (max-width: 767px) {
	.itc-pop { --pop-gutter: 14px; --pop-radius: 18px; --pop-edge: 10px; }
	.itc-pop .itc-pop__close { width: 38px !important; height: 38px !important; }
	.itc-pop .itc-pop__close svg { width: 17px; height: 17px; }
	.itc-pop__vol { height: 38px; }
	.itc-pop .itc-pop__mute { width: 36px !important; height: 36px !important; }
	.itc-pop .itc-pop__ico { width: 19px; height: 19px; }
	.itc-pop__card { box-shadow: 0 0 0 4px rgba(33,64,154,0.22), 0 24px 60px -18px rgba(0,0,0,0.75); }
}
@media (max-height: 540px) {
	.itc-pop { --pop-gutter: 10px; --pop-radius: 16px; --pop-edge: 8px; }
	.itc-pop .itc-pop__close { width: 34px !important; height: 34px !important; }
	.itc-pop .itc-pop__close svg { width: 16px; height: 16px; }
	.itc-pop__vol { height: 34px; }
	.itc-pop .itc-pop__mute { width: 32px !important; height: 32px !important; }
	.itc-pop .itc-pop__ico { width: 17px; height: 17px; }
}
@media (prefers-reduced-motion: reduce) {
	.itc-pop, .itc-pop__dialog, .itc-pop .itc-pop__poster { transition: opacity .01s !important; transform: none !important; }
	.itc-pop__vol::after { animation: none !important; }
	.itc-pop__slider { transition: none !important; }
}
