/* ==========================================================================
   Pagina de detalle de Servicio (/servicio/nombre-del-servicio/)
   Mismo lenguaje visual que el carrusel: navy/azul, titulos delgados en
   mayuscula, secciones a ancho completo, hero de dos columnas
   imagen/texto, y el panel de contacto que cierra todas las paginas.
   ========================================================================== */

.scc-service-page {
	--navy: #031b4e;
	--blue: #3368c6;
	--blue-light: #7fa3e0;
	--grey-bg: #f6faff;
	--grey-text: #6d7889;
	font-family: inherit;
	padding: 50px 0 0;
}
.scc-service-page *,
.scc-service-page *::before,
.scc-service-page *::after { box-sizing: border-box; }
.scc-service-page img { max-width: 100%; display: block; }

.scc-service-container {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 48px;
}
.scc-full-bleed {
	position: relative;
	width: 100vw;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	background: var(--grey-bg);
	padding: 64px 0;
	margin-top: 50px;
}
.scc-full-bleed-inner {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 48px;
}
.scc-service-closing {
	max-width: 1220px;
	margin: 56px auto 0;
	padding: 0 48px;
}
.scc-service-closing-panel {
	background: var(--blue);
	color: #fff;
	padding: 54px 64px;
	text-align: center;
}
.scc-service-closing-panel .scc-service-text {
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	max-width: 760px;
	margin: 0 auto 14px;
	text-align: justify;
}
.scc-service-closing-panel .scc-service-text:last-child { margin-bottom: 0; }

.scc-service-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .3px;
	text-transform: uppercase;
	color: var(--navy);
	text-decoration: none;
	margin-bottom: 10px;
}
.scc-service-back svg {
	width: 16px;
	height: 16px;
	transition: transform .2s ease;
}
.scc-service-back:hover {
	color: var(--blue);
}
.scc-service-back:hover svg {
	transform: translateX(-3px);
}

.scc-image-frame {
	background: #fff;
	border: 1px solid #e7edf6;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.scc-image-frame img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.scc-service-hero {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	gap: 56px;
	align-items: center;
}
.scc-service-hero-image {
	height: 340px;
}
.scc-service-hero-text { padding: 4px 0; }

.scc-service-hero.scc-hero-fill {
	grid-template-columns: .9fr 1.1fr;
}
.scc-hero-fill .scc-service-hero-image {
	height: 400px;
}
.scc-image-frame.scc-fill {
	border: none;
}
.scc-image-frame.scc-fill img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.scc-service-hero-stacked-image {
	height: 460px;
	margin-bottom: 30px;
}
.scc-service-hero-stacked-text .scc-service-text:last-child { margin-bottom: 0; }

.scc-service-hero.scc-hero-first-only {
	align-items: stretch;
}
.scc-hero-first-only .scc-service-hero-image {
	height: 100%;
	min-height: 240px;
}
.scc-hero-first-only .scc-service-hero-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.scc-hero-first-only .scc-service-hero-text .scc-service-text {
	margin-bottom: 0;
}
.scc-service-hero-extra {
	margin-top: 26px;
}
.scc-service-hero-extra .scc-service-text:last-child { margin-bottom: 0; }

.scc-materials-heading {
	font-size: 42px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .3px;
	color: var(--navy);
	text-align: center;
	margin: 0 0 40px;
}

.scc-service-section-label {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .7px;
	text-transform: uppercase;
	color: var(--blue);
	margin: 0 0 26px;
}
.scc-service-section-label .dot {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--blue);
	flex: none;
}
.scc-tags-label { margin-top: 40px; }

.scc-service-text {
	font-size: 15px;
	line-height: 1.85;
	color: var(--grey-text);
	margin: 0 0 18px;
}
.scc-service-text:last-child { margin-bottom: 0; }
.scc-service-text.scc-lede {
	font-size: 16px;
	font-weight: 500;
	color: var(--navy);
	line-height: 1.65;
	margin-bottom: 20px;
	text-align: left;
}

