/* =========================================================
   Carti-Tarot.ro v1.9.3
   FINAL ABOUT + CONTACT RESPONSIVE LAYER
   Loaded after every previous stylesheet.
   ========================================================= */

/* ------------------------------
   DESKTOP HERO ALIGNMENT
   ------------------------------ */

/*
 * Do not depend on .ct-container for these two heroes.
 * The content uses the same 1280px optical grid as the rest of the site.
 */
.ct-v19-page-hero-inner,
.ct-v19-contact-hero > .ct-container {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding-left: max(20px, calc((100vw - 1280px) / 2)) !important;
	padding-right: max(20px, calc((100vw - 1280px) / 2)) !important;
	box-sizing: border-box !important;
}

.ct-v19-page-hero-copy,
.ct-v19-contact-hero-copy {
	width: min(100%, 650px) !important;
	max-width: 650px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}

.ct-v19-page-hero-copy h1,
.ct-v19-contact-hero-copy h1 {
	width: 100% !important;
	max-width: 650px !important;
	margin: 0 0 22px !important;
	font-size: clamp(3.15rem, 4.25vw, 4.65rem) !important;
	line-height: 1.02 !important;
	letter-spacing: -.035em !important;
	text-wrap: balance !important;
	word-break: normal !important;
	overflow-wrap: normal !important;
}

/* Hero text is readable without becoming visually heavier than the image. */
.ct-v19-page-hero-copy > p:last-child,
.ct-v19-contact-hero-copy > p:last-child {
	width: min(100%, 620px) !important;
	max-width: 620px !important;
	margin-bottom: 0 !important;
	font-size: 1rem !important;
	line-height: 1.7 !important;
}

/* About hero is intentionally a little shorter than the homepage hero. */
.ct-v19-page-hero {
	min-height: 500px !important;
}

.ct-v19-page-hero-copy {
	padding-top: 64px !important;
	padding-bottom: 64px !important;
}

/* Contact hero is more functional, so it should be more compact. */
.ct-v19-contact-hero {
	min-height: 390px !important;
}

.ct-v19-contact-hero-copy {
	padding-top: 58px !important;
	padding-bottom: 58px !important;
}

/* Images begin earlier but dissolve into the dark content area. */
.ct-v19-page-hero-media {
	inset: 0 0 0 40% !important;
}

.ct-v19-contact-hero-media {
	inset: 0 0 0 44% !important;
}

.ct-v19-page-hero-media::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	background:
		linear-gradient(
			90deg,
			#07070c 0%,
			rgba(7,7,12,.98) 8%,
			rgba(7,7,12,.90) 19%,
			rgba(7,7,12,.62) 34%,
			rgba(7,7,12,.22) 57%,
			rgba(7,7,12,.10) 100%
		),
		linear-gradient(0deg, rgba(7,7,12,.32) 0%, transparent 24%) !important;
}

.ct-v19-contact-hero-media::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	background:
		linear-gradient(
			90deg,
			#07070c 0%,
			rgba(7,7,12,.98) 10%,
			rgba(7,7,12,.88) 23%,
			rgba(7,7,12,.54) 40%,
			rgba(7,7,12,.18) 64%,
			rgba(7,7,12,.08) 100%
		),
		linear-gradient(0deg, rgba(7,7,12,.28) 0%, transparent 26%) !important;
}

/* ------------------------------
   ABOUT PAGE CONTENT
   ------------------------------ */

.ct-v19-about-intro-grid,
.ct-v19-values > .ct-container,
.ct-v19-ecosystem > .ct-container,
.ct-v19-about-cta > .ct-container,
.ct-v19-contact-main > .ct-container,
.ct-v19-contact-bottom > .ct-container {
	box-sizing: border-box !important;
}

.ct-v19-about-intro h2,
.ct-v19-section-head h2,
.ct-v19-ecosystem-copy h2 {
	text-wrap: balance !important;
}

.ct-v19-values-grid article {
	height: 100% !important;
}

.ct-v19-ecosystem-card {
	overflow: hidden !important;
}

/* ------------------------------
   CONTACT PAGE
   ------------------------------ */

.ct-v19-contact-form-wrap,
.ct-v19-contact-card {
	min-width: 0 !important;
}

.ct-v19-contact-form input,
.ct-v19-contact-form select,
.ct-v19-contact-form textarea,
.ct-v19-submit {
	box-sizing: border-box !important;
}

.ct-v19-contact-form input,
.ct-v19-contact-form select {
	min-height: 48px !important;
}

