@charset "utf-8";
/* =========================================================
   Academias New Corpore — BASE (global)
   ---------------------------------------------------------
   Arquivo gerado a partir do antigo estilo.css.
   Use para: tipografia, cores, cabeçalho, footer e componentes
   compartilhados em TODAS as páginas.
   ========================================================= */

/*
 * ===============================================
 * | VARIAVEIS GLOBAIS DE COR                    |
 * ===============================================
 */
	:root {
		--primary-color: #eb5c1d;
		--secondary-color: #f0894a;
		--text-dark: #08090a;
		--text-light: #ffffff;
		--background-dark: #08090a;
		--background-light: #ffffff;
		--background-secondary: #f0894a;
		--background-card: #0d0f10;
		--background-grade: #c1c1c1;
		--border-card: #eb5c1d;
		--border-light: #eeeeee;
		--border-section: #e5e5e5;
		--text-card: #cccccc;
		--footer-text-light: #f0894a;
		--footer-text-secondary: #aaaaaa;
		--shadow-soft: 0px 6px 12px rgba(0,0,0,0.15);
		--shadow-strong: 0px 10px 20px rgba(0,0,0,0.2);
		--radius: 15px;
		--transition: 0.3s ease;
		/* Altura do cabeçalho fixo (topbar + navbar). */
		/* JS (base.js) recalcula automaticamente para evitar “barra branca”/gap. */
		--nc-header-offset: 112px;
		--focus-ring: rgba(240, 137, 74, 0.35);
		--focus-ring-soft: rgba(240, 137, 74, 0.25);
		--space-sm: 12px;
		--space-md: 20px;
		--space-lg: 40px;
		--space-xl: 60px;
		--font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
		/* Tipografia (padrão do projeto) */
		--fs-body: 1rem;
		--lh-body: 1.6;
		--fw-regular: 400;
		--fw-medium: 500;
		--fw-semibold: 600;
		--fw-bold: 700;
		--fw-extrabold: 800;
		--fw-black: 900;
		--ls-heading: -0.01em;
		--fs-h1: 2.5rem;
		--fs-h2: 2rem;
		--fs-h3: 1.75rem;
		--fs-h4: 1.5rem;
		--fs-h5: 1.25rem;
		--fs-h6: 1rem;
	}

/*
 * ===============================================
 * | ESTILO BASE E LAYOUT                        |
 * ===============================================
 */
	body {
		padding-top: var(--nc-header-offset); /* Ajustado para a altura do cabeçalho fixo */
		font-family: var(--font-base); /* Fonte padrão (referência: seção Bem-vindo) */
		font-size: var(--fs-body);
		line-height: var(--lh-body);
		font-weight: var(--fw-regular);
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
	}

/* =========================================================
   Tipografia global (H1–H6, parágrafos, botões e formulários)
   Mantém o visual atual, mas deixa consistente
   ========================================================= */
	h1, 	h2, 	h3, 	h4, 	h5, 	h6{
		font-family: var(--font-base);
		line-height: 1.15;
		letter-spacing: var(--ls-heading);
		margin-top: 0;
		margin-bottom: .6rem;
		font-weight: var(--fw-extrabold);
	}

	h1{ font-size: var(--fs-h1); }
	h2{ font-size: var(--fs-h2); }
	h3{ font-size: var(--fs-h3); }
	h4{ font-size: var(--fs-h4); }
	h5{ font-size: var(--fs-h5); }
	h6{ font-size: var(--fs-h6); }

	p{
		margin-top: 0;
		margin-bottom: 1rem;
		line-height: var(--lh-body);
	}

	small, .small{ font-size: .875em; }

	button, input, select, textarea{
		font-family: var(--font-base);
		font-size: 1rem;
		line-height: var(--lh-body);
	}

	.btn, button, input[type="button"], input[type="submit"], input[type="reset"]{
		font-weight: var(--fw-bold);
		letter-spacing: .01em;
	}

	.btn-lg{ font-size: 1.05rem; }
	.btn-sm{ font-size: .9rem; }

/* =========================================================
   Transições suaves (hover/focus) — padronização
   Mantém o visual atual, apenas suaviza as mudanças de cor
   ========================================================= */
a,
.navbar-nav .nav-link,
.dropdown-menu .dropdown-item,
.btn,
button,
[role="button"],
input,
select,
textarea{
	transition:
		color var(--transition),
		background-color var(--transition),
		border-color var(--transition),
		box-shadow var(--transition),
		opacity var(--transition),
		transform 0.12s ease;
}

/* Ajuste de padding para topbar + navbar (header fixo) */
	@media (max-width: 575.98px) {
		:root{ --nc-header-offset: 126px; }
	}
.caixa {
    	padding: 60px 0;
    	border-bottom: 4px solid var(--border-section);
	}


/* =========================================================
   Componentes reutilizáveis (kicker + lead de seção)
   ========================================================= */
.nc-kicker{
	display:inline-block;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(235,92,29,.12);
	color: var(--primary-color);
	font-weight: 800;
	font-size: .82rem;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.nc-kicker--dark{
	background: rgba(235,92,29,.18);
	color: #ffffff;
	border: 1px solid rgba(235,92,29,.30);
}

.nc-section-lead{
	font-size: 1.02rem;
	line-height: 1.7;
	color: rgba(255,255,255,.72);
}

/* =========================================================
   Pills e cards auxiliares (usados em páginas internas)
   ========================================================= */
.nc-pill{
	display:inline-flex;
	align-items:center;
	gap: 8px;
	padding: 7px 10px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid rgba(0,0,0,.045);
	color: rgba(0,0,0,.76);
	font-weight: 700;
	font-size: .86rem;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition), transform 0.12s ease;
}
.nc-pill i{ color: var(--primary-color); }
.nc-pill:hover{
	background: rgba(235,92,29,.08);
	border-color: rgba(235,92,29,.25);
	color: rgba(0,0,0,.86);
}

