/*!
 * Theme Name: HTML5 Blank
 * Theme URI: http://html5blank.com
 * Description: HTML5 Blank WordPress Starter Theme
 * Version: 1.5.1
 * Author: Robert DeVore
 * Author URI: http://robertdevore.com
 * Tags: HTML5, CSS3, starter, framework
 *
 * License: MIT
 * License URI: http://opensource.org/licenses/mit-license.php
 */

/*
 * Custom component CSS (not Tailwind).
 * Tailwind utilities live in the Alcastromol plugin stylesheet.
 */

.amerike-input,
.wpcf7-form-control.amerike-input {
	width: 100%;
	height: 40px;
	border-radius: 10px;
	border: 1px solid #353535;
	background-color: #111111;
	padding: 0 12px;
	color: #fff;
	font-size: 14px;
	outline: none;
}

select.amerike-input {
	appearance: none;
	padding-right: 36px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' fill='none'%3E%3Cpath d='M3.3 5.4 7.5 9.6 11.7 5.4' stroke='%23fff' stroke-linecap='square'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
}

textarea.amerike-input,
textarea.wpcf7-form-control.amerike-input {
	height: auto;
	min-height: 140px;
	padding-top: 12px;
}

.amerike-input.border-0 {
	border: 0;
	background-color: transparent;
}

.wpcf7-form-control-wrap {
	display: block;
}

.flex > .wpcf7-form-control-wrap {
	flex: 1;
	min-width: 0;
}

.wpcf7-not-valid-tip {
	margin-top: 4px;
	color: #ff6a14;
	font-size: 12px;
}

.wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}

html.menu-open {
	overflow: hidden;
}

.site-nav-sub {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 30;
	padding-top: 12px;
	visibility: hidden;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.site-nav-item-end .site-nav-sub {
	right: 0;
	left: auto;
}

.site-nav-item:hover .site-nav-sub,
.site-nav-item:focus-within .site-nav-sub,
.site-nav-item.is-open .site-nav-sub {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

.site-backdrop {
	position: fixed;
	inset: 0;
	z-index: 45;
	background: rgba(0, 0, 0, 0.55);
}

.site-backdrop[hidden] {
	display: none;
}

.site-drawer {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 50;
	display: flex;
	flex-direction: column;
	width: min(440px, 100%);
	height: 100dvh;
	overflow-y: auto;
	background: #111;
	padding: 28px 28px 48px;
	transform: translateX(100%);
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-drawer.is-open {
	transform: translateX(0);
}

@media (max-width: 1119px) {
	.site-nav,
	.site-cta {
		display: none !important;
	}

	.site-drawer {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-drawer,
	.site-nav-sub,
	.hover-card-tilt,
	.hover-card-tilt::before {
		transition: none;
	}

	.hover-card:hover .hover-card-tilt {
		--lift: 0px;
	}
}

html.amerike-loading main h2,
html.amerike-loading main article,
html.amerike-loading #contacto-card {
	opacity: 0;
}

.hover-card {
	position: relative;
	z-index: 0;
	perspective: 900px;
}

.hover-card:hover {
	z-index: 3;
}

.hover-card-tilt {
	position: relative;
	overflow: hidden;
	transform: translateY(var(--lift, 0px)) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.4s ease;
}

.hover-card:hover .hover-card-tilt {
	--lift: -8px;
	border-color: #6f5091;
}

.hover-card-tilt::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 4;
	border-radius: inherit;
	pointer-events: none;
	background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(176, 130, 230, 0.38), transparent 58%);
	opacity: 0;
	transition: opacity 0.4s ease;
}

.hover-card:hover .hover-card-tilt::before {
	opacity: 1;
}

#program-viewport {
	padding-top: 16px;
	padding-bottom: 20px;
}

.program-pin-sticky {
	padding-top: 4rem;
	padding-bottom: 6rem;
}

.program-pin.is-scroll-linked .program-pin-sticky {
	position: sticky;
	top: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
	height: 100vh;
	height: 100dvh;
	overflow: hidden;
	padding-top: 8.5rem;
	padding-bottom: 2.5rem;
}

.program-pin.is-scroll-linked #program-viewport {
	overflow: hidden;
	scroll-behavior: auto;
	touch-action: pan-y;
}

@media (max-width: 767px) {
	.program-pin-sticky {
		padding-top: 2.5rem;
		padding-bottom: 4rem;
	}

	.program-pin.is-scroll-linked .program-pin-sticky {
		padding-top: 6.5rem;
		padding-bottom: 1.5rem;
	}
}

