/*	–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	CORE/BRAND/CLASSES.CSS
	––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/**
 * VISIOFRAMEWORK
 * This file is part of VISIOFRAMEWORK.
 * @package		visioframework
 * @author		Agência Visio <contato@agenciavisio.com.br>
 * @copyright	Copyright (c) 2023-present. M. Souza & Souza LTDA. (CNPJ: 21.284.748/0001-33). All rights reserved.
 * @license		Proprietary
 * @link		https://www.agenciavisio.com.br
 */

[class^='brand-'],
[class*=' brand-'] {
	height			: var(--brand-height)	!important;
	width			: auto					!important;
	max-width		: 100%;
	--brand-height	: 0;
}

/*	Structural wrappers, not artwork — they match the rule above by name alone.
	Harmless while the link stays inline, but a flex parent blockifies it and the
	zero height starts applying, dropping its contents out of the box. */
.brand--link,
.brand--skin {
	height	: auto	!important;
}

.brand-15 {
	--brand-height: 15px !important;
}

.brand-20 {
	--brand-height: 20px !important;
}

.brand-25 {
	--brand-height: 25px !important;
}

.brand-30 {
	--brand-height: 30px !important;
}

.brand-35 {
	--brand-height: 35px !important;
}

.brand-40 {
	--brand-height: 40px !important;
}

.brand-45 {
	--brand-height: 45px !important;
}

.brand-50 {
	--brand-height: 50px !important;
}

.brand-55 {
	--brand-height: 55px !important;
}

.brand-60 {
	--brand-height: 60px !important;
}

.brand-65 {
	--brand-height: 65px !important;
}

.brand-70 {
	--brand-height: 70px !important;
}

.brand-75 {
	--brand-height: 75px !important;
}

.brand-80 {
	--brand-height: 80px !important;
}

.brand-85 {
	--brand-height: 85px !important;
}

.brand-90 {
	--brand-height: 90px !important;
}

.brand-95 {
	--brand-height: 95px !important;
}

.brand-100 {
	--brand-height: 100px !important;
}

.brand-105 {
	--brand-height: 105px !important;
}

.brand-110 {
	--brand-height: 110px !important;
}

.brand-115 {
	--brand-height: 115px !important;
}

.brand-120 {
	--brand-height: 120px !important;
}

.brand-125 {
	--brand-height: 125px !important;
}

.brand-130 {
	--brand-height: 130px !important;
}

.brand-135 {
	--brand-height: 135px !important;
}

.brand-140 {
	--brand-height: 140px !important;
}

.brand-145 {
	--brand-height: 145px !important;
}

.brand-150 {
	--brand-height: 150px !important;
}

.brand-155 {
	--brand-height: 155px !important;
}

.brand-160 {
	--brand-height: 160px !important;
}

.brand-165 {
	--brand-height: 165px !important;
}

.brand-170 {
	--brand-height: 170px !important;
}

.brand-175 {
	--brand-height: 175px !important;
}

.brand-180 {
	--brand-height: 180px !important;
}

.brand-185 {
	--brand-height: 185px !important;
}

.brand-190 {
	--brand-height: 190px !important;
}

.brand-195 {
	--brand-height: 195px !important;
}

.brand-200 {
	--brand-height: 200px !important;
}

.brand-205 {
	--brand-height: 205px !important;
}

.brand-210 {
	--brand-height: 210px !important;
}

.brand-215 {
	--brand-height: 215px !important;
}

.brand-220 {
	--brand-height: 220px !important;
}

.brand-225 {
	--brand-height: 225px !important;
}

.brand-230 {
	--brand-height: 230px !important;
}

.brand-235 {
	--brand-height: 235px !important;
}

.brand-240 {
	--brand-height: 240px !important;
}

.brand-245 {
	--brand-height: 245px !important;
}

.brand-250 {
	--brand-height: 250px !important;
}

/* #region		BRAND TEXT */

/*	The wordmark that stands in for missing artwork. Caught by the rule above too —
	which is the point: it gets the height the artwork would have had, and derives
	its font size from that, so one BrandSize keeps governing both. */
.brand--text {
	display			: inline-block;

	/*	The viewport cap only bites on narrow screens, where a wordmark sized for
		the artwork's height would be wider than the column holding it. */
	font-size		: min(calc(var(--brand-height) * 0.42), 7vw);
	font-weight		: 700;
	line-height		: var(--brand-height);
	letter-spacing	: -0.02em;
	white-space		: nowrap;
	overflow		: hidden;
	text-overflow	: ellipsis;
}

/* #endregion	BRAND TEXT */