/**
 * Arena Padel — extras.css
 *
 * Apenas estilos não cobertos por theme.json:
 *  - skip-link
 *  - botão flutuante de WhatsApp
 *  - hero refinement (object-fit do vídeo, foco do CTA)
 *  - hover suave em imagens das galerias
 *  - sponsors em escala de cinza com cor no hover
 *  - stats em destaque
 *  - reduced-motion fallback
 */

/* ----------------------------------------------------------- */
/*  Skip link (acessibilidade)                                   */
/* ----------------------------------------------------------- */
.skip-link.screen-reader-text {
	background: #fff;
	color: #0A0A0A;
	left: 50%;
	padding: .75rem 1rem;
	position: absolute;
	top: -100px;
	transform: translateX(-50%);
	transition: top .2s ease;
	z-index: 100000;
	border-radius: 0 0 8px 8px;
	font-weight: 700;
}
.skip-link.screen-reader-text:focus {
	top: 0;
	outline: 2px solid #FF6B1A;
}

/* ----------------------------------------------------------- */
/*  Botão flutuante de WhatsApp                                  */
/* ----------------------------------------------------------- */
.arena-padel-floating-wa {
	position: fixed;
	right: clamp(1rem, 3vw, 2rem);
	bottom: clamp(1rem, 3vw, 2rem);
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	padding: .85rem 1.25rem .85rem 1rem;
	background: #25D366;
	color: #0A0A0A;
	font-family: "Montserrat", system-ui, sans-serif;
	font-weight: 700;
	font-size: .95rem;
	text-decoration: none;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .35), 0 2px 4px rgba(0, 0, 0, .2);
	z-index: 9999;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.arena-padel-floating-wa:hover,
.arena-padel-floating-wa:focus-visible {
	transform: translateY(-2px);
	background: #1ebe57;
	color: #0A0A0A;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .45);
	outline: none;
}
.arena-padel-floating-wa:focus-visible {
	outline: 3px solid #FF6B1A;
	outline-offset: 3px;
}
.arena-padel-floating-wa__icon {
	flex-shrink: 0;
}
@media (max-width: 600px) {
	.arena-padel-floating-wa__label {
		display: none;
	}
	.arena-padel-floating-wa {
		padding: .85rem;
	}
}

/* ----------------------------------------------------------- */
/*  Hero — vídeo de fundo                                        */
/* ----------------------------------------------------------- */
.arena-padel-hero {
	overflow: hidden;
	position: relative;
	isolation: isolate;
}
.arena-padel-hero .wp-block-cover__video-background {
	object-fit: cover;
	width: 100%;
	height: 100%;
	filter: saturate(1.15) contrast(1.05);
	transform: scale(1.02);
}
.arena-padel-hero h1 em {
	font-style: normal;
	color: #FF6B1A;
	background: linear-gradient(120deg, #FF8030 0%, #FF6B1A 60%, #C7E03A 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
.arena-padel-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 20% 22%, rgba(255, 107, 26, .26), transparent 40%),
		radial-gradient(circle at 78% 20%, rgba(30, 95, 191, .24), transparent 42%);
	mix-blend-mode: screen;
	pointer-events: none;
	z-index: 1;
}
.arena-padel-hero::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 120px;
	background: linear-gradient(180deg, transparent 0%, #0A0A0A 100%);
	pointer-events: none;
	z-index: 1;
}
.arena-padel-hero .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	text-shadow: 0 10px 30px rgba(0, 0, 0, .5);
}