@media (max-height: 820px) {
	.program-pin.is-scroll-linked .program-pin-sticky {
		padding-top: 6.5rem;
		padding-bottom: 1.25rem;
	}
}

#programas {
	position: relative;
	z-index: 2;
}

#campus.campus-band {
	z-index: 1;
	margin-top: -380px;
	padding-top: 380px;
}

#por-que {
	position: relative;
	z-index: 2;
}

.reason-accordion {
	position: relative;
}

.reason-card {
	position: absolute;
	box-sizing: border-box;
	width: 33.175%;
	padding: 60px 30px 24px;
	will-change: transform;
}

.reason-card-1 {
	top: 0;
	left: 0;
	height: 100%;
	padding-top: 65px;
	background: #191919;
	border-radius: 30px 0 0 30px;
}

.reason-card-2 {
	top: 5px;
	left: 33.175%;
	height: calc(100% - 10px);
	background: #111111;
	border-radius: 25px;
}

.reason-card-3 {
	top: 5px;
	left: 66.351%;
	height: calc(100% - 10px);
	background: #090909;
	border-radius: 25px;
}

.admission-rail {
	position: relative;
	height: 68px;
}

.admission-rail-line {
	position: absolute;
	top: 59px;
	left: 50%;
	width: 100vw;
	height: 2px;
	transform: translateX(-50%);
	background: #222;
}

.admission-node {
	position: relative;
	height: 100%;
}

.admission-node::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 2px;
	height: 60px;
	transform: translateX(-50%);
	background: #222;
}

.admission-rail-track {
	position: relative;
}

