/*
Theme Name: Autódromo Fueltech
Theme URI: https://autodromofueltech.com.br
Template: hello-elementor
Author: Pante Sites e Sistemas
Author URI: https://pante.com.br/?utm_source=client&utm_medium=footer&utm_campaign=fueltech
Description: Site desenvolvido exclusivamente para o Autódromo Fueltech - Velopark. Ele é um dos principais palcos do automobilismo nacional, recebendo grandes eventos e competições que marcaram a história de pilotos e fãs de velocidade.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 1.1.1
*/

header .elementor-nav-menu .elementor-item::before,
header .elementor-nav-menu--main .elementor-item.elementor-item-active::before {
	content: url('/wp-content/uploads/2025/12/grafismo.png');
	left: -5px;
	background: transparent !important;
}

.titulo-grafismo {
  	position: relative;
  	width: 100%;
}

.titulo-grafismo::before {
  	content: '';
  	background: url('/wp-content/uploads/2025/12/grafismo-titulos.png') no-repeat;
  	position: absolute;
  	left: 0;
  	top: 0;
  	z-index: 0;
	width: 146px;
	height: 100%;
}

.titulo-inner {
  	--p: 20px;
    position: relative;
    color: white;
    display: block;
    width: 90%;
    margin-left: auto;
    text-align: center;
    font-family: 'Exo 2';
	line-height: 1.2;
    font-size: 60px;
    font-weight: 600;
    font-style: italic;
    text-transform: uppercase;
    z-index: 1;
    height: 74px;
    clip-path: polygon(var(--p) 0, 100% 0, calc(100% - var(--p)) 100%, 0 100%);
    background-color: var( --e-global-color-primary );
}

.inner-angled-btn button,
.inner-angled-btn .elementor-button,
.angled-btn {
  --p: 10px;
  color: white;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
  clip-path: polygon(
    var(--p) 0,
    100% 0,
    100% calc(100% - var(--p)),
    calc(100% - var(--p)) 100%,
    0 100%,
    0 var(--p)
  )
}

.big-angled-img {
	--p: 50px;
	clip-path: polygon(
		var(--p) 0,
		100% 0,
		100% calc(100% - var(--p)),
		calc(100% - var(--p)) 100%,
		0 100%,
		0 var(--p)
	);
}

@media (max-width:992px) {
	header .elementor-nav-menu .elementor-item::before {
		left: 5px;
	}
	.titulo-grafismo::before {
		background-size: cover;
	}
	.titulo-inner {
		text-align: left;
		padding: 5px 20px 5px 40px;
		height: auto;
		font-size: 28px;
        margin: 0;
        width: 70%;
		margin-left: 30%;
	}
	.titulo-inner-small {
		font-size: 22px;
	}
}

@media (min-width:1024px) {
	.titulo-inner-small {
		font-size: 48px;
		line-height: 1.5;
	}
}