.card-mvv{
	background: rgba(255,255,255,.03);
	border: 1px solid rgba(235,92,29,.18);
	border-radius: 18px;
	padding: 20px 18px;
	box-shadow: 0 14px 40px rgba(0,0,0,.22);
	transition: transform .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.card-mvv:hover{
	transform: translateY(-4px);
	background: rgba(255,255,255,.05);
	border-color: rgba(235,92,29,.45);
	box-shadow: 0 18px 50px rgba(0,0,0,.30);
}
.card-mvv h4{
	color: #ffffff;
	font-weight: 900;
	margin: 0 0 10px 0;
}
.card-mvv h4 i{
	width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	background: rgba(235,92,29,.16);
	color: var(--primary-color);
	box-shadow: 0 12px 28px rgba(0,0,0,.22);
	margin-right: 10px !important;
	vertical-align: middle;
}

.card-mvv p,
.card-mvv li{
	color: rgba(255,255,255,.80);
}


/* =========================================================
   Cards com hover (reutilizável) — mesmo efeito da index
   Use em páginas internas (ex.: Sobre nós)
   ========================================================= */
.nc-hover-card{
	border-radius: 18px;
	border: 1px solid rgba(0,0,0,.08);
	background: #ffffff;
	box-shadow: 0 14px 40px rgba(0,0,0,.08);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease;
	will-change: transform;
}

.nc-hover-card:hover{
	transform: translateY(-4px);
	box-shadow: 0 18px 50px rgba(0,0,0,.12);
	border-color: rgba(235,92,29,.25);
	background-color: rgba(235,92,29,.04);
}

.nc-hover-card:focus-within{
	border-color: rgba(235,92,29,.35);
	box-shadow: 0 0 0 3px var(--focus-ring), 0 18px 50px rgba(0,0,0,.12);
}

.nc-hover-card__icon{
	width: 42px;
	height: 42px;
	border-radius: 14px;
	background: rgba(235,92,29,.12);
	display:flex;
	align-items:center;
	justify-content:center;
	flex: 0 0 auto;
	transition: transform .25s ease, background-color .25s ease;
}

.nc-hover-card__icon i{ color: var(--primary-color); }

.nc-hover-card:hover .nc-hover-card__icon{
	background: rgba(235,92,29,.18);
	transform: translateY(-1px);
}

/* =========================================================
   Card "glass" para banner (Sobre nós) + hover suave
   ========================================================= */
.nc-glass-card{
	padding: 20px 18px;
	border-radius: 18px;
	background: rgba(0,0,0,.35);
	border: 1px solid rgba(255,255,255,.18);
	box-shadow: 0 18px 55px rgba(0,0,0,.25);
	transition: transform .25s ease, border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
}

@supports ((-webkit-backdrop-filter: blur(6px)) or (backdrop-filter: blur(6px))){
	.nc-glass-card{
		-webkit-backdrop-filter: blur(6px);
		backdrop-filter: blur(6px);
	}
}

.nc-glass-card:hover{
	transform: translateY(-3px);
	background: rgba(0,0,0,.42);
	border-color: rgba(235,92,29,.35);
	box-shadow: 0 22px 65px rgba(0,0,0,.32);
}

.nc-glass-card .nc-glass-icon{
	width: 44px;
	height: 44px;
	border-radius: 14px;
	background: rgba(235,92,29,.22);
	display:flex;
	align-items:center;
	justify-content:center;
	color: #ffffff;
}

/* Hover sólido (sem degradê) para manter o laranja por toda a caixa */
	background: rgba(235,92,29,.08) !important;
	box-shadow: 0 18px 50px rgba(0,0,0,.12) !important;
}


/*
 * ===============================================
 * | ESTILOS DE BOTES                           |
 * ===============================================
 */
/* Evita "seleção azul" ao clicar e segurar (desktop) */
.btn,
a.btn,
button,
[role="button"]{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

	.btn-primary {
    	background-color: var(--primary-color);
    	border-color: var(--secondary-color);
    	color: var(--text-light);
		transition: background-color var(--transition), border-color var(--transition), color var(--transition), transform 0.12s ease;

	}

	.btn-primary:hover,
	.btn-primary:focus,
	.btn-primary:active {
    	background-color: var(--text-dark);
    	border-color: var(--primary-color);
	}


/* =========================================================
   Bootstrap 4: estado :active tem seletor mais específico e pode voltar ao azul padrão.
   Garantimos que o clique/pressão permaneça 100% na paleta New Corpore.
   ========================================================= */
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
	background-color: var(--text-dark) !important;
	border-color: var(--primary-color) !important;
	color: var(--text-light) !important;
}

.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
	background-color: var(--primary-color) !important;
	border-color: var(--secondary-color) !important;
	color: var(--text-dark) !important;
}

	.btn-secondary {
    	background-color: var(--background-card);
    	border-color: var(--primary-color);
    	color: var(--text-light);
    	transition: background-color 0.3s ease, border-color 0.3s ease;
	}

	.btn-secondary:hover {
    	background-color: var(--primary-color);
    	border-color: var(--secondary-color);
    	color: var(--text-dark);
	}


/*
 * ===============================================
 * | FOCO/ATIVO - REMOVER AZUL DO BOOTSTRAP       |
 * ===============================================
 * O Bootstrap 4 aplica um "focus ring" azul (box-shadow) em .btn:focus e .btn:active:focus.
 * Aqui trocamos esse brilho pelo tom da marca (secondary).
 */
.btn:focus,
.btn.focus,
.btn:not(:disabled):not(.disabled):active:focus,
.btn:not(:disabled):not(.disabled).active:focus,
.show > .btn.dropdown-toggle:focus {
	outline: none !important;
	box-shadow: 0 0 0 0.2rem var(--focus-ring) !important;
}

/* Melhora experiência no mobile (tap highlight) */
.btn,
a.btn {
	-webkit-tap-highlight-color: var(--focus-ring-soft);
}


/* =========================================================
   Foco/ativo em botões fora do Bootstrap (.btn)
   Ex.: botão do chat, botões customizados.
   Remove o azul nativo do navegador e aplica o foco na cor secundária.
   ========================================================= */
button:focus,
button:active:focus,
[type="button"]:focus,
[type="submit"]:focus,
[type="reset"]:focus {
	outline: none !important;
	box-shadow: 0 0 0 0.2rem var(--focus-ring) !important;
}

#chat-toggle:active {
	background: var(--text-dark);
}

#chat-send:focus,
#chat-send:active:focus,
#chat-toggle:focus,
#chat-toggle:active:focus {
	outline: none !important;
	box-shadow: 0 0 0 0.2rem var(--focus-ring) !important;
}

/*
 * ===============================================
 * |    ESTILOS DE SEES - Pgina principal     |
 * ===============================================
 */
	#inicio {
    	background: var(--background-dark);
    	color: var(--text-light);
	}

	#bemvindo {
    	background: var(--background-light);
    	color: var(--text-dark);
	}


/* =========================================================
   BEM-VINDO (Welcome) — elegância + essência de academia
   - Visual clean (sem "caixotes"), tipografia forte e lista de destaques
   ========================================================= */
#bemvindo.nc-welcome-section{
	position: relative;
	overflow: hidden;
}

#bemvindo .nc-welcome__media{
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	border: 1px solid rgba(0,0,0,.045);
	box-shadow: 0 18px 52px rgba(0,0,0,.10);
	background: #fff;
}

#bemvindo .nc-welcome__img{
	display:block;
	width:100%;
	height:100%;
	min-height: 420px;
	object-fit: cover;
}

#bemvindo .nc-welcome__badge{
	position:absolute;
	left: 16px;
	bottom: 16px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 999px;
	background: rgba(0,0,0,.78);
	color: #fff;
	font-weight: 700;
	font-size: .92rem;
	letter-spacing: .01em;
	border: 1px solid rgba(255,255,255,.22);
	backdrop-filter: blur(6px);
}

#bemvindo .nc-welcome__badge i{
	font-size: 1rem;
}

#bemvindo .nc-welcome__content{
	max-width: 620px;
}

#bemvindo .nc-kicker{
	display:inline-block;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(235,92,29,.12);
	color: var(--primary-color);
	font-weight: 800;
	font-size: .82rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: 12px;
}

#bemvindo .nc-welcome__title{
	font-weight: 900;
	letter-spacing: -0.01em;
	margin-bottom: 10px;
}

#bemvindo .nc-welcome__lead{
	font-size: 1.05rem;
	line-height: 1.72;
	color: rgba(0,0,0,.72);
	margin-bottom: 18px;
}