.admission-rail-fill {
	position: absolute;
	z-index: 1;
	top: 59px;
	left: 12.5%;
	right: 12.5%;
	height: 2px;
	transform: scaleX(0);
	transform-origin: left center;
	background: linear-gradient(90deg, #6f5091 0%, #b388d6 55%, #ead6ff 100%);
}

.admission-node::before {
	background: linear-gradient(#c9a6ef, #6f5091) 0 0 / 100% calc(var(--lit, 0) * 100%) no-repeat, #222;
}

.admission-node::after {
	content: "";
	position: absolute;
	z-index: 2;
	top: 51.5px;
	left: 50%;
	box-sizing: border-box;
	width: 16px;
	height: 16px;
	transform: translateX(-50%);
	border: 1px solid color-mix(in srgb, #ead6ff calc(var(--lit, 0) * 100%), #222);
	border-radius: 50%;
	background: color-mix(in srgb, #6f5091 calc(var(--lit, 0) * 100%), #151515);
	box-shadow: 0 0 calc(var(--lit, 0) * 16px) rgba(176, 130, 230, calc(var(--lit, 0) * 0.85));
}

.passion-bg {
	position: absolute;
	z-index: 0;
	left: 0;
	right: 0;
	top: -8%;
	bottom: -18%;
	overflow: hidden;
	pointer-events: none;
	background-color: #111;
	background-image: linear-gradient(90deg, rgba(198, 255, 74, 0.16) 0%, rgba(22, 140, 72, 0.42) 34%, rgba(10, 78, 42, 0.28) 50%, rgba(22, 140, 72, 0.42) 66%, rgba(176, 255, 120, 0.16) 100%);
	-webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 74%, transparent 100%);
	mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 74%, transparent 100%);
}

.passion-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background-image: url("assets/campus-grain.png");
	background-repeat: repeat;
	background-size: 240px 240px;
	opacity: 0.5;
	mix-blend-mode: overlay;
}

.passion-flame {
	position: absolute;
	filter: blur(18px);
	will-change: transform;
}

.passion-flame i {
	display: block;
	width: 100%;
	height: 100%;
}

.passion-flame-l1 {
	left: -8%;
	top: 8%;
	width: 64%;
	height: 84%;
}

.passion-flame-l1 i {
	background: linear-gradient(90deg, rgba(210, 255, 90, 0.96) 0%, rgba(86, 214, 104, 0.72) 30%, rgba(14, 122, 62, 0.38) 68%, transparent 100%);
	clip-path: polygon(0% 4%, 100% 34%, 100% 66%, 0% 96%);
}

.passion-flame-l2 {
	left: -4%;
	top: 22%;
	width: 48%;
	height: 56%;
}

.passion-flame-l2 i {
	background: linear-gradient(90deg, rgba(232, 255, 150, 0.9) 0%, rgba(46, 190, 96, 0.5) 55%, transparent 100%);
	clip-path: polygon(0% 18%, 100% 42%, 100% 58%, 0% 82%);
}

.passion-flame-l3 {
	left: 0;
	top: 34%;
	width: 36%;
	height: 32%;
}

.passion-flame-l3 i {
	background: linear-gradient(90deg, rgba(190, 255, 110, 0.75) 0%, transparent 100%);
	clip-path: polygon(0% 8%, 100% 40%, 100% 60%, 0% 92%);
}

.passion-flame-r1 {
	right: -8%;
	top: 8%;
	width: 64%;
	height: 84%;
}

.passion-flame-r1 i {
	background: linear-gradient(270deg, rgba(198, 255, 130, 0.96) 0%, rgba(64, 206, 120, 0.7) 30%, rgba(12, 116, 64, 0.38) 68%, transparent 100%);
	clip-path: polygon(100% 4%, 0% 34%, 0% 66%, 100% 96%);
}

.passion-flame-r2 {
	right: -4%;
	top: 22%;
	width: 48%;
	height: 56%;
}

.passion-flame-r2 i {
	background: linear-gradient(270deg, rgba(220, 255, 180, 0.88) 0%, rgba(40, 180, 100, 0.48) 55%, transparent 100%);
	clip-path: polygon(100% 18%, 0% 42%, 0% 58%, 100% 82%);
}

.passion-flame-r3 {
	right: 0;
	top: 34%;
	width: 36%;
	height: 32%;
}

.passion-flame-r3 i {
	background: linear-gradient(270deg, rgba(176, 255, 140, 0.72) 0%, transparent 100%);
	clip-path: polygon(100% 8%, 0% 40%, 0% 60%, 100% 92%);
}

.footer-bg {
	position: absolute;
	z-index: 0;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	background: linear-gradient(90deg, #2e146c 0%, #5a2496 46%, #c17ee6 100%);
}

.footer-bg::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(180deg, #000 0%, #000 36%, rgba(0, 0, 0, 0.72) 54%, rgba(0, 0, 0, 0) 78%);
}

.footer-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background-image: url("assets/campus-grain.png");
	background-repeat: repeat;
	background-size: 240px 240px;
	opacity: 0.45;
	mix-blend-mode: overlay;
	-webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 36%, #000 72%);
	mask-image: linear-gradient(180deg, transparent 0%, transparent 36%, #000 72%);
}

.footer-glow {
	position: absolute;
	border-radius: 50%;
	filter: blur(48px);
	will-change: transform;
}

.footer-glow-l {
	left: -10%;
	bottom: -36%;
	width: 58%;
	height: 72%;
	background: radial-gradient(circle, rgba(62, 24, 150, 0.55) 0%, transparent 70%);
}

.footer-glow-c {
	left: 18%;
	bottom: -42%;
	width: 64%;
	height: 78%;
	background: radial-gradient(circle, rgba(110, 42, 180, 0.42) 0%, transparent 72%);
}

@media (max-width: 767px) {
	.footer-groups {
		gap: 0;
	}

	.footer-acc-summary {
		list-style: none;
	}

	.footer-acc-summary::-webkit-details-marker,
	.footer-acc-summary::marker {
		display: none;
		content: "";
	}

	.footer-acc-item > ul {
		display: none;
	}

	.footer-acc-item[open] > ul {
		display: block;
		padding: 0 0 14px;
	}

	.footer-acc-summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		margin: 0;
		padding: 16px 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.12);
		pointer-events: auto;
		cursor: pointer;
	}

	.footer-acc-summary h2 {
		margin: 0;
	}

	.footer-acc-summary svg {
		display: block;
		flex: none;
		transition: transform 0.25s ease;
	}

	.footer-acc-item[open] .footer-acc-summary svg {
		transform: rotate(180deg);
	}
}

.footer-glow-r {
	right: -8%;
	bottom: -32%;
	width: 54%;
	height: 70%;
	background: radial-gradient(circle, rgba(198, 132, 230, 0.5) 0%, transparent 70%);
}

@media (max-width: 767px) {
	.reason-card,
	.reason-card-1,
	.reason-card-2,
	.reason-card-3 {
		position: relative;
		top: auto;
		left: auto;
		width: auto;
		height: auto;
		border-radius: 0;
	}

	.reason-card-2,
	.reason-card-3 {
		margin: 5px;
	}
}

