@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Quantico:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root {
	--page-w: 75.5rem;

	--fon-t: "Inter", sans-serif;
	--fon-h: "Quantico", sans-serif;

	--sca-t: 1rem;
	--sca-h: 1rem;
	--sca-lh: 1.2em;
	--sca-mar: 1rem;
	--sca-pad: 2.5rem;

	--ratio: .5;

	--fon-w1: 400;
	--fon-w5: 400;
	--fon-w7: 700;
	--fon-w9: 700;

	--col-dar: #000000;
	--col-dar-op25: #00000033;
	--col-bg: #FAF8F3;
	--col-lig: #00000011;
	--col-sep: #046380;
	--col-pri: #046380;
	--col-pri-op75: #046380BF;
	--col-pri-bg: #046380;
	--col-acc: #046380;
	--col-acc-bg: #046380;

	--col-red: #F03D3E;
	--col-gre: #007B40;

	--col-grad-v: linear-gradient(180deg, var(--col-dar) 0%, var(--col-pri) 100%);

	--rad-s: 0;
	--rad-m: 0;
	--rad-l: 0;
	--rad-bt: 0;

	--sha-s: none;
	--sha-m: none;
	--sha-l: none;
	--sha-i: inset 0 .125rem .25rem 0 var(--col-dar-op25);

	--ani-f: all 500ms cubic-bezier(.7,0,.3,1);
}

.bt,
.header .bt {
	padding-left: 2rem;
	padding-right: 2rem;
	clip-path: polygon(
    0% 50%, 1.5rem 0%, calc(100% - 1.5rem) 0%,
    100% 50%, calc(100% - 1.5rem) 100%, 1.5rem 100%
  );
}
.bt:hover {
	color: var(--col-bg)!important;
  	background: #1290b7!important;
  	box-shadow: none!important;
  	border-color: transparent!important;
}
picture,
h5.quote img {
	border-radius: 0;
	aspect-ratio: 1 / 1.1481;
	object-fit: cover;
	clip-path: polygon(
    50% 0%,
    100% 25%,
    100% 75%,
    50% 100%,
    0% 75%,
    0% 25%
  );
}
.header {
	font-family: var(--fon-h);
	background: var(--col-dar);
	color: var(--col-bg);
}
.branding img {
	height: calc(var(--sca-t) * 5);
    margin: calc(var(--sca-t) * -.5) 0;
}
.header ul {
	margin-top: calc(var(--sca-t) * 1);
}
.header ul li {
    line-height: calc(var(--sca-t) * 2);
}
.section.featured {
    margin-top: calc(var(--sca-pad) + calc(var(--sca-t) * 4));
    height: calc(100vh - calc(var(--sca-pad) + calc(var(--sca-t) * 4)));
    position: relative;
}
.section.featured:after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background-color: #00000033;
    background-image: url("data:image/svg+xml,%3Csvg width='1992' height='1468' viewBox='0 0 1992 1468' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1990.63 649.021V330.871L1715.1 171.791L1439.57 330.871V649.021L1715.1 808.091L1990.63 649.021Z' stroke='white' stroke-miterlimit='10'/%3E%3Cpath d='M1741.54 1308.1V989.951L1466.01 830.881L1190.48 989.951V1308.1L1466.01 1467.18L1741.54 1308.1Z' stroke='white' stroke-miterlimit='10'/%3E%3Cpath d='M636.8 477.8V159.65L361.27 0.580078L85.7402 159.65V477.8L361.27 636.88L636.8 477.8Z' stroke='white' stroke-miterlimit='10'/%3E%3Cpath d='M551.55 1225.02V906.871L276.03 747.791L0.5 906.871V1225.02L276.03 1384.09L551.55 1225.02Z' stroke='white' stroke-miterlimit='10'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 150% auto;
}
.featured .content {
    top: calc(calc(100vh - calc(var(--sca-pad) + calc(var(--sca-t) * 8))) / 2);
    transform: translateY(-50%);
    padding-bottom: 0;
    position: relative;
    z-index: 9;
}
.featured .content h1 {
	font-style: italic;
	font-weight: normal;
	font-size: 4vw;
	position: relative;
	padding-bottom: 1rem;
	display: inline-block;
}
.featured .content h1:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	border-bottom: solid 1px var(--col-pri);
	border-right: solid 2px var(--col-pri);
	width: calc(100% - 1.5rem);
	height: 1.5rem;
	transform: skewX(-60deg);
	transform-origin: 0 100%;
}
.featured .content h1 strong {
	display: block;
	font-size: 1.375em;
}
strong {
	font-style: normal;
}
.main h2 {
	font-weight: normal;
	font-style: italic;
	color: var(--col-pri);
}