#bemvindo .nc-welcome__list{
	margin-top: 8px;
	margin-bottom: 18px;
}

#bemvindo .nc-welcome__item{
	display:flex;
	gap: 14px;
	padding: 14px 0;
	border-top: 1px solid rgba(0,0,0,.08);
}

#bemvindo .nc-welcome__item:first-child{
	border-top: 0;
	padding-top: 0;
}

#bemvindo .nc-welcome__icon{
	width: 44px;
	height: 44px;
	border-radius: 14px;
	background: rgba(235,92,29,.12);
	color: var(--primary-color);
	display:flex;
	align-items:center;
	justify-content:center;
	flex: 0 0 44px;
	box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

#bemvindo .nc-welcome__text h3{
	font-size: 1.03rem;
	font-weight: 900;
	margin: 0 0 4px 0;
	color: rgba(0,0,0,.88);
}

#bemvindo .nc-welcome__text p{
	margin: 0;
	color: rgba(0,0,0,.68);
	line-height: 1.6;
}

#bemvindo .nc-welcome__cta{
	display:flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 6px;
}

#bemvindo .nc-welcome__meta{
	margin-top: 16px;
	display:flex;
	flex-wrap: wrap;
	gap: 10px;
}

#bemvindo .nc-pill{
	display:inline-flex;
	align-items:center;
	gap: 8px;
	padding: 7px 10px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid rgba(0,0,0,.045);
	color: rgba(0,0,0,.76);
	font-weight: 700;
	font-size: .86rem;
	cursor: default;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
}

#bemvindo .nc-pill i{
	color: var(--primary-color);
	transition: color var(--transition);
}

/* Hover (laranja claro) — Acompanhamento / Ambiente acolhedor / Treino inteligente */
#bemvindo .nc-pill:hover{
	background: rgba(240, 137, 74, 0.14);
	border-color: rgba(240, 137, 74, 0.35);
	color: rgba(0,0,0,.86);
}
#bemvindo .nc-pill:hover i{
	color: var(--secondary-color);
}

/* Ajustes responsivos */
@media (max-width: 991.98px){
	#bemvindo .nc-welcome__img{ min-height: 320px; }
}

@media (max-width: 575.98px){
	#bemvindo .nc-welcome__badge{
		left: 12px;
		bottom: 12px;
		padding: 9px 10px;
		font-size: .88rem;
	}
	#bemvindo .nc-welcome__title{ font-size: 1.65rem; }
}

	#beneficio {
    	background: var(--background-dark);
    	color: var(--primary-color);
	}

	#experiencia-newcorpore {
    	background: var(--background-light);
    	color: var(--text-dark);
	}

	#aulas {
		background: var(--background-dark);
		color: var(--primary-color);
	}

	#unidades {
		background: var(--background-light);
    	color: var(--text-dark);
	}

	#app-newcorpore {
		background: var(--background-secondary);
		color: var(--text-dark);
	}

	#recursos-app {
		background: var(--background-light);
		color: var(--text-dark)
	}
	#grade-horarios {
		background: var(--background-grade);
		color: var(--text-dark);
	}

	#depoimentos {
		background: var(--background-light);
    	color: var(--text-dark);
	}

	#depoimentos-app {
		background: var(--background-grade);
    	color: var(--text-dark);
	}


/*
 * ===============================================
 * |       ESTILOS DOS CARDS - BENEFCIOS        |
 * ===============================================
 */
	#beneficio .card-title {
    	color: var(--primary-color);
    	font-weight: 600;
	}

	#beneficio .card-text {
    	color: var(--text-card);
	}

	#beneficio .card {
    	border: 1px solid var(--primary-color);
    	transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
	}

	#beneficio .card:hover {
    	transform: translateY(-8px);
    	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
	}

	#beneficio .card-body {
    	background-color: var(--background-card);
	}


/* =========================================================
   BENEFÍCIOS — visual mais elegante (menos “caixas”)
   ========================================================= */
#beneficio.nc-benefits-section{
	position: relative;
	overflow: hidden;
}

#beneficio.nc-benefits-section::before{
	/* Removido: ornamento/barra lateral (topo/esquerda) na seção Benefícios */
	content: none;
	display: none;
}

#beneficio .nc-benefit{
	display:flex;
	gap: 14px;
	padding: 18px 16px;
	border-radius: 16px;
	border: 1px solid rgba(255,255,255,.10);
	background: rgba(255,255,255,.02);
	height: 100%;
	transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}

#beneficio .nc-benefit:hover{
	transform: translateY(-4px);
	background: rgba(255,255,255,.05);
	border-color: rgba(235,92,29,.45);
	box-shadow: 0 18px 44px rgba(0,0,0,.28);
}

#beneficio .nc-benefit__icon{
	width: 46px;
	height: 46px;
	flex: 0 0 46px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius: 14px;
	background: rgba(235,92,29,.16);
	color: var(--primary-color);
	box-shadow: 0 12px 28px rgba(0,0,0,.22);
}

#beneficio .nc-benefit__body h3{
	margin: 0 0 6px 0;
	font-size: 1.02rem;
	font-weight: 900;
	color: #ffffff;
	letter-spacing: -0.01em;
}

#beneficio .nc-benefit__body p{
	margin: 0;
	color: rgba(255,255,255,.72);
	line-height: 1.6;
}

#beneficio .nc-benefits__cta{
	margin-top: 18px;
	padding: 18px 16px;
	border-radius: 18px;
	border: 1px solid rgba(255,255,255,.10);
	background: linear-gradient(135deg, rgba(235,92,29,.18), rgba(255,255,255,.02));
	display:flex;
	align-items:center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}

#beneficio .nc-benefits__cta-text h3{
	margin: 0 0 2px 0;
	font-size: 1.22rem;
	font-weight: 900;
	color: #ffffff;
}

#beneficio .nc-benefits__cta-text p{
	margin: 0;
	color: rgba(255,255,255,.78);
}

@media (max-width: 575.98px){
	#beneficio .nc-benefit{ padding: 16px 14px; }
	#beneficio .nc-benefit__icon{ width: 42px; height: 42px; flex-basis: 42px; }
}
/*
 * ===============================================
 * |ESTILOS DOS CARDS - Aulas Treinos Exclusivos |
 * ===============================================
 */
	#aulas .card-title {
		color: var(--primary-color);
		font-weight: 700;
	}

	#aulas .card-text {
		color: var(--text-card);
	}

	#aulas .card {
		border: 1px solid var(--primary-color);
		transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
	}

	#aulas .card:hover {
		transform: translateY(-8px);
		box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
	}

	#aulas .card-body {
		background-color: var(--background-card);
	}

/*
 * ===============================================
 * |       ESTILOS DOS CARDS - Modalidades       |
 * ===============================================
 */
	#todas-aulas .card-title {
		color: var(--primary-color);
		font-weight: 600;
	}

	#todas-aulas .card-text {
		color: var(--text-card);
	}

	#todas-aulas .card {
		border: 1px solid var(--primary-color);
		transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
	}

	#todas-aulas .card:hover {
		transform: translateY(-8px);
		box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
	}

	#todas-aulas .card-body {
		background-color: var(--background-card);
	}