.ct-v19-contact-form textarea {
	width: 100% !important;
	min-height: 180px !important;
}

.ct-v19-submit {
	min-height: 48px !important;
}

/* ------------------------------
   TABLET
   ------------------------------ */

@media (max-width: 980px) {
	.ct-v19-page-hero-inner,
	.ct-v19-contact-hero > .ct-container {
		padding-left: 28px !important;
		padding-right: 28px !important;
	}

	.ct-v19-page-hero-media {
		inset: 0 0 0 46% !important;
	}

	.ct-v19-contact-hero-media {
		inset: 0 0 0 50% !important;
	}

	.ct-v19-page-hero-copy,
	.ct-v19-contact-hero-copy {
		width: min(56vw, 590px) !important;
		max-width: 590px !important;
	}

	.ct-v19-page-hero-copy h1,
	.ct-v19-contact-hero-copy h1 {
		font-size: clamp(2.9rem, 6vw, 4.15rem) !important;
	}

	.ct-v19-about-intro-grid {
		gap: 45px !important;
	}

	.ct-v19-values-grid {
		grid-template-columns: repeat(2, minmax(0,1fr)) !important;
	}

	.ct-v19-contact-aside {
		grid-template-columns: repeat(3, minmax(0,1fr)) !important;
	}
}

/* ------------------------------
   PHONE
   ------------------------------ */

