/* ==========================================================================
   Contactos: estilos específicos (Figma Desktop - Contactos 19627:2957)
   ========================================================================== */

/* ---- Hero ------------------------------------------------------------------ */
.contactos-hero {
	position: relative; min-height: 756px; display: flex; align-items: center;
	background: var(--c-black); color: var(--c-white); overflow: hidden;
	padding-block: var(--nav-h); /* simétrico: o bloco fica centrado na altura total, como no design */
}
.contactos-hero__inner {
	position: relative; z-index: 1;
	display: grid; grid-template-columns: minmax(0, 488px) minmax(0, 476px); justify-content: space-between;
	gap: 48px 64px; align-items: start;
	max-width: 1440px; padding-inline: 95px;
}
@media (max-width: 1280px) { .contactos-hero__inner { padding-inline: var(--gutter); } }

.contactos-hero__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.contactos-hero__title { margin-bottom: 4px; }
.contactos-hero__title .accent { color: var(--c-mint); }
.contactos-hero__lead { color: var(--c-white); }
.contactos-hero__text { font-size: 16px; line-height: 1.5; color: var(--c-white); max-width: 440px; }

/* Coluna dos contactos: começa ligeiramente abaixo do título, como no design */
.contactos-hero__details { padding-top: 30px; display: flex; flex-direction: column; align-items: flex-start; }
.contactos-hero__rows { display: flex; flex-direction: column; gap: 24px; width: 100%; }
.contactos-row { position: relative; padding-bottom: 14px; }
.contactos-row::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 0;
	border-bottom: 1px dashed rgba(255, 255, 255, 0.12);
}
.contactos-row__label {
	font-size: 12px; line-height: 1.5; font-weight: 700;
	letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-gray-200);
}
.contactos-row__value {
	margin: 6px 0 0; font-size: clamp(20px, 1.74vw, 25px); line-height: 1.3; font-weight: 500;
	color: var(--c-white); overflow-wrap: anywhere; word-break: break-word;
}
.contactos-row__note {
	display: block; margin-top: 6px;
	font-size: 13px; line-height: 1.4; font-weight: 400; color: var(--c-gray-200);
}
.contactos-row__value a { color: inherit; transition: color 0.25s var(--ease-out); }
.contactos-row__value a:hover, .contactos-row__value a:focus-visible { color: var(--c-mint); }
.contactos-hero__btn { margin-top: 24px; min-width: 205px; }

/* ---- Micro-animações de entrada ------------------------------------------- */
.contactos-hero__title, .contactos-hero__lead, .contactos-hero__text, .contactos-hero__btn {
	opacity: 0; transform: translateY(24px); animation: contactosIn 1s var(--ease-out) forwards;
}
.contactos-hero__title { animation-delay: 0.15s; }
.contactos-hero__lead { animation-delay: 0.35s; }
.contactos-hero__text { animation-delay: 0.5s; }
.contactos-hero__btn { animation-delay: 1s; }
@keyframes contactosIn { to { opacity: 1; transform: none; } }

.contactos-row { opacity: 0; transform: translateX(32px); animation: contactosSlide 0.9s var(--ease-out) forwards; }
.contactos-row:nth-child(1) { animation-delay: 0.4s; }
.contactos-row:nth-child(2) { animation-delay: 0.55s; }
.contactos-row:nth-child(3) { animation-delay: 0.7s; }
@keyframes contactosSlide { to { opacity: 1; transform: none; } }

.contactos-row::after { transform: scaleX(0); transform-origin: left; animation: contactosLine 1.1s var(--ease-out) forwards; }
.contactos-row:nth-child(1)::after { animation-delay: 0.7s; }
.contactos-row:nth-child(2)::after { animation-delay: 0.85s; }
.contactos-row:nth-child(3)::after { animation-delay: 1s; }
@keyframes contactosLine { to { transform: scaleX(1); } }

/* ---- Responsivo ------------------------------------------------------------ */
@media (max-width: 1100px) {
	.contactos-hero__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: 40px 48px; }
}
@media (max-width: 900px) {
	.contactos-hero { min-height: 0; align-items: stretch; padding-block: 0; }
	.contactos-hero__inner {
		grid-template-columns: 1fr; gap: 56px;
		padding-top: calc(var(--nav-h) + 72px); padding-bottom: 80px;
	}
	.contactos-hero__details { padding-top: 0; }
	.contactos-hero__text { max-width: 520px; }
	.contactos-row { transform: translateY(20px); }
}
@media (max-width: 600px) {
	.contactos-hero__inner { gap: 44px; padding-top: calc(var(--nav-h) + 56px); padding-bottom: 64px; }
	.contactos-hero__intro { gap: 20px; }
	.contactos-hero__rows { gap: 20px; }
	.contactos-row__value { font-size: 20px; }
	.contactos-hero__btn { margin-top: 20px; width: 100%; min-width: 0; }
}
