/* GamesCon brand layer over Alvido: yellow accent instead of green. */
:root {
	--tg-theme-primary: #f9cd36;
	--theme-color: #f9cd36;
	--accent-color: #f9cd36;
	--gc-yellow: #f9cd36;
	--gc-yellow-rgb: 249, 205, 54;
}

/* Parent CSS hard-codes rgba(69, 248, 130, x) in these rules. */
.btn {
	box-shadow: 0 30px 60px rgba(var(--gc-yellow-rgb), 0.3);
}

.counter__wrap .title-icon {
	box-shadow: 0 20px 40px rgba(var(--gc-yellow-rgb), 0.2);
}

/* No date sticker over news thumbnails; the date stays in the card meta line. */
.blog__post-date {
	display: none !important;
}

.wp-block-archives-list li a:hover,
.wp-block-query-pagination-numbers a:hover,
.wp-block-page-list li a:hover {
	color: var(--gc-yellow);
}

.wp-block-pages-list__item.wp-block-navigation-item a:hover {
	color: var(--gc-yellow) !important;
}

.wp-block-search .wp-block-search__button:after {
	background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.65952 17.3188C10.5808 17.3184 12.4467 16.6752 13.9602 15.4917L18.7185 20.25L20.249 18.7195L15.4907 13.9611C16.6749 12.4475 17.3185 10.5812 17.3189 8.6594C17.3189 3.88482 13.4341 0 8.65952 0C3.88494 0 0.00012207 3.88482 0.00012207 8.6594C0.00012207 13.434 3.88494 17.3188 8.65952 17.3188ZM8.65952 2.16485C12.2413 2.16485 15.1541 5.07766 15.1541 8.6594C15.1541 12.2411 12.2413 15.1539 8.65952 15.1539C5.07778 15.1539 2.16497 12.2411 2.16497 8.6594C2.16497 5.07766 5.07778 2.16485 8.65952 2.16485Z' fill='%23f9cd36'/%3E%3C/svg%3E%0A");
}

/* The parent theme's breadcrumb hero repeats the page title we already render ourselves. */
.post-type-archive-tournaments .breadcrumb__area,
.single-tournaments .breadcrumb__area {
	display: none;
}

/* Tournament archive */
.gc-archive {
	padding: 120px 0;
	background: #05080a;
	color: #fff;
}

.gc-archive__title {
	font-family: var(--tg-heading-font-family);
	font-size: clamp(56px, 9vw, 120px);
	line-height: 0.9;
	text-transform: uppercase;
	color: #fff;
}

.gc-archive__lead {
	max-width: 560px;
	margin: 16px 0 40px;
	color: #b8b8b8;
}

.gc-filters {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 40px;
}