@media (max-width: 700px) {

	/* About and Contact use a text-first hero. */
	.ct-v19-page-hero,
	.ct-v19-contact-hero {
		display: block !important;
		min-height: 0 !important;
		padding: 0 !important;
	}

	.ct-v19-page-hero-inner,
	.ct-v19-contact-hero > .ct-container {
		position: relative !important;
		z-index: 3 !important;
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 20px !important;
	}

	.ct-v19-page-hero-copy,
	.ct-v19-contact-hero-copy {
		width: 100% !important;
		max-width: 100% !important;
		padding: 44px 0 34px !important;
	}

	.ct-v19-page-hero-copy h1,
	.ct-v19-contact-hero-copy h1 {
		width: 100% !important;
		max-width: 100% !important;
		margin-bottom: 18px !important;
		font-size: clamp(2.65rem, 12vw, 3.45rem) !important;
		line-height: 1.02 !important;
		letter-spacing: -.035em !important;
		text-wrap: balance !important;
	}

	.ct-v19-page-hero-copy > p:last-child,
	.ct-v19-contact-hero-copy > p:last-child {
		max-width: 100% !important;
		font-size: .94rem !important;
		line-height: 1.65 !important;
	}

	/*
	 * Image becomes its own lower hero panel.
	 * This prevents text and photo from competing on narrow screens.
	 */
	.ct-v19-page-hero-media,
	.ct-v19-contact-hero-media {
		position: relative !important;
		inset: auto !important;
		width: 100% !important;
		height: 285px !important;
		margin: 0 !important;
	}

	.ct-v19-page-hero-media img,
	.ct-v19-contact-hero-media img {
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
		object-position: center !important;
	}

	.ct-v19-page-hero-media::after,
	.ct-v19-contact-hero-media::after {
		background:
			linear-gradient(180deg, #07070c 0%, rgba(7,7,12,.38) 13%, transparent 30%),
			linear-gradient(0deg, #07070c 0%, rgba(7,7,12,.12) 23%, transparent 45%) !important;
	}

	/* ABOUT */
	.ct-v19-about-intro,
	.ct-v19-values,
	.ct-v19-ecosystem,
	.ct-v19-about-cta {
		overflow: hidden !important;
	}

	.ct-v19-about-intro {
		padding: 62px 0 !important;
	}

	.ct-v19-about-intro-grid {
		grid-template-columns: minmax(0,1fr) !important;
		gap: 24px !important;
	}

	.ct-v19-about-intro h2,
	.ct-v19-section-head h2,
	.ct-v19-ecosystem-copy h2,
	.ct-v19-about-cta h2 {
		font-size: clamp(2rem, 9vw, 2.65rem) !important;
		line-height: 1.08 !important;
		text-wrap: balance !important;
	}

	.ct-v19-rich-copy p,
	.ct-v19-ecosystem-copy > p:not(.ct-v13-eyebrow),
	.ct-v19-about-cta p:not(.ct-v13-eyebrow) {
		font-size: .92rem !important;
		line-height: 1.7 !important;
	}

	.ct-v19-values {
		padding: 62px 0 !important;
	}

	.ct-v19-section-head {
		margin-bottom: 30px !important;
	}

	.ct-v19-values-grid {
		grid-template-columns: minmax(0,1fr) !important;
		gap: 12px !important;
	}

	.ct-v19-values-grid article {
		min-height: 0 !important;
		padding: 23px 20px !important;
	}

	.ct-v19-values-grid h3 {
		margin-top: 19px !important;
		font-size: 1.35rem !important;
	}

	.ct-v19-values-grid p {
		font-size: .82rem !important;
	}

	.ct-v19-ecosystem {
		padding: 34px 0 64px !important;
	}

	.ct-v19-ecosystem-card {
		grid-template-columns: minmax(0,1fr) !important;
		gap: 32px !important;
		padding: 27px 19px !important;
	}

	.ct-v19-ecosystem-actions {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 14px !important;
	}

	.ct-v19-ecosystem-actions .ct-v13-btn {
		width: 100% !important;
		min-height: 46px !important;
	}

	.ct-v19-ecosystem-actions .ct-v13-text-link {
		justify-self: start !important;
	}

	.ct-v19-ecosystem-visual {
		grid-template-columns: minmax(0,1fr) !important;
	}

	.ct-v19-project-card {
		min-height: 145px !important;
	}

	.ct-v19-about-cta {
		padding: 48px 0 !important;
	}

	.ct-v19-about-cta-inner {
		display: grid !important;
		grid-template-columns: minmax(0,1fr) !important;
		gap: 22px !important;
	}

	.ct-v19-about-cta .ct-v13-btn {
		width: 100% !important;
		min-height: 46px !important;
	}

	/* CONTACT */
	.ct-v19-contact-main {
		padding: 62px 0 68px !important;
	}

	.ct-v19-contact-grid {
		grid-template-columns: minmax(0,1fr) !important;
		gap: 26px !important;
	}

	.ct-v19-contact-aside {
		grid-template-columns: minmax(0,1fr) !important;
		gap: 10px !important;
	}

	.ct-v19-contact-card {
		padding: 20px 18px !important;
	}

	.ct-v19-contact-card h2 {
		font-size: 1.22rem !important;
	}

	.ct-v19-contact-direct {
		grid-column: 1 !important;
		margin-top: 2px !important;
	}

	.ct-v19-contact-form-wrap {
		width: 100% !important;
		max-width: 100% !important;
		padding: 24px 17px !important;
		box-sizing: border-box !important;
	}

	.ct-v19-contact-form-wrap h2 {
		font-size: 2rem !important;
	}

	.ct-v19-form-row {
		grid-template-columns: minmax(0,1fr) !important;
		gap: 17px !important;
	}

	.ct-v19-contact-form input,
	.ct-v19-contact-form select,
	.ct-v19-contact-form textarea {
		max-width: 100% !important;
		font-size: 16px !important; /* prevents iOS input zoom */
	}

	.ct-v19-contact-form textarea {
		min-height: 160px !important;
	}

	.ct-v19-form-footer {
		display: grid !important;
		grid-template-columns: minmax(0,1fr) !important;
		gap: 17px !important;
	}

	.ct-v19-submit {
		width: 100% !important;
		min-height: 50px !important;
	}

	.ct-v19-contact-bottom {
		padding: 46px 0 !important;
	}

	.ct-v19-contact-bottom-inner {
		display: grid !important;
		grid-template-columns: minmax(0,1fr) !important;
		gap: 22px !important;
	}

	.ct-v19-contact-links {
		display: grid !important;
		grid-template-columns: minmax(0,1fr) !important;
		gap: 8px !important;
	}

	.ct-v19-contact-links a {
		width: 100% !important;
		min-height: 44px !important;
		box-sizing: border-box !important;
	}
}

/* ------------------------------
   SMALL PHONE
   ------------------------------ */

@media (max-width: 420px) {
	.ct-v19-page-hero-inner,
	.ct-v19-contact-hero > .ct-container {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	.ct-v19-page-hero-copy,
	.ct-v19-contact-hero-copy {
		padding-top: 38px !important;
		padding-bottom: 28px !important;
	}

	.ct-v19-page-hero-copy h1,
	.ct-v19-contact-hero-copy h1 {
		font-size: clamp(2.45rem, 11.8vw, 3.05rem) !important;
	}

	.ct-v19-page-hero-media,
	.ct-v19-contact-hero-media {
		height: 245px !important;
	}

	.ct-v19-contact-form-wrap {
		padding: 21px 14px !important;
	}
}