.scc-service-contact-btn-wrap {
	display: flex;
	justify-content: flex-start;
	margin-top: 22px;
}
.scc-service-contact-btn {
	display: inline-flex;
	align-items: center;
	background: var(--blue);
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .3px;
	text-transform: uppercase;
	padding: 12px 26px;
	transition: background .25s ease;
}
.scc-service-contact-btn:hover { background: var(--navy); color: #fff; }

.scc-grid-3 { grid-template-columns: repeat(2, 1fr); }

.scc-service-list-grid {
	display: grid;
	gap: 16px;
}
.scc-service-list-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	background: #fff;
	border: 1px solid #e7edf6;
	border-left: 3px solid var(--blue);
	padding: 16px 18px;
	font-size: 15px;
	line-height: 1.55;
	color: var(--navy);
}
.scc-check-ico {
	flex: none;
	width: 20px; height: 20px;
	margin-top: 1px;
	border-radius: 50%;
	background: var(--grey-bg);
	color: var(--blue);
	display: flex; align-items: center; justify-content: center;
}
.scc-check-ico svg { width: 11px; height: 11px; }

.scc-accordion-columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
}
.scc-accordion-col {
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.scc-accordion-item {
	background: #fff;
	box-shadow: 0 6px 18px rgba(3,27,78,.07);
}
.scc-accordion-header {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: #fff;
	color: var(--navy);
	border: none;
	cursor: pointer;
	text-align: left;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 14.5px;
	font-weight: 700;
	padding: 18px 22px;
	transition: background .2s ease, color .2s ease;
}
.scc-accordion-item.is-open .scc-accordion-header {
	background: var(--blue);
	color: #fff;
}
.scc-accordion-icon {
	position: relative;
	flex: none;
	width: 18px;
	font-size: 18px;
	font-weight: 400;
	line-height: 1;
	text-align: center;
}
.scc-accordion-icon .minus { display: none; }
.scc-accordion-item.is-open .scc-accordion-icon .plus { display: none; }
.scc-accordion-item.is-open .scc-accordion-icon .minus { display: inline; }

.scc-accordion-panel {
	height: 0;
	overflow: hidden;
	transition: height .28s ease;
	background: var(--grey-bg);
}
.scc-accordion-item.is-open .scc-accordion-panel {
	height: 220px;
}
.scc-accordion-panel-inner {
	height: 220px;
	overflow-y: auto;
}
.scc-accordion-desc {
	margin: 0;
	padding: 18px 22px;
	font-size: 15px;
	line-height: 1.75;
	color: var(--grey-text);
}

.scc-service-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.scc-tags-heading {
	margin-top: 46px;
}
.scc-service-tag {
	background: #fff;
	color: var(--navy);
	border: 1px solid #dbe6f5;
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap;
	padding: 10px 16px;
	border-radius: 20px;
	transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.scc-service-tag:hover {
	background: var(--blue);
	color: #fff;
	border-color: var(--blue);
}

.scc-materials-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 26px;
}
.scc-material-card {
	background: #fff;
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(3,27,78,.09);
	transition: transform .2s ease, box-shadow .2s ease;
}
.scc-material-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px rgba(3,27,78,.16);
}
.scc-material-card-title {
	background: var(--blue);
	color: #fff;
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 20px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .3px;
	padding: 16px 18px;
}
.scc-material-image-frame {
	height: 190px;
	border: none;
}
.scc-material-body { padding: 20px 22px 22px; }
.scc-material-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.scc-material-list li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--navy);
	margin-bottom: 10px;
}
.scc-material-list li:last-child { margin-bottom: 0; }
.scc-material-list .ico {
	flex: none;
	width: 18px; height: 18px;
	margin-top: 1px;
	border-radius: 50%;
	background: var(--grey-bg);
	color: var(--blue);
	display: flex; align-items: center; justify-content: center;
}
.scc-material-list .ico svg { width: 10px; height: 10px; }