/* ----------------------------------------------------------- */
/*  Header sticky com leve blur ao rolar                         */
/* ----------------------------------------------------------- */
.arena-padel-header {
	transition: backdrop-filter .2s ease, background-color .2s ease, box-shadow .2s ease;
	border-bottom: 1px solid transparent;
}
.arena-padel-header.is-scrolled {
	backdrop-filter: blur(12px);
	background-color: rgba(10, 10, 10, .82) !important;
	box-shadow: 0 4px 24px rgba(0, 0, 0, .3);
	border-bottom-color: rgba(255, 107, 26, .28);
}
.arena-padel-header__row {
	gap: clamp(1rem, 2vw, 2rem);
}
.arena-padel-brand {
	gap: .75rem;
	min-width: 260px;
	align-items: center;
}
.arena-padel-brand__logo {
	margin: 0;
	line-height: 0;
	flex-shrink: 0;
}
.arena-padel-brand__logo img {
	display: block;
	width: clamp(170px, 20vw, 280px);
	max-width: 100%;
	max-height: 88px;
	height: auto;
	object-fit: contain;
	filter: drop-shadow(0 4px 20px rgba(0, 0, 0, .35));
}
.arena-padel-brand__title {
	margin: 0;
	font-weight: 600;
	letter-spacing: .015em;
	font-size: clamp(.78rem, 1vw, .92rem) !important;
	opacity: .9;
}
.arena-padel-header__nav {
	flex: 1;
	justify-content: flex-end;
}
.arena-padel-nav__ranking-item .wp-block-navigation-item__content {
	background: linear-gradient(120deg, rgba(255, 107, 26, .24), rgba(30, 95, 191, .2));
	border: 1px solid rgba(255, 107, 26, .45);
	border-radius: 999px;
	box-shadow: 0 6px 20px rgba(255, 107, 26, .2);
	font-weight: 700;
	padding: .48rem .92rem;
	position: relative;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.arena-padel-nav__ranking-item .wp-block-navigation-item__content::after {
	content: "DESTAQUE";
	display: inline-block;
	margin-left: .5rem;
	font-size: .58rem;
	letter-spacing: .1em;
	padding: .18rem .38rem;
	border-radius: 999px;
	background: #FF6B1A;
	color: #0A0A0A;
	vertical-align: middle;
}
.arena-padel-nav__ranking-item .wp-block-navigation-item__content:hover,
.arena-padel-nav__ranking-item .wp-block-navigation-item__content:focus-visible {
	transform: translateY(-1px);
	border-color: rgba(255, 107, 26, .75);
	box-shadow: 0 10px 26px rgba(255, 107, 26, .3);
	text-decoration: none;
	outline: none;
}
.arena-padel-header__cta {
	flex-shrink: 0;
	gap: .65rem;
}
.arena-padel-cta--ranking .wp-element-button {
	backdrop-filter: blur(4px);
	border-color: rgba(255, 107, 26, .9) !important;
	box-shadow: inset 0 0 0 1px rgba(255, 107, 26, .24), 0 8px 22px rgba(255, 107, 26, .2);
}
.arena-padel-cta--ranking .wp-element-button:hover,
.arena-padel-cta--ranking .wp-element-button:focus-visible {
	background: rgba(255, 107, 26, .1) !important;
}
.arena-padel-main {
	overflow-x: clip;
}
@media (max-width: 1080px) {
	.arena-padel-header .wp-block-group.arena-padel-header__row {
		flex-wrap: wrap;
		justify-content: center;
	}
	.arena-padel-brand {
		justify-content: center;
		min-width: 100%;
	}
	.arena-padel-header__nav {
		order: 3;
		width: 100%;
		justify-content: center;
	}
}
@media (max-width: 640px) {
	.arena-padel-header {
		padding-right: 1rem !important;
		padding-left: 1rem !important;
	}
	.arena-padel-header__row {
		gap: .75rem;
	}
	.arena-padel-brand {
		gap: .45rem;
	}
	.arena-padel-brand__logo img {
		width: clamp(124px, 40vw, 172px);
		max-height: 54px;
	}
	.arena-padel-brand__title {
		font-size: .68rem !important;
		text-align: center;
		line-height: 1.25;
	}
	.arena-padel-header__nav {
		width: 100%;
	}
	.arena-padel-header__nav .wp-block-navigation__responsive-container-content {
		padding-inline: 1rem;
	}
	.arena-padel-header__nav .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
		align-items: flex-start;
		gap: .75rem;
	}
	.arena-padel-header__nav .wp-block-navigation-item {
		width: 100%;
	}
	.arena-padel-header__nav .wp-block-navigation-item__content {
		display: block;
		width: 100%;
		text-align: left;
		white-space: normal;
		overflow-wrap: anywhere;
	}
	.arena-padel-nav__ranking-item .wp-block-navigation-item__content::after {
		float: right;
		margin-left: .75rem;
	}
	.arena-padel-header__cta {
		width: 100%;
		justify-content: center;
	}
}

/* ----------------------------------------------------------- */
/*  Galerias e cards — hover suave                               */
/* ----------------------------------------------------------- */
.wp-block-image.has-custom-border,
.arena-padel-image-frame {
	overflow: hidden;
	position: relative;
	box-shadow: 0 12px 36px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .04) inset;
}
.wp-block-image.has-custom-border img,
.arena-padel-image-frame img {
	transition: transform .5s cubic-bezier(.2,.8,.2,1);
	display: block;
}
.wp-block-image.has-custom-border:hover img,
.arena-padel-image-frame:hover img {
	transform: scale(1.04);
}