/*
 * ===============================================
 * |			 Estilo dos popups               |
 * ===============================================
 */
	dialog.popup-unidade {
		border: 2px solid var(--border-card);
		border-radius: 16px;
		padding: 20px;
		max-width: 500px;
		width: 90%;
		background-color: var(--background-card);
		color: var(--text-card);
		box-shadow: 0 15px 40px rgba(0,0,0,0.3);
		font-family: var(--font-base);
	}

	/* Backdrop escurecido e blur */
	dialog.popup-unidade::backdrop {
		background: rgba(0,0,0,0.6);
		backdrop-filter: blur(3px);
	}

	/* Cabealho */
	dialog.popup-unidade h3 {
		margin-top: 0;
		color: var(--primary-color);
		font-size: 1.4rem;
		text-align: center;
	}

	/* Contedo */
	dialog.popup-unidade p, 
	dialog.popup-unidade ul {
		margin: 15px 0;
		line-height: 1.6;
	}

	/* Botes */
	dialog.popup-unidade button {
		background-color: var(--primary-color);
		color: var(--text-light);
		border: none;
		padding: 0.6rem 1.2rem;
		border-radius: 10px;
		cursor: pointer;
		transition: background-color 0.2s;
	}

	dialog.popup-unidade button:hover {
		background-color: var(--secondary-color);
	}

	/* Lista dentro do popup */
	dialog.popup-unidade ul li {
		margin-bottom: 0.5rem;
	}

/*
 * ===============================================
 * |    ESTILOS DE SEES - Pgina sobre ns     |
 * ===============================================
 */
	#sobrenos {
		background: var(--background-light);
		color: var(--text-dark);
	}

/*
 * ===============================================
 * |       ESTILOS DE SEES - Pgina Aulas      |
 * ===============================================
 */
	#aulas-destaque {
		background: var(--background-light);
		color: var(--text-dark);
	}

	#todas-aulas {
		background: var(--background-dark);
		color: var(--primary-color);
	}

/*
 * ===============================================
 * |          Estilo cards nossos planos         |
 * ===============================================
 */
	/* Controles do carrossel */
	#carouselPlanos .carousel-control-prev,
	#carouselPlanos .carousel-control-next {
		top: 50%;
	  	transform: translateY(-50%);
	  	width: auto;
	  	height: auto;
	  	background: none;
	}

	#carouselPlanos .carousel-control-prev {
	  	left: -30px;
	}

	#carouselPlanos .carousel-control-next {
	  	right: -30px;
	}

	#carouselPlanos .carousel-control-prev-icon,
	#carouselPlanos .carousel-control-next-icon {
	  	width: 20px;
	  	height: 20px;
	  	background-size: 100% 100%;
	  	filter: invert(100%);
	}
	.plan-card {
	  	text-align: center;
	  	padding: 20px 20px;
	  	background: white;
	  	border-radius: 15px;
	  	box-shadow: 0px 6px 12px rgba(0,0,0,0.2);
	  	border: 2px solid #eb5c1d;
	  	transition: transform 0.3s, box-shadow 0.3s;
	  	height: 100%;
	}

	.plan-card:hover {
	  	transform: translateY(-5px);
	  	box-shadow: 0px 10px 20px rgba(0,0,0,0.15);
	}

	.plan-card h4 {
	  	color: #eb5c1d;
	  	font-weight: bold;
	 	 margin-bottom: 15px;
	}

	.plan-card p {
	  	font-size: 1rem;
	  	color: #333;
	  	margin-bottom: 15px;
	}

	.plan-card .price {
	  	font-size: 1.5rem;
	  	font-weight: bold;
	  	color: #08090a;
	  	margin-bottom: 10px;
	}

	.plan-card .btn {
	  	margin-top: 10px;
	}

/*
 * ===============================================
 * |              Estilo cards App               |
 * ===============================================
 */
	/* ===============================
	   1. Padroniza tamanho dos cards
	   =============================== */
	#depoimentos-app .card {
		height: 100%;               /* fora o card ocupar toda altura disponvel */
		display: flex;              /* usa flexbox */
		flex-direction: column;     /* contedo em coluna */
		justify-content: space-between; /* mantm espaamento consistente */
		border-width: 2px;          /* borda uniforme */
		border-color: #e5e5e5;      /* cor da borda */
		border-radius: 8px;         /* cantos arredondados */
		padding: 20px;              /* espao interno */
	}

	/* ===============================
	   2. Aumenta imagem dos depoimentos
	   =============================== */
	#depoimentos-app .card img.rounded-circle {
		width: 100px;               /* largura maior */
		height: 100px;              /* altura maior */
		object-fit: cover;          /* mantm proporo e preenche */
		margin-bottom: 15px;        /* espao abaixo da imagem */
	}

	/* ===============================
	   3. Estilo das setas do carrossel
	   =============================== */
	#depoimentos-app .carousel-control-prev-icon,
	#depoimentos-app .carousel-control-next-icon {
		width: 20px;                /* largura seta */
		height: 20px;               /* altura seta */
		background-size: 100% 100%; /* garante preenchimento */
		filter: invert(0%) brightness(0); /* seta preta */
	}

	#depoimentos-app .carousel-control-prev,
	#depoimentos-app .carousel-control-next {
		width: 60px;                /* rea clicvel */
		top: 45%;                   /* posiciona verticalmente */
		bottom: auto;               /* remove alinhamento automtico */
		opacity: 0.8;               /* transparncia padro */
		transition: opacity 0.3s;   /* suaviza hover */
	}

	#depoimentos-app .carousel-control-prev:hover,
	#depoimentos-app .carousel-control-next:hover {
		opacity: 1;                 /* aumenta visibilidade no hover */
	}

	#depoimentos-app .carousel-control-prev {
		left: -50px;                /* afasta seta esquerda */
	}
	#depoimentos-app .carousel-control-next {
		right: -50px;               /* afasta seta direita */
	}

/*
 * ==============================================
 * | 		       Estilo iCons                 |
 * ==============================================
*/
.icon-custom {
    color: var(--primary-color) !important;
  }