@media (min-width: 641px) {
	.scc-grid-3 > *:last-child:nth-child(2n+1) {
		grid-column: 1 / -1;
	}
}

@media (max-width: 1020px) {
	.scc-materials-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
	.scc-service-hero { grid-template-columns: 1fr; gap: 28px; }
	.scc-service-hero-image { height: 280px; }
	.scc-hero-fill .scc-service-hero-image { height: 260px; }
	.scc-hero-first-only .scc-service-hero-image { height: 220px; min-height: 0; }
	.scc-accordion-columns { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.scc-service-container,
	.scc-full-bleed-inner,
	.scc-service-closing { padding: 0 22px; }
	.scc-service-closing-panel { padding: 36px 26px; }
	.scc-full-bleed { padding: 44px 0; }
	.scc-materials-heading { font-size: 28px; }
	.scc-service-list-grid,
	.scc-grid-3,
	.scc-materials-grid { grid-template-columns: 1fr; }
	.scc-material-image-frame { height: 150px; }
	.scc-accordion-header { padding: 15px 18px; font-size: 13.5px; }
}

.scc-service-cta { background: #fff; position: relative; }
.scc-service-cta-inner {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 60px;
}

.scc-service-cta-text { padding-top: 6px; }

.scc-service-cta-image-strip {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 420px;
	margin-top: 20px;
	overflow: hidden;
}
.scc-service-cta-image-strip img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scc-service-cta-panel {
	position: absolute;
	top: 0;
	right: 0;
	width: calc(50% - 30px);
	z-index: 3;
}

h2.scc-service-cta-heading {
	margin: 0 0 18px;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 300;
	font-size: 40px;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--navy);
	text-wrap: balance;
}
.scc-service-cta-heading strong { font-weight: 300; }

p.scc-service-cta-paragraph {
	margin: 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	text-transform: uppercase;
	color: var(--navy);
}

.scc-service-cta-panel {
	background: var(--blue);
	color: #fff;
	padding: 40px;
}
h3.scc-service-cta-panel-title {
	margin: 0 0 20px;
	font-size: 22px;
	font-weight: 700;
	color: #fff;
}

.scc-service-cta-form form { margin: 0; }
.scc-service-cta-form p { margin: 0 0 14px; }
.scc-service-cta-form .wpcf7-form-control {
	width: 100%;
	background: rgba(255, 255, 255, .16);
	border: 1px solid rgba(255, 255, 255, .3);
	color: #fff;
	font-size: 15px;
	padding: 13px 16px;
	box-sizing: border-box;
}
.scc-service-cta-form textarea.wpcf7-form-control { resize: vertical; min-height: 110px; }
.scc-service-cta-form .wpcf7-form-control::placeholder { color: rgba(255, 255, 255, .75); }
.scc-service-cta-form .wpcf7-form-control:focus { outline: none; border-color: #fff; background: rgba(255, 255, 255, .24); }
.scc-service-cta-form .wpcf7-submit {
	width: 100%;
	background: #fff;
	color: var(--blue);
	border: none;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .3px;
	text-transform: uppercase;
	padding: 14px 16px;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}
.scc-service-cta-form .wpcf7-submit:hover { background: var(--navy); color: #fff; }
.scc-service-cta-form .wpcf7-response-output { color: #fff; border-color: rgba(255,255,255,.4) !important; }

@media (max-width: 900px) {
	.scc-service-cta-image-strip { height: 300px; }
	h2.scc-service-cta-heading { font-size: 32px; }
}

@media (max-width: 780px) {
	.scc-service-cta-inner { grid-template-columns: 1fr; row-gap: 24px; }
	.scc-service-cta-panel {
		position: static;
		width: 100%;
		padding: 30px 26px;
	}
	.scc-service-cta-image-strip { height: 220px; margin-top: 24px; }
}

@media (max-width: 480px) {
	h2.scc-service-cta-heading { font-size: 26px; }
	p.scc-service-cta-paragraph { font-size: 15px; }
	.scc-service-cta-image-strip { height: 180px; }
}