#empresa {
	padding-top: 0;
	padding-bottom: 0;
	position: relative;
	z-index: 999;
}
#empresa:before {
	content: '';
	position: absolute;
	right: 50%;
	bottom: 100%;
	height: 10vh;
	width: 50vw;
	transform: skewX(60deg);
	transform-origin: 100% 100%;
	background: var(--col-pri-bg);
}
#empresa:after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -1px;
	height: 10vh;
	width: 50vw;
	transform: skewX(-60deg);
	transform-origin: 0 100%;
	background: var(--col-bg);
}
#empresa picture {
	margin-top: -4rem;
	position: relative;
	z-index: 9;
	box-shadow: 1rem 1rem 1rem 1rem rgba(0,0,0,1);
}

#servicios,
#testimonios,
#consultas {
	background-image: url("data:image/svg+xml,%3Csvg width='37' height='38' viewBox='0 0 37 38' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.5898 24.2674L17.0998 22.7774H14.9998V20.6774L13.5098 19.1874L14.9998 17.6974V15.5974H17.0998L18.5898 14.1074L20.0798 15.5974H22.1798V17.6974L23.6698 19.1874L22.1798 20.6774V22.7774H20.0798L18.5898 24.2674ZM15.7498 22.0374H17.4198L18.5998 23.2174L19.7798 22.0374H21.4498V20.3674L22.6298 19.1874L21.4498 18.0074V16.3374H19.7798L18.5998 15.1574L17.4198 16.3374H15.7498V18.0074L14.5698 19.1874L15.7498 20.3674V22.0374Z' fill='%23ffffffbb'/%3E%3Cpath d='M18.9705 6.36914H18.2305V14.7291H18.9705V6.36914Z' fill='%23ffffffbb'/%3E%3Cpath d='M18.6001 7.03828L14.6201 1.15828L15.2301 0.738281L18.6001 5.70828L21.9401 0.738281L22.5601 1.15828L18.6001 7.03828Z' fill='%23ffffffbb'/%3E%3Cpath d='M18.6001 13.2275L14.6201 7.3575L15.2301 6.9375L18.6001 11.9075L21.9401 6.9375L22.5601 7.3575L18.6001 13.2275Z' fill='%23ffffffbb'/%3E%3Cpath d='M18.95 23.7188H18.21V31.8887H18.95V23.7188Z' fill='%23ffffffbb'/%3E%3Cpath d='M21.9401 37.5187L18.5801 32.5487L15.2301 37.5187L14.6201 37.0988L18.5801 31.2188L22.5601 37.0988L21.9401 37.5187Z' fill='%23ffffffbb'/%3E%3Cpath d='M21.9401 31.3173L18.5801 26.3473L15.2301 31.3173L14.6201 30.8973L18.5801 25.0273L22.5601 30.8973L21.9401 31.3173Z' fill='%23ffffffbb'/%3E%3Cpath d='M14.1901 18.748H5.83008V19.488H14.1901V18.748Z' fill='%23ffffffbb'/%3E%3Cpath d='M0.620195 23.0982L0.200195 22.4882L5.17019 19.1182L0.200195 15.7682L0.620195 15.1582L6.49019 19.1182L0.620195 23.0982Z' fill='%23ffffffbb'/%3E%3Cpath d='M6.81039 23.0982L6.40039 22.4882L11.3604 19.1182L6.40039 15.7682L6.81039 15.1582L12.6904 19.1182L6.81039 23.0982Z' fill='%23ffffffbb'/%3E%3Cpath d='M31.3399 18.7676H23.1699V19.5076H31.3399V18.7676Z' fill='%23ffffffbb'/%3E%3Cpath d='M36.5607 23.0982L30.6807 19.1382L36.5607 15.1582L36.9807 15.7682L32.0107 19.1382L36.9707 22.4782L36.5607 23.0982Z' fill='%23ffffffbb'/%3E%3Cpath d='M30.3602 23.0982L24.4902 19.1382L30.3602 15.1582L30.7802 15.7682L25.8102 19.1382L30.7802 22.4782L30.3602 23.0982Z' fill='%23ffffffbb'/%3E%3Cpath d='M9.83674 9.83807L9.31348 10.3613L15.2249 16.2727L15.7481 15.7495L9.83674 9.83807Z' fill='%23ffffffbb'/%3E%3Cpath d='M10.0403 10.5674L3.07031 9.22742L3.21031 8.49742L9.10031 9.62742L7.96031 3.75742L8.69031 3.60742L10.0403 10.5674Z' fill='%23ffffffbb'/%3E%3Cpath d='M14.43 14.948L7.45996 13.608L7.59996 12.878L13.49 14.018L12.34 8.13805L13.07 7.99805L14.43 14.948Z' fill='%23ffffffbb'/%3E%3Cpath d='M22.0867 22.1213L21.5635 22.6445L27.3405 28.4216L27.8638 27.8983L22.0867 22.1213Z' fill='%23ffffffbb'/%3E%3Cpath d='M28.4899 34.6475L27.1299 27.6875L34.0999 29.0275L33.9599 29.7575L28.0699 28.6275L29.2199 34.4975L28.4899 34.6475Z' fill='%23ffffffbb'/%3E%3Cpath d='M24.11 30.2586L22.75 23.3086L29.72 24.6486L29.58 25.3786L23.69 24.2386L24.84 30.1186L24.11 30.2586Z' fill='%23ffffffbb'/%3E%3Cpath d='M15.2151 21.9714L9.30371 27.8828L9.82697 28.4061L15.7384 22.4947L15.2151 21.9714Z' fill='%23ffffffbb'/%3E%3Cpath d='M8.69031 34.638L7.96031 34.498L9.09031 28.608L3.21031 29.758L3.07031 29.028L10.0303 27.668L8.69031 34.638Z' fill='%23ffffffbb'/%3E%3Cpath d='M13.0702 30.2591L12.3402 30.1191L13.4702 24.2291L7.60019 25.3791L7.4502 24.6491L14.4102 23.2891L13.0702 30.2591Z' fill='%23ffffffbb'/%3E%3Cpath d='M27.3484 9.84794L21.5713 15.625L22.0945 16.1483L27.8716 10.3712L27.3484 9.84794Z' fill='%23ffffffbb'/%3E%3Cpath d='M27.1504 10.5774L28.4904 3.60742L29.2204 3.74742L28.0804 9.63742L33.9604 8.49742L34.1004 9.22742L27.1504 10.5774Z' fill='%23ffffffbb'/%3E%3Cpath d='M22.7705 14.968L24.1105 7.99805L24.8405 8.13805L23.7005 14.028L29.5805 12.878L29.7205 13.608L22.7705 14.968Z' fill='%23ffffffbb'/%3E%3C/svg%3E%0A");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 120% auto;
	background-attachment: fixed;
}
#servicios h3 {
	max-width: 8em;
	margin-left: auto;
	margin-right: auto;
	text-wrap: balance;
	font-weight: normal;
	color: var(--col-pri);
}