/*
 * ===============================================
 * |            ESTILOS DO CHATBOT               |
 * ===============================================
 */

	/* Boto Flutuante */
	#chat-toggle {
		position: fixed;
		bottom: 20px;
		right: 20px;
		background: var(--primary-color);
		color: var(--text-light);
		border-radius: 50%;
		width: 60px;
		height: 60px;
		font-size: 28px;
		border: none;
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
		cursor: pointer;
		z-index: 1051;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: background 0.3s ease;
	}

	#chat-toggle:hover {
		background: var(--secondary-color);
	}

	/* Janela do Chat */
	#chat-window {
		position: fixed;
		bottom: 40px;
		right: 15px;
		width: 320px;
		max-width: 90vw;
		height: 410px;
		background: var(--text-light);
		box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
		border-radius: 12px;
		display: none;
		flex-direction: column;
		z-index: 1051;
		font-family: var(--font-base);
	}

	/* Cabealho do Chat */
	#chat-header {
		background: var(--primary-color);
		color: var(--text-light);
		padding: 15px;
		border-top-left-radius: 12px;
		border-top-right-radius: 12px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-weight: 600;
		font-size: 18px;
	}

	/* Boto de Fechar */
	#chat-header button {
		background: transparent;
		border: none;
		color: var(--text-light);
		font-size: 20px;
		cursor: pointer;
	}

	/* rea de Mensagens */
	#chat-messages {
		padding: 20px;
		overflow-y: auto;
		flex-grow: 1;
		background: #f9f9f9;
	}

	/* Mensagens do Bot */
	.message.bot {
		background-color: var(--primary-color);
		color: var(--text-light);
		border-radius: 20px 20px 20px 5px;
		margin-bottom: 5px;
		max-width: 100%;
		padding: 10px 15px;
		animation: fadeIn 0.4s ease;
		font-weight: 500;
	}

	/* Mensagens do Usurio */
	.message.user {
		background-color: #d1d1d1;
		color: #333300;
		border-radius: 20px 20px 5px 20px;
		margin-bottom: 10px;
		max-width: 75%;
		padding: 10px 15px;
		margin-left: auto;
		animation: fadeIn 0.4s ease;
		font-weight: 500;
	}

	/* Formulrio de Input do Chat */
	#chat-form {
		padding: 10px 15px;
		border-top: 1px solid #DDDDDD;
		display: flex;
	}

	#chat-input {
		flex-grow: 1;
		border: 1px solid var(--text-card);
		border-radius: 20px;
		padding: 10px 15px;
		font-size: 15px;
		outline: none;
		transition: border-color 0.3s ease;
	}

	#chat-input:focus {
		border-color: var(--primary-color);
	}

	#chat-send {
		background: var(--primary-color);
		color: var(--text-light);
		border: none;
		border-radius: 20px;
		margin-left: 10px;
		padding: 10px 18px;
		font-weight: 600;
		cursor: pointer;
		transition: background 0.3s ease;
	}

	#chat-send:hover {
		background: var(--secondary-color);
	}

	@keyframes fadeIn {
		from {
			opacity: 0;
			transform: translateY(10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

/*
 * ===============================================
 * |		     Estilo dos Banner               |
 * ===============================================
*/
	

	#banner-unidade-padre-roser {
		background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../imagens/CapaAcademiasNewCorporeSobreNos.jpg') no-repeat top center;
		background-size: cover;
		min-height: 450px;
	}

	#banner-unidade-vista-alegre {
		background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../imagens/CapaAcademiasNewCorporeSobreNos.jpg') no-repeat top center;
		background-size: cover;
		min-height: 450px;
	}

	#banner-unidade-praca-carmo {
		background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('../imagens/CapaAcademiasNewCorporeSobreNos.jpg') no-repeat top center;
		background-size: cover;
		min-height: 450px;
	}

	#contato-hero {
		background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('../imagens/CapaAcademiasNewCorporeSobreNos.jpg') no-repeat center center;
		background-size: cover;
		min-height: 450px;
	}

/*
 * ===============================================
 * 			Estilo do banner Pgina App          |
 * ===============================================
*/
	#app-hero {
		background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('../imagens/CapaAcademiasNewCorporeSobreNos.jpg') no-repeat top center;
		background-size: cover;
		min-height: 450px;
	}

	

/* ================================
			  Boto Saiba Mais 
	   ================================ */
	.btn-saiba-mais {
		background: var(--background-card);
		color: var(--text-light);
		padding: 0.8rem 1.5rem;
		font-size: 1rem;
		font-weight: bold;
		border-radius: 6px;
		text-decoration: none;
		transition: background 0.3s ease;
	}

	.btn-saiba-mais:hover {
		background: var(--background-primary);
		color: var(--text-light);
	}

/*
 * =====================================================
 * | ESTILOS - AULAS EM DESTAQUE (FINAL LIMPO)       |
 * =====================================================
*/

	#aulas-destaque {
  		background-color: var(--background-light);
  		color: var(--text-dark);
  		position: relative;
  		overflow: visible; /* v8: permite clicar/visualizar o dropdown */
  		padding-bottom: 4rem;
	}

	/* ===== TTULO ===== */
	#aulas-destaque h2 {
  		font-weight: 700;
		color: var(--text-dark);
		text-transform: none; /* sem caixa alta */
		letter-spacing: 0.5px;
		margin-bottom: 2rem;
		text-align: center;
		position: relative;
	}

	/* Linha decorativa abaixo do ttulo */
	#aulas-destaque h2::after {
  		content: "";
  		display: block;
  		width: 90px;
  		height: 3px;
  		background-color: var(--primary-color);
  		margin: 0.8rem auto 0;
  		border-radius: 2px;
	}

	/* ===== CARDS ===== */
	#aulas-destaque .card {
  		background-color: var(--background-light);
  		border: 1px solid var(--border-section, #e5e5e5);
  		border-radius: 14px;
  		transition: all 0.4s ease;
  		box-shadow: 0px 6px 14px rgba(0, 0, 0, 0.08);
  		overflow: visible; /* v8: permite clicar/visualizar o dropdown */
	}

	#aulas-destaque .card:hover {
  		transform: translateY(-6px);
  		box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.15);
	}

	/* ===== IMAGEM DO CARD ===== */
	#aulas-destaque .card-img-top {
  		width: 100%;
  		height: 220px;
  		object-fit: cover;
  		border-bottom: 3px solid var(--primary-color);
  		transition: transform 0.4s ease;
	}

	#aulas-destaque .card:hover .card-img-top {
  		transform: scale(1.03);
	}

	/* ===== CONTEDO DO CARD ===== */
	#aulas-destaque .card-body {
  		padding: 1.25rem 1rem;
	}

	#aulas-destaque .card-title {
  		color: var(--primary-color);
  		font-size: 1.15rem;
  		font-weight: 600;
  		margin-bottom: 0.5rem;
	}

	#aulas-destaque .card p {
  		color: var(--text-dark);
  		font-size: 0.95rem;
  		line-height: 1.5;
  		margin: 0;
	}

/* ===== RESPONSIVIDADE ===== */
@media (max-width: 992px) {
  #aulas-destaque .card-img-top {
    height: 200px;
  }
}

@media (max-width: 768px) {
  #aulas-destaque .carousel-control-prev,
  #aulas-destaque .carousel-control-next {
    width: 3rem;
    height: 3rem;
  }

  #aulas-destaque .card-title {
    font-size: 1.05rem;
  }

  #aulas-destaque .card p {
    font-size: 0.9rem;
  }
}

@media (max-width: 576px) {
  #aulas-destaque h2 {
    font-size: 1.3rem;
  }

  #aulas-destaque .card-img-top {
    height: 180px;
  }

  #aulas-destaque .carousel-control-prev,
  #aulas-destaque .carousel-control-next {
    display: none; /* remove setas no mobile */
  }
}