.gc-filters__group {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.gc-pill {
	padding: 8px 16px;
	border: 1px solid #333;
	border-radius: 30px;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.gc-pill:hover,
.gc-pill.is-active {
	border-color: var(--gc-yellow);
	background: var(--gc-yellow);
	color: #05080a;
}

.gc-news-filter {
	margin-bottom: 40px;
	padding-bottom: 24px;
	border-bottom: 1px solid #222;
}

.gc-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

@media (max-width: 1199px) {
	.gc-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 767px) {
	.gc-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
}

.gc-card[hidden] {
	display: none;
}

.gc-card__poster {
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	background: #05080a;
}

.gc-card__poster img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: filter 0.4s;
}

.gc-card:hover .gc-card__poster img {
	filter: brightness(1.1);
}

.gc-card__title {
	margin: 14px 0 4px;
	font-size: 22px;
	line-height: 1.1;
	text-transform: uppercase;
}

.gc-card__title a {
	color: #fff;
}

.gc-card__title a:hover {
	color: var(--gc-yellow);
}

.gc-card__meta {
	margin: 0;
	font-size: 13px;
	color: #9a9a9a;
}

.gc-empty {
	color: #b8b8b8;
}

/* Single tournament */
.gc-single {
	padding: 120px 0;
	background: #05080a;
	color: #fff;
}

.gc-single__grid {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 56px;
	align-items: start;
}

@media (max-width: 991px) {
	.gc-single__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

.gc-single__poster img {
	width: 100%;
	height: auto;
	display: block;
}

.gc-single__title {
	margin: 16px 0 28px;
	font-family: var(--tg-heading-font-family);
	font-size: clamp(44px, 6vw, 84px);
	line-height: 0.95;
	text-transform: uppercase;
	color: #fff;
}

.gc-single__details {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 12px 32px;
	margin: 0 0 36px;
	padding: 24px 0;
	border-top: 1px solid #222;
	border-bottom: 1px solid #222;
}

.gc-single__details dt {
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	color: #8a8a8a;
}

.gc-single__details dd {
	margin: 0;
	color: #fff;
}

.gc-single__note {
	color: var(--gc-yellow);
}

.gc-single__content {
	max-width: 760px;
	margin: 64px 0;
	color: #cfcfcf;
}

.gc-single__content a {
	color: var(--gc-yellow);
}

.gc-single__others-title {
	margin-bottom: 28px;
	font-size: 40px;
	text-transform: uppercase;
	color: #fff;
}

/* The parent capitalizes every word, which misrenders Serbian sentence-case copy. */
.section__title .title,
.testimonial-card3 .testimonial-card_text {
	text-transform: none;
}

/* News (blog widget): 4:5 posters are letterboxed in the fixed-height box instead of cropped. */
.elementor-widget-alvido_blog .blog__post-item-two .blog__post-thumb img {
	object-fit: contain;
	background: #05080a;
}

/* News (blog widget): long imported titles must wrap inside their column. */
.elementor-widget-alvido_blog .blog__post-item-two .blog__post-content .media-body {
	min-width: 0;
}

.elementor-widget-alvido_blog .blog__post-item-two .blog__post-content .title {
	font-size: clamp(22px, 1.2rem + 0.9vw, 30px);
	overflow-wrap: break-word;
	hyphens: auto;
}

/* News cards (archive and blog widget): uniform 4:5 poster box (letterboxed, not cropped) and a readable date. */
.blog .blog-single .blog__post-item .blog__post-thumb img,
.archive .blog-single .blog__post-item .blog__post-thumb img,
.elementor-widget-alvido_blog .blog__post-item .blog__post-thumb img {
	aspect-ratio: 4 / 5;
	height: auto;
	min-width: 0;
	max-height: none;
	object-fit: contain;
	background: #05080a;
}

/* Single news: show the whole poster instead of cropping it to the 450px box. */
.single-post .blog__details-thumb img {
	object-fit: contain;
	background: #05080a;
}

.blog__post-item .blog__post-meta .list-wrap li {
	color: rgba(255, 255, 255, 0.6);
}

/* Sponsor wall. The logos are white, transparent variants generated at build time
   (Sponsor_Logo / Logo_Normalizer in gamescon-core), shown on equal dark cards. The theme lays the
   list out with Isotope (absolute positions, fixed container height); a centred flex row replaces it
   so a short last row sits in the middle. */
.elementor-widget-alvido_client_area .client-list-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	max-width: 1240px;
	height: auto !important;
	margin: 0 auto;
}

.elementor-widget-alvido_client_area .client-list-wrap .client-card2 {
	position: static !important;
	width: calc((100% - 5 * 20px) / 6);
	margin: 0;
	transform: none !important;
}

.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a {
	width: 100%;
	height: 132px;
	padding: 16px;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 16px;
	background: #0e1114;
	transition: border-color 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a img {
	/* Every logo file is a 2:1 canvas with the logo already sized inside it (Logo_Normalizer). */
	width: auto;
	height: auto;
	max-width: 88%;
	max-height: 76px;
	object-fit: contain;
	opacity: 0.75;
	filter: none;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a:hover,
.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a:focus-visible {
	border-color: var(--tg-theme-primary);
	background: #12161a;
	box-shadow: 0 10px 30px rgba(249, 205, 54, 0.12);
}

.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a:hover img,
.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a:focus-visible img {
	opacity: 1;
	filter: none;
	transform: scale(1.04);
}

@media (max-width: 1199.98px) {
	.elementor-widget-alvido_client_area .client-list-wrap .client-card2 {
		width: calc((100% - 3 * 20px) / 4);
	}
}

/* Two logos per row on phones. */
@media (max-width: 767.98px) {
	.elementor-widget-alvido_client_area .client-list-wrap {
		gap: 12px;
	}

	.elementor-widget-alvido_client_area .client-list-wrap .client-card2 {
		width: calc((100% - 12px) / 2);
	}

	.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a {
		height: 96px;
		padding: 12px;
		border-radius: 12px;
	}

	.elementor-widget-alvido_client_area .client-list-wrap .client-card2 a img {
		max-width: 92%;
		max-height: 64px;
	}
}

/* Contact Form 7 fields on dark backgrounds. */
.wpcf7 input.wpcf7-form-control:not([type="submit"]),
.wpcf7 textarea.wpcf7-form-control {
	margin-bottom: 20px;
	padding: 0 20px;
	border: 1px solid #333;
	color: #fff;
	background-color: #0e1114;
}

.wpcf7 textarea.wpcf7-form-control {
	height: 160px;
	padding-top: 15px;
	padding-bottom: 15px;
}

.wpcf7 input.wpcf7-form-control:not([type="submit"]):focus,
.wpcf7 textarea.wpcf7-form-control:focus {
	border-color: var(--gc-yellow);
	outline: none;
}

.wpcf7 .wpcf7-form-control::placeholder {
	color: #9a9a9a;
	opacity: 1;
}

/* Fixed logo width (the old SVG logo only had a viewBox); wide enough to read the VISA partnership line. */
.tgmenu__nav .logo img,
.tgmobile__menu .nav-logo img,
.elementor-widget-alvidologo .header-logo img {
	width: 180px;
	max-width: 100%;
	height: auto;
}

@media (max-width: 767px) {
	.tgmenu__nav .logo img {
		width: 140px;
	}
}

/* Keep logo, seven menu items and the CTA on one row: the parent spacing assumes no logo width. */
.tgmenu__nav {
	flex-wrap: nowrap;
}

.tgmenu__navbar-wrap > ul {
	margin-left: 60px;
}

.tgmenu__navbar-wrap > ul > li {
	margin-right: 40px;
}

.tgmenu__action .list-wrap {
	margin-left: 40px;
}

@media (max-width: 1199.98px) {
	.tgmenu__navbar-wrap > ul {
		margin-left: 30px;
	}

	.tgmenu__navbar-wrap > ul > li {
		margin-right: 18px;
	}

	.tgmenu__navbar-wrap > ul > li a {
		font-size: 13px;
	}

	.tgmenu__action .list-wrap {
		margin-left: 20px;
	}
}

/* About page timeline: the full-width container has no side padding on phones. */
@media (max-width: 767.98px) {
	.elementor-widget-alvido_history {
		padding-inline: 15px;
	}
}

/* Preloader: GamesCon "G" mark, a bit larger than the demo icon. */
#preloader .loader .loader-icon img {
	width: 48px;
}

/* Homepage marquee: the same "G" mark; the SVG has no intrinsic size, so match the demo icon's 60px. */
.marquee-area-3.marquee-wrap .marquee__group .m-item .skull-icon img {
	width: 60px;
}

@media (max-width: 1199.98px) {
	.marquee-area-3.marquee-wrap .marquee__group .m-item .skull-icon img {
		width: 40px;
	}
}

/* Homepage counters: dark "G" mark on the yellow disc, sized like the demo icon. */
.counter__wrap .title-icon img {
	width: 50px;
}

@media (max-width: 767.98px) {
	.counter__wrap .title-icon img {
		width: 40px;
	}
}

/* Header 01: plain logo on the left (no dark trapezoid tab) and no search button. */
.tg-header__area-three .logo {
	position: static;
	transform: none;
	padding: 28px 0;
	background: none;
	clip-path: none;
}

.tg-header__area-three .tgmenu__nav {
	margin-top: 0;
}

.tg-header__area-three .tgmenu__action .search,
.popup-search-box {
	display: none !important;
}

.tg-header__area-three .tgmenu__navbar-wrap {
	margin-left: 48px;
}

/* Highlighted menu item (Partneri): always outlined in yellow; filled like any other item when active. */
.tg-header__area-three .tgmenu__navbar-wrap > ul > li.gc-menu-highlight > a {
	border-radius: 40px;
	box-shadow: inset 0 0 0 2px var(--gc-yellow);
	color: var(--gc-yellow);
}

.tg-header__area-three .tgmenu__navbar-wrap > ul > li.gc-menu-highlight.active > a {
	color: var(--tg-heading-color);
}

.tgmobile__menu .navigation li.gc-menu-highlight > a {
	color: var(--gc-yellow);
}

/* The divider after the email only separated it from the (removed) search button. */
.tg-header__area-three .tgmenu__action ul li.link::after {
	display: none;
}

/* Footer newsletter: the demo's single-line field with an arrow button (undo the generic CF7 field styling). */
.footer__newsletter .newsletter__form {
	position: relative;
}

.footer__newsletter .wpcf7-form-control-wrap {
	display: block;
}

.wpcf7 .footer__newsletter input.wpcf7-form-control:not([type="submit"]) {
	height: 60px;
	padding: 0 64px 0 24px;
	border: 1px solid rgba(255, 255, 255, 0.15);
	background: #14171c;
}

.footer__newsletter .newsletter__form .btn {
	position: absolute;
	top: 0;
	right: 0;
	width: 60px;
	height: 60px;
	padding: 0;
	background: transparent;
	box-shadow: none;
	color: var(--gc-yellow);
	font-size: 18px;
}

.footer__newsletter .newsletter__form .btn::after,
.footer__newsletter .newsletter__form .btn::before {
	display: none;
}

/* Homepage hero: countdown to the right of the big "Games.con 2026" heading on wide screens. */
.elementor-element-c6a9a65 {
	position: relative;
}

@media (min-width: 1400px) {
	.elementor-widget.gc-hero-countdown {
		position: absolute;
		top: 50%;
		right: 24px;
		width: auto;
		transform: translateY(-50%);
	}
}

@media (max-width: 1399.98px) {
	.elementor-widget.gc-hero-countdown {
		margin-top: 32px;
		width: 100%;
	}

	.gc-hero-countdown .gc-countdown {
		display: flex;
		max-width: 520px;
	}
}

/* History timeline: photos in the demo's 490x400 frame instead of their full (much larger) size. */
.history-card .history-card-thumb .thumb {
	max-width: 490px;
}

.history-card .history-card-thumb img {
	width: 100%;
	aspect-ratio: 49 / 40;
	object-fit: contain;   /* key visuals carry text, so they are letterboxed rather than cropped */
	background: #05080a;
}

/* Back-to-top button (markup from functions.php): larger, with a soft yellow glow. The parent pins it
   at bottom: 25px below 1200px, so it would sit over the hero countdown before any scrolling; here it
   stays hidden below the viewport on every width until main.js adds "open". */
.scroll__top {
	width: 48px;
	height: 48px;
	right: 30px;
	bottom: -80px;
	font-size: 20px;
	color: #050505;
	box-shadow: 0 0 0 4px rgba(249, 205, 54, 0.12), 0 8px 24px rgba(249, 205, 54, 0.35);
	transition: bottom 0.6s ease, background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}

.scroll__top::after {
	display: none;
}

.scroll__top:hover,
.scroll__top:focus-visible {
	color: #050505;
	background: var(--tg-theme-primary);
	box-shadow: 0 0 0 6px rgba(249, 205, 54, 0.2), 0 10px 32px rgba(249, 205, 54, 0.55);
}

.scroll__top.open {
	bottom: 30px;
}

@media (max-width: 767.98px) {
	.scroll__top {
		right: 16px;
		width: 48px;
		height: 48px;
		bottom: -80px;
	}

	.scroll__top.open {
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	}
}

/* GamesCon G mark in the centre of the rotating badges (added and kept upright by badge-mark.js). */
.about-tag .gc-badge-mark {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 38%;
	height: 38%;
	margin: auto;
	background: url("../img/gc-mark.svg") center / contain no-repeat;
	pointer-events: none;
}

/* Sponsor banner slots (inc/ad-slots.php). */
.gc-ad img {
	display: block;
	width: 100%;
	height: auto;
}

.gc-archive__header--ad {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px 48px;
}

.gc-archive__header--ad .gc-archive__intro {
	flex: 0 1 560px;
}

.gc-archive__header--ad .gc-ad--header {
	flex: 1 1 480px;
	max-width: 728px;
	margin-bottom: 40px;
}

@media (max-width: 991.98px) {
	.gc-archive__header--ad {
		display: block;
	}
}

.gc-grid__ad {
	grid-column: 1 / -1;
	margin: 16px 0;
}

.gc-grid__ad[hidden] {
	display: none;
}

/* Below four columns the banner after every fourth card would leave a gap in its row: let the
   following cards fill it. */
@media (max-width: 1199px) {
	.gc-grid {
		grid-auto-flow: dense;
	}
}

.gc-ad-feed {
	margin: 0 0 40px;
}