picture.video {
	position: relative;
}
picture.video a {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50% , -50%);
	width: 4.125rem;
	height: 4.75rem;
	background-image: url("data:image/svg+xml,%3Csvg width='66' height='76' viewBox='0 0 66 76' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M65 36.2679C66.3333 37.0377 66.3333 38.9623 65 39.7321L3.5 75.2391C2.16666 76.0089 0.499996 75.0466 0.499996 73.507L0.5 2.49296C0.5 0.953356 2.16667 -0.00889423 3.5 0.760906L65 36.2679Z' fill='%23046380' /%3E%3C/svg%3E%0A");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	opacity: .7;
	transition: var(--ani-f);
}
picture.video a:hover {
	opacity: 1;
}
.main picture.video img:first-child {
	display: block;
	width: auto;
}

#instagram h3 {
	font-weight: normal;
	font-style: italic;
}

.card + h5.quote:before {
	background: none;
	border: solid 1rem var(--col-pri);
	border-top-width: .5rem;
	border-bottom-width: .5rem;
	border-left-color: transparent;
	border-bottom-color: transparent;
	mask: none;
	width: 0;
	height: 0;
	-webkit-mask: none;
}
.card + h5.quote:after {
	display: none;
}
h5.quote span {
	line-height: 1em;
}

#consultas iframe {
	margin-bottom: calc(var(--sca-pad)*4);
}

.field input, 
.field select, 
.field textarea {
	border: none;
	background: #fff;
}

.footer {
	background-color: var(--col-pri-bg);
	color: var(--col-bg);
}
.footer .azuite {
	color: inherit;
	opacity: .5;
}

@media (max-width:960px) {
	.page {
		padding: 0 var(--sca-pad);
	}
	.header nav {
		border: none;
		background: #000000cc;
		backdrop-filter: blur(1rem);
	}
	.section.featured {
	    margin-top: calc(var(--sca-pad) + calc(var(--sca-t) * 3));
	}
	.featured .content h1 {
		font-size: 8vw;
	}
	#empresa {
		padding-top: calc(var(--sca-pad)*3);
	}
	#empresa picture {
		margin-top: 0;
		margin-bottom: -1rem!important;
	}
	#servicios picture.video {
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}
}

.modal {
	width: auto;
}
