/* Página Home – estilos específicos */

/* Hero com carrossel de backgrounds */
.hero{ 
	position:relative; padding:80px 0 80px; overflow:hidden; 
	border-bottom:1px solid var(--border); min-height:650px;
	display:flex; align-items:center;
}

/* Backgrounds do carrossel - Elementos sobrepostos para transição suave */
.hero-bg {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 1s ease-in-out;
	z-index: 1;
}

.hero-bg.active { opacity: 1; }

.hero-bg.bg-1 { background-image: url('../../img/background_carrossel_1.jpg'); background-position: center 70%; }
.hero-bg.bg-2 { background-image: url('../../img/background_carrossel_2.jpg'); background-position: center 30%; transform: scaleX(-1); }
.hero-bg.bg-3 { background-image: url('../../img/background_carrossel_3.jpg'); background-position: center 60%; transform: scaleX(-1); }

.hero::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(38, 61, 41, 0.7);
	z-index: 2;
}

.hero__grid{
	position: relative;
	z-index: 3;
	display: grid;
	grid-template-columns: 1.2fr .8fr;
	gap: 56px;
	align-items: center;
	padding-top: 120px;
}

.hero__text{
	max-width: 800px;
	color: var(--black);
}

.hero__text h1{ 
	color: #ffffff; 
	font-weight: 800;
	margin-bottom: 1.2rem;
	text-shadow: 0 2px 4px rgba(0,0,0,0.3);
	transform: translate(var(--hero-titulo-x), var(--hero-titulo-y));
}

.hero__text p{ 
	color: #ffffff; 
	max-width: 700px; 
	margin: .6rem 0 1.4rem;
	font-size: 1.1rem;
	line-height: 1.6;
	text-align: justify;
	transform: translate(var(--hero-paragrafo-x), var(--hero-paragrafo-y));
}

.hero__actions{ 
	display: flex; 
	gap: 12px; 
	flex-wrap: wrap; 
	margin: 1.5rem 0;
	transform: translate(var(--hero-botoes-x), var(--hero-botoes-y));
}

.hero__note{ 
	margin-top: 1rem; 
	color: #ffffff; 
	font-size: .95rem; 
	font-weight: 600;
	transform: translate(var(--hero-nota-x), var(--hero-nota-y));
}

/* Responsividade do hero */
@media (max-width: 820px) {
	.hero__grid { 
		grid-template-columns: 1fr !important; 
		gap: 20px !important; 
		text-align: center !important;
	}
}

@media (max-width: 768px) {
	.hero { 
		padding: 120px 0 90px !important; 
		min-height: 500px !important; 
		margin-top: 0 !important;
	}
	.hero .container {
		padding: 0 20px !important;
	}
	.hero__text h1 { 
		font-size: 2.2rem !important; 
	}
	.hero__text p { 
		font-size: 1rem !important;
		text-align: center !important;
		max-width: 100% !important;
	}
	.hero__text {
		max-width: 100% !important;
		width: 100% !important;
	}
	.hero__actions {
		justify-content: center !important;
	}
	.hero__note {
		text-align: center !important;
	}
}

@media (max-width: 480px) {
	.hero { 
		padding: 90px 0 70px; 
		min-height: 400px; 
	}
}



/* Mobile médio - iPhone 14 Pro Max e similares (430-476px) */
@media (max-width: 476px) and (min-width: 430px) {
	.hero__text h1 { 
		font-size: 1.9rem !important; /* Redução gradual */
	}
	.hero__text p { 
		font-size: 0.9rem !important;
	}
	.btn--xl, .btn--cta { 
		padding: 0.9rem 2rem !important; 
		font-size: 1.5rem !important; 
		min-width: 320px !important; /* Ajustado para caber na tela */
		max-width: 85vw !important;
	}
	.hero__note {
		font-size: 0.85rem !important;
	}
}

/* Mobile pequeno-médio (401-429px) */
@media (max-width: 429px) and (min-width: 401px) {
	.hero__text h1 { 
		font-size: 1.8rem !important;
	}
	.hero__text p { 
		font-size: 0.85rem !important;
	}
	.btn--xl, .btn--cta { 
		padding: 0.8rem 1.8rem !important; 
		font-size: 1.4rem !important; 
		min-width: 280px !important; /* Menor ainda */
		max-width: 80vw !important;
	}
	.hero__note {
		font-size: 0.8rem !important;
	}
}

@media (max-width: 400px) {
	.hero {
		padding: 80px 0 60px;
		min-height: 350px;
	}
}









/* Responsividade mobile simplificada */
@media (max-width: 768px) {
	.hero { 
		padding: 80px 0 80px; 
		min-height: 450px; 
	}
	
	.hero__grid {
		gap: 16px !important;
	}
	
	.hero__text {
		text-align: center !important;
	}
	
	.hero__actions {
		justify-content: center !important;
		width: 100% !important;
	}
}

/* HERO — largura do bloco de texto (título + parágrafo) */
.hero__text{ 
	max-width: 800px !important;
	width: 800px !important;
}
@media (max-width: 820px){ 
	.hero__text{ 
		max-width: 100% !important; 
		width: 100% !important;
	} 
}