/*
 * ===============================================
 * | Carrossel Pgina Index - Padro New Corpore |
 * ===============================================
*/
	/* --- Ajustes iguais ao primeiro carrossel --- */
	#carouselDepoimentos .carousel-control-prev,
	#carouselDepoimentos .carousel-control-next {
	  top: 50%;                   /* centraliza verticalmente */
	  transform: translateY(-50%);
	  width: auto;                 /* no ocupa toda a lateral */
	  height: auto;
	  background: none;            /* remove fundo padro */
	}

	#carouselDepoimentos .carousel-control-prev {
	  left: -35px;  /* empurra seta para fora do container */
	}

	#carouselDepoimentos .carousel-control-next {
	  right: -35px; /* empurra seta para fora do container */
	}

	#carouselDepoimentos .carousel-control-prev-icon,
	#carouselDepoimentos .carousel-control-next-icon {
	  width: 20px;
	  height: 20px;
	  background-size: 100% 100%;
	  filter: invert(100%); /* deixa branco, se o fundo for escuro */
	}
	
	.testimonial {
		text-align: center;
	  	padding: 40px 20px;
	  	background: #fff;
	  	border-radius: 15px;
	  	box-shadow: 0px 4px 8px rgba(0,0,0,0.1);
	}

	.testimonial img {
	  	width: 100px;
	  	height: 100px;
	  	object-fit: cover;
	  	border-radius: 50%;
	  	margin-bottom: 20px;
	  	border: 3px solid #eb5c1d; /* cor da New Corpore */
	}

	.testimonial p {
	  	font-size: 1.1rem;
	  	font-style: italic;
	  	color: #333;
	}

	.testimonial h5 {
	  	margin-top: 15px;
	  	font-weight: bold;
	  	color: #eb5c1d; /* cor da New Corpore */
	}

/* Container principal */
	.caixa {
  		position: relative;
  		overflow: visible; /* v8: permite clicar/visualizar o dropdown */
	}

/* ================================
   Cards de Depoimentos / Destaques
   ================================ */
	.testimonial-card {
  		background-color: #fff;
  		border-radius: 15px;
  		border: 2px solid #eb5c1d; /* cor institucional */
  		box-shadow: 0px 6px 12px rgba(0,0,0,0.2);
  		transition: transform 0.3s ease, box-shadow 0.3s ease;
  		padding: 20px;
  		text-align: center;
  		height: 100%;
	}

	.testimonial-card:hover {
  		transform: translateY(-5px);
  		box-shadow: 0px 10px 20px rgba(0,0,0,0.15);
	}

	/* Nome e texto */
	.testimonial-card h5 {
  		color: #000;
  		font-weight: bold;
  		margin-top: 10px;
 		margin-bottom: 10px;
	}

	.testimonial-card p {
  		color: #333;
  		font-size: 1rem;
  		line-height: 1.5;
  		margin-bottom: 10px;
	}

/* ================================
   |   Controles do Carrossel     |
   ================================ */
	.carousel-control-prev,
	.carousel-control-next {
		top: 50%;
  		transform: translateY(-50%);
  		width: auto;
  		height: auto;
  		background: none;
	}

	.carousel-control-prev {
  		left: -50px; /* mantm o offset do padro principal */
	}

	.carousel-control-next {
  		right: -50px;
	}

/* cones das setas */
	.carousel-control-prev-icon,
	.carousel-control-next-icon {
  		width: 5px; /* um pouco menor */
  		height: 5px;
  		background-size: 100% 100%;
  		filter: none; /* remove o invert branco */
  		background-color: transparent;
  		mask-size: cover;
  		opacity: 0.9;
  		transition: all 0.3s ease;
	}

/* Cor preta com transio suave para cinza */
	.carousel-control-prev-icon {
  		background-color: #000; /* cor preta */
	}

	.carousel-control-next-icon {
  	background-color: #000; /* cor preta */
	}

	.carousel-control-prev-icon:hover,
	.carousel-control-next-icon:hover {
  		background-color: #555; /* transio para cinza */
  		opacity: 1;
	}

/* ================================
   Custom Arrows (caso sejam usadas)
   ================================ */
	.custom-arrow {
	  position: absolute;
	  top: 50%;
	  transform: translateY(-50%);
	  background: none;
	  border: none;
	  padding: 8px;
	  color: #000; /* cor preta padro */
	  border-radius: 50%;
	  cursor: pointer;
	  transition: all 0.3s ease;
	  z-index: 2;
	}

	.custom-arrow:hover {
  		color: #555; /* muda para cinza no hover */
  		transform: translateY(-50%) scale(1.05);
	}

/* ================================
   Responsividade
   ================================ */
	@media (max-width: 991px) {
  	.carousel-control-prev {
    	left: -30px;
  }
  .carousel-control-next {
    right: -30px;
  }
}

	@media (max-width: 767px) {
  	.testimonial-card {
    	margin-bottom: 20px;
  		}
	}

/*
 * ===============================================
 * |    ajustes controles grade de horarios      |
 * ===============================================
 */
	.horarios-title {
		color: var(--text-light);
		margin-bottom: 2rem;
	}

	.table-horarios {
		border-color: var(--border-card);
	}

	.horarios-thead {
		background-color: var(--primary-color);
		color: var(--text-light);
	}

	.horarios-tbody tr {
		background-color: var(--background-card);
		border-color: var(--border-card);
		transition: background-color 0.4s ease, color 0.4s ease;
	}

	.horarios-tbody tr:hover {
		background-color: #1a1c1e; /* leve clareamento do fundo do card */
		color: var(--text-light);
	}

	.table-horarios th,
	.table-horarios td {
		text-align: center;
		vertical-align: middle;
	}

	/* opcional: linhas alternadas para dar mais profundidade */
	.horarios-tbody tr:nth-child(even) {
		background-color: #121314; /* um pouco mais escuro que o fundo padro */
	}


/* =========================================================
   Acesso rpido ao Webmail (cabealho)
   ========================================================= */


/* =========================================================
   GRADE DE HORÁRIOS (Index) — visual clean (cards leves)
   ========================================================= */
#grade-horarios.nc-schedule-section{
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, rgba(235,92,29,.14), rgba(235,92,29,.06));
}

/* Painel central (mais clean que “botões soltos”) */
#grade-horarios .nc-schedule-panel{
	background: rgba(255,255,255,.78);
	border: 1px solid rgba(0,0,0,.08);
	border-radius: 22px;
	padding: 18px;
	box-shadow: 0 18px 55px rgba(0,0,0,.10);
	backdrop-filter: blur(6px);
}

/* Card clicável por unidade */
#grade-horarios .nc-unitcard{
	display:flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border-radius: 18px;
	background: #ffffff;
	border: 1px solid rgba(0,0,0,.08);
	text-decoration: none !important;
	color: var(--text-dark) !important;
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
	min-height: 124px;
}

#grade-horarios .nc-unitcard:hover{
	transform: translateY(-3px);
	box-shadow: 0 18px 55px rgba(0,0,0,.14);
	border-color: rgba(235,92,29,.35);
}

/* Ícone */
#grade-horarios .nc-unitcard__icon{
	width: 52px;
	height: 52px;
	flex: 0 0 52px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius: 16px;
	background: rgba(235,92,29,.12);
	color: var(--primary-color);
	box-shadow: 0 12px 28px rgba(0,0,0,.10);
	font-size: 1.25rem;
}

/* Texto */
#grade-horarios .nc-unitcard__title{
	margin: 0 0 4px 0;
	font-weight: 900;
	letter-spacing: -0.01em;
	font-size: 1.05rem;
}

#grade-horarios .nc-unitcard__text{
	margin: 0 0 10px 0;
	color: rgba(0,0,0,.68);
	line-height: 1.55;
}