/* ----------------------------------------------------------- */
/*  Galeria de quadras — cards uniformes                         */
/* ----------------------------------------------------------- */
#quadras .wp-block-column {
	transition: transform .3s ease;
}
#quadras .wp-block-column:hover {
	transform: translateY(-4px);
}
#quadras .wp-block-image img {
	aspect-ratio: 4/3;
	object-fit: cover;
	width: 100%;
}

/* ----------------------------------------------------------- */
/*  Stats — números grandes com leve glow                        */
/* ----------------------------------------------------------- */
.arena-padel-stats h2 {
	line-height: 1;
	margin-bottom: .25rem !important;
	text-shadow: 0 2px 24px rgba(255, 107, 26, .15);
}

/* ----------------------------------------------------------- */
/*  Aulas — cards com leve elevação                              */
/* ----------------------------------------------------------- */
#aulas .wp-block-column {
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
#aulas .wp-block-column:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .4);
}

/* ----------------------------------------------------------- */
/*  Torneios — cards padronizados                                */
/* ----------------------------------------------------------- */
#torneios .wp-block-column {
	transition: transform .25s ease, box-shadow .25s ease;
	position: relative;
	overflow: hidden;
}
#torneios .wp-block-column::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(135deg, rgba(255, 107, 26, .35), rgba(30, 95, 191, .35));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	        mask-composite: exclude;
	pointer-events: none;
	opacity: 0;
	transition: opacity .25s ease;
}
#torneios .wp-block-column:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .4);
}
#torneios .wp-block-column:hover::before {
	opacity: 1;
}

/* ----------------------------------------------------------- */
/*  Sponsors — escala de cinza com cor no hover                  */
/* ----------------------------------------------------------- */
.arena-padel-sponsor img {
	filter: grayscale(1) brightness(1.5);
	opacity: .65;
	transition: filter .25s ease, opacity .25s ease, transform .25s ease;
	max-height: 56px;
	width: auto;
	object-fit: contain;
}
.arena-padel-sponsor:hover img,
.arena-padel-sponsor:focus-within img {
	filter: grayscale(0) brightness(1);
	opacity: 1;
	transform: scale(1.05);
}
.arena-padel-sponsors {
	row-gap: 2rem;
	column-gap: 3rem !important;
	align-items: center;
}

/* ----------------------------------------------------------- */
/*  CTA final — gradiente de marca com leve textura              */
/* ----------------------------------------------------------- */
#contato {
	position: relative;
	overflow: hidden;
}
#contato::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .12) 0, transparent 40%),
		radial-gradient(circle at 80% 70%, rgba(199, 224, 58, .18) 0, transparent 45%);
	pointer-events: none;
}
#contato > * { position: relative; z-index: 1; }

/* ----------------------------------------------------------- */
/*  Mapa — moldura suave                                         */
/* ----------------------------------------------------------- */
.arena-padel-map-frame {
	box-shadow: 0 16px 40px rgba(0, 0, 0, .35);
	transition: transform .3s ease;
}
.arena-padel-map-frame:hover {
	transform: scale(1.005);
}

/* ----------------------------------------------------------- */
/*  Botões — força foco visível (acessibilidade)                 */
/* ----------------------------------------------------------- */
.wp-block-button__link:focus-visible {
	outline: 3px solid #C7E03A;
	outline-offset: 3px;
}
.wp-block-button__link {
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
}
.wp-block-button__link:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 22px rgba(255, 107, 26, .25);
}

/* ----------------------------------------------------------- */
/*  Reduce motion — desativa autoplay e animações                */
/* ----------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	.arena-padel-hero .wp-block-cover__video-background {
		display: none !important;
	}
	.arena-padel-hero {
		background-image: url('../images/hero-bg-main.jpg');
		background-size: cover;
		background-position: center;
	}
}

/* ----------------------------------------------------------- */
/*  Mobile refinements                                           */
/* ----------------------------------------------------------- */
@media (max-width: 781px) {
	.arena-padel-stats .wp-block-columns {
		gap: 2rem 1rem !important;
	}
	.arena-padel-stats .wp-block-column {
		flex-basis: 45% !important;
	}
}
@media (max-width: 600px) {
	.arena-padel-hero {
		min-height: 80vh !important;
	}
	.wp-block-buttons.is-layout-flex {
		gap: .75rem;
	}
	.arena-padel-sponsors {
		justify-content: center !important;
	}
}