.campus-band-bg {
	position: absolute;
	z-index: 0;
	left: 0;
	right: 0;
	top: 0;
	bottom: -640px;
	overflow: hidden;
	pointer-events: none;
	background:
		radial-gradient(ellipse 88% 40% at 50% 26%, rgba(124, 42, 196, 0.78), transparent 68%),
		radial-gradient(ellipse 72% 36% at 14% 34%, rgba(198, 48, 214, 0.72), transparent 64%),
		radial-gradient(ellipse 62% 34% at 88% 40%, rgba(168, 36, 200, 0.68), transparent 62%),
		radial-gradient(ellipse 80% 28% at 50% 68%, rgba(120, 32, 176, 0.42), transparent 70%),
		linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #1c0c38 10%, #43166e 24%, #5b1d90 42%, #4a1878 70%, #2a1048 100%);
	-webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 84%, transparent 100%);
	mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 84%, transparent 100%);
}

.campus-band-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background-image: url("assets/campus-grain.png");
	background-repeat: repeat;
	background-size: 240px 240px;
	opacity: 0.5;
	mix-blend-mode: overlay;
}

.campus-lava-filter {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

.campus-lava {
	position: absolute;
	z-index: 1;
	inset: -12% -8%;
	opacity: 0.2;
	filter: url("#campus-lava-goo");
	pointer-events: none;
}

.campus-blob {
	position: absolute;
	left: var(--lava-x);
	top: var(--lava-y);
	width: var(--lava-size);
	height: var(--lava-size);
	border-radius: 50%;
	background: var(--lava-color);
	will-change: transform;
}

.campus-blob-1 { --lava-x: 2%; --lava-y: 12%; --lava-size: 440px; --lava-color: radial-gradient(circle at 35% 32%, #f5d0fe 0%, #e879f9 38%, #a21caf 100%); }
.campus-blob-2 { --lava-x: 18%; --lava-y: 28%; --lava-size: 320px; --lava-color: radial-gradient(circle at 40% 40%, #e9d5ff 0%, #c084fc 40%, #6b21a8 100%); }
.campus-blob-3 { --lava-x: 34%; --lava-y: 8%; --lava-size: 480px; --lava-color: radial-gradient(circle at 32% 36%, #fae8ff 0%, #d946ef 42%, #86198f 100%); }
.campus-blob-4 { --lava-x: 52%; --lava-y: 22%; --lava-size: 360px; --lava-color: radial-gradient(circle at 38% 34%, #f0abfc 0%, #c026d3 44%, #701a75 100%); }
.campus-blob-5 { --lava-x: 68%; --lava-y: 10%; --lava-size: 400px; --lava-color: radial-gradient(circle at 36% 30%, #ddd6fe 0%, #a78bfa 40%, #5b21b6 100%); }
.campus-blob-6 { --lava-x: 8%; --lava-y: 46%; --lava-size: 300px; --lava-color: radial-gradient(circle at 42% 38%, #f5d0fe 0%, #e040fb 46%, #7e22ce 100%); }
.campus-blob-7 { --lava-x: 36%; --lava-y: 50%; --lava-size: 420px; --lava-color: radial-gradient(circle at 34% 36%, #fae8ff 0%, #d946ef 40%, #6b21a8 100%); }
.campus-blob-8 { --lava-x: 64%; --lava-y: 44%; --lava-size: 340px; --lava-color: radial-gradient(circle at 40% 42%, #e9d5ff 0%, #8b5cf6 42%, #4c1d95 100%); }

#campus > :not(.campus-band-bg) {
	position: relative;
	z-index: 1;
}

@media (max-width: 767px) {
	.campus-blob {
		width: calc(var(--lava-size) * 0.55);
		height: calc(var(--lava-size) * 0.55);
	}
}

@media (max-width: 767px) {
	#campus.campus-band {
		margin-top: -180px;
		padding-top: 180px;
	}

	.campus-band-bg {
		bottom: -420px;
	}

	.campus-viewport {
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.campus-viewport::-webkit-scrollbar {
		display: none;
	}

	.campus-scroll.is-scroll-linked .campus-pin-sticky {
		position: sticky;
		top: 0;
		z-index: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		box-sizing: border-box;
		height: 100vh;
		height: 100dvh;
		overflow: hidden;
		padding-top: 5.5rem;
		padding-bottom: 1.5rem;
	}

	.campus-scroll.is-scroll-linked .campus-viewport {
		overflow: hidden;
		scroll-snap-type: none;
		touch-action: pan-y;
	}
}

@media (prefers-reduced-motion: reduce) {
	.animate-marquee,
	.animate-glow-drift {
		animation: none !important;
	}
}