/* “chips” de info (Horários/Aulas/Local) */
#grade-horarios .nc-unitcard__meta{
	display:flex;
	flex-wrap: wrap;
	gap: 8px;
}

#grade-horarios .nc-chip{
	display:inline-flex;
	align-items:center;
	padding: 6px 10px;
	border-radius: 999px;
	border: 1px solid rgba(0,0,0,.08);
	background: rgba(0,0,0,.02);
	color: rgba(0,0,0,.74);
	font-weight: 800;
	font-size: .80rem;
}

/* Seta */
#grade-horarios .nc-unitcard__arrow{
	margin-left: auto;
	width: 40px;
	height: 40px;
	border-radius: 999px;
	display:flex;
	align-items:center;
	justify-content:center;
	background: rgba(0,0,0,.06);
	color: rgba(0,0,0,.75);
	transition: transform .18s ease, background-color .18s ease;
}

#grade-horarios .nc-unitcard:hover .nc-unitcard__arrow{
	transform: translateX(2px);
	background: rgba(235,92,29,.12);
	color: var(--primary-color);
}

#grade-horarios .nc-schedule-note{
	padding-top: 4px;
}

/* Responsivo */
@media (max-width: 575.98px){
	#grade-horarios .nc-schedule-panel{ padding: 14px; }
	#grade-horarios .nc-unitcard{ padding: 14px; min-height: 116px; }
	#grade-horarios .nc-unitcard__icon{ width: 48px; height: 48px; flex-basis: 48px; }
}

/* =========================================================
   Experiência New Corpore — UPGRADE (sem barra vertical)
   ========================================================= */
#experiencia-newcorpore.nc-experience-section{
	position: relative;
	overflow: hidden;
	/* mantém o estilo clean + leve profundidade */
	background-image:
		radial-gradient(640px 260px at 100% 0%, rgba(235,92,29,.12), transparent 62%),
		radial-gradient(520px 240px at 0% 100%, rgba(0,0,0,.06), transparent 60%);
}

#experiencia-newcorpore.nc-experience-section .container{ position: relative; z-index: 1; }

/* Remove qualquer “barra” decorativa que possa estar vindo por pseudo-elementos */
#experiencia-newcorpore.nc-experience-section::before,
#experiencia-newcorpore.nc-experience-section::after,
#experiencia-newcorpore.nc-experience-section .nc-exp-media::before,
#experiencia-newcorpore.nc-experience-section .nc-exp-media::after{
	content: none !important;
	display: none !important;
}

#experiencia-newcorpore .nc-exp-lead{
	font-size: 1.02rem;
	line-height: 1.75;
	color: rgba(0,0,0,.72) !important;
	margin-top: 10px;
}

#experiencia-newcorpore .nc-exp-grid{
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin-top: 22px;
}

@media (min-width: 768px){
	#experiencia-newcorpore .nc-exp-grid{ grid-template-columns: 1fr 1fr; }
}

#experiencia-newcorpore .nc-exp-item{
	display: flex;
	gap: 12px;
	padding: 14px 14px;
	border-radius: 16px;
	background: rgba(0,0,0,.03);
	border: 1px solid rgba(0,0,0,.045);
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
}

#experiencia-newcorpore .nc-exp-item:hover{
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(0,0,0,.12);
	border-color: rgba(235,92,29,.25);
	background: rgba(235,92,29,.05);
}

#experiencia-newcorpore .nc-exp-icon{
	width: 46px;
	height: 46px;
	border-radius: 14px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex: 0 0 auto;
	background: rgba(235,92,29,.12);
	color: var(--primary-color);
	box-shadow: 0 12px 28px rgba(0,0,0,.10);
}

#experiencia-newcorpore .nc-exp-icon i{ font-size: 1.1rem; }

#experiencia-newcorpore .nc-exp-text h3{
	margin: 0;
	font-size: 1.02rem;
	font-weight: 900;
	color: var(--text-dark);
}

#experiencia-newcorpore .nc-exp-text p{
	margin: 6px 0 0;
	color: rgba(0,0,0,.72);
	line-height: 1.55;
}

#experiencia-newcorpore .nc-exp-cta{
	margin-top: 18px;
	display:flex;
	gap: 10px;
	flex-wrap: wrap;
}

#experiencia-newcorpore .nc-exp-chips{
	margin-top: 14px;
	display:flex;
	gap: 10px;
	flex-wrap: wrap;
}

#experiencia-newcorpore .nc-exp-chip{
	display:inline-flex;
	align-items:center;
	gap: 8px;
	padding: 8px 10px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid rgba(0,0,0,.045);
	color: rgba(0,0,0,.78);
	font-weight: 800;
	font-size: .9rem;
	white-space: nowrap;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
	box-shadow: none;
}

#experiencia-newcorpore .nc-exp-chip i{
	color: var(--primary-color);
	transition: color var(--transition);
}

#experiencia-newcorpore .nc-exp-chip:hover{
	background: rgba(240, 137, 74, 0.14);
	border-color: rgba(240, 137, 74, 0.35);
	color: rgba(0,0,0,.86);
}

#experiencia-newcorpore .nc-exp-chip:hover i{
	color: var(--secondary-color);
}

#experiencia-newcorpore .nc-exp-media{
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	border: 1px solid rgba(0,0,0,.045);
	box-shadow: 0 22px 60px rgba(0,0,0,.12);
	background: #ffffff;
}

#experiencia-newcorpore .nc-exp-img{
	display:block;
	width: 100%;
	height: 100%;
	min-height: 360px;
	object-fit: cover;
}

#experiencia-newcorpore .nc-exp-quote{
	margin-top: 14px;
	border-radius: 18px;
	padding: 14px 16px;
	background: rgba(235,92,29,.06);
	border: 1px solid rgba(235,92,29,.18);
	display:flex;
	gap: 10px;
	align-items:flex-start;
}

#experiencia-newcorpore .nc-exp-quote i{
	color: var(--primary-color);
	font-size: 1.1rem;
	margin-top: 2px;
}

#experiencia-newcorpore .nc-exp-quote p{
	margin: 0;
	color: rgba(0,0,0,.76);
	line-height: 1.6;
}

@media (max-width: 575.98px){
	#experiencia-newcorpore .nc-exp-img{ min-height: 300px; }
}

/* =========================================================
   AULAS (Index) — mesmo estilo de Benefícios
   ========================================================= */
#aulas.nc-classes-section{
	position: relative;
	overflow: hidden;
}

/* Removido ornamento (barra/efeito) no topo-direito da seção Aulas */

/* Card estilo "benefício" */
#aulas .nc-class{
	display:flex;
	gap: 14px;
	padding: 18px 16px;
	border-radius: 16px;
	border: 1px solid rgba(255,255,255,.10);
	background: rgba(255,255,255,.02);
	height: 100%;
	transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}

#aulas .nc-class:hover{
	transform: translateY(-4px);
	background: rgba(255,255,255,.05);
	border-color: rgba(235,92,29,.45);
	box-shadow: 0 18px 44px rgba(0,0,0,.28);
}

#aulas .nc-class__icon{
	width: 46px;
	height: 46px;
	flex: 0 0 46px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius: 14px;
	background: rgba(235,92,29,.16);
	color: var(--primary-color);
	box-shadow: 0 12px 28px rgba(0,0,0,.22);
}