/* Produtos (grade em cards, estilo Ágora) */
.products{ padding:38px 0 64px; background:#fff }
.products__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.card{
	background:var(--light); border:1px solid var(--border); border-radius:var(--radius);
	box-shadow: 0 10px 24px -20px rgba(0,0,0,.35);
	padding:22px; min-height:210px; display:flex; flex-direction:column; gap:10px;
	transition: border-color .15s ease, transform .12s ease, box-shadow .2s ease;
}
.card:hover{ border-color:#c9c8c4; transform:translateY(-2px); box-shadow:0 18px 36px -24px rgba(0,0,0,.38) }
.card h4{ margin:.2rem 0 .1rem; color:#0c0c0c; letter-spacing:.12rem; font-size:.9rem; font-weight:900 }
.card p{ margin:0; color:#5a615c }
.card a{ margin-top:auto; text-decoration:none; font-weight:800; color:var(--green) }
.card a:hover{ text-decoration:underline }

/* ícone "linha" em verde */
.icon{
	width:34px; height:34px; border-radius:8px; display:grid; place-items:center;
	color:var(--green); border:1.5px solid #cfd7d0; background:#fff;
}

/* Destaque escuro (usa #0e1d14 + selo) */
.card--featured{ background:var(--ink); border-color:var(--border-dark); }
.card--featured h4, .card--featured p, .card--featured a{ color:#eef1ef }
.card--featured a{ color:#d7f0e0 }
.card-header{ display:flex; align-items:center; margin-bottom:8px; }
.card-header .icon{ margin-bottom:0; }
.ribbon{
	padding:.28rem .5rem; margin-left:12px;
	border-radius:999px; background:var(--light); color:var(--deep);
	border:1px solid #d0d0cb; font-weight:900; font-size:.7rem; letter-spacing:.18em;
	white-space:nowrap;
}

/* Produtos – responsivo */
@media (max-width:1080px){ .products__grid{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:820px){ .products__grid{ grid-template-columns:1fr 1fr } }
@media (max-width:520px){ .products__grid{ grid-template-columns:1fr } }

/* Responsividade para produtos em dispositivos < 400px */
@media (max-width: 400px) {
	.products { 
		padding: 28px 0 50px !important; 
	}
	.products .container {
		padding: 0 16px !important;
	}
	.products__grid { 
		gap: 16px !important; 
	}
	.card {
		padding: 16px !important;
		min-height: 180px !important;
	}
	.card h4 {
		font-size: 0.82rem !important;
		margin: 0.12rem 0 0.06rem !important;
	}
	.card p {
		font-size: 0.88rem !important;
		line-height: 1.4 !important;
	}
	.card a {
		font-size: 0.88rem !important;
	}
	.icon {
		width: 28px !important;
		height: 28px !important;
	}
}

/* Produtos para dispositivos extremamente pequenos */
@media (max-width: 400px) and (max-height: 900px) {
	.products { 
		padding: 20px 0 35px !important; 
	}
	.card {
		padding: 12px !important;
		min-height: 160px !important;
	}
	.card h4 {
		font-size: 0.78rem !important;
		margin: 0.1rem 0 0.05rem !important;
	}
	.card p {
		font-size: 0.8rem !important;
		line-height: 1.3 !important;
	}
	.card a {
		font-size: 0.8rem !important;
	}
	.icon {
		width: 24px !important;
		height: 24px !important;
	}
}

/* Ajustes específicos para iPhone 12 Pro (390x844) - Produtos */
@media (max-width: 395px) and (min-width: 385px) and (min-height: 840px) {
	.products { 
		padding: 32px 0 55px !important; 
	}
	.products .container {
		padding: 0 18px !important;
	}
	.products__grid { 
		gap: 18px !important; 
	}
	.card {
		padding: 18px !important;
		min-height: 190px !important;
	}
	.card h4 {
		font-size: 0.85rem !important;
		margin: 0.15rem 0 0.08rem !important;
	}
	.card p {
		font-size: 0.9rem !important;
		line-height: 1.4 !important;
	}
	.card a {
		font-size: 0.9rem !important;
	}
	.icon {
		width: 30px !important;
		height: 30px !important;
	}
}

/* Serviços (nova versão conforme imagem) */
.services{ 
	padding:60px 0 40px; 
	background:#f8f9fa;
}

.services__header{
	text-align:center;
	margin-bottom:28px;
}

.services__title{
	font-size:clamp(2.5rem, 4vw, 3.5rem);
	font-weight:800;
	color:var(--black);
	margin:0;
	letter-spacing:-0.5px;
}

.services__subtitle-inline{
	margin:6px 0 0;
	color:#6c757d;
	font-size:1rem;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.services__grid{ 
	display:grid; 
	grid-template-columns:repeat(3,1fr); 
	gap:32px; 
}

.service-card{
	background:#fff; 
	border:3px solid #e9ecef; 
	border-radius:20px;
	box-shadow: 0 8px 24px rgba(0,0,0,0.08);
	padding:40px 32px; 
	text-decoration:none;
	color:inherit;
	transition: all .3s ease;
	position:relative;
	display:flex;
	flex-direction:column;
	min-height:320px;
}

.service-card:hover{ 
	border-color:var(--green);
	transform:translateY(-8px); 
	box-shadow:0 16px 40px rgba(0,0,0,0.12);
	text-decoration:none;
	color:inherit;
}

.service-card__icon{
	width:56px; 
	height:56px; 
	border-radius:16px; 
	display:flex; 
	align-items:center;
	justify-content:center;
	margin-bottom:24px;
	flex-shrink:0;
	overflow:hidden;
}

.service-card__icon img{
	width:100%;
	height:100%;
	object-fit:contain;
}

.service-card--investments .service-card__icon{
	background:#fff;
	padding:8px;
	border:2px solid #e9ecef;
}

.service-card--investments .service-card__icon img{
	transform:translateX(2px);
}

.service-card--empresas .service-card__icon{
	background:#fff;
	padding:8px;
	border:2px solid #e9ecef;
}

.service-card--banking .service-card__icon{
	background:#fff;
	padding:8px;
	border:2px solid #e9ecef;
}

.service-card h3{
	margin:0 0 16px; 
	color:var(--black); 
	font-size:1.5rem; 
	font-weight:800; 
}

.service-card p{
	margin:0 0 auto; 
	color:#6c757d; 
	line-height:1.6; 
	font-size:1rem;
	flex-grow:1;
}

.service-card__cta{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-top:24px;
	color:var(--green);
	font-weight:700;
	font-size:1rem;
}

.cta-icon{
	width:24px;
	height:24px;
	border:2px solid var(--green);
	border-radius:50%;
	position:relative;
	flex-shrink:0;
}

.cta-icon::after{
	content:'→';
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	font-size:12px;
	color:var(--green);
}

.service-card:hover .cta-icon{
	background:var(--green);
}

.service-card:hover .cta-icon::after{
	color:#fff;
}



/* Serviços – responsivo */
@media (max-width:1080px){ 
	.services__grid{ grid-template-columns:1fr; gap:24px; }
	.service-card{ padding:32px 24px; }
}

@media (max-width:768px){ 
	.services{ padding:40px 0 30px; }
	.services__header{ margin-bottom:32px; }
	.services__title{ font-size:2.5rem; }
}

/* Responsividade para serviços em dispositivos < 400px */
@media (max-width: 400px) {
	.services { 
		padding: 30px 0 20px !important; 
	}
	.services__header { 
		margin-bottom: 24px !important; 
	}
	.services__title { 
		font-size: 2.1rem !important; 
		margin-bottom: 6px !important;
	}
	.services__subtitle-inline {
		font-size: 0.9rem !important;
		margin-top: 2px !important;
	}
	.service-card {
		padding: 24px 18px !important;
		min-height: 280px !important;
	}
	.service-card h3 {
		font-size: 1.3rem !important;
		margin-bottom: 12px !important;
	}
	.service-card p {
		font-size: 0.9rem !important;
		line-height: 1.4 !important;
	}
	.service-card__cta {
		margin-top: 18px !important;
		font-size: 0.9rem !important;
	}
	.service-card__icon {
		width: 48px !important;
		height: 48px !important;
		margin-bottom: 20px !important;
	}
}

/* Serviços para dispositivos extremamente pequenos */
@media (max-width: 400px) and (max-height: 900px) {
	.services { 
		padding: 20px 0 15px !important; 
	}
	.services__header { 
		margin-bottom: 18px !important; 
	}
	.services__title { 
		font-size: 1.8rem !important; 
		margin-bottom: 4px !important;
	}
	.services__subtitle-inline {
		font-size: 0.8rem !important;
		margin-top: 1px !important;
	}
	.service-card {
		padding: 18px 14px !important;
		min-height: 240px !important;
	}
	.service-card h3 {
		font-size: 1.1rem !important;
		margin-bottom: 10px !important;
	}
	.service-card p {
		font-size: 0.8rem !important;
		line-height: 1.3 !important;
	}
	.service-card__cta {
		margin-top: 14px !important;
		font-size: 0.8rem !important;
	}
	.service-card__icon {
		width: 40px !important;
		height: 40px !important;
		margin-bottom: 16px !important;
	}
}

/* Ajustes específicos para iPhone 12 Pro (390x844) - Serviços */
@media (max-width: 395px) and (min-width: 385px) and (min-height: 840px) {
	.services { 
		padding: 35px 0 25px !important; 
	}
	.services__header { 
		margin-bottom: 28px !important; 
	}
	.services__title { 
		font-size: 2.3rem !important; 
		margin-bottom: 8px !important;
	}
	.services__subtitle-inline {
		font-size: 0.95rem !important;
		margin-top: 4px !important;
	}
	.service-card {
		padding: 28px 22px !important;
		min-height: 300px !important;
	}
	.service-card h3 {
		font-size: 1.4rem !important;
		margin-bottom: 14px !important;
	}
	.service-card p {
		font-size: 0.95rem !important;
		line-height: 1.5 !important;
	}
	.service-card__cta {
		margin-top: 20px !important;
		font-size: 0.95rem !important;
	}
}