#aulas .nc-class__body h3{
	margin: 0 0 6px 0;
	font-size: 1.02rem;
	font-weight: 900;
	color: #ffffff;
	letter-spacing: -0.01em;
}

#aulas .nc-class__body p{
	margin: 0;
	color: rgba(255,255,255,.72);
	line-height: 1.6;
}

/* CTA inferior (mesmo padrão do Benefícios) */
#aulas .nc-classes__cta{
	margin-top: 18px;
	padding: 18px 16px;
	border-radius: 18px;
	border: 1px solid rgba(255,255,255,.10);
	background: linear-gradient(135deg, rgba(235,92,29,.18), rgba(255,255,255,.02));
	display:flex;
	align-items:center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}

#aulas .nc-classes__cta-text h3{
	margin: 0 0 2px 0;
	font-size: 1.22rem;
	font-weight: 900;
	color: #ffffff;
}

#aulas .nc-classes__cta-text p{
	margin: 0;
	color: rgba(255,255,255,.78);
}

#aulas .nc-classes__cta-actions{
	display:flex;
	gap: 10px;
	flex-wrap: wrap;
}

@media (max-width: 575.98px){
	#aulas .nc-class{ padding: 16px 14px; }
	#aulas .nc-class__icon{ width: 42px; height: 42px; flex-basis: 42px; }
}

/* =========================================================
   NEW App — (Fundo branco, sem laranja no background)
   ========================================================= */

/* garante fundo branco mesmo se outra regra tentar sobrescrever */
#app-newcorpore,
#app-newcorpore.nc-app-section{
	background-color: var(--background-light) !important;
	background-image: none !important;
	color: var(--text-dark);
	position: relative;
	overflow: hidden;
}

#app-newcorpore.nc-app-section .container{ position: relative; z-index: 1; }

/* mata qualquer pseudo-elemento antigo com “faixa”/efeito */
#app-newcorpore.nc-app-section::before,
#app-newcorpore.nc-app-section::after,
#app-newcorpore.nc-app-section .nc-app-media::before,
#app-newcorpore.nc-app-section .nc-app-media::after{
	content: none !important;
	display: none !important;
}

/* texto */
#app-newcorpore .nc-app-lead{
	font-size: 1.02rem;
	line-height: 1.75;
	color: rgba(0,0,0,.72) !important;
	margin-top: 10px;
}

/* grid de recursos */
#app-newcorpore .nc-app-grid{
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin-top: 22px;
}

@media (min-width: 768px){
	#app-newcorpore .nc-app-grid{ grid-template-columns: 1fr 1fr; }
}

/* cards */
#app-newcorpore .nc-app-item{
	display: flex;
	gap: 12px;
	padding: 14px 14px;
	border-radius: 16px;
	background: rgba(0,0,0,.03);
	border: 1px solid rgba(0,0,0,.045);
	transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition), background-color var(--transition);
}

#app-newcorpore .nc-app-item:hover{
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(0,0,0,.12);
	border-color: rgba(235,92,29,.25);
	background: rgba(235,92,29,.08);
}

/* ícones */
#app-newcorpore .nc-app-icon{
	width: 46px;
	height: 46px;
	border-radius: 14px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex: 0 0 auto;
	background: rgba(235,92,29,.16);
	color: var(--primary-color);
	box-shadow: 0 12px 28px rgba(0,0,0,.10);
	transition: background-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

#app-newcorpore .nc-app-item:hover .nc-app-icon{
	background: rgba(235,92,29,.24);
	box-shadow: 0 16px 38px rgba(235,92,29,.18);
	transform: translateY(-1px);
}

#app-newcorpore .nc-app-icon i{ font-size: 1.1rem; }

#app-newcorpore .nc-app-text h3{
	margin: 0;
	font-size: 1.02rem;
	font-weight: 900;
	color: var(--text-dark);
}

#app-newcorpore .nc-app-text p{
	margin: 6px 0 0;
	color: rgba(0,0,0,.72);
	line-height: 1.55;
}

/* botões */
#app-newcorpore .nc-app-actions{
	margin-top: 18px;
	display:flex;
	gap: 10px;
	flex-wrap: wrap;
}

#app-newcorpore .nc-store-btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 190px;
}

@media (max-width: 575.98px){
	#app-newcorpore .nc-store-btn{ width: 100%; min-width: 0; }
}

/* chips */
#app-newcorpore .nc-app-chips{
	margin-top: 14px;
	display:flex;
	gap: 10px;
	flex-wrap: wrap;
}

#app-newcorpore .nc-app-chip{
	display:inline-flex;
	align-items:center;
	gap: 8px;
	padding: 8px 10px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid rgba(0,0,0,.045);
	color: rgba(0,0,0,.78);
	font-weight: 800;
	font-size: .9rem;
	white-space: nowrap;
	cursor: default;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
}

#app-newcorpore .nc-app-chip i{
	color: var(--primary-color);
	transition: color var(--transition);
}

/* Hover (laranja claro) — Treinos organizados / Check-in e reservas / Notificações */
#app-newcorpore .nc-app-chip:hover{
	background: rgba(240, 137, 74, 0.14);
	border-color: rgba(240, 137, 74, 0.35);
	color: rgba(0,0,0,.86);
}
#app-newcorpore .nc-app-chip:hover i{
	color: var(--secondary-color);
}
/* imagem / mock */
#app-newcorpore .nc-app-media{
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	border: 1px solid rgba(0,0,0,.045);
	box-shadow: 0 22px 60px rgba(0,0,0,.12);
	background: #ffffff;
}

#app-newcorpore .nc-app-img{
	display:block;
	width: 100%;
	height: 100%;
	min-height: 360px;
	object-fit: cover;
}

/* badge */
#app-newcorpore .nc-app-badge{
	position: absolute;
	left: 14px;
	bottom: 14px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 999px;
	background: rgba(255,255,255,.92);
	border: 1px solid rgba(0,0,0,.10);
	box-shadow: 0 16px 36px rgba(0,0,0,.14);
	font-weight: 900;
	color: rgba(0,0,0,.82);
}

#app-newcorpore .nc-app-badge i{ color: var(--primary-color); }

/* quote */
#app-newcorpore .nc-app-quote{
	margin-top: 14px;
	border-radius: 18px;
	padding: 14px 16px;
	background: rgba(0,0,0,.03);
	border: 1px solid rgba(0,0,0,.08);
	display:flex;
	gap: 10px;
	align-items:flex-start;
}

#app-newcorpore .nc-app-quote i{
	color: var(--primary-color);
	font-size: 1.1rem;
	margin-top: 2px;
}

#app-newcorpore .nc-app-quote p{
	margin: 0;
	color: rgba(0,0,0,.76);
	line-height: 1.55;
}

/* Ajuste da mídia da seção Acompanhamento */
.nc-app-media {
  width: 100%;
  max-width: 520px;
  height: 630px;
  margin: 0 auto;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.15);
}

.nc-app-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media (max-width: 991.98px) {
  .nc-app-media {
    height: 320px;
    max-width: 100%;
  }
}

@media (max-width: 575.98px) {
  .nc-app-media {
    height: 260px;